:root{--promo-height:44px;color:#f3f6ef;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:#05060a;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{width:100%;min-width:1024px;height:100%;margin:0;overflow:hidden}body:before{content:"";z-index:1;pointer-events:none;background:linear-gradient(90deg,#05060af5 0%,#05060ae6 36%,#05060a6b 68%,#05060a1f 100%),radial-gradient(circle at 28% 42%,#00000075,#0000 44%);position:fixed;inset:0}button{font:inherit}canvas{display:block}.stage{animation:.9s ease-out both stage-in}.stage-still{background:#05060a url(/stage-still.webp) 50%/cover no-repeat;position:fixed;inset:0}@keyframes stage-in{0%{opacity:0}}@media (prefers-reduced-motion:reduce){.stage{animation:none}}#root>canvas{inset:0;position:fixed!important}.content{--scroll-y:0px;--page-zoom:1;z-index:2;pointer-events:none;position:fixed;inset:0;overflow:hidden}.scroll-plane{width:min(820px,100vw - 460px);min-height:430vh;transform:translate3d(0, var(--scroll-y), 0) scale(var(--page-zoom));transform-origin:28% 34%;will-change:transform;margin-left:clamp(64px,8vw,118px);padding:18vh 0 28vh}.story-section{text-shadow:0 2px 24px #000000bf;border-left:1px solid #f4f6ef52;flex-direction:column;justify-content:center;min-height:92vh;padding-left:clamp(34px,4vw,64px);display:flex;position:relative}.kicker,.accent,.gesture-grid,.debug,.status-row{font-family:JetBrains Mono,ui-monospace,SFMono-Regular,Menlo,monospace}.kicker{color:#8fffe0;text-transform:uppercase;margin:0 0 22px;font-size:13px;font-weight:600}.story-title{color:#fbfff8;letter-spacing:0;max-width:760px;margin:0;font-family:Instrument Serif,Georgia,serif;font-size:clamp(58px,6.4vw,104px);font-weight:400;line-height:.94}.body{color:#fbfff8f0;max-width:610px;margin:28px 0 0;font-size:clamp(18px,1.22vw,22px);font-weight:400;line-height:1.58}.accent{color:#ffe08a;width:-moz-fit-content;width:fit-content;margin:30px 0 0;font-size:13px;font-weight:600}.section-mark{color:#f4f6ef6b;background:#05060a;border:1px solid #f4f6ef47;border-radius:50%;place-items:center;width:26px;height:26px;font-size:12px;transition:border-color .22s,color .22s,background .22s;display:grid;position:absolute;top:50%;left:-13px;transform:translateY(-50%)}.section-mark.active{color:#06120e;background:#6fffcc;border-color:#6fffcc}.promo-bar{z-index:8;height:var(--promo-height);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);color:#f3f6efbd;letter-spacing:.02em;background:#080a0ed1;border-bottom:1px solid #f3f6ef1f;justify-content:center;align-items:center;padding:0 24px;font-family:JetBrains Mono,ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;text-decoration:none;transition:color .2s,background .2s;display:flex;position:fixed;top:0;left:0;right:0}.promo-bar:hover{color:#f3f6ef;background:#0c1016eb}.promo-label{white-space:nowrap}.promo-emoji{margin-right:.5em;font-size:13px}.promo-bar b{color:#8fffe0;text-underline-offset:3px;font-weight:600;-webkit-text-decoration:underline #8fffe073;text-decoration:underline #8fffe073;transition:text-decoration-color .2s}.promo-bar:hover b{text-decoration-color:#8fffe0}.promo-external{vertical-align:-1px;color:#8fffe0;fill:none;stroke:currentColor;stroke-width:1.3px;stroke-linecap:round;stroke-linejoin:round;width:10px;height:10px;margin-left:.5em}.control-panel{z-index:5;top:calc(var(--promo-height) + 18px);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);pointer-events:auto;background:#080a0edb;border:1px solid #f3f6ef29;border-radius:8px;width:304px;padding:18px;position:fixed;right:28px;box-shadow:0 24px 80px #0000005c}.brand{font-family:Instrument Serif,Georgia,serif;font-size:34px}.status-row{color:#f3f6efc2;text-transform:uppercase;align-items:center;gap:9px;min-height:28px;margin-top:12px;font-size:12px;display:flex}.status-dot{background:#f7d06f;border-radius:50%;width:8px;height:8px;box-shadow:0 0 18px}.status-dot.running{color:#6fffcc;background:#6fffcc}.status-dot.error,.status-dot.unsupported{color:#ff6f8c;background:#ff6f8c}.start-button,.stop-button{cursor:pointer;border-radius:6px;width:100%;min-height:46px;margin-top:16px;font-weight:700}.start-button{color:#07110e;background:#6fffcc;border:0}.start-button:hover{background:#99ffda}.stop-button{color:#ffd8de;background:#ff6f8c21;border:1px solid #ff9cad94}.stop-button:hover{background:#ff6f8c38;border-color:#ffb8c4d1}.meter{background:#f3f6ef1f;border-radius:999px;height:4px;margin-top:16px;overflow:hidden}.meter span{background:#6fffcc;height:100%;display:block}.gesture-grid{color:#f3f6ef8a;border-top:1px solid #f3f6ef1f;grid-template-columns:1fr auto;gap:9px 14px;margin-top:18px;padding-top:16px;font-size:12px;display:grid}.gesture-grid b{color:#f3f6efe6;font-weight:500}.error{color:#ff9cad;margin:14px 0 0;font-size:13px;line-height:1.4}.camera{z-index:4;aspect-ratio:4/3;background:#030408db;border:1px solid #f3f6ef2e;border-radius:8px;width:304px;position:fixed;bottom:28px;right:28px;overflow:hidden;box-shadow:0 20px 70px #00000057}.camera video{display:none}.camera canvas{width:100%;height:100%}.debug{z-index:7;color:#f3f6efbd;background:#080a0ec2;border:1px solid #f3f6ef24;border-radius:6px;gap:14px;padding:10px 12px;font-size:11px;display:flex;position:fixed;bottom:20px;left:24px}.hint{z-index:4;pointer-events:none;align-items:center;gap:26px;transition:opacity .3s;display:flex;position:fixed;bottom:34px;left:50%;transform:translate(-50%)}.hint-glyph{display:block;position:relative}.hint-glyph-scroll{width:24px;height:48px}.hint-glyph-zoom{width:76px;height:24px}.hint-rail{width:100%;height:100%;position:absolute;inset:0}.hint-track{stroke:#8fffe059;stroke-width:1.5px;stroke-dasharray:2 4;stroke-linecap:round}.hint-arrow{fill:none;stroke:#8fffe073;stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round}.hint-arrow-out{animation:3.2s ease-in-out infinite hint-arrow-out-pulse}.hint-arrow-in{animation:3.2s ease-in-out infinite hint-arrow-in-pulse}.hint-pinch{font-size:16px;line-height:1;position:absolute;left:50%}.hint-glyph-scroll .hint-pinch{margin-left:-11px;animation:3.2s ease-in-out infinite hint-pinch-drag;top:9px}.hint-pinch-left{margin-left:-17px;animation:3.2s ease-in-out infinite hint-pinch-spread-left;top:4px}.hint-pinch-right{margin-left:1px;animation:3.2s ease-in-out infinite hint-pinch-spread-right;top:4px}@keyframes hint-pinch-drag{0%,12%{transform:translateY(0)}45%,57%{transform:translateY(13px)}90%,to{transform:translateY(0)}}@keyframes hint-pinch-spread-left{0%,12%{transform:scaleX(-1)translate(0)}45%,57%{transform:scaleX(-1)translate(7px)}90%,to{transform:scaleX(-1)translate(0)}}@keyframes hint-pinch-spread-right{0%,12%{transform:translate(0)}45%,57%{transform:translate(7px)}90%,to{transform:translate(0)}}@keyframes hint-arrow-out-pulse{0%,12%{opacity:.4}30%,50%{opacity:1}66%,to{opacity:.4}}@keyframes hint-arrow-in-pulse{0%,57%{opacity:.4}75%,95%{opacity:1}to{opacity:.4}}@media (prefers-reduced-motion:reduce){.hint-pinch{animation:none}.hint-arrow-out,.hint-arrow-in{opacity:1;animation:none}.hint-pinch-left{transform:scaleX(-1)}}.switch-link{color:#8fffe0;margin-top:16px;font-size:13px;text-decoration:none;display:block}.switch-link:hover{color:#c2fff0}.repo-link{color:#f3f6ef9e;margin-top:8px;font-size:13px;text-decoration:none;display:block}.repo-link:hover{color:#f3f6ef}.panel-note{color:#f3f6ef8a;margin:14px 0 0;font-size:12px;line-height:1.45}.game{z-index:2;align-items:center;padding:0 356px 0 clamp(40px,6vw,96px);display:grid;position:fixed;inset:0}.game-stage{width:100%;max-width:1600px}.game-canvas{aspect-ratio:16/3;border:1px solid #f3f6ef29;border-radius:8px;width:100%;box-shadow:0 24px 80px #0000005c}.game-debug{color:#f3f6efbd;white-space:pre-wrap;min-height:1.5em;margin:14px 0 0;font-family:JetBrains Mono,ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px}.game-debug.hidden{visibility:hidden}.mobile-landing{display:none}@media (max-width:1023px){html,body,#root{min-width:0}.mobile-landing{inset:var(--promo-height) 0 0;z-index:20;color:#f3f6ef;text-align:center;background:#05060a;flex-direction:column;align-items:center;padding:40px 24px 48px;display:flex;position:fixed;overflow-y:auto}.mobile-landing>*{width:100%;max-width:440px}.mobile-logo{width:48px;height:48px}.mobile-title{margin:18px 0 0;font-family:Instrument Serif,Georgia,serif;font-size:44px;line-height:1}.mobile-lede{color:#fbfff8e0;margin:14px 0 0;font-size:17px;line-height:1.5}.mobile-shot{border:1px solid #f3f6ef29;border-radius:8px;height:auto;margin-top:24px}.mobile-note{color:#f3f6ef99;margin:20px 0 0;font-size:14px}.mobile-repo{color:#8fffe0;margin-top:18px;font-size:15px;text-decoration:none;display:block}}