/* Data-dense operations console. Tokens: navy + one blue accent; light/dark; system fonts (CSP: self only). */
:root{
  --bg:#f6f8fb;--surface:#fff;--surface-2:#eef2f7;--line:#dfe5ee;--fg:#0b1220;--fg-2:#46536a;--fg-3:#66728a;
  --accent:#0369a1;--accent-fg:#fff;--accent-soft:#e0f0f9;
  --ok:#15803d;--ok-soft:#e2f4e8;--warn:#a15c07;--warn-soft:#fdf0d9;--crit:#c0262d;--crit-soft:#fbe4e5;--info-soft:#e9edf4;
  --sans:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--mono:ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  --r:8px;color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  --bg:#0a0f1a;--surface:#121927;--surface-2:#1a2335;--line:#263149;--fg:#e8edf6;--fg-2:#aab5c8;--fg-3:#8c99b0;
  --accent:#4fb0e6;--accent-fg:#04131d;--accent-soft:#12293a;
  --ok:#5ccf86;--ok-soft:#12301f;--warn:#f0b254;--warn-soft:#3a2a0e;--crit:#ff7b80;--crit-soft:#3d1618;--info-soft:#1c2740;color-scheme:dark}}
*{box-sizing:border-box}
html,body,#app{height:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:14px/1.45 var(--sans);-webkit-font-smoothing:antialiased}
button,select,input,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
svg.i{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mono{font-family:var(--mono);font-size:12.5px}.muted{color:var(--fg-3)}
.sr{position:absolute;left:-9999px}

/* shell */
.app{display:grid;grid-template-columns:212px minmax(0,1fr);height:100%;min-height:0}
.rail{background:var(--surface);border-right:1px solid var(--line);display:flex;flex-direction:column;gap:4px;padding:14px 10px;overflow:auto}
.brand{display:flex;align-items:center;gap:8px;padding:2px 8px 12px;font-weight:700;letter-spacing:-.01em}
.brand i{width:22px;height:22px;border-radius:6px;background:var(--accent);display:grid;place-items:center;color:var(--accent-fg)}
.rail label.sel{display:block;padding:0 8px 8px;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--fg-3)}
.rail select{width:100%;margin-top:4px;background:var(--surface-2);border:1px solid var(--line);border-radius:6px;padding:7px 8px;font-size:13px;text-transform:none;letter-spacing:0}
.nav a{display:flex;align-items:center;gap:9px;padding:8px;border-radius:6px;color:var(--fg-2);text-decoration:none;font-weight:500;min-height:36px}
.nav a:hover{background:var(--surface-2);color:var(--fg)}
.nav a[aria-current=page]{background:var(--accent-soft);color:var(--accent)}
.nav .n{margin-left:auto;font:500 11px var(--mono);background:var(--surface-2);color:var(--fg-2);border-radius:10px;padding:1px 7px}
.nav .n.hot{background:var(--crit-soft);color:var(--crit)}
.rail .foot{margin-top:auto;padding:10px 8px 0;font-size:12px;color:var(--fg-3);border-top:1px solid var(--line);display:grid;gap:6px}
.rail .foot button{justify-self:start}
main{display:flex;flex-direction:column;min-width:0;min-height:0}
.top{display:flex;align-items:center;gap:12px;padding:12px 20px;border-bottom:1px solid var(--line);background:var(--surface);flex-wrap:wrap}
.top h1{font-size:16px;margin:0;letter-spacing:-.01em}.top .sub{color:var(--fg-3);font-size:13px}
.top .sp{margin-left:auto;display:flex;gap:8px;align-items:center}
.ro{font-size:12px;color:var(--fg-2);background:var(--info-soft);padding:3px 8px;border-radius:5px}
.view{flex:1;min-height:0;overflow:auto;padding:16px 20px}

/* parts */
.btn{border:1px solid var(--line);background:var(--surface);border-radius:6px;padding:6px 12px;font-weight:500;display:inline-flex;gap:6px;align-items:center;min-height:32px;transition:background .15s}
.btn:hover{background:var(--surface-2)}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}.btn.sm{padding:3px 8px;font-size:12px;min-height:26px}
.pill{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;padding:1px 8px;border-radius:10px;white-space:nowrap}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.p-ok{background:var(--ok-soft);color:var(--ok)}.p-warn{background:var(--warn-soft);color:var(--warn)}.p-crit{background:var(--crit-soft);color:var(--crit)}
.p-info{background:var(--info-soft);color:var(--fg-2)}.p-acc{background:var(--accent-soft);color:var(--accent)}
.split{display:grid;grid-template-columns:minmax(280px,380px) minmax(0,1fr);gap:16px;height:100%;min-height:0}
.list{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:auto;min-height:0}
.list .row{display:block;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--line);padding:10px 12px;border-left:3px solid transparent}
.list .row:hover{background:var(--surface-2)}.list .row[aria-selected=true]{background:var(--accent-soft);border-left-color:var(--accent)}
.row .l1{display:flex;gap:8px;align-items:center;margin-bottom:3px;min-width:0}.row .l1 b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row .l2{color:var(--fg-2);font-size:13px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.row .t{margin-left:auto;font:12px var(--mono);color:var(--fg-3);white-space:nowrap}
.detail{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:auto;min-height:0;display:flex;flex-direction:column}
.detail>section{padding:14px 16px;border-bottom:1px solid var(--line)}.detail>section:last-child{border-bottom:0}
.detail h2{font-size:15px;margin:0 0 4px}
h3.h{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--fg-3);margin:0 0 8px;font-weight:600}
.kv{display:grid;grid-template-columns:max-content 1fr;gap:4px 14px;margin:0}.kv dt{color:var(--fg-3)}.kv dd{margin:0;min-width:0;overflow-wrap:anywhere}
.quote{border-left:3px solid var(--line);padding:2px 0 2px 12px;max-width:72ch;white-space:pre-wrap;overflow-wrap:anywhere}
.suggest{background:var(--surface-2);border:1px solid var(--line);border-radius:6px;padding:9px 10px;max-width:72ch;white-space:pre-wrap}
.opts{margin:0;padding-left:18px}
.notice{background:var(--info-soft);color:var(--fg-2);border-radius:6px;padding:8px 10px;font-size:13px}
.empty{display:grid;place-items:center;height:100%;min-height:120px;color:var(--fg-3);padding:32px;text-align:center}
.toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.toolbar input,.toolbar select{background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:6px 10px;min-height:32px}

