*{box-sizing:border-box}
:root{color-scheme:dark;--bg:#101715;--card:#18231f;--line:#31443a;--text:#eef8f1;--muted:#adbfaf;--accent:#92e6a7;--warn:#ffca84}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.45 system-ui,sans-serif}
.top{display:flex;align-items:center;justify-content:space-between;padding:12px max(4vw,18px);border-bottom:1px solid var(--line)}
.brand,.eyebrow{letter-spacing:.14em;font-size:.75rem;font-weight:750}
.brand span,.eyebrow{color:var(--accent)}
.panel{max-width:1440px;margin:auto;padding:28px clamp(14px,4vw,48px) 60px}
.headline,.row{display:flex;align-items:center;justify-content:space-between;gap:16px}
h1{font-size:clamp(1.7rem,4vw,2.75rem);margin:.2em 0 .55em;line-height:1.05}
h2{font-size:1rem;margin:0 0 8px} h3{font-size:.9rem;margin-top:20px}
p{margin:.45em 0}.muted,dt{color:var(--muted);font-size:.87rem}.warning{color:var(--warn)}
.badge{width:max-content;padding:4px 10px;border:1px solid var(--line);border-radius:20px;font-size:.85rem}
.badge[data-state="online"]{color:var(--accent)}.badge[data-state="offline"]{color:var(--warn)}
.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0}
.metrics section,.card,.login{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px}
.metrics h2{color:var(--muted);font-size:.8rem}.metrics strong{display:block;font-size:clamp(1rem,3vw,1.7rem)}.metrics span{font-size:.85rem;color:var(--muted)}
.layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);gap:14px}
#map{height:clamp(310px,53vh,580px);border:1px solid var(--line);border-radius:8px;margin:10px 0;background:#263730;isolation:isolate}
button,input,select{font:inherit;color:inherit;border:1px solid #526d5f;background:#22352c;border-radius:7px;padding:8px 12px}
button{cursor:pointer}button:hover:not(:disabled){border-color:var(--accent)}button:disabled{opacity:.42;cursor:default}
.primary{background:var(--accent);color:#122519;font-weight:700}.quiet{background:transparent}
.actions{display:grid;gap:8px;margin-top:14px;text-align:left}
ol{list-style:none;padding:0;margin:0;font-size:.82rem}li{padding:8px 0;border-top:1px solid var(--line)}
.diagnostics{margin-top:14px}dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:14px;margin:0}dd{margin:4px 0 0}
.login{max-width:410px;margin:12vh auto;padding:28px;width:calc(100% - 32px)}.login label{display:block;margin:12px 0}.login input,.login button{width:100%;display:block;margin-top:4px}
@media(max-width:790px){.layout{grid-template-columns:1fr}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.headline{align-items:flex-start}.row{align-items:flex-start}}
@media(max-width:380px){.headline{display:block}}
.top{padding-top:max(12px,env(safe-area-inset-top));padding-left:max(4vw,18px,env(safe-area-inset-left));padding-right:max(4vw,18px,env(safe-area-inset-right))}
.top-actions,.accounts li{display:flex;gap:12px;align-items:center;justify-content:space-between}
a{color:var(--accent)}
.panel{padding-bottom:max(60px,env(safe-area-inset-bottom))}
.accounts{max-width:760px}.accounts .card+.card{margin-top:14px}.accounts ul{padding:0;list-style:none}
.accounts form{margin-top:8px}.top-actions form,.accounts li form{margin:0}
.guest-credentials{margin-top:12px;padding:10px;border:1px solid var(--line);border-radius:8px;overflow-wrap:anywhere}
@media(max-width:790px){button{min-height:44px}.guest-panel .commands{grid-row:1}#map{height:clamp(260px,48vh,480px)}}