:root{
  --ink:#170D10; --panel:#241519; --raise:#2E1B20; --line:#3F252C;
  --rose:#7A2638; --pink:#FF7FA8; --cherry:#F24F86;
  --cream:#FFF1D8; --white:#FFF9F5; --mauve:#B79CA6;
  --gold:#FFC86B; --lav:#C8B7FF; --blue:#8FD8FF;
  --ok:var(--blue); --warn:var(--gold); --crit:var(--cherry);
  --mono:'JetBrains Mono',ui-monospace,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  background:var(--ink);color:var(--cream);
  font-family:'Quicksand',sans-serif;font-weight:600;
  font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;padding-bottom:60px;
}
.wrap{max-width:1180px;margin:0 auto;padding:0 18px}

/* ---------- header ---------- */
header.fc{position:sticky;top:0;z-index:20;background:linear-gradient(var(--ink) 78%,transparent);padding:16px 0 10px}
.hrow{display:flex;align-items:center;gap:14px}
.mark{width:42px;height:42px;flex:0 0 42px;background:var(--rose);border-radius:10px;display:grid;place-items:center;padding:7px}
.mark img{width:100%;height:auto;display:block}
.htitle h1{font-family:'Fredoka',sans-serif;font-weight:600;font-size:1.55rem;color:var(--white);line-height:1.1}
.htitle .eyebrow{font-size:.66rem;letter-spacing:.22em;color:var(--mauve);text-transform:uppercase}
.clock{margin-left:auto;text-align:right}
.clock .t{font-family:var(--mono);font-size:1.35rem;font-weight:500;color:var(--white)}
.clock .t .zone{font-size:.7rem;color:var(--mauve);margin-left:5px}
.clock .d{font-size:.72rem;color:var(--mauve);letter-spacing:.06em}
.pulse{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--blue);margin-right:7px;vertical-align:middle;animation:blip 2.4s ease-in-out infinite}
@keyframes blip{0%,100%{opacity:1}50%{opacity:.25}}
.rule{height:1px;background:var(--line);margin:12px 0 0}

/* ---------- health ---------- */
.health{display:flex;align-items:flex-end;gap:26px;flex-wrap:wrap;padding:18px 0 4px}
.hstat{display:flex;align-items:baseline;gap:9px}
.hstat b{font-family:var(--mono);font-size:2.1rem;font-weight:700;line-height:1}
.hstat span{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mauve)}
.hstat.ok b{color:var(--ok)} .hstat.warn b{color:var(--warn)} .hstat.crit b{color:var(--crit)}
.sendstate{margin-left:auto;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;
  border:1px solid var(--line);border-radius:999px;padding:6px 14px;color:var(--mauve)}
.sendstate.live{border-color:var(--blue);color:var(--blue)}
.sendstate.paused{border-color:var(--gold);color:var(--gold)}
.sendstate.degraded{border-color:var(--cherry);color:var(--cherry)}

/* ---------- postage stamp windows ---------- */
.stamps{display:flex;gap:12px;flex-wrap:wrap;padding:20px 0 6px}
.stamp{position:relative;background:var(--raise);border:1px solid var(--line);padding:9px 16px;
  cursor:pointer;color:var(--mauve);font-family:'Quicksand',sans-serif;font-weight:700;
  font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;transition:color .15s,background .15s,border-color .15s}
.stamp::before,.stamp::after{content:"";position:absolute;left:-1px;right:-1px;height:7px;pointer-events:none;
  background:radial-gradient(circle 3.2px at 6px 3.5px,var(--ink) 3.2px,transparent 3.4px) 0 0/12px 7px repeat-x}
.stamp::before{top:-3.5px}
.stamp::after{bottom:-3.5px}
.stamp .n{display:block;font-family:var(--mono);font-size:.62rem;letter-spacing:.06em;color:var(--rose);margin-top:2px}
.stamp:hover{color:var(--cream);border-color:var(--rose)}
.stamp[aria-pressed="true"]{background:var(--cherry);color:var(--white);border-color:var(--cherry)}
.stamp[aria-pressed="true"] .n{color:var(--cream);opacity:.85}
.stamp:focus-visible{outline:2px solid var(--pink);outline-offset:4px}
.aggline{font-family:var(--mono);font-size:.7rem;color:var(--mauve);text-align:right;padding:10px 0 2px}

