:root{--bg: #05060a;--panel: rgba(10, 12, 18, .86);--line: rgba(255, 255, 255, .09);--text: #eef1f7;--muted: rgba(238, 241, 247, .55);--accent: #8fd0ff;--radius: 12px;color-scheme:dark}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,sans-serif;overscroll-behavior:none}.app{position:fixed;inset:0}.stage,.overlay{position:absolute;inset:0;width:100%;height:100%;display:block}.stage{touch-action:none}.overlay{pointer-events:none}.hud{position:absolute;top:calc(12px + env(safe-area-inset-top));left:16px;right:16px;display:flex;gap:12px;align-items:baseline;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);pointer-events:none;text-shadow:0 1px 8px rgba(0,0,0,.7)}.hud__name{color:var(--text);font-weight:600}.hud__source{margin-left:auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:40%}.transport{position:absolute;inset:auto 16px 0%;display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--panel);backdrop-filter:blur(18px);border:1px solid var(--line);border-radius:999px;transform:translateY(-8px);z-index:2}.app .transport{bottom:auto;top:calc(44px + env(safe-area-inset-top))}.transport__play{border:none;background:#ffffff1a;border-radius:50%;width:34px;height:34px;flex:0 0 34px;font-size:12px;padding:0}.transport__seek{flex:1;accent-color:var(--accent)}.transport__time{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}.chrome{position:absolute;inset:auto 0 0;display:flex;flex-direction:column;pointer-events:none;z-index:3}.sheet{pointer-events:auto;background:var(--panel);backdrop-filter:blur(24px);border-top:1px solid var(--line);padding:16px 16px 10px;max-height:46vh;overflow-y:auto}.sheet h2{display:flex;align-items:baseline;gap:10px;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin:18px 0 8px}.sheet h2:first-child{margin-top:0}.sheet h2 em{font-style:normal;text-transform:none;letter-spacing:0;font-size:11px;opacity:.7}.row{display:flex;gap:8px}.row.wrap{flex-wrap:wrap}button,.button,select,input.text,input.search{font:inherit;color:var(--text);background:#ffffff0f;border:1px solid var(--line);border-radius:10px;padding:10px 14px;cursor:pointer;transition:background .12s ease}button:hover,.button:hover{background:#ffffff1f}button.active,.chip.active{background:var(--accent);color:#05060a;border-color:transparent;font-weight:600}button.primary{background:var(--accent);color:#05060a;font-weight:600;border-color:transparent;width:100%;padding:14px}button.link{background:none;border:none;padding:0;font-size:11px;color:var(--accent);text-transform:none;letter-spacing:0;margin-left:auto;cursor:pointer}.chip{padding:7px 13px;border-radius:999px;font-size:13px}.disclosure{width:100%;margin-top:6px;font-size:13px;color:var(--muted)}input.text,input.search{width:100%;cursor:text;margin-bottom:8px}input.code{width:7em;margin-bottom:0;text-align:center;letter-spacing:.18em;text-transform:uppercase}.hit{position:absolute;right:calc(18px + env(safe-area-inset-right));bottom:calc(96px + env(safe-area-inset-bottom));width:84px;height:84px;border-radius:50%;border:2px solid hsla(var(--hit-hue),90%,68%,.85);background:hsla(var(--hit-hue),90%,60%,.16);color:hsl(var(--hit-hue),90%,78%);font-size:13px;font-weight:700;letter-spacing:.14em;touch-action:none;transition:transform 90ms ease,background .12s ease}.hit:before{content:"";position:absolute;inset:-10px;border-radius:50%;border:2px solid hsla(var(--hit-hue),90%,70%,calc(.1 + var(--beat, 0) * .55));transform:scale(calc(1.35 - var(--beat, 0) * .35));pointer-events:none}.hit:after{content:"";position:absolute;left:0;right:0;bottom:0;height:calc(var(--charge, 0) * 100%);border-radius:0 0 42px 42px;background:hsla(var(--hit-hue),95%,68%,.45);pointer-events:none;transition:height 60ms linear}.hit--locked{border-color:hsla(var(--hit-hue),95%,78%,1);box-shadow:0 0 24px hsla(var(--hit-hue),95%,62%,.55)}.hit--ready{border-color:#ffffffe6;animation:hit-ready .6s ease-in-out infinite alternate}@keyframes hit-ready{to{box-shadow:0 0 26px #ffffff8c}}.hit--now{border-color:#fff;background:#fff6;color:#05060a;box-shadow:0 0 46px #ffffffd9}.board{position:absolute;right:calc(18px + env(safe-area-inset-right));top:calc(64px + env(safe-area-inset-top));display:flex;flex-direction:column;align-items:flex-end;gap:3px;padding:10px 14px;border-radius:12px;background:#04050a99;border:1px solid var(--line);font-size:14px;pointer-events:none;text-shadow:0 1px 6px rgba(0,0,0,.8)}.board__clock{font-size:26px;font-weight:700;line-height:1;margin-bottom:2px}.board__row{display:flex;align-items:baseline;gap:8px;font-weight:600}.board__row b{font-variant-numeric:tabular-nums}.board__row i{font-style:normal;font-size:11px;opacity:.75}.board__won{font-size:18px;font-weight:700;margin-bottom:4px}.board--wall{right:2.2vmin;top:2.2vmin;padding:1.4vmin 2vmin;border-radius:1.4vmin;font-size:2.2vmin;gap:.4vmin}.board--wall .board__clock{font-size:5vmin}.board--wall .board__won{font-size:3.2vmin}.board--wall .board__row i{font-size:1.5vmin}.gone{position:absolute;left:50%;bottom:calc(190px + env(safe-area-inset-bottom));transform:translate(-50%);margin:0;padding:8px 14px;border-radius:10px;background:#04050ab3;border:1px solid var(--line);color:var(--muted);font-size:13px;white-space:nowrap;pointer-events:none}.hit:active{transform:scale(.92);background:hsla(var(--hit-hue),90%,60%,.34)}.players{position:absolute;left:16px;bottom:calc(96px + env(safe-area-inset-bottom));display:flex;flex-wrap:wrap;gap:4px 10px;max-width:50vw;font-size:13px;font-weight:600;pointer-events:none;text-shadow:0 1px 6px rgba(0,0,0,.8)}.players__one--run{text-shadow:0 1px 6px rgba(0,0,0,.8),0 0 14px currentColor}.players--wall{left:2.2vmin;bottom:2.2vmin;max-width:60vw;gap:.4vmin 1.6vmin;font-size:2vmin}.code-display{margin:4px 0 0;font-size:30px;font-weight:700;letter-spacing:.24em;user-select:all}.join{position:absolute;right:2.2vmin;bottom:2.2vmin;display:flex;flex-direction:column;align-items:flex-end;gap:.2vmin;padding:1.4vmin 2vmin;border-radius:1.4vmin;background:#04050a8c;border:1px solid rgba(255,255,255,.14);pointer-events:none;text-shadow:0 1px 6px rgba(0,0,0,.8)}.join__where{font-size:1.7vmin;color:var(--muted)}.join__code{font-size:4.4vmin;font-weight:700;letter-spacing:.2em;line-height:1.1}.join__what{font-size:1.5vmin;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}.status{color:var(--muted);font-size:13px;line-height:1.45;margin:10px 0 0}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px}.card{display:flex;flex-direction:column;gap:4px;text-align:left;padding:12px}.card strong{font-size:14px}.card span{font-size:12px;color:var(--muted);line-height:1.35}.card.active span{color:#05060ab8}.param{display:block;margin:12px 0}.param--inline{display:flex;justify-content:space-between;align-items:center}.param__label{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);margin-bottom:5px}.param__label em{font-style:normal;color:var(--text);font-variant-numeric:tabular-nums}.param input[type=range]{width:100%;accent-color:var(--accent)}.param select{width:100%}.progress{height:8px;border-radius:999px;background:#ffffff1a;overflow:hidden;margin-bottom:10px}.progress__fill{height:100%;background:var(--accent);transition:width .12s linear}.tabs{pointer-events:auto;display:flex;gap:2px;padding:6px 8px calc(6px + env(safe-area-inset-bottom));background:var(--panel);backdrop-filter:blur(24px);border-top:1px solid var(--line)}.tabs button{flex:1;border:none;background:transparent;border-radius:10px;font-size:11px;padding:8px 4px;display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--muted)}.tabs button.active{color:var(--accent);background:#8fd0ff1f;font-weight:600}.tabs__glyph{font-size:15px;line-height:1}@media(min-width:900px){.chrome{inset:0 auto 0 0;width:380px;flex-direction:column-reverse}.sheet{max-height:none;flex:1;border-top:none;border-right:1px solid var(--line)}.tabs{border-top:none;border-bottom:1px solid var(--line);border-right:1px solid var(--line)}.app--bare .chrome{width:auto}.hud{left:400px}.app--bare .hud{left:16px}.app .transport{left:400px}.app--bare .transport{left:16px}}.hud__party{margin-left:auto;pointer-events:auto;font:inherit;letter-spacing:inherit;text-transform:inherit;color:var(--muted);background:#0c0e148c;border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:4px 12px;cursor:pointer}.hud__party:hover,.hud__party.active{color:var(--text);border-color:#fff6}.app--party .hud,.app--party .chrome,.app--party .transport{transition:opacity .42s ease}.app--hidden .hud,.app--hidden .chrome,.app--hidden .transport{opacity:0;pointer-events:none}.app--hidden{cursor:none}