/* table */
.tablewrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
table{border-collapse:collapse;width:100%;min-width:780px}
th{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--fg-3);text-align:left;padding:8px 12px;border-bottom:1px solid var(--line);background:var(--surface-2);font-weight:600;white-space:nowrap;position:sticky;top:0}
td{padding:7px 12px;border-bottom:1px solid var(--line);vertical-align:top}tr:last-child td{border-bottom:0}
tbody tr:hover td{background:color-mix(in srgb,var(--accent-soft) 55%,transparent)}
tr.day td{background:var(--surface-2);font-weight:600;color:var(--fg-2);font-size:12px;padding:5px 12px}
td.txt{max-width:360px;color:var(--fg-2);overflow-wrap:anywhere}
a.lnk{color:var(--accent);text-decoration:none;font-weight:600}a.lnk:hover{text-decoration:underline}

/* caps + accounts */
.bar{height:6px;background:var(--surface-2);border-radius:3px;overflow:hidden;min-width:70px}.bar i{display:block;height:100%;background:var(--accent)}.bar.full i{background:var(--warn)}
.caps{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin-bottom:16px}
.cap{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;display:grid;gap:6px}
.cap b{display:flex;justify-content:space-between;gap:8px;align-items:center}
.cap .line{display:grid;grid-template-columns:64px 1fr auto;gap:8px;align-items:center;font-size:12.5px;color:var(--fg-2)}
.acc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:14px}
.acc{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px;display:grid;gap:10px;align-content:start}
.acc.bad{border-color:color-mix(in srgb,var(--crit) 55%,var(--line))}
.acc header{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.acc .nm{font-weight:700;font-size:15px}
.note{font-size:13px;padding:8px 10px;border-radius:6px}.note.crit{background:var(--crit-soft);color:var(--crit)}.note.warn{background:var(--warn-soft);color:var(--warn)}

/* chat */
.dlg{display:grid;grid-template-columns:minmax(0,1fr) 300px;min-height:0;height:100%}
.dlg>.side{overflow:auto;border-left:1px solid var(--line)}.dlg>.side>section{padding:12px 14px;border-bottom:1px solid var(--line)}
.chat{display:flex;flex-direction:column;gap:10px;padding:14px 16px;overflow:auto;min-width:0;min-height:0;flex:1}
.msg{width:fit-content;max-width:min(560px,88%);padding:9px 12px;border-radius:10px;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.5}
.msg.in{background:var(--surface-2);align-self:flex-start;border-bottom-left-radius:3px}
.msg.out{background:var(--accent-soft);align-self:flex-end;border-bottom-right-radius:3px}
.msg small{display:block;font:11px var(--mono);color:var(--fg-3);margin-top:3px}
.prof .big{font:700 18px var(--mono)}.prof .why{color:var(--fg-2);font-size:12.5px;margin:4px 0 8px}

/* login */
.login{min-height:100%;display:grid;place-items:center;padding:24px}
.login form{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:24px;width:min(380px,100%);display:grid;gap:14px}
.login h1{font-size:18px;margin:0}.login label{display:grid;gap:4px;font-size:13px;color:var(--fg-2)}
.login input{background:var(--surface-2);border:1px solid var(--line);border-radius:6px;padding:9px 10px;min-height:40px}
.err{color:var(--crit);font-size:13px;min-height:18px}
.toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:var(--fg);color:var(--bg);padding:9px 14px;border-radius:8px;font-weight:500;z-index:30;max-width:90vw}

@media (max-width:860px){
  .app{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}
  .rail{flex-direction:row;flex-wrap:wrap;align-items:center;border-right:0;border-bottom:1px solid var(--line);padding:8px 12px}
  .rail label.sel{flex:1 1 130px;padding:0}.rail .foot{display:none}.nav{display:flex;flex-wrap:wrap;gap:2px;width:100%}
  .view,.top{padding-left:14px;padding-right:14px}
  .split{grid-template-columns:minmax(0,1fr);height:auto}.list{max-height:280px}.detail{overflow:visible}
  .dlg{grid-template-columns:minmax(0,1fr);height:auto}.dlg>.side{border-left:0;border-top:1px solid var(--line)}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

.nav .n:empty{display:none}
.toolbar label.chk{display:inline-flex;gap:6px;align-items:center;color:var(--fg-2);min-height:32px}
.clamp{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
