@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--ink:#090d15;--white:#edf8fa;--muted:#9baab9;--cyan:#9cffe1;--coral:#ff7277;--line:rgba(190,229,235,.16);font-family:'DM Sans',system-ui,sans-serif;font-size:1rem;background:var(--ink);color:var(--white)}
*{box-sizing:border-box}body{margin:0;min-height:100svh;overflow-x:hidden}button,a,input{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid var(--cyan);outline-offset:5px}button:disabled{opacity:.5;cursor:wait}[hidden]{display:none!important}button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}h1,h2,strong,.wordmark{font-family:'Space Grotesk',system-ui,sans-serif}button{border:0}
#world{position:fixed;inset:0;z-index:0;overflow:hidden;background:radial-gradient(ellipse at 60% 50%,#102731 0%,#090d15 65%)}
#world canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;outline:none}#camera{position:absolute;display:none;transform:translate(-50%,-50%);left:50%;top:50%;max-width:none;pointer-events:none}.vignette{position:fixed;inset:0;pointer-events:none;z-index:1;background:linear-gradient(0deg,rgba(6,9,15,.95),transparent 32%,transparent 70%,rgba(6,9,15,.58))}body.camera-mode .vignette{background:linear-gradient(0deg,rgba(6,9,15,.86),transparent 30%,transparent 70%,rgba(6,9,15,.8))}.topbar{position:relative;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:max(24px,env(safe-area-inset-top)) 36px 16px}.wordmark{display:flex;align-items:center;gap:10px;font-size:0.9375rem;letter-spacing:.075em;font-weight:700}.wordmark-light{font-weight:400;margin-left:4px;color:#bed2d9}.brand-symbol{font-size:1.938rem;font-weight:400;color:var(--cyan);line-height:1}.top-actions{display:flex;align-items:center;gap:24px}.mode-badge{font-size:0.75rem;letter-spacing:.14em;font-weight:500;color:var(--muted)}.icon-button{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:#0c151d88;color:var(--white)}.icon-button:hover{background:#243943}.intro{position:relative;z-index:2;min-height:calc(100svh - 89px);display:flex;flex-direction:column;justify-content:space-between;pointer-events:none;padding:clamp(30px,8vh,90px) 7vw 26px}.intro-copy{max-width:620px}.eyebrow{font-size:0.75rem;font-weight:600;letter-spacing:.16em;color:var(--cyan);margin:0 0 22px;display:flex;align-items:center;gap:9px}.eyebrow>span{display:block;width:5px;height:5px;background:var(--cyan)}h1{font-size:clamp(42px,5.2vw,76px);font-weight:500;letter-spacing:-.055em;line-height:1.04;margin:0 0 24px}h2{font-size:clamp(30px,4vw,43px);font-weight:500;line-height:1.1;letter-spacing:-.045em;margin:0 0 18px}.intro-description{font-size:1.062rem;line-height:1.65;color:#b7cbd2;margin:0;max-width:420px}.intro-bottom{width:max-content;max-width:100%;padding-top:28px;pointer-events:auto}.game-key{display:flex;gap:21px;align-items:center;font-size:0.75rem;font-weight:500;letter-spacing:.07em;color:#b7cbd2;margin:0 0 22px}.game-key>span{display:flex;align-items:center;gap:7px}.key-shape{display:inline-block;width:7px;height:9px;transform:rotate(40deg);border:1px solid}.cyan{color:var(--cyan);background:#9cffe13b}.coral{color:var(--coral);background:#ff727736}.round-key{color:#82939f}.start-actions{display:flex;gap:12px;align-items:center}.button{min-height:52px;padding:14px 22px;border-radius:13px;display:inline-flex;align-items:center;justify-content:center;gap:11px;font-weight:600;font-size:0.9375rem;transition:background .18s,transform .18s,color .18s;line-height:1.25}.button:hover{transform:translateY(-1px)}.button.primary{background:var(--cyan);color:#092820;box-shadow:0 0 24px #8fffd018}.button.primary:hover{background:#c6fff0}.button.secondary{background:#13212b9e;color:var(--white);border:1px solid var(--line)}.button.secondary:hover{background:#223944}.button.secondary span{margin-left:9px}.fineprint{font-size:0.8125rem;line-height:1.8;color:#97aab5;margin:18px 0 0}.fine-divider{margin:0 9px}.text-button{color:#c5f7eb;font:inherit;display:inline;background:none;padding:0;text-decoration:underline;text-decoration-color:#44665f;text-underline-offset:4px;cursor:pointer}.text-button:hover{text-decoration-color:var(--cyan)}.boot-status{font-size:0.8125rem;line-height:1.4;color:var(--coral);margin:8px 0 0}.boot-status:empty{display:none}.scene-caption{position:absolute;right:7vw;bottom:37px;letter-spacing:.16em;font-size:0.75rem;color:#8da9b3}.scene-caption span{margin-left:15px;color:#a3f4d9}
.play-ui{position:fixed;inset:90px 0 0;z-index:3;pointer-events:none}.scoreboard{display:flex;justify-content:space-between;align-items:start;padding:12px 36px}.stat-label{font-size:0.75rem;letter-spacing:.17em;color:#c0d6da;display:block;margin-bottom:1px}.scoreboard strong{font-size:2.812rem;font-weight:500;letter-spacing:-.055em;line-height:1.2;display:block}.time-stat{text-align:right}.time-stat strong span{font-size:1.25rem;margin-left:2px}.time-track{position:absolute;left:36px;right:36px;top:92px;height:2px;background:#9ccfc522}.time-track>div{height:100%;width:100%;background:var(--cyan);transform-origin:left}.play-bottom{position:absolute;bottom:0;left:0;right:0;padding:20px 36px max(24px,env(safe-area-inset-bottom));pointer-events:auto}.play-bottom>p{text-align:center;color:#e2eeef;font-size:0.875rem;margin:0 0 22px;line-height:1.5}.play-controls{display:flex;align-items:center;justify-content:space-between;gap:10px}.button.small{min-height:42px;padding:11px 18px;color:#effafa;background:#14242dbb;border:1px solid #aacfc533;font-size:0.875rem;border-radius:10px}.button.subtle{background:#10202855}.tracking-state{font-size:0.75rem;letter-spacing:.1em;color:#acc8d0}.combo{position:absolute;top:109px;left:0;right:0;text-align:center;font-size:0.875rem;color:var(--cyan);font-weight:600;letter-spacing:.07em}.tracking-note{position:absolute;inset:22% 5% auto;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;font-size:0.9375rem;background:#081720db;padding:30px 18px;border-radius:20px;max-width:370px;margin:auto;border:1px solid #bbebdf40;backdrop-filter:blur(10px);pointer-events:auto}.tracking-note strong{font-size:1.438rem;letter-spacing:-.025em}.tracking-note>span:not(.scanner-corners){color:#aec8cf;line-height:1.6}.scanner-corners{width:48px;height:48px;border:2px dashed var(--cyan);border-radius:7px;margin-bottom:8px}.center-screen{position:fixed;inset:0;z-index:8;display:grid;place-items:center;background:#070f16a8;backdrop-filter:blur(10px);overflow-y:auto;padding:28px}.screen-card{width:min(100%,410px);text-align:center;padding:36px 24px;background:linear-gradient(160deg,#172b33e8,#0c171fef);border:1px solid var(--line);border-radius:26px}.screen-card .eyebrow{justify-content:center}.screen-card>p:not(.eyebrow){font-size:0.9375rem;line-height:1.5;color:#b7cbd2;margin:0 0 25px}.screen-card .button{width:100%;margin-top:10px}.result-score{margin:20px 0}.result-score strong{display:block;font-size:5.75rem;line-height:1.1;font-weight:500;letter-spacing:-.08em;color:var(--cyan)}.result-score span{font-size:0.75rem;color:var(--muted);letter-spacing:.14em}.result-stats{display:flex;gap:20px;justify-content:center;margin:22px 0;font-size:0.875rem;color:#91afb7}.result-stats b{font-size:1.25rem;font-family:'Space Grotesk',sans-serif;color:#e0f7f2}.setup-dialog{position:fixed;width:min(460px,calc(100% - 32px));max-height:calc(100svh - 32px);margin:auto;border:1px solid #3b585e;border-radius:24px;padding:30px;color:var(--white);background:#102028;box-shadow:0 30px 110px #0009;overscroll-behavior:contain}.setup-dialog::backdrop{background:#030910ba;backdrop-filter:blur(12px)}.setup-dialog .eyebrow{margin-bottom:18px;padding-right:15px}.setup-dialog h2{font-size:2.062rem}.setup-dialog>p:not(.eyebrow){font-size:0.9375rem;color:#b4cbd1;line-height:1.5}.close-button{position:absolute;right:10px;top:10px;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;font-size:1.688rem;font-weight:400;color:#c3d9dc;background:transparent}.close-button:hover{background:#25414a}.marker-preview{display:block;background:#fff;width:180px;aspect-ratio:1;margin:24px auto 15px;padding:10px;border-radius:10px}.marker-preview img{width:100%;height:auto;display:block}.card-actions{display:flex;align-items:center;justify-content:center;gap:20px;font-size:0.8125rem;margin-bottom:22px}.setup-tip{font-size:0.875rem;line-height:1.55;background:#1c333c;padding:12px 14px;border-radius:10px;color:#b5ced3}.setup-tip strong{color:#e4f8f5}.setup-dialog .button{width:100%;margin-top:10px}.camera-status:not(:empty){padding:12px;background:#54242e;color:#ffd8df!important;border-radius:8px;font-size:0.875rem!important}.camera-status:empty{margin:12px 0 0}.setup-dialog .privacy-note{font-size:0.75rem!important;text-align:center;margin:15px 0 0;color:#7f9ca6!important}.popups{position:fixed;inset:0;z-index:6;pointer-events:none;overflow:hidden}.pop{position:absolute;transform:translate(-50%,-50%);font-family:'Space Grotesk',sans-serif;font-size:1.75rem;font-weight:600;color:var(--cyan);text-shadow:0 2px 10px #05110e;animation:float-away .85s ease-out both}.pop.hazard{color:var(--coral)}@keyframes float-away{from{opacity:1;translate:0 0}to{opacity:0;translate:0 -70px;scale:.8}}.fallback{position:fixed;inset:20%;padding:30px;background:#102028;z-index:30}
@media(min-width:1000px){.intro-bottom{padding-bottom:28px}.intro-copy{pointer-events:none}body:not(.playing) #world canvas{cursor:grab}.play-ui{max-width:1200px;left:50%;width:100%;transform:translateX(-50%)}}
@media(max-width:700px){.topbar{padding:max(18px,env(safe-area-inset-top)) 20px 10px;gap:8px}.wordmark{font-size:0.75rem;gap:8px}.brand-symbol{font-size:1.75rem}.top-actions{gap:10px}.mode-badge{font-size:0.75rem;letter-spacing:.08em;max-width:95px;text-align:right;line-height:1.4}.icon-button{width:36px;height:36px}.intro{padding:25px 23px max(25px,env(safe-area-inset-bottom));min-height:calc(100svh - 74px)}.eyebrow{font-size:0.75rem;letter-spacing:.12em;margin-bottom:17px}h1{font-size:clamp(38px,9.7vw,56px);line-height:1.02;margin-bottom:15px}.intro-description{font-size:1rem;line-height:1.55}.intro-bottom{width:100%;padding-top:220px}.game-key{justify-content:center;gap:24px;font-size:0.75rem;margin-bottom:17px}.round-key{display:none!important}.start-actions{flex-direction:column;gap:9px}.start-actions .button{width:100%;min-height:50px}.fineprint{text-align:center;font-size:0.75rem;margin-top:13px}.scene-caption{display:none}.boot-status{text-align:center}.play-ui{top:78px}.scoreboard{padding:8px 24px}.scoreboard strong{font-size:2.438rem}.time-track{left:24px;right:24px;top:80px}.combo{top:94px}.play-bottom{padding:20px 22px max(25px,env(safe-area-inset-bottom))}.play-bottom>p{font-size:0.8125rem;margin-bottom:16px}.tracking-state{font-size:0.75rem;letter-spacing:.06em;max-width:150px;text-align:center}.setup-dialog{padding:25px 22px}.setup-dialog .eyebrow{font-size:0.75rem}.marker-preview{width:155px;margin:18px auto 12px}.card-actions{font-size:0.75rem}.setup-dialog h2{font-size:1.812rem}.setup-dialog>p:not(.eyebrow){font-size:0.875rem}.setup-tip{font-size:0.875rem}.result-score strong{font-size:4.812rem}}
@media(max-height:740px) and (max-width:700px){.intro{padding-top:12px}.intro h1{font-size:2.312rem}.intro-description{font-size:1rem}.intro-bottom{padding-top:190px}.fineprint{font-size:0.75rem}.game-key{margin-bottom:12px}.start-actions .button{min-height:44px;padding:12px 16px}.intro .eyebrow{margin-bottom:12px}}
@media(prefers-reduced-motion:reduce){.button{transition:none}.pop{animation-duration:.25s}}
