.toast-container[data-v-78363a44]{z-index:9999;pointer-events:none;flex-direction:column;align-items:center;gap:8px;display:flex;position:fixed;bottom:24px;left:50%;transform:translate(-50%)}.toast[data-v-78363a44]{background:var(--surface-2);border:1px solid var(--border-light);border-radius:var(--radius-md);font-size:var(--font-size-sm);color:var(--text);box-shadow:var(--shadow-md);white-space:nowrap;padding:10px 20px}.toast--error[data-v-78363a44]{border-color:var(--danger);color:#fca5a5}.toast--success[data-v-78363a44]{border-color:var(--success);color:#86efac}.toast-enter-active[data-v-78363a44]{transition:opacity .2s,transform .2s}.toast-leave-active[data-v-78363a44]{transition:opacity .25s,transform .25s}.toast-enter-from[data-v-78363a44]{opacity:0;transform:translateY(8px)}.toast-leave-to[data-v-78363a44]{opacity:0;transform:translateY(-4px)}:root{--bg:#0d0d1a;--surface:#13131f;--surface-2:#1a1a2e;--border:#2a2a4a;--border-light:#3a3a5a;--text:#e0e0f0;--text-muted:#88a;--text-faint:#55557a;--accent:#4a90d9;--accent-hover:#5aa0e9;--success:#2ecc71;--warning:#f39c12;--danger:#e74c3c;--danger-hover:#c0392b;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--radius-sm:4px;--radius-md:6px;--radius-lg:10px;--font:"Inter", "Segoe UI", system-ui, -apple-system, sans-serif;--font-size-xs:.7rem;--font-size-sm:.82rem;--font-size-base:.95rem;--font-size-lg:1.1rem;--font-size-xl:1.4rem;--font-size-2xl:2rem;--shadow-sm:0 1px 4px #0006;--shadow-md:0 4px 16px #00000080}canvas{image-rendering:pixelated;image-rendering:crisp-edges}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:var(--bg);color:var(--text);font-family:var(--font);font-size:var(--font-size-base);min-height:100vh;line-height:1.5}a{color:var(--accent);text-decoration:none}a:hover{color:var(--accent-hover)}button{cursor:pointer;font-family:var(--font)}button:disabled{opacity:.45;cursor:not-allowed}.btn{justify-content:center;align-items:center;gap:var(--space-2);font-family:var(--font);letter-spacing:.04em;border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;font-weight:600;font-size:var(--font-size-sm);border:1px solid #0000;padding:8px 18px;transition:background .15s,border-color .15s,color .15s;display:inline-flex}.btn:disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.btn--primary{background:var(--accent);color:#fff;border-color:var(--accent)}.btn--primary:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover)}.btn--ghost{color:var(--text-muted);border-color:var(--border);background:0 0}.btn--ghost:hover:not(:disabled){color:var(--text);border-color:var(--border-light);background:#ffffff0a}.btn--outline{color:var(--accent);border-color:var(--accent);background:0 0}.btn--outline:hover:not(:disabled){background:var(--accent);color:#fff}.btn--danger{background:var(--danger);color:#fff;border-color:var(--danger)}.btn--danger:hover:not(:disabled){background:var(--danger-hover);border-color:var(--danger-hover)}.btn--sm{font-size:var(--font-size-xs);padding:5px 12px}.btn--lg{font-size:var(--font-size-base);padding:11px 24px}.auth-page{min-height:100vh;padding:var(--space-6);background:radial-gradient(ellipse at 50% 0%, #4a90d914 0%, transparent 65%), var(--bg);justify-content:center;align-items:center;display:flex}.auth-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);width:100%;max-width:360px;padding:var(--space-8) var(--space-8);align-items:center;gap:var(--space-4);box-shadow:var(--shadow-md);flex-direction:column;display:flex}.auth-logo{margin-bottom:var(--space-1);font-size:2.2rem;line-height:1}.auth-title{font-size:var(--font-size-xl);color:var(--text);letter-spacing:.06em;font-weight:800}.auth-subtitle{font-size:var(--font-size-sm);color:var(--text-faint);margin-top:-8px}.auth-form{gap:var(--space-3);width:100%;margin-top:var(--space-2);flex-direction:column;display:flex}.auth-footer{font-size:var(--font-size-sm);color:var(--text-muted);margin-top:var(--space-2)}.auth-link{color:var(--accent);font-weight:600}.auth-link:hover{color:var(--accent-hover)}.lobby{padding:var(--space-8) var(--space-6);max-width:860px;margin:0 auto}.lobby-header{margin-bottom:var(--space-6);padding-bottom:var(--space-5);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;display:flex}.lobby-title{font-size:var(--font-size-xl);letter-spacing:.06em;color:var(--text);font-weight:800}.lobby-header-right{align-items:center;gap:var(--space-3);display:flex}.lobby-username{font-size:var(--font-size-sm);color:var(--text-muted)}.lobby-banner{border-radius:var(--radius-md);padding:var(--space-3) var(--space-5);font-size:var(--font-size-sm);color:var(--warning);align-items:center;gap:var(--space-3);margin-bottom:var(--space-5);background:#f39c121a;border:1px solid #f39c124d;display:flex}.lobby-banner-link{color:var(--warning);font-weight:700;text-decoration:underline}.room-list{gap:var(--space-2);flex-direction:column;display:flex}.room-list p{color:var(--text-faint);font-size:var(--font-size-sm);text-align:center;padding:var(--space-8) 0}.room-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-4) var(--space-5);cursor:pointer;justify-content:space-between;align-items:center;transition:border-color .15s,background .15s;display:flex}.room-card:hover{border-color:var(--accent);background:var(--surface-2)}.room-card--disabled{opacity:.5;cursor:default}.room-card--disabled:hover{border-color:var(--border);background:var(--surface)}.room-card-left{gap:var(--space-1);flex-direction:column;display:flex}.room-card-right{align-items:center;gap:var(--space-5);display:flex}.room-name{font-size:var(--font-size-base);color:var(--text);font-weight:600}.room-status{font-size:var(--font-size-xs);color:var(--text-faint);text-transform:uppercase;letter-spacing:.08em;font-weight:700}.room-status.waiting{color:var(--success)}.room-status.starting{color:#a78bfa}.room-status.in-progress{color:var(--warning)}.room-players-bar{flex-direction:column;align-items:flex-end;gap:4px;display:flex}.room-players-text{font-size:var(--font-size-xs);color:var(--text-muted);font-variant-numeric:tabular-nums}.room-pips{gap:3px;display:flex}.room-pip{background:var(--border);border-radius:2px;width:8px;height:8px;transition:background .15s}.room-pip--filled{background:var(--accent)}.game-view{background:#0a0f14;position:fixed;inset:0}.game-canvas-container{position:absolute;inset:0}.hud{pointer-events:none;z-index:10;position:absolute;inset:0}.hud-left{flex-direction:column;align-items:flex-start;gap:8px;display:flex;position:absolute;top:20px;left:20px}.hud-back{pointer-events:all;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff9;font-size:var(--font-size-xs);font-family:var(--font);letter-spacing:.05em;border-radius:var(--radius-sm);cursor:pointer;background:#0000008c;border:1px solid #ffffff1a;padding:6px 12px;transition:color .15s,border-color .15s}.hud-back:hover{color:#fff;filter:none;border-color:#ffffff4d}.hud-tile-count{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:var(--radius-md);background:#0000008c;border:1px solid #ffffff14;align-items:baseline;gap:6px;padding:10px 16px;display:flex}.hud-tile-num{color:#fff;letter-spacing:-.02em;font-size:1.6rem;font-weight:700;line-height:1}.hud-tile-label{font-size:var(--font-size-xs);color:#fff6;letter-spacing:.12em;font-weight:600}.hud-citizens{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:var(--radius-md);background:#0000008c;border:1px solid #ffffff14;align-items:baseline;gap:6px;padding:10px 16px;display:flex}.hud-citizens-num{color:#fff;letter-spacing:-.02em;font-size:1.6rem;font-weight:700;line-height:1}.hud-citizens-label{font-size:var(--font-size-xs);color:#fff6;letter-spacing:.12em;font-weight:600}.hud-panel{position:absolute;top:20px;right:20px}.hud-player-list{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:var(--radius-md);background:#0000008c;border:1px solid #ffffff14;min-width:180px;overflow:hidden}.hud-player-header{font-size:var(--font-size-xs);letter-spacing:.15em;color:#ffffff4d;border-bottom:1px solid #ffffff0f;padding:8px 12px 6px;font-weight:700}.hud-player-row{border-bottom:1px solid #ffffff0a;align-items:center;gap:8px;padding:7px 12px;transition:background .1s;display:flex}.hud-player-row:last-child{border-bottom:none}.hud-player-self{background:#ffffff0d}.hud-player-dead{opacity:.35}.hud-player-dead .hud-player-name{text-decoration:line-through}.hud-player-dot{border-radius:2px;flex-shrink:0;width:10px;height:10px}.hud-player-name{font-size:var(--font-size-sm);color:#dde;white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.hud-player-self .hud-player-name{color:#fff;font-weight:600}.hud-player-tiles{color:#fff6;font-variant-numeric:tabular-nums;font-size:.78rem}.hud-player-self .hud-player-tiles{color:#ffffffb3}.game-over-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:20;background:#000000bf;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.game-over-card{border-radius:var(--radius-lg);text-align:center;min-width:280px;box-shadow:var(--shadow-md);background:#0f141ef7;border:1px solid #ffffff1a;flex-direction:column;align-items:center;gap:20px;padding:48px 56px;display:flex}.game-over-result{letter-spacing:.08em;font-size:2.4rem;font-weight:800}.game-over-result.win{color:#4ade80}.game-over-result.lose{color:#f87171}.game-over-winner{color:#fff9;font-size:var(--font-size-sm);align-items:center;gap:8px;display:flex}.game-over-dot{border-radius:2px;width:10px;height:10px;display:inline-block}.game-over-btn{background:var(--accent);color:#fff;border-radius:var(--radius-sm);font-size:var(--font-size-sm);letter-spacing:.05em;cursor:pointer;pointer-events:all;font-weight:600;font-family:var(--font);border:none;margin-top:8px;padding:10px 28px;transition:background .15s}.game-over-btn:hover{background:var(--accent-hover);filter:none}.spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:32px;height:32px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.field{gap:var(--space-1);flex-direction:column;display:flex}