/* ---------- band frame ---------- */
.band{border-top:1px solid var(--line);padding:22px 0 10px}
.bhead{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.bnum{font-family:var(--mono);font-size:.68rem;color:var(--rose);font-weight:700;letter-spacing:.08em}
.bname{font-family:'Fredoka',sans-serif;font-weight:500;font-size:1.02rem;color:var(--white)}
.bdot{width:8px;height:8px;border-radius:50%;background:var(--mauve);flex:0 0 8px}
.bdot.ok{background:var(--ok)} .bdot.warn{background:var(--warn)} .bdot.crit{background:var(--crit)}
.bfill{flex:1;height:1px;background:var(--line)}
.bnote{font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mauve)}
.subhead{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mauve);margin:20px 0 9px}
.delta{font-family:var(--mono);font-size:.66rem;margin-left:6px;font-weight:500}
.delta.up{color:var(--blue)} .delta.down{color:var(--cherry)} .delta.flat{color:var(--mauve)}

/* ---------- 02 rail guards ---------- */
.guards{display:grid;grid-template-columns:repeat(auto-fill,minmax(184px,1fr));gap:10px}
.guard{background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--mauve);
  border-radius:10px;padding:12px 13px}
.guard.ok{border-left-color:var(--blue)}
.guard.warn{border-left-color:var(--gold);background:rgba(255,200,107,.05)}
.guard.crit{border-left-color:var(--cherry);background:rgba(242,79,134,.09)}
.guard.note{border-left-color:var(--lav)}
.guard .gv{font-family:var(--mono);font-size:1.5rem;font-weight:700;color:var(--white);line-height:1}
.guard.crit .gv{color:var(--cherry)}
.guard.warn .gv{color:var(--gold)}
.guard .gl{font-size:.82rem;color:var(--cream);margin-top:4px}
.guard .gt{font-family:var(--mono);font-size:.62rem;color:var(--rose);margin-top:2px;letter-spacing:.04em}
.guard.crit .gt,.guard.warn .gt{color:var(--mauve)}
.guard .gh{font-size:.68rem;color:var(--mauve);margin-top:6px;line-height:1.45}
.timers{display:flex;gap:9px;flex-wrap:wrap}
.timer{border:1px solid var(--line);border-radius:8px;padding:8px 12px;background:var(--panel);min-width:150px}
.timer.crit{border-color:var(--cherry);background:rgba(242,79,134,.09)}
.timer .tl{display:block;font-size:.76rem;color:var(--cream)}
.timer .tv{display:block;font-family:var(--mono);font-size:.95rem;color:var(--blue);margin-top:2px}
.timer.crit .tv{color:var(--cherry)}
.timer .tw{display:block;font-family:var(--mono);font-size:.62rem;color:var(--mauve);margin-top:1px}

/* ---------- 03 subsystems ---------- */
.sys{border:1px solid var(--line);border-radius:12px;padding:15px 16px;margin-bottom:11px;background:var(--panel)}
.sys.warn{border-color:rgba(255,200,107,.5)}
.sys.crit{border-color:rgba(242,79,134,.55)}
.syshead{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.sysname{font-family:'Fredoka',sans-serif;font-weight:500;font-size:1rem;color:var(--white)}
.syshint{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mauve)}
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:9px 14px}
.mcell{border-left:2px solid var(--line);padding-left:9px}
.mk{display:block;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mauve)}
.mv{display:block;font-family:var(--mono);font-size:1.02rem;color:var(--white);margin-top:1px}
.errline{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:13px;padding-top:11px;border-top:1px solid var(--line);align-items:center}
.ecode{font-family:var(--mono);font-size:.7rem;color:var(--mauve);border:1px solid var(--line);border-radius:5px;padding:1px 6px}
.ecode.hot{color:var(--gold);border-color:var(--gold)}
.elab{font-size:.72rem;color:var(--mauve);margin-left:-12px}
.ev{font-family:var(--mono);font-size:.86rem;color:var(--cream);margin-left:-12px}
.mixline{display:flex;align-items:center;gap:11px;margin-top:12px;flex-wrap:wrap}
.mixline .bar{flex:1;min-width:110px;height:6px;background:var(--lav);border-radius:3px;overflow:hidden}
.mixline .bar i{display:block;height:100%;background:var(--blue)}
.mixline .mv{font-size:.74rem;margin:0}
.nums{margin-top:13px;border-top:1px solid var(--line);padding-top:10px}
.nums summary{cursor:pointer;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mauve);list-style:none}
.nums summary::-webkit-details-marker{display:none}
.nums summary::before{content:"+ ";color:var(--rose);font-family:var(--mono)}
.nums[open] summary::before{content:"- "}
.nums summary:hover{color:var(--cream)}

