:root{--bg: #05060c;--panel: rgba(10, 14, 28, .82);--line: rgba(120, 190, 255, .22);--line-strong: rgba(120, 220, 255, .55);--text: #dbe7ff;--dim: #7f8cb0;--aqua: #47ffdb;--magenta: #ff4d9e;--amber: #ffc73d;--danger: #ff5a72;--radius: 10px;--font: "Chakra Petch", ui-monospace, "SF Mono", Menlo, "Hiragino Sans", "Noto Sans CJK JP", "Noto Sans CJK TC", "Microsoft JhengHei", "Malgun Gothic", monospace}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:var(--font);overflow:hidden;overscroll-behavior:none;-webkit-tap-highlight-color:transparent}#app{position:fixed;inset:0}canvas#stage{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}.overlay{position:fixed;inset:0;display:grid;place-items:center;padding:max(16px,env(safe-area-inset-top)) 16px max(16px,env(safe-area-inset-bottom));pointer-events:none}.overlay>*{pointer-events:auto}.panel{width:min(440px,100%);max-height:100%;overflow-y:auto;background:var(--panel);backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:16px;padding:22px;box-shadow:0 0 0 1px #00000080,0 24px 70px #000000a6,inset 0 1px #ffffff0d}h1.logo{margin:0 0 4px;font-size:clamp(30px,9vw,46px);font-weight:700;letter-spacing:.14em;text-align:center;color:#eafcff;text-shadow:0 0 12px rgba(71,255,219,.55),0 0 42px rgba(71,255,219,.28)}p.tagline{margin:0 0 20px;text-align:center;color:var(--dim);font-size:13px;letter-spacing:.04em}label.field{display:block;margin-bottom:14px}label.field>span{display:block;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);margin-bottom:6px}input,select{width:100%;padding:11px 12px;font:inherit;font-size:15px;color:var(--text);background:#060a16cc;border:1px solid var(--line);border-radius:var(--radius);outline:none}input:focus,select:focus{border-color:var(--line-strong);box-shadow:0 0 0 3px #47ffdb1a}input.pin{text-align:center;letter-spacing:.42em;font-size:24px;font-weight:700;text-transform:uppercase}.row{display:flex;gap:10px}.row>*{flex:1}button{font:inherit;font-size:14px;font-weight:600;letter-spacing:.06em;color:var(--text);background:#141e36d9;border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px;cursor:pointer;transition:border-color .15s,background .15s,transform .06s}button:hover:not(:disabled){border-color:var(--line-strong);background:#1c2a4ae6}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.45;cursor:not-allowed}button.primary{color:#04231f;background:linear-gradient(180deg,#6effe0,#22cfae);border-color:#78ffe6cc;box-shadow:0 0 24px #47ffdb47}button.primary:hover:not(:disabled){background:linear-gradient(180deg,#8bffe8,#33e0bd)}button.ghost{background:transparent}button.tiny{padding:7px 10px;font-size:12px}.sep{display:flex;align-items:center;gap:10px;margin:16px 0;color:var(--dim);font-size:11px;letter-spacing:.2em}.sep:before,.sep:after{content:"";flex:1;height:1px;background:var(--line)}.error{margin:0 0 12px;padding:9px 11px;font-size:13px;color:#ffd8de;background:#ff5a7221;border:1px solid rgba(255,90,114,.4);border-radius:var(--radius)}.hud{position:fixed;inset:0;pointer-events:none}.name-tag{position:absolute;transform:translate(-50%,-50%);font-size:11px;font-weight:600;letter-spacing:.08em;white-space:nowrap;text-align:center;text-shadow:0 0 8px rgba(0,0,0,.95),0 1px 2px #000;transition:opacity .3s}.name-tag .nick{display:block}.name-tag .hearts{display:block;font-size:13px;letter-spacing:.12em;margin-top:1px}.name-tag.dead{opacity:.3;text-decoration:line-through}.name-tag.me .nick{font-size:12px}.topbar{position:fixed;top:max(10px,env(safe-area-inset-top));left:50%;transform:translate(-50%);display:flex;align-items:center;white-space:nowrap;gap:14px;font-size:11px;letter-spacing:.1em;color:var(--dim);background:#05081299;border:1px solid var(--line);border-radius:999px;padding:5px 14px;pointer-events:auto}.topbar b{color:var(--text);font-weight:600}.topbar .warn{color:var(--amber)}.topbar .bad{color:var(--danger)}.countdown{position:fixed;inset:0;display:grid;place-items:center;font-size:clamp(72px,26vw,200px);font-weight:700;color:#eafcff;text-shadow:0 0 30px rgba(71,255,219,.7),0 0 90px rgba(71,255,219,.35);pointer-events:none}.banner{position:fixed;bottom:max(128px,calc(env(safe-area-inset-bottom) + 118px));left:50%;transform:translate(-50%);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);background:#050812b3;border:1px solid var(--line);border-radius:999px;padding:7px 16px;white-space:nowrap}.banner.danger{color:#ffd8de;border-color:#ff5a728c;background:#ff5a7229;animation:pulse 1.1s ease-in-out infinite}@keyframes pulse{50%{opacity:.55}}.touch-zones{position:fixed;inset:0;display:flex;pointer-events:none}.touch-zones div{flex:1;pointer-events:auto;display:grid;place-items:end center;padding-bottom:max(26px,env(safe-area-inset-bottom));font-size:30px;color:#dbe7ff38;user-select:none}.touch-zones div:active{background:#47ffdb12;color:#47ffdb99}.pin-display{display:flex;justify-content:center;gap:7px;margin:6px 0 14px}.pin-display span{width:40px;height:52px;display:grid;place-items:center;font-size:26px;font-weight:700;color:var(--aqua);background:#47ffdb0f;border:1px solid rgba(71,255,219,.3);border-radius:8px;text-shadow:0 0 14px rgba(71,255,219,.6)}.players{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:7px}.players li{display:flex;align-items:center;gap:9px;padding:9px 11px;font-size:13px;background:#060a1699;border:1px solid var(--line);border-left:3px solid var(--slot, var(--dim));border-radius:8px}.players li .grow{flex:1}.players li .badge{font-size:10px;letter-spacing:.1em;padding:2px 6px;border-radius:4px;background:#78beff1f;color:var(--dim)}.players li .badge.ready{color:var(--aqua);background:#47ffdb24}.settings{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}.settings label.field{margin:0}.toggle{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--dim);cursor:pointer}.toggle input{width:auto}table.board{width:100%;border-collapse:collapse;font-size:13px}table.board th{text-align:left;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);padding:6px 8px;border-bottom:1px solid var(--line)}table.board td{padding:8px;border-bottom:1px solid rgba(120,190,255,.08)}table.board td.num{text-align:right;font-variant-numeric:tabular-nums}table.board tr.me td{color:var(--aqua)}.standings{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:6px}.standings li{display:flex;align-items:center;gap:10px;padding:10px 12px;font-size:14px;background:#060a1699;border:1px solid var(--line);border-radius:8px}.standings li.first{border-color:#ffc73d8c;background:#ffc73d14}.standings li .place{width:26px;font-weight:700;color:var(--dim)}.standings li.first .place{color:var(--amber)}.standings li .grow{flex:1}.small{font-size:12px;color:var(--dim)}.center{text-align:center}.mt{margin-top:14px}.spinner{width:30px;height:30px;margin:0 auto 12px;border:2px solid rgba(71,255,219,.2);border-top-color:var(--aqua);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:480px){.panel{padding:18px;border-radius:14px}.settings{grid-template-columns:1fr}.topbar{gap:9px;padding:4px 10px;font-size:10px}.pin-display span{width:36px;height:46px;font-size:22px}}