:root{--bg:#f6f7f9;--panel:#fff;--line:#e3e6ea;--ink:#172033;--mute:#5b6675;--brand:#0f766e;--ok:#15803d;--warn:#b45309;--bad:#b91c1c;--info:#1d4ed8;--rail:244px}
*{box-sizing:border-box}body{margin:0;font:14px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--ink)}
a{color:var(--info);text-decoration:none}a:hover{text-decoration:underline}
.shell{display:grid;grid-template-columns:var(--rail) 1fr;min-height:100vh}
nav.rail{background:#0f172a;color:#cbd5e1;padding:18px 14px;position:sticky;top:0;height:100vh;overflow:auto}
nav.rail .brand{color:#fff;font-weight:700;font-size:16px;display:flex;gap:10px;align-items:center;margin-bottom:18px}
nav.rail .brand small{display:block;font-weight:400;color:#94a3b8;font-size:11px}
nav.rail h6{margin:16px 8px 6px;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#64748b}
nav.rail a{display:block;padding:8px 10px;border-radius:8px;color:#cbd5e1}nav.rail a:hover,nav.rail a.on{background:#1e293b;color:#fff;text-decoration:none}
nav.rail .me{margin-top:24px;padding:10px;border-top:1px solid #1e293b;font-size:12px;color:#94a3b8}
main{padding:22px 28px;max-width:1380px}
h1{font-size:22px;margin:0 0 4px}h2{font-size:16px;margin:22px 0 10px}.sub{color:var(--mute);margin:0 0 16px}
.grid{display:grid;gap:14px}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}.g2{grid-template-columns:repeat(2,1fr)}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.kpi .v{font-size:26px;font-weight:700}.kpi .l{color:var(--mute);font-size:12px}
table{width:100%;border-collapse:collapse;background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden}
th,td{padding:9px 12px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}th{background:#f1f3f6;font-size:12px;color:var(--mute);text-transform:uppercase;letter-spacing:.04em}
tr:last-child td{border-bottom:0}td.num{text-align:right;font-variant-numeric:tabular-nums}
.pill{display:inline-block;padding:2px 9px;border-radius:999px;font-size:12px;font-weight:600;border:1px solid transparent}
.pill.ok{background:#dcfce7;color:var(--ok)}.pill.warn{background:#fef3c7;color:var(--warn)}.pill.bad{background:#fee2e2;color:var(--bad)}.pill.info{background:#dbeafe;color:var(--info)}.pill.mute{background:#eef0f3;color:var(--mute)}
.btn{display:inline-block;padding:7px 13px;border-radius:8px;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer;font:inherit}
.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}.btn.danger{background:var(--bad);border-color:var(--bad);color:#fff}.btn:hover{filter:brightness(.97);text-decoration:none}
form.inline{display:flex;gap:8px;flex-wrap:wrap;align-items:end}label{display:block;font-size:12px;color:var(--mute)}
input,select,textarea{font:inherit;padding:7px 9px;border:1px solid var(--line);border-radius:8px;background:#fff;min-width:160px}
.flash{padding:10px 14px;border-radius:10px;margin-bottom:14px;background:#dbeafe;color:#1e3a8a}.flash.bad{background:#fee2e2;color:#7f1d1d}.flash.ok{background:#dcfce7;color:#14532d}
.login{max-width:380px;margin:12vh auto}.login .card{padding:26px}.login input{width:100%}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}
.steps li{margin:6px 0}.log{background:#0f172a;color:#e2e8f0;padding:12px;border-radius:10px;font-family:ui-monospace,monospace;font-size:12px;white-space:pre-wrap}
.muted{color:var(--mute)}.right{text-align:right}.topbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}
@media (max-width:900px){.shell{grid-template-columns:1fr}nav.rail{position:static;height:auto}.g3,.g4,.g2{grid-template-columns:1fr}main{padding:14px}}

nav.rail h6.tog{cursor:pointer;user-select:none;display:flex;align-items:center;gap:6px}nav.rail h6.tog:hover{color:#cbd5e1}
nav.rail h6.tog .chev{margin-left:auto;transition:transform .15s}nav.rail h6.tog.closed .chev{transform:rotate(-90deg)}
nav.rail .fold.closed{display:none}nav.rail .fold{max-height:46vh;overflow:auto;border-left:1px solid #1e293b;margin-left:6px;padding-left:4px}
nav.rail .cnt{font-size:10px;background:#1e293b;color:#94a3b8;border-radius:999px;padding:1px 6px;margin-left:4px}nav.rail a.dim{color:#7c8798}nav.rail a.has{color:#e2e8f0}
nav.rail .dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:7px;background:#64748b}nav.rail .dot.ok{background:#22c55e}nav.rail .dot.bad{background:#ef4444}

.tabs{display:flex;gap:4px;margin:14px 0 0;border-bottom:1px solid var(--line);padding:0 6px}
.tabs .tab{padding:9px 16px;border:1px solid var(--line);border-bottom:0;border-radius:10px 10px 0 0;background:#eef0f3;color:var(--mute);font-weight:600;margin-bottom:-1px;position:relative;top:1px}
.tabs .tab:hover{background:#f6f7f9;text-decoration:none}.tabs .tab.on{background:#fff;color:var(--ink);border-bottom:1px solid #fff}
.tabs .cnt{font-size:11px;background:#e3e6ea;color:var(--mute);border-radius:999px;padding:1px 7px;margin-left:4px}.tabs .tab.on .cnt{background:var(--brand);color:#fff}
.pane{display:none;background:#fff;border:1px solid var(--line);border-top:0;border-radius:0 0 12px 12px;padding:6px 16px 16px}.pane.on{display:block}.pane h2:first-child{margin-top:12px}
.pane table{border-radius:8px}
@media (max-width:900px){.tabs{overflow-x:auto}.tabs .tab{white-space:nowrap;padding:8px 10px}}

nav.rail .subh{font-size:10px;color:#64748b;margin:6px 10px 2px;text-transform:uppercase;letter-spacing:.08em}
