:root{--navy: #16203c;--navy-2: #24304f;--bg: #eef2f7;--card: #ffffff;--muted: #5b6478;--line: rgba(22, 32, 60, .1);--green: #12b76a;--green-deep: #0b8a4f;--yellow: #ffd700;--orange: #ff6b35;--red: #e5363d;--blood: #b71c1c;--amber: #f59e0b;--safe-t: env(safe-area-inset-top, 0px);--safe-b: env(safe-area-inset-bottom, 0px);--safe-l: env(safe-area-inset-left, 0px);--safe-r: env(safe-area-inset-right, 0px);--font: ui-rounded, "SF Pro Rounded", "Nunito", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;color-scheme:light}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--navy);font-family:var(--font);color:var(--navy);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;overscroll-behavior:none}#scene{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}#ui{position:fixed;inset:0;pointer-events:none}.touch{position:absolute;inset:0;touch-action:none;pointer-events:none}.touch.live{pointer-events:auto}button{font-family:inherit;color:inherit;cursor:pointer}button:focus-visible,input:focus-visible+i{outline:3px solid var(--yellow);outline-offset:2px}.hud{position:absolute;inset:0;opacity:0;transition:opacity .25s}.hud.visible{opacity:1}.hud-top{position:absolute;top:calc(var(--safe-t) + 10px);left:calc(var(--safe-l) + 12px);right:calc(var(--safe-r) + 12px);display:flex;gap:8px;align-items:center}.pill{height:36px;padding:0 12px;border-radius:999px;background:#fffffff0;box-shadow:0 4px 14px #16203c2e;display:inline-flex;align-items:center;gap:6px;font-weight:800;font-size:15px;font-variant-numeric:tabular-nums}.pill.timer.urgent{background:var(--red);color:#fff;animation:throb .9s infinite}.pill.ping{margin-left:auto;font-size:12px;height:28px;padding:0 10px}.pill.ping:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--green)}.pill.ping[data-q=ok]:before{background:var(--amber)}.pill.ping[data-q=bad]:before{background:var(--red)}.pill[hidden]{display:none}.conn{position:absolute;left:50%;top:calc(var(--safe-t) + 196px);transform:translate(-50%);padding:8px 14px;border-radius:14px;background:var(--navy);color:#fff;font-weight:800;font-size:14px;white-space:nowrap;opacity:0;transition:opacity .2s}.conn.visible{opacity:1}.icon-btn{width:40px;height:40px;border-radius:50%;border:0;background:#fffffff0;box-shadow:0 4px 14px #16203c2e;font-size:16px;pointer-events:auto;flex:none}.track{position:absolute;top:calc(var(--safe-t) + 60px);left:calc(var(--safe-l) + 28px);right:calc(var(--safe-r) + 34px);height:18px}.track-line{position:absolute;left:0;right:0;top:7px;height:4px;border-radius:4px;background:#fff9}.track-flag{position:absolute;top:-2px;font-size:14px}.track-flag.start{left:-14px;color:#fff;font-size:12px;top:1px}.track-flag.end{right:-26px}.dot{position:absolute;top:4px;width:10px;height:10px;margin-left:-5px;border-radius:50%;border:1.5px solid rgba(255,255,255,.9);transition:left .1s linear}.dot.me{top:1px;width:16px;height:16px;margin-left:-8px;border:3px solid var(--green);z-index:2;box-shadow:0 0 0 2px #fff}.dot.out{opacity:.25;filter:grayscale(1)}.signal{position:absolute;top:calc(var(--safe-t) + 90px);left:50%;transform:translate(-50%,-8px) scale(.96);padding:10px 20px;border-radius:20px;display:flex;gap:10px;align-items:center;font-weight:900;font-size:clamp(22px,7vw,32px);letter-spacing:.02em;color:#fff;white-space:nowrap;opacity:0;transition:opacity .12s,transform .12s,background .12s;box-shadow:0 10px 30px #00000040}.signal.visible{opacity:1;transform:translate(-50%) scale(1)}.signal.go{background:var(--green)}.signal.turning{background:var(--amber);color:var(--navy);animation:shake .3s infinite}.signal.stop{background:var(--red)}.signal.back{background:#16203cd1;font-size:clamp(16px,5vw,22px)}.signal.safe{background:var(--green)}.signal.out{background:var(--blood)}.signal.count{background:var(--navy);font-size:clamp(40px,14vw,64px);padding:6px 28px}.sig-icon:empty{display:none}.song{position:absolute;top:calc(var(--safe-t) + 150px);left:50%;transform:translate(-50%);width:max-content;max-width:calc(100vw - 24px);display:flex;flex-wrap:wrap;justify-content:center;gap:3px;opacity:0;transition:opacity .2s}.song.visible{opacity:1}.song i{font-style:normal;font-weight:800;font-size:12px;padding:3px 6px;border-radius:9px;background:#ffffff52;color:#16203cbf;transition:background .1s,transform .1s,color .1s}.song i.lit{background:#fff;color:var(--navy);transform:translateY(-3px)}.song i.last.lit{background:var(--red);color:#fff}.feed{position:absolute;top:calc(var(--safe-t) + 196px);right:calc(var(--safe-r) + 10px);display:flex;flex-direction:column;align-items:flex-end;gap:6px;max-width:70vw}.feed-item{font-size:13px;font-weight:800;padding:6px 10px;border-radius:12px;background:#ffffffeb;box-shadow:0 4px 12px #00000026;animation:slidein .2s ease-out;transition:opacity .5s,transform .5s}.feed-item.out{border-left:4px solid var(--blood)}.feed-item.safe{border-left:4px solid var(--green)}.feed-item.gone{opacity:0;transform:translate(20px)}.hint{position:absolute;left:50%;bottom:calc(var(--safe-b) + 170px);transform:translate(-50%);padding:8px 14px;border-radius:14px;background:#16203cd1;color:#fff;font-weight:700;font-size:14px;text-align:center;max-width:86vw;opacity:0;transition:opacity .25s}.hint.visible{opacity:1}.ghosts{opacity:0;transition:opacity .3s}.ghosts.visible{opacity:1}.stick-ghost{position:absolute;bottom:calc(var(--safe-b) + 34px);width:120px;display:flex;flex-direction:column;align-items:center;gap:2px;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.5)}.stick-ghost.left{left:calc(var(--safe-l) + 18px)}.stick-ghost.right{right:calc(var(--safe-r) + 18px);opacity:.7}.stick-ghost i{width:84px;height:84px;border-radius:50%;border:2px dashed rgba(255,255,255,.8);background:#ffffff1f;margin-bottom:6px;animation:breathe 1.6s infinite}.stick-ghost b{font-size:14px}.stick-ghost small{font-size:12px;opacity:.9}.vignette{position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 52%,rgba(183,28,28,.8) 100%);opacity:0;transition:opacity .25s}.vignette.watch{opacity:.32}.vignette.dead{opacity:1;background:radial-gradient(ellipse at center,#78000026 30%,#780000eb);transition:opacity .4s}.verdict{position:absolute;inset:0;display:grid;place-items:center;font-weight:1000;font-size:clamp(42px,13vw,76px);letter-spacing:.04em;color:#ff3b3b;text-shadow:0 4px 0 #3a0000,0 0 40px rgba(0,0,0,.7);opacity:0;pointer-events:none}.verdict.visible{animation:verdict 1.8s ease-out forwards}.verdict.safe{color:#fff;text-shadow:0 4px 0 var(--green-deep),0 0 40px rgba(18,183,106,.8)}.stick{position:fixed;left:0;top:0;width:124px;height:124px;margin:-62px 0 0 -62px;border-radius:50%;background:#ffffff24;border:2px solid rgba(255,255,255,.6);opacity:0;transition:opacity .1s;pointer-events:none}.stick.on{opacity:1}.stick .knob{position:absolute;left:50%;top:50%;width:56px;height:56px;border-radius:50%;background:#ffffffeb;box-shadow:0 4px 12px #00000040;transform:translate(-50%,-50%)}.stick.run .knob{background:var(--yellow)}.stick.run{border-color:var(--yellow)}.screens{position:absolute;inset:0;display:none}.screens.visible{display:block}.screen{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;padding:calc(var(--safe-t) + 12px) calc(var(--safe-r) + 12px) calc(var(--safe-b) + 12px) calc(var(--safe-l) + 12px);background:linear-gradient(180deg,#16203c00 30%,#16203c99);pointer-events:auto;animation:fadein .2s ease-out}.screen.center{justify-content:center;background:#16203c8c}.screen.lobby{background:linear-gradient(180deg,#16203c26,#16203c00 25%,#16203c8c)}.card{width:100%;max-width:420px;max-height:100%;overflow-y:auto;touch-action:pan-y;background:var(--card);border-radius:26px;padding:20px 18px 18px;box-shadow:0 24px 60px #0000004d;display:flex;flex-direction:column;gap:10px;animation:rise .25s cubic-bezier(.2,.9,.3,1.2)}.card>*{flex-shrink:0}.card.narrow{max-width:320px}.card h1{margin:0;font-size:28px;line-height:1.1;font-weight:900}.card h2{margin:0 0 4px;font-size:22px;font-weight:900}.lede{margin:0;color:var(--muted);font-size:15px;line-height:1.4}.caption{margin:-2px 0 2px;text-align:center;color:var(--muted);font-size:12.5px;font-weight:600}.eyebrow{font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--green-deep)}.btn{height:54px;border-radius:999px;border:0;width:100%;font-weight:900;font-size:17px;display:flex;align-items:center;justify-content:center;gap:8px;transition:transform .08s}.btn:active{transform:translateY(2px) scale(.98)}.btn[disabled]{opacity:.55;cursor:default}.btn.primary{background:var(--green);color:#fff;box-shadow:0 5px 0 var(--green-deep)}.btn.ghost{background:var(--bg);color:var(--navy)}.btn.small{height:44px;font-size:14px;flex:1;padding:0 10px}.btn.icon{flex:none;width:44px;padding:0}.row{display:flex;gap:8px}.soon{font-size:10px;font-weight:900;background:var(--yellow);color:var(--navy);padding:2px 6px;border-radius:6px;text-transform:uppercase}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:4px 0}.stats div{background:var(--bg);border-radius:16px;padding:8px;text-align:center}.stats b{display:block;font-size:20px;font-weight:900;font-variant-numeric:tabular-nums}.stats span{font-size:12px;color:var(--muted);font-weight:700}.brand{position:absolute;top:calc(var(--safe-t) + 14px);left:calc(var(--safe-l) + 14px);display:flex;flex-direction:column;line-height:.9;padding:10px 14px;border-radius:18px;background:var(--navy);color:var(--yellow);box-shadow:0 8px 24px #0000004d}.brand-mark{font-size:22px;font-weight:1000;letter-spacing:.06em}.brand-sub{font-size:11px;font-weight:900;letter-spacing:.36em;color:#fff}.player-chip{position:absolute;top:calc(var(--safe-t) + 18px);right:calc(var(--safe-r) + 14px);display:flex;align-items:center;gap:8px;padding:4px 12px 4px 4px;border-radius:999px;background:#fffffff0;font-weight:800;font-size:14px;max-width:55vw;box-shadow:0 4px 14px #16203c2e}.player-chip .hi{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.avatar{width:32px;height:32px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-weight:900;overflow:hidden;flex:none}.avatar img{width:100%;height:100%;object-fit:cover}.corner-btn{position:absolute;top:calc(var(--safe-t) + 70px);right:calc(var(--safe-r) + 14px);width:36px;height:36px;border-radius:50%;border:0;background:#ffffffe6;font-weight:900}.steps{list-style:none;margin:4px 0;padding:0;display:flex;flex-direction:column;gap:10px}.steps li{display:flex;gap:12px;align-items:flex-start;font-size:15px;line-height:1.35}.step-ico{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;font-size:18px;flex:none;color:#fff}.step-ico.go{background:var(--green)}.step-ico.stop{background:var(--red)}.step-ico.fin{background:var(--navy)}.tips{background:var(--bg);border-radius:16px;padding:10px 12px}.tips p{margin:4px 0;font-size:13.5px;color:var(--navy-2)}.toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 2px;border-bottom:1px solid var(--line);cursor:pointer}.toggle span{display:flex;flex-direction:column}.toggle small{color:var(--muted);font-size:12px}.toggle input{position:absolute;opacity:0;pointer-events:none}.toggle i{width:50px;height:30px;border-radius:30px;background:#cdd3de;position:relative;flex:none;transition:background .15s}.toggle i:after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 2px 4px #0003;transition:transform .15s}.toggle input:checked+i{background:var(--green)}.toggle input:checked+i:after{transform:translate(20px)}.field{display:flex;flex-direction:column;gap:8px;padding:10px 2px}.segs{display:flex;background:var(--bg);border-radius:14px;padding:3px}.seg{flex:1;height:38px;border:0;border-radius:11px;background:transparent;font-weight:800;font-size:13px}.seg.on{background:#fff;box-shadow:0 2px 6px #16203c26}.result-emoji{font-size:48px;text-align:center;line-height:1}.card[data-screen] h2,.screen[data-screen=results] h2,.screen[data-screen=results] .lede{text-align:center}.score{display:flex;align-items:baseline;justify-content:center;gap:10px;background:var(--bg);border-radius:18px;padding:10px}.score span{font-size:13px;font-weight:800;color:var(--muted);text-transform:uppercase}.score b{font-size:36px;font-weight:1000;font-variant-numeric:tabular-nums}.score em{font-style:normal;font-size:12px;font-weight:900;background:var(--yellow);padding:3px 8px;border-radius:8px}.score small{color:var(--muted);font-weight:700}.board{list-style:none;margin:0;padding:0;max-height:46vh;overflow-y:auto}.board li{display:flex;gap:10px;padding:8px 4px;border-bottom:1px solid var(--line);font-weight:700}.board .rank{width:28px;color:var(--muted);font-variant-numeric:tabular-nums}.board .who{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.board .pts{font-variant-numeric:tabular-nums}.board .empty{color:var(--muted);justify-content:center}.me-row{margin:0;text-align:center;font-size:14px}@keyframes fadein{0%{opacity:0}to{opacity:1}}@keyframes rise{0%{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}@keyframes slidein{0%{transform:translate(16px);opacity:0}to{transform:none;opacity:1}}@keyframes throb{50%{transform:scale(1.06)}}@keyframes breathe{50%{transform:scale(1.08)}}@keyframes shake{25%{transform:translate(calc(-50% - 2px))}75%{transform:translate(calc(-50% + 2px))}}@keyframes verdict{0%{opacity:0;transform:scale(2.2)}12%{opacity:1;transform:scale(.94)}20%{transform:scale(1)}80%{opacity:1}to{opacity:0;transform:scale(1.04)}}@media(prefers-reduced-motion:reduce){.signal.turning,.pill.timer.urgent,.stick-ghost i,.card{animation:none}}.status{margin:0;text-align:center;font-weight:800;color:var(--navy-2);font-size:14px}.status.error{color:var(--red);background:#e5363d14;border-radius:12px;padding:8px 10px}.join{display:flex;gap:8px}.join input{flex:1;min-width:0;height:44px;border:2px solid var(--line);border-radius:999px;padding:0 16px;font:900 18px var(--font);letter-spacing:.3em;text-transform:uppercase;text-align:center;color:var(--navy);background:var(--bg);-webkit-user-select:text;user-select:text}.join input:focus{outline:none;border-color:var(--green)}.join .btn.small{flex:none;width:96px}.code{font:1000 40px var(--font);letter-spacing:.22em;text-align:center;padding:10px 0 10px .22em;border-radius:18px;background:var(--navy);color:var(--yellow);font-variant-numeric:tabular-nums;-webkit-user-select:all;user-select:all}.players{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;max-height:34vh;overflow-y:auto}.players li{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:14px;background:var(--bg);font-weight:800}.players .who{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.players em{font-style:normal;font-size:11px;font-weight:900;padding:2px 8px;border-radius:8px;background:var(--green);color:#fff}.players em.host{background:var(--yellow);color:var(--navy)}.players small{color:var(--muted);font-weight:700}.hint-text{color:var(--muted);font-size:12px;font-weight:600}