:root{--bg:#06071a;--panel:#0d0f28db;--line:#8c96ff2e;--text:#eef0ff;--muted:#9aa0c8;--dim:#6c7299;--accent:#7c6bff;--accent2:#3fd0f0;--bad:#ff5a6e;--gold:#ffd23f}html,body{background:var(--bg);height:100%;color:var(--text);overscroll-behavior:none;touch-action:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;margin:0;font-family:Outfit,system-ui,-apple-system,Segoe UI,sans-serif;overflow:hidden}#view{width:100%;height:100%;display:block;position:fixed;inset:0}#ui{pointer-events:none;z-index:2;position:fixed;inset:0}#ui *{box-sizing:border-box}.panel-wrap{pointer-events:auto;touch-action:pan-y;background:radial-gradient(#06071a33,#06071abf);justify-content:center;align-items:center;padding:16px;display:flex;position:absolute;inset:0;overflow-y:auto}.panel{text-align:center;background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);border-radius:18px;width:100%;max-width:440px;margin:auto;padding:26px 26px 20px;box-shadow:0 20px 80px #0009,inset 0 1px #ffffff0f}.game-title{letter-spacing:-1px;background:linear-gradient(100deg,#ff5ce0,#b26bff 35%,#3fd0f0 70%,#4fe07a);color:#0000;filter:drop-shadow(0 4px 24px #7c6bff73);-webkit-background-clip:text;background-clip:text;margin:0 0 10px;font-size:52px;font-weight:800;line-height:1}.tagline{color:#c6caf0;margin:0 0 6px;font-size:15px;line-height:1.45}.players-count{color:var(--dim);letter-spacing:1px;margin:0 0 16px;font-size:13px}.label{text-transform:uppercase;letter-spacing:2px;color:var(--dim);margin-bottom:6px;font-size:12px}.hint{color:var(--muted);margin:6px 0;font-size:13px}.hint.small{color:var(--dim);margin:6px 0 14px;font-size:12px}.controls{color:var(--dim);margin:14px 0 0;font-size:12px;line-height:1.5}.or{color:var(--dim);margin:14px 0 8px;font-size:12px}.error{min-height:18px;color:var(--muted);margin:10px 0 0;font-size:13px}.error.bad{color:var(--bad)}input{font:inherit;color:var(--text);border:1px solid var(--line);-webkit-user-select:text;user-select:text;background:#050614b3;border-radius:10px;outline:none;padding:11px 14px;font-size:16px}input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #7c6bff40}.name-input{text-align:center;width:100%;margin-bottom:12px}.join-row{gap:8px;display:flex}.code-input{text-align:center;letter-spacing:8px;text-transform:uppercase;flex:1;min-width:0;font-weight:600}.btn{font:inherit;color:var(--text);cursor:pointer;background:#7c6bff1f;border:1px solid #7c6bff59;border-radius:10px;min-height:46px;padding:11px 18px;font-size:16px;font-weight:600;transition:transform 80ms,background .15s,box-shadow .15s}.btn:hover:not(:disabled){background:#7c6bff3d}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.45;cursor:default}.btn.wide{width:100%}.btn.primary{color:#fff;background:linear-gradient(100deg,#7c4dff,#b26bff 50%,#ff5ce0);border:none;width:100%;box-shadow:0 8px 30px #b26bff59}.btn.primary:hover:not(:disabled){background:linear-gradient(100deg,#8a5cff,#c07dff 50%,#ff6fe5);box-shadow:0 10px 40px #b26bff8c}.btn.small-btn{min-height:38px;margin:6px auto 4px;font-size:14px;display:block}.btn.big{min-height:54px;margin-top:2px;font-size:19px}.play-row{gap:10px;display:flex}.play-opt{flex:1;min-width:0}.play-opt .btn.big{padding:11px 10px;font-size:17px}.play-opt .hint.small{margin:6px 0 12px}.btn.primary.solo{background:linear-gradient(100deg,#1f9fd0,#3fd0f0 50%,#4fe07a);box-shadow:0 8px 30px #3fd0f04d}.btn.primary.solo:hover:not(:disabled){background:linear-gradient(100deg,#2aaee0,#55dcf8 50%,#62ea8a);box-shadow:0 10px 40px #3fd0f080}@media (width<=420px){.play-row{flex-direction:column;gap:0}}.btn.ghost{border-color:var(--line);color:var(--muted);background:0 0;min-height:40px;margin-top:12px;font-size:14px;font-weight:400}.code-big{letter-spacing:12px;color:#fff;text-shadow:0 0 24px #7c6bffb3;margin:2px 0 4px;font-size:46px;font-weight:800}.code-big.wait{letter-spacing:0;font-size:22px;font-weight:600}.player-list{text-align:left;margin:14px 0;padding:0;list-style:none}.player-list li{border:1px solid var(--line);background:#ffffff0a;border-radius:10px;align-items:center;gap:10px;margin-bottom:6px;padding:10px 12px;font-size:16px;display:flex}.player-list li.away{opacity:.5}.dot{border-radius:4px;flex:none;width:12px;height:12px;display:inline-block;box-shadow:0 0 10px}.pname{flex:1}.tag{color:var(--muted);font-size:12px}.how{text-align:left;background:#ffffff08;border-radius:12px;margin-top:16px;padding:12px 14px}.how ul{color:#c3c7ea;margin:6px 0 0;padding-left:18px;font-size:13px;line-height:1.55}.hud,.tags{position:absolute;inset:0}.name-tag{will-change:transform;white-space:nowrap;transform-origin:50% 100%;color:#fff;background:color-mix(in srgb, var(--c) 75%, #0006);border-radius:99px;padding:3px 10px;font-size:15px;font-weight:600;position:absolute;top:0;left:0;box-shadow:0 2px 10px #00000059}.minis{align-items:flex-start;gap:8px;display:flex;position:absolute;top:12px;left:14px}.mini{border:2px solid color-mix(in srgb, var(--c) 70%, transparent);text-align:center;background:#0a0c1e73;border-radius:10px;padding:4px 6px}.mini.me{box-shadow:0 0 18px color-mix(in srgb, var(--c) 60%, transparent)}.mini.out{opacity:.45}.mini-name{color:var(--c);text-overflow:ellipsis;white-space:nowrap;max-width:76px;margin:0 auto 3px;font-size:11px;font-weight:600;overflow:hidden}.mini-board{background:#00000059;border-radius:3px;width:60px;height:72px;display:block}.mini.me .mini-board{width:75px;height:90px}.mini-stats{color:var(--muted);margin-top:3px;font-size:10px}.cross{background:#ffffffd9;border-radius:50%;width:6px;height:6px;margin:-3px 0 0 -3px;transition:transform .12s,background .12s;position:absolute;top:50%;left:50%;box-shadow:0 0 0 2px #00000059}.cross.on{background:#ffd23f;transform:scale(1.8)}.prompt{text-align:center;white-space:pre-line;color:#fff;text-shadow:0 1px 3px #000,0 0 12px #0009;font-size:16px;font-weight:600;position:absolute;top:calc(50% + 26px);left:0;right:0}.lock-hint{border:1px solid var(--line);background:#0a0c1ebf;border-radius:99px;padding:12px 26px;font-size:18px;font-weight:600;position:absolute;top:58%;left:50%;transform:translate(-50%)}.countdown{text-align:center;color:#fff;text-shadow:0 0 40px #b26bffe6,0 0 80px #3fd0f080;pointer-events:none;font-size:120px;font-weight:800;position:absolute;top:38%;left:0;right:0}.countdown.pulse{animation:.9s ease-out both pulse}@keyframes pulse{0%{opacity:0;transform:scale(1.6)}18%{opacity:1;transform:scale(1)}to{opacity:.9;transform:scale(.92)}}.toast{opacity:0;border:1px solid var(--line);pointer-events:none;background:#0d0f28d9;border-radius:99px;padding:10px 20px;font-size:17px;font-weight:600;transition:opacity .25s,transform .25s;position:absolute;top:22px;left:50%;transform:translate(-50%,-20px)}.toast.show{opacity:1;transform:translate(-50%)}.toast.bad{color:#ffd0d6;border-color:#ff5a6e99;box-shadow:0 0 30px #ff3c5059}.feed{flex-direction:column;align-items:flex-end;gap:5px;display:flex;position:absolute;top:70px;right:18px}.feed-row{color:var(--muted);border:1px solid var(--line);background:#0d0f28bf;border-radius:8px;padding:5px 12px;font-size:13px;transition:opacity .6s;animation:.25s ease-out slidein}.feed-row.mine{color:var(--text);border-color:#7c6bff8c}.feed-row.gone{opacity:0}@keyframes slidein{0%{opacity:0;transform:translate(20px)}}.banner{border:1px solid var(--line);background:#0d0f28e0;border-radius:99px;padding:10px 22px;font-size:15px;position:absolute;left:50%;transform:translate(-50%)}.banner.spectate{color:var(--muted);bottom:60px}.banner.recon{color:#ffd0d6;z-index:5;border-color:#ff5a6e99;top:70px}.help{text-align:center;color:var(--dim);font-size:13px;transition:opacity 1.5s;position:absolute;bottom:14px;left:0;right:0}.help.faded{opacity:.35}.results-wrap{pointer-events:auto;background:radial-gradient(#06071a59,#06071acc);justify-content:center;align-items:center;animation:.5s fadein;display:flex;position:absolute;inset:0}@keyframes fadein{0%{opacity:0}}.results{max-width:480px}.res-title{margin:0 0 16px;font-size:34px;font-weight:800}.res-title.win{color:var(--gold);text-shadow:0 0 30px #ffd23f99}.res-table{border-collapse:collapse;width:100%;margin-bottom:18px;font-size:15px}.res-table th{text-transform:uppercase;letter-spacing:1.5px;color:var(--dim);padding:4px 6px;font-size:11px;font-weight:600}.res-table td{border-top:1px solid var(--line);font-variant-numeric:tabular-nums;padding:8px 6px}.res-table tr.me td{background:#7c6bff1f}.res-place{color:var(--muted);font-weight:800}.res-name{text-align:left}.res-name .dot{vertical-align:-1px;margin-right:8px}.leave-game{pointer-events:auto;border:1px solid var(--line);height:40px;color:var(--text);cursor:pointer;z-index:6;background:#0d0f28b3;border-radius:12px;padding:0 14px;font-family:inherit;font-size:14px;font-weight:600;position:absolute;top:14px;right:62px}.leave-game.armed{background:#c4304a;border-color:#ff5a6e}.menu-wrap{pointer-events:auto;z-index:7;background:radial-gradient(#06071a40,#06071ab3);justify-content:center;align-items:center;padding:16px;animation:.2s fadein;display:flex;position:absolute;inset:0}.menu-panel{max-width:420px}.menu-title{margin:0 0 2px;font-size:30px;font-weight:800}.menu-how{margin-top:14px}.menu-how summary{cursor:pointer;margin:0}.btn.ghost.armed{color:#fff;background:#c4304a;border-color:#ff5a6e}.tut-card{text-align:center;pointer-events:none;z-index:4;border:2px solid var(--c,#ffd23f);max-width:560px;box-shadow:0 0 30px color-mix(in srgb, var(--c,#ffd23f) 40%, transparent), 0 10px 40px #00000080;background:#0d0f28e0;border-radius:16px;margin:0 auto;padding:12px 18px 10px;position:absolute;top:64px;left:372px;right:72px}.tut-card.pop{animation:.35s ease-out tutpop}@media (width<=860px){.tut-card{top:200px;left:16px;right:16px}}.tut-card.wait{opacity:.75}@keyframes tutpop{0%{transform:scale(1.08)}to{transform:scale(1)}}.tut-head{letter-spacing:2px;text-transform:uppercase;color:#ffd23f;margin-bottom:4px;font-size:11px;font-weight:800}.tut-text{color:#fff;font-size:19px;font-weight:600;line-height:1.45}.tut-foot{color:var(--dim);margin-top:6px;font-size:12px}kbd{min-width:1.6em;font:inherit;color:#1a1630;vertical-align:1px;background:linear-gradient(#fff,#d9dcf0);border-radius:6px;margin:0 2px;padding:1px 7px;font-size:.9em;font-weight:800;line-height:1.35;display:inline-block;box-shadow:0 2px #8a8fb0,0 3px 6px #0006}.tut-foot kbd{font-size:11px}.tut-skip{pointer-events:auto;color:var(--text);border:1px solid var(--line);background:#7c6bff33;border-radius:99px;padding:5px 16px;font:600 13px Outfit,system-ui,sans-serif}.tut-arrow{color:#ffd23f;pointer-events:none;z-index:4;text-shadow:0 0 18px #ffbe28e6,0 2px #7a4a00;will-change:transform;font-size:46px;font-weight:800;position:absolute;top:0;left:0}.mute{pointer-events:auto;border:1px solid var(--line);width:40px;height:40px;color:var(--text);cursor:pointer;z-index:6;background:#0d0f28b3;border-radius:12px;font-size:18px;position:absolute;top:14px;right:14px}.mini{position:relative}.mini.shielded:after{content:attr(data-shield);color:#bfe9ff;background:#2878dc99;border-radius:99px;padding:2px 6px;font-size:12px;font-weight:800;position:absolute;top:46%;left:50%;transform:translate(-50%,-50%)}.raid{border:1px solid var(--line);background:#0a0c1e99;border-radius:99px;align-items:center;gap:10px;padding:7px 14px;display:flex;position:absolute;top:156px;left:14px}.raid-label{letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);font-size:12px;font-weight:800}.raid-pips{gap:5px;display:flex}.pip{background:#ffffff1a;border:1px solid #fff3;border-radius:4px;width:14px;height:14px}.pip.on{background:linear-gradient(135deg,#ff5ce0,#b26bff);border-color:#ffb0f0;box-shadow:0 0 10px #ff5ce0cc}.raid-bar{background:#ffffff1a;border-radius:3px;width:70px;height:6px;overflow:hidden}.raid-fill{background:#ffd23f;height:100%;transition:width .3s}.raid-text{color:var(--muted);min-width:110px;font-size:12px}.combo-pill{color:#3a2a00;background:#ffd23f;border-radius:99px;padding:2px 9px;font-size:12px;font-weight:800;box-shadow:0 0 12px #ffd23fb3}.combo-big{text-align:center;pointer-events:none;opacity:0;letter-spacing:2px;color:#ffd23f;text-shadow:0 0 24px #ffa028e6,0 3px #7a4a00;font-size:54px;font-weight:800;position:absolute;top:30%;left:0;right:0}.combo-big.pop{animation:1.1s ease-out both combo}@keyframes combo{0%{opacity:0;transform:scale(1.8)}15%{opacity:1;transform:scale(1)}75%{opacity:1}to{opacity:0;transform:translateY(-30px)}}#rotate{z-index:20;text-align:center;background:var(--bg);color:var(--text);justify-content:center;align-items:center;padding:24px;font:700 22px Outfit,system-ui,sans-serif;display:none;position:fixed;inset:0}.stick-zone{pointer-events:auto;touch-action:none;width:50%;display:none;position:absolute;top:90px;bottom:0}.stick-zone.left{left:0}.stick-zone.right{right:0}.stick-base{background:#0a0c1e40;border:2px solid #ffffff59;border-radius:50%;width:104px;height:104px;margin:-52px 0 0 -52px;display:none;position:fixed}.stick-base.on{display:block}.stick-knob{background:#ffffff80;border-radius:50%;width:46px;height:46px;margin:-23px 0 0 -23px;position:absolute;top:50%;left:50%}.tbtns{pointer-events:none;width:210px;height:170px;position:absolute;bottom:18px;right:18px}.tbtn{pointer-events:auto;touch-action:none;color:#fff;text-align:center;background:#0a0c1e80;border:2px solid #ffffff73;border-radius:50%;justify-content:center;align-items:center;padding:0;font:700 13px/1.1 Outfit,system-ui,sans-serif;display:flex;position:absolute}.tbtn:active{background:#7c6bff8c}.tbtn.off{opacity:.3}.tbtn.act{background:#7c4dff8c;border-color:#c9b8ff;width:96px;height:96px;font-size:15px;bottom:0;right:0}.tbtn.act.raid{background:#ff5ce099;border-color:#ffb0f0}.tbtn.rotate{width:60px;height:60px;font-size:26px;bottom:6px;right:108px}.tbtn.push{width:62px;height:62px;bottom:108px;right:18px}.tbtn.put{width:56px;height:56px;font-size:11px;bottom:82px;right:96px}@media (height<=500px){.panel{padding:14px 18px 12px}.game-title{font-size:34px}.tagline{font-size:13px}.minis{gap:5px;top:8px;left:8px}.mini-board{width:40px;height:48px}.mini.me .mini-board{width:50px;height:60px}.mini-name{max-width:54px;font-size:10px}.mini-stats{display:none}.raid{gap:6px;padding:5px 10px;top:auto;bottom:14px;left:14px}.raid-text,.help{display:none}.feed{top:8px;right:60px}.feed-row{padding:3px 8px;font-size:11px}.toast{font-size:14px;top:64px}.prompt{font-size:13px}.countdown{font-size:80px}.combo-big{font-size:36px}.mute{width:36px;height:36px;top:8px;right:8px}.leave-game{height:36px;padding:0 10px;font-size:13px;top:8px;right:52px}.tut-card{max-width:460px;padding:6px 12px 5px;top:8px;left:250px;right:130px}.tut-text{font-size:14px}.tut-head{margin-bottom:2px;font-size:10px}.tut-arrow{font-size:34px}}