:root{
--primary:#4A5A9E;--primary-hover:#3D4C8A;--primary-active:#344178;--primary-ink:#FFFFFF;--accent:#2C8FD1;--dark:#26283A;--muted:#5D6074;--soft:#676A7D;--white:#FFFFFF;--paper:#FFFFFF;
--cream:#FBF5EA;--cream-ink:#3A2F1E;--cream-muted:#6E604A;--sage:#EDF5F0;--sage-ink:#23402F;--sage-muted:#4F6B5A;--mist:#F5EFF6;--mist-ink:#3E2D45;--mist-muted:#6E5C74;--apricot:#FDF0E8;--apricot-ink:#4A2A18;--apricot-muted:#7A5540;
--canvas-subtle:#FAFAFC;--well:#F8F8FA;--current:#EEF1FA;--signed:#E8ECF8;--signed-ink:#3B4A8A;--terminal-ink:#C9CDE6;--terminal-accent:#8FC3EC;--phone-frame:#2E3046;--icon-warm:#F2E5CC;--icon-line:color-mix(in srgb,#4A2A18 18%,transparent);--quote-mark:#CDB8D3;
--line:#E8E8EE;--cream-line:#E9E1D3;--sage-line:#DCE7DF;--mist-line:#E6DDE8;--apricot-line:#EBDCD2;--on-dark-line:#575B73;--input-line:#9699AA;--focus:#4A5A9E;
--f-head:"Albert Sans",-apple-system,"Avenir Next","Segoe UI","Helvetica Neue","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
--f-body:"Manrope",-apple-system,"Segoe UI","Helvetica Neue","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
--f-mono:"SF Mono","JetBrains Mono",ui-monospace,Menlo,Consolas,-apple-system,"PingFang SC","Microsoft YaHei",monospace;
--text-xs:.75rem;--text-sm:.875rem;--text-base:.9375rem;--text-md:1.0625rem;--text-lg:1.375rem;--text-xl:2rem;--text-display:clamp(2rem,3.2vw,2.875rem);
--lh-body:1.65;--lh-title:1.25;--lh-display:1.15;--lh-code:1.7;
--space-1:.5rem;--space-2:1rem;--space-3:1.5rem;--space-4:2rem;--space-5:2.5rem;--space-6:3rem;--space-7:4rem;--space-8:5rem;--space-9:7rem;--space-field:.5rem;--space-close:7rem;
--hero-top:6.5rem;--hero-crumb-top:3rem;--crumb-after:1.5rem;--header-height:4.5rem;--gutter:1.5rem;
--width-narrow:45rem;--width-standard:75rem;--width-wide:82.5rem;--width-reading:52.5rem;
--r-btn:5px;--r-card:10px;--r-win:14px;--r-pill:999px;--radius-sm:5px;
--shadow:0 1px 2px rgba(38,40,58,.05),0 10px 30px rgba(38,40,58,.07);--shadow-hover:0 1px 2px rgba(38,40,58,.05),0 18px 40px rgba(38,40,58,.11);--shadow-stage:0 30px 70px rgba(38,40,58,.16),0 2px 8px rgba(38,40,58,.06);--shadow-phone:0 24px 50px rgba(38,40,58,.22);--shadow-button:0 6px 16px rgba(74,90,158,.28);
--motion-fast:180ms;--motion-reveal:600ms;--ease:cubic-bezier(.2,.7,.2,1);--icon-size:1.25rem;--button-height:2.75rem;--header-font:var(--text-xs);
--hero-gradient:linear-gradient(118deg,#DCE1F3 0%,#E9E4F4 22%,#F5EFF6 40%,#FBE9DE 58%,#FDF0E8 72%,#E4E7F5 100%);
}
*{box-sizing:border-box}
html{font-size:16px;scroll-padding-top:calc(var(--header-height) + var(--space-3));-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--dark);font-family:var(--f-body);font-size:var(--text-base);line-height:var(--lh-body);-webkit-font-smoothing:antialiased}
main{overflow-x:clip}
h1,h2,h3,h4,h5,h6,p,ul,ol,dl,dd,figure,blockquote,pre{margin:0}
h1,h2,h3,h4,h5,h6{font-family:var(--f-head);font-weight:700;letter-spacing:.4px;overflow-wrap:break-word}
h1{font-size:var(--text-display);line-height:var(--lh-display)}
h2{font-size:var(--text-xl);line-height:var(--lh-title)}
h3{font-size:var(--text-md);line-height:1.4}
h4{font-size:var(--text-base);line-height:1.4}
h5,h6{font-size:var(--text-sm);line-height:1.5}
p,li,blockquote,dt,dd,label{font-size:var(--text-base);line-height:var(--lh-body)}
small,figcaption{font-size:var(--text-xs);line-height:1.55}
code,kbd,samp{font-family:var(--f-mono);font-size:var(--text-sm);line-height:var(--lh-code);font-variant-numeric:tabular-nums}
th,td{font-size:var(--text-sm);line-height:1.6}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
button,input,select,textarea{min-width:0}
button{color:inherit}
img,svg,video{max-width:100%;vertical-align:middle}
img,video{height:auto}
svg{flex-shrink:0}
a,button,input,select,textarea,summary{touch-action:manipulation}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--focus);outline-offset:4px}
[hidden]{display:none!important}
::selection{background:var(--primary);color:var(--primary-ink)}
:lang(zh-Hant){--f-body:"Manrope",-apple-system,"PingFang TC","Microsoft JhengHei","Noto Sans CJK TC",sans-serif;--f-head:"Albert Sans",-apple-system,"PingFang TC","Microsoft JhengHei","Noto Sans CJK TC",sans-serif}
:lang(ja){--f-body:"Manrope",-apple-system,"Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo",sans-serif;--f-head:"Albert Sans",-apple-system,"Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo",sans-serif}
:lang(ko){--f-body:"Manrope",-apple-system,"Apple SD Gothic Neo","Malgun Gothic","Noto Sans CJK KR",sans-serif;--f-head:"Albert Sans",-apple-system,"Apple SD Gothic Neo","Malgun Gothic","Noto Sans CJK KR",sans-serif}
.container,.wrap,.container-narrow,.container-wide{width:min(calc(100% - var(--gutter)*2),var(--width-standard));margin-inline:auto}
.container-narrow{max-width:var(--width-narrow)}
.container-wide{max-width:var(--width-wide)}
.num{font-family:var(--f-mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.u-muted{color:var(--muted)}
.u-small{font-size:var(--text-sm);line-height:var(--lh-body)}
.u-center{text-align:center}
.u-start{text-align:start}
.u-stack{display:flex;flex-direction:column;gap:var(--space-3)}
.u-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));gap:var(--space-3);align-items:stretch}
.u-grid>*{min-width:0}
.u-gap-1{gap:var(--space-1)}
.u-gap-3{gap:var(--space-3)}
.u-gap-4{gap:var(--space-4)}
.u-mt-3{margin-top:var(--space-3)}
.u-mt-4{margin-top:var(--space-4)}
.u-mt-6{margin-top:var(--space-6)}
.u-pad-card{padding:var(--space-4)}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.skip-link{position:fixed;top:var(--space-2);left:var(--gutter);z-index:100;background:var(--paper);color:var(--primary);padding:var(--space-1) var(--space-3);border-radius:var(--r-btn);transform:translateY(-200%)}
.skip-link:focus{transform:none}
pre{max-width:100%;overflow-x:auto;background:var(--dark);color:var(--terminal-ink);padding:var(--space-3);border-radius:var(--r-card);font-size:var(--text-sm);line-height:var(--lh-code)}
pre code{display:block;min-width:0;color:inherit}
:not(pre)>code{max-width:100%;overflow-x:auto}
.reveal{opacity:1;transform:none}
.reveal.is-pending{opacity:0;transform:translateY(16px);transition:opacity var(--motion-reveal) var(--ease),transform var(--motion-reveal) var(--ease)}
.reveal.reveal-left.is-pending{transform:translate(-16px,0)}
.reveal.reveal-right.is-pending{transform:translate(16px,0)}
.reveal.is-visible{opacity:1;transform:none}
@media(max-width:64rem){:root{--space-9:5rem;--space-close:5rem;--hero-top:5rem}
}
@media(max-width:42rem){:root{--gutter:1.25rem;--space-9:4rem;--space-close:4rem;--hero-top:4rem;--text-xl:1.75rem}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.reveal.is-pending{opacity:1;transform:none!important}
}