:root{--bg-deepest: #0a0a2e;--bg-panel: rgba(10, 10, 46, .9);--bg-panel-strong: rgba(10, 10, 46, .95);--bg-panel-dim: rgba(10, 10, 46, .8);--bg-input: rgba(0, 0, 30, .8);--bg-input-alt: rgba(5, 5, 30, .88);--bg-form: rgba(5, 5, 35, .9);--bg-header: #12123a;--bg-settings-panel: #0e0e32;--purple-border: rgba(130, 75, 210, .55);--purple-border-dim: rgba(130, 75, 210, .35);--purple-border-mid: rgba(130, 75, 210, .45);--purple-border-strong: rgba(130, 75, 210, .65);--purple-glow: rgba(130, 75, 210, .3);--purple-glow-dim: rgba(130, 75, 210, .2);--purple-text: rgba(185, 145, 255, .9);--purple-text-dim: rgba(185, 145, 255, .75);--purple-text-muted: rgba(185, 145, 255, .65);--purple-text-faint: rgba(185, 145, 255, .4);--purple-text-mid: rgba(185, 145, 255, .85);--purple-text-solid: #b991ff;--purple-border-faint: rgba(130, 75, 210, .2);--purple-border-subtle: rgba(130, 75, 210, .15);--purple-scrollbar: rgba(130, 75, 210, .5);--cyan: #00ffff;--cyan-dim: #00aaaa;--cyan-border: rgba(0, 255, 255, .5);--cyan-border-dim: rgba(0, 255, 255, .4);--cyan-border-strong: rgba(0, 255, 255, .7);--cyan-glow: rgba(0, 255, 255, .35);--cyan-glow-strong: rgba(0, 255, 255, .7);--cyan-glow-dim: rgba(0, 255, 255, .2);--cyan-glow-25: rgba(0, 255, 255, .25);--cyan-glow-30: rgba(0, 255, 255, .3);--cyan-subtle: rgba(0, 255, 255, .08);--cyan-subtle-dim: rgba(0, 255, 255, .03);--cyan-text-dim: rgba(0, 255, 255, .5);--cyan-text-mid: rgba(0, 255, 255, .7);--pink: #ff2975;--pink-border: rgba(255, 41, 117, .5);--pink-border-strong: rgba(255, 41, 117, .8);--pink-glow: rgba(255, 41, 117, .35);--pink-text: rgba(255, 41, 117, .8);--pink-subtle: rgba(255, 41, 117, .1);--magenta: #ff00ff;--green: #39ff14;--green-border: rgba(57, 255, 20, .4);--green-bg: rgba(57, 255, 20, .1);--green-text: rgba(57, 255, 20, .8);--gold: #ffd700;--gold-border: rgba(255, 215, 0, .4);--gold-bg: rgba(255, 215, 0, .1);--gold-text: rgba(255, 215, 0, .8);--silver: #c0c0c0;--bronze: #cd7f32;--white: #ffffff;--bg-btn-accent: rgba(0, 30, 40, .92);--bg-panel-88: var(--bg-panel-88);--text-primary: #e0e0ff;--text-muted: rgba(200, 200, 255, .55);--text-dim: #888;--text-chat: #c8c8e8;--gray-border: #333;--gray-border-focus: #555;--gray-text: #ccc;--gray-text-dim: #888;--gray-text-label: #555;--settings-border: #2a2a5e;--settings-text: #8888bb;--settings-text-dim: #6666aa;--settings-text-light: #b0b0dd;--settings-input-border: #3a3a6e;--font-mono: "Courier New", Courier, monospace;--canvas-bg: #0a0a2e;--canvas-grid: #1a1a4e;--canvas-wall: #6633aa;--canvas-player: #00ffff;--canvas-minimap-bg: rgba(10, 10, 46, .8);--canvas-minimap-border: rgba(0, 255, 255, .4);--canvas-boost-label: rgba(0, 255, 255, .5);--canvas-boost-fill: #00aaaa;--canvas-boost-active: #00ffff;--canvas-boost-border: rgba(0, 255, 255, .4);--canvas-boost-bg: rgba(0, 255, 255, .15);--canvas-boost-flash: #aaffff;--canvas-grid-gradient-center: rgba(102, 0, 153, .22);--canvas-grid-gradient-mid: rgba(102, 0, 204, .08);--canvas-grid-stroke: rgba(130, 75, 210, 1);--canvas-preview-wall: #6633aa;--canvas-preview-grid: #1a1a4e;--canvas-preview-bg: #060620}*{margin:0;padding:0;box-sizing:border-box}body{background:var(--bg-deepest);overflow:hidden}canvas{display:block}#ui-overlay{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:10}#ui-overlay>*{pointer-events:auto}.chat-panel,.player-list{background:var(--bg-panel);border:1px solid var(--purple-border);box-shadow:0 0 12px var(--purple-glow),inset 0 0 8px #00000080;color:var(--text-primary);font-family:var(--font-mono);font-size:13px;border-radius:4px;padding:8px}.game-settings{background:var(--bg-panel);border:1px solid var(--purple-border);box-shadow:0 0 12px var(--purple-glow),inset 0 0 8px #00000080;color:var(--text-primary);font-family:var(--font-mono);font-size:13px;border-radius:4px;padding:8px;display:flex;flex-direction:column;gap:4px}.game-settings__title{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--purple-text);margin-bottom:2px;border-bottom:1px solid var(--purple-border-dim);padding-bottom:4px}.game-settings__group-label{font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--purple-text-faint);margin-top:4px}.game-settings__row{display:flex;justify-content:space-between;align-items:center;padding:3px 0}.game-settings__label{font-size:11px;color:var(--purple-text-muted)}.game-settings__value{color:var(--gray-text);font-family:monospace;font-size:12px}.game-settings__select{background:var(--bg-deepest);border:1px solid var(--gray-border);border-radius:4px;padding:3px 8px;color:var(--gray-text);font-family:monospace;font-size:12px;outline:none}.game-settings__checkbox{accent-color:var(--cyan);width:16px;height:16px;cursor:pointer}.chat-panel{display:flex;flex-direction:column;gap:6px}.chat-panel__messages{max-height:200px;overflow-y:auto;display:flex;flex-direction:column;gap:3px;padding-right:2px}.chat-panel__messages::-webkit-scrollbar{width:4px}.chat-panel__messages::-webkit-scrollbar-track{background:#0000004d}.chat-panel__messages::-webkit-scrollbar-thumb{background:var(--purple-scrollbar);border-radius:2px}.chat-panel__row{line-height:1.4;word-break:break-word}.chat-panel__sender{font-weight:700;margin-right:4px;color:var(--text-primary)}.chat-panel__text{color:var(--text-chat)}.chat-panel__input-row{display:flex;gap:4px}.chat-panel__input{flex:1;background:var(--bg-input);border:1px solid var(--purple-border-mid);color:var(--text-primary);font-family:var(--font-mono);font-size:13px;padding:4px 6px;border-radius:3px;outline:none}.chat-panel__input:focus{border-color:var(--cyan-border);box-shadow:0 0 6px var(--cyan-glow-dim)}.chat-panel__send{background:var(--bg-input);border:1px solid var(--purple-border);color:var(--purple-text-solid);font-family:var(--font-mono);font-size:12px;padding:4px 10px;border-radius:3px;cursor:pointer;transition:box-shadow .15s,color .15s}.chat-panel__send:hover{color:var(--cyan);box-shadow:0 0 8px var(--cyan-glow);border-color:var(--cyan-border-dim)}.player-list{display:flex;flex-direction:column;gap:5px}.player-list__title{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--purple-text);margin-bottom:2px;border-bottom:1px solid var(--purple-border-dim);padding-bottom:4px}.player-list__entry{display:flex;align-items:center;gap:7px;line-height:1.3}.player-list__icon{flex-shrink:0}.player-list__name{font-weight:700;flex:1}.player-list__badge{font-size:10px;letter-spacing:.08em;text-transform:uppercase;padding:1px 5px;border-radius:2px;border:1px solid var(--purple-border);color:var(--purple-text-mid)}.player-list__badge--easy{border-color:var(--green-border);color:var(--green-text)}.player-list__badge--medium{border-color:var(--gold-border);color:var(--gold-text)}.player-list__badge--hard{border-color:var(--pink-border);color:var(--pink-text)}.player-list__ping{font-size:9px;font-family:Courier New,monospace;margin-left:4px}.player-list__remove-btn{margin-left:auto;color:var(--pink);cursor:pointer;font-size:14px;opacity:.4;padding:0 4px;position:relative}.player-list__remove-btn:hover{opacity:.8}.player-list__popover{position:absolute;right:-4px;top:100%;margin-top:4px;background:var(--bg-deepest);border:1px solid var(--purple-text-solid);border-radius:6px;padding:4px;z-index:10;min-width:120px;box-shadow:0 4px 12px #00000080}.player-list__popover-option{padding:6px 12px;font-size:11px;font-family:var(--font-mono);border-radius:4px;cursor:pointer}.player-list__popover-option:hover{background:#ffffff0d}.player-list__popover-option--boot{color:var(--gold)}.player-list__popover-option--ban{color:var(--pink)}.auth-bar{position:fixed;top:10px;right:14px;z-index:100;font-family:var(--font-mono);font-size:13px}.auth-bar__signin{display:inline-block;padding:6px 14px;background:var(--bg-panel);border:1px solid var(--cyan-border-dim);border-radius:4px;color:var(--cyan);text-decoration:none;letter-spacing:.08em;transition:box-shadow .15s,border-color .15s}.auth-bar__signin:hover{box-shadow:0 0 10px var(--cyan-border-dim);border-color:var(--cyan-border-strong)}.auth-bar__trigger{display:flex;align-items:center;gap:8px;padding:5px 12px;background:var(--bg-panel);border:1px solid var(--purple-border);border-radius:4px;color:var(--text-primary);cursor:pointer;font-family:var(--font-mono);font-size:13px;transition:box-shadow .15s,border-color .15s}.auth-bar__trigger:hover{border-color:var(--cyan-border);box-shadow:0 0 8px var(--cyan-glow-dim)}.auth-bar__avatar{width:24px;height:24px;border-radius:50%;border:1px solid var(--purple-border-strong)}.auth-bar__name{max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--cyan)}.auth-bar__dropdown{position:absolute;top:100%;right:0;margin-top:4px;min-width:170px;background:var(--bg-panel-strong);border:1px solid var(--purple-border);border-radius:4px;box-shadow:0 4px 16px #00000080,0 0 10px var(--purple-glow-dim);display:flex;flex-direction:column;overflow:hidden}.auth-bar__dropdown-item{display:block;width:100%;padding:9px 14px;background:none;border:none;border-bottom:1px solid var(--purple-border-faint);color:var(--text-primary);font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;text-align:left;cursor:pointer;transition:background .12s,color .12s}.auth-bar__dropdown-item:last-child{border-bottom:none}.auth-bar__dropdown-item:hover{background:var(--cyan-subtle);color:var(--cyan)}.auth-bar__dropdown-item--danger:hover{background:var(--pink-subtle);color:var(--pink)}.settings-screen{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;z-index:50}.settings-screen__title{font-family:var(--font-mono);font-size:clamp(20px,3vw,32px);font-weight:700;letter-spacing:.18em;color:var(--cyan);text-shadow:0 0 14px var(--cyan-text-dim);text-transform:uppercase;margin:0}.settings-screen__section{display:flex;flex-direction:column;gap:8px;width:clamp(260px,40vw,420px)}.settings-screen__label{font-family:var(--font-mono);font-size:11px;letter-spacing:.15em;color:var(--purple-text-mid);text-transform:uppercase}.settings-screen__input{background:var(--bg-input-alt);border:2px solid var(--cyan-border-strong);border-radius:4px;color:var(--cyan);font-family:var(--font-mono);font-size:clamp(16px,2vw,22px);letter-spacing:.12em;text-align:center;text-transform:uppercase;padding:10px 18px;outline:none;box-shadow:0 0 10px var(--cyan-glow-25);caret-color:var(--magenta)}.settings-screen__input:focus{box-shadow:0 0 18px var(--cyan-glow-strong),0 0 6px var(--cyan-glow-30);border-color:var(--cyan)}.settings-screen__color-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:8px;justify-items:center}.settings-screen__color-dot{width:28px;height:28px;border-radius:50%;cursor:pointer;transition:transform .12s,box-shadow .12s;border:2px solid transparent;box-sizing:border-box}.settings-screen__color-dot--selected{border-color:var(--white);transform:scale(1.15)}.settings-screen__status{font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;min-height:18px;text-align:center}.settings-screen__btn-row{display:flex;gap:12px;justify-content:center}.settings-screen__save{background:var(--bg-btn-accent);border:2px solid var(--cyan-border-strong);border-radius:4px;color:var(--cyan);font-family:var(--font-mono);font-size:14px;font-weight:700;letter-spacing:.15em;padding:10px 28px;cursor:pointer;text-transform:uppercase;box-shadow:0 0 12px var(--cyan-glow);transition:box-shadow .15s}.settings-screen__save:hover{box-shadow:0 0 20px var(--cyan-glow-strong)}.settings-screen__back{background:var(--bg-panel-dim);border:1px solid var(--purple-text-faint);border-radius:3px;color:var(--purple-text);font-family:var(--font-mono);font-size:13px;letter-spacing:.12em;padding:10px 24px;cursor:pointer;text-transform:uppercase;transition:box-shadow .15s,border-color .15s,color .15s}.settings-screen__back:hover{border-color:var(--pink-border-strong);box-shadow:0 0 8px var(--pink-glow);color:var(--pink)}.settings__overlay{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:auto;z-index:50}.settings__panel{background:var(--bg-settings-panel);border:1px solid var(--settings-border);border-radius:8px;width:clamp(500px,60vw,720px);max-height:80vh;display:flex;flex-direction:column;overflow:hidden}.settings__header{display:flex;align-items:center;padding:12px 16px;border-bottom:1px solid var(--settings-border);background:var(--bg-header);flex-shrink:0}.settings__back-btn{color:var(--cyan-dim);font-size:12px;cursor:pointer;font-family:var(--font-mono);margin-right:16px;transition:color .1s}.settings__back-btn:hover{color:var(--cyan)}.settings__header-title{color:var(--settings-text);font-size:11px;text-transform:uppercase;letter-spacing:2px;font-family:var(--font-mono)}.settings__body{display:flex;flex:1;min-height:0;overflow:hidden}.settings__nav{width:140px;flex-shrink:0;border-right:1px solid var(--settings-border);padding:12px 0;display:flex;flex-direction:column;gap:2px}.settings__content{flex:1;padding:20px 24px;overflow-y:auto;min-width:0}.settings__nav-item{padding:10px 16px;font-size:12px;color:var(--settings-text-dim);cursor:pointer;border-left:3px solid transparent;font-family:var(--font-mono);transition:color .1s,background .1s}.settings__nav-item:hover{color:var(--settings-text-light);background:var(--cyan-subtle-dim)}.settings__nav-item--active{color:var(--cyan);border-left-color:var(--cyan);background:var(--cyan-subtle)}.settings__nav-item--active:hover{color:var(--cyan);background:var(--cyan-subtle)}.settings__keymap-row{display:flex;align-items:center;padding:10px 12px;cursor:pointer;transition:background .1s;font-family:var(--font-mono);background:transparent;border-bottom:1px solid rgba(42,42,94,.5)}.settings__keymap-row:hover{background:var(--cyan-subtle)}.settings__keymap-row--editing{background:#00ffff14;border-color:#00ffff4d;border-radius:4px}.settings__keymap-label{flex:1;color:var(--settings-text-light);font-size:12px;font-family:var(--font-mono)}.settings__keymap-hint{font-size:9px;font-family:var(--font-mono);margin-right:8px;min-width:80px;text-align:right}.settings__key-box{display:inline-block;min-width:36px;text-align:center;padding:4px 10px;background:var(--bg-input);border:1px solid var(--settings-input-border);border-radius:4px;color:var(--text-primary);font-size:13px;font-weight:700;font-family:var(--font-mono)}.settings__key-box--editing{border-color:var(--cyan);box-shadow:0 0 8px #00ffff4d;color:var(--cyan)}.settings__key-box--unbound{border-color:#f66;color:#f66}.settings__key-box--changed{border-color:var(--cyan-dim)}.settings__status{font-family:var(--font-mono);font-size:11px;min-height:16px}.settings__status--saving{color:var(--settings-text)}.settings__status--saved{color:var(--green)}.settings__status--error{color:var(--pink)}.settings__keymap-save{padding:10px 28px;border-radius:4px;font-family:var(--font-mono);font-size:13px;cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:#001e28e6;border:2px solid rgba(0,255,255,.6);color:var(--cyan);box-shadow:0 0 10px #00ffff4d;transition:box-shadow .15s}.settings__keymap-save:hover{box-shadow:0 0 20px var(--cyan-glow-strong)}.settings__keymap-cancel{padding:10px 28px;border-radius:4px;font-family:var(--font-mono);font-size:13px;cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:transparent;border:1px solid rgba(185,145,255,.4);color:#b991ffcc;transition:border-color .15s,color .15s}.settings__keymap-cancel:hover{border-color:var(--pink-border);color:var(--pink)}.settings__btn-row{display:flex;gap:12px;margin-top:24px;justify-content:flex-end}.settings__section{display:flex;flex-direction:column}.settings__title{color:var(--cyan);font-family:var(--font-mono);font-size:14px;text-transform:uppercase;letter-spacing:1.5px;margin:0 0 4px}.settings__subtitle{color:var(--gray-text);font-size:12px;font-family:var(--font-mono);margin:0 0 8px;opacity:.7}.settings__input{background:var(--bg-input);border:1px solid var(--gray-border);border-radius:4px;padding:5px 8px;color:var(--gray-text);font-family:var(--font-mono);font-size:13px;flex:1;min-width:0;outline:none}.settings__input:focus{border-color:var(--gray-border-focus)}.settings__btn{padding:7px 16px;border-radius:4px;font-family:var(--font-mono);font-size:12px;cursor:pointer;background:transparent;border:1px solid rgba(0,255,255,.4);color:var(--cyan-dim);transition:border-color .15s,color .15s}.settings__btn:hover{border-color:var(--cyan);color:var(--cyan)}.settings__btn:disabled{opacity:.35;cursor:default;pointer-events:none}.settings__btn--secondary{border-color:#6464b466;color:var(--settings-text-dim);margin-top:4px}.settings__btn--secondary:hover{border-color:var(--cyan-dim);color:var(--settings-text-light)}.settings__btn--small{padding:4px 10px;font-size:11px}.settings__btn--danger{color:#f44;border-color:#f44}.settings__btn--danger:hover{background:#ff444426;border-color:#f44;color:#f44}.settings__profile-list{display:flex;flex-direction:column;gap:6px;margin:8px 0 10px}.settings__profile-row{display:flex;align-items:center;gap:8px;padding:6px 8px;background:var(--bg-input);border-radius:4px;border:1px solid transparent}.settings__profile-row--editing{background:var(--bg-deepest);border-color:var(--gray-border)}.settings__profile-name{flex:1;color:var(--gray-text);font-family:var(--font-mono);font-size:13px}.settings__profile-detail{color:var(--gray-text);font-family:var(--font-mono);font-size:11px;opacity:.7;min-width:60px}.admin-screen{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;z-index:50}.admin-screen__header{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--purple-border-mid);flex-shrink:0}.admin-screen__title{font-family:var(--font-mono);font-size:clamp(18px,2.5vw,28px);font-weight:700;letter-spacing:.18em;color:var(--cyan);text-shadow:0 0 14px var(--cyan-text-dim);text-transform:uppercase;margin:0}.admin-screen__back{background:var(--bg-panel-dim);border:1px solid var(--purple-text-faint);border-radius:3px;color:var(--purple-text);font-family:var(--font-mono);font-size:12px;letter-spacing:.12em;padding:7px 16px;cursor:pointer;text-transform:uppercase;transition:box-shadow .15s,border-color .15s,color .15s}.admin-screen__back:hover{border-color:var(--pink-border-strong);box-shadow:0 0 8px var(--pink-glow);color:var(--pink)}.admin-screen__body{flex:1;overflow-y:auto;padding:16px 20px;display:flex;flex-direction:column;gap:24px}.admin-screen__body::-webkit-scrollbar{width:6px}.admin-screen__body::-webkit-scrollbar-track{background:#0000004d}.admin-screen__body::-webkit-scrollbar-thumb{background:var(--purple-scrollbar);border-radius:3px}.admin-screen__section{background:var(--bg-panel-88);border:1px solid var(--purple-border);border-radius:4px;padding:14px;box-shadow:0 0 10px var(--purple-glow-dim)}.admin-screen__section-title{font-family:var(--font-mono);font-size:13px;font-weight:700;letter-spacing:.15em;color:var(--purple-text);text-transform:uppercase;margin:0 0 12px;border-bottom:1px solid var(--purple-border-dim);padding-bottom:8px}.admin-screen__setting-row{display:flex;align-items:center;gap:10px;padding:6px 0;font-family:var(--font-mono);font-size:13px;color:var(--text-primary);cursor:pointer}.admin-screen__setting-checkbox{accent-color:var(--cyan);width:16px;height:16px;cursor:pointer}.admin-screen__search-row{display:flex;gap:8px;margin-bottom:12px}.admin-screen__search{flex:1;background:var(--bg-input);border:1px solid var(--purple-border-mid);color:var(--text-primary);font-family:var(--font-mono);font-size:13px;padding:6px 10px;border-radius:3px;outline:none}.admin-screen__search:focus{border-color:var(--cyan-border);box-shadow:0 0 6px var(--cyan-glow-dim)}.admin-screen__search-btn{background:var(--bg-input);border:1px solid var(--purple-border);color:var(--purple-text-solid);font-family:var(--font-mono);font-size:12px;padding:6px 14px;border-radius:3px;cursor:pointer;transition:box-shadow .15s,color .15s}.admin-screen__search-btn:hover{color:var(--cyan);box-shadow:0 0 8px var(--cyan-glow);border-color:var(--cyan-border-dim)}.admin-screen__table{width:100%;border-collapse:collapse;font-family:var(--font-mono);font-size:12px;color:var(--text-primary)}.admin-screen__th{text-align:left;padding:8px 10px;font-size:11px;letter-spacing:.1em;color:var(--purple-text-mid);text-transform:uppercase;border-bottom:1px solid var(--purple-border-mid);-webkit-user-select:none;user-select:none}.admin-screen__th:hover{color:var(--cyan)}.admin-screen__tr{border-bottom:1px solid var(--purple-border-subtle)}.admin-screen__tr:hover{background:var(--cyan-subtle)}.admin-screen__td{padding:7px 10px;vertical-align:middle}.admin-screen__td--center{text-align:center}.admin-screen__toggle{accent-color:var(--cyan);width:15px;height:15px;cursor:pointer}.admin-screen__lock{font-size:14px;opacity:.5}.admin-screen__spinner{display:inline-block;font-size:16px;color:var(--cyan);animation:admin-spin .8s linear infinite}@keyframes admin-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.admin-screen__pagination{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:12px}.admin-screen__page-btn{background:var(--bg-input);border:1px solid var(--purple-border);color:var(--purple-text-solid);font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;padding:5px 12px;border-radius:3px;cursor:pointer;transition:box-shadow .15s,color .15s}.admin-screen__page-btn:hover{color:var(--cyan);box-shadow:0 0 6px var(--cyan-glow-dim)}.admin-screen__page-info{font-family:var(--font-mono);font-size:12px;color:var(--text-muted);letter-spacing:.06em}.lobby{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:row;align-items:stretch;padding:14% 3% 4%;gap:12px;box-sizing:border-box;pointer-events:none;font-family:var(--font-mono)}.lobby__left-col{flex:6;display:flex;flex-direction:column;gap:8px;background:var(--bg-panel);border:1px solid var(--purple-border);box-shadow:0 0 14px var(--purple-glow),inset 0 0 10px #00000080;border-radius:4px;padding:12px;pointer-events:auto;overflow:hidden}.lobby__right-col{flex:4;display:flex;flex-direction:column;gap:10px;pointer-events:none;min-width:0}.lobby__panel{display:flex;flex-direction:column;gap:6px;background:var(--bg-panel);border:1px solid var(--purple-border);box-shadow:0 0 14px var(--purple-glow),inset 0 0 10px #00000080;border-radius:4px;padding:10px;pointer-events:auto;overflow:hidden;min-height:0}.lobby__panel--users{flex:4}.lobby__panel--chat{flex:6}.lobby__header{font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--purple-text);padding-bottom:6px;border-bottom:1px solid var(--purple-border-dim);margin-bottom:4px;font-family:var(--font-mono);flex-shrink:0}.lobby__form-label{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--purple-text-dim);margin-top:8px;margin-bottom:3px;font-family:var(--font-mono)}.lobby__room-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:5px;min-height:0;padding-right:2px;scrollbar-width:thin;scrollbar-color:var(--purple-scrollbar) rgba(0,0,0,.2)}.lobby__user-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:3px;min-height:0;scrollbar-width:thin;scrollbar-color:var(--purple-scrollbar) rgba(0,0,0,.2)}.lobby__chat-body{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:3px;min-height:0;padding-right:2px;scrollbar-width:thin;scrollbar-color:var(--purple-scrollbar) rgba(0,0,0,.2)}.lobby__room-row{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:3px;border:1px solid var(--purple-border-dim);background:#140a3299;cursor:pointer;transition:box-shadow .15s,border-color .15s;pointer-events:auto;font-size:13px;-webkit-user-select:none;user-select:none}.lobby__room-row:hover{border-color:var(--cyan-border-dim);box-shadow:0 0 8px var(--cyan-glow-dim),inset 0 0 6px #00ffff0d}.lobby__room-row--disabled{border-color:#3c28504d;background:#0a0a1e66;cursor:default;pointer-events:none}.lobby__room-name{flex:1;font-weight:700;color:var(--text-primary)}.lobby__room-row--disabled .lobby__room-name{color:#505068}.lobby__room-meta{font-size:9px;color:var(--gray-text-label);font-family:monospace;margin-left:8px}.lobby__empty{text-align:center;padding:24px 0;color:#6464a0b3;font-style:italic;font-size:13px}.lobby__btn{background:var(--bg-input);border:1px solid var(--purple-border-strong);border-radius:3px;color:var(--purple-text-solid);font-family:var(--font-mono);font-size:12px;letter-spacing:.12em;padding:7px 14px;cursor:pointer;text-transform:uppercase;transition:box-shadow .15s,color .15s,border-color .15s;pointer-events:auto;align-self:flex-start}.lobby__btn:hover{color:var(--cyan);border-color:var(--cyan-border);box-shadow:0 0 8px var(--cyan-glow)}.lobby__badge{font-size:10px;letter-spacing:.08em;text-transform:uppercase;padding:1px 6px;border-radius:3px;color:var(--purple-text-mid)}.lobby__status-badge{font-size:9px;letter-spacing:.08em;text-transform:uppercase;padding:1px 5px;border-radius:2px;font-weight:700;flex-shrink:0;white-space:nowrap}.lobby__status-badge--waiting{color:var(--green-text);border:1px solid var(--green-border);background:var(--green-bg)}.lobby__status-badge--running{color:var(--gold-text);border:1px solid var(--gold-border);background:var(--gold-bg)}.lobby__form{background:var(--bg-form);border:1px solid var(--purple-border-mid);border-radius:3px;padding:10px;display:flex;flex-direction:column;gap:2px}.lobby__input{background:var(--bg-input);border:1px solid var(--purple-border);border-radius:3px;color:var(--text-primary);font-family:var(--font-mono);font-size:13px;padding:5px 8px;outline:none;transition:border-color .15s,box-shadow .15s;width:100%;box-sizing:border-box}.lobby__input:focus{border-color:var(--cyan-border);box-shadow:0 0 6px var(--cyan-glow-dim)}.lobby__submit{background:#00001ecc;border:1px solid var(--gray-border);border-radius:3px;color:var(--gray-text-dim);font-family:var(--font-mono);font-size:12px;padding:5px 10px;cursor:pointer;transition:border-color .15s,color .15s}.lobby__submit:hover{border-color:var(--gray-border-focus);color:var(--gray-text)}.lobby__create-panel{display:flex;flex-direction:column;gap:6px;padding:10px 0 4px}.lobby__name-input{background:var(--bg-input);border:1px solid var(--purple-border);border-radius:3px;color:var(--text-primary);font-family:var(--font-mono);font-size:13px;padding:5px 8px;outline:none;transition:border-color .15s,box-shadow .15s;width:100%;box-sizing:border-box}.lobby__name-input:focus{border-color:var(--cyan-border);box-shadow:0 0 6px var(--cyan-glow-dim)}.lobby__help-btn{position:fixed;bottom:14px;right:14px;width:32px;height:32px;border-radius:50%;background:var(--bg-panel);border:1px solid var(--purple-border);color:var(--purple-text-solid);font-family:var(--font-mono);font-size:16px;font-weight:700;cursor:pointer;pointer-events:auto;display:flex;align-items:center;justify-content:center;transition:border-color .15s,color .15s,box-shadow .15s;z-index:20}.lobby__help-btn:hover{color:var(--cyan);border-color:var(--cyan-border);box-shadow:0 0 8px var(--cyan-glow)}.room{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:stretch;padding:16px;box-sizing:border-box;pointer-events:none;gap:12px}.room__top-bar{display:flex;align-items:center;gap:16px;padding:10px 16px;border-bottom:1px solid #1a1a3e;flex-shrink:0;pointer-events:auto}.room__name-wrapper{display:flex;align-items:center;gap:6px}.room__spacer{flex:1}.room__name-label{color:var(--gray-text-label);font-size:10px;font-family:var(--font-mono);text-transform:uppercase}.room__name-input{background:transparent;border:1px solid var(--gray-border);border-radius:4px;padding:3px 8px;color:var(--gray-text);font-family:var(--font-mono);font-size:12px;outline:none;width:160px;transition:border-color .15s}.room__name-input:focus{border-color:var(--gray-border-focus)}.room__name-display{color:var(--gray-text);font-family:var(--font-mono);font-size:12px}.room__body{display:flex;flex:1;gap:12px;min-height:0;pointer-events:none}.room__left-col{display:flex;flex-direction:column;width:clamp(230px,28vw,300px);flex-shrink:0;gap:10px;pointer-events:auto}.room__center-col{flex:1;display:flex;background:var(--canvas-preview-bg);border:1px solid var(--settings-border);border-radius:4px;min-width:0;min-height:200px;pointer-events:auto}.room__preview-canvas{flex:1;min-height:0;min-width:0;display:block;border-radius:4px}.room__right-col{width:clamp(200px,22vw,280px);flex-shrink:0;display:flex;flex-direction:column;gap:6px;min-width:0;pointer-events:auto}.room__section-label{font-family:var(--font-mono);font-size:11px;letter-spacing:.15em;color:var(--purple-text-mid);text-transform:uppercase}.room__bot-controls{background:var(--bg-panel);border:1px solid var(--purple-border-mid);border-radius:4px;padding:10px;box-shadow:0 0 10px var(--purple-glow-dim)}.room__bot-row{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap}.room__bot-btn{background:#000014d9;border:1px solid var(--btn-color, var(--purple-border));border-radius:3px;color:var(--btn-color, var(--purple-text-solid));font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;padding:5px 10px;cursor:pointer;transition:box-shadow .15s,border-color .15s}.room__bot-btn:hover:not(:disabled){box-shadow:0 0 10px var(--btn-color-glow, var(--purple-glow));border-color:var(--btn-color, var(--purple-border-strong))}.room__bot-btn:disabled{opacity:.35;cursor:not-allowed}.room__action-btns{display:flex;flex-direction:column;gap:8px;margin-top:16px}.room__start-btn{background:var(--bg-btn-accent);border:2px solid var(--cyan-border-strong);border-radius:4px;color:var(--cyan);font-family:var(--font-mono);font-size:clamp(14px,1.6vw,18px);font-weight:700;letter-spacing:.18em;padding:12px 20px;cursor:pointer;text-transform:uppercase;box-shadow:0 0 14px var(--cyan-glow);transition:box-shadow .15s;text-align:center}.room__start-btn:hover:not(:disabled){box-shadow:0 0 24px var(--cyan-glow-strong),0 0 8px var(--cyan-glow)}.room__start-btn:disabled{opacity:.35;cursor:not-allowed;box-shadow:none}.room__leave-btn{background:var(--bg-panel-dim);border:1px solid var(--purple-border-dim);border-radius:3px;color:var(--purple-text);font-family:var(--font-mono);font-size:12px;letter-spacing:.12em;padding:7px 14px;cursor:pointer;text-transform:uppercase;transition:box-shadow .15s,border-color .15s,color .15s;text-align:center}.room__leave-btn:hover{border-color:var(--pink-border-strong);box-shadow:0 0 8px var(--pink-glow);color:var(--pink)}.room__waiting{font-family:var(--font-mono);font-size:13px;letter-spacing:.08em;color:var(--text-muted);font-style:italic;padding:8px 0}.room__popover{position:absolute;left:0;right:0;top:100%;z-index:100;background:var(--bg-panel-strong);border:1px solid var(--cyan-border-dim);border-radius:6px;padding:12px;box-shadow:0 4px 20px #0009,0 0 12px var(--cyan-glow-dim)}.room__popover-title{font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;color:var(--cyan-text-mid);text-transform:uppercase;margin-bottom:8px;text-align:center}.room__color-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;justify-items:center;margin:10px 0}.room__color-dot{width:24px;height:24px;border-radius:50%;transition:transform .12s,box-shadow .12s;box-sizing:border-box;border:2px solid transparent}.room__legend{display:flex;gap:12px;justify-content:center;margin-top:4px}.room__legend-row{display:flex;align-items:center;gap:4px}.room__legend-swatch{width:8px;height:8px;border-radius:50%;box-sizing:border-box}.room__legend-label{font-family:var(--font-mono);font-size:8px;color:var(--text-muted);letter-spacing:.05em}.room__trail-preview{background:#0006;border-radius:4px;padding:6px 10px;display:flex;align-items:center;gap:0;margin-bottom:4px}.room__trail-line{flex:1;height:3px;border-radius:1px}.room__trail-head{width:10px;height:10px;border-radius:2px;flex-shrink:0}.room__hint{font-size:9px;color:var(--cyan-text-dim);margin-left:8px;font-family:var(--font-mono);letter-spacing:.05em}#identify-screen{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding-bottom:12%;pointer-events:none}.identify__label{color:var(--purple-text);font-family:var(--font-mono);font-size:13px;letter-spacing:.2em;text-transform:uppercase;margin-bottom:10px;pointer-events:none}.identify__input{background:var(--bg-input-alt);border:2px solid rgba(0,255,255,.6);border-radius:4px;color:var(--cyan);font-family:var(--font-mono);font-size:clamp(18px,2.5vw,28px);letter-spacing:.15em;text-align:center;text-transform:uppercase;padding:12px 24px;width:clamp(260px,35vw,480px);outline:none;box-shadow:0 0 10px var(--cyan-glow-dim);caret-color:var(--magenta);pointer-events:auto}.identify__input:focus{box-shadow:0 0 18px #00ffff8c,0 0 6px #00ffff4d;border-color:var(--cyan)}.identify__input--error{border-color:var(--pink);box-shadow:0 0 14px #ff297599}.identify__hint{color:#c8c8ff73;font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;margin-top:12px;pointer-events:none}.identify__error-text{font-family:var(--font-mono);font-size:clamp(16px,2vw,22px);letter-spacing:.15em;color:var(--pink);text-transform:uppercase;text-shadow:0 0 12px rgba(255,41,117,.5);margin-bottom:20px;text-align:center;pointer-events:none}.identify__signin-btn{display:inline-block;background:var(--bg-btn-accent);border:2px solid var(--cyan-border-strong);border-radius:4px;color:var(--cyan);font-family:var(--font-mono);font-size:clamp(14px,1.6vw,18px);font-weight:700;letter-spacing:.18em;padding:14px 28px;cursor:pointer;text-transform:uppercase;text-decoration:none;box-shadow:0 0 14px #0ff6;transition:box-shadow .15s;text-align:center;pointer-events:auto}.identify__signin-btn:hover{box-shadow:0 0 24px #00ffffb3,0 0 8px #0ff6}.results{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:30;pointer-events:none}.results__panel{background:var(--bg-panel-strong);border:2px solid var(--cyan-border);border-radius:6px;box-shadow:0 0 40px #00ffff2e,0 0 80px #6600cc38;padding:32px 40px;display:flex;flex-direction:column;align-items:center;gap:20px;min-width:clamp(300px,40vw,540px);max-width:90vw;pointer-events:auto;font-family:var(--font-mono)}.results__title{font-family:var(--font-mono);font-size:clamp(28px,4vw,48px);font-weight:700;letter-spacing:.25em;text-transform:uppercase}.results__title--victory{color:var(--gold);text-shadow:0 0 24px var(--gold),0 0 48px var(--gold)}.results__title--defeat{color:var(--cyan);text-shadow:0 0 24px var(--cyan),0 0 48px var(--cyan)}.results__list{display:flex;flex-direction:column;gap:8px;width:100%}.results__row{display:flex;align-items:center;gap:12px;width:100%;padding:8px 12px;border-radius:4px;background:#ffffff08;border:1px solid rgba(255,255,255,.05)}.results__row--winner{background:#ffd70012;border-color:#ffd7004d;box-shadow:0 0 12px #ffd7001f}.results__rank{font-family:var(--font-mono);font-size:13px;font-weight:700;letter-spacing:.1em;min-width:36px;text-align:center;flex-shrink:0}.results__rank--winner{font-size:16px}.results__rank--1st{color:var(--gold);text-shadow:0 0 8px var(--gold)}.results__rank--2nd{color:var(--silver);text-shadow:0 0 8px var(--silver)}.results__rank--3rd{color:var(--bronze);text-shadow:0 0 8px var(--bronze)}.results__rank--other{color:#c8c8ffb3;text-shadow:0 0 8px rgba(200,200,255,.7)}.results__player-name{font-family:var(--font-mono);font-size:14px;font-weight:400;letter-spacing:.12em;flex-grow:1;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.results__player-name--winner{font-size:18px;font-weight:700}.results__ticks{font-family:var(--font-mono);font-size:11px;color:#c8c8ff73;letter-spacing:.05em;flex-shrink:0}.results__divider{width:100%;height:1px;background:linear-gradient(to right,transparent,rgba(0,255,255,.3),transparent)}.results__btn-row{display:flex;gap:16px;justify-content:center}.results__btn{background:#05051ee6;border-radius:4px;font-family:var(--font-mono);font-size:clamp(13px,1.6vw,16px);font-weight:700;letter-spacing:.18em;padding:10px 24px;cursor:pointer;text-transform:uppercase;transition:box-shadow .15s,background .15s,border-color .15s}.results__btn--primary{border:2px solid var(--cyan);color:var(--cyan);box-shadow:0 0 10px #00ffff45}.results__btn--primary:hover{background:#00ffff21;box-shadow:0 0 22px #00ffff87}.results__btn--secondary{border:2px solid var(--gray-text);color:var(--gray-text);box-shadow:0 0 10px #a0a0c826}.results__btn--secondary:hover{background:#a0a0c81a;box-shadow:0 0 22px #a0a0c859}.results__btn--danger{border:2px solid var(--magenta);color:var(--magenta);box-shadow:0 0 10px #ff00ff45}.results__btn--danger:hover{background:#ff00ff21;box-shadow:0 0 22px #ff00ff87}
