:root{
  --bg:#101113;--panel:#191b1f;--panel2:#202329;--line:#343941;--text:#f2efe8;--muted:#a8abb3;--faint:#777d88;
  --green:#28d17c;--red:#ef506d;--amber:#e0a62b;--button:#e8e0cf;--buttonText:#181818;
}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--text);font-family:Inter,Segoe UI,Arial,sans-serif;letter-spacing:0}
button,input,textarea{font:inherit;letter-spacing:0}
button{border:0;background:var(--button);color:var(--buttonText);padding:9px 12px;border-radius:6px;cursor:pointer;font-weight:700}
button:hover{filter:brightness(1.06)}button:disabled{opacity:.45;cursor:not-allowed}
button.state-on{background:#1d3a2d;color:var(--green);border:1px solid rgba(40,209,124,.45)}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 24px;border-bottom:1px solid var(--line);background:#151619;position:sticky;top:0;z-index:10}
.eyebrow{font-size:12px;color:var(--amber);text-transform:uppercase;font-weight:800}
h1,h2,h3{margin:0}h1{font-size:22px}h2{font-size:15px}
.navlinks{display:flex;gap:8px;flex-wrap:wrap;margin-top:9px}
.navlinks a{color:var(--muted);text-decoration:none;border:1px solid var(--line);border-radius:6px;padding:6px 9px;font-size:12px;background:#111216}
.navlinks a.active,.navlinks a:hover{color:var(--text);border-color:#59616f}
.top-actions{display:flex;align-items:center;gap:10px}
.pill{display:inline-flex;align-items:center;min-height:34px;padding:7px 11px;border:1px solid var(--line);border-radius:6px;color:var(--muted);background:#202127}
.pill.ok{color:var(--green);border-color:rgba(40,209,124,.45)}.pill.warn{color:var(--amber);border-color:rgba(224,166,43,.45)}
.shell{padding:18px 24px 28px}
.status-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:12px}
.metric,.panel{background:var(--panel);border:1px solid var(--line);border-radius:8px}
.metric{padding:13px 14px;min-height:72px}.metric span,.readout span,.timeline span{display:block;color:var(--muted);font-size:12px;margin-bottom:8px}
.metric strong{font-size:16px;line-height:1.25}
.main-grid{display:grid;grid-template-columns:330px minmax(420px,1fr) 310px;gap:12px;align-items:start}
.lower-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);gap:12px;margin-top:12px}
.panel{padding:14px}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:13px}.subtle{color:var(--muted);font-size:12px}
.settings-form{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.settings-form label{display:flex;flex-direction:column;gap:5px;color:var(--muted);font-size:12px}
.settings-form input,.settings-form textarea{width:100%;min-height:34px;border-radius:6px;border:1px solid var(--line);background:#101114;color:var(--text);padding:7px 9px}
.settings-form textarea{min-height:160px;resize:vertical;font-family:"JetBrains Mono",Consolas,monospace;font-size:11px;line-height:1.4}
.settings-form .check{grid-column:1 / -1;flex-direction:row;align-items:center}.settings-form .check input{width:16px;min-height:16px}
.settings-form .wide,.settings-form button{grid-column:1 / -1}
.monitor-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:12px}
.readout{min-height:76px;border:1px solid var(--line);border-radius:6px;background:#111216;padding:12px}.readout strong{font-size:20px}
.timeline{display:grid;gap:10px;margin-bottom:12px}.timeline>div{border:1px solid var(--line);border-radius:6px;background:var(--panel2);padding:12px}
.timeline strong{display:block;margin-bottom:5px}.timeline small{display:block;color:var(--faint);font-size:12px;min-height:16px}
.control-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.kv{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px;font-size:13px}.kv span{color:var(--muted)}.kv strong{text-align:right}
.window-table{display:grid;gap:8px}
.window-row{display:grid;grid-template-columns:minmax(110px,.45fr) minmax(120px,.45fr) minmax(120px,.45fr) minmax(140px,.6fr);gap:12px;align-items:center;border:1px solid var(--line);border-radius:6px;background:#111216;padding:11px 12px}
.window-row strong{display:block;font-size:13px}.window-row span,.window-note{color:var(--muted);font-size:12px}.window-time{font-family:"JetBrains Mono",Consolas,monospace;font-size:12px}
.empty{color:var(--faint);font-size:13px;padding:12px;border:1px solid var(--line);border-radius:6px;background:#111216}
pre{margin:0;white-space:pre-wrap;word-break:break-word;line-height:1.45;color:#d9dce3;font-family:"JetBrains Mono",Consolas,monospace;font-size:12px}
.log-panel pre{height:346px;border:1px solid var(--line);background:#111216;border-radius:6px;padding:10px;overflow:auto}
@media (max-width:1180px){.status-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.main-grid,.lower-grid{grid-template-columns:1fr}}
@media (max-width:720px){.topbar{align-items:flex-start;flex-direction:column}.shell{padding:12px}.status-grid,.settings-form,.monitor-grid,.control-row,.window-row{grid-template-columns:1fr}}
