@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{
  --base:#07131f;
  --panel:rgba(14,24,36,.94);
  --panel2:#1f242e;
  --line:#2b3341;
  --muted:#8fa2b3;
  --text:#f5f9ff;
  --accent:#70e0ff;
  --accent2:#bd93ff;
  --pink:#f065b5;
  --red1:#7f1623;
  --red2:#d63f58;
  --font:'Space Grotesk',system-ui,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;color:var(--text);background:var(--base);font-family:var(--font)}
button,input,select,textarea{font:inherit}button{cursor:pointer;transition:.18s ease}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.hidden{display:none!important}
#arena{position:fixed;inset:0;width:100%;height:100%;display:block;background:var(--base)}#noise{position:fixed;inset:0;pointer-events:none;opacity:.19;background-image:url('data:image/svg+xml,%3Csvg viewBox="0 0 180 180" xmlns="http://www.w3.org/2000/svg"%3E%3Cfilter id="noise"%3E%3CfeTurbulence type="fractalNoise" baseFrequency=".8" numOctaves="3" stitchTiles="stitch"/%3E%3C/filter%3E%3Crect width="100%25" height="100%25" filter="url(%23noise)" opacity=".10"/%3E%3C/svg%3E')}

/* Top HUD */
.topbar{position:fixed;z-index:8;top:0;left:0;right:0;height:63px;border-bottom:1px solid rgba(120,166,194,.14);background:linear-gradient(180deg,rgba(6,16,26,.92),rgba(6,16,26,.58));display:flex;align-items:center;justify-content:space-between;padding:0 22px;transition:.25s ease}.brand{display:flex;align-items:center;gap:10px;color:#f8fbff;font:700 23px/1 'Rajdhani',sans-serif;letter-spacing:.13em}.brand small{display:block;color:#8ed0ff;font:600 9px/1.55 var(--font);letter-spacing:.42em}.brand-glyph{width:33px;height:33px;display:grid;place-items:center;border:1px solid #82e7ff60;background:linear-gradient(135deg,#183548,#15192e);color:var(--accent);font-size:22px;box-shadow:inset 0 0 17px #5fd7fa18}.top-actions{display:flex;align-items:center;gap:10px;transition:.25s ease}.mode-pill,.connection-pill{border:1px solid #3a5469;background:#0e2232b0;padding:7px 14px;border-radius:40px;font:700 10px var(--font);letter-spacing:.16em;color:#c1e4f1;transition:.25s ease}.connection-pill{font-size:9px;color:#a8bacb}.connection-pill i{display:inline-block;width:7px;height:7px;background:#f7c679;border-radius:50%;margin-right:6px}.connection-pill.online i{background:#6cf4af}.icon-btn{width:34px;height:34px;border:1px solid #3e5265;border-radius:8px;background:#102537;color:#a8cedb;font-size:18px}.icon-btn:hover{color:white;border-color:var(--accent)}
body.show-lobby #top-mode,body.show-lobby .top-actions{opacity:0;pointer-events:none;transform:translateY(-12px)}
.top-center{position:absolute;left:50%;transform:translateX(-50%);display:grid;justify-items:center;gap:4px;pointer-events:none;transition:opacity .2s}
.top-center .mode-pill{padding:4px 13px}
#server-population{color:#d4dce4;font:600 10px/1.4 var(--font);letter-spacing:.025em;white-space:nowrap}
body.show-lobby .top-center{opacity:0}
@media(max-width:1200px){.top-center{top:68px;padding:7px 12px;border:1px solid #67768066;border-radius:10px;background:#0b111ddd}.restart-clock{top:128px}}

/* HUD widgets */
#xp-hud{position:fixed;left:230px;top:15px;width:150px;min-width:0}@media(max-width:1050px){#xp-hud{left:14px;top:188px;width:140px}}
.account-level{font-size:10px;color:#f3d384;border:1px solid #a38b4455;border-radius:12px;padding:4px 8px;white-space:nowrap}.xp-hud{display:grid;grid-template-columns:auto auto;gap:3px 8px;min-width:123px;padding:5px 9px;border:1px solid #8fa85b55;border-radius:7px;background:#10201799;font-size:10px}.xp-hud strong{color:#e6d391}.xp-hud span{color:#c5d5c7}.xp-hud progress{grid-column:1/-1;width:100%;height:4px;accent-color:#b6d778;border:0;border-radius:3px;overflow:hidden}.xp-hud progress::-webkit-progress-bar{background:#294034}.xp-hud progress::-webkit-progress-value{background:#b6d778}
#leaderboard header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 8px;color:#f4e3aa;border-bottom:1px solid #bc9d5a55;letter-spacing:.1em;font-size:12px}#leaderboard header small{font-size:9px;color:#a9b7c4}#leaderboard .leader-entry{display:flex;gap:8px;padding:7px 8px}#leaderboard .leader-rank{flex:0 0 20px;color:#b7c7d5}#leaderboard .leader-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#leaderboard .leader-mass{flex:0 0 auto}#leaderboard .leader-first{background:#b28a2626;border-radius:5px}#leaderboard .leader-first .leader-rank{color:#ffe195;font-weight:800}
.hud-panel{border:1px solid rgba(124,190,217,.18);background:rgba(8,22,35,.82);box-shadow:0 14px 44px rgba(0,0,0,.15);border-radius:13px;backdrop-filter:blur(8px)}
.leader{position:fixed;z-index:2;top:84px;right:18px;width:196px;padding:15px}.hud-heading{font:700 12px 'Rajdhani',sans-serif;letter-spacing:.15em;color:#b4d9e7;display:flex;justify-content:space-between;border-bottom:1px solid #2b4858;padding-bottom:8px}.hud-heading small{color:#6c93a7;font-size:9px}.leader-entry{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:11px;border-bottom:1px solid #ffffff0b}.leader-entry:last-child{border:0}.leader-entry>span:first-child{color:#64889d;width:16px}.leader-entry b{flex:1;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.leader-entry em{color:#97b3c2;font-style:normal}.leader-entry.is-me b{color:var(--accent)}
.status-card{position:fixed;z-index:2;top:84px;left:18px;width:180px;padding:14px}.status-label{font-size:9px;letter-spacing:.12em;color:#89adbe}.score-line{display:flex;align-items:baseline;justify-content:space-between;margin:8px 0 14px}.score-line strong{font:700 27px 'Rajdhani',sans-serif;color:white}.score-line span{font-size:10px;color:#81a8ba}.mini-progress{height:4px;border-radius:10px;background:#284054;overflow:hidden}.mini-progress>span{display:block;width:25%;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2))}.status-details{display:flex;justify-content:space-between;margin-top:10px;font-size:9px;color:#80a2b4}
.minimap{position:fixed;z-index:2;right:18px;bottom:18px;width:172px;padding:12px 12px 8px;display:grid;place-items:center;gap:6px}.minimap canvas{width:146px;height:146px;border-radius:10px;background:#08141f;border:1px solid #244b5c}.minimap span{font-size:9px;letter-spacing:.15em;color:#8fb0bf}
.help-panel{position:fixed;left:50%;transform:translateX(-50%);bottom:18px;z-index:2;padding:9px 18px;border-radius:999px;background:rgba(8,22,35,.8);border:1px solid rgba(114,165,184,.25);font-size:10px;color:#c2dbe7;display:flex;gap:12px;backdrop-filter:blur(8px)}.help-panel b{color:white}
.chatbox{position:fixed;left:18px;bottom:18px;width:min(300px,25vw);height:226px;padding:0;display:flex;flex-direction:column;overflow:hidden;z-index:2}.chat-head{display:flex;justify-content:space-between;padding:12px 14px;border-bottom:1px solid #234253;font-size:11px;letter-spacing:.11em;color:#cfe5ef}.chat-tabs{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid #203847}.chat-tab{border:1px solid #33566a;background:#132a3b;color:#9ec8d8;border-radius:999px;padding:4px 10px;font-size:10px;font-weight:700}.chat-tab.active{background:linear-gradient(90deg,var(--pink),var(--accent2));color:white;border-color:#ce93ff}#chat-tag-label{margin-left:auto;font-size:10px;color:#7190a1}.chat-messages{flex:1;padding:10px 14px;overflow:auto;font-size:11px;line-height:1.45}.msg{margin-bottom:8px}.msg .who{color:var(--accent);font-weight:700}.msg.system{color:#96adbd}#chat-form{display:flex;gap:8px;padding:12px;border-top:1px solid #203746}#chat-form input{flex:1;border-radius:10px;border:1px solid #274758;background:#0c1d2a;padding:11px 12px;color:white;font-size:12px}#chat-form button{width:44px;border:0;border-radius:10px;background:linear-gradient(135deg,var(--pink),var(--accent2));color:white;font-weight:700}
body.show-lobby .leader,body.show-lobby .status-card,body.show-lobby .minimap,body.show-lobby .chatbox,body.show-lobby .help-panel{opacity:.09;filter:blur(.2px);pointer-events:none}

/* Lobby */
.lobby{position:fixed;inset:63px 0 0;z-index:6;display:grid;align-content:start;justify-items:center;padding:18px 18px 18px;background:radial-gradient(circle at center,rgba(20,46,67,.46) 0,rgba(5,18,29,.86) 58%,rgba(4,12,22,.97) 100%);overflow:hidden}
.lobby::before,.lobby::after{content:'';position:absolute;border-radius:50%;filter:blur(40px);opacity:.5;pointer-events:none}.lobby::before{width:340px;height:340px;left:14%;top:14%;background:radial-gradient(circle,#8f2031 0,rgba(143,32,49,.0) 70%);animation:floatGlow 10s ease-in-out infinite}.lobby::after{width:420px;height:420px;right:8%;bottom:10%;background:radial-gradient(circle,rgba(69,153,255,.32) 0,rgba(69,153,255,0) 68%);animation:floatGlow2 13s ease-in-out infinite}
.lobby-fx{position:absolute;border-radius:50%;opacity:.35;filter:blur(18px);pointer-events:none}.fx-one{width:160px;height:160px;top:140px;left:8%;background:#cc425b;animation:orb1 11s ease-in-out infinite}.fx-two{width:120px;height:120px;right:16%;top:200px;background:#3f7fd0;animation:orb2 14s ease-in-out infinite}.fx-three{width:90px;height:90px;left:45%;bottom:90px;background:#ffffff44;animation:orb3 9s ease-in-out infinite}
.hero-logo{position:relative;font:700 clamp(64px,8.6vw,112px)/1 'Rajdhani',sans-serif;letter-spacing:.06em;background:linear-gradient(180deg,#ef8691,#a51d30 45%,#6a121d 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 36px rgba(178,37,57,.28);margin:8px 0 10px;animation:logoPulse 3.8s ease-in-out infinite}
.lobby-grid{position:relative;width:min(1010px,94vw);display:grid;grid-template-columns:260px 1fr 320px;gap:18px;align-items:start}
.menu-panel{background:linear-gradient(180deg,rgba(56,63,74,.94),rgba(46,51,61,.92));border:1px solid rgba(255,255,255,.07);border-radius:16px;box-shadow:0 18px 44px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.04);padding:18px;color:#eef2ff;backdrop-filter:blur(10px)}
.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:12px}.section-head h3{margin:0;font:700 23px 'Rajdhani';letter-spacing:.06em}.section-head span{font-size:10px;letter-spacing:.18em;color:#c8ced8}
.left-panel{display:grid;gap:18px;align-content:start}.login-row{display:grid;gap:10px}.login-btn{height:48px;border:0;border-radius:10px;color:#fff;font-weight:700;font-size:14px;box-shadow:inset 0 -2px 0 rgba(255,255,255,.06)}.login-btn.discord{background:#5865F2}.login-btn.facebook{background:#4267B2}.skin-head{margin-top:6px}.skin-showcase{display:grid;grid-template-columns:36px 1fr 1fr 36px;gap:8px;align-items:center}.skin-showcase.compact .skin-slot{height:132px}.arrow-btn{height:44px;border:0;background:#555d67;color:#ced5df;border-radius:8px;font-size:22px}.skin-slot{height:118px;border-radius:10px;background:#343b45;display:grid;place-items:center;position:relative;overflow:hidden;border:1px solid #4c5460}.skin-slot::before{content:'';width:86px;height:86px;border:8px solid #dedede;border-radius:50%;display:block;opacity:.94}.skin-slot span{position:absolute;color:#d9dce2;font-weight:800;transform:rotate(-35deg);font-size:15px;letter-spacing:.08em}.skin-slot b{position:absolute;left:8px;bottom:8px;font-size:10px;letter-spacing:.16em;color:#fff;background:#b62d41;padding:5px 8px;border-radius:999px}
.center-panel{display:grid;gap:18px}.center-top{display:grid;gap:14px}.swapped-inputs{grid-template-columns:1fr 168px}.center-top input{height:54px;border-radius:12px;border:1px solid #9098a3;background:#9ba2ab;color:white;padding:0 18px;font-size:18px;box-shadow:inset 0 0 0 1px rgba(128,228,255,.18)}.center-top input::placeholder{color:#d8dee7}
.mode-picks{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.big-modes .mode-choice{min-height:176px;padding:18px 18px 16px;border:1px solid #49505e;border-radius:14px;background:linear-gradient(180deg,#2f3540,#252b35);color:#fff;text-align:left;box-shadow:inset 0 0 0 1px rgba(255,255,255,.03)}.mode-choice small{display:block;color:#b5bdc8;font-size:11px;letter-spacing:.16em}.mode-choice strong{display:block;font:700 46px/1 'Rajdhani';margin-top:12px;max-width:150px}.mode-choice span{display:block;margin-top:14px;font-size:16px;color:#dfe6ef}.mode-choice.selected{border-color:#f36fb8;box-shadow:inset 0 0 0 1px #f36fb8,0 0 26px rgba(243,111,184,.14);background:linear-gradient(180deg,#343c48,#29313d)}.mode-choice:hover,.server-row:hover,.region-tab:hover,.login-btn:hover,.main-btn:hover,.arrow-btn:hover{transform:translateY(-1px)}
.center-actions.single-column{grid-template-columns:1fr}.play-stack.large-stack{display:grid;gap:14px}.main-btn{height:52px;border:0;border-radius:11px;color:#fff;font-weight:800;font-size:16px;box-shadow:inset 0 -2px 0 rgba(0,0,0,.14)}.play-blue{background:linear-gradient(180deg,#3491ff,#1b82ff)}.play-yellow{background:linear-gradient(180deg,#f3c73a,#efba07)}.play-red{background:linear-gradient(180deg,#eb5466,#d94055)}
.right-panel{display:grid;gap:12px}.server-header h3{margin:0;text-align:center;font:700 30px 'Rajdhani'}.region-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.region-tab{height:34px;border:0;border-radius:6px;background:#686e78;color:#fff;font-size:12px}.region-tab.active{background:#e8e8ea;color:#323843}.server-table{background:#343a43;border-radius:12px;padding:12px 12px 10px;display:grid;gap:4px}.server-head-row,.server-row{display:grid;grid-template-columns:1.2fr .8fr 1fr;gap:10px;align-items:center;text-align:left}.server-head-row{font-weight:700;font-size:11px;color:#f7f8fb;padding:4px 8px}.server-row{border:0;border-radius:6px;background:transparent;color:#fff;padding:7px 8px;font-size:12px}.server-row.selected{background:#f169b8}
.soon-btn{position:relative}

/* Game over */
.gameover{position:fixed;z-index:12;inset:0;display:grid;place-items:center;background:#07131fdc}.gameover-card{text-align:center;border:1px solid #3b6174;border-radius:16px;padding:35px 52px;background:#10283c;box-shadow:0 25px 70px #0009}.gameover small{color:#90bece;letter-spacing:.2em}.gameover h2{font:700 52px 'Rajdhani';margin:7px 0}.gameover p{font-size:13px;color:#a0bfcc}.link-button{display:block;margin:16px auto 0;background:transparent;color:#a6b8c6;border:0;font-size:12px}

/* Settings */
.overlay{position:fixed;inset:0;z-index:20;background:rgba(2,6,12,.84);display:grid;place-items:center;padding:18px}.settings-shell{width:min(930px,96vw);height:min(690px,94vh);display:flex;flex-direction:column;overflow:hidden;border-radius:14px;border:1px solid #404751;background:#2a2f39;box-shadow:0 35px 95px rgba(0,0,0,.65)}.settings-header{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.06)}.settings-brand-wrap{display:flex;align-items:center;gap:14px}.settings-brand{display:flex;align-items:center;gap:10px;color:#fefeff;font:700 28px/1 'Rajdhani',sans-serif;letter-spacing:.12em}.settings-brand small{display:block;color:#f09ad1;font:700 10px/1.6 var(--font);letter-spacing:.28em}.settings-brand-glyph{width:44px;height:44px;display:grid;place-items:center;border-radius:10px;background:linear-gradient(135deg,#2d2645,#151821);border:1px solid #68598f;color:#f3f4ff;font-size:28px}.settings-close{background:#282e39;border-color:#454b59;color:#ff6c80}.settings-close:hover{border-color:#ff8395;color:white;background:#3a2330}
.settings-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:10px 12px;background:#262b34}.settings-tabs button{height:42px;border:1px solid #39404c;border-radius:10px;color:#f4f6fe;background:#222830;font:700 14px 'Rajdhani';letter-spacing:.02em}.settings-tabs button.active{background:#f06bb5;border-color:#f391cf;color:#fff}.settings-body{display:grid;grid-template-columns:180px 1fr;overflow:hidden;flex:1}.settings-nav{overflow:auto;background:#1f242d;border-right:1px solid rgba(255,255,255,.07);padding:10px 0}.settings-nav button{display:block;width:100%;background:none;color:#edf0fb;text-align:left;border:0;border-left:4px solid transparent;padding:14px 18px;font-size:12px;opacity:.86}.settings-nav button.active{background:#2a2f39;border-left-color:#f06bb5;opacity:1}.settings-content{overflow-y:auto;padding:6px 24px 24px;background:#2d333d}.setting-row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.04);min-height:60px}.setting-label{font-size:13px;color:#fbfcff}.setting-label small{display:block;font-size:10px;line-height:1.6;color:#9da7c7;margin-top:5px}.setting-control{max-width:340px;min-width:150px;text-align:right;display:flex;justify-content:flex-end;align-items:center;gap:10px}.toggle-switch{display:inline-flex;align-items:center;gap:10px;cursor:pointer}.toggle-switch input{display:none}.toggle-slider{position:relative;width:42px;height:22px;border-radius:999px;background:#2e3241;border:1px solid #59556d}.toggle-slider::after{content:'';position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:all .18s ease}.toggle-switch input:checked + .toggle-slider{background:linear-gradient(90deg,#f06bb5,#db65dc);border-color:#ff94d4}.toggle-switch input:checked + .toggle-slider::after{left:22px}.toggle-status{font-size:11px;color:#f0b7d6;font-weight:700;letter-spacing:.14em;min-width:24px}.setting-control input[type="range"]{-webkit-appearance:none;appearance:none;width:240px;max-width:100%;height:6px;border-radius:99px;background:#1b1f2a;outline:none}.setting-control input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid #f06bb5}.setting-control input[type="range"]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid #f06bb5}.setting-control input[type="color"]{width:140px;height:34px;border:1px solid #4d5264;border-radius:9px;background:#262c37;cursor:pointer;padding:3px}.setting-control input[type="text"],.setting-control input[type="url"],.setting-control select{width:195px;max-width:100%;border-radius:8px;border:1px solid #4a5161;padding:10px 12px;background:#1a1f29;color:#fff}.setting-value{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:24px;padding:0 9px;border-radius:999px;font-size:10px;color:#fafbff;background:#232631;border:1px solid #434759}.coming-pill,.coming-key{display:inline-flex;align-items:center;justify-content:center;min-width:116px;height:36px;padding:0 12px;border-radius:8px;background:#1b1f27;border:1px solid #474e5d;color:#f6b9d8;font-weight:700;font-size:12px}.coming-pill{min-width:132px}.settings-foot{display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(255,255,255,.06);padding:12px 20px;font-size:10px;letter-spacing:.18em;color:#b0b5d0;background:rgba(0,0,0,.12)}.settings-foot button,.settings-action{padding:12px 18px;color:#fff;border:0;border-radius:10px;background:#f06bb5;font:700 12px var(--font)}.settings-content h3{font:700 24px 'Rajdhani';margin:10px 0 4px}.settings-content .hint{font-size:12px;line-height:1.7;color:#b0b8d0;max-width:780px}.settings-content textarea{width:100%;min-height:150px;background:#181d26;border:1px solid #464d5e;border-radius:12px;color:#ebefff;font:11px monospace;padding:14px;resize:vertical}.settings-content .setting-control input.keybind{width:116px;text-align:center;background:#151922;border-color:#525567;border-radius:10px;font-weight:700;letter-spacing:.08em}.import-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0 14px}.settings-action.pink{background:#e86ab8}.settings-action.blue{background:#1d77ea}.settings-action.red{background:#e0334a}.file-pick{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 16px;border-radius:10px;border:1px dashed #585f73;background:#171c25;color:#eef2fe;font-size:12px;margin-bottom:14px;position:relative;overflow:hidden}.file-pick::after{content:attr(data-filename);margin-left:10px;color:#f0b7d6;font-size:11px;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-pick input{position:absolute;inset:0;opacity:0;cursor:pointer}.command-list .setting-row{padding:12px 0}
.toast{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);padding:11px 16px;border-radius:999px;background:#171e29;border:1px solid #505a70;color:#eef1fe;z-index:30;font-size:12px;box-shadow:0 18px 35px rgba(0,0,0,.25)}

@keyframes logoPulse{0%,100%{filter:drop-shadow(0 0 0 rgba(179,31,47,0));transform:translateY(0)}50%{filter:drop-shadow(0 0 16px rgba(210,70,85,.35));transform:translateY(-2px)}}
@keyframes floatGlow{0%,100%{transform:translate(0,0)}50%{transform:translate(35px,-16px)}}
@keyframes floatGlow2{0%,100%{transform:translate(0,0)}50%{transform:translate(-28px,20px)}}
@keyframes orb1{0%,100%{transform:translate(0,0)}50%{transform:translate(32px,30px)}}
@keyframes orb2{0%,100%{transform:translate(0,0)}50%{transform:translate(-20px,32px)}}
@keyframes orb3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(25px,-18px) scale(1.14)}}

@media(max-width:1180px){.lobby-grid{grid-template-columns:1fr;max-width:680px}.chatbox,.leader,.minimap{display:none}.center-top{grid-template-columns:1fr 150px}.big-modes .mode-choice strong{font-size:34px}}
@media(max-width:620px){.topbar{height:58px;padding:0 10px}.brand{font-size:16px}.brand-glyph{width:28px;height:28px;font-size:18px}.mode-pill{display:none}.connection-pill{padding:6px 9px;font-size:8px}.lobby{inset:58px 0 0;padding:14px 10px}.hero-logo{font-size:52px}.menu-panel{padding:10px}.skin-showcase{grid-template-columns:24px 1fr 1fr 24px}.center-top{grid-template-columns:1fr}.mode-picks{grid-template-columns:1fr}.region-tabs,.import-actions{grid-template-columns:1fr}.help-panel{display:none}.settings-shell{width:min(96vw,96vh);height:min(92vh,96vh)}.settings-body{grid-template-columns:95px 1fr}.settings-nav button{padding:12px 8px;font-size:10px}.settings-content{padding:8px 10px 14px}.setting-row{flex-direction:column;align-items:flex-start}.setting-control{min-width:85px;width:100%;justify-content:flex-start}.setting-control input[type="range"],.setting-control input[type="text"],.setting-control input[type="url"],.setting-control select,.setting-control input[type="color"]{width:100%}.settings-tabs button{font-size:11px;height:40px}.settings-foot{padding:10px 12px;font-size:8px;gap:10px}}

/* Vintage 0.6 — redesigned premium development lobby */
:root{--wine:#ed5366;--wine-deep:#801e36;--v-surface:#171c29;--v-stroke:rgba(214,223,245,.105)}
html,body{font-family:'Space Grotesk',system-ui,sans-serif}
.topbar{background:linear-gradient(180deg,#0c111cfa,#0c111ce0);border-bottom:1px solid rgba(255,255,255,.075);height:65px;padding-inline:clamp(18px,3vw,48px)}
.brand{font-size:25px;letter-spacing:.18em}.brand-glyph{background:linear-gradient(145deg,#612338,#1a1525);border:1px solid #ed627d6e;color:#f58394;box-shadow:0 0 23px #d2385540}.brand small{color:#fa9bac;letter-spacing:.26em;font-size:8px}
body.show-lobby .top-actions{opacity:1;pointer-events:auto;transform:none}body.show-lobby #top-mode{display:none}body.show-lobby .connection-pill{color:#8b95ab;background:#111723;border-color:#303749}
body.show-lobby .leader,body.show-lobby .status-card,body.show-lobby .minimap,body.show-lobby .chatbox,body.show-lobby .help-panel{opacity:0;pointer-events:none}
.lobby{inset:65px 0 0;display:block;overflow:auto;overscroll-behavior:contain;isolation:isolate;padding:0 22px 26px;background:radial-gradient(ellipse at 52% 5%,#48203655,transparent 48%),radial-gradient(ellipse at 9% 90%,#193c5b55,transparent 50%),linear-gradient(140deg,#0d121b 0%,#0d1624 52%,#10101c 100%)}
.lobby:before{content:'';position:absolute;inset:0;top:0;left:0;width:100%;height:100%;opacity:.13;border-radius:0;filter:none;background:linear-gradient(90deg,#ffffff12 1px,transparent 1px),linear-gradient(#ffffff14 1px,transparent 1px);background-size:82px 82px;animation:none;mask-image:linear-gradient(to bottom,transparent,black 32%,transparent)}
.lobby:after{content:'';position:absolute;top:-410px;right:-80px;width:960px;height:860px;opacity:.48;background:radial-gradient(circle,#c22a512c 0,transparent 66%);filter:blur(45px);animation:floatGlow2 22s ease-in-out infinite}
.lobby-atmosphere{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}.lobby-atmosphere i{position:absolute;border-radius:50%;display:block}.lobby-atmosphere i:nth-child(1){width:380px;height:380px;left:-130px;top:18%;border:1px solid #ef658131;box-shadow:0 0 0 38px #ef658107,0 0 0 88px #ef658105,0 0 140px #a72f4940;animation:vFloat 15s ease-in-out infinite}.lobby-atmosphere i:nth-child(2){width:560px;height:560px;right:-210px;top:15%;border:1px solid #9b8cf02c;box-shadow:0 0 0 40px #ad8ff004,0 0 130px #543d9250;animation:vFloat 19s ease-in-out infinite reverse}.lobby-atmosphere i:nth-child(3){width:6px;height:6px;top:28%;left:17%;background:#df607d;box-shadow:0 0 32px 7px #d9476480;animation:vFloat 8s ease-in-out infinite}.lobby-atmosphere i:nth-child(4){width:5px;height:5px;bottom:20%;right:17%;background:#96c7fe;box-shadow:0 0 30px 8px #587ac380;animation:vFloat 12s ease-in-out infinite}
.lobby-wrap{position:relative;z-index:1;max-width:1270px;margin:0 auto}
.lobby-intro{text-align:center;padding:36px 0 33px}.lobby-eyebrow{display:flex;align-items:center;justify-content:center;gap:14px;color:#b3a1b3;font-size:10px;letter-spacing:.24em;font-weight:700}.lobby-eyebrow .live-dot{width:7px;height:7px;display:inline-block;border-radius:50%;background:#f16882;box-shadow:0 0 12px #ff4362}.lobby-eyebrow-line{width:45px;height:1px;background:linear-gradient(90deg,#f16f89,transparent)}
.hero-logo{font:800 clamp(76px,8.5vw,130px)/.87 'Rajdhani',sans-serif;letter-spacing:.055em;margin:15px 0 10px;display:block;color:transparent;background:linear-gradient(180deg,#ffe4ec 0%,#ec788d 29%,#bc274b 71%,#7e1631 100%);-webkit-background-clip:text;background-clip:text;text-shadow:none;filter:drop-shadow(0 12px 29px #c52f4c35);animation:vTitleIn .8s ease both}.hero-dot{color:#fe7386;-webkit-text-fill-color:#ff8295;filter:drop-shadow(0 0 12px #eb4068)}.lobby-intro p{margin:12px 0 0;color:#96a2b9;font-size:13px;letter-spacing:.025em}
.lobby-grid{width:100%;grid-template-columns:minmax(240px,0.94fr) minmax(430px,1.7fr) minmax(260px,1.08fr);gap:20px;align-items:stretch}
.menu-panel{min-width:0;overflow:hidden;padding:24px!important;background:linear-gradient(160deg,#1b202dF2,#151926f2)!important;border:1px solid var(--v-stroke)!important;border-radius:19px!important;box-shadow:0 20px 48px #02060e66,inset 0 1px #ffffff09!important;backdrop-filter:blur(20px);transition:border-color .2s,transform .2s}.menu-panel:hover{border-color:#ed6e8840!important}
.panel-topline{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:9px;font-weight:700;letter-spacing:.17em;color:#8e96ab}.panel-overline{color:#ec8a9f}.panel-status{background:#22293a;color:#abb6cd;border:1px solid #30374a;border-radius:99px;font-size:9px;padding:6px 9px;white-space:nowrap}.panel-status i{display:inline-block;background:#49d8ac;width:6px;height:6px;border-radius:50%;margin-right:6px;box-shadow:0 0 9px #28bf9d}
.panel-title{font:700 clamp(25px,2.25vw,33px)/1.1 'Rajdhani',sans-serif;letter-spacing:.005em;margin:17px 0 5px;color:#fbfbff}.panel-title span{color:#f15d7b}.panel-description{color:#8793a9;font-size:11px;line-height:1.7;margin:0 0 23px}
.left-panel,.center-panel,.right-panel{display:flex;flex-direction:column;gap:0!important}.login-row{display:grid;gap:10px}.login-btn{height:49px!important;display:flex;align-items:center;text-align:left;gap:11px;padding:0 14px!important;background:#28314c!important;border:1px solid #4b5876!important;border-radius:10px!important;font-size:13px;transition:filter .2s,transform .2s}.login-btn.facebook{background:#273c60!important;border-color:#3f547b!important}.login-btn .auth-icon{font-size:20px;color:#fff;background:#ffffff15;width:29px;height:29px;display:grid;place-items:center;border-radius:7px}.login-btn small{margin-left:auto;padding:4px 7px;border:1px solid #ffffff30;border-radius:5px;color:#dae1f3;font-size:9px;letter-spacing:.12em}.login-btn:hover{filter:brightness(1.15)}.panel-separator{height:1px;background:linear-gradient(90deg,transparent,#384353,transparent);margin:25px 0 22px}.panel-miniheading{display:flex;align-items:center;justify-content:space-between;margin:0 0 14px}.panel-miniheading h3{font-size:11px;font-weight:700;color:#edf0fa;letter-spacing:.12em;margin:0}.panel-miniheading span{font-size:10px;color:#8490a6}.skin-gallery{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.skin-gallery .skin-slot{min-width:0;min-height:145px;border:1px solid #333b4d;background:linear-gradient(155deg,#212837,#151a27);border-radius:12px;padding:13px 8px 12px;display:flex;align-items:center;justify-content:flex-end;flex-direction:column;position:relative}.skin-gallery .skin-slot::before{content:none}.skin-gallery .skin-orb{position:absolute;top:22px;left:50%;transform:translateX(-50%);width:66px;height:66px;border-radius:50%;display:grid;place-items:center;font:700 26px 'Rajdhani';background:radial-gradient(circle at 30% 25%,#d15778,#53203b 65%,#16172a);border:2px solid #f3799944;color:#f6bac8;box-shadow:0 0 24px #cc37563a}.skin-gallery .skin-blue .skin-orb{background:radial-gradient(circle at 30% 25%,#7195cf,#2d436b 65%,#16172a);border-color:#95b8ff40;box-shadow:0 0 24px #528bea36}.skin-gallery .skin-slot>span{position:static;transform:none;font:700 11px var(--font);color:#bbc6d7;letter-spacing:.09em}.skin-gallery .skin-slot>b{position:static;border-radius:99px;background:#342332;color:#eb9bb1;font-size:8px;padding:5px 8px;margin-top:8px;letter-spacing:.04em}.panel-footnote{font-size:10px;line-height:1.8;color:#798499;margin:15px 0 0}
.center-top.swapped-inputs{grid-template-columns:minmax(0,1fr) 114px;gap:10px}.center-top .field-wrap{display:block;min-width:0}.field-wrap>span{display:block;color:#9ba6bd;font-size:9px;font-weight:700;letter-spacing:.15em;margin-bottom:7px}.center-top input{width:100%;height:45px;border:1px solid #3a4558;border-radius:9px;background:#111723;color:#f3f4fb;padding:0 12px;font-size:13px;box-shadow:inset 0 1px 8px #00000022}.center-top input::placeholder{color:#68768c}.center-top input:focus{border-color:#dc657f}
.select-caption{margin:22px 0 13px;display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:.13em;font-weight:700;color:#d5dbe8}.select-caption span{font-size:9px;color:#8e9ab1}
.mode-picks.big-modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.big-modes .mode-choice{min-height:172px;padding:14px 10px 12px;display:flex;flex-direction:column;align-items:center;text-align:center;border:1px solid #343c50;border-radius:11px;background:linear-gradient(155deg,#222b3b,#161c29);transition:transform .2s,border-color .2s,box-shadow .2s}.big-modes .mode-choice.selected{border:1px solid #f37288;background:linear-gradient(158deg,#393043,#211d2c);box-shadow:0 0 0 1px #f16d8640,0 10px 27px #ed456121}.mode-art{position:relative;display:block;width:66px;height:38px;margin-bottom:5px}.art-cell{display:block;position:absolute;border-radius:50%;box-shadow:inset -6px -8px 13px #0006,0 0 20px #ff719e25;background:linear-gradient(135deg,#ffd1de,#9f325d);border:2px solid #f4c3d7}.art-cell.a{width:32px;height:32px;top:3px;left:17px}.art-cell.b{width:15px;height:15px;top:19px;left:39px}.dual-art .art-cell.a{width:27px;height:27px;left:7px;top:6px}.dual-art .art-cell.b{width:27px;height:27px;left:34px;top:6px;background:linear-gradient(135deg,#d2ecff,#4675b3);border-color:#c0d9ff}.mega-art .art-cell.a{width:42px;height:42px;top:-2px;left:13px;background:linear-gradient(135deg,#e6baff,#8655b5);border-color:#ecd0ff}.mega-art .art-cell.b{display:none}.mode-choice strong{font:800 28px/1 'Rajdhani';margin:4px 0 0;max-width:none}.mode-choice small{color:#9aa6bc;font-size:9px;letter-spacing:0;margin-top:2px}.mode-choice .mode-mass{display:block;margin-top:auto;padding-top:11px;color:#f9d5df;font-size:10px;font-weight:700;letter-spacing:.075em}
.lobby-actions{display:grid;grid-template-columns:1.15fr 1fr;gap:9px;margin-top:18px}.lobby-actions .main-btn{width:100%;height:51px;border-radius:9px;font-size:11px;display:flex;align-items:center;justify-content:center;gap:9px;letter-spacing:.07em;box-shadow:inset 0 1px 0 #ffffff28,0 9px 20px #0003}.lobby-actions .play-blue{background:linear-gradient(105deg,#bf3151,#ef617d)}.lobby-actions .play-yellow{background:linear-gradient(105deg,#33435d,#495d7e);color:#eaf0ff}.play-symbol{font-size:15px}.action-arrow{margin-left:auto;font-size:16px}.lobby-actions .play-blue .play-symbol{margin-left:auto}.settings-lobby-btn{height:38px;width:100%;background:#1d2433;border:1px solid #353d50;border-radius:9px;color:#acb7cd;display:flex;align-items:center;justify-content:center;gap:10px;font-size:10px;font-weight:700;letter-spacing:.11em;margin-top:10px}.settings-lobby-btn span:last-child{font-size:18px}.settings-lobby-btn:hover{border-color:#a86383;color:white}
.region-tabs{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.region-tab{height:34px;background:#20283a;color:#8c9bb4;border:1px solid #323d54;border-radius:8px;font-size:9px;font-weight:700;letter-spacing:.02em}.region-tab.active{background:#763347;color:#ffe2ea;border-color:#ad4b64}.server-table{background:transparent!important;border-radius:0!important;padding:15px 0 0!important;gap:8px!important}.server-head-row{display:flex;justify-content:space-between;padding:0 2px 3px;font-size:9px;color:#74849d;letter-spacing:.14em}.server-row{display:flex;align-items:center;justify-content:space-between;text-align:left;min-height:66px;padding:11px 10px;border:1px solid #323a4b;border-radius:10px;background:#171e2c;color:#e9edf8;transition:border-color .2s,background .2s}.server-row.selected{background:#3b2436!important;border-color:#c85a7b}.server-row>span{display:grid;grid-template-columns:9px 1fr;grid-template-rows:auto auto;align-items:center;column-gap:9px}.server-led{grid-row:1/span 2;display:block;width:7px;height:7px;background:#e4617c;border-radius:50%;box-shadow:0 0 10px #eb3a68}.server-row strong{grid-column:2;font-size:12px;font-weight:700}.server-row small{grid-column:2;font-size:10px;color:#8793aa}.server-row em{font-style:normal;white-space:nowrap;font-size:9px;border:1px solid #394052;border-radius:5px;padding:5px 7px;color:#bac8d7;font-weight:700}.server-note{display:flex;align-items:flex-start;gap:9px;background:#18212f;border:1px solid #323a4a;border-radius:11px;padding:12px;margin-top:20px}.server-note-icon{width:18px;height:18px;flex:0 0 auto;display:grid;place-items:center;background:#354051;border-radius:50%;color:#b4c7e0;font-size:11px;font-weight:700}.server-note p{margin:0;font-size:10px;line-height:1.6;color:#8c99ad}
.lobby-bottom{display:flex;justify-content:space-between;gap:12px;font-size:9px;letter-spacing:.17em;color:#64758f;font-weight:700;padding:19px 5px 12px}
/* Camera HUD */
.zoom-panel{position:fixed;right:20px;bottom:235px;z-index:7;display:flex;align-items:center;gap:4px;background:#131b2adb;border:1px solid #3b4960;padding:5px;border-radius:11px;backdrop-filter:blur(12px);box-shadow:0 12px 30px #0007}.zoom-panel button{background:#28364a;border:1px solid #40516d;color:#f0f6ff;border-radius:7px;min-width:28px;height:29px;font-size:17px}.zoom-panel button:hover{background:#384c69}.zoom-panel span{font-size:11px;color:#d6e2f5;font-weight:700;width:49px;text-align:center;font-variant-numeric:tabular-nums}
body.is-spectating .status-card{display:none!important}body.is-spectating #help-panel{display:none!important}body.is-spectating #arena{cursor:crosshair}body.is-spectating.dragging-camera #arena{cursor:grabbing}
@keyframes vFloat{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(22px,-18px,0)}}@keyframes vTitleIn{from{opacity:0;transform:translateY(14px);filter:blur(3px)}to{opacity:1;transform:translateY(0);filter:drop-shadow(0 12px 29px #c52f4c35)}}
@media(max-width:1240px){.lobby-grid{grid-template-columns:minmax(195px,.85fr) minmax(360px,1.55fr) minmax(225px,1fr);gap:12px}.menu-panel{padding:17px!important}.panel-title{font-size:28px}.big-modes .mode-choice{min-height:161px}.mode-choice strong{font-size:24px}.center-top.swapped-inputs{grid-template-columns:minmax(0,1fr) 100px}}
@media(max-width:980px){.lobby{padding:0 15px 20px}.lobby-grid{grid-template-columns:1fr 1fr;max-width:780px;margin-inline:auto}.center-panel{grid-column:1/-1;grid-row:1}.left-panel,.right-panel{grid-row:2}.lobby-intro{padding:28px 0 26px}.hero-logo{font-size:88px}.big-modes .mode-choice{min-height:160px}.lobby-bottom{max-width:780px;margin:auto}.zoom-panel{bottom:20px;right:15px}}
@media(max-width:620px){.lobby{inset:58px 0 0}.lobby-grid{grid-template-columns:1fr;max-width:440px}.center-panel,.left-panel,.right-panel{grid-column:1;grid-row:auto}.center-panel{grid-row:1}.left-panel{grid-row:2}.right-panel{grid-row:3}.hero-logo{font-size:66px}.lobby-intro{padding:22px 0 18px}.lobby-intro p{font-size:11px}.lobby-eyebrow{font-size:8px}.menu-panel{padding:19px!important}.mode-picks.big-modes{grid-template-columns:repeat(3,minmax(0,1fr))}.big-modes .mode-choice{min-height:144px;padding:12px 6px}.mode-art{transform:scale(.75);margin-bottom:0}.mode-choice strong{font-size:25px!important}.mode-choice small{font-size:8px}.mode-choice .mode-mass{font-size:9px}.center-top.swapped-inputs{grid-template-columns:minmax(0,1fr) 86px}.region-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}.lobby-bottom{display:block;text-align:center;line-height:2}.lobby-bottom span{display:block}.zoom-panel{bottom:18px;right:10px}.spectate-hud{top:66px;gap:9px;padding:8px}.spectate-head small{font-size:8px}.spectate-exit{padding:9px 8px;font-size:9px}}
@media(prefers-reduced-motion:reduce){.hero-logo,.lobby-atmosphere i,.lobby:after{animation:none!important}}
/* Keep decorative light rings out of mobile horizontal scrolling. */
.lobby{overflow-x:hidden;overflow-y:auto}

/* Vintage 1.0: open-world lobby. Original design — crimson glass, live gameplay canvas and modular docks. */
body.show-lobby .topbar{visibility:hidden;pointer-events:none}
body.show-lobby .leader,body.show-lobby .status-card,body.show-lobby .chatbox,body.show-lobby .minimap,body.show-lobby .help-panel{display:none!important}
.vintage-stage.lobby{position:fixed;inset:0;z-index:9;width:100%;height:100%;min-height:600px;padding:0;display:block;overflow:auto;isolation:isolate;background:linear-gradient(90deg,rgba(3,9,17,.72),transparent 22%,transparent 76%,rgba(5,8,16,.69)),linear-gradient(180deg,rgba(6,10,20,.75) 0%,rgba(7,11,20,.18) 35%,rgba(3,7,16,.19) 64%,rgba(4,8,15,.88) 100%)}
.vintage-stage.lobby:before{content:"";position:absolute;inset:-10% -10%;z-index:-1;width:auto;height:auto;border-radius:0;pointer-events:none;background:radial-gradient(ellipse 35% 48% at 49% 42%,rgba(137,44,70,.13),transparent 72%),radial-gradient(ellipse 45% 48% at 87% 66%,rgba(33,104,137,.14),transparent 76%);filter:none;opacity:1;animation:none}
.vintage-stage.lobby:after{content:"";position:absolute;z-index:-1;inset:0;width:auto;height:auto;border-radius:0;opacity:.45;pointer-events:none;filter:none;background-image:linear-gradient(rgba(148,190,215,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(148,190,215,.08) 1px,transparent 1px);background-size:170px 170px;mask-image:linear-gradient(to bottom,transparent 3%,black 24%,black 82%,transparent 100%);animation:none}
.v-stage-noise{position:absolute;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(circle at 30% 60%,rgba(209,71,109,.12),transparent 38%),radial-gradient(circle at 72% 26%,rgba(74,152,194,.14),transparent 35%);animation:vGlowDrift 16s ease-in-out infinite alternate}
.v-stage-light{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(115deg,rgba(12,41,54,.16) 16%,transparent 41%,rgba(104,23,51,.09) 90%)}
.v-stage-header{position:absolute;top:0;left:0;right:0;z-index:3;padding:30px clamp(22px,4vw,74px);display:grid;grid-template-columns:1fr auto;align-items:start;gap:10px 24px}
.v-stage-logo{display:flex;align-items:center;gap:15px;width:max-content}.v-logo-symbol{width:57px;height:57px;display:grid;place-items:center;transform:skew(-7deg);border:1px solid #e26b84a1;border-radius:11px;background:linear-gradient(135deg,#411c34dd,#180f23c7);box-shadow:0 10px 32px #0007,0 0 27px #d94c6850,inset 0 1px 0 #ffb4bc22;color:#ffc3ce;font:800 39px 'Rajdhani',sans-serif}.v-stage-logo strong{display:block;font:800 clamp(27px,3vw,44px)/.92 'Rajdhani';letter-spacing:.18em;color:#fff}.v-stage-logo small{display:block;margin-top:8px;color:#d7a3af;letter-spacing:.3em;font-size:9px;font-weight:700}
.v-stage-nav{display:flex;align-items:center;gap:4px;padding:4px;background:rgba(13,19,30,.7);border:1px solid #ffffff17;border-radius:12px;backdrop-filter:blur(16px)}.v-stage-nav-link{padding:13px 21px;border:0;border-radius:8px;color:#d3dbe7;background:transparent;font-size:11px;font-weight:800;letter-spacing:.12em}.v-stage-nav-link:hover{background:rgba(243,112,138,.13);color:#fff}.v-nav-soon{margin-left:4px;font-size:8px;color:#ff94b0}
.v-stage-account{grid-column:2;display:flex;align-items:center;justify-content:flex-end;gap:10px;color:#c0cddd;font-size:10px;letter-spacing:.15em;font-weight:700}.v-guest-indicator{width:8px;height:8px;border-radius:50%;background:#e87994;box-shadow:0 0 14px #e87994}.v-login-btn{padding:8px 13px;color:#fff;border:1px solid #bd5069;border-radius:6px;background:#4a2638b8;font-weight:800;font-size:10px;letter-spacing:.07em}.v-login-btn span{margin-left:9px}
.v-stage-center{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);z-index:1;pointer-events:none;width:min(36vw,445px);aspect-ratio:1;display:grid;place-items:center}.v-halo{position:absolute;width:118%;height:118%;border-radius:50%;border:1px solid #e9698b36;box-shadow:0 0 80px #bc3a6527,inset 0 0 55px #b3487132;animation:vHalo 10s linear infinite}.v-halo-two{width:138%;height:138%;border:1px dashed #6cabc331;animation-duration:25s;animation-direction:reverse}.v-center-orb{position:relative;overflow:hidden;width:80%;aspect-ratio:1;border-radius:50%;border:5px solid rgba(221,229,247,.83);box-shadow:0 0 0 13px rgba(13,23,35,.54),0 0 45px #d8537f53,0 35px 110px rgba(0,0,0,.7);transform:rotate(-8deg);animation:vOrbFloat 6s ease-in-out infinite}.v-center-orb-hemisphere{position:absolute;top:0;bottom:0;width:50%;display:grid;place-items:center}.v-center-orb-hemisphere.left{left:0;background:radial-gradient(circle at 65% 15%,#ad627b 1%,#61273d 46%,#1a152b 98%)}.v-center-orb-hemisphere.right{right:0;background:radial-gradient(circle at 20% 25%,#bce5eb 0,#6795ab 41%,#1d3655 100%)}.v-center-orb:after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 23% 12%,#ffffff55,transparent 27%)}.v-center-orb:before{content:"";position:absolute;left:49.5%;width:1%;top:0;bottom:0;background:#fff8;z-index:2}.v-orb-mark{font:800 clamp(60px,8vw,130px) 'Rajdhani',sans-serif;color:#ffcbd6;opacity:.87;text-shadow:0 12px 17px #1a072c}.v-orb-number{font:800 clamp(55px,7vw,112px) 'Rajdhani';color:#e5f5f9;text-shadow:0 13px 17px #133449}.v-orb-sheen{position:absolute;inset:0;border-radius:50%;border:10px solid #ffffff14;box-shadow:inset 0 0 60px #0006}.v-center-caption{position:absolute;top:95%;display:flex;flex-direction:column;align-items:center;gap:6px;letter-spacing:.22em;color:#ccd5e3;text-shadow:0 2px 15px #000}.v-center-caption span{font-size:9px}.v-center-caption strong{font:700 17px 'Rajdhani',sans-serif;letter-spacing:.26em;color:#ffc7d5}
.v-launch-panel,.v-mode-panel{position:absolute;z-index:2;bottom:clamp(36px,5vw,69px);border:1px solid rgba(192,214,228,.22);border-radius:16px;background:linear-gradient(155deg,rgba(21,30,43,.95),rgba(13,20,33,.94));box-shadow:0 26px 75px rgba(0,0,0,.6),inset 0 1px 0 #ffffff13;backdrop-filter:blur(18px)}
.v-launch-panel{left:clamp(18px,4vw,72px);width:344px;padding:19px}.v-launch-top{display:flex;align-items:start;justify-content:space-between;padding-bottom:16px;border-bottom:1px solid #ffffff19}.v-launch-kicker{display:flex;align-items:center;gap:5px;font-size:9px;letter-spacing:.12em;color:#aebace;font-weight:700}.v-launch-kicker i{width:4px;height:4px;background:#d95e78;border-radius:50%;display:inline-block}.v-launch-top h1{margin:9px 0 0;font:800 32px/1 'Rajdhani',sans-serif;letter-spacing:.06em}.v-launch-top small{color:#dca2b2;font-size:10px;letter-spacing:.11em;font-weight:700}.v-launch-settings{width:32px;height:32px;border:1px solid #515a68;border-radius:7px;background:#273343;color:#e9c3cb;font-size:17px}
.v-launch-fields{display:grid;grid-template-columns:minmax(0,1fr) 76px;gap:9px;padding:16px 0}.v-launch-fields label{min-width:0}.v-launch-fields label span{display:block;margin:0 0 6px;font-size:9px;font-weight:800;letter-spacing:.14em;color:#9eadc1}.v-launch-fields input{height:38px;width:100%;border-radius:7px;border:1px solid #475368;background:#0b1422;color:#f4f7fc;padding:0 10px;font-size:12px}.v-launch-fields input:focus{border-color:#ed728d}.v-launch-actions{display:grid;gap:7px}.v-play-button,.v-spectate-button{display:flex;align-items:center;justify-content:space-between;width:100%;border:0;border-radius:8px;font-weight:800;letter-spacing:.13em;transition:transform .18s,filter .18s}.v-play-button{padding:13px 15px;height:52px;background:linear-gradient(105deg,#bc3858,#f36e88);box-shadow:0 10px 22px #bc38573d;color:#fff;font-size:14px}.v-spectate-button{height:40px;justify-content:center;background:#233347;color:#f0f5fc;border:1px solid #476078;font-size:11px}.v-play-button:hover,.v-spectate-button:hover{filter:brightness(1.12);transform:translateY(-1px)}.v-launch-foot{padding-top:12px;display:flex;justify-content:space-between;font-size:9px;letter-spacing:.06em;color:#99acbf;font-weight:700}.v-launch-foot i{display:inline-block;width:7px;height:7px;background:#71cfa8;border-radius:50%;box-shadow:0 0 10px #71cfa866;margin-right:5px}
.v-mode-panel{right:clamp(18px,4vw,72px);width:340px;padding:18px}.v-mode-header{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:15px}.v-mode-header small{display:block;color:#c78ca3;font-size:9px;letter-spacing:.18em;font-weight:700}.v-mode-header strong{display:block;font:800 17px 'Rajdhani';letter-spacing:.1em;margin-top:5px}.v-server-pulse{white-space:nowrap;font-size:10px;font-weight:700;color:#a0e3ce;border:1px solid #4374667d;background:#1c40374a;border-radius:99px;padding:6px 8px}
.v-mode-list{display:grid;gap:7px}.v-mode-list .mode-choice{display:grid;grid-template-columns:40px 1fr 20px;gap:9px;align-items:center;text-align:left;width:100%;min-height:58px;border-radius:9px;border:1px solid #344156;background:#152134;padding:9px;color:#e8eff8}.v-mode-list .mode-choice:hover{background:#25324a;border-color:#8b5974}.v-mode-list .mode-choice.selected{background:linear-gradient(100deg,rgba(106,36,60,.93),rgba(55,35,55,.96));border-color:#dd6782;box-shadow:inset 2px 0 #fd92a5}.v-mode-icon{width:35px;height:35px;display:grid;place-items:center;border-radius:50%;background:rgba(115,153,186,.15);color:#e7bccc;font:700 16px 'Rajdhani'}.v-mode-description{display:flex;flex-direction:column;gap:3px}.v-mode-description strong{font:800 19px/1 'Rajdhani';margin:0}.v-mode-description small{font-size:9px;color:#a3afc6;letter-spacing:.11em}.v-mode-indicator{color:#dba1b5;font-size:16px}.v-mode-footer{display:flex;justify-content:space-between;gap:8px;padding:15px 0 1px;color:#889aad;font-size:9px}.v-mode-footer b{color:#c9d8e6;font-weight:700}
.v-stage-bottom-note{position:absolute;bottom:10px;left:clamp(18px,4vw,72px);right:clamp(18px,4vw,72px);display:flex;justify-content:space-between;color:#a8b0c070;font-size:9px;letter-spacing:.2em;font-weight:700}.v-stage-bottom-note b{color:#e46f86}
@keyframes vGlowDrift{0%{transform:translateX(-2%) translateY(0)}100%{transform:translateX(2%) translateY(-2%)}}
@keyframes vHalo{to{transform:rotate(360deg)}}
@keyframes vOrbFloat{0%,100%{translate:0 0}50%{translate:0 -9px}}
@media(max-width:1130px){.v-stage-center{width:min(30vw,350px);top:41%}.v-launch-panel{width:312px}.v-mode-panel{width:292px}.v-stage-logo strong{font-size:31px}}
@media(max-width:790px){.vintage-stage.lobby{overflow-y:auto;min-height:100vh}.v-stage-header{position:relative;padding:19px 18px 4px;grid-template-columns:1fr}.v-stage-nav{grid-column:1;justify-content:center;flex-wrap:wrap;margin-top:8px}.v-stage-nav-link{padding:10px 12px}.v-stage-account{grid-column:1;justify-content:center;padding-top:6px}.v-stage-center{position:relative;left:auto;top:auto;transform:none;width:min(63vw,270px);margin:30px auto 58px}.v-center-caption{top:105%;min-width:260px}.v-launch-panel,.v-mode-panel{position:relative;bottom:auto;left:auto;right:auto;width:min(92vw,540px);margin:16px auto}.v-launch-panel{margin-top:10px}.v-mode-panel{margin-bottom:47px}.v-stage-bottom-note{position:relative;bottom:auto;left:auto;right:auto;margin:0 auto 20px;width:min(92vw,540px);font-size:8px;gap:12px}.v-center-orb{width:78%}}
@media(max-width:440px){.v-stage-logo strong{font-size:28px}.v-stage-logo small{font-size:8px}.v-logo-symbol{width:45px;height:45px;font-size:31px}.v-stage-nav-link{font-size:10px;padding:8px}.v-stage-center{margin:24px auto 45px}.v-stage-bottom-note{display:none}}
@media(prefers-reduced-motion:reduce){.vintage-stage .v-stage-noise,.vintage-stage .v-halo,.vintage-stage .v-center-orb{animation:none!important}}
/* Robust font fallback for offline builds and an accessible login preview. */
.v-stage-logo strong,.v-logo-symbol,.v-launch-top h1,.v-mode-header strong,.v-mode-description strong,.v-orb-mark,.v-orb-number,.v-center-caption strong{font-family:'Rajdhani','Arial Narrow',Arial,sans-serif}
.v-stage-account{position:relative}
.v-auth-menu{position:absolute;z-index:5;right:0;top:40px;width:240px;border:1px solid #b66379;background:linear-gradient(160deg,#252b39,#141d2e);border-radius:12px;box-shadow:0 20px 50px #0009;padding:12px;display:grid;gap:8px}
.v-auth-menu>div{display:flex;align-items:center;justify-content:space-between;color:#e9d1d9;letter-spacing:.12em;font-size:9px;font-weight:800;padding:3px 3px 8px}
.v-auth-menu>div small{color:#e989a5;letter-spacing:.04em;font-size:8px}
.v-auth-option{width:100%;display:flex;justify-content:space-between;align-items:center;border:1px solid #38445a;border-radius:7px;background:#19243a;padding:11px;color:#f7f8ff;font-weight:700;text-align:left}
.v-auth-option:hover{border-color:#ba5973}
.v-auth-option span{font-size:9px;color:#e59aae}
.v-skin-control{position:absolute;z-index:3;top:49%;transform:translateY(-50%);pointer-events:auto;border:1px solid #ffffff5c;background:#171f30cf;color:#fff;box-shadow:0 8px 25px #0008;border-radius:6px;padding:9px 11px;font-size:10px;font-weight:800;letter-spacing:.1em;backdrop-filter:blur(8px);display:flex;flex-direction:column;gap:3px;align-items:center}
.v-skin-control small{font-size:8px;letter-spacing:.05em;color:#f2a6b9}
.v-skin-control:hover{border-color:#ea83a0;background:#3c2a3c}
.v-skin-left{left:-8%}.v-skin-right{right:-8%}
@media(max-width:790px){.v-skin-left{left:-16%}.v-skin-right{right:-16%}}
/* Vintage silver identity and compatible theme presets */
.vintage-logo{width:240px;height:74px;object-fit:contain;display:block}.brand .vintage-logo{width:165px;height:48px}.v-stage-logo .vintage-logo{width:300px;height:96px}.settings-brand{flex-direction:column;gap:0}.settings-brand .vintage-logo{width:360px;height:100px}.settings-brand small{color:#a7bccd;letter-spacing:.65em;font-size:9px}.settings-brand-wrap{margin:auto}.settings-header{position:relative;min-height:126px;background:linear-gradient(115deg,#101720dd,#26354288,#0a1019dd)}.settings-close{position:absolute;right:20px;top:22px;color:#d9e6f2}.settings-shell{width:min(1080px,96vw);height:min(790px,94vh);border:2px solid #9bafc1;border-radius:var(--theme-radius);background:var(--theme-panel);box-shadow:0 0 0 4px #0c121b,0 0 0 5px #5d7487,0 30px 100px #000,inset 0 0 25px #93ceff22}.settings-tabs{background:#0b111b;gap:12px;padding:12px 18px}.settings-tabs button{border-radius:3px;border-color:#4e6377;background:linear-gradient(#293441,#101722);font-size:16px;height:49px}.settings-tabs button.active{background:linear-gradient(120deg,#182633,var(--accent));color:#fff;border-color:#c1e9ff;box-shadow:inset 0 0 14px #d1efff44,0 0 13px #78cfff44;text-shadow:0 1px 3px #000}.settings-body{grid-template-columns:195px 1fr;border-top:1px solid #5c7489;margin:0 17px}.settings-nav{background:linear-gradient(#131d29ee,#080d16cc);border-right:1px solid #577083}.settings-nav button{font-size:14px;padding:20px 18px;border-bottom:1px solid #45596b66}.settings-nav button.active{background:linear-gradient(100deg,#384956,#152333);border-left-color:var(--accent);box-shadow:inset 0 0 15px #c5e7ff11}.settings-content{background:linear-gradient(135deg,#202d39d9,#0c141eea);padding:8px 25px 24px}.settings-section-title{font-size:13px;letter-spacing:.32em;font-weight:500;color:#b7cadb;margin:23px 0}.setting-row{border:1px solid #5265757a;border-radius:4px;margin:12px 0;padding:16px 20px;background:linear-gradient(110deg,#0a121a88,#8195ab12);min-height:72px}.setting-label{font-size:14px}.toggle-switch input:checked+.toggle-slider{background:linear-gradient(90deg,#12364c,var(--accent));border-color:#b5dfff;box-shadow:0 0 9px #8bd6ff66}.toggle-slider:before{background:linear-gradient(135deg,#fff,#8e9eab,#eef4f8);border:1px solid #eff7ff;box-shadow:0 2px 5px #0009}.toggle-status{color:#b1cce1}.setting-control input[type=range]{accent-color:var(--accent)}.settings-foot{background:#0d141e;border-top:1px solid #6a8092;padding:15px 24px;color:#8fabbf}.settings-foot button{background:linear-gradient(#e3ecf1,#8c9cac,#d4e1eb);color:#122130;border:1px solid #f1f7ff;border-radius:3px;min-width:170px;letter-spacing:.15em}.vintage-background-enabled .settings-shell{background-image:linear-gradient(#111c29bb,#0b121bce),url('/assets/vintage-background.png');background-size:cover}.vintage-background-enabled .vintage-stage{background-image:linear-gradient(#060a11aa,#060a11bb),url('/assets/vintage-background.png');background-size:cover;background-position:center}.v-launch-panel{left:auto;right:5vw;width:360px;border-radius:var(--theme-radius);background:var(--theme-panel)}.v-stage-center{left:32%}.v-play-button{background:linear-gradient(115deg,#5d7c94,var(--accent));color:#0b1823}.server-picker-btn{width:100%;display:flex;justify-content:space-between;gap:8px;padding:13px 10px;margin:17px 0 0;background:#0e1823;border:1px solid #566b7e;border-radius:4px;color:#bfcedc;font-size:10px;letter-spacing:.08em}.server-picker-btn span{color:var(--accent)}.server-dialog{width:min(610px,94vw);max-height:88vh;overflow:auto;background:var(--theme-panel,#121c27);border:1px solid #91aabd;box-shadow:0 20px 100px #000;padding:26px;border-radius:var(--theme-radius,4px)}.server-dialog header{display:flex;justify-content:space-between;align-items:center}.server-dialog h2{margin:8px 0 24px;letter-spacing:.08em}.server-dialog small{color:#a3b8cc;font-size:10px;letter-spacing:.2em}#server-regions{display:flex;gap:10px;margin-bottom:22px}#server-regions button{flex:1;padding:13px;background:#0b111b;border:1px solid #43576b;color:#a9bdce}#server-regions button.active{border-color:var(--accent);color:var(--accent);background:#2b3e5044}.server-entry{display:flex;width:100%;padding:20px;margin:10px 0;justify-content:space-between;align-items:center;background:#16222e;border:1px solid #3a5063;color:#e5edf4;border-radius:4px}.server-entry span{font-size:10px;color:#9eb4c5}.server-entry.selected{border-color:var(--accent)}.server-empty{padding:50px 10px;text-align:center;color:#9cafbf}.theme-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.theme-card{text-align:left;padding:18px;background:var(--card-bg);border:1px solid #455363;border-radius:var(--theme-radius);color:#edf3f9}.theme-card.selected{border:2px solid var(--swatch);padding:17px}.theme-card strong{display:block;margin:14px 0 8px;color:var(--swatch);font-size:14px}.theme-card span{font-size:11px;color:#a0b2c4;line-height:1.6}.theme-preview{height:75px;border:1px solid #ffffff20;display:flex;align-items:center;justify-content:center;gap:12px;background:linear-gradient(140deg,#ffffff08,#0003)}.theme-preview i{width:36px;height:36px;border-radius:50%;background:var(--swatch);opacity:.7}.theme-preview i:nth-child(2){width:26px;height:26px;opacity:.4}.theme-preview i:nth-child(3){width:18px;height:18px;opacity:.25}.hud-panel{border-radius:var(--theme-radius);background:var(--theme-panel)}#auth-status{display:block;color:#c4d4e3;line-height:1.5;padding:8px}.v-auth-menu{z-index:30}.v-stage-logo{min-width:0}
@media(max-width:790px){.v-stage-center{left:auto}.v-launch-panel{left:auto;right:auto;width:min(92vw,540px)}.v-stage-logo .vintage-logo{margin:auto}.settings-brand .vintage-logo{width:240px;height:68px}.settings-header{min-height:97px}.settings-body{grid-template-columns:120px 1fr;margin:0 8px}.settings-nav button{padding:16px 9px;font-size:12px}.settings-content{padding:5px 12px}.setting-row{padding:12px}.theme-grid{grid-template-columns:1fr}.settings-tabs{gap:5px;padding:8px}.settings-tabs button{font-size:12px}.settings-foot button{min-width:90px}.v-stage-account{z-index:10}}
.setting-control input[type=range]::-webkit-slider-thumb{background:linear-gradient(135deg,#f6fbff,#8597a8,#eaf1f7);border:2px solid #b8d4e9;box-shadow:0 0 7px #acdfff55}.setting-control input[type=range]::-moz-range-thumb{background:linear-gradient(135deg,#f6fbff,#8597a8);border:2px solid #b8d4e9}.settings-content .settings-section-title{font-size:14px;font-weight:500}
@media(max-width:620px){.overlay{padding:12px}.settings-shell{width:100%;max-width:100%;height:94vh}.settings-body{grid-template-columns:104px minmax(0,1fr)}.settings-tabs{grid-template-columns:repeat(4,minmax(0,1fr))}.settings-tabs button{font-size:10px;overflow-wrap:anywhere}.settings-brand .vintage-logo{width:215px}.settings-content{min-width:0}.theme-card{padding:12px}.theme-card.selected{padding:11px}.settings-foot{padding:12px}.settings-foot span{font-size:7px}}

/* Vintage v12 — unified game HUD, real metrics, user themes and emoji chat */
:root{--hud-border:#3b5266}
body:not(.show-lobby) .topbar{background:linear-gradient(180deg,rgba(8,15,26,.92),rgba(10,18,30,.78));border-bottom-color:color-mix(in srgb,var(--hud-border),transparent 45%)}
body:not(.show-lobby) .hud-panel{border-color:color-mix(in srgb,var(--hud-border),#c6e6ff 20%);background:color-mix(in srgb,var(--theme-panel,#121c27),transparent 7%);box-shadow:0 16px 50px #0005, inset 0 1px #fff1;backdrop-filter:blur(12px)}
body:not(.show-lobby) .leader{top:78px;width:220px;right:19px;padding:15px}
body:not(.show-lobby) .status-card{top:78px;left:19px;width:207px;padding:15px}
.status-label{font-weight:700}.score-line strong{font-size:30px}
.hud-heading small{white-space:nowrap;padding-left:9px}
.leader-entry{font-size:12px;gap:8px}.leader-entry b{font-weight:600}
body:not(.show-lobby) .minimap{right:20px;bottom:65px;padding:12px;width:172px}
body:not(.show-lobby) .zoom-panel{right:20px;bottom:294px}
.live-stats{position:fixed;z-index:5;left:50%;transform:translateX(-50%);bottom:15px;display:flex;align-items:center;justify-content:center;gap:0;min-height:43px;max-width:calc(100vw - 20px);background:color-mix(in srgb,var(--theme-panel,#121c27),transparent 4%);color:var(--text);border:1px solid var(--hud-border);border-radius:8px;box-shadow:0 12px 42px #0008;backdrop-filter:blur(15px);overflow:hidden}
.live-stats>div{padding:5px 17px;display:flex;align-items:center;gap:9px;border-right:1px solid #ffffff21;white-space:nowrap}.live-stats>div:last-child{border:0}
.live-stats small{font:700 11px 'Rajdhani',sans-serif;letter-spacing:.1em;color:#9cb6ca}.live-stats strong{font:700 15px 'Rajdhani',sans-serif;color:var(--text);font-variant-numeric:tabular-nums}
.live-stats>div:nth-child(2) strong{color:var(--accent)}
body.show-lobby .live-stats{display:none}
body:not(.show-lobby) .chatbox{left:19px;bottom:66px;width:min(406px,calc(100vw - 40px));height:303px;border-radius:10px;overflow:visible;transition:width .14s,height .14s}
body:not(.show-lobby) .chatbox.chat-active{width:min(452px,calc(100vw - 40px));height:370px;z-index:10}
.chat-head{padding:12px 15px;font-size:12px;background:#ffffff08}.chat-head b{font-family:'Rajdhani',sans-serif;letter-spacing:.16em;font-size:14px}
.chat-tabs{padding:9px 14px;gap:10px}.chat-tab{font-size:11px;padding:5px 17px}
.chat-messages{padding:14px 15px;font-size:12px;line-height:1.55;min-height:0;scrollbar-color:#466276 transparent;scrollbar-width:thin}
.msg{margin-bottom:10px;overflow-wrap:anywhere}.msg .who{color:var(--accent)}
#chat-form{position:relative;gap:7px;padding:10px;background:color-mix(in srgb,var(--theme-panel,#121c27),#000 15%);border-radius:0 0 10px 10px}
#chat-form input{min-width:0;height:42px;font-size:12px;outline-offset:-2px;border-radius:7px}
#chat-form button{flex:0 0 40px;height:42px;border-radius:7px}
#chat-form .emoji-toggle{color:var(--text);border:1px solid var(--hud-border);background:#1d2b3b;font-size:25px;line-height:1}
#chat-form .chat-send{background:var(--accent);color:#0c1521;font-size:22px;font-weight:800}
.emoji-picker{flex:0 0 auto;background:color-mix(in srgb,var(--theme-panel,#121c27),#000 14%);border-top:1px solid var(--hud-border);padding:10px 12px 11px;box-shadow:0 -8px 20px #0005;max-height:180px;display:flex;flex-direction:column;gap:7px}
.emoji-toolbar{display:flex;align-items:center;gap:10px;justify-content:space-between;font-size:10px;letter-spacing:.15em;color:var(--text)}
.emoji-toolbar input{width:150px;height:25px;padding:4px 8px;border:1px solid var(--hud-border);border-radius:5px;color:var(--text);background:#071520;letter-spacing:0;font-size:11px}
.emoji-grid{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:3px;overflow:auto;max-height:120px;scrollbar-color:#53667e transparent;scrollbar-width:thin}
.emoji-option{background:transparent;border:1px solid transparent;border-radius:5px;font-size:22px;height:30px;padding:0;line-height:1.3}
.emoji-option:hover,.emoji-option:focus-visible{background:#ffffff1c;border-color:var(--accent)}
.emoji-empty{grid-column:1/-1;color:#afc2d0;padding:10px}
.theme-card.custom-theme-card{--swatch:var(--accent);--card-bg:#101e2a;background:linear-gradient(155deg,#1e3544,#111b28);border-style:dashed}
.theme-card.custom-theme-card .theme-preview{background:linear-gradient(100deg,#6a9ba0,#a675bc,#da9a6a,#678a8c)}
.theme-card.custom-theme-card .theme-preview i:nth-child(1){background:#a9dcff}.theme-card.custom-theme-card .theme-preview i:nth-child(2){background:#f065b5}.theme-card.custom-theme-card .theme-preview i:nth-child(3){background:#f4ca76}
.theme-intro{color:#b4c8d9;font-size:12px;line-height:1.7;margin:8px 0 18px}
.theme-name-field{margin:7px 0 15px}.theme-name-field .theme-field{max-width:100%}
.theme-field{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0;background:#0d1925a8;padding:10px 12px;border:1px solid #ffffff23;border-radius:6px;color:var(--text);font-size:12px;font-weight:600}
.theme-field>span{min-width:0;line-height:1.3}.theme-field input{height:33px;background:#0a1420;border:1px solid var(--hud-border);border-radius:6px;color:var(--text);font-size:12px}
.theme-field input[type=color]{width:66px;min-width:66px;padding:3px;cursor:pointer}
.theme-field input[type=url],.theme-field input[type=text]{width:min(360px,70%);padding:8px 10px}
.custom-colors{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.theme-assets{display:grid;gap:9px;margin-top:12px}.theme-assets .theme-field{flex-wrap:wrap}.theme-assets input[type=url]{flex:1;min-width:150px}
.custom-theme-actions{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}
.custom-theme-actions button{padding:12px 15px;border:1px solid var(--hud-border);background:#162c3e;border-radius:6px;color:var(--text);font-weight:700}
.custom-theme-actions .blue{color:#0d1a26;background:var(--accent);border-color:var(--accent)}
@media(max-width:900px){.live-stats>div{padding:5px 9px}.live-stats small{font-size:10px}.live-stats strong{font-size:13px}body:not(.show-lobby) .chatbox{width:min(350px,calc(100vw - 36px))}}
@media(max-width:630px){.live-stats{bottom:6px;justify-content:flex-start;overflow:auto}.live-stats>div{padding:5px 8px}.live-stats>div:last-child{display:none}body:not(.show-lobby) .chatbox{left:8px;bottom:59px;width:min(310px,calc(100vw - 16px));height:238px}body:not(.show-lobby) .chatbox.chat-active{width:min(375px,calc(100vw - 16px));height:355px}.emoji-grid{grid-template-columns:repeat(8,minmax(0,1fr))}.custom-colors{grid-template-columns:1fr}body:not(.show-lobby) .leader{right:8px;top:67px;width:172px}body:not(.show-lobby) .status-card{left:8px;top:67px;width:165px}body:not(.show-lobby) .minimap{right:8px;bottom:64px}}

/* Vintage v13 — Sector map, group list, generous chat and timed notices */
body:not(.show-lobby) .minimap{
  position:fixed;top:77px;bottom:auto;right:18px;width:266px;
  padding:11px 12px 10px;border-radius:4px;gap:6px;
  background:rgba(7,16,27,.9);border:1px solid #47637a;
}
body:not(.show-lobby) .minimap canvas{
  display:block;width:240px;height:240px;max-width:100%;border:0;border-radius:0;
  background:#091725;image-rendering:auto;
}
.minimap .map-head,.minimap .map-foot{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  width:100%;font:700 11px/1.2 'Rajdhani',sans-serif;
  color:#b7d0e1;letter-spacing:.13em;
}
.minimap .map-head small{font:800 16px 'Rajdhani',sans-serif;color:#f6faff}
.minimap .map-foot{font-size:10px;color:#7da1b4;letter-spacing:.05em}
.minimap .map-foot span{font-size:10px;color:#9ab8c9;letter-spacing:.06em}
body:not(.show-lobby) .leader{
  position:fixed;right:18px;top:398px;bottom:auto;width:266px;
  padding:13px 14px;background:rgba(7,16,27,.83);border-radius:4px;
  max-height:min(325px,calc(100vh - 480px));overflow:auto;
}
.leader .hud-heading{font-size:13px;letter-spacing:.1em;color:#f6b7d7}
.leader .hud-heading small{font-size:10px;color:#879ba9}
body:not(.show-lobby) .leader-entry{
  display:grid;grid-template-columns:15px 45px 27px minmax(0,1fr);
  align-items:center;gap:6px;padding:7px 0;font:700 11px 'Rajdhani',sans-serif;
}
.leader-entry>span:first-child{width:auto;font-size:12px;color:#dce5f3}
.leader-entry b{grid-column:4;grid-row:1;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.leader-entry em{grid-column:2;grid-row:1;color:#deedff;font-style:normal;font-size:12px}
.leader-entry .ally-sector{grid-column:3;grid-row:1;color:#9ab8c9;font-weight:700;font-size:11px}
.leader-entry.is-me{background:#bce9ff0b}.leader-entry.is-me b{color:#d7ffff}
body:not(.show-lobby) .status-card{top:88px;left:16px;width:211px;border-radius:5px}
body:not(.show-lobby) .zoom-panel{right:18px;bottom:73px;z-index:5}
body:not(.show-lobby) .chatbox{
  left:15px;bottom:69px;width:min(428px,calc(100vw - 35px));height:min(490px,calc(100vh - 180px));
  border-radius:6px;background:rgba(7,15,25,.78);box-shadow:0 8px 45px #0006;
}
body:not(.show-lobby) .chatbox.chat-active{
  width:min(458px,calc(100vw - 35px));height:min(515px,calc(100vh - 160px));
}
body:not(.show-lobby) .chat-head{
  padding:11px 13px 9px;background:#091420e9;border-bottom-color:#2c4658;
}
body:not(.show-lobby) .chat-head b{font:700 15px 'Rajdhani',sans-serif;letter-spacing:.13em}
body:not(.show-lobby) .chat-tabs{padding:6px 13px;border-bottom:1px solid #2a3543}
body:not(.show-lobby) .chat-tab{border-radius:3px;padding:5px 13px;background:transparent;border:1px solid transparent;color:#d3dfea}
body:not(.show-lobby) .chat-tab.active{background:var(--pink);border-color:transparent;color:#161927}
body:not(.show-lobby) .chat-messages{padding:11px 14px;font-size:12px;line-height:1.45}
body:not(.show-lobby) .msg{margin-bottom:5px;color:#e2e4f0}
body:not(.show-lobby) .msg .who{color:#eaa0cf}
body:not(.show-lobby) .msg.system{color:#aec9d7;font-size:11px}
.chat-emoji-toolbar{display:flex;align-items:center;gap:7px;padding:5px 10px;min-height:41px;
  border-top:1px solid #314050;background:#0b1826}
.chat-emoji-toolbar>span{font:700 9px 'Rajdhani',sans-serif;letter-spacing:.09em;color:#92aabd;white-space:nowrap}
.chat-emoji-toolbar .emoji-hint{font-size:8px;color:#6e9cae}
.emoji-quick{display:flex;gap:1px;flex:1;align-items:center;justify-content:space-evenly;min-width:0}
.quick-emoji{border:0;background:transparent;color:white;border-radius:5px;font-size:20px;height:28px;min-width:25px;padding:0 2px;line-height:1;flex-shrink:1}
.quick-emoji:hover,.quick-emoji:focus-visible{background:#ffffff20;transform:translateY(-1px)}
body:not(.show-lobby) .emoji-picker{
  position:absolute;z-index:11;bottom:105px;left:10px;right:10px;
  max-height:240px;border:1px solid #426079;border-radius:6px;background:#101c2a;
  box-shadow:0 -9px 35px #000a;overflow:hidden;
}
body:not(.show-lobby) .emoji-grid{max-height:175px;grid-template-columns:repeat(10,minmax(0,1fr))}
body:not(.show-lobby) #chat-form{padding:8px;border-radius:0 0 6px 6px}
body:not(.show-lobby) #chat-form input{height:42px;border-radius:4px}
body:not(.show-lobby) #chat-form button{height:42px;border-radius:4px}
.restart-clock{position:fixed;z-index:6;top:66px;left:50%;transform:translateX(-50%);
  display:flex;align-items:center;justify-content:center;gap:9px;padding:7px 12px;
  border:1px solid #486679;border-radius:5px;background:#0c1828ef;
  box-shadow:0 10px 22px #0006;color:#cfdfec;white-space:nowrap;
  font:700 10px 'Rajdhani',sans-serif;letter-spacing:.11em}
.restart-clock strong{font-size:14px;font-variant-numeric:tabular-nums;color:#fff}
.server-announcement{position:fixed;z-index:20;top:106px;left:50%;transform:translateX(-50%);
  background:#161d2deF;border:1px solid #e1b67f;border-radius:5px;
  padding:12px 20px;text-align:center;min-width:250px;max-width:95vw;
  font:700 14px 'Rajdhani',sans-serif;box-shadow:0 10px 35px #0009;color:#ffdfad}
body.show-lobby .restart-clock,body.show-lobby .server-announcement{display:none!important}
@media(max-width:1000px){
  body:not(.show-lobby) .minimap{top:80px;width:206px;padding:8px;right:8px}
  body:not(.show-lobby) .minimap canvas{width:188px;height:188px}
  body:not(.show-lobby) .leader{top:330px;width:206px;right:8px;max-height:calc(100vh - 417px)}
  body:not(.show-lobby) .chatbox{width:min(370px,calc(100vw - 230px));height:min(400px,calc(100vh - 190px));left:8px}
  body:not(.show-lobby) .live-stats>div{padding:5px 9px}
  .chat-emoji-toolbar .emoji-hint{display:none}
}
@media(max-width:650px){
  body:not(.show-lobby) .minimap{width:153px;top:68px;right:6px;padding:6px}
  body:not(.show-lobby) .minimap canvas{width:139px;height:139px}
  body:not(.show-lobby) .leader{top:246px;right:6px;width:153px;padding:7px;max-height:130px}
  .leader-entry b{font-size:10px}.leader-entry .ally-sector{display:none}
  body:not(.show-lobby) .leader-entry{grid-template-columns:12px 35px minmax(0,1fr)}
  .leader-entry b{grid-column:3}
  body:not(.show-lobby) .status-card{left:6px;top:68px;width:153px;padding:8px}
  body:not(.show-lobby) .chatbox,body:not(.show-lobby) .chatbox.chat-active{left:6px;bottom:64px;width:calc(100vw - 12px);height:230px}
  body:not(.show-lobby) .chat-messages{padding:6px 9px;font-size:11px}
  .chat-emoji-toolbar>span{display:none}.quick-emoji{font-size:17px;min-width:21px}
  .restart-clock{top:52px;transform:translateX(-50%) scale(.84)}
  .server-announcement{top:87px}
  .live-stats{width:calc(100vw - 12px);bottom:6px;overflow-x:auto;justify-content:flex-start}
  .live-stats>div{padding:4px 8px}
  .live-stats small{font-size:9px}.live-stats strong{font-size:11px}
  body:not(.show-lobby) .zoom-panel{bottom:305px;right:8px}
}

/* Cell animation duration */
.setting-row.animation-setting{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;padding:20px;min-height:112px}
.animation-setting .setting-label{display:flex;align-items:center;gap:9px}
.animation-setting .setting-value{min-width:58px;height:22px;padding:0 9px;border:1px solid #53657566;border-radius:5px;background:#0a121bb3;color:#d4e1ed;font-size:11px;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.animation-setting .setting-control{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;max-width:none;min-width:0;width:100%;text-align:left}
.animation-setting .setting-control input[type=range]{width:100%;height:8px;margin:0;background:linear-gradient(to right,var(--accent) 0%,var(--accent) var(--range-progress),#0a111a var(--range-progress),#0a111a 100%);cursor:pointer}
.animation-setting .setting-control input[type=range]::-webkit-slider-thumb{width:20px;height:20px;background:#f8fcff;border:2px solid #f8fcff;box-shadow:0 1px 5px #0005}
.animation-setting .setting-control input[type=range]::-moz-range-thumb{width:16px;height:16px;background:#f8fcff;border:2px solid #f8fcff;box-shadow:0 1px 5px #0005}
.animation-setting .setting-control input[type=range]:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.animation-hint{color:#91a7b9;font-size:10px;line-height:1.5;letter-spacing:.01em}

/* Flat arena cells and editable theme values */
.setting-row.slider-setting{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;padding:20px;min-height:102px}
.slider-setting .setting-label{display:flex;align-items:center;gap:9px}
.slider-setting .setting-control{width:100%;max-width:none;min-width:0}
.slider-setting .setting-control input[type=range]{width:100%;height:8px;margin:0;background:linear-gradient(to right,var(--accent) 0%,var(--accent) var(--range-progress),#0a111a var(--range-progress),#0a111a 100%)}
.slider-setting .setting-control input[type=range]::-webkit-slider-thumb{background:#fff;border:2px solid #fff;width:20px;height:20px}
.slider-setting .setting-control input[type=range]::-moz-range-thumb{background:#fff;border:2px solid #fff;width:16px;height:16px}
.color-editor{display:flex;align-items:center;gap:8px;background:#14212d;border:1px solid #536575;border-radius:5px;padding:4px;max-width:100%}
.setting-control .color-editor input[type=text]{width:90px;min-width:0;padding:5px 8px;border:0;border-radius:3px;background:transparent;font:600 12px monospace;text-transform:uppercase}
.setting-control .color-editor input[type=color]{width:34px;height:32px;min-width:34px;padding:0;border:0;border-radius:5px;background:transparent}
.color-editor input[aria-invalid=true]{outline:1px solid #ff778d;outline-offset:-1px}
.color-editor input[type=color]::-webkit-color-swatch-wrapper{padding:0}.color-editor input[type=color]::-webkit-color-swatch{border:0;border-radius:4px}
.toggle-switch{position:relative}
.toggle-switch input{display:block;position:absolute;width:1px;height:1px;opacity:0;margin:0}
.toggle-switch input:focus-visible+.toggle-slider{outline:2px solid var(--accent);outline-offset:4px}
@media(max-width:620px){.setting-row.slider-setting{padding:14px;gap:17px}.color-editor{width:100%;justify-content:space-between}.setting-control .color-editor input[type=text]{width:85px}.setting-control select{min-width:0}}

/* Compact chat overlay: readable history on the field, composer centered below. */
body:not(.show-lobby) #chat,body:not(.show-lobby) #chat.chat-active{
  position:fixed;left:14px;bottom:78px;top:auto;right:auto;width:min(350px,calc(100vw - 28px));
  height:min(270px,38vh);display:flex;flex-direction:column;border:0;border-radius:0;
  background:transparent;box-shadow:none;backdrop-filter:none;filter:none;transform:none;overflow:visible;pointer-events:none;z-index:8;
}
body:not(.show-lobby) #chat .chat-head{display:none}
body:not(.show-lobby) #chat .chat-tabs{align-self:flex-start;flex-shrink:0;pointer-events:auto;padding:0;gap:0;border:0;background:#10151c66}
body:not(.show-lobby) #chat .chat-tab{border:1px solid #647382;border-radius:2px;padding:5px 10px;background:linear-gradient(#a3adb7,#65717d);color:#101820;font:600 11px Arial,sans-serif}
body:not(.show-lobby) #chat .chat-tab.active{background:linear-gradient(#f0f4f8,#b3c0cc);color:#101820;border-color:#e3ebf1;box-shadow:inset 0 -2px #8c9ba8}
body:not(.show-lobby) #chat .chat-messages{padding:6px 0;flex:1;min-height:0;overflow:auto;background:transparent;font:12px/1.55 Arial,sans-serif;mask-image:linear-gradient(transparent,#000 8%);pointer-events:none;scrollbar-width:thin}
body:not(.show-lobby) #chat.chat-active .chat-messages{pointer-events:auto}
body:not(.show-lobby) #chat .msg{margin:0 0 3px;color:#f4f6f8;text-shadow:0 1px 3px #000,1px 0 2px #000;overflow-wrap:anywhere}
body:not(.show-lobby) #chat .msg .who{font-weight:600}
body:not(.show-lobby) #chat .msg time{font-size:10px;color:#a2acb8;margin-right:6px}
body:not(.show-lobby) #chat .msg.system{font-size:11px;color:#c4d3df}
body:not(.show-lobby) #chat-form{
  position:fixed;left:50%;bottom:71px;right:auto;top:auto;transform:translateX(-50%);
  width:min(460px,calc(100vw - 28px));height:42px;padding:3px;gap:3px;display:flex;align-items:center;
  border:1px solid #829aa74d;border-radius:5px;background:#17212cbb;box-shadow:0 3px 18px #0004;pointer-events:auto;opacity:.8;
}
body:not(.show-lobby) #chat-form:focus-within,body:not(.show-lobby) #chat.chat-active #chat-form{opacity:1;background:#14212dee;border-color:#70e0ff88}
body:not(.show-lobby) #chat-form input{flex:1;min-width:0;height:34px;padding:6px 9px;border:0;background:transparent;color:#fff;font:12px Arial,sans-serif}
body:not(.show-lobby) #chat-form button{height:34px;flex:0 0 32px;border:0;background:#ffffff10;color:#e2f4ff;border-radius:3px}
body:not(.show-lobby) #chat .chat-emoji-toolbar{display:flex;position:fixed;left:50%;bottom:118px;transform:translateX(-50%);width:min(460px,calc(100vw - 28px));height:36px;min-height:0;padding:3px 7px;border:1px solid #6b87985c;border-radius:5px;background:#13212deb;pointer-events:auto}
body:not(.show-lobby) #chat.chat-active .chat-emoji-toolbar{display:flex}
body:not(.show-lobby) #chat .chat-emoji-toolbar>span{display:none}
body:not(.show-lobby) #chat .emoji-picker{position:fixed;left:50%;right:auto;bottom:160px;transform:translateX(-50%);width:min(460px,calc(100vw - 28px));max-height:235px;pointer-events:auto;background:#12212ef5;z-index:12}
.controls-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:0 0 20px}.controls-toolbar .hint{margin:0;max-width:560px}.controls-toolbar .settings-action{white-space:nowrap;font-size:10px;padding:11px}
.score-line{min-width:0}.score-line strong{font-size:clamp(18px,2.5vw,30px);overflow-wrap:anywhere;min-width:0}
body:not(.show-lobby) #chat:not(.chat-active) #chat-form{display:none}
body.hud-hidden:not(.show-lobby) .topbar,
body.hud-hidden:not(.show-lobby) #score-box,
body.hud-hidden:not(.show-lobby) #live-stats,
body.hud-hidden:not(.show-lobby) #zoom-panel,
body.hud-hidden:not(.show-lobby) #restart-status,
body.hud-hidden:not(.show-lobby) #server-announcement,
body.hud-hidden:not(.show-lobby) #toast-area{display:none!important}
@media(max-width:700px){body:not(.show-lobby) #chat,body:not(.show-lobby) #chat.chat-active{left:8px;bottom:164px;height:170px;width:min(320px,calc(100vw - 16px))}body:not(.show-lobby) #chat-form{bottom:68px}.controls-toolbar{align-items:flex-start;gap:8px}.controls-toolbar .hint{font-size:10px}}

/* Compact reference HUD: plain text rows and a transparent player map. */
#own-connections{position:fixed;z-index:5;top:75px;left:8px;display:flex;flex-direction:column;align-items:flex-start;gap:3px;pointer-events:none}
.connection-row{display:inline-flex;align-items:center;gap:6px;padding:1px 6px;background:rgba(0,0,0,.45);color:#ddd;font:600 12px/18px Arial,sans-serif;white-space:nowrap}
#leaderboard{position:fixed;z-index:5;right:8px;top:75px;width:auto;max-width:240px;max-height:calc(100vh - 340px);padding:0;border:0;border-radius:0;box-shadow:none;background:none;backdrop-filter:none;overflow:hidden;pointer-events:none}
#board-entries{display:flex;flex-direction:column;align-items:flex-end;gap:3px}
#leaderboard .leader-entry{display:inline-flex;align-items:center;justify-content:flex-end;gap:7px;padding:1px 6px;border:0;background:rgba(0,0,0,.45);color:#ddd;font:600 12px/18px Arial,sans-serif;white-space:nowrap}
#leaderboard .leader-entry>span:first-child{width:auto;max-width:180px;overflow:hidden;text-overflow:ellipsis;color:inherit;font:inherit}
#leaderboard .leader-mass{color:inherit;font:inherit;font-variant-numeric:tabular-nums}
#minimap{position:fixed;z-index:5;right:8px;bottom:8px;top:auto;width:min(234px,32vw);padding:0;border:0;border-radius:0;box-shadow:none;background:none;backdrop-filter:none;pointer-events:none}
#minimap canvas{display:block;width:100%;height:auto;aspect-ratio:1;border:1px solid rgba(255,255,255,.3);border-radius:0;background:rgba(0,0,0,.04)}
#live-stats{position:absolute;top:-21px;right:0;left:auto;bottom:auto;display:block;transform:none;min-height:0;max-width:none;padding:1px 5px;border:0;border-radius:0;background:rgba(0,0,0,.45);box-shadow:none;backdrop-filter:none;color:#ddd;font:600 11px/16px Arial,sans-serif;white-space:nowrap}
#live-stats span{display:inline;color:inherit;font:inherit;letter-spacing:0}
body.show-lobby #own-connections,body.show-lobby #leaderboard,body.show-lobby #minimap,
body.hud-hidden #own-connections,body.hud-hidden #leaderboard,body.hud-hidden #minimap{display:none!important}
@media(max-height:600px){#leaderboard{max-height:calc(100vh - 260px)}#minimap{width:min(180px,28vw)}}

/* Vintage settings studio. */
#settings-overlay{--studio-accent:#7de8e0;--studio-muted:#9bb7c2;display:flex;padding:0;background:radial-gradient(ellipse at 0 0,#0a6571a8,transparent 65%),radial-gradient(ellipse at 100% 100%,#70244966,transparent 62%),linear-gradient(125deg,#102d3b,#121e35 60%,#262039);color:#edf8fb}
#settings-overlay::before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.17;background-image:linear-gradient(#a1e8ee1a 1px,transparent 1px),linear-gradient(90deg,#a1e8ee1a 1px,transparent 1px);background-size:96px 96px;mask-image:linear-gradient(120deg,#000,transparent 80%)}
#settings-overlay .settings-shell{position:relative;isolation:isolate;width:100%;max-width:none;height:100dvh;max-height:none;min-height:0;border:0;border-radius:0;background:none;box-shadow:none;overflow:hidden;display:flex;flex-direction:column;padding:0 clamp(22px,3.5vw,68px)}
#settings-overlay .settings-header{flex-shrink:0;position:relative;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px 64px 20px 0;min-height:0;border:0;background:none}
.settings-kicker{display:flex;align-items:center;gap:16px;color:#b2d5df;font:500 9px/1.4 'Space Grotesk',sans-serif;letter-spacing:.2em}
.settings-kicker img{width:134px;height:34px;object-fit:contain}
.settings-kicker>span{border-left:1px solid #9ce9e244;padding-left:16px}
.settings-identity h1{margin:10px 0 3px;font:400 clamp(38px,4vw,60px)/1.04 'Space Grotesk',sans-serif;letter-spacing:-.055em;color:#f5fcff}
.settings-identity h1>span{color:var(--studio-accent)}
.settings-identity>p{margin:9px 0 0;color:var(--studio-muted);font:400 12px/1.5 'Space Grotesk',sans-serif}
#settings-overlay .settings-close{position:absolute;right:0;top:30px;width:38px;height:38px;border:1px solid #a3ccd144;border-radius:8px;background:#0b24384d;color:#e4f6fa}
#settings-overlay .settings-close:hover{border-color:var(--studio-accent);background:#7de8e01c}
.settings-searchbox{width:min(310px,32vw);display:flex;align-items:center;gap:12px;padding:12px 15px;border:1px solid #9dc5d02e;border-radius:9px;background:#07182855;transition:border-color .2s}
.settings-searchbox:focus-within{border-color:var(--studio-accent)}
.settings-searchbox svg{width:18px;height:18px;fill:none;stroke:#8bb5c3;stroke-width:1.5;flex:none}
.settings-searchbox input{min-width:0;width:100%;padding:0;border:0;outline:none!important;background:none;color:#efffff;font:12px/1.6 'Space Grotesk',sans-serif}
.settings-searchbox input::placeholder{color:#94aebb}
#settings-overlay .settings-tabs{flex-shrink:0;display:flex;align-items:center;gap:clamp(14px,2vw,34px);padding:0;border:0;border-bottom:1px solid #9ed8dd30;background:none;overflow-x:auto;scrollbar-width:none}
#settings-overlay .settings-tabs button{position:relative;flex:none;height:52px;min-width:0;padding:0 0 12px;border:0;border-bottom:2px solid transparent;border-radius:0;background:none;box-shadow:none;text-shadow:none;color:#9ebac6;font:500 13px/1 'Space Grotesk',sans-serif;letter-spacing:.01em;white-space:nowrap}
#settings-overlay .settings-tabs button:hover{color:#e5f9fb}
#settings-overlay .settings-tabs button.active{background:none;border-bottom-color:var(--studio-accent);color:#f1ffff;box-shadow:none}
#settings-overlay .settings-body{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:clamp(28px,4vw,72px);margin:0;border:0;padding-top:24px;overflow:hidden}
.settings-list{min-height:0;min-width:0;display:flex;flex-direction:column;border-right:1px solid #98d4de26;padding-right:24px}
#settings-overlay .settings-nav{display:flex;align-items:center;gap:7px;flex-shrink:0;overflow-x:auto;padding:0 0 16px;border:0;background:none;scrollbar-width:thin}
#settings-overlay .settings-nav button{width:auto;flex:none;padding:8px 12px;border:1px solid transparent;border-radius:6px;background:none;box-shadow:none;color:#a4bec9;font:500 11px/1.3 'Space Grotesk',sans-serif;opacity:1;white-space:nowrap}
#settings-overlay .settings-nav button.active{color:#cffff9;border-color:#83d6d736;background:#88dedb0d}
#settings-overlay .settings-content{min-width:0;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:0 14px 28px 0;background:none;scrollbar-width:thin;scrollbar-color:#91cbd170 #041b2c25}
#settings-overlay .settings-section-title{display:flex;align-items:center;gap:16px;margin:9px 0 16px;color:#93b7c3;font:500 10px/1.4 'Space Grotesk',sans-serif;letter-spacing:.18em}
#settings-overlay .settings-section-title::after{content:'';height:1px;flex:1;background:linear-gradient(90deg,#9ccbd631,transparent)}
#settings-overlay .setting-row,#settings-overlay .setting-row.animation-setting,#settings-overlay .setting-row.slider-setting{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,225px);align-items:center;gap:18px;min-height:61px;margin:0 0 6px;padding:12px 15px;border:1px solid transparent;border-radius:5px;background:#06162845;transition:border-color .15s,background .15s}
#settings-overlay .setting-row.is-selected{border-color:#7ce0de55;background:#0c283d99}
#settings-overlay .setting-label{display:block;color:#e6f1f5;font:500 12px/1.6 'Space Grotesk',sans-serif;letter-spacing:.01em}
#settings-overlay .setting-label small,#settings-overlay .animation-hint{display:none}
#settings-overlay .setting-control{display:flex;min-width:0;max-width:none;width:100%;justify-content:flex-end;align-items:center;gap:8px;text-align:right}
#settings-overlay .setting-value{padding:0 7px;min-width:45px;height:23px;border:1px solid #9bc6d129;border-radius:4px;background:#07172480;color:#baf4ed;font:500 10px/22px 'Space Grotesk',sans-serif}
#settings-overlay .setting-label .setting-value{float:right;margin:1px 0 0 8px}
#settings-overlay .toggle-slider{width:40px;height:22px;border:1px solid #789eaf6b;border-radius:12px;background:#071929}
#settings-overlay .toggle-slider::after{top:3px;left:3px;width:14px;height:14px;background:#9db7c6;box-shadow:none}
#settings-overlay .toggle-slider::before{display:none}
#settings-overlay .toggle-switch input:checked+.toggle-slider{background:#2f777d;border-color:#78dedc;box-shadow:none}
#settings-overlay .toggle-switch input:checked+.toggle-slider::after{left:21px;background:#e5fffb}
#settings-overlay .toggle-switch input{width:100%;height:100%;inset:0;z-index:1;opacity:0;cursor:pointer}
#settings-overlay .toggle-status{color:#a9c7d1;font:500 10px/1 'Space Grotesk',sans-serif;letter-spacing:.04em;min-width:23px}
#settings-overlay .setting-control input[type=range]{width:100%;height:5px;margin:6px 0;border:0;border-radius:3px;background:linear-gradient(90deg,#77d8d0 var(--range-progress,0%),#071a2c var(--range-progress,0%));cursor:pointer}
#settings-overlay .setting-control input[type=range]::-webkit-slider-thumb{width:13px;height:17px;border:2px solid #d0fff7;border-radius:4px;background:#97e7df;box-shadow:0 2px 6px #06112255}
#settings-overlay .setting-control input[type=range]::-moz-range-thumb{width:10px;height:14px;border:2px solid #d0fff7;border-radius:4px;background:#97e7df;box-shadow:none}
#settings-overlay .setting-control input.keybind{width:125px;min-width:0;padding:8px 7px;border:1px solid #89bac542;border-radius:5px;background:#081b2b;color:#e5faf9;font:600 11px/1.4 'Space Grotesk',sans-serif;letter-spacing:.02em}
#settings-overlay .settings-action{padding:9px 12px;border:1px solid #8fbfc73d;border-radius:5px;background:#9ed7d60d;color:#badadf;font:500 10px/1.3 'Space Grotesk',sans-serif;white-space:nowrap}
#settings-overlay .settings-action:hover{border-color:#8ae6df;background:#8ae6df16;color:#f3fffd}
#settings-overlay .setting-control input[type=text]:not(.keybind),#settings-overlay .setting-control input[type=url],#settings-overlay .setting-control select{max-width:100%;min-width:0;padding:9px;border-color:#8fbfc73d;border-radius:5px;background:#081d2f;color:#e6f8fb;font-size:11px}
#settings-overlay .color-editor{border-color:#8fbfc73d;background:#081d2f;border-radius:5px;padding:4px}
#settings-overlay .controls-toolbar{align-items:center;gap:12px;margin:0 0 18px}
#settings-overlay .controls-toolbar .hint{font-size:10px;line-height:1.6;color:#8eacba}
#settings-overlay .controls-toolbar .settings-action{padding:8px;font-size:9px}
.settings-detail{min-height:0;min-width:0;align-self:center;padding:0 8% 26px 0;overflow-y:auto;max-height:100%;scrollbar-width:thin}
.settings-detail-kicker{display:block;margin-bottom:18px;color:#80b9c5;font:500 10px/1.5 'Space Grotesk',sans-serif;text-transform:uppercase;letter-spacing:.2em}
.settings-preview{position:relative;isolation:isolate;height:210px;margin-bottom:26px;overflow:hidden;border:1px solid #87bdc323;border-radius:12px;background:radial-gradient(ellipse at 60% 100%,#4e4c7b55,transparent 70%),#091b2d66;--preview-cell:#09759d;--preview-opacity:1;--preview-food:#60cfe7;--preview-grid:.1;--preview-scale:1}
.preview-grid{position:absolute;inset:0;opacity:var(--preview-grid);background-image:linear-gradient(#addddf 1px,transparent 1px),linear-gradient(90deg,#addddf 1px,transparent 1px);background-size:32px 32px;mask-image:radial-gradient(ellipse,#000,transparent)}
.preview-orb{position:absolute;border-radius:50%;opacity:var(--preview-opacity);transform:scale(var(--preview-scale));transition:background .2s,transform .15s,opacity .15s}
.preview-orb-main{display:flex;flex-direction:column;align-items:center;justify-content:center;left:48%;top:27px;width:127px;height:127px;background:var(--preview-cell);box-shadow:0 0 70px #6ad8da12}
.preview-orb-other{left:20%;top:88px;width:74px;height:74px;background:#d8e8ee}
.preview-name{color:white;font:600 14px/1.6 'Space Grotesk',sans-serif}.preview-mass{color:#e0f9ff;font:500 12px/1.5 'Space Grotesk',sans-serif}
.preview-food{position:absolute;left:31%;top:51px;width:8px;height:8px;border-radius:50%;background:var(--preview-food)}
.preview-food:nth-of-type(2){left:38%;top:61px;width:6px;height:6px}.preview-food:nth-of-type(3){left:36%;top:37px;width:5px;height:5px}
.preview-caption{position:absolute;bottom:13px;left:16px;color:#7798ad;font:500 8px/1.5 'Space Grotesk',sans-serif;letter-spacing:.18em}
.hide-preview-names .preview-name,.hide-preview-mass .preview-mass,.hide-preview-food .preview-food{display:none}
.settings-detail h2{margin:0 0 14px;color:#f1fbfe;font:400 clamp(24px,2.3vw,36px)/1.2 'Space Grotesk',sans-serif;letter-spacing:-.035em}
.settings-detail>p{margin:0;max-width:450px;color:#a9c1cd;font:400 13px/1.9 'Space Grotesk',sans-serif}
.settings-detail-values{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:26px;padding:17px 0;border-top:1px solid #98c6d026;border-bottom:1px solid #98c6d026}
.settings-detail-values>div{display:flex;flex-direction:column;gap:7px;min-width:0}.settings-detail-values span{color:#7296a8;font:500 8px/1.4 'Space Grotesk',sans-serif;letter-spacing:.17em}.settings-detail-values strong{overflow:hidden;text-overflow:ellipsis;color:#c7f4f0;font:500 13px/1.5 'Space Grotesk',sans-serif}
.settings-detail-note{display:block;max-width:430px;margin-top:17px;color:#7898aa;font:400 10px/1.8 'Space Grotesk',sans-serif}
#settings-overlay .settings-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-shrink:0;min-height:82px;padding:16px 0;border-top:1px solid #9ed8dd26;background:none;font-size:10px}
.settings-footer-actions{display:flex;align-items:center;gap:10px}
#settings-overlay .settings-foot button{min-width:0;display:flex;align-items:center;gap:13px;padding:11px 15px;border:1px solid #94c9d038;border-radius:6px;background:none;color:#bed6e0;font:500 11px/1.4 'Space Grotesk',sans-serif;letter-spacing:0}
#settings-overlay .settings-foot button:hover{background:#a1d9dd10;border-color:#92e3de;color:white}
#settings-overlay #settings-done{background:#9cdedc18;color:#e5fffb;border-color:#82d8d969}
#settings-overlay .settings-foot button:disabled{opacity:.3;cursor:default}
#settings-overlay .settings-foot kbd{padding:2px 4px;border:1px solid #9ac7cf32;border-radius:3px;font:9px/1.3 'Space Grotesk',sans-serif;color:#82b7c1}
.settings-save-state{display:flex;align-items:center;gap:8px;color:#82a4b3;font:500 8px/1.4 'Space Grotesk',sans-serif;letter-spacing:.16em;white-space:nowrap}.settings-save-state i{width:5px;height:5px;background:#8adebc;border-radius:50%;box-shadow:0 0 10px #8adebc55}
@media(max-width:950px){#settings-overlay .settings-shell{padding:0 24px}#settings-overlay .settings-body{gap:24px;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}.settings-list{padding-right:16px}.settings-detail{padding-right:0}.settings-preview{height:170px}.preview-orb-main{left:47%;width:100px;height:100px}.preview-orb-other{left:17%;width:58px;height:58px}.settings-kicker>span{display:none}#settings-overlay .setting-row,#settings-overlay .setting-row.animation-setting,#settings-overlay .setting-row.slider-setting{grid-template-columns:minmax(0,1fr) minmax(110px,175px);gap:10px;padding:11px}.settings-searchbox{width:240px}#settings-overlay .settings-tabs{gap:21px}}
@media(max-width:700px){#settings-overlay .settings-shell{padding:0 16px}#settings-overlay .settings-header{padding:18px 44px 15px 0;gap:14px}.settings-identity h1{font-size:38px}.settings-kicker img{width:108px;height:28px}.settings-identity>p{display:none}.settings-searchbox{width:min(200px,40vw);padding:10px}.settings-searchbox input{font-size:10px}#settings-overlay .settings-close{top:20px;width:32px;height:32px}#settings-overlay .settings-tabs{gap:21px}#settings-overlay .settings-tabs button{font-size:11px;height:46px}#settings-overlay .settings-body{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;gap:12px;padding-top:14px}.settings-list{border:0;padding-right:0}.settings-detail{border-top:1px solid #98c6d026;padding:12px 0 14px;max-height:145px;overflow:auto}.settings-detail-kicker,.settings-preview,.settings-detail-note,.settings-detail-values{display:none}.settings-detail h2{font-size:19px;margin-bottom:6px}.settings-detail>p{font-size:11px;line-height:1.7;max-width:none}#settings-overlay .settings-foot{min-height:65px;padding:12px 0}#settings-overlay .settings-foot button{padding:9px;font-size:10px;gap:7px}.settings-save-state{display:none}.settings-footer-actions{gap:6px}#settings-overlay .settings-content{padding-right:6px}#settings-overlay .settings-nav{padding-bottom:11px}.settings-detail-values>div{display:none}}
@media(prefers-reduced-motion:reduce){#settings-overlay *,#settings-overlay *::before,#settings-overlay *::after{transition:none!important}}
.settings-preview{border-color:var(--preview-border,#70e0ff);border-width:var(--preview-border-width,3px);box-shadow:var(--preview-glow,none)}
.settings-preview>canvas{display:none;position:absolute;inset:0;pointer-events:none}.settings-preview.show-atlas-preview{border-width:1px;border-color:#87bdc323;box-shadow:none}.settings-preview.show-atlas-preview>canvas{display:block}.settings-preview.show-atlas-preview .preview-grid,.settings-preview.show-atlas-preview .preview-orb,.settings-preview.show-atlas-preview .preview-food{display:none}
#settings-overlay .background-design-row{grid-template-columns:1fr}.background-design-row .setting-control{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.background-design-row canvas{width:84px;height:84px;border-radius:6px;border:1px solid #78cbd34a}.background-design-row p{flex:1;min-width:160px;font-size:11px;line-height:1.7;color:#9bbbc8}.background-design-row button{white-space:normal}
#settings-overlay.studio-open>.settings-shell{display:none!important}
.background-studio-modal{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;background:radial-gradient(ellipse at 80% 0,#18465755,transparent 70%),#08131e;color:#edf9ff;font-family:'Space Grotesk',Arial,sans-serif}
.studio-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 28px;border-bottom:1px solid #8fced329}.studio-eyebrow{font-size:9px;letter-spacing:.22em;color:#79dcd3}.studio-header h2{margin:5px 0 0;font-size:26px;letter-spacing:-.04em}.studio-actions{display:flex;gap:8px;flex-wrap:wrap}.background-studio-modal button{border:1px solid #8fc3cf44;border-radius:6px;background:#102838;color:#d2e9f1;padding:10px 13px;font:500 11px 'Space Grotesk',Arial,sans-serif;cursor:pointer}.background-studio-modal button:hover,.background-studio-modal button.active{background:#20606c;border-color:#79ded2;color:white}.background-studio-modal button:disabled{opacity:.35;cursor:default}.background-studio-modal button.studio-primary{background:#78ded4;color:#07222e;border-color:#78ded4}.background-studio-modal :focus-visible{outline:2px solid #85eee1;outline-offset:3px}
.studio-body{display:grid;grid-template-columns:280px minmax(0,1fr);min-height:0;flex:1}.studio-tools{overflow:auto;padding:20px;border-right:1px solid #8fced329;scrollbar-width:thin;scrollbar-color:#397c89 #08131e}.studio-tools h3{margin:0 0 12px;font-size:10px;letter-spacing:.2em;color:#89b6c4}.studio-tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:20px}.studio-tool-grid button{text-align:left;padding:9px 7px}.studio-properties{display:grid;gap:12px;margin-bottom:24px}.studio-control{display:grid;grid-template-columns:minmax(0,1fr) 108px;gap:12px;align-items:center;font-size:10px;color:#c5dae4}.studio-control input{width:100%;min-width:0;height:32px;padding:4px 6px;border:1px solid #7db8c344;border-radius:5px;background:#061d2b;color:white;font:11px 'Space Grotesk',Arial,sans-serif}.studio-control input[type=range]{padding:0;accent-color:#7adecf;border:0}.studio-control input[type=checkbox]{width:20px;height:20px;justify-self:end;accent-color:#7adecf}.studio-control input[type=color]{padding:2px;cursor:pointer}.studio-palette{display:grid;grid-template-columns:repeat(6,1fr);gap:5px}.studio-palette button{height:24px;padding:0}.studio-stickers{display:grid;grid-template-columns:repeat(6,1fr);gap:5px;margin-bottom:22px}.studio-stickers button{font:22px 'Segoe UI Emoji',Arial,sans-serif;padding:5px 0;min-width:0}.studio-history{display:grid;grid-template-columns:1fr 1fr;gap:6px}.studio-hint{font-size:10px;line-height:1.8;color:#7eacbc;margin:14px 0 0}
.studio-stage{display:flex;min-height:0;min-width:0;flex-direction:column;align-items:center;padding:18px 24px 14px;overflow:hidden}.studio-stage-title{font-size:9px;letter-spacing:.22em;color:#81aebd;margin:0 0 14px}.studio-canvas-wrap{display:flex;align-items:center;justify-content:center;min-height:0;min-width:0;flex:1;width:100%;overflow:hidden}.studio-canvas{display:block;max-width:100%;max-height:100%;width:auto;height:auto;aspect-ratio:1;touch-action:none;box-shadow:0 0 0 1px #a4e3df4d,0 24px 60px #0008;background:#061420}.studio-status{font-size:10px;line-height:1.6;color:#9cd8d3;margin:12px 0 0}.studio-stage>.studio-hint{text-align:center;max-width:600px;margin-top:4px}
@media(max-width:700px){.studio-header{padding:14px;align-items:flex-start;gap:10px;flex-direction:column}.studio-header h2{font-size:21px}.studio-actions{width:100%;gap:5px}.background-studio-modal .studio-actions button{padding:8px;font-size:9px;flex:1}.studio-body{grid-template-columns:1fr;grid-template-rows:200px minmax(0,1fr)}.studio-tools{border-right:0;border-bottom:1px solid #8fced329;padding:12px;display:grid;grid-template-columns:1fr 1fr;gap:12px}.studio-tools h3{grid-column:1/-1;margin-bottom:0}.studio-tool-grid{grid-column:1/-1;grid-template-columns:repeat(4,1fr);margin:0}.studio-tool-grid button{font-size:9px}.studio-properties{grid-column:1/-1;margin:0}.studio-control{grid-template-columns:1fr 1fr}.studio-stickers{grid-column:1/-1;grid-template-columns:repeat(8,1fr);margin:0}.studio-history{grid-column:1/-1}.studio-tools>.studio-hint{grid-column:1/-1;margin:0}.studio-stage{padding:12px}.studio-stage-title{margin-bottom:8px}.studio-stage>.studio-hint{font-size:9px}.studio-canvas{width:auto;height:auto}}

/* Vintage Control Room: graphite panels, copper markers and a dedicated scene stage. */
#settings-overlay{--studio-accent:#e6ad69;--studio-muted:#a8a49c;background:#151719;color:#f2ede4}
#settings-overlay::before{opacity:.35;background:linear-gradient(135deg,transparent 68%,#d6a3660b 68%,#d6a3660b 69%,transparent 69%),linear-gradient(#ffffff04 1px,transparent 1px);background-size:auto,100% 64px;mask-image:none}
#settings-overlay .settings-shell{display:grid;grid-template-columns:132px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;column-gap:22px;padding:0 28px}
#settings-overlay .settings-header{grid-column:1/-1;padding:20px 60px 18px 0;border-bottom:1px solid #d0b39324}
.settings-kicker{color:#a6a297;font-size:8px;letter-spacing:.16em}.settings-kicker img{width:108px;height:25px}.settings-kicker>span{border-color:#c89c6b44}
.settings-identity h1{font-size:30px;font-weight:600;margin:9px 0 0;letter-spacing:-.04em;color:#f1ede5}.settings-identity h1>span{font-size:14px;letter-spacing:.12em;margin-left:7px}.settings-identity>p{font-size:10px;color:#a19e96;margin-top:7px}
.settings-searchbox{border-color:#b9b0a52b;background:#0d0f12;border-radius:5px;width:min(300px,32vw)}.settings-searchbox svg{stroke:#c3a580}.settings-searchbox input{color:#f0e8db}.settings-searchbox input::placeholder{color:#918b81}
#settings-overlay .settings-close{top:25px;background:#202226;border-color:#aaa19538;color:#e8cba5;border-radius:5px}
#settings-overlay .settings-tabs{grid-column:1;grid-row:2;flex-direction:column;align-items:stretch;justify-content:flex-start;overflow:auto;gap:7px;padding:22px 14px 14px 0;border:0;border-right:1px solid #d0b39324;counter-reset:section}
#settings-overlay .settings-tabs button{display:flex;align-items:center;gap:10px;width:100%;height:auto;min-height:44px;padding:10px 8px;text-align:left;border:1px solid transparent;border-radius:5px;font-size:10px;color:#a6a39d;letter-spacing:.01em;flex:none}
#settings-overlay .settings-tabs button::before{counter-increment:section;content:'0' counter(section);font:9px monospace;color:#696964}
#settings-overlay .settings-tabs button::after{display:none}#settings-overlay .settings-tabs button.active{color:#f4dcc0;background:#d6a36613;border-color:#d6a36636}#settings-overlay .settings-tabs button.active::before{color:#e6ad69}
#settings-overlay .settings-body{grid-column:2;grid-row:2;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(320px,1fr);gap:26px;padding:22px 0 0;min-height:0}
#settings-overlay .settings-list{border:0;padding-right:0;overflow:hidden}#settings-overlay .settings-content{flex:1 1 0%}.settings-detail{min-height:0;overflow:auto;border-left:1px solid #d0b39324;padding:0 0 18px 24px;scrollbar-width:thin;scrollbar-color:#786245 #151719}
#settings-overlay .settings-detail{align-self:stretch;min-height:0;max-height:100%;box-sizing:border-box}

/* Tag-only voice sits below the team rows and keeps its controls while a mic is active. */
.tag-voice{position:fixed;top:130px;left:8px;z-index:15;width:260px;max-width:calc(100vw - 20px);padding:12px;border:1px solid #c9a57444;border-radius:7px;background:color-mix(in srgb,var(--theme-panel,#121c27),transparent 4%);box-shadow:0 10px 35px #0006;color:var(--text,#f3ede3);font:11px/1.5 'Space Grotesk',Arial,sans-serif;backdrop-filter:blur(12px);pointer-events:auto}
.tag-voice[hidden],.tag-voice [hidden]{display:none!important}.voice-head{display:flex;align-items:center;justify-content:space-between;gap:10px;letter-spacing:.12em;font-size:10px}.voice-head strong{color:#e9bf89}.voice-head>span{font:8px monospace;color:#a7b5bd;letter-spacing:.08em}.voice-status{font-size:10px;color:#aab5bc;line-height:1.6;margin:8px 0 10px}.voice-actions{display:flex;gap:6px;flex-wrap:wrap}.tag-voice button{border:1px solid #ad967448;border-radius:4px;background:#252b31;color:#ebd7b9;padding:7px 8px;cursor:pointer;font:10px 'Space Grotesk',Arial,sans-serif;flex:1;white-space:nowrap}.tag-voice button:hover{background:#49402f;border-color:#e3b274}.tag-voice button:disabled{opacity:.35;cursor:default}.tag-voice button[aria-pressed=true]{border-color:#d4ab73;background:#3e3528}.voice-master{display:flex;align-items:center;gap:7px;margin:12px 0;font-size:9px;color:#aebcc5}.voice-master>span{white-space:nowrap}.tag-voice input[type=range]{min-width:0;flex:1;width:100%;height:18px;accent-color:#deb077}.tag-voice output{min-width:29px;text-align:right;color:#d9c4a4;font:9px monospace}.voice-self{font-size:9px;color:#98b0bd;padding:7px 0;border-top:1px solid #a7bac51a}.voice-self.is-speaking{color:#88e3af}.voice-peers{max-height:min(240px,35vh);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#786245 #11171e}.voice-peer{padding:9px 0;border-top:1px solid #a7bac51a}.voice-peer-label{display:flex;align-items:center;gap:6px;font-size:10px}.voice-peer-label>span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.voice-peer-label>small{font-size:8px;color:#7f929f}.voice-dot{width:5px;height:5px;flex:none;border-radius:50%;background:#667785}.voice-peer.is-speaking .voice-dot{background:#87e1a6;box-shadow:0 0 8px #87e1a688}.voice-peer.is-muted .voice-dot{background:#cc8b8b;box-shadow:none}.voice-peer-controls{display:flex;align-items:center;gap:7px;margin-top:5px}.voice-peer-controls button{flex:0 0 49px;padding:4px 6px;font-size:9px}.voice-empty{font-size:9px;color:#829aa9;margin:8px 0 0}.tag-voice>button{width:100%;margin-top:7px}.tag-voice :focus-visible{outline:2px solid #e5b77e;outline-offset:2px}
body.show-lobby .tag-voice:not(.voice-active):not(.voice-busy){display:none}@media(max-width:700px){.tag-voice{width:224px;padding:9px}.voice-peer-label>small{max-width:83px;text-align:right}.voice-peers{max-height:180px}.voice-actions button{font-size:9px;padding:6px}.voice-status{font-size:9px}}
#settings-overlay .settings-nav{display:flex;flex-wrap:wrap;overflow:visible;gap:6px;padding:0 0 18px}#settings-overlay .settings-nav button{padding:8px 9px;color:#aaa59b;font-size:9px;border-radius:4px;border:1px solid #a69a8922;background:#1c1f22;white-space:normal}#settings-overlay .settings-nav button.active{border-color:#d6a3666b;color:#f6d5ac;background:#d6a36618}
#settings-overlay .settings-content{padding:0 8px 18px 0;scrollbar-color:#786245 #151719;overflow-x:hidden}#settings-overlay .settings-section-title{color:#e1b57f;letter-spacing:.18em;font-size:9px}#settings-overlay .settings-section-title::after{background:#b9976a2b}
#settings-overlay .setting-row,#settings-overlay .setting-row.animation-setting,#settings-overlay .setting-row.slider-setting{background:#202226;border:1px solid #ffffff09;border-radius:6px;margin-bottom:9px;padding:14px}.setting-label{color:#e7e0d6}#settings-overlay .setting-row.is-selected{border-color:#d6a3666b;background:#292721}
#settings-overlay .toggle-slider{background:#3c3c3a;border-color:#5c5a55}#settings-overlay .toggle-switch input:checked+.toggle-slider{background:#8a673d;border-color:#e7b778}#settings-overlay .toggle-switch input:checked+.toggle-slider::before{background:#ffe0ac}#settings-overlay .toggle-status{color:#d6b488}
#settings-overlay .setting-control select,#settings-overlay .setting-control input[type=url],#settings-overlay .keybind{background:#111315;border-color:#b4a38b38;color:#eee4d5}.setting-control input[type=range]{accent-color:#e6ad69}#settings-overlay .setting-control input[type=range]{--range-color:#e6ad69}#settings-overlay .setting-value{border-color:#a68b6533;background:#121416;color:#e9c591}
#settings-overlay .color-editor{background:#111315;border-color:#b7a08342}#settings-overlay .color-editor input[type=text]{color:#f4e0c3}#settings-overlay .settings-action{background:#343029;border-color:#c59b625c;color:#f6d9b0}
.settings-detail-kicker{color:#d3b388;font-size:9px;letter-spacing:.18em;margin-bottom:12px}.settings-detail h2{font-size:25px;color:#f3e8d8;margin:20px 0 8px}.settings-detail>p{font-size:11px;color:#b6b0a5}.settings-detail-values{border-color:#b99a7329;margin-top:18px}.settings-detail-values>div>span{color:#a39681}.settings-detail-values strong{color:#ecc99b}.settings-detail-note{color:#938c80;font-size:9px;line-height:1.8}
#settings-overlay .settings-preview{display:block;position:relative;height:340px;min-height:180px;flex:none;border:1px solid #b99a734d;border-radius:8px;background:#0c0e11;box-shadow:0 12px 32px #0005;margin:0;overflow:hidden}
#settings-overlay .scene-preview>canvas{display:block;position:absolute;inset:0;max-width:none;max-height:none;touch-action:none;pointer-events:auto}#settings-overlay .scene-preview.scene-editable{border-color:#d8ae76;box-shadow:0 0 0 3px #d8ae760d,0 15px 30px #0005}#settings-overlay .scene-editable canvas{cursor:grab}#settings-overlay .scene-editable canvas:active{cursor:grabbing}
.theme-scene-tools{padding:14px 0 0}.theme-scene-tools[hidden]{display:none}.scene-tool-title{font-size:9px;letter-spacing:.18em;color:#cba778;margin-bottom:9px}.scene-object-actions{display:flex;gap:6px;flex-wrap:wrap}.theme-scene-tools select,.theme-scene-tools input:not([type=range]){background:#0d1013;border:1px solid #a6937747;border-radius:4px;padding:7px 8px;min-width:0;color:#f5e6cf;font:11px 'Space Grotesk',Arial}.theme-scene-tools select{flex:1}.theme-scene-tools .scene-symbol{width:70px}.theme-scene-tools button{padding:7px 10px;background:#2e2b25;border:1px solid #c59b6254;border-radius:4px;color:#ecd1ad;font:10px 'Space Grotesk',Arial;cursor:pointer}.theme-scene-tools button:disabled{opacity:.35;cursor:default}.theme-scene-tools button:hover{border-color:#efbd7d;background:#4b3c28}.scene-symbol-palette{display:flex;flex-wrap:wrap;gap:4px;margin:9px 0}.scene-symbol-palette button{font:18px 'Segoe UI Emoji',Arial;padding:4px 6px;min-width:30px}.scene-object-properties{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.scene-object-properties input[type=color]{width:38px;height:30px;padding:2px}.scene-object-properties input[type=range]{width:76px;accent-color:#e6ad69}.scene-edit-hint{font-size:10px;line-height:1.7;color:#a9a092;margin:10px 0 0}.scene-show-artwork{display:flex;align-items:center;gap:9px;margin:15px 0;color:#d9c5aa;font-size:11px}.scene-show-artwork input{accent-color:#e6ad69}
#settings-overlay .theme-field{background:#202226;border-color:#b4a38b2e;border-radius:5px}#settings-overlay .theme-field span{color:#d9cdbc}#settings-overlay .theme-field input{background:#0d1013;border-color:#a6937747;color:#f5e6cf}#settings-overlay .theme-intro{color:#b5ab9d;font-size:11px;line-height:1.8}#settings-overlay .custom-colors{gap:9px}
#settings-overlay .settings-foot{grid-column:1/-1;grid-row:3;min-height:68px;padding:14px 0;border-color:#d0b39324}#settings-overlay .settings-foot button{border-color:#a99a833b;color:#d8c5aa;border-radius:5px}#settings-overlay #settings-done{background:#e6ad6915;border-color:#d2a56b6b;color:#f3d0a1}.settings-save-state{color:#c3ab8a}.settings-save-state i{background:#e6ad69;box-shadow:0 0 9px #e6ad6944}
#theme-artwork-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}#theme-artwork-overlay[hidden]{display:none}.v-stage-header,.v-stage-center,.v-launch-panel,.v-stage-bottom-note{z-index:2}.v-launch-panel{background:color-mix(in srgb,var(--theme-panel,#121c27),transparent 6%);color:var(--text)}.v-launch-panel h1,.v-launch-fields label>span,.v-stage-bottom-note{color:var(--text)}.v-play-button{background:var(--accent);border-color:var(--accent)}
.background-studio-modal{background:radial-gradient(ellipse at 90% 0,#5e432522,transparent 70%),#151719}.background-studio-modal button{background:#252729;border-color:#a99a8344;color:#e0c9a9}.background-studio-modal button.active,.background-studio-modal button:hover{background:#493b29;border-color:#e6ad69}.background-studio-modal button.studio-primary{background:#e6ad69;color:#23180b;border-color:#e6ad69}.studio-eyebrow,.studio-status{color:#e6b77d}
@media(max-width:1100px) and (min-width:701px){#settings-overlay .settings-shell{grid-template-columns:104px minmax(0,1fr);column-gap:16px;padding:0 20px}#settings-overlay .settings-body{grid-template-columns:minmax(0,1fr) minmax(280px,.9fr);gap:16px}.settings-detail{padding-left:16px}#settings-overlay .settings-preview{height:290px}#settings-overlay .setting-row{grid-template-columns:minmax(0,1fr) minmax(90px,130px)}.settings-searchbox{width:240px}}
@media(max-width:700px){#settings-overlay .settings-shell{grid-template-columns:1fr;grid-template-rows:auto auto minmax(0,1fr) auto;padding:0 12px;gap:0}#settings-overlay .settings-header{grid-column:1;grid-row:1;padding:13px 38px 12px 0;gap:8px}.settings-identity h1{font-size:21px}.settings-identity h1>span{font-size:10px}.settings-kicker img{width:83px;height:21px}.settings-identity>p{display:none}.settings-searchbox{width:40vw;max-width:170px;padding:8px;gap:6px}.settings-searchbox input{font-size:9px}#settings-overlay .settings-close{top:20px;width:30px;height:30px}#settings-overlay .settings-tabs{grid-column:1;grid-row:2;flex-direction:row;overflow-x:auto;border:0;gap:5px;padding:9px 0;scrollbar-width:none}#settings-overlay .settings-tabs button{width:auto;min-height:30px;padding:6px 8px;font-size:9px;gap:5px}#settings-overlay .settings-tabs button::before{font-size:7px}#settings-overlay .settings-body{grid-column:1;grid-row:3;grid-template-columns:1fr;grid-template-rows:minmax(100px,1fr) minmax(200px,1fr);gap:10px;padding-top:6px}#settings-overlay .settings-nav{gap:5px;padding-bottom:10px}#settings-overlay .settings-nav button{padding:6px;font-size:8px}.settings-detail{max-height:none;border:0;border-top:1px solid #d0b39324;padding:10px 0;overflow:auto}#settings-overlay .settings-preview{height:185px;min-height:185px}.settings-detail-kicker,.settings-detail-values,.settings-detail-note{display:none}.settings-detail h2{font-size:16px;margin:10px 0 5px}.settings-detail>p{font-size:10px}.theme-scene-tools{padding-top:10px}.scene-symbol-palette{gap:3px}.scene-symbol-palette button{font-size:16px;padding:3px 5px;min-width:26px}.scene-edit-hint{font-size:9px}.scene-object-properties input[type=range]{width:62px}#settings-overlay .settings-foot{grid-column:1;grid-row:4;min-height:58px;padding:10px 0}.settings-footer-actions{gap:5px}#settings-overlay .settings-foot button{padding:8px;font-size:9px}.settings-save-state{display:none}#settings-overlay .background-design-row{grid-template-columns:1fr}.scene-preview+ .theme-scene-tools{margin-bottom:8px}}

/* Keep the live arena visible through the lobby while its controls stay readable. */
body.show-lobby #arena{visibility:visible}
body.show-lobby .vintage-stage.lobby{background:transparent!important}
body.show-lobby .vintage-stage.lobby:before,
body.show-lobby .vintage-stage.lobby:after,
body.show-lobby .v-stage-light,
body.show-lobby .v-stage-noise,
body.show-lobby #theme-artwork-overlay,
body.show-lobby #noise{display:none!important}

/* Live gameplay access and unavailable worlds. */
.quick-emoji,.emoji-option{font-family:"Segoe UI Emoji","Apple Color Emoji",sans-serif}
.server-entry.server-coming-soon{opacity:.55;cursor:default;filter:saturate(.35)}
.server-entry.server-coming-soon>span{color:#d6bc82;letter-spacing:.16em}

/* Enter-only glass composer. Cell reactions use their own O menu. */
body:not(.show-lobby) #chat #chat-form{display:none;background:rgba(4,12,20,.18);border:1px solid #a8dcec35;border-radius:12px;box-shadow:0 8px 28px #0002;backdrop-filter:blur(5px);height:42px;padding:4px;width:min(440px,calc(100vw - 28px));opacity:1}
body:not(.show-lobby) #chat.chat-active #chat-form{display:flex;background:rgba(4,12,20,.18)}
body:not(.show-lobby) #chat .chat-emoji-toolbar,body:not(.show-lobby) #chat.chat-active .chat-emoji-toolbar{display:none}
body:not(.show-lobby) #chat #chat-form button{background:transparent;border-radius:9px;color:#bdd5e3}
body:not(.show-lobby) #chat-form button:hover{background:#ffffff10;color:#fff}
body:not(.show-lobby) #chat-form input{font-size:13px;padding-inline:10px}