/* ============================================================
   Alphaware CBS Management Dashboard
   Palette derived from the Alphaware mark: #345997 / #EBA43C
   ============================================================ */

:root{
  --ink:#0E1A2B;
  --ink-2:#1D2E47;
  --brand:#345997;
  --brand-lt:#4E77BC;
  --brand-wash:#EDF2FA;
  --amber:#EBA43C;
  --amber-wash:#FDF3E2;
  --paper:#EEF1F6;
  --card:#FFFFFF;
  --line:#DCE3ED;
  --line-2:#EDF1F6;
  --muted:#63748C;
  --muted-2:#8B99AC;
  --alert:#B3352C;
  --alert-wash:#FBEDEC;
  --good:#1B7F55;
  --good-wash:#E8F4EE;
  --rail:248px;

  --f-display:"Archivo","Helvetica Neue",Helvetica,Arial,sans-serif;
  --f-body:"IBM Plex Sans","Segoe UI",system-ui,-apple-system,sans-serif;
  --f-mono:"IBM Plex Mono","SFMono-Regular",Consolas,monospace;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--f-body);font-size:14px;line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--amber);outline-offset:2px;border-radius:3px}

/* ---------------- Ledger rail (sidebar) ---------------- */
.rail{
  position:fixed;inset:0 auto 0 0;width:var(--rail);
  background:var(--ink);color:#fff;display:flex;flex-direction:column;z-index:60;
}
.rail-brand{padding:20px 18px 16px;border-bottom:1px solid rgba(255,255,255,.10)}
.rail-brand img{width:150px;display:block;
  background:#fff;padding:7px 9px;border-radius:5px}
.rail-brand .sys{
  display:block;margin-top:11px;font-family:var(--f-mono);font-size:9.5px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--amber);
}
.rail-brand .sys em{color:rgba(255,255,255,.45);font-style:normal}

.rail-scroll{flex:1;overflow-y:auto;padding:10px 0 16px}
.rail-group{
  font-family:var(--f-mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  color:rgba(255,255,255,.34);padding:14px 18px 6px;
}
.rail a.nav{
  display:flex;align-items:baseline;gap:10px;padding:8px 18px;
  color:rgba(255,255,255,.72);border-left:3px solid transparent;font-size:13.5px;
}
.rail a.nav .idx{font-family:var(--f-mono);font-size:10.5px;color:rgba(255,255,255,.32)}
.rail a.nav:hover{background:rgba(255,255,255,.05);color:#fff;text-decoration:none}
.rail a.nav.on{background:rgba(235,164,60,.13);border-left-color:var(--amber);color:#fff;font-weight:500}
.rail a.nav.on .idx{color:var(--amber)}
.rail-foot{
  padding:12px 18px;border-top:1px solid rgba(255,255,255,.10);
  font-family:var(--f-mono);font-size:9.5px;line-height:1.7;color:rgba(255,255,255,.42);
}

/* ---------------- Shell ---------------- */
.shell{margin-left:var(--rail);min-height:100vh}
.topbar{
  position:sticky;top:0;z-index:40;background:rgba(255,255,255,.94);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line);
  padding:11px 30px;display:flex;align-items:center;gap:16px;flex-wrap:wrap;
}
.topbar .crumb{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.topbar .crumb b{color:var(--ink);font-weight:600}
.topbar .spacer{flex:1}
.chip{
  font-family:var(--f-mono);font-size:10.5px;padding:4px 9px;border-radius:100px;
  border:1px solid var(--line);color:var(--muted);background:#fff;white-space:nowrap;
}
.chip.amber{border-color:#F0D2A0;background:var(--amber-wash);color:#8A5D12}
.wrap{padding:26px 30px 64px;max-width:1500px}

/* ---------------- Page head ---------------- */
.phead{margin-bottom:22px}
.phead .eyebrow{
  font-family:var(--f-mono);font-size:10.5px;letter-spacing:.17em;text-transform:uppercase;
  color:var(--brand);margin-bottom:7px;
}
.phead h1{
  font-family:var(--f-display);font-size:31px;line-height:1.12;font-weight:700;
  letter-spacing:-.022em;margin:0 0 8px;
}
.phead p{margin:0;color:var(--muted);max-width:74ch;font-size:14px}

/* Signal strip — the one fact that matters on each page */
.signal{
  display:flex;align-items:stretch;gap:0;background:var(--ink);color:#fff;
  border-radius:9px;overflow:hidden;margin:18px 0 24px;
}
.signal .lede{
  flex:1;padding:17px 22px;display:flex;flex-direction:column;justify-content:center;
}
.signal .lede .lbl{
  font-family:var(--f-mono);font-size:9.5px;letter-spacing:.17em;text-transform:uppercase;
  color:var(--amber);margin-bottom:5px;
}
.signal .lede .txt{font-size:15px;line-height:1.45;color:rgba(255,255,255,.9)}
.signal .lede .txt b{color:#fff;font-weight:600}
.signal .fig{
  padding:17px 24px;background:rgba(235,164,60,.14);border-left:1px solid rgba(255,255,255,.12);
  display:flex;flex-direction:column;justify-content:center;min-width:170px;
}
.signal .fig .v{font-family:var(--f-mono);font-size:27px;font-weight:600;letter-spacing:-.02em;color:var(--amber)}
.signal .fig .k{font-family:var(--f-mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-top:3px}

/* ---------------- Cards & grid ---------------- */
.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g5{grid-template-columns:repeat(5,minmax(0,1fr))}
.g23{grid-template-columns:minmax(0,2fr) minmax(0,3fr)}
.g32{grid-template-columns:minmax(0,3fr) minmax(0,2fr)}
.mb{margin-bottom:16px}
.mb-l{margin-bottom:26px}

.card{background:var(--card);border:1px solid var(--line);border-radius:9px;overflow:hidden}
.card-h{
  padding:13px 17px;border-bottom:1px solid var(--line-2);
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.card-h h3{
  margin:0;font-family:var(--f-display);font-size:14px;font-weight:600;letter-spacing:-.006em;
}
.card-h .sub{font-size:12px;color:var(--muted-2);margin-left:auto;font-family:var(--f-mono);font-size:10.5px}
.card-b{padding:17px}
.card-b.tight{padding:11px 17px 15px}
.card-note{
  padding:10px 17px;background:var(--brand-wash);border-top:1px solid var(--line-2);
  font-size:12.5px;color:var(--ink-2);
}
.card-note b{color:var(--brand)}

/* ---------------- KPI ---------------- */
.kpi{background:var(--card);border:1px solid var(--line);border-radius:9px;padding:15px 16px;position:relative}
.kpi .k{
  font-family:var(--f-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);margin-bottom:9px;
}
.kpi .v{font-family:var(--f-mono);font-size:25px;font-weight:600;letter-spacing:-.025em;line-height:1.05}
.kpi .v small{font-size:14px;font-weight:400;color:var(--muted);letter-spacing:0}
.kpi .d{font-size:12px;color:var(--muted);margin-top:7px}
.kpi .bar{height:3px;background:var(--line-2);border-radius:2px;margin-top:11px;overflow:hidden}
.kpi .bar i{display:block;height:100%;background:var(--brand);border-radius:2px}
.kpi.neg .v{color:var(--alert)}
.kpi.neg .bar i{background:var(--alert)}
.kpi.pos .v{color:var(--good)}
.kpi.pos .bar i{background:var(--good)}
.kpi.hero{background:var(--ink);border-color:var(--ink)}
.kpi.hero .k{color:var(--amber)}
.kpi.hero .v{color:#fff}
.kpi.hero .d{color:rgba(255,255,255,.6)}

/* ---------------- Tables ---------------- */
.tbl-tools{display:flex;gap:8px;align-items:center;padding:11px 17px;border-bottom:1px solid var(--line-2);flex-wrap:wrap}
.tbl-tools input,.tbl-tools select{
  font-family:var(--f-body);font-size:13px;padding:6px 10px;border:1px solid var(--line);
  border-radius:6px;background:#fff;color:var(--ink);
}
.tbl-tools input{min-width:210px}
.tbl-tools .count{margin-left:auto;font-family:var(--f-mono);font-size:10.5px;color:var(--muted)}
.btn{
  font-family:var(--f-mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;
  padding:6px 11px;border:1px solid var(--line);border-radius:6px;background:#fff;
  color:var(--ink-2);cursor:pointer;
}
.btn:hover{border-color:var(--brand);color:var(--brand)}
.tscroll{overflow:auto;max-height:520px}
table.dt{width:100%;border-collapse:collapse;font-size:12.8px}
table.dt th{
  position:sticky;top:0;background:#F7F9FC;text-align:left;padding:9px 12px;
  font-family:var(--f-mono);font-size:9.8px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--muted);border-bottom:1px solid var(--line);cursor:pointer;white-space:nowrap;z-index:2;
}
table.dt th:hover{color:var(--brand)}
table.dt th.srt::after{content:" ▲";color:var(--amber);font-size:8px}
table.dt th.srt.desc::after{content:" ▼"}
table.dt td{padding:8px 12px;border-bottom:1px solid var(--line-2);vertical-align:top}
table.dt tbody tr:hover{background:#F9FBFD}
table.dt td.n{font-family:var(--f-mono);text-align:right;white-space:nowrap}
table.dt td.mono{font-family:var(--f-mono);font-size:11.5px}
table.dt td.wrap{max-width:400px;white-space:normal;word-break:break-word;font-size:11.5px;color:var(--muted)}
.empty{padding:26px;text-align:center;color:var(--muted-2);font-size:13px}

/* Compact static table */
table.mini{width:100%;border-collapse:collapse;font-size:13px}
table.mini th{
  text-align:left;padding:7px 0;font-family:var(--f-mono);font-size:9.8px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--line);
}
table.mini td{padding:8px 0;border-bottom:1px solid var(--line-2)}
table.mini td.n{font-family:var(--f-mono);text-align:right;white-space:nowrap}
table.mini tr:last-child td{border-bottom:none}
table.mini tr.total td{border-top:2px solid var(--ink);border-bottom:none;font-weight:600;padding-top:10px}
table.mini tr.total td.n{color:var(--ink)}

/* ---------------- Tags ---------------- */
.tag{
  display:inline-block;font-family:var(--f-mono);font-size:10px;letter-spacing:.05em;
  padding:2px 7px;border-radius:4px;background:var(--brand-wash);color:var(--brand);white-space:nowrap;
}
.tag.red{background:var(--alert-wash);color:var(--alert)}
.tag.green{background:var(--good-wash);color:var(--good)}
.tag.amber{background:var(--amber-wash);color:#8A5D12}
.tag.grey{background:#F0F3F7;color:var(--muted)}

/* ---------------- Flag list (exceptions) ---------------- */
.flags{display:flex;flex-direction:column}
.flag{display:flex;gap:13px;padding:13px 17px;border-bottom:1px solid var(--line-2);align-items:flex-start}
.flag:last-child{border-bottom:none}
.flag .sev{
  flex:none;width:4px;align-self:stretch;border-radius:2px;background:var(--muted-2);min-height:34px;
}
.flag.high .sev{background:var(--alert)}
.flag.med .sev{background:var(--amber)}
.flag.low .sev{background:var(--brand-lt)}
.flag .body{flex:1}
.flag .ttl{font-weight:600;font-size:13.5px;margin-bottom:3px}
.flag .desc{font-size:12.5px;color:var(--muted);line-height:1.5}
.flag .metric{font-family:var(--f-mono);font-size:15px;font-weight:600;flex:none;text-align:right;min-width:96px}
.flag.high .metric{color:var(--alert)}
.flag.med .metric{color:#B07615}

/* ---------------- Nav cards on index ---------------- */
.navcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.navcard{
  display:block;background:var(--card);border:1px solid var(--line);border-radius:9px;
  padding:16px;color:inherit;transition:border-color .14s,transform .14s;
}
.navcard:hover{border-color:var(--brand);text-decoration:none;transform:translateY(-2px)}
.navcard .idx{font-family:var(--f-mono);font-size:10px;color:var(--amber);letter-spacing:.12em}
.navcard h4{font-family:var(--f-display);font-size:15px;margin:6px 0 5px;font-weight:600}
.navcard p{margin:0;font-size:12.5px;color:var(--muted);line-height:1.5}
.navcard .foot{
  margin-top:11px;padding-top:9px;border-top:1px solid var(--line-2);
  font-family:var(--f-mono);font-size:10.5px;color:var(--ink-2);
}

/* ---------------- Misc ---------------- */
.legend{display:flex;gap:14px;flex-wrap:wrap;margin-top:11px;font-size:12px;color:var(--muted)}
.legend span{display:flex;align-items:center;gap:6px}
.legend i{width:9px;height:9px;border-radius:2px;display:block}
.split{display:flex;gap:18px;flex-wrap:wrap}
.stat-inline{font-family:var(--f-mono);font-size:19px;font-weight:600}
.stat-inline small{display:block;font-family:var(--f-body);font-size:11.5px;font-weight:400;color:var(--muted);letter-spacing:0}
.hr{height:1px;background:var(--line);margin:22px 0}
.src{font-family:var(--f-mono);font-size:10.5px;color:var(--muted-2);margin-top:9px}
svg{display:block;max-width:100%}
.mono{font-family:var(--f-mono)}

/* ---------------- Responsive ---------------- */
@media (max-width:1180px){
  .g5,.g4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .g3,.navcards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .g23,.g32{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:900px){
  :root{--rail:0px}
  .rail{position:static;width:100%;flex-direction:column}
  .rail-scroll{display:none}
  .rail.open .rail-scroll{display:block}
  .rail-foot{display:none}
  .shell{margin-left:0}
  .menu-btn{display:inline-block !important}
  .wrap{padding:18px 15px 50px}
  .topbar{padding:10px 15px}
  .signal{flex-direction:column}
  .signal .fig{border-left:none;border-top:1px solid rgba(255,255,255,.12)}
  .g2,.g3,.g4,.g5,.navcards{grid-template-columns:minmax(0,1fr)}
  .phead h1{font-size:24px}
}
.menu-btn{display:none;font-family:var(--f-mono);font-size:11px;padding:5px 10px;
  border:1px solid var(--line);border-radius:6px;background:#fff;cursor:pointer}

@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important}
}
@media print{
  .rail,.topbar,.tbl-tools{display:none}
  .shell{margin-left:0}
  .card{break-inside:avoid}
}