:root{--bg: #07070c;--ink: #f4f3f8;--quiet: #a7a5b8;--dim: #5d5b70;--hot: #ff3d8b;--gold: #ffc53d;--ok: #38f2a8;--cyan: #36c8ff;--warn: #ff5a4e;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);overflow:hidden;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased}canvas{position:fixed;inset:0;width:100%;height:100%;display:block}iframe#intro{position:fixed;inset:0;width:100%;height:100%;border:0;z-index:20;background:var(--bg)}iframe#intro.gone{display:none}#hud{position:fixed;inset:0;pointer-events:none;z-index:5}.score{position:absolute;top:calc(env(safe-area-inset-top) + 10px);left:0;right:0;text-align:center;font-weight:900;font-style:italic;font-size:clamp(34px,7vw,56px);letter-spacing:-.01em;text-shadow:0 0 18px rgba(255,61,139,.5);font-variant-numeric:tabular-nums}.score small{font-size:.45em;margin-left:8px;color:var(--gold);vertical-align:middle}.score.bump{animation:bump .35s ease-out}@keyframes bump{0%{transform:scale(1.25)}to{transform:none}}.meters{position:absolute;top:calc(env(safe-area-inset-top) + 74px);left:16px;right:16px;display:flex;gap:14px;justify-content:center}.m{display:flex;flex-direction:column;gap:4px;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--quiet)}.m b{font-size:18px;color:var(--ink);letter-spacing:0}.bar{width:90px;height:8px;border-radius:4px;background:#ffffff1a;overflow:hidden;margin-top:5px}.bar div{height:100%;width:0;transition:width .4s}.crowd .bar div{background:linear-gradient(90deg,var(--cyan),var(--ok))}.od .bar div{background:linear-gradient(90deg,var(--gold),var(--hot))}.line{position:absolute;top:calc(env(safe-area-inset-top) + 128px);left:16px;right:16px;text-align:center;font-size:clamp(18px,3.6vw,28px);font-weight:700;line-height:1.35;max-width:760px;margin:0 auto;text-wrap:balance}.line .w{color:var(--dim);transition:color .15s}.line .w.on{color:var(--ink)}.line .blank{display:inline-block;min-width:3.2em;border-bottom:3px solid var(--dim);color:transparent}.line .blank.active{border-color:var(--gold);animation:pulse .6s ease-in-out infinite alternate}.line .blank.filled{color:var(--ink);border-color:transparent;animation:pop .45s cubic-bezier(.2,1.6,.3,1)}.line .blank.shock{color:var(--gold);text-shadow:0 0 12px rgba(255,197,61,.9),0 0 28px rgba(255,61,139,.7)}.line .blank.hit{color:var(--ok)}.line .blank.read,.line .blank.unclear,.line .blank.filler{color:var(--quiet)}.line .blank.miss{color:var(--warn)}@keyframes pulse{to{border-color:var(--hot)}}@keyframes pop{0%{transform:scale(2);opacity:0}to{transform:none;opacity:1}}.tier{position:absolute;bottom:calc(env(safe-area-inset-bottom) + 8px);right:12px;font-size:10px;font-weight:800;letter-spacing:.14em;color:var(--dim);text-transform:uppercase}.overlay{position:fixed;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;padding:16px;background:#07070cb8;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.overlay[hidden]{display:none}.card{width:min(440px,100%);background:#14131d;border:1px solid #2a2838;border-radius:16px;padding:22px;text-align:center}.card.wide{width:min(620px,100%);max-height:calc(100% - 32px);overflow:auto}.card h2{margin:6px 0 12px;font-size:clamp(26px,6vw,40px);font-style:italic;font-weight:900}.card p{color:var(--quiet);line-height:1.45}.card b{color:var(--ink)}.kicker{font-size:12px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--hot)}.fine{font-size:12px;color:var(--dim)!important}button.big{font:900 italic 20px system-ui;letter-spacing:.04em;text-transform:uppercase;color:#160812;border:0;border-radius:12px;padding:14px 28px;cursor:pointer;background:linear-gradient(180deg,var(--gold),var(--hot));box-shadow:0 8px 30px #ff3d8b66}.ghost{color:var(--quiet);font-size:14px;padding:12px;display:inline-block}.row{display:flex;gap:12px;justify-content:center;align-items:center;flex-wrap:wrap;margin-top:14px}.stars{font-size:28px;color:var(--gold);letter-spacing:.1em;margin-bottom:8px}table{width:100%;border-collapse:collapse;font-size:14px;text-align:left}th{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);font-weight:800;padding:6px 4px}td{padding:8px 4px;border-top:1px solid #23212f;vertical-align:top}td.j{font-weight:800;text-transform:uppercase;font-size:12px;letter-spacing:.08em}td.num{font-variant-numeric:tabular-nums;text-align:right}td .why{display:block;font-size:11px;color:var(--dim)}pre{white-space:pre-wrap;text-align:left;font-size:12px;color:var(--quiet)}.mute{position:absolute;top:calc(env(safe-area-inset-top) + 14px);left:12px;pointer-events:auto;font:800 12px system-ui;color:var(--quiet);background:#ffffff0f;border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:7px 12px;cursor:pointer}button.hear{font:700 11px system-ui;color:var(--quiet);background:#ffffff14;border:1px solid rgba(255,255,255,.16);border-radius:999px;width:24px;height:24px;padding:0;cursor:pointer;vertical-align:1px}button.resay{display:block;margin-top:4px;font:700 11px system-ui;color:var(--quiet);background:none;border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:3px 9px;cursor:pointer}button.resay:hover{color:var(--ink);border-color:#fff6}button.resay:disabled{opacity:.35;cursor:default}button.resay.live{color:#160812;background:linear-gradient(180deg,var(--gold),var(--hot));border-color:transparent;opacity:1;animation:pop .3s ease-out}.line .blank.heard{color:var(--quiet);border-color:transparent;font-style:italic}.sentence{font-size:18px;line-height:1.45;color:var(--ink)!important;margin:4px 0 6px;text-wrap:balance}.sentence b.shock{color:var(--gold)}.sentence b.hit{color:var(--ok)}.sentence b.read,.sentence b.unclear,.sentence b.filler{color:var(--quiet)}.sentence b.miss{color:var(--warn)}#free-hud{position:fixed;left:0;right:0;bottom:calc(env(safe-area-inset-bottom) + 14px);z-index:6;display:flex;justify-content:center;gap:10px}#free-hud[hidden]{display:none}#free-hud .status{font:800 11px system-ui;letter-spacing:.14em;text-transform:uppercase;color:var(--quiet);align-self:center}.line .said{transition:color .2s}body.free .score,body.free .meters{display:none}body.free .line{top:calc(env(safe-area-inset-top) + 56px)}.line .said.shock{color:var(--gold)}.line .said.hit{color:var(--ok)}.line .said.read{color:var(--quiet)}.line .said.unclear{color:var(--dim)}#free-hud .ghost{background:#ffffff0f;border:1px solid rgba(255,255,255,.14);border-radius:999px;cursor:pointer;color:var(--ink);font:700 13px system-ui;padding:8px 14px}button.ghost{background:none;border:0;cursor:pointer;text-decoration:underline;font:inherit}@media(max-width:480px){.card.wide{padding:18px 12px}table{font-size:12.5px}th,td{padding-left:3px!important;padding-right:3px!important}th{letter-spacing:.06em}}