*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}button,input,select,textarea{font:inherit}:root{--bg: #05050a;--surface: #0e0e18;--border: #6600aa;--accent: #ff0077;--accent-text: #ff66aa;--text: #ffffff;--muted: #d0c8e0;--focus: #00ffdd;--gold: #ffd700;--danger: #ef5350;--success: #4caf50;--castle: #00ff66;--on-accent: #000;--glass: rgba(15, 15, 19, .82);--hairline: rgba(255, 255, 255, .08);--r-sm: .25rem;--r-md: .5rem;--r-lg: .875rem;--r-pill: 999px;--s-1: .25rem;--s-2: .5rem;--s-3: .75rem;--s-4: 1rem;--s-5: 1.5rem;--s-6: 2rem;--fs-xs: .75rem;--fs-sm: .875rem;--fs-md: 1rem;--fs-lg: 1.125rem;--fs-xl: 1.5rem;--fs-2xl: 2rem;--fs-3xl: 2.75rem;--fw-strong: 700;--elev-1: 0 1px 3px rgba(0, 0, 0, .35);--elev-2: 0 4px 16px rgba(0, 0, 0, .45);--elev-3: 0 10px 48px rgba(0, 0, 0, .6);--glow: 0 0 12px rgba(255, 0, 119, .45);--z-bg: 0;--z-hud: 10;--z-fab: 20;--z-nav: 40;--z-auth: 50;--z-result: 90;--z-overlay: 100}html,body{height:100%;background:var(--bg);color:var(--text);font-family:Segoe UI,system-ui,sans-serif;font-size:16px;font-weight:450;line-height:1.5}h1,h2,h3,h4,th,strong,b{font-weight:var(--fw-strong)}button{font-weight:600}:focus-visible{outline:2px solid var(--focus);outline-offset:2px}button:focus-visible{outline:2px solid var(--focus);outline-offset:2px}input:focus-visible{outline:2px solid var(--focus);outline-offset:1px}#bg-layer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--z-bg);pointer-events:none;background-color:var(--bg)}#bg-layer:before,#bg-layer:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0}#bg-layer:before{opacity:0;background-repeat:repeat}#bg-layer:after{background:radial-gradient(125% 125% at 50% 45%,transparent 48%,rgba(0,0,0,.72) 100%)}#app{height:100%;display:flex;flex-direction:column;position:relative;z-index:1}body[data-route=lobby] #bg-layer,body[data-route=review] #bg-layer{background-image:radial-gradient(90% 65% at 50% -10%,var(--lobby-glow, rgba(255, 0, 119, .2)),transparent 62%),radial-gradient(60% 45% at 12% 105%,var(--lobby-glow, rgba(255, 0, 119, .14)),transparent 70%),radial-gradient(55% 40% at 92% 88%,var(--lobby-glow, rgba(255, 0, 119, .1)),transparent 72%)}body[data-route=lobby] #bg-layer:before{opacity:.5;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cg fill='%23ffffff' fill-opacity='0.035'%3E%3Crect x='8' y='70' width='26' height='50'/%3E%3Crect x='8' y='62' width='6' height='10'/%3E%3Crect x='20' y='62' width='6' height='10'/%3E%3Crect x='52' y='84' width='22' height='36'/%3E%3Crect x='52' y='77' width='5' height='9'/%3E%3Crect x='63' y='77' width='5' height='9'/%3E%3Crect x='90' y='60' width='24' height='60'/%3E%3Crect x='90' y='52' width='6' height='10'/%3E%3Crect x='102' y='52' width='6' height='10'/%3E%3C/g%3E%3C/svg%3E");background-position:0 100%;background-repeat:repeat-x}body[data-route=review] #bg-layer{filter:saturate(.55)}body[data-route=game] #bg-layer,body[data-route=local] #bg-layer,body[data-route=solo] #bg-layer{background-color:var(--board-dark, var(--bg))}body[data-route=game] #bg-layer:before,body[data-route=local] #bg-layer:before,body[data-route=solo] #bg-layer:before{opacity:1;background-image:linear-gradient(45deg,var(--board-mix, transparent) 25%,transparent 25%,transparent 75%,var(--board-mix, transparent) 75%),linear-gradient(45deg,var(--board-mix, transparent) 25%,transparent 25%,transparent 75%,var(--board-mix, transparent) 75%);background-size:64px 64px;background-position:0 0,32px 32px;opacity:.5}@media (prefers-reduced-motion: no-preference){body[data-route=lobby] #bg-layer:before{animation:bg-drift-x 90s linear infinite}}@keyframes bg-drift-x{0%{background-position:0 100%}to{background-position:120px 100%}}@keyframes bg-drift{0%{background-position:0 0}to{background-position:160px 160px}}.view{flex:1;display:flex;flex-direction:column}.hidden{display:none!important}.top-tools{position:fixed;top:calc(var(--s-3) + env(safe-area-inset-top,0px));right:calc(var(--s-4) + env(safe-area-inset-right,0px));display:flex;align-items:center;gap:var(--s-2);z-index:var(--z-nav)}body[data-route=game] .top-tools,body[data-route=local] .top-tools,body[data-route=solo] .top-tools,body[data-route=review] .top-tools{display:none}body[data-route=game],body[data-route=local],body[data-route=solo],body[data-route=review]{overflow:hidden}.view-pending{margin:auto;color:var(--muted);font-size:var(--fs-lg)}#view-lobby{align-items:center;justify-content:flex-start;gap:1.5rem;padding:2rem 1.5rem}.lobby-header{text-align:center;display:flex;flex-direction:column;align-items:center;gap:.25rem}.lobby-demos{display:flex;justify-content:center;margin:.5rem 0}.lobby-demo{margin:0}.lobby-demo-board{position:relative;width:340px;height:215px;border-radius:8px;overflow:hidden}.lobby-demo-canvas{width:100%;height:100%}.lobby-minimap{position:absolute;top:.4rem;right:.4rem;width:76px;height:76px;z-index:2;border-radius:5px;overflow:hidden;border:1px solid rgba(255,255,255,.14);box-shadow:0 2px 8px #00000073}.lobby-minimap .demo-board{background:#08080cd1;border-radius:5px;gap:1px;padding:1px}.lobby-demo .compass{position:absolute;bottom:.3rem;left:.3rem;display:flex;align-items:center;gap:.2rem;z-index:2}.lobby-demo .compass-svg{width:38px;height:38px}.lobby-demo .compass-ccw,.lobby-demo .compass-cw{width:20px;height:20px;font-size:.7rem}.demo-board{display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(7,1fr);gap:2px;width:100%;height:100%;background:#ffffff14;border-radius:8px;padding:2px}.demo-cell{background:var(--surface);display:flex;flex-direction:column-reverse;gap:0;padding:0;border-radius:1px;border:1px solid transparent}.demo-cell.demo-castle{border-color:#00ff6645;background:#00ff660f}.demo-cell.demo-crowned{box-shadow:inset 0 0 4px #ffd70080;border-color:var(--gold)}.demo-slot{flex:1;min-height:0;border-radius:0}#view-lobby h1{font-size:3rem;letter-spacing:.15em;text-transform:uppercase;color:var(--lobby-accent, var(--accent));margin-bottom:.15rem}.lobby-tagline{font-size:.85rem;letter-spacing:.25em;text-transform:uppercase;color:var(--muted);margin:0 0 .35rem}.auth-bar{z-index:var(--z-auth)}.auth-bar:empty{display:none}.auth-profile-btn{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:#ffffff14;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:border-color .15s,background .15s;overflow:hidden}.auth-profile-btn:hover{border-color:var(--lobby-accent, var(--text));background:#ffffff24}.auth-profile-logged-in{border-color:var(--lobby-accent, var(--accent))}.auth-profile-btn .auth-avatar{width:100%;height:100%;object-fit:cover}.auth-dropdown{position:absolute;top:calc(100% + .5rem);right:0;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:.75rem 1rem;display:flex;flex-direction:column;align-items:center;gap:.5rem;box-shadow:0 4px 20px #00000080;min-width:140px}.auth-avatar-placeholder{width:100%;height:100%;background:#ffffff1f}.auth-name{font-size:.8rem;color:var(--text);max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center}.auth-signout{font-size:.75rem;padding:.3rem .75rem;border-radius:999px;border:1px solid rgba(255,255,255,.15);background:transparent;color:var(--muted);cursor:pointer;width:100%}.auth-signout:hover{color:var(--text);border-color:var(--text)}.lobby-form{display:flex;flex-direction:column;gap:.75rem;width:100%;max-width:340px;background:#0e0e1880;border:1px solid var(--lobby-accent, var(--border));border-radius:12px;padding:1.25rem}.lobby-form input{padding:.75rem 1rem;border:1px solid var(--lobby-accent, var(--border));border-radius:6px;background:var(--bg);color:var(--lobby-text, var(--text));font-size:1rem;min-height:44px}.pick-color-label{font-size:.8rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.12em;text-align:center;margin:0}.lobby-actions{display:flex;flex-direction:column;gap:.5rem;margin-top:.25rem}.btn{padding:.75rem;border:none;border-radius:var(--r-md);background:var(--lobby-accent, var(--accent));color:var(--on-accent);font-size:var(--fs-md);cursor:pointer;min-height:44px;transition:filter .15s,transform .1s,background .15s,color .15s,border-color .15s}.btn:hover{filter:brightness(1.15)}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none;filter:none}#btn-create{font-size:1.05rem;letter-spacing:.04em}.btn-secondary{background:transparent;border:1px solid var(--lobby-accent, var(--accent));color:var(--lobby-accent, var(--accent))}.btn-secondary:hover{background:var(--lobby-accent, var(--accent));color:var(--on-accent);filter:none}.btn-ghost{background:transparent;border:1px solid var(--hairline);color:var(--muted)}.btn-ghost:hover{background:transparent;border-color:var(--lobby-accent, var(--accent));color:var(--text);filter:none}.btn-icon{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;min-height:0;padding:0;border-radius:50%;border:1px solid var(--border);background:transparent;color:var(--text);cursor:pointer}.btn-icon:hover{border-color:var(--lobby-accent, var(--accent));filter:none}.lobby-divider{width:60px;height:1px;background:var(--lobby-accent, var(--border));opacity:.4}.local-setup{display:flex;flex-direction:column;gap:.75rem;width:100%;max-width:340px;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:1rem}.local-setup input{padding:.75rem 1rem;border:1px solid var(--lobby-accent, var(--border));border-radius:6px;background:var(--bg);color:var(--lobby-text, var(--text));font-size:1rem;min-height:44px}.local-setup button{padding:.75rem;border:none;border-radius:6px;background:var(--lobby-accent, var(--accent));color:var(--on-accent);font-size:1rem;cursor:pointer;min-height:44px}.local-setup button:hover{filter:brightness(1.15)}.lobby-secondary-row{display:flex;gap:.5rem}.lobby-secondary-row button{flex:1}.local-player-row{display:flex;align-items:center;gap:.75rem}.local-player-label{font-size:.9rem;font-weight:700;color:var(--muted);width:24px;flex-shrink:0}.color-picker{display:grid;grid-template-columns:repeat(6,32px);gap:.4rem;justify-content:center}.create-picker{grid-template-columns:repeat(6,42px);gap:.5rem}.create-picker .color-swatch{width:42px;height:42px;box-shadow:0 2px 8px #0000004d}.color-swatch{width:32px;height:32px;border-radius:50%;border:none;outline:2px solid transparent;outline-offset:2px;cursor:pointer;padding:0;transition:transform .1s,outline-color .1s}.color-swatch:hover{transform:scale(1.15)}.color-swatch.selected{outline-color:var(--gold);transform:scale(1.15)}.match-list{width:100%;max-width:500px;display:flex;flex-direction:column;gap:.5rem}.match-tabs{display:flex;gap:.35rem;margin-bottom:.5rem;justify-content:center}.match-tab{padding:.45rem 1.1rem;border:1px solid rgba(255,255,255,.08);border-radius:999px;background:transparent;color:var(--muted);cursor:pointer;font-size:.85rem;min-height:36px;letter-spacing:.04em;transition:background .15s,color .15s,border-color .15s}.match-tab:hover:not(.active){border-color:var(--lobby-accent, var(--border));color:var(--text)}.match-tab.active{background:var(--lobby-accent, var(--accent));color:var(--on-accent);border-color:var(--lobby-accent, var(--accent))}.player-dot{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:.35rem;vertical-align:middle}.vs{color:var(--muted);font-size:.9rem;margin:0 .35rem}.in-progress-tag{font-size:.875rem;color:var(--muted);white-space:nowrap}.enter-btn{padding:.5rem .9rem;border:1px solid var(--border);border-radius:5px;background:transparent;color:var(--muted);cursor:pointer;font-size:1rem;white-space:nowrap;min-height:40px}.enter-btn:hover{border-color:var(--text);color:var(--text)}.match-item{display:flex;align-items:center;justify-content:space-between;padding:.85rem 1rem;background:var(--surface);border:1px solid var(--border);border-radius:8px;min-height:52px}.match-item-info{display:flex;flex-direction:column;gap:.1rem;flex:1}.match-host{font-weight:600;font-size:1rem}.match-count{color:var(--muted);font-size:.9rem}.match-item-actions{display:flex;align-items:center;gap:.6rem}.join-color-wrap{position:relative}.join-color-trigger{width:36px;height:36px;border-radius:6px!important;cursor:pointer;border:2px solid var(--border)!important;outline:none!important;flex-shrink:0}.join-color-trigger:hover{border-color:var(--gold)!important;transform:none}.join-color-popup{position:absolute;right:0;top:calc(100% + 6px);z-index:var(--z-overlay);background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:.5rem;box-shadow:0 4px 20px #00000080;grid-template-columns:repeat(6,22px);gap:.3rem;justify-content:center}.join-color-popup:not(.hidden){display:grid}.match-item .join-btn{padding:.5rem .9rem;border:1px solid var(--lobby-accent, var(--accent));border-radius:5px;background:transparent;color:var(--lobby-accent, var(--accent));cursor:pointer;font-size:1rem;white-space:nowrap;min-height:40px}.match-item .join-btn:hover{background:var(--lobby-accent, var(--accent));color:var(--on-accent)}.match-item .cancel-btn{padding:.5rem .9rem;border:1px solid var(--danger);border-radius:5px;background:transparent;color:var(--danger);cursor:pointer;font-size:1rem;white-space:nowrap;min-height:40px}.match-item .cancel-btn:hover{background:var(--danger);color:var(--on-accent)}.own-tag{color:var(--muted);font-size:.9rem;font-weight:400}.match-item button:hover{background:var(--lobby-accent, var(--accent));color:var(--on-accent)}.active-match{flex-direction:column;gap:.35rem;padding:.6rem .75rem}.active-top-row{display:flex;justify-content:space-between;align-items:center}.active-stats-row{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.active-player-col{display:flex;flex-direction:column;gap:.2rem}.active-col-header{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.active-col-stats{display:flex;gap:.4rem;flex-wrap:wrap}.active-stat{font-size:.875rem;color:var(--muted);white-space:nowrap}#view-game{position:relative;z-index:0;overflow:hidden}#canvas-container{flex:1;width:100%;min-height:0;position:relative;overflow:hidden}#canvas-container canvas{position:absolute;top:0;right:0;bottom:0;left:0;display:block;width:100%!important;height:100%!important}#canvas-container canvas{cursor:pointer}#canvas-container{touch-action:none}#game-fab{position:absolute;bottom:1.5rem;right:1.5rem;z-index:var(--z-fab)}#fab-trigger{width:48px;height:48px;border-radius:50%;border:1px solid var(--player-color, var(--border));background:#0f0f13e0;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--text);font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;box-shadow:0 2px 14px #00000073;transition:background .15s,border-color .15s}#fab-trigger:hover{background:#282838f2;border-color:var(--accent)}#fab-menu{position:absolute;bottom:calc(100% + .5rem);right:0;display:flex;flex-direction:column-reverse;align-items:flex-end;gap:.4rem;transition:opacity .15s,transform .15s;transform-origin:bottom right}#fab-menu.hidden{opacity:0;pointer-events:none;transform:scaleY(.7) translateY(8px)}.fab-row{display:flex;align-items:center;gap:.55rem}.fab-item{width:42px;height:42px;border-radius:50%;border:1px solid var(--player-color, var(--border));background:#0f0f13d1;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--muted);font-size:1.1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;line-height:1;flex-shrink:0;transition:color .15s,border-color .15s,background .15s}.fab-item:hover{color:var(--text);border-color:var(--accent)}.fab-label{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:#0f0f13b8;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:.28rem .65rem;border-radius:999px;white-space:nowrap;cursor:pointer;border:1px solid rgba(255,255,255,.06)}#hud-room-bar{position:absolute;top:0;left:50%;transform:translate(-50%);display:flex;flex-direction:row;align-items:stretch;background:#0f0f1399;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid var(--player-color, rgba(58,58,78,.5));border-top:none;border-bottom-left-radius:8px;border-bottom-right-radius:8px;z-index:var(--z-hud);white-space:nowrap;min-width:300px}.hud-center{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:.3rem .75rem .35rem;border-left:1px solid rgba(58,58,78,.5);border-right:1px solid rgba(58,58,78,.5);gap:.1rem;flex:1;pointer-events:none}#hud-room{font-size:.7rem;color:var(--muted);letter-spacing:.06em;text-transform:uppercase}.hud-title{font-size:.75rem;font-weight:800;letter-spacing:.18em;transition:color .3s ease}.hud-side{display:flex;flex-direction:row;align-items:center;gap:.4rem;padding:.35rem .5rem;transition:opacity .25s ease;pointer-events:none}.hud-side-left{padding-left:0}.hud-side-right{flex-direction:row-reverse;padding-right:0}.hud-side:not(.hud-side-active){opacity:.5}.hud-color-bar{width:3px;align-self:stretch;border-radius:2px;flex-shrink:0;transition:box-shadow .25s ease}.hud-side.hud-side-active .hud-color-bar{box-shadow:0 0 8px 2px var(--side-color, var(--accent))}.hud-stats-row{display:flex;gap:.55rem;align-items:center}.hud-stat{font-size:.8rem;color:var(--muted);white-space:nowrap;display:flex;align-items:center;gap:.25rem}.hud-icon{display:inline-block;width:9px;height:9px;border-radius:2px;flex-shrink:0}.view>.compass{position:absolute;bottom:1.5rem;left:1.5rem;display:flex;align-items:center;gap:.4rem;z-index:9;pointer-events:auto}.board-dir{position:absolute;z-index:8;font-size:var(--fs-xs);font-weight:700;letter-spacing:.08em;color:#ffffff4d;pointer-events:none;text-transform:uppercase}.compass-svg{width:60px;height:60px;cursor:default}.compass-ccw,.compass-cw{width:32px;height:32px;border:1px solid var(--player-color, var(--border));border-radius:50%;background:#0f0f13b3;color:var(--muted);font-size:.9rem;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1}.compass-dir{cursor:pointer}.compass-dir text{fill:#888;transition:fill .15s}.compass-dir:hover text,.compass-dir:focus-visible text{fill:var(--accent)}.compass-dir:focus{outline:none}.compass-dir:focus-visible circle{stroke:var(--accent);stroke-width:1.5}.compass-ccw:hover,.compass-cw:hover{background:var(--accent);border-color:var(--accent)}#action-bar{position:absolute;left:50%;bottom:1.25rem;z-index:var(--z-hud);display:flex;align-items:center;flex-wrap:wrap;gap:.35rem;width:max-content;max-width:min(900px,calc(100vw - 2rem));padding:.4rem .5rem;background:#1a1a249e;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--player-color, rgba(58, 58, 78, .5));border-radius:12px;box-shadow:0 6px 26px #00000073;opacity:0;pointer-events:none;transform:translate(-50%) translateY(calc(100% + 2rem));transition:transform .22s cubic-bezier(.2,.8,.2,1),opacity .16s linear}#action-bar.open{opacity:1;pointer-events:auto;transform:translate(-50%) translateY(0)}.action-bar-info{font-size:.85rem;color:var(--muted);padding:0 .5rem 0 .35rem;white-space:nowrap}#action-bar button{flex:1 1 auto;min-width:5.5rem;min-height:40px;padding:.5rem .8rem;text-align:center;background:transparent;border:none;border-radius:7px;color:var(--text);cursor:pointer;font-size:.95rem;white-space:nowrap}#action-bar button:hover:not(:disabled){background:var(--accent);color:var(--on-accent)}#action-bar button:disabled{cursor:default;opacity:.45;color:var(--muted)}#action-bar button.unavailable{opacity:.3;text-decoration:line-through}#action-bar button.pending{background:var(--accent);color:var(--on-accent);outline:2px solid var(--gold);outline-offset:-2px}@media (prefers-reduced-motion: reduce){#action-bar{transition:opacity .12s linear}}.fly-2d{position:absolute;border-radius:2px;pointer-events:none;will-change:transform,opacity;transition:transform var(--fly-dur, .26s) cubic-bezier(.2,.7,.3,1),opacity .12s linear}.help-btn{width:44px;height:44px;border-radius:50%;border:1px solid var(--player-color, var(--border));background:#0f0f13bf;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--player-color, var(--muted));font-size:1.3rem;font-weight:700;cursor:pointer;z-index:var(--z-hud);display:flex;align-items:center;justify-content:center;line-height:1}.help-btn:hover{color:var(--text);border-color:var(--text)}.mute-btn{width:44px;height:44px;border-radius:50%;border:1px solid var(--border);background:#0f0f13bf;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font-size:1.1rem;cursor:pointer;z-index:var(--z-hud);display:flex;align-items:center;justify-content:center;line-height:1}.mute-btn:hover{border-color:var(--text)}.lobby-form .lobby-help-btn{width:100%;height:auto;border-radius:8px;padding:.55rem 1rem;font-size:.85rem;letter-spacing:.06em;border:1px solid rgba(255,255,255,.18);color:#fff;background:#ffffff14;margin-top:.25rem}.lobby-form .lobby-help-btn:hover{color:var(--lobby-accent, var(--text));border-color:var(--lobby-accent, var(--border));background:#ffffff1f}.lobby-form .lobby-help-btn.highlight{animation:help-pulse 2s ease-in-out infinite;border-color:var(--lobby-accent, var(--text));color:#fff;background:#ffffff1a}@keyframes help-pulse{0%,to{box-shadow:0 0 #ffffff4d}50%{box-shadow:0 0 12px 4px #ffffff26}}.btn-advanced-toggle{width:100%;border-radius:8px;padding:.5rem 1rem;font-size:.8rem;letter-spacing:.06em;border:1px solid rgba(255,255,255,.12);color:var(--muted);background:transparent;cursor:pointer;transition:color .15s,border-color .15s;position:relative}.btn-advanced-toggle:after{content:"▾";margin-left:.4em;display:inline-block;transition:transform .25s ease}.btn-advanced-toggle.open:after{transform:rotate(180deg)}.btn-advanced-toggle:hover{color:var(--text);border-color:#ffffff40}.advanced-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease;overflow:hidden}.advanced-panel>*{overflow:hidden}.advanced-panel.open{grid-template-rows:1fr}.advanced-inner{display:flex;flex-direction:column;gap:.6rem;padding-top:.6rem}.advanced-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.advanced-row label{font-size:.78rem;color:var(--muted);letter-spacing:.04em;white-space:nowrap}.advanced-val{font-size:.78rem;color:var(--text);min-width:1.2em;text-align:center}.advanced-row input[type=range]{flex:1;max-width:120px;accent-color:var(--lobby-accent, var(--accent));height:4px;cursor:pointer}.view-toggle{display:flex;border:1px solid rgba(255,255,255,.15);border-radius:6px;overflow:hidden}.view-toggle-btn{padding:.3rem .7rem;font-size:.75rem;font-weight:700;border:none;background:transparent;color:var(--muted);cursor:pointer;transition:background .15s,color .15s;min-height:0}.lobby-form .view-toggle-btn{background:transparent;color:var(--muted);min-height:0;padding:.3rem .7rem;font-size:.75rem}.lobby-form .view-toggle-btn.active,.view-toggle-btn.active{background:var(--lobby-accent, var(--accent));color:var(--on-accent)}.lobby-form .view-toggle-btn:hover:not(.active),.view-toggle-btn:hover:not(.active){color:var(--text);background:#ffffff14}#help-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--z-overlay);display:flex;align-items:center;justify-content:center}.help-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#0009}.help-modal{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:1.5rem 2rem;max-width:min(56rem,calc(100vw - 2rem));width:calc(100vw - 2rem);max-height:calc(100vh - 2rem);max-height:calc(100dvh - 2rem);overflow-y:auto;box-shadow:var(--elev-3)}.help-modal h2{color:var(--accent-text);font-size:1.4rem;margin-bottom:.75rem}.help-modal h3{color:var(--text);font-size:1.05rem;margin-top:1rem;margin-bottom:.35rem}.help-body p{font-size:1rem;color:var(--muted);line-height:1.6;margin-bottom:.5rem}.help-body strong{color:var(--text)}.help-close{position:sticky;top:0;float:right;margin:-.75rem -1rem 0 .5rem;z-index:1;background:var(--surface);border-radius:50%;border:none;color:var(--muted);font-size:1.6rem;cursor:pointer;line-height:1;padding:.3rem .5rem;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}.help-close:hover{color:var(--text)}.result-screen{position:absolute;top:0;right:0;bottom:0;left:0;z-index:var(--z-result);display:flex;align-items:center;justify-content:center;overflow:hidden;padding:var(--s-4)}.result-bg{position:absolute;top:0;right:0;bottom:0;left:0}.result-content{position:relative;display:flex;flex-direction:column;align-items:center;gap:var(--s-4);width:min(30rem,100%);text-align:center}.result-crest{line-height:0}.result-headline{display:flex;align-items:center;gap:var(--s-2);margin:0;font-size:var(--fs-2xl);letter-spacing:.01em}.result-subhead{margin:-.5rem 0 0;color:var(--muted);font-size:var(--fs-sm)}.result-table{width:100%;border-collapse:collapse;font-size:var(--fs-sm)}.result-table th{padding:var(--s-1) var(--s-2);color:var(--muted);font-weight:600;text-align:center;border-bottom:1px solid var(--hairline)}.result-table td{padding:.45rem var(--s-2);text-align:center}.result-table th:first-child,.result-table td:first-child{text-align:left}.result-row-win td{font-weight:var(--fw-strong)}.result-row-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:.4rem;vertical-align:middle}.result-actions{display:flex;gap:var(--s-2);flex-wrap:wrap;justify-content:center;width:100%}.result-actions .btn{flex:1 1 10rem}.result-win .result-bg{background:radial-gradient(70% 70% at 50% 42%,rgba(255,215,0,.22),transparent 62%),radial-gradient(120% 120% at 50% 50%,#12100a 38%,#05050a)}.result-win .result-bg:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(58% 52% at 50% 46%,rgba(5,5,10,.94) 0%,rgba(5,5,10,.6) 48%,transparent 78%),radial-gradient(130% 130% at 50% 50%,transparent 32%,rgba(5,5,10,.88) 100%)}.result-win .result-bg:before{content:"";position:absolute;top:50%;left:50%;width:250vmax;height:250vmax;margin:-125vmax 0 0 -125vmax;background:repeating-conic-gradient(from 0deg,rgba(255,215,0,.07) 0deg 4deg,transparent 4deg 28deg)}.result-win .result-crest{color:var(--gold);filter:drop-shadow(0 0 14px rgba(255,215,0,.55))}.result-win .result-headline{color:var(--gold)}.result-loss .result-bg{background:linear-gradient(180deg,#0b0b13,#05050a),radial-gradient(110% 110% at 50% 40%,rgba(120,130,160,.1),transparent 70%)}.result-loss .result-bg:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;opacity:.5;background-image:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 4px)}.result-loss .result-crest{color:var(--muted);opacity:.55}.result-loss .result-headline{color:var(--muted)}.result-loss .result-actions .btn{background:transparent;border:1px solid var(--hairline);color:var(--text)}.result-loss .result-actions .btn:hover{border-color:var(--muted);filter:none}.result-draw .result-bg,.result-neutral .result-bg{background:radial-gradient(75% 65% at 50% 40%,var(--result-accent, var(--accent)),transparent 62%),radial-gradient(120% 120% at 50% 50%,#0b0b14 40%,#05050a)}.result-draw .result-bg,.result-neutral .result-bg{opacity:.85}.result-draw .result-crest,.result-neutral .result-crest{color:var(--result-accent, var(--accent-text))}.result-neutral .result-headline{color:var(--result-accent, var(--text))}.result-fx{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.confetti{position:absolute;top:-10vh;left:var(--x);width:var(--size);height:calc(var(--size) * 1.8);border-radius:1px;opacity:0;will-change:transform,opacity}@media (prefers-reduced-motion: no-preference){.confetti{animation:result-fall var(--dur) linear var(--delay) 3 forwards}.result-win .result-bg:before{animation:result-spin 48s linear infinite}.result-content{animation:result-rise .5s cubic-bezier(.2,.8,.25,1) both}.result-loss .result-content{animation-duration:.8s}}@keyframes result-fall{0%{transform:translateZ(0) rotate(0);opacity:0}8%{opacity:1}85%{opacity:1}to{transform:translate3d(0,120vh,0) rotate(var(--rot));opacity:0}}@keyframes result-spin{to{transform:rotate(360deg)}}@keyframes result-rise{0%{transform:translateY(14px);opacity:0}to{transform:none;opacity:1}}.history-item{cursor:pointer}.history-item:hover{border-color:var(--accent)}.history-players{display:flex;align-items:center;gap:.3rem;flex-wrap:wrap}.history-result{font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;margin-left:.5rem}.leaderboard-list{display:flex;flex-direction:column;gap:.35rem}.leaderboard-row{display:flex;align-items:center;padding:.6rem .8rem;background:var(--surface);border:1px solid var(--border);border-radius:8px;gap:.6rem;font-size:.875rem}.leaderboard-me{border-color:var(--lobby-accent, var(--accent));background:#ff007714}.lb-rank{font-weight:800;min-width:2rem;color:var(--muted)}.lb-name{flex:1;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lb-rating{font-weight:800;color:var(--accent-text);min-width:3rem;text-align:right}.lb-record{color:var(--muted);font-size:.8rem;min-width:4rem;text-align:center}.lb-winrate{color:var(--muted);font-size:.8rem;min-width:2.5rem;text-align:right}.lb-streak{font-size:.75rem}#view-review{position:relative;overflow:hidden}#view-review>.help-btn{position:absolute;top:1rem;right:calc(1rem + env(safe-area-inset-right,0px))}#review-canvas-container{flex:1;width:100%;min-height:0;position:relative;overflow:hidden}#review-canvas-container canvas{position:absolute;top:0;right:0;bottom:0;left:0;display:block;width:100%!important;height:100%!important}#review-back{position:absolute;top:1rem;left:1rem;background:#0f0f13bf;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid var(--border);border-radius:8px;color:var(--muted);cursor:pointer;font-size:1.2rem;padding:.5rem .85rem;z-index:var(--z-hud);line-height:1;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}#review-back:hover{color:var(--text);border-color:var(--text)}#review-controls{position:absolute;bottom:1.5rem;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:.75rem;background:#0f0f13d9;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid var(--border);border-radius:10px;padding:.5rem 1rem;z-index:var(--z-hud)}#review-controls button{padding:.5rem .85rem;border:1px solid var(--border);border-radius:6px;background:transparent;color:var(--text);cursor:pointer;font-size:1rem;min-width:44px;min-height:40px}#review-controls button:hover:not(:disabled){background:var(--accent);border-color:var(--accent);color:var(--on-accent)}#review-controls button:disabled{opacity:.4;cursor:default;color:var(--muted)}#review-move-label{font-size:1rem;color:var(--muted);white-space:nowrap;min-width:100px;text-align:center}#review-winner{position:absolute;top:1rem;left:50%;transform:translate(-50%);background:#0f0f13e6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:2px solid var(--accent);border-radius:10px;padding:.5rem 1.5rem;font-size:1.1rem;font-weight:700;color:var(--text);z-index:var(--z-hud);white-space:nowrap}@media (pointer: fine) and (min-width: 1200px){html,body{font-size:18px}}@media (max-width: 760px),(pointer: coarse){#action-bar{left:.75rem;right:.75rem;width:auto;max-width:none;bottom:calc(1rem + 64px + env(safe-area-inset-bottom,0px));transform:translateY(calc(100% + 5rem))}#action-bar.open{transform:translateY(0)}}@media (pointer: coarse){#action-bar button{min-height:46px;font-size:1rem}.hud-title{font-size:1rem;letter-spacing:.2em}.hud-stat{font-size:.95rem}.hud-icon{width:11px;height:11px}#hud-room-bar{min-width:0}}#board-2d{display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(7,1fr);gap:3px;width:min(88vw,88vh);height:min(88vw,88vh);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--bg);border-radius:4px;padding:3px}.cell-2d{background:var(--surface);display:flex;flex-direction:column-reverse;gap:1px;padding:2px;border-radius:3px;cursor:pointer;border:1px solid transparent;transition:border-color .15s;position:relative}.cell-2d:hover{border-color:var(--muted)}.cell-2d.castle-2d{border-color:#00ff6645;background:#00ff660f}.cell-2d.crowned-2d{box-shadow:inset 0 0 8px #ffd70080;border-color:var(--gold)}.cell-2d.highlight-2d{border-color:var(--gold);box-shadow:0 0 6px #ffd70099}.cell-2d.glow-2d{animation:glow2d 1.5s ease-in-out infinite}@keyframes glow2d{0%,to{box-shadow:0 0 4px #ffffff26}50%{box-shadow:0 0 10px #fff6}}.slot-2d{flex:1;border-radius:2px;min-height:0;transition:background .15s}.slot-2d.preview-2d{opacity:var(--preview-opacity, .5)}.tutorial-wrapper{margin-top:1.25rem;border-top:1px solid var(--border);padding-top:1rem}.mini-board{position:relative}.mini3d{position:relative;width:100%;aspect-ratio:16 / 10;max-height:44vh;background:#12121a;border:1px solid var(--border);border-radius:6px;overflow:hidden}.mini3d canvas{display:block;width:100%!important;height:100%!important}.mini-board-bar{display:flex;justify-content:flex-end;align-items:center;gap:.35rem;margin:.35rem 0 .6rem}.mini3d-rot,.board-view-toggle{min-width:34px;height:30px;padding:0 .5rem;border-radius:6px;border:1px solid var(--border);background:#ffffff0d;color:var(--muted);font-size:.8rem;cursor:pointer;transition:color .15s,border-color .15s}.mini3d-rot:hover:not(:disabled),.board-view-toggle:hover{color:var(--text);border-color:var(--accent)}.mini3d-rot:disabled{opacity:.35;cursor:default}@media (max-width: 768px){.mini3d{max-height:38vh}}.tutorial-grid{display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(7,1fr);gap:2px;width:100%;aspect-ratio:1;background:var(--bg);border-radius:4px;padding:2px}.tut-cell{background:var(--surface);display:flex;flex-direction:column-reverse;gap:1px;padding:1px;border-radius:2px;border:1px solid transparent;position:relative}.tut-cell.tut-castle{border-color:#00ff6645;background:#00ff6614}.tut-cell.tut-active{border-color:var(--gold);box-shadow:0 0 6px #ffd70080}.tut-slot{flex:1;border-radius:1px;min-height:0}.tutorial-info{margin-top:.75rem;font-size:.95rem;color:var(--muted);line-height:1.5;height:calc(4 * 1.5 * .95rem);overflow-y:auto}.tutorial-info strong{color:var(--text)}.tutorial-controls{display:flex;align-items:center;justify-content:center;gap:.75rem;margin-top:.75rem}.tutorial-btn{padding:.4rem .8rem;border:1px solid var(--border);border-radius:6px;background:transparent;color:var(--text);cursor:pointer;font-size:.9rem;min-height:36px}.tutorial-btn:hover:not(:disabled){background:var(--accent);border-color:var(--accent)}.tutorial-btn:disabled{opacity:.4;cursor:default;color:var(--muted)}.tutorial-step-label{font-size:.85rem;color:var(--muted);min-width:60px;text-align:center}.tutorial-tabs{display:flex;gap:.4rem;margin-bottom:.75rem}.tutorial-tab{flex:1;padding:.45rem .75rem;border:1px solid var(--border);border-radius:6px;background:transparent;color:var(--muted);cursor:pointer;font-size:.85rem;min-height:36px}.tutorial-tab:hover:not(.active){color:var(--text);border-color:var(--text)}.tutorial-tab.active{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}.push-intro{font-size:.9rem;color:var(--muted);line-height:1.5;margin-bottom:1rem}.push-example{margin-bottom:1.25rem;padding-bottom:1.25rem;border-bottom:1px solid var(--border)}.push-example:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.push-example-header{margin-bottom:.5rem}.push-example-header strong{color:var(--text);font-size:.95rem}.push-example-desc{display:block;color:var(--muted);font-size:.85rem;line-height:1.4;margin-top:.15rem}.push-example-strips{display:flex;align-items:center;gap:.5rem;justify-content:center}.push-strip{display:flex;flex-direction:column;align-items:center;gap:.25rem;flex:1;min-width:0}.push-strip-label{font-size:.7rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-weight:700}.push-strip-cells{display:grid;grid-template-columns:repeat(5,1fr);gap:2px;background:var(--bg);border-radius:3px;padding:2px;width:100%;aspect-ratio:5 / 1.4}.push-arrow{font-size:1.2rem;color:var(--accent);font-weight:700;flex-shrink:0;margin-top:1rem}@media (max-width: 1024px){.help-modal{padding:1.25rem 1.5rem}}@media (max-width: 768px){#view-lobby{padding:1.5rem 1rem;gap:1.25rem}#view-lobby h1{font-size:2.4rem}.lobby-form{max-width:100%;padding:1rem}.match-list{max-width:100%}.create-picker{grid-template-columns:repeat(6,36px);gap:.4rem}.create-picker .color-swatch{width:36px;height:36px}#hud-room-bar{min-width:0;max-width:calc(100vw - 2rem)}.hud-stats-row{gap:.35rem}.hud-stat{font-size:.75rem}#game-fab{bottom:1rem;right:1rem}.view>.compass{bottom:1rem;left:1rem}#review-controls{bottom:1rem;padding:.4rem .75rem;gap:.5rem}.help-modal{padding:1rem 1.25rem;border-radius:10px}.help-modal h2{font-size:1.2rem}.help-modal h3{font-size:1rem}.help-body p{font-size:.9rem}.tutorial-grid{max-width:400px;margin:0 auto}}@media (max-width: 480px){#view-lobby{padding:1.25rem 1rem;gap:1rem}#view-lobby h1{font-size:2.2rem}.lobby-logo{width:56px;height:56px}.lobby-demo-board{width:100%;max-width:300px;height:190px}.lobby-minimap{width:64px;height:64px;top:.3rem;right:.3rem}.lobby-demo .compass-svg{width:30px;height:30px}.lobby-demo .compass-ccw,.lobby-demo .compass-cw{width:17px;height:17px;font-size:.6rem}.lobby-form{padding:1rem}.create-picker{grid-template-columns:repeat(6,36px);gap:.4rem}.create-picker .color-swatch{width:36px;height:36px}.hud-side{padding:.3rem .4rem;gap:.3rem}.hud-center{padding:.25rem .6rem .3rem}#game-fab{bottom:1rem;right:1rem}.view>.compass{bottom:1rem;left:1rem}.help-modal{max-width:calc(100vw - 1rem);width:calc(100vw - 1rem);max-height:calc(100vh - 1rem);max-height:calc(100dvh - 1rem);padding:1rem 1.25rem}.result-headline{font-size:var(--fs-xl)}.result-content{gap:var(--s-3)}.result-actions{flex-direction:column}#review-controls{bottom:1rem;padding:.4rem .6rem;gap:.5rem}.push-example-strips{flex-direction:column;gap:.35rem}.push-arrow{transform:rotate(90deg);margin-top:0}}@media (max-width: 360px){#view-lobby h1{font-size:1.8rem}.lobby-secondary-row{flex-direction:column}.create-picker{grid-template-columns:repeat(6,32px);gap:.3rem}.create-picker .color-swatch{width:32px;height:32px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}#presence-banner.presence-banner{position:absolute;top:4.5rem;left:50%;transform:translate(-50%);z-index:40;max-width:calc(100vw - 2rem);padding:.45rem .9rem;border:1px solid var(--gold, #d9a93a);border-radius:999px;background:#0e0e18d1;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--gold, #d9a93a);font-size:.85rem;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}#presence-banner.hidden{display:none}#hud-resign.pending{border-color:var(--gold, #d9a93a);color:var(--gold, #d9a93a);font-size:.7rem;letter-spacing:.02em}@media (max-width: 760px),(pointer: coarse){#presence-banner.presence-banner{top:auto;bottom:calc(env(safe-area-inset-bottom,0px) + 8.5rem);font-size:.8rem}}.sel-info{display:inline-flex;align-items:center;gap:.4rem;font-size:.8rem;line-height:1;white-space:nowrap}.pip-stack{display:inline-flex;flex-direction:column-reverse;gap:1px;vertical-align:middle}.pip{width:12px;height:3px;border-radius:1px;box-shadow:0 0 0 1px #0000008c}.pip-empty{background:transparent;box-shadow:inset 0 0 0 1px #ffffff21}.sel-arrow{color:var(--muted);font-size:.8rem}.sel-warn{color:#ff8b6a;font-size:.68rem;text-transform:uppercase;letter-spacing:.05em}@media (max-width: 760px),(pointer: coarse){.pip{width:14px}}.hud-icon-moves{background:transparent!important;color:var(--muted);font-size:.8rem;line-height:1;width:auto;height:auto}.hud-stat-low,.hud-stat-low .hud-icon-moves{color:#ff8b6a}.cell-2d.inert-2d .slot-2d.filled-2d{filter:saturate(.25) brightness(.7)}.cell-2d.inert-2d{outline:1px dashed rgba(255,255,255,.12);outline-offset:-2px}.tutorial-choices{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.6rem}.tutorial-choice{flex:0 1 auto}.tutorial-feedback{min-height:1.2em;margin-top:.5rem;font-size:.85rem;color:var(--gold, #d9a93a)}.fab-range{width:92px;accent-color:var(--gold, #d9a93a);cursor:pointer}@keyframes punch-2d{0%{transform:scale(1)}35%{transform:scale(1.14,.74)}70%{transform:scale(.96,1.06)}to{transform:scale(1)}}.cell-2d.punch-2d{animation:punch-2d .3s cubic-bezier(.2,.7,.3,1);transform-origin:50% 100%}@media (prefers-reduced-motion: reduce){.cell-2d.punch-2d{animation:none}}.slot-2d{position:relative}.slot-2d.top-seat-0:after,.slot-2d.top-seat-1:after{content:"";position:absolute;left:50%;top:50%;width:5px;height:5px;background:#0e0e1899;transform:translate(-50%,-50%);pointer-events:none}.slot-2d.top-seat-0:after{border-radius:50%}.slot-2d.top-seat-1:after{transform:translate(-50%,-50%) rotate(45deg)}.review-warning{margin:.5rem auto;max-width:44rem;padding:.5rem .9rem;border:1px solid var(--gold, #d9a93a);border-radius:8px;color:var(--gold, #d9a93a);font-size:.85rem;text-align:center}#boot-splash{position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--z-overlay);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.9rem;background:var(--bg, #0b0b10);color:var(--muted)}.boot-title{font-size:1.1rem;letter-spacing:.3em;text-transform:uppercase}.boot-spinner{width:22px;height:22px;border-radius:50%;border:2px solid rgba(255,255,255,.15);border-top-color:var(--accent);animation:boot-spin .9s linear infinite}@keyframes boot-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.boot-spinner{animation:none}}.nav-tools{display:flex;gap:var(--s-1)}.nav-icon-btn{width:36px;height:36px;border-radius:50%;border:1px solid var(--hairline);background:var(--glass);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--muted);font-size:1rem;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:color .15s,border-color .15s,background .15s}.nav-icon-btn:hover{color:var(--text);border-color:var(--muted)}.cpu-level{display:flex;border:1px solid rgba(255,255,255,.15);border-radius:6px;overflow:hidden}.cpu-level-btn{flex:1;padding:.4rem .5rem;font-size:.75rem;font-weight:700;letter-spacing:.04em;border:none;background:transparent;color:var(--muted);cursor:pointer;min-height:34px;transition:background .15s,color .15s}.cpu-level-btn+.cpu-level-btn{border-left:1px solid rgba(255,255,255,.12)}.cpu-level-btn.active{background:var(--lobby-accent, var(--accent));color:var(--on-accent)}.cpu-level-btn:hover:not(.active){color:var(--text);background:#ffffff14}.cpu-record{margin:-.15rem 0 0;text-align:center;font-size:.75rem;letter-spacing:.04em;color:var(--muted)}@media (max-height: 720px){#view-lobby{padding:1rem 1.5rem;gap:1rem}#view-lobby h1{font-size:2rem;margin-bottom:0}.lobby-demo-board{width:260px;height:160px}.lobby-minimap{width:58px;height:58px}.lobby-tagline{font-size:.7rem}}@media (max-width: 640px){#view-lobby{padding-top:calc(3.75rem + env(safe-area-inset-top,0px))}}@media (orientation: landscape) and (max-height: 500px){#view-lobby{flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;align-content:center;gap:.75rem 2rem;padding:.75rem calc(1.5rem + env(safe-area-inset-right,0px)) .75rem calc(1.5rem + env(safe-area-inset-left,0px))}#view-lobby h1{font-size:2rem;letter-spacing:.12em;margin-bottom:0}.lobby-tagline{font-size:.7rem}.lobby-demo-board{width:260px;height:160px}.lobby-minimap{width:58px;height:58px}.lobby-form{width:320px;flex-shrink:0;gap:.5rem;padding:.75rem 1rem}.lobby-actions{margin-top:0;gap:.4rem}.lobby-form .btn{padding:.5rem;min-height:40px}.lobby-form .lobby-help-btn{padding:.45rem 1rem;margin-top:0}.btn-advanced-toggle{padding:.4rem 1rem}.lobby-divider{display:none}.match-list{flex-basis:100%}.view>.compass{bottom:calc(.75rem + env(safe-area-inset-bottom,0px));left:calc(.75rem + env(safe-area-inset-left,0px));gap:.25rem}.view>.compass .compass-svg{width:44px;height:44px}.view>.compass .compass-ccw,.view>.compass .compass-cw{width:28px;height:28px}#game-fab{bottom:calc(.75rem + env(safe-area-inset-bottom,0px));right:calc(.75rem + env(safe-area-inset-right,0px))}#fab-menu{gap:.25rem;max-height:calc(100dvh - 5rem);overflow-y:auto;overscroll-behavior:contain}.fab-item{width:36px;height:36px;font-size:1rem}.fab-label{padding:.2rem .55rem;font-size:.68rem}#action-bar{left:calc(8.5rem + env(safe-area-inset-left,0px));right:calc(4.75rem + env(safe-area-inset-right,0px));bottom:calc(.75rem + env(safe-area-inset-bottom,0px));max-width:none;padding:.3rem .4rem;transform:translateY(calc(100% + 2rem))}#action-bar.open{transform:translateY(0)}#action-bar button{min-height:40px;font-size:.9rem}.hud-center{padding:.2rem .6rem .25rem}.hud-side{padding-top:.25rem;padding-bottom:.25rem}.hud-title,.hud-stat{font-size:.85rem}#board-2d{width:min(88vw,calc(100dvh - 7rem));height:min(88vw,calc(100dvh - 7rem));top:calc(50% - .75rem)}#presence-banner.presence-banner{top:2.75rem;bottom:auto}.result-screen{overflow-y:auto;align-items:safe center;padding:var(--s-3)}.result-content{gap:var(--s-3)}.result-crest svg{height:40px;width:auto}.result-headline{font-size:var(--fs-xl)}#review-back{left:calc(1rem + env(safe-area-inset-left,0px));top:.75rem}#view-review>.help-btn{top:.75rem}#review-controls{bottom:calc(.75rem + env(safe-area-inset-bottom,0px));padding:.35rem .75rem}}