:root{--raised:#a8b8dd;--edge:#3d4f80;--carbon:#171b27;--ink:#111624;--paper:#eef2fb;--ok:#75d6a0;--error:#ff7d7d;font-family:Arial,Helvetica,sans-serif;color:var(--paper);background:#10131d}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 70% -20%,#323c62 0,transparent 42%),#10131d;color:var(--paper)}.skip{position:fixed;left:12px;top:-80px;z-index:5;background:#fff;color:#111;padding:12px 16px}.skip:focus{top:12px}.command-bar{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:20px clamp(18px,4vw,48px);background-color:var(--carbon);background-image:radial-gradient(#40475d 1px,transparent 1px);background-size:6px 6px;border-bottom:4px solid var(--edge)}h1,h2,p{margin-top:0}h1{font-size:clamp(20px,3vw,34px);line-height:1.05;margin-bottom:0;letter-spacing:-.02em}h2{font-size:clamp(20px,2.4vw,30px);margin-bottom:10px}.eyebrow,.panel-label{font-size:11px;font-weight:800;letter-spacing:.14em;margin-bottom:7px;color:#f2b45d}.status{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid #66708d;background:#22283a;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.status.ok{color:var(--ok);border-color:#377954}.status.error{color:var(--error);border-color:#984242}main{width:min(960px,calc(100% - 28px));margin:28px auto 44px}.plate{position:relative;padding:clamp(18px,3vw,30px);color:var(--ink);background:linear-gradient(145deg,var(--raised),#7282ae);border-top:2px solid #d5def5;border-left:2px solid #bdc9e8;border-right:3px solid var(--edge);border-bottom:4px solid #2d3d72;clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px));margin-bottom:18px}.hero{display:grid;grid-template-columns:1.15fr .85fr;gap:28px;align-items:center}.hero>div>p:last-child,.native-panel>p{line-height:1.55}.readouts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0}.readouts div{background:rgba(238,242,251,.85);border:1px solid #536590;padding:12px;min-height:74px}.readouts dt{font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#445070}.readouts dd{margin:7px 0 0;font-weight:800}.panel-label{display:inline-block;color:#fff;background:var(--carbon);padding:7px 10px;margin:-8px 0 18px}.heading-row{display:flex;align-items:start;justify-content:space-between;gap:24px}.heading-row h2{margin-bottom:6px}.heading-row p{margin-bottom:0;line-height:1.45}.secondary{flex:0 0 auto;min-width:112px;min-height:44px;padding:0 18px;border:0;border-top:2px solid #5b6277;border-bottom:4px solid #080a10;background:var(--carbon);color:#fff;font:800 13px/1 Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}.secondary:hover{background:#292f42}.secondary:active{transform:translateY(2px);border-bottom-width:2px}.secondary:focus-visible{outline:4px solid #fff;outline-offset:3px}.secondary:disabled{cursor:wait;filter:grayscale(.6)}#lobbies{min-height:128px;margin:18px 0 0;padding:0;list-style:none;border:2px inset #4e5f8d;background:rgba(238,242,251,.86)}#lobbies li{display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px;min-height:58px;padding:10px 14px;border-bottom:1px solid #7a89af}#lobbies li:last-child{border-bottom:0}#lobbies .empty{display:block;color:#4a5572}.lobby-code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:900;letter-spacing:.08em}.lobby-count{font-size:12px;font-weight:800;color:#445070}.native-panel{background:linear-gradient(145deg,#9fb3dd,#5f719f)}.safeguards ul{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0;padding:0;list-style:none}.safeguards li{background:rgba(238,242,251,.78);border-left:5px solid var(--edge);padding:14px;line-height:1.45}footer{padding:18px;text-align:center;background:var(--carbon);color:#aeb8d2;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}@media(max-width:700px){.command-bar{align-items:flex-start;flex-direction:column}.hero{grid-template-columns:1fr}.heading-row{align-items:stretch;flex-direction:column}.secondary{width:100%}.safeguards ul{grid-template-columns:1fr}}@media(max-width:440px){.readouts{grid-template-columns:1fr}main{width:min(100% - 18px,960px)}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}.secondary:active{transform:none}}