/* Rivet Dominion 0.14 — shared menu and battlefield interface. */
@font-face{font-family:Geist;src:url('assets/menu/fonts/geist-latin.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:'Geist Mono';src:url('assets/menu/fonts/geist-mono-latin.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
:root{--bg:#0b1012;--panel:#131a1ef5;--line:#344047;--muted:#a4afb4;--text:#f4f2ee;--green:#75d6c3;--oil:#f2b451;--amber:#f2b451;--raised:#1b2429;--soft-line:#dbe6eb24;--font:Geist,'Segoe UI',sans-serif;--mono:'Geist Mono',monospace}
body{background:var(--bg);font-family:var(--font);font-size:13px;font-weight:400;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font-family:var(--font);letter-spacing:0}
button{background:var(--raised);border-color:var(--line);border-radius:6px;color:var(--text);transition:background .16s,border-color .16s,color .16s}
button:hover:enabled{background:#283239;border-color:#67747c}
button:disabled{cursor:not-allowed}
button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,a:focus-visible{outline:2px solid var(--green);outline-offset:4px}
input,select{accent-color:var(--amber);color:var(--text);background:#0e1519;border:1px solid #455058;border-radius:6px;color-scheme:dark}
input::placeholder{color:#8e9aa1;opacity:1}
select option{background:#131a1e;color:var(--text)}
button svg,.icon{width:18px;height:18px;flex-shrink:0}
.eyebrow{font-family:var(--mono);font-weight:400;letter-spacing:1.1px;font-size:10px;color:var(--muted)}
.eyebrow>span:not(.live-dot){color:#7d8a91}
.live-dot,.status-dot{background:var(--green);box-shadow:none}
.primary,.lobby-overlay button.primary{background:var(--amber);border-color:var(--amber);color:#18140c;font-size:13px;font-weight:600;box-shadow:none;border-radius:6px;min-height:44px}
.primary:hover:enabled,.lobby-overlay button.primary:hover:enabled{background:#f8c574;border-color:#f8c574;color:#18140c}
.primary:disabled,.lobby-overlay button.primary:disabled{background:#303236;border-color:#464b4f;color:#9ba2a7;opacity:1}
.primary span{font-size:inherit;margin-left:0}
.resume,.danger-link{color:var(--muted);font-size:13px}
.resume:hover:enabled{background:transparent;color:var(--text);text-decoration:underline;text-underline-offset:4px}
.danger-link{color:#ff998e}
.danger-link:hover:enabled{color:#ffc1b9;background:transparent}
.subtle,.local-note{color:#9aa6ad!important;font-size:11px!important}
kbd{font-family:var(--mono);background:#ffffff08;color:#b3bec4;border-color:#ffffff1c;border-radius:3px}
/* The artwork is separate from the functional controls. */
.lobby-overlay{isolation:isolate;background:#0b1012;color:var(--text);font-family:var(--font)}
.lobby-overlay::before{content:'';position:fixed;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(90deg,#080e11ed 0%,#080e1180 46%,#080e1115 76%),linear-gradient(0deg,#080e11d9,transparent 35%),url('assets/menu/backgrounds/lobby-desktop.png') center/cover no-repeat}
.lobby-overlay[data-view=home]::before{background-image:linear-gradient(90deg,#080e11cf 0%,#080e1150 48%,#080e1105 80%),linear-gradient(0deg,#080e11cc,transparent 35%),url('assets/menu/backgrounds/main-menu-desktop.png')}
.lobby-shell{width:min(1280px,calc(100% - 96px));min-height:calc(100dvh - var(--safe-top) - var(--safe-bottom));padding:26px 0 20px;display:flex;flex-direction:column;position:relative;z-index:1}
.lobby-header{display:flex;align-items:center;justify-content:space-between;gap:18px;border-bottom:1px solid var(--soft-line);padding-bottom:20px;flex-shrink:0}
.lobby-brand{display:flex;align-items:center;gap:10px;color:var(--text);font-size:13px;font-weight:500;letter-spacing:.15px;text-decoration:none}
.lobby-brand img{width:25px;height:25px}
.lobby-brand span{color:var(--text);margin:0}
.menu-header-actions{display:flex;align-items:center;gap:24px}
.lobby-version{font:10px var(--mono);color:#a3aeb4;letter-spacing:.4px}
.lobby-version span{color:#66727a;margin:0 8px}
.icon-button,.lobby-overlay .icon-button{display:grid;place-items:center;min-width:44px;width:44px;height:44px;padding:0;background:#11191cb8;border-color:var(--soft-line)}
#lobby-home{display:flex;flex-direction:column;justify-content:center;width:360px;max-width:100%;flex:1;padding:48px 0 40px;min-height:540px}
.home-copy h1{margin:22px 0 18px;font-size:1px;line-height:1}
.home-copy h1 img{width:100%;height:auto;display:block}
.home-copy p{font-size:22px;font-weight:400;letter-spacing:-.5px;line-height:1.4;color:#d0d4d5;margin:0 0 28px}
.home-actions{display:grid;gap:6px}
.home-actions button{display:flex;align-items:center;gap:14px;width:100%;padding:12px 14px;min-height:64px;text-align:left;background:#12191dcc;border:1px solid var(--soft-line);font-size:14px;font-weight:500;backdrop-filter:blur(12px)}
.home-actions button>svg:first-child{width:19px;height:19px;color:#b5bfc4}
.home-actions button>span{flex:1;margin:0;font-size:14px}
.home-actions small{display:block;font-size:11px;font-weight:400;color:#a7b2b8;margin-top:3px}
.home-actions .action-arrow{width:16px;height:16px;color:#a7b2b8}
.home-actions button.primary{margin-bottom:6px}
.home-actions button.primary svg,.home-actions button.primary small{color:#4a3a20}
.home-caption{color:#97a2a8;font-size:11px;margin:20px 0 0}
#lobby-reconnect{display:flex;gap:8px;align-items:center;margin-top:12px;padding:4px 0;border:0;background:transparent;color:var(--green);font-size:12px}
.lobby-footer{border-top:1px solid var(--soft-line);margin:0;padding-top:16px;font-size:10px;gap:20px;line-height:1.6;color:#9ba8ae;flex-shrink:0}
.lobby-footer i{font-style:normal;padding:0 7px;color:#6e7a81}
#lobby-status{max-width:65%;color:#e8b6a0}
#lobby-status.ok{color:#b4c4c1}
.lobby-footer #lobby-status{max-width:65%;color:#e8b6a0}.lobby-footer #lobby-status.ok{color:#b4c4c1}
/* Join, host, and the waiting room share one readable window system. */
#lobby-browser,#single-player-menu{width:min(600px,100%);padding:24px 0 36px;flex:1}
.back-button,.lobby-overlay .back-button{display:flex;align-items:center;gap:8px;padding:4px 0;min-height:40px;border:0;background:transparent;color:var(--muted);font-size:12px}
.back-button:hover:enabled{background:transparent;color:var(--text)}
.lobby-hero{margin:20px 0 24px}
.lobby-hero .eyebrow,#lobby-waiting>.eyebrow{color:var(--amber);letter-spacing:1.1px}
.lobby-overlay h1,.room-heading h1{font-family:var(--font);font-size:28px;font-weight:500;line-height:1.2;letter-spacing:-.8px;margin:9px 0 10px}
.lobby-hero p,.room-heading p{font-size:13px;line-height:1.6;color:#b4bec4;max-width:520px}
.lobby-identity{display:flex;align-items:center;gap:18px;margin:0 0 16px;padding:14px 16px;border:1px solid var(--soft-line);background:#11181de8;border-radius:8px}
.lobby-overlay label,.lobby-identity label{font-size:12px;font-weight:400;letter-spacing:0;color:#b9c3c8;text-transform:none;line-height:1.5}
.lobby-identity label{flex-shrink:0;margin:0}
.lobby-identity input{width:100%;min-width:0}
.lobby-overlay input,.lobby-overlay select{height:46px;min-height:46px;font:16px var(--font);padding:10px 12px;border:1px solid #414c54;background:#0f161a;color:var(--text);border-radius:6px}
.lobby-overlay input:focus,.lobby-overlay select:focus{border-color:var(--green)}
.lobby-mode-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin:0 0 12px;background:#10171bd9;padding:4px;border:1px solid var(--soft-line);border-radius:8px}
.lobby-mode-tabs button{background:transparent;border-color:transparent;font-size:12px;color:#a9b5bb}
.lobby-mode-tabs button[aria-pressed=true]{background:#253036;border-color:#46535b;color:var(--text)}
.lobby-grid{display:block}
.lobby-grid[data-view=join] [data-lobby-card=host],.lobby-grid[data-view=host] [data-lobby-card=join]{display:none}
.lobby-card{padding:22px;background:#131a1ef2;border:1px solid var(--soft-line);border-radius:10px;backdrop-filter:blur(16px);box-shadow:0 14px 44px #0003}
.lobby-section-head{margin-bottom:18px;gap:12px}
.lobby-card h2{font-size:16px;font-weight:500;letter-spacing:-.25px}
.lobby-overlay button{font-family:var(--font);font-weight:500}
.lobby-section-head button,.invite-box button{display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;background:#1b2429;border-color:var(--line);color:var(--text)}
.lobby-tag{background:#ffffff06;border-color:var(--soft-line);color:var(--muted);font:10px var(--mono);letter-spacing:0;white-space:nowrap}
.lobby-list-row{background:#1a2328;border-color:var(--soft-line);padding:14px;margin-top:8px;border-radius:6px}
.lobby-list-row b{font-size:13px;font-weight:500;color:var(--text)}
.lobby-list-row small{font-size:11px;color:#a5b2b9;margin-top:4px}
.lobby-list-row>span:last-child{color:var(--amber);font-size:12px;white-space:nowrap}
.lobby-list-row:disabled>span:last-child{color:#8f9aa0}
.lobby-empty{background:#0f1619;border:1px dashed #354047;border-radius:6px;color:#c5cdd1;padding:28px 16px;font-size:13px;line-height:1.7}
.lobby-empty small{color:#93a1a9;font-size:12px}
.join-form{border-color:var(--soft-line);padding-top:20px;margin-top:20px}
.join-form>div{gap:8px}
.join-form input{max-width:none;min-width:0;flex:1;font-family:var(--mono);letter-spacing:1.8px}
.join-form button{display:flex;align-items:center;justify-content:center;gap:14px;flex-shrink:0;padding:9px 18px}
.lobby-card .join-form .primary{width:auto;margin:0}
.lobby-form-row{gap:14px}
#host-form>label,#host-form .lobby-form-row{margin-bottom:16px}
#host-form .primary{display:flex;align-items:center;justify-content:space-between;width:100%;gap:20px;padding:12px 16px}
.lobby-note{color:#a9b5bc;font-size:12px;line-height:1.6}
#lobby-waiting{width:min(960px,100%);flex:1;padding:40px 0}
.room-heading{gap:28px;margin:18px 0 24px;align-items:center}
.room-heading>div:first-child{min-width:0}
.invite-box{padding:14px 18px;min-width:210px;background:#131a1ee8;border:1px solid var(--soft-line);border-radius:8px}
.invite-box small{font-family:var(--font);font-size:11px;color:#a4b1b9;letter-spacing:0}
.invite-box strong{font-family:var(--mono);font-size:22px;font-weight:450;color:var(--amber);letter-spacing:3px}
.invite-box button{font-size:11px;min-height:44px}
#lobby-seats{gap:10px}
.lobby-seat{padding:18px;background:#121a1ee8;border-color:var(--soft-line);border-radius:8px;gap:16px;min-width:0}
.lobby-seat.human{background:#1a2427f0;border-color:#596861}
.seat-number{font:16px var(--mono);color:#718087}
.lobby-seat.human .seat-number{color:var(--amber)}
.lobby-seat b{font-size:13px;font-weight:500;color:var(--text)}
.lobby-seat b em{font-family:var(--mono);font-size:9px;color:var(--green);font-style:normal;margin-left:5px}
.lobby-seat small{font-size:11px;color:#a3b0b7}
.seat-state{font:11px var(--mono);color:#a7b4b9;border-color:#38454b;background:#1a2429}
.seat-state.ready{background:#1a3931;border-color:#467a6c;color:#a4e8d9}
.room-actions{gap:10px;padding-top:18px;border-color:var(--soft-line)}
.room-actions button{min-height:46px;padding:12px 18px;font-size:12px}
.room-actions #lobby-start{display:flex;align-items:center;gap:16px}
#lobby-ready.ready{background:#1c3931;color:#b3eadc;border-color:#548a78}
.busy{cursor:progress}
.busy [data-open-lobby],.busy #lobby-back,.busy [data-lobby-view]{pointer-events:none;opacity:.55}
/* All atmosphere stays behind the controls and never receives input. */
.menu-atmosphere{--menu-animation-state:running;position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;contain:strict;container-type:size}
.menu-fx{position:absolute;display:block;background-position:center;background-repeat:no-repeat;background-size:contain;opacity:0;will-change:transform,opacity}
.menu-steam{width:52vw;height:80vh;right:-10%;bottom:-20%;background-image:url('assets/menu/fx/steam-wisp.png');animation:menu-steam 24s ease-in-out infinite}
.menu-dust{inset:0 0 0 38%;background-image:url('assets/menu/fx/ambient-dust.png');animation:menu-dust 38s linear infinite}
.menu-haze{left:30%;right:-20%;height:35vh;bottom:-7%;background-image:url('assets/menu/fx/floor-haze.png');animation:menu-haze 28s ease-in-out infinite}
.menu-sparks{width:24vw;height:44vh;right:12%;top:22%;background-image:url('assets/menu/fx/welding-sparks.png');animation:menu-sparks 14s linear infinite}
.menu-beacon{position:absolute;right:8%;top:22%;width:5px;height:5px;border-radius:50%;background:#ffad4d;box-shadow:0 0 15px 4px #f29a3440;animation:menu-beacon 6s ease-in-out infinite;opacity:.5}
@keyframes menu-steam{0%,100%{opacity:.03;transform:translateY(20px)}50%{opacity:.13;transform:translateY(-24px)}}
@keyframes menu-dust{0%{opacity:.15;transform:translate(0,12px)}50%{opacity:.3}100%{opacity:.15;transform:translate(-12px,-12px)}}
@keyframes menu-haze{0%,100%{opacity:.05;transform:translateX(-15px)}50%{opacity:.15;transform:translateX(15px)}}
@keyframes menu-sparks{0%,82%,100%{opacity:0;transform:translateY(-8px)}87%{opacity:.45}95%{opacity:.12;transform:translateY(18px)}}
@keyframes menu-beacon{0%,65%,100%{opacity:.18}80%{opacity:.65}}
/* A faint power fluctuation dims only the artwork, not the menu text. */
.lobby-overlay[data-view=home] .menu-atmosphere::before{content:'';position:absolute;inset:0;background:#03080c;opacity:0;animation:menu-light-flicker 18.6s linear infinite;animation-play-state:var(--menu-animation-state)}
@keyframes menu-light-flicker{
 0%,12%,15%,42%,45%,78%,81%,100%{opacity:0}
 13%{opacity:.045}14%{opacity:.012}
 43%{opacity:.025}44%{opacity:.055}
 79%{opacity:.04}80%{opacity:.015}
}
/* Match the cover-scaled 1672 × 941 artwork so each weld stays on the robot.
   Container units follow the fixed background even when mobile chrome resizes. */
.menu-maintenance{display:none;position:absolute;left:50%;top:50%;width:max(100cqw,calc(100cqh * 1672 / 941));aspect-ratio:1672 / 941;transform:translate(-50%,-50%)}
.lobby-overlay[data-view=home] .menu-maintenance{display:block}
.lobby-overlay[data-view=home] .menu-sparks{display:none}
.menu-weld{--weld-delay:0s;position:absolute;width:17%;aspect-ratio:1;transform:translate(-32.8%,-26.6%);font-size:clamp(8px,1cqw,20px)}
.menu-weld--hip{left:73.4%;top:51.5%}
.menu-weld--arm{--weld-delay:-6.8s;left:52.3%;top:49.7%;width:13%}
/* The texture's source is at 32.8% / 26.6%; scaling around it keeps contact. */
.menu-weld::after{content:'';position:absolute;inset:0;background:url('assets/menu/fx/welding-sparks.png') center/contain no-repeat;transform-origin:32.8% 26.6%;opacity:0;animation:menu-weld-spray 13.6s linear var(--weld-delay) infinite}
.menu-weld::before{content:'';position:absolute;left:32.8%;top:26.6%;width:34%;aspect-ratio:1;transform:translate(-50%,-50%);background:radial-gradient(circle,#f4fdff 0 2%,#c4ecffb3 4%,#ffdb8c70 12%,#f99b3326 34%,transparent 70%);opacity:0;animation:menu-weld-glow 13.6s linear var(--weld-delay) infinite}
@keyframes menu-weld-spray{
 0%,7%,20%,100%{opacity:0;transform:scale(.72,.8)}
 8%{opacity:.45;transform:scale(.9,.88)}
 10%{opacity:.19;transform:scale(.96,1.03)}
 12%{opacity:.6;transform:scale(1,.95)}
 14%{opacity:.3;transform:scale(.86,1.08)}
 16%{opacity:.52;transform:scale(.97,1)}
 18%{opacity:.08;transform:scale(1.02,1.12)}
}
@keyframes menu-weld-glow{
 0%,7%,19%,100%{opacity:0}
 8%{opacity:.6}10%{opacity:.24}12%{opacity:.76}
 14%{opacity:.32}16%{opacity:.65}18%{opacity:.1}
}
/* A few separate embers continue falling after the welding arc goes dark. */
.menu-ember{--drift:2.2em;--fall:5.5em;--ember-lag:0s;--tilt:-22deg;position:absolute;left:32.8%;top:26.6%;width:2px;height:6px;border-radius:50%;background:#ffe6a6;box-shadow:0 0 5px #ffa842;opacity:0;animation:menu-ember-fall 13.6s linear calc(var(--weld-delay) + var(--ember-lag)) infinite}
.menu-ember:nth-child(2){--drift:-1.4em;--fall:4.7em;--ember-lag:.18s;--tilt:18deg;height:4px}
.menu-ember:nth-child(3){--drift:3.5em;--fall:7.4em;--ember-lag:.4s;--tilt:-30deg}
.menu-ember:nth-child(4){--drift:.8em;--fall:8.6em;--ember-lag:.62s;--tilt:-8deg;height:3px}
.menu-ember:nth-child(5){--drift:4.3em;--fall:6.2em;--ember-lag:.83s;--tilt:-37deg;height:4px}
@keyframes menu-ember-fall{
 0%,8%,24%,100%{opacity:0;transform:translate(0,0) rotate(var(--tilt))}
 9%{opacity:.8;transform:translate(0,0) rotate(var(--tilt));animation-timing-function:cubic-bezier(.35,0,.8,.55)}
 19%{opacity:.4;transform:translate(var(--drift),var(--fall)) rotate(var(--tilt))}
 23%{opacity:0;transform:translate(var(--drift),calc(var(--fall) + 1.6em)) rotate(var(--tilt))}
}
html[data-menu-motion=off] .menu-atmosphere{display:none}
html[data-page-hidden=true] .menu-atmosphere,#lobby-screen[hidden] .menu-atmosphere{--menu-animation-state:paused}
.menu-atmosphere::before,.menu-atmosphere *,.menu-atmosphere *::before,.menu-atmosphere *::after{animation-play-state:var(--menu-animation-state)}
/* Modal windows: setup, pause, rules, intelligence, results, and errors. */
.modal-backdrop{background:#05090d9e;backdrop-filter:blur(10px)}
#intro{background:linear-gradient(90deg,#080e11c9,#080e1199),url('assets/menu/backgrounds/main-menu-desktop.png') center/cover}
.intro-card,.small-card,.menu-dialog{background:linear-gradient(150deg,#182126f5,#10171bf9),url('assets/menu/backgrounds/lobby-desktop.png') center/cover;border:1px solid #65717966;border-radius:12px;box-shadow:0 24px 80px #0006;color:var(--text);padding:28px}
.intro-card{width:640px}
.small-card{width:540px}
.intro-card h2,.small-card h2,.menu-dialog h2{font-family:var(--font);font-size:26px;font-weight:500;letter-spacing:-.7px;line-height:1.2;margin:12px 0 16px}
.intro-card>.eyebrow,.small-card>.eyebrow,.menu-dialog>.eyebrow{font-size:10px;color:var(--amber)}
.intro-card .lead,.small-card p,.menu-dialog p{font-size:13px;color:#b7c1c7;line-height:1.7}
.intro-steps{margin:24px 0 20px;padding:18px 0;border-color:var(--soft-line);gap:18px}
.intro-steps b{font:11px var(--mono);color:var(--amber)}
.intro-steps span{font-size:12px;font-weight:500}
.intro-steps small{font-size:11px;color:#a7b3ba;line-height:1.6}
.intro-controls{color:#a3b0b8;font-size:11px;gap:14px}
.deploy-row{gap:16px;margin-top:22px;align-items:end}
.deploy-row label{font-size:12px;letter-spacing:0;color:#b6c2c8}
.deploy-row select,.match-setting select{background:#0d1519;color:var(--text);border-color:#46545c;border-radius:6px;min-height:44px;font-size:14px}
.deploy-row .primary{padding:12px 18px;min-height:44px}
.mobile-intro{background:#ffffff06;color:#b8c7ce;border:1px solid var(--soft-line);font-size:13px}
.local-note{margin-top:18px;line-height:1.6}
.small-card .primary{margin:16px 0}
.menu-status{color:var(--green)!important;font-size:12px!important}
.menu-actions{margin:14px 0 18px;gap:8px}
.menu-actions button{background:#1c272d;border-color:var(--line);font-size:12px}
.match-setting{font-size:12px;color:#b9c4ca;margin-top:18px}
.manual{border-color:var(--soft-line);margin-top:22px;padding-top:8px}
.manual summary{font-size:13px;color:var(--text);padding:12px 0}
.touch-guide{background:#ffffff06;border:1px solid var(--soft-line);color:var(--text);border-radius:6px}
.small-card dl{font-size:12px;grid-template-columns:140px 1fr;line-height:1.6;gap:14px}
.small-card dt{color:#d9c19b;font-size:11px}
.small-card dd{color:#b9c5cc}
.intel-card{width:760px}
#intel-table{border:1px solid var(--soft-line);border-radius:7px;margin:16px 0;scrollbar-width:thin}
#intel-table table{margin:0;font-size:12px}
#intel-table th,#intel-table td{padding:10px 12px;font-size:12px;border-color:var(--soft-line);font-variant-numeric:tabular-nums}
#intel-table tbody tr:nth-child(even){background:#ffffff03}
#intel-table th{color:#aebbc2}
#intel-table thead th{background:#202b31;color:var(--text);font-weight:500;white-space:nowrap}
#intel-warning{border-color:var(--amber);color:#e3c390;padding:10px 12px;background:#f2b45108;border-radius:0 5px 5px 0}
#intel-advice{color:#c3d9d2}
.result-stats{gap:24px;margin:24px 0;padding:18px 0;border-block:1px solid var(--soft-line);flex-wrap:wrap}
.result-stats strong{font-family:var(--mono);font-size:25px;font-weight:450;color:var(--amber)}
.result-stats small{font-size:11px;color:#a7b6bd}
#error{z-index:90;background:#0b1012ed}
#error-message,#deployment-error{color:#ffd0c9;background:#48272155;border-color:#b67b6d;font-size:13px;overflow-wrap:anywhere}
/* Native modal layering, focus containment, and Escape work for both dialogs. */
.menu-dialog{width:480px;max-width:calc(100vw - 32px);max-height:calc(100dvh - var(--safe-top) - var(--safe-bottom) - 32px);overflow:auto;font-family:var(--font)}
.menu-dialog::backdrop{background:#05090eb8;backdrop-filter:blur(8px)}
.dialog-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.dialog-heading h2{font-size:24px}
.dialog-heading .icon-button{border-color:transparent;background:transparent}
.confirm-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:24px}
.confirm-actions button{min-height:44px;padding:10px 14px;font-size:13px}
.confirm-actions .destructive{background:#c86f5e;border-color:#c86f5e;color:#fff}
.confirm-actions .destructive:hover:enabled{background:#df8a78;border-color:#df8a78;color:#1b1010}
.motion-setting{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;border-block:1px solid var(--soft-line);margin:18px 0}
.motion-setting b{display:block;font-size:12px;font-weight:500;color:var(--text)}
.motion-setting small{display:block;font-size:11px;color:#a6b3ba;margin-top:4px;line-height:1.5}
.motion-setting button{min-width:64px;min-height:44px;padding:8px 12px;font-size:12px}
.motion-setting button[aria-pressed=true]{background:#24362f;border-color:#5e8d7c;color:#c5e9dd}
.music-controls{background:#0e161aa6;border:1px solid var(--soft-line);border-radius:7px;padding:12px;margin:18px 0}
.music-row button{font-family:var(--font);font-size:12px;min-width:104px;min-height:44px;background:#21372f;color:#c2e7da;border-color:#4a7565;border-radius:6px}
.music-row button[aria-pressed=false]{color:#b4c0c6;background:#1c272d;border-color:#43515a}
.music-row label{font-size:11px;color:#b4c0c6}
.music-row input{accent-color:var(--amber);border:0;background:transparent}
.music-row output{font-family:var(--mono);font-size:11px;color:#cbd5d9}
.music-controls>small{font-size:10px;color:#9babb4;line-height:1.6}
/* The battlefield keeps its established geometry and a quiet, unified surface. */
.topbar{background:#10171bed;border-bottom:1px solid var(--soft-line);backdrop-filter:blur(16px)}
.brand{letter-spacing:0}
.brand img{display:block;width:190px;height:auto}
.resource strong,.session>span,#core-status,#compact-queue,.faction small,.title-row>span,.upgrade-head small,.upgrade-bottom,.defense-heading span,.defense-card small,.mission-actions,.minimap-wrap button,.minimap-wrap #fog-toggle,#refit-badge{font-family:var(--mono);font-variant-numeric:tabular-nums}
.resource strong{font-weight:450;color:var(--text)}
.resource span{font-family:var(--font);font-weight:500;letter-spacing:1px}
.resource em{color:#9eacb4}
.alloy{color:#bcc8d0}
.session button{background:#1b2429;border-color:var(--line)}
.panel{background:var(--panel);border-color:#5b687155;border-radius:10px;box-shadow:0 12px 34px #0004;backdrop-filter:blur(16px)}
.hud-panel{background:linear-gradient(150deg,#192227f7,#10171bf7),url('assets/menu/backgrounds/lobby-desktop.png') center/cover}
.panel-heading{border-color:var(--soft-line);background:#ffffff02}
.panel-heading>b{font-weight:500;letter-spacing:-.1px}
.panel-heading button{color:#a4b3bb;background:transparent;border-color:transparent}
.panel-heading button:hover:enabled{border-color:var(--line);background:#ffffff06;color:var(--text)}
.panel-live{color:#adbbb7}
#core-status{background:#141d22eb;border-color:#526159;color:#b1bec4;font-size:10px}
#core-mini{color:var(--green)}
#compact-queue{background:#19252bed;color:#c6d3ce;font-size:10px}
.camera-tools button{background:#151e24ed;border-color:var(--line);color:#c3ced3;border-radius:7px}
.mission>.eyebrow{color:#a2aeb5}
.mission h1{font-weight:500;letter-spacing:-.3px}
.mission p,.mission-actions,.faction small{color:#aab7bf}
.mission-actions{border-color:var(--soft-line)}
.mission-actions button{font-family:var(--font)}
.faction b{font-weight:450}
.workshop-title{background:transparent}
.title-row h2{font-weight:500;letter-spacing:-.25px}
.title-row>span{color:var(--green)}
.health{background:#354047;height:3px}
.health i{background:var(--green)}
.queue{color:#a9b7bf}
.queue i{background:var(--amber)}
.tabs{border-color:var(--soft-line)}
.tabs button{border-color:var(--soft-line);color:#a6b4bd;font-family:var(--font);font-weight:450;background:transparent}
.tabs button.active{background:#f2b4510d;color:var(--amber);border-bottom:2px solid var(--amber)}
.upgrade-list-title{color:#a8b5bd;font-family:var(--font);text-transform:none;letter-spacing:.1px;font-size:11px}
#upgrade-list{scrollbar-color:#47545d transparent}
.upgrade{background:#1c262c;border-color:#39464e;border-radius:7px;box-shadow:none}
.upgrade:hover:enabled{background:#28343b;border-color:#8d9a94}
.upgrade b{font-weight:500;color:var(--text)}
.upgrade p{font-size:11px;color:#a9b8c0}
.upgrade-icon{background:#111a1f;border-color:#3c4c55;border-radius:6px;color:#c3d0d5}
.upgrade-head small{color:#b9d8cc}
.upgrade-bottom .effect{color:#b6c9c2}
.upgrade-bottom .price{color:var(--amber)}
.upgrade-content .upgrade-visual{color:#b5a68d}
.upgrade:disabled{opacity:.6}
.upgrade-shortcut{color:#9ebbb1}
#firmware-alert{background:#f2b4510d;color:#f2c886;border-color:#826640;border-radius:6px}
.defense-intro{color:#acbbc2;font-size:12px}
.defense-card{background:#182228;border-color:#36454e;border-radius:7px}
.defense-heading b{font-weight:500;color:var(--text)}
.defense-heading span{color:#b1d0c5}
.defense-card small{color:#b4c2c8}
.defense-card p{color:#a7b7bf}
.defense-actions button{background:#233139;border-color:#465761;border-radius:5px}
.minimap-wrap button{color:#b5c3ca;background:transparent}
#minimap{background:#10171c;border-color:#3c4b54;border-radius:6px}
.minimap-wrap #fog-toggle{font-family:var(--font);background:#1c3029;border-color:#486b5a;color:#b8decc;border-radius:6px}
.minimap-wrap #fog-toggle.debug{background:#3a2e1d;border-color:#947447;color:#f3cf96}
.mini-legend{color:#a1b1bb}
.order-grid button,.support button{background:#1e2a31;border-color:#3b4c57;border-radius:6px}
.order-grid small,.support small{color:#a3b7c2;font-size:11px}
.support{background:transparent;border-color:var(--soft-line)}
.support button span{font-weight:500}
.support button svg{color:var(--green)}
.command{background:#10181ef5;border-color:#64737c66;border-radius:10px}
.selection-info b{font-weight:500;color:#dde5e7}
.selection-info small{color:#a4b5bf}
.selection-info>svg{stroke:#c0d0cd}
.commands button,.commands #mobile-workshop{background:#1e2a32;border-color:#3a4c59;color:#d4e0e5;border-radius:6px;font-weight:450}
.commands button:hover:enabled{background:#2b3a44;border-color:#81979e}
.commands button[aria-expanded=true],.commands button.active,.commands #move.active{background:#34463e;border-color:#a8cbb7;color:#e8f3ed}
.commands #attack{border-color:#8c7858;color:#e4c99b}
.commands #attack.active{background:#5a4530;border-color:var(--amber);color:#ffe2b2}
#refit-badge{background:var(--amber);color:#20180c}
.control-hint{color:#98abb7}
.command.aiming{border-color:#a7c6b6}
.command.aiming .control-hint{color:#d1e5dc}
#cancel-order{background:#403327;border-color:#95714b;color:#f3d3a3}
.command .bulwark-main{background:#3b3022;border-color:#a67f47;color:#f7d8a8;box-shadow:none;border-radius:7px;min-height:52px}
.command .bulwark-main:hover:enabled{background:#51402a;border-color:#e9b96f}
.bulwark-main b{font-size:14px;font-weight:550;letter-spacing:0}
.bulwark-main small{color:#d2b990}
.bulwark-main>kbd{background:#261f17;color:#e7c593;border-color:#866b45}
.command .bulwark-main.deployed{background:#453420;border-color:#d29e56;color:#ffdaa2}
.command .bulwark-main:disabled{background:#202a31;border-color:#495963;color:#a9b8c2;opacity:1}
.bulwark-main:disabled small{color:#96a9b5}
.command .bulwark-main.deployed:disabled{background:#372b1e;border-color:#9c793f;color:#f1c88d}
/* Both emergency actions stay on the battlefield, including narrow screens. */
.base-actions{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:7px;margin-bottom:8px}
.command .base-actions>button{min-width:0;width:100%;min-height:52px;display:flex;align-items:center;gap:8px;margin:0;padding:8px 10px;text-align:left;border-radius:7px}
.base-actions>button>svg{width:22px;height:22px;flex-shrink:0}.base-actions>button>span{flex:1;min-width:0}
.base-actions b,.base-actions small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.base-actions b{font-size:13px;font-weight:550;letter-spacing:0}.base-actions small{font-size:10px;margin-top:3px}
.base-actions>button>kbd{flex-shrink:0;font-size:10px}
.command .repair-main{background:#1d3734;border:1px solid #548f81;color:#d7f5eb}
.repair-main small{color:#a8d0c3}.command .repair-main:hover:enabled{background:#2b4b43;border-color:#8bc9b6}
.command .repair-main:disabled{background:#202a31;border-color:#495963;color:#a9b8c2;opacity:1}.repair-main:disabled small{color:#96a9b5}
.repair-main>kbd{color:#b2e4d2;border-color:#548f81}
.core-durability{margin:7px 0 0;font:10px/1.5 var(--mono);color:#b4c6cb;font-variant-numeric:tabular-nums}
@media(max-width:900px),(pointer:coarse){.base-actions{gap:5px;margin-bottom:6px}.command .base-actions>button{padding:7px;gap:6px}.base-actions>button>svg{width:18px;height:18px}.base-actions>button>kbd{display:none}.base-actions b{font-size:12px}.base-actions small{font-size:9px}}
@media(max-height:500px) and (min-width:600px){.command .base-actions>button{min-height:44px;padding:5px 8px}.base-actions{margin-bottom:5px}.core-durability{margin:3px 0;font-size:9px}}
.quick-upgrades{border-color:var(--soft-line)}
.quick-upgrade-heading>b{font-family:var(--font);font-weight:500;text-transform:none;letter-spacing:.1px;color:#d0dadd;font-size:11px}
.quick-upgrade-heading>span{color:#98adb9}
.quick-upgrade-heading>button{background:#1b2730;border-color:#475b68;color:#bdcdd5;min-width:32px}
[data-quick-groups] button{background:#19262f;color:#aec1cd;border-color:transparent;font-family:var(--font);font-weight:450}
[data-quick-groups] kbd{background:#0f1a21;color:#a6bfc9;border-color:#3b5462}
[data-quick-groups] button[aria-pressed=true]{background:#354237;border-color:#7d9476;color:#e0ecdc}
[data-quick-items]{scrollbar-color:#49606b transparent}
[data-quick-items]>button{background:#25342e;border-color:#54705c;color:#e5eee7;border-radius:5px}
[data-quick-items]>button.affordable:hover{background:#3b4c3c;border-color:#b8cda6}
[data-quick-items]>button:disabled{background:#17242d;border-color:#334b5a;color:#9bb1c0}
.quick-item-title b{font-weight:500}
.quick-item-title kbd{background:#13221d;color:#b4cab9;border-color:#3c5948}
[data-quick-price]{font-family:var(--mono);color:#eed2a2;font-size:10px}
[data-quick-items]>button:disabled [data-quick-price]{color:#a2b5c0}
.shortcut-armed [data-quick-status]{color:#f4cf91}
.shortcut-armed [data-quick-items]>button,.shortcut-armed .quick-item-title kbd{border-color:#bb965b}
#toast{background:#18252ef5;border-color:#7b969c;color:#e7eff1;border-radius:7px;box-shadow:0 8px 24px #0004}
#paused-tag{font-family:var(--font);background:#1d221ff2;border-color:#8b764d;color:#e7c78f;text-transform:none;font-size:11px;letter-spacing:0}
#network-bar{background:#16252ded;border-color:#486470;color:#b8cbd4}
#connection-text{font-family:var(--mono);font-size:10px;line-height:1.5}
#leave-online{color:#c1d0d7;background:#20313b;border-color:#49616f}
.base-label{font-family:var(--font);font-size:10px;font-weight:550;letter-spacing:.6px}
/* Preserve the existing safe-area, measured dock, and short-landscape layout. */
@media(max-width:1100px){.brand img{width:150px}.lobby-shell{width:calc(100% - 64px)}}
@media(max-width:900px),(pointer:coarse){
 .brand{display:none}.lobby-version{display:none}.lobby-shell{width:calc(100% - 40px);padding:18px 0}
 .lobby-header{padding-bottom:14px}.lobby-brand{font-size:12px}.lobby-brand img{width:23px;height:23px}.menu-header-actions{gap:12px}
 .intro-card,.small-card{padding:22px 18px;border-radius:12px}.intro-card h2,.small-card h2{font-size:25px}
 .small-card dl{grid-template-columns:1fr;gap:5px}.small-card dd{margin-bottom:10px}.small-card dt{font-size:12px}
 .deploy-row select,.match-setting select{font-size:16px;min-height:46px}.deploy-row .primary{min-height:48px}.intro-card .resume{font-size:13px}
 .lobby-identity{display:block;padding:14px}.lobby-identity label{display:block;margin-bottom:7px}.lobby-card{padding:18px}
 .lobby-hero{margin:12px 0 20px}.lobby-overlay h1,.room-heading h1{font-size:26px}.lobby-footer{flex-direction:column;gap:5px;font-size:10px}.lobby-footer #lobby-status{max-width:100%}
 .room-heading{display:block}.invite-box{display:grid;grid-template-columns:1fr auto;min-width:0;margin-top:20px;padding:14px}.invite-box strong{font-size:22px}.invite-box button{grid-column:2;grid-row:1/3}
 #lobby-waiting{padding:28px 0}.room-actions{position:sticky;bottom:0;background:#10171bf7;padding:12px 0 calc(12px + var(--safe-bottom));gap:8px}.room-actions button{font-size:12px}.room-actions #lobby-start{justify-content:center}
 .panel,.command,.workshop,.mission,.orders-panel,.minimap-wrap{border-radius:10px}
 .commands button,.commands #mobile-workshop{font-size:10px}.order-grid small{font-size:10px}.bulwark-main b{font-size:13px}.command .bulwark-main{min-height:52px}
 [data-quick-groups] button{min-height:44px;font-size:9px}.quick-upgrade-heading{height:36px}.quick-upgrade-heading>button{height:36px;min-width:44px}.quick-upgrade-heading>b{font-size:10px}
 [data-quick-price]{font-size:9px}.quick-item-title b{font-size:10px}.tabs button{font-size:11px}.panel-heading button{width:44px;height:44px}
 #network-bar{background:#14242de8}#connection-text{font-size:9px}
}
@media(max-width:700px){
 .lobby-overlay[data-view=home]::before{background-image:linear-gradient(0deg,#080e11f0 5%,#080e1180 55%,#080e1140),url('assets/menu/backgrounds/main-menu-mobile.png');background-position:center top;background-size:cover}
 #lobby-home{width:340px;min-height:650px;justify-content:flex-end;padding:160px 0 30px}.home-copy h1{max-width:310px;margin:16px 0}.home-copy p{font-size:19px;margin-bottom:24px}.home-copy p br{display:none}
 .home-copy .eyebrow{font-size:9px}.home-actions button{min-height:60px;background:#11191ee0}.home-actions small{font-size:11px}
 #lobby-seats{grid-template-columns:1fr}.lobby-seat{padding:14px}.lobby-seat b{font-size:13px}.lobby-seat small{font-size:11px}
 #intro{background-image:linear-gradient(#080e1199,#080e11eb),url('assets/menu/backgrounds/main-menu-mobile.png')}
 .menu-steam{width:90vw;right:-40%}.menu-dust{left:12%}.menu-haze{left:-20%;right:-50%}.menu-sparks{width:45vw;height:30vh;right:0;top:15%}
 /* The portrait artwork uses a different crop and a top-aligned cover. */
 .menu-maintenance{top:0;width:max(100cqw,calc(100cqh * 941 / 1672));aspect-ratio:941 / 1672;transform:translateX(-50%)}
 .menu-weld{width:24%}
 .menu-weld--hip{left:79.5%;top:36.7%}
 .menu-weld--arm{left:48.7%;top:38.7%;width:20%}
 .lobby-form-row{gap:10px}.lobby-footer>span:last-child{font-size:9px}.lobby-footer i{padding:0 3px}
}
@media(max-width:400px){.lobby-shell{width:calc(100% - 32px)}.lobby-card{padding:14px}.lobby-overlay label{font-size:11px}.lobby-form-row{grid-template-columns:1fr}.lobby-tag{font-size:9px}.home-copy h1{width:290px;max-width:100%}.music-row{gap:7px}.music-row button{min-width:94px;padding:8px}.menu-dialog{padding:20px}.confirm-actions{grid-template-columns:1fr}.confirm-actions #confirm-cancel{order:2}}
@media(max-height:500px) and (min-width:600px){
 .lobby-shell{padding:12px 0}.lobby-header{padding-bottom:10px}#lobby-home{min-height:370px;padding:24px 0;width:330px}.home-copy h1{max-width:280px;margin:12px 0}.home-copy p{font-size:18px;margin:0 0 16px}.home-copy p br{display:none}.home-actions button{min-height:48px;padding:8px 12px}.home-actions small{display:none}.home-caption{margin-top:14px}
 .intro-card h2,.small-card h2{font-size:23px}.intro-card,.small-card{padding:20px}.command .bulwark-main{min-height:44px}.quick-upgrade-heading{height:28px}.quick-upgrade-heading>button{height:28px;min-width:36px}[data-quick-body]{background:#121d25fa;border-color:#647a85}[data-quick-groups] button{min-height:36px}.title-row,.health{display:none}
}
@media(prefers-reduced-motion:reduce){.menu-atmosphere{display:none}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Hidden is authoritative; no layout declaration may resurrect a blocking menu. */
[hidden],.modal-backdrop[hidden],.lobby-overlay[hidden]{display:none!important}

/* Keep the extended tutorial explanation visible on compact screens. */
#single-player-menu .home-actions small{display:block;line-height:1.5}