html,body,#root{min-height:100%}:root{--bg:#0f1419;--bg-2:#171e26;--panel:#1c2530;--line:#2c3a4a;--text:#e8eef4;--muted:#8fa0b3;--accent:#e6a23c;--ok:#3ecf8e;--danger:#e35d6a;--font:"IBM Plex Sans", "Segoe UI", sans-serif;--mono:"IBM Plex Mono", ui-monospace, monospace}*{box-sizing:border-box}body{min-height:100vh;font-family:var(--font);color:var(--text);background:radial-gradient(ellipse 80% 50% at 10% -10%, #243246 0%, transparent 55%), radial-gradient(ellipse 60% 40% at 100% 0%, #2a2218 0%, transparent 45%), var(--bg);margin:0}.page{max-width:1120px;margin:0 auto;padding:32px 20px 64px}.hero{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:20px;display:flex}.eyebrow{text-transform:uppercase;letter-spacing:.12em;color:var(--accent);margin:0 0 6px;font-size:12px}h1{letter-spacing:-.02em;margin:0;font-size:clamp(2rem,4vw,2.8rem);font-weight:600}.lede{max-width:42rem;color:var(--muted);margin:10px 0 0;line-height:1.5}.stats{grid-template-columns:repeat(4,minmax(72px,1fr));gap:10px;display:grid}.stat{background:var(--panel);border:1px solid var(--line);border-radius:10px;min-width:88px;padding:10px 12px}.stat span{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-size:11px;display:block}.stat strong{font-size:1.25rem}.stat.ok strong{color:var(--ok)}.banner{color:#f0d9a8;background:#241c12;border:1px solid #4a3a22;border-radius:10px;margin:0 0 16px;padding:12px 14px;font-size:14px;line-height:1.45}.error{color:var(--danger);margin:0 0 12px}.grid{grid-template-columns:340px 1fr;gap:16px;display:grid}.panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px}.panel.wide{grid-column:1/-1}.panel-head{justify-content:space-between;align-items:center;gap:12px;display:flex}h2{margin:0 0 14px;font-size:1.05rem;font-weight:600}.panel-head h2{margin:0}.form{flex-direction:column;gap:12px;display:flex}label{color:var(--muted);flex-direction:column;gap:6px;font-size:12px;display:flex}input,select,textarea,button{font:inherit}input,select,textarea{border:1px solid var(--line);background:var(--bg-2);width:100%;color:var(--text);border-radius:8px;padding:9px 10px}.row{grid-template-columns:1fr 1fr;gap:10px;display:grid}.actions{gap:8px;margin-top:4px;display:flex}button{background:var(--accent);color:#1a1208;cursor:pointer;border:0;border-radius:8px;padding:9px 14px;font-weight:600}button:disabled{opacity:.5;cursor:not-allowed}button.ghost{color:var(--text);border:1px solid var(--line);background:0 0}button.danger{color:var(--danger);background:0 0;border:1px solid #5a3038}.muted{color:var(--muted)}.devices{flex-direction:column;gap:10px;margin:14px 0 0;padding:0;list-style:none;display:flex}.devices li{border:1px solid var(--line);background:var(--bg-2);border-radius:10px;grid-template-columns:1.2fr 1.4fr auto;align-items:center;gap:12px;padding:12px;display:grid}.devices li.online{border-color:#2f5a45}.dev-main{align-items:center;gap:10px;display:flex}.dev-main strong{display:block}.dev-main code{font-family:var(--mono);color:var(--muted);font-size:12px}.dot{background:#556273;border-radius:50%;width:10px;height:10px}.dot.on{background:var(--ok);box-shadow:0 0 0 4px #3ecf8e26}.dev-meta{color:var(--muted);flex-wrap:wrap;gap:8px 14px;font-size:12px;display:flex}.dev-actions{justify-content:flex-end;gap:6px;display:flex}table{border-collapse:collapse;width:100%;margin-top:10px;font-size:13px}th,td{text-align:left;border-bottom:1px solid var(--line);padding:8px 6px}th{color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-size:11px;font-weight:500}code{font-family:var(--mono)}@media (width<=900px){.grid,.devices li{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,1fr);width:100%}}
