@font-face{font-family:Messina;src:url('./messina-regular.598496b0d2fa.woff2') format('woff2');font-weight:400;font-display:swap}
:root{--blue:#1c75bc;--sky-top:#1968b8;--sky-bottom:#277fbd;--sky-glow:#86c3e918;--paper:#f3f0e7;--ink:#302234;--muted:#706574;--rule:#30223426;--orange:#f3734c;--grain:.16;--fringe-cyan:#8fe7ff1a;--fringe-pink:#ffc1e81a;--field-grid:#49496b65;--field-grid-soft:#49496b55;--field-dot:#63577f8c;--field-blue:#1c75bc99;--field-square:#3f95b536;--sans:Messina,'Helvetica Neue','PingFang SC','Microsoft YaHei',sans-serif;color-scheme:light}
:root[data-theme=dark]{--blue:#05101a;--sky-top:#030c16;--sky-bottom:#0a1b29;--sky-glow:#305b7520;--paper:#08141f;--ink:#e8e9ed;--muted:#9caab8;--rule:#d0dbe52b;--grain:.20;--fringe-cyan:#8fe7ff16;--fringe-pink:#ffc1e816;--field-grid:#bac2df61;--field-grid-soft:#bac2df45;--field-dot:#c6b5e9a0;--field-blue:#7ebfe1ad;--field-square:#8ad6ee55;color-scheme:dark}
/* Supporting UI scale. Keep these values in sync with style-guide.md. */
:root[lang=zh-Hant]{--sans:Messina,'Helvetica Neue','PingFang TC','Microsoft JhengHei',sans-serif}
:root[lang=ja-JP]{--sans:Messina,'Helvetica Neue','Hiragino Kaku Gothic ProN','Yu Gothic',Meiryo,sans-serif}
:root{--type-hero:clamp(24px,2.3vw,32px);--type-body:16px;--type-control:18px;--type-announcement:16px;--brand-width:clamp(42px,6vw,48px);--header-icon-size:24px;--header-control-target:44px;--masthead-height:clamp(84px,12vw,100px)}
:root{--type-menu:16px;--menu-width:184px;--menu-padding:8px;--menu-row-height:44px;--menu-row-padding-block:10px;--menu-row-padding-inline:12px;--menu-offset:8px;--menu-radius:4px;--menu-surface:#1767a9f5;--menu-text:#fffffff2;--menu-border:#ffffff2e;--menu-hover:#ffffff14;--menu-selected:#ffffff0a;--menu-accent:#d3b2fb;--menu-shadow:0 12px 32px #05101a2e}
:root[data-theme=dark]{--menu-surface:#08141ff5;--menu-text:#e8e9ed;--menu-border:#ffffff24;--menu-hover:#ffffff0f;--menu-selected:#ffffff08;--menu-shadow:0 12px 32px #0000003d}
*{box-sizing:border-box}
html{scroll-behavior:auto;scrollbar-gutter:stable}
body{margin:0;font-family:var(--sans);font-size:var(--type-body);background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased}
button{-webkit-tap-highlight-color:transparent;font:inherit;color:inherit;cursor:pointer}
button:focus-visible{outline:2px solid #ffb3f5;outline-offset:4px}
::selection{color:var(--ink);background:#ffb3cc}
.sequence{height:100svh;min-height:560px;background:transparent;color:#fff}
@media(max-width:899px){.sequence{height:max(114svh,calc(600px + 18vw))}}
.pinned{position:relative;isolation:isolate;height:100%;overflow:hidden;display:flex;flex-direction:column;padding:0 clamp(24px,4.4vw,84px)}
.masthead{position:relative;z-index:3;height:var(--masthead-height);display:flex;justify-content:space-between;align-items:center;flex-shrink:0}
.brand{display:block;width:var(--brand-width);height:auto;aspect-ratio:7/6;object-fit:contain}
.header-controls{display:flex;align-items:center;gap:clamp(4px,1.4vw,20px)}
.theme-toggle{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;padding:11px;background:transparent;border:0;color:inherit}
.theme-toggle{opacity:.8;width:var(--header-control-target);height:var(--header-control-target);padding:10px}
.theme-toggle:hover{opacity:1}
.theme-toggle svg{display:block;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle svg{width:var(--header-icon-size);height:var(--header-icon-size)}
.theme-sun{display:none}
[data-theme=dark] .theme-moon{display:none}
[data-theme=dark] .theme-sun{display:inline}
.locale{position:relative;font-size:var(--type-control);line-height:1.2}
.locale-toggle{display:flex;align-items:center;justify-content:space-between;gap:8px;width:104px;min-height:48px;padding:12px 8px;background:none;border:0;opacity:.85}
.locale-toggle:hover,.locale-toggle[aria-expanded=true]{opacity:1}
.locale-toggle svg{width:14px;height:14px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:.65}
.locale-options{position:absolute;right:0;top:calc(100% + var(--menu-offset));width:var(--menu-width);padding:var(--menu-padding);background:var(--menu-surface);color:var(--menu-text);border:1px solid var(--menu-border);border-radius:var(--menu-radius);box-shadow:var(--menu-shadow);font-size:var(--type-menu);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.locale-options[hidden]{display:none}
.locale-options button{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:var(--menu-row-height);padding:var(--menu-row-padding-block) var(--menu-row-padding-inline);text-align:left;background:transparent;border:0;color:inherit}
.locale-options button[aria-pressed=true]{background:var(--menu-selected)}
.locale-options button:hover,.locale-options button:focus-visible{background:var(--menu-hover)}
.locale-options button[aria-pressed=true]::after{content:'';flex-shrink:0;width:6px;height:10px;margin-right:4px;border:solid var(--menu-accent);border-width:0 1.5px 1.5px 0;transform:translateY(-1px) rotate(45deg)}
.scene{position:relative;flex:1;min-height:340px;width:100%;max-width:1440px;margin:0 auto clamp(36px,4.4vw,64px)}
#letter-scene{width:100%;height:100%;position:absolute;inset:0;overflow:visible;pointer-events:none;user-select:none}
.message{position:absolute;left:41%;width:59%;top:50%;z-index:1;opacity:0;--entry-y:6px;--copy-indent:5.55em;--connecting-space:0em;padding-top:var(--connecting-space);max-width:100%;transform:translateY(var(--entry-y));font-size:var(--type-hero);line-height:1.4;letter-spacing:-.03em;pointer-events:auto;user-select:text;-webkit-user-select:text}
.parallax-word{display:inline-block;transform-origin:50% 65%}
.message{text-shadow:-.3px 0 var(--fringe-cyan),.3px 0 var(--fringe-pink)}
.sequence[data-playback=complete] #letter-scene{filter:drop-shadow(-.3px 0 0 var(--fringe-cyan)) drop-shadow(.3px 0 0 var(--fringe-pink))}
.caption-chunk{max-width:100%;white-space:normal}
.handoff-from{display:inline-block}
.candidate{transform-origin:50% 65%}
.connecting{position:absolute;left:0;top:0;font:inherit;margin:0}
.thought-lines{font:inherit;padding-left:var(--copy-indent)}
.candidate-row{height:1.4em;opacity:0;transform:translateY(6px)}
.candidate{position:relative;display:inline-block;width:max-content;line-height:1.4;overflow:visible}
.scribble{position:absolute;left:-6px;top:0;width:calc(100% + 12px);height:100%;overflow:visible;pointer-events:none;user-select:none}
.scribble path{fill:none;stroke:var(--orange);stroke-width:3.5px;stroke-linecap:round;stroke-linejoin:round}
.final-word{font:inherit;margin:0;padding-left:var(--copy-indent);opacity:0}
.subline{position:relative;font:inherit;margin:var(--caption-gap,.85em) 0 0 calc(-1*var(--caption-outdent,0em));opacity:0}
.subline-lead,.subline-tail{display:block}
.subline-lead{position:relative;white-space:nowrap}
.subline-lead{margin-left:var(--caption-lead,calc(var(--copy-indent)*.5))}
.subline-tail{margin-left:var(--handoff-indent,var(--copy-indent))}
.scroll-arrow{position:absolute;right:4.4vw;bottom:34px;font-size:24px;line-height:1;opacity:.7;pointer-events:none}
.spatial-field{position:relative;display:grid;place-items:center;padding:5vw 4.4vw;background:var(--paper);overflow:hidden}
#field{display:block;width:min(100%,1250px);height:min(73vw,780px);min-height:330px;max-height:85svh}
.updates{padding:40px 4.4vw 64px;text-align:center;font-size:var(--type-announcement);line-height:1.4;background:var(--paper)}
.updates p{margin:0}
.site-backdrop{position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 28% 88%,var(--sky-glow),transparent 70%),linear-gradient(158deg,var(--sky-top),var(--blue) 58%,var(--sky-bottom))}
.site-backdrop::before{content:'';position:absolute;inset:0;background:url('./sky-grain.e8ead3ebad0e.png') repeat;background-size:192px 192px;mix-blend-mode:soft-light;opacity:var(--grain)}
main{position:relative;z-index:1}
.spatial-field::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse closest-side at 66% 40%,#b4bdff26, #8ed4dd16 40%,transparent 100%)}
#field{position:relative}
[data-theme=dark] body{background:#05101a}
[data-theme=dark] .spatial-field,[data-theme=dark] .updates{background:transparent}
[data-theme=dark] .spatial-field::before{content:none}
html[data-script=cjk] .connecting,html[data-script=cjk] .final-word{letter-spacing:0}
html[data-script=cjk]{--type-hero:clamp(24px,2.1vw,30px)}
html[data-script=cjk] .message{--copy-indent:2.4em}
@media(max-width:899px){
 :root{--type-hero:clamp(20px,2.9vw,24px)}
 html[data-script=cjk]{--type-hero:clamp(22px,3.1vw,26px)}
}
@media(max-width:700px){
 .scribble path{stroke-width:3px}
 .scroll-arrow{right:24px;bottom:24px}
 .spatial-field{padding:35px 24px}
 .updates{padding:40px 24px 56px}
 #field{height:85vw;max-height:none;min-height:320px}
}
@media(prefers-reduced-motion:reduce){.scroll-arrow{display:none}}
