:root{color-scheme:dark;--bg: #0a0614;--panel: rgba(12, 10, 24, .82);--line: rgba(255, 120, 200, .35);--text: #f2eaff;--muted: #9a90b8;--accent: #ff4da6;--accent2: #4de4ff;font-family:Segoe UI,system-ui,sans-serif}*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text)}#c{display:block;width:100%;height:100%;touch-action:none}#hud{pointer-events:none;position:fixed;inset:0;z-index:10}#hud button,#hud input,#hud a,#hud .nav,#hud .panel,#hud .player-bar,#hud .chat,#hud .page,#hud .joystick{pointer-events:auto}.top{display:flex;flex-wrap:wrap;gap:.6rem 1rem;align-items:center;justify-content:space-between;padding:.65rem .9rem;background:linear-gradient(180deg,#080612eb,#08061233);border-bottom:1px solid var(--line)}.brand{display:flex;gap:.6rem;align-items:center}.brand .logo{font-size:1.5rem}.brand strong{display:block;letter-spacing:.04em}.brand small{color:var(--muted)}.nav{display:flex;flex-wrap:wrap;gap:.35rem}.nav button,.player-bar button,.chat button,.page button,#zone-actions button{background:#ff4da61f;border:1px solid var(--line);color:var(--text);border-radius:999px;padding:.35rem .75rem;cursor:pointer;font:inherit}.nav button:hover,.player-bar button:hover,.chat button:hover,.page button:hover{background:#4de4ff26;border-color:#4de4ff73}.status{color:var(--muted);font-size:.85rem}#nick{color:var(--accent2);cursor:pointer;text-decoration:underline dotted}.panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;backdrop-filter:blur(10px);padding:.85rem 1rem;box-shadow:0 10px 40px #00000059}#zone-card{position:absolute;left:1rem;bottom:6.5rem;max-width:min(360px,calc(100vw - 2rem))}#zone-card h2{margin:0 0 .35rem;font-size:1.15rem;color:var(--accent)}#zone-card p{margin:0 0 .6rem;color:var(--muted);line-height:1.35}.player-bar{position:absolute;left:50%;bottom:.75rem;transform:translate(-50%);display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;justify-content:space-between;width:min(720px,calc(100vw - 1.5rem));padding:.55rem .85rem;background:var(--panel);border:1px solid var(--line);border-radius:16px}.np{display:flex;flex-direction:column;min-width:140px}.np small{color:var(--muted)}.row{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}.vol{display:flex;gap:.35rem;align-items:center;color:var(--muted);font-size:.85rem}.chat{position:absolute;right:1rem;bottom:6.5rem;width:min(300px,calc(100vw - 2rem));max-height:240px;display:flex;flex-direction:column;gap:.4rem}#chat-log{overflow:auto;max-height:120px;font-size:.85rem;color:#e8e0ff}#chat-log div{margin:.15rem 0;word-break:break-word}#chat-form{display:flex;gap:.35rem}#chat-form input{flex:1;border-radius:999px;border:1px solid var(--line);background:#00000059;color:var(--text);padding:.4rem .7rem;font:inherit}.emotes button{min-width:2.2rem}.help{position:absolute;left:50%;top:4.2rem;transform:translate(-50%);color:var(--muted);font-size:.78rem;text-align:center;max-width:90vw;text-shadow:0 1px 4px #000}.flash{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);background:#ff4da633;border:1px solid var(--accent);padding:.8rem 1.2rem;border-radius:12px;font-weight:600}.page{position:absolute;inset:4.5rem 1rem 7rem;overflow:auto;background:#080612f0;border:1px solid var(--line);border-radius:18px;padding:1.25rem 1.5rem 2rem;z-index:8;box-shadow:0 12px 40px #00000073}.page h1{margin-top:0;color:var(--accent2)}.page .lead{font-size:1.1rem;color:#dcd2ff}.page .muted,.muted{color:var(--muted)}.page .close{position:sticky;top:0;float:right;z-index:2;margin:-.25rem 0 .75rem .75rem;background:#0c0a18eb;border:1px solid var(--line);color:var(--text);border-radius:999px;padding:.35rem .85rem;cursor:pointer;font:inherit;box-shadow:0 4px 16px #00000059}.page .close:hover{border-color:var(--accent);background:#ff4da626}.page .cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.75rem}.page article{background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:.75rem}.page pre.rules{white-space:pre-wrap;background:#00000059;padding:1rem;border-radius:12px;border:1px solid var(--line)}.maplist{list-style:none;padding:0}.maplist li{display:flex;gap:.5rem;align-items:center;margin:.35rem 0}.maplist .dot{width:10px;height:10px;border-radius:50%;display:inline-block}.joystick{display:none;position:absolute;left:1.2rem;bottom:7.5rem;width:110px;height:110px;border-radius:50%;border:2px solid rgba(255,255,255,.2);background:#00000040;touch-action:none}.joystick .stick{position:absolute;left:50%;top:50%;width:48px;height:48px;margin:-24px 0 0 -24px;border-radius:50%;background:#ff4da68c;border:2px solid rgba(255,255,255,.35)}.hidden{display:none!important}@media(max-width:820px){.chat{display:none}.joystick{display:block}.help{display:none}.nav button{padding:.3rem .55rem;font-size:.8rem}}kbd{background:#ffffff14;border:1px solid rgba(255,255,255,.15);border-radius:4px;padding:0 .3rem;font-size:.85em}#jukebox{position:fixed;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;background:#06020eb8;pointer-events:auto;padding:1rem}#jukebox.hidden{display:none!important}.jukebox-panel{width:min(440px,96vw);max-height:min(78vh,640px);display:flex;flex-direction:column;background:linear-gradient(165deg,#1c0c24f5,#0a0816fa);border:1px solid rgba(255,100,180,.45);border-radius:16px;box-shadow:0 16px 48px #0000008c,0 0 40px #ff4da61f;overflow:hidden}.jukebox-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;padding:.9rem 1rem .5rem;border-bottom:1px solid rgba(255,255,255,.08)}.jukebox-head h2{margin:0;font-size:1.15rem;letter-spacing:.04em}.jukebox-head small{color:var(--muted)}.jukebox-close{pointer-events:auto;background:#ffffff14;border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:999px;width:2.2rem;height:2.2rem;cursor:pointer;font-size:1rem}.jukebox-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem;padding:.65rem .85rem}.jukebox-tabs button{pointer-events:auto;min-height:44px;border-radius:10px;border:1px solid rgba(255,255,255,.14);background:#ffffff0f;color:var(--text);font-weight:600;cursor:pointer}.jukebox-tabs button.is-active{background:#ff4da659;border-color:#ff78c8a6;color:#fff}.jukebox-search-row{display:none;padding:0 .85rem .5rem}.jukebox-search-row input{width:100%;min-height:44px;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:#00000059;color:var(--text);padding:.5rem .75rem;font-size:1rem}.jukebox-status{padding:.25rem 1rem .5rem;color:var(--muted);font-size:.85rem}.jukebox-list{flex:1;overflow-y:auto;padding:.25rem .65rem .85rem;display:flex;flex-direction:column;gap:.35rem}.jukebox-row{pointer-events:auto;display:flex;align-items:center;gap:.65rem;text-align:left;width:100%;min-height:56px;padding:.4rem .55rem;border-radius:12px;border:1px solid transparent;background:#ffffff0a;color:var(--text);cursor:pointer}.jukebox-row:hover,.jukebox-row:focus-visible{border-color:#4de4ff73;background:#4de4ff1a;outline:none}.jk-cover{width:44px;height:44px;border-radius:8px;overflow:hidden;flex-shrink:0;display:grid;place-items:center;background:#00000059;font-size:1.1rem}.jk-cover img{width:100%;height:100%;object-fit:cover}.jk-meta{display:flex;flex-direction:column;gap:.15rem;min-width:0}.jk-meta strong{font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.jk-meta small{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#twitch-stage{position:fixed;left:50%;bottom:7.5rem;transform:translate(-50%) translateY(12px);width:min(960px,92vw);height:min(54vh,540px);z-index:25;display:flex;flex-direction:column;border-radius:14px;overflow:hidden;border:1px solid rgba(145,70,255,.55);box-shadow:0 18px 60px #000000a6,0 0 40px #9146ff40;background:#0e0a14;opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease}#twitch-stage.is-on{opacity:1;pointer-events:auto;transform:translate(-50%) translateY(0)}#twitch-stage .tw-chrome{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.45rem .65rem;background:linear-gradient(90deg,#9146ff59,#140a1ef2);border-bottom:1px solid rgba(255,255,255,.08)}#twitch-stage .tw-meta{display:flex;align-items:baseline;flex-wrap:wrap;gap:.45rem .65rem;min-width:0}#twitch-stage .tw-live{font-size:.7rem;font-weight:800;letter-spacing:.08em;color:#fff;background:#e91916;padding:.15rem .4rem;border-radius:4px}#twitch-stage .tw-title{font-size:.95rem}#twitch-stage .tw-hint{color:var(--muted);font-size:.75rem}#twitch-stage .tw-actions{display:flex;align-items:center;gap:.4rem;flex-shrink:0}#twitch-stage .tw-open{color:#d6c4ff;font-size:.8rem;text-decoration:none;padding:.25rem .45rem;border-radius:6px;border:1px solid rgba(255,255,255,.12)}#twitch-stage .tw-open:hover{background:#ffffff14}#twitch-stage .tw-close{width:2rem;height:2rem;border:0;border-radius:8px;background:#00000059;color:#fff;cursor:pointer;font-size:1rem}#twitch-stage .tw-close:hover{background:#e919168c}#twitch-stage .tw-frame-wrap{flex:1;min-height:0;background:#000}#twitch-stage .tw-frame{width:100%;height:100%;border:0;display:block}#twitch-panel{position:fixed;inset:0;z-index:30;display:grid;place-items:center;background:#06040e8c;backdrop-filter:blur(4px);pointer-events:auto}#twitch-panel[hidden]{display:none!important}.tw-panel-card{width:min(420px,92vw);background:var(--panel);border:1px solid rgba(145,70,255,.45);border-radius:16px;padding:1rem 1.1rem 1.15rem;box-shadow:0 20px 50px #0000008c}.tw-panel-card header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.tw-panel-x{border:0;background:transparent;color:var(--text);cursor:pointer;font-size:1.1rem}.tw-panel-blurb{color:var(--muted);font-size:.88rem;line-height:1.4;margin:0 0 .85rem}.tw-panel-card label{display:flex;flex-direction:column;gap:.35rem;font-size:.8rem;color:var(--muted)}.tw-panel-input{min-height:44px;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:#00000059;color:var(--text);padding:.5rem .75rem;font-size:1rem}.tw-panel-row{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.85rem}.tw-panel-go,.tw-panel-pop{min-height:40px;border-radius:10px;border:1px solid rgba(255,255,255,.14);background:#ffffff0f;color:var(--text);padding:.4rem .85rem;cursor:pointer;font-size:.9rem}.tw-panel-go.primary{background:linear-gradient(135deg,#9146ff,#772ce8);border-color:transparent;font-weight:600}.tw-panel-go:hover,.tw-panel-pop:hover{filter:brightness(1.08)}.tw-panel-tip{margin:.75rem 0 0;font-size:.78rem;color:var(--muted)}.tw-panel-tip code{color:#d6c4ff}