/* ---------- tables ---------- */
.tscroll{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:.76rem;margin-top:10px}
th{text-align:left;font-family:'Quicksand',sans-serif;font-weight:700;font-size:.64rem;
  letter-spacing:.12em;text-transform:uppercase;color:var(--mauve);
  padding:6px 10px 6px 0;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:7px 10px 7px 0;border-bottom:1px solid rgba(63,37,44,.55);color:var(--cream);white-space:nowrap}
tbody tr:hover td{background:rgba(122,38,56,.14)}
td.bad,.bad{color:var(--cherry)}
tr.rowbad td:first-child{box-shadow:inset 2px 0 0 var(--cherry)}
.kind{display:inline-block;font-family:'Quicksand',sans-serif;font-size:.58rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--rose);margin-left:7px}
.gname{font-family:'Quicksand',sans-serif;font-weight:700;font-size:.86rem;color:var(--white)}
td.sm{color:var(--mauve);font-size:.7rem}

/* affinity bar */
.aff{display:inline-flex;width:88px;height:7px;border-radius:4px;overflow:hidden;vertical-align:middle}
.aff i{display:block;height:100%}
.aff .e,.legend i.e{background:var(--lav)}
.aff .m,.legend i.m{background:var(--blue)}
.aff .d,.legend i.d{background:var(--pink)}

/* sorter / filters */
.sorter{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.sbtn{background:var(--panel);border:1px solid var(--line);color:var(--mauve);
  font-family:'Quicksand',sans-serif;font-weight:700;font-size:.66rem;letter-spacing:.11em;
  text-transform:uppercase;padding:7px 13px;border-radius:7px;cursor:pointer}
.sbtn:hover{color:var(--cream);border-color:var(--rose)}
.sbtn.on{background:var(--rose);color:var(--white);border-color:var(--rose)}
.sbtn:focus-visible{outline:2px solid var(--pink);outline-offset:3px}
.legend{margin-left:auto;font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mauve)}
.legend i{display:inline-block;width:9px;height:9px;border-radius:2px;margin:0 4px 0 12px;vertical-align:middle}

/* ---------- 05 groups ---------- */
.bigstat{border:1px solid var(--line);border-left:3px solid var(--blue);border-radius:10px;
  background:var(--panel);padding:14px 16px;margin:14px 0 4px}
.bigstat.crit{border-left-color:var(--cherry);background:rgba(242,79,134,.09)}
.bigstat .bs-v{font-family:var(--mono);font-size:2rem;font-weight:700;color:var(--white);line-height:1}
.bigstat.crit .bs-v{color:var(--cherry)}
.bigstat .bs-l{font-size:.84rem;color:var(--cream);margin-top:4px}
.bigstat .bs-t{font-size:.68rem;color:var(--mauve);margin-top:5px;line-height:1.5}
.attrbar{display:flex;height:12px;border-radius:6px;overflow:hidden;border:1px solid var(--line)}
.attrbar i{display:block;height:100%}
.attrbar i.ok,.attrkeys i.ok{background:var(--blue)}
.attrbar i.warn,.attrkeys i.warn{background:var(--gold)}
.attrbar i.crit,.attrkeys i.crit{background:var(--cherry)}
.attrkeys{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:9px;font-size:.72rem;color:var(--mauve)}
.attrkeys i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:6px;vertical-align:middle}
.sov{display:flex;flex-direction:column;gap:5px}
.sovrow{display:flex;align-items:center;gap:11px}
.sovn{width:88px;flex:0 0 88px;font-size:.78rem;color:var(--cream)}
.sovb{flex:1;height:9px;background:var(--raise);border-radius:5px;overflow:hidden}
.sovb i{display:block;height:100%;background:var(--lav)}
.sovb i.hot{background:var(--cherry)}
.sovv{width:52px;flex:0 0 52px;text-align:right;font-family:var(--mono);font-size:.74rem;color:var(--mauve)}

/* ---------- 06 funnel ---------- */
.funnel{display:flex;flex-direction:column;gap:13px}
.fstep{border-left:2px solid var(--line);padding-left:12px}
.fmeta{display:flex;align-items:baseline;gap:12px}
.flab{font-size:.82rem;color:var(--cream)}
.fv{margin-left:auto;font-family:var(--mono);font-size:1.15rem;font-weight:700;color:var(--white)}
.fbar{height:10px;background:var(--raise);border-radius:5px;overflow:hidden;margin:6px 0 5px}
.fbar i{display:block;height:100%;background:var(--pink)}
.fbar i.weak{background:var(--gold)}
.ffoot{display:flex;flex-wrap:wrap;gap:4px 16px;font-family:var(--mono);font-size:.68rem;color:var(--mauve)}
.ffoot .ftop{margin-left:auto}
.ffoot .fdrop{color:var(--rose)}

/* ---------- 07 consent ---------- */
.drift{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:11px;margin-bottom:16px}
.dcard{border:1px solid var(--line);border-left:3px solid var(--blue);border-radius:10px;
  background:var(--panel);padding:13px 15px}
.dcard.warn{border-left-color:var(--gold);background:rgba(255,200,107,.05)}
.dcard.crit{border-left-color:var(--cherry);background:rgba(242,79,134,.09)}
.dcard .dv{font-family:var(--mono);font-size:1.7rem;font-weight:700;color:var(--white);line-height:1}
.dcard.warn .dv{color:var(--gold)}
.dcard.crit .dv{color:var(--cherry)}
.dcard .dl{font-size:.82rem;color:var(--cream);margin-top:4px}
.dcard .dh{font-size:.68rem;color:var(--mauve);margin-top:5px;line-height:1.5}

/* ---------- 08 voice ---------- */
.sovb.tgt{position:relative}
.sovb.tgt::after{content:"";position:absolute;top:-2px;bottom:-2px;left:50%;width:1px;background:var(--gold);opacity:.75}
.sovn.wide{width:140px;flex:0 0 140px}

/* ---------- 09 lifecycle ---------- */
.minibar{display:block;height:7px;background:var(--raise);border-radius:4px;overflow:hidden;min-width:60px}
.minibar i{display:block;height:100%;background:var(--pink)}

/* ---------- 10 credits ---------- */
.flow{display:flex;align-items:stretch;gap:11px;flex-wrap:wrap;margin-bottom:16px}
.fw{flex:1;min-width:170px;border:1px solid var(--line);border-radius:10px;background:var(--panel);padding:12px 14px}
.fw.in{border-left:3px solid var(--blue)}
.fw.out{border-left:3px solid var(--pink)}
.fw.net{border-left:3px solid var(--gold)}
.fwk{display:block;font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mauve)}
.fwv{display:block;font-family:var(--mono);font-size:1.6rem;font-weight:700;color:var(--white);line-height:1.1;margin-top:2px}
.fwd{display:block;font-family:var(--mono);font-size:.66rem;color:var(--mauve);margin-top:4px}
.fwarrow{display:flex;align-items:center;color:var(--rose);font-size:1.3rem}
.hist{display:flex;align-items:flex-end;gap:9px;height:140px}
.hbar{flex:1;display:flex;flex-direction:column;align-items:center;height:100%}
.hbar .hv{font-family:var(--mono);font-size:.7rem;color:var(--cream);margin-bottom:4px}
.hbar .hb{flex:1;width:100%;display:flex;align-items:flex-end;background:var(--raise);border-radius:5px;overflow:hidden}
.hbar .hb i{display:block;width:100%;background:var(--lav)}
.hbar .hl{font-family:var(--mono);font-size:.64rem;color:var(--mauve);margin-top:5px}

