:root{--ink:#183856;--ink-deep:#102b45;--ink-soft:#395a73;--muted:#6c8192;--line:#d8e8f1;--line-strong:#b9d7e8;--paper:#f7fcff;--paper-raised:#fff;--paper-deep:#e8f7ff;--soft:#eef8fd;--accent:#f66b3b;--accent-soft:#fff0e8;--cinnabar:#f66b3b;--jade:#38ae78;--success:#2d9b6b;--warning:#da8b1d;--sky:#75c9f5;--sky-soft:#dff5ff;--sun:#ffc857;--grass:#63c98a;--berry:#9a76d8;--radius:18px;--radius-lg:28px;--shadow:0 22px 55px #21597d26, 0 4px 12px #21597d14;--shadow-soft:0 14px 34px #21597d1c;--shadow-pop:0 14px 0 #255b7d14, 0 26px 48px #255b7d21;--header-height:78px;--font-display:"Avenir Next Rounded", "Nunito", "PingFang SC", "Hiragino Sans GB", sans-serif;--font-body:"Avenir Next", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;--font-mono:"SFMono-Regular", "Cascadia Mono", "Roboto Mono", Consolas, monospace;color:var(--ink);background:var(--paper);font-family:var(--font-body);font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--paper)}body{min-width:320px;color:var(--ink);background:radial-gradient(circle at 8% 12%, #fffffff2 0 5%, transparent 13%), radial-gradient(circle at 92% 6%, #ffffffd1 0 4%, transparent 12%), linear-gradient(180deg, #edfaff 0, #f8fcff 34rem, var(--paper) 65rem);-webkit-font-smoothing:antialiased;margin:0;line-height:1.65}body:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(at 16% 18%,#ffffffb8 0 5%,#0000 5.5%),radial-gradient(at 22% 17%,#ffffff94 0 4%,#0000 4.5%),radial-gradient(at 87% 30%,#ffffff8c 0 6%,#0000 6.5%);position:fixed;inset:0}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer;color:inherit}img,video{max-width:100%;display:block}::selection{background:var(--sun);color:var(--ink-deep)}.shell{width:min(1180px,100% - 48px);margin-inline:auto}.narrow{width:min(780px,100% - 48px);margin-inline:auto}.skip-link{z-index:120;background:var(--ink);color:#fff;border-radius:999px;padding:10px 15px;position:fixed;top:-70px;left:14px}.skip-link:focus{top:14px}:focus-visible{outline:3px solid var(--sun);outline-offset:4px}.site-header{z-index:50;height:var(--header-height);backdrop-filter:blur(20px)saturate(1.35);background:#f7fcffdb;border-bottom:1px solid #29668c1a;position:sticky;top:0;box-shadow:0 8px 30px #205a7e0f}.header-inner{min-height:var(--header-height);justify-content:space-between;align-items:center;gap:28px;display:flex}.brand{align-items:center;gap:12px;width:max-content;display:inline-flex}.brand-mark{background:linear-gradient(145deg,#91dcff,#fff4c2);border:3px solid #fff;border-radius:50%;flex:none;place-items:center;width:48px;height:48px;display:inline-grid;position:relative;overflow:hidden;box-shadow:0 6px 14px #21597d33,inset 0 1px 2px #fff}.brand-mark img{object-fit:cover;width:100%;height:100%;transform:scale(1.06)}.brand-copy{gap:0;display:grid}.brand-copy strong{font-family:var(--font-display);letter-spacing:-.02em;font-size:17px;font-weight:800;line-height:1.2}.brand-copy small{color:var(--muted);font:8px var(--font-mono);letter-spacing:.08em;text-transform:uppercase}.site-nav{background:#ffffffad;border:1px solid #4785aa1a;border-radius:999px;align-items:center;gap:7px;padding:6px;font-size:13px;font-weight:750;display:flex;box-shadow:inset 0 1px #fff}.site-nav>a:not(.github-link){color:var(--ink-soft);border-radius:999px;padding:9px 14px;transition:color .2s,background .2s,transform .2s;position:relative}.site-nav>a:hover,.site-nav>a[aria-current=page]{color:var(--ink);background:#fff;transform:translateY(-1px);box-shadow:0 5px 14px #21597d1a}.github-link{background:linear-gradient(145deg, #254b69, var(--ink-deep));color:#fff;border-radius:999px;align-items:center;gap:8px;min-height:39px;padding:0 15px;display:inline-flex;box-shadow:0 6px 14px #102b4533,inset 0 1px #ffffff29}.github-link span{color:#fff9;font:8px var(--font-mono);letter-spacing:.08em;text-transform:uppercase}.github-link b{font-size:11px}.site-footer{color:#ffffffad;background:linear-gradient(145deg,#183c5c,#102b45);border-top:0;margin-top:0;padding:76px 0 25px;position:relative;overflow:hidden}.site-footer:before{content:"";background:radial-gradient(circle at 38% 35%,#ffc8576b,#75c9f51f 48%,#0000 70%);border-radius:50%;width:480px;height:480px;position:absolute;top:-250px;right:-170px}.site-footer:after{content:"";filter:blur(1px);background:#ffffff0d;border-radius:999px;width:190px;height:80px;position:absolute;top:25px;left:8%}.footer-inner{z-index:1;justify-content:space-between;gap:42px;display:flex;position:relative}.footer-brand{color:#fff}.footer-inner p{max-width:490px;margin:16px 0 0;font-size:14px}.footer-links{grid-template-columns:repeat(2,max-content);align-content:start;gap:10px 36px;font-size:13px;display:grid}.footer-links a:hover{color:var(--sun)}.footer-meta{z-index:1;color:#ffffff6b;font:9px var(--font-mono);letter-spacing:.09em;border-top:1px solid #ffffff21;justify-content:space-between;margin-top:45px;padding-top:17px;display:flex;position:relative}.eyebrow{color:var(--accent);font:10px var(--font-mono);letter-spacing:.13em;text-transform:uppercase;margin:0 0 15px;font-weight:800}.page-hero{background:radial-gradient(at 85% 18%,#ffffffeb 0 6%,#0000 6.5%),radial-gradient(at 91% 18%,#fffc 0 5%,#0000 5.5%),radial-gradient(circle at 76% 16%,#ffda78bd,#0000 12%),linear-gradient(155deg,#dff5ff 0%,#f3fbff 56%,#fff8e7 100%);border-bottom:1px solid #5a9dc21f;padding:88px 0 68px;position:relative;overflow:hidden}.page-hero:before{content:"";border:38px solid #75c9f52e;border-radius:50%;width:330px;height:330px;position:absolute;bottom:-235px;right:8%;box-shadow:0 0 0 38px #f66b3b12}.page-hero:after{content:"CANGJIE";color:#1838560b;font-family:var(--font-display);pointer-events:none;font-size:clamp(100px,18vw,250px);font-weight:900;line-height:.7;position:absolute;bottom:-28px;right:-12px}.page-hero h1{z-index:1;max-width:880px;font-family:var(--font-display);letter-spacing:-.055em;text-shadow:0 3px #fffc;margin:0;font-size:clamp(44px,6vw,72px);font-weight:900;line-height:1.07;position:relative}.page-hero .lede{z-index:1;max-width:720px;color:var(--ink-soft);margin:22px 0 0;font-size:17px;position:relative}.section{padding:clamp(70px,9vw,112px) 0;position:relative}.section+.section{border-top:0}.section-header{justify-content:space-between;align-items:end;gap:30px;margin-bottom:38px;display:flex}.section-header h2{font-family:var(--font-display);letter-spacing:-.045em;margin:0;font-size:clamp(34px,4.5vw,53px);font-weight:900;line-height:1.12}.section-header p{max-width:600px;color:var(--muted);margin:10px 0 0}.text-link{color:var(--accent);background:var(--accent-soft);white-space:nowrap;border-radius:999px;align-items:center;gap:7px;padding:8px 13px;font-size:13px;font-weight:800;transition:transform .2s,box-shadow .2s;display:inline-flex}.text-link:hover{transform:translateY(-2px);box-shadow:0 7px 16px #f66b3b24}.button-row{flex-wrap:wrap;gap:11px;margin-top:28px;display:flex}.button{background:linear-gradient(145deg, #285373, var(--ink-deep));color:#fff;border:0;border-radius:999px;justify-content:center;align-items:center;gap:10px;min-height:48px;padding:0 21px;font-size:13px;font-weight:800;transition:transform .2s,box-shadow .2s,filter .2s;display:inline-flex;box-shadow:0 8px #102b4521,0 12px 24px #102b4526,inset 0 1px #fff3}.button:hover{filter:saturate(1.08);transform:translateY(-3px);box-shadow:0 11px #102b451c,0 18px 30px #102b4529,inset 0 1px #ffffff40}.button.secondary{border:1px solid var(--line-strong);color:var(--ink);background:#fff;box-shadow:0 7px #225d8114,0 12px 22px #225d8114}.button.accent{background:linear-gradient(145deg,#ff8252,#ed572d);box-shadow:0 8px #b93f1d29,0 13px 26px #f66b3b40,inset 0 1px #ffffff57}.button.ghost{color:#fff;backdrop-filter:blur(10px);background:#12304757;border:1px solid #ffffff70;box-shadow:0 8px 20px #0a1c2c24}.skill-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;display:grid}.skill-card{--card-color:var(--sky);border-radius:var(--radius-lg);background:radial-gradient(circle at 92% 7%, color-mix(in srgb, var(--card-color) 24%, transparent) 0 10%, transparent 26%), linear-gradient(155deg, white 0%, #fbfdff 72%, color-mix(in srgb, var(--card-color) 8%, white) 100%);min-height:380px;box-shadow:var(--shadow-soft), inset 0 1px 0 white;border:1px solid #599bc129;flex-direction:column;padding:22px 23px 21px;transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s,border-color .2s;display:flex;position:relative;overflow:hidden}.skill-card:nth-child(4n+2){--card-color:var(--sun)}.skill-card:nth-child(4n+3){--card-color:var(--grass)}.skill-card:nth-child(4n+4){--card-color:var(--berry)}.skill-card:after{content:"";border:18px solid color-mix(in srgb, var(--card-color) 12%, transparent);width:145px;height:145px;box-shadow:0 0 0 15px color-mix(in srgb, var(--card-color) 5%, transparent);pointer-events:none;border-radius:50%;position:absolute;top:-62px;right:-58px}.skill-card:hover{z-index:1;border-color:color-mix(in srgb, var(--card-color) 55%, var(--line));box-shadow:var(--shadow-pop);transform:translateY(-9px)rotate(-.35deg)}.skill-card[hidden]{display:none}.card-topline{z-index:1;justify-content:space-between;align-items:center;gap:12px;display:flex;position:relative}.card-register{color:var(--muted);font:9px var(--font-mono);letter-spacing:.08em}.quality-badge{color:var(--muted);background:#ffffffb8;border-radius:999px;align-items:center;gap:6px;padding:5px 8px;font-size:11px;font-weight:750;display:inline-flex;box-shadow:inset 0 0 0 1px #5d93b41f}.quality-badge i{width:7px;height:7px;box-shadow:0 0 0 3px color-mix(in srgb, currentColor 13%, transparent);background:currentColor;border-radius:50%}.quality-verified{color:var(--success)}.quality-experimental{color:var(--warning)}.card-title-row{grid-template-columns:52px 1fr;align-items:center;gap:14px;margin-top:32px;display:grid}.skill-glyph{background:linear-gradient(145deg, color-mix(in srgb, var(--card-color) 58%, white), var(--card-color));color:#fff;width:52px;height:52px;box-shadow:0 8px 15px color-mix(in srgb, var(--card-color) 28%, transparent), inset 0 2px 2px #ffffff8f;font-family:var(--font-display);text-shadow:0 2px 3px #1b435c33;border:3px solid #fff;border-radius:18px;place-items:center;font-size:22px;font-weight:900;display:grid;position:relative}.skill-glyph:before{content:"";filter:blur(.3px);background:#ffffff94;border-radius:50%;width:14px;height:7px;position:absolute;top:7px;left:9px;transform:rotate(-24deg)}.skill-card h3{font-family:var(--font-display);letter-spacing:-.025em;margin:0;font-size:22px;font-weight:900;line-height:1.22}.skill-card h3 a:after{content:"";position:absolute;inset:0}.skill-card>p{color:var(--muted);margin:17px 0 0;font-size:13px;line-height:1.65}.tag-list{z-index:1;flex-wrap:wrap;gap:6px;margin-top:17px;display:flex;position:relative}.tag-list span{background:var(--soft);color:#557086;border:0;border-radius:999px;padding:4px 9px;font-size:10px;box-shadow:inset 0 0 0 1px #5f96b51a}.card-meta{color:var(--muted);font:9px var(--font-mono);letter-spacing:.04em;text-transform:uppercase;justify-content:space-between;gap:12px;margin-top:auto;padding-top:24px;display:flex}.card-link{z-index:2;border-top:1px solid var(--line);color:var(--accent);justify-content:space-between;align-items:center;margin-top:13px;padding-top:13px;font-size:12px;font-weight:800;display:flex;position:relative}.prose h2{font-family:var(--font-display);letter-spacing:-.03em;margin:58px 0 14px;font-size:31px;font-weight:900}.prose h3{font-family:var(--font-display);margin:34px 0 10px;font-size:21px;font-weight:850}.prose p,.prose li{color:var(--ink-soft)}.prose a{color:var(--accent);text-underline-offset:3px;text-decoration:underline}.prose pre,.code-block{background:linear-gradient(145deg, #173e5d, var(--ink-deep));color:#ecf8ff;font:13px/1.65 var(--font-mono);border:0;border-radius:18px;padding:20px;overflow-x:auto;box-shadow:0 12px 30px #102b452e,inset 0 1px #ffffff1f}.callout{color:var(--ink-soft);background:linear-gradient(145deg,#fff7d8,#fff0e8);border:0;border-radius:18px;margin:24px 0;padding:18px 20px;box-shadow:inset 0 0 0 1px #ea97391f,0 8px 20px #bd702c14}@media (width<=900px){.skill-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.site-nav{gap:3px}.github-link{display:none}}@media (width<=640px){:root{--header-height:66px}.shell,.narrow{width:min(100% - 28px,1180px)}.brand-mark{width:42px;height:42px}.brand-copy small{display:none}.site-nav{padding:3px;font-size:12px}.site-nav>a:not(.github-link){padding:8px 9px}.page-hero{padding:60px 0 48px}.page-hero h1{font-size:42px}.section{padding:62px 0}.section-header,.footer-inner{flex-direction:column;align-items:flex-start}.skill-grid{grid-template-columns:1fr}.skill-card{min-height:350px}.footer-meta{flex-direction:column;align-items:flex-start;gap:8px}}@media (width<=440px){.brand-copy{display:none}.site-nav>a:not(.github-link){padding-inline:7px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