/* ---------- 13 revenue ---------- */
.mv.up-v{color:var(--blue)}
.sovv.money{width:78px;flex:0 0 78px}
.sovb i.cogs{background:var(--pink)}
.tagc{display:inline-block;font-family:var(--mono);font-style:normal;font-size:.55rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--rose);
  border:1px solid var(--rose);border-radius:4px;padding:0 4px;margin-left:6px}

/* ---------- 14 issue feed ---------- */
.feedhead{display:flex;align-items:baseline;gap:12px;font-family:var(--mono);font-size:.7rem;
  color:var(--mauve);margin-bottom:8px}
.feedhead .fmeta2{margin-left:auto}
.feed{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--panel)}
.frow{display:flex;align-items:baseline;gap:12px;padding:10px 14px;border-bottom:1px solid rgba(63,37,44,.6)}
.frow:last-child{border-bottom:0}
.frow.crit{background:rgba(242,79,134,.08)}
.frow.warn{background:rgba(255,200,107,.05)}
.frow.done{opacity:.5}
.fts{font-family:var(--mono);font-size:.68rem;color:var(--mauve);flex:0 0 76px}
.ftag{font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;border:1px solid var(--line);
  border-radius:5px;padding:1px 7px;color:var(--mauve);flex:0 0 auto}
.ftag.crit{color:var(--cherry);border-color:var(--cherry)}
.ftag.warn{color:var(--gold);border-color:var(--gold)}
.ftag.info{color:var(--lav);border-color:var(--lav)}
.ftag.done{color:var(--mauve);border-color:var(--line)}
.ftx{font-size:.8rem;color:var(--cream)}
.frow.done .ftx{color:var(--mauve)}

/* ---------- 15 message tail ---------- */
.dir{font-family:var(--mono);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;
  border-radius:4px;padding:1px 6px}
.dir.out{color:var(--pink);border:1px solid var(--pink)}
.dir.in{color:var(--blue);border:1px solid var(--blue)}
td.msg{white-space:normal;min-width:290px;color:var(--mauve);font-size:.72rem}

/* ---------- footer ---------- */
footer.fc{border-top:1px solid var(--line);margin-top:26px;padding:16px 0;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
button.refresh{background:var(--raise);border:1px solid var(--line);color:var(--cream);
  font-family:'Quicksand',sans-serif;font-weight:700;font-size:.76rem;letter-spacing:.1em;
  text-transform:uppercase;padding:10px 18px;border-radius:8px;cursor:pointer}
button.refresh:hover{border-color:var(--pink);color:var(--white)}
button.refresh:focus-visible{outline:2px solid var(--pink);outline-offset:3px}
footer.fc .upd{margin-left:auto;font-family:var(--mono);font-size:.7rem;color:var(--mauve)}

@media (max-width:640px){
  .clock{width:100%;margin:8px 0 0;text-align:left}
  .hrow{flex-wrap:wrap}
  .health{gap:18px}
  .hstat b{font-size:1.7rem}
  .guards{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
  .legend{margin-left:0;width:100%}
  .sovn{width:66px;flex:0 0 66px;font-size:.72rem}
  .sovn.wide{width:104px;flex:0 0 104px;font-size:.7rem}
  .sovv.money{width:64px;flex:0 0 64px;font-size:.68rem}
  .fwarrow{display:none}
  .hist{height:110px;gap:5px}
  .fts{flex:0 0 62px;font-size:.62rem}
  .frow{flex-wrap:wrap;gap:6px 10px}
  td.msg{min-width:200px}
}
@media (prefers-reduced-motion:reduce){.pulse{animation:none}}