/* GROUND CONTROL — v1.1 design tokens & layout.
   NASA/IBM retrofuturist, near-monochrome, understated. ONE accent (Process
   Blue) reserved for the single primary action per view + keyboard focus rings.
   No gradients. No webfonts (LAN/offline): system fallbacks only. */

:root {
  --bg:        #FAFAFA;
  --ink:       #1A1A1A;
  --hairline:  #D4CFC8;
  --accent:    #0072CE;   /* Process Blue — PRIMARY action + focus ring ONLY */
  --muted:     #6B6B6B;
  --faint:     #9A9A9A;
  --locked:    #A9A9A9;
  --panel:     #FFFFFF;
  --panel-2:   #F4F2EF;
  --green:     #2E7D4F;
  --amber:     #8A6D1A;
  --red:       #B3402A;
  --radius:    8px;
  --sidebar-w: 244px;
  --font-head: "Futura PT", "Futura", "Jost", -apple-system, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", "SFMono-Regular", "Consolas", "Menlo", monospace;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-head);
  font-size: 15px;
  line-height: 1.5;
}

/* Content links: ink + underline (never blue). */
main a { color: var(--ink); text-decoration: underline; }
main a:hover { color: #000; }

h1, h2, h3 { font-family: var(--font-head); font-weight: 700; margin: 0 0 .5rem; }
h1 { font-size: 1.5rem; letter-spacing: .01em; }
h2 { font-size: 1.05rem; }

.mono, .badge, .label, code, .data {
  font-family: var(--font-mono);
  letter-spacing: .02em;
}
.muted { color: var(--muted); }
.small { font-size: .82rem; }
.stack > * + * { margin-top: 1rem; }

/* Keyboard focus ring — the other sanctioned use of the accent. */
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* --- Shell / sidebar ---------------------------------------------------- */
body.has-nav { }
.sidebar {
  position: fixed;
  top: 0; left: 0; bottom: 0;
  width: var(--sidebar-w);
  background: var(--panel);
  border-right: 1px solid var(--hairline);
  display: flex;
  flex-direction: column;
  padding: 1rem .85rem;
  overflow-y: auto;
}
.content { padding: 1.5rem 1.75rem 4rem; }
body.has-nav .content {
  margin-left: var(--sidebar-w);
  max-width: 1100px;
}
.content-auth, body.auth .content { margin-left: 0; }

/* Identity block */
.identity { display: flex; gap: .6rem; align-items: center; margin-bottom: 1.1rem; }
.avatar {
  width: 40px; height: 40px; flex: 0 0 40px;
  border: 1px solid var(--ink);
  border-radius: var(--radius);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-mono); font-weight: 700; font-size: .85rem;
}
.who-name { font-family: var(--font-head); font-weight: 700; font-size: .95rem; }
.who-badges { display: flex; flex-wrap: wrap; gap: .25rem; margin-top: .15rem; }
.idbadge {
  font-family: var(--font-mono); font-size: .6rem;
  text-transform: uppercase; letter-spacing: .03em;
  color: var(--muted);
  border: 1px solid var(--hairline);
  border-radius: 4px; padding: .05rem .3rem;
}

/* Nav */
.nav { display: flex; flex-direction: column; gap: .15rem; }
.navlink {
  font-family: var(--font-mono);
  font-size: .78rem; text-transform: uppercase; letter-spacing: .05em;
  color: var(--ink); text-decoration: none;
  padding: .5rem .6rem; border-radius: var(--radius);
  display: flex; align-items: center; justify-content: space-between;
}
.navlink:hover { background: var(--panel-2); text-decoration: none; }
.navlink.active { background: var(--ink); color: var(--bg); }   /* dark fill, not blue */
.countbadge {
  font-family: var(--font-mono); font-size: .62rem;
  background: var(--ink); color: var(--bg);
  border-radius: 999px; padding: .05rem .4rem; min-width: 1.2em; text-align: center;
}
.navlink.active .countbadge { background: var(--bg); color: var(--ink); }

/* Sidebar footer */
.sidebar-foot { margin-top: auto; padding-top: 1rem; display: flex; flex-direction: column; gap: .6rem; }
.foot-label { font-size: .62rem; text-transform: uppercase; color: var(--faint); letter-spacing: .08em; }
.foot-sops { display: flex; flex-direction: column; gap: .2rem; }
.foot-sops a { font-size: .78rem; color: var(--ink); text-decoration: underline; }
.clockchip {
  font-family: var(--font-mono); font-size: .68rem; text-transform: uppercase;
  border: 1px solid var(--hairline); border-radius: var(--radius);
  padding: .35rem .5rem; text-decoration: none; color: var(--muted);
}
.clockchip.on { color: var(--green); border-color: var(--green); }
.btn-block { display: block; width: 100%; text-align: center; }

/* Hamburger (mobile only) */
.hamburger {
  display: none;
  position: fixed; top: .7rem; left: .7rem; z-index: 40;
  font-size: 1.1rem; line-height: 1;
  background: var(--panel); color: var(--ink);
  border: 1px solid var(--hairline); border-radius: var(--radius);
  padding: .4rem .6rem; cursor: pointer;
}

/* --- Buttons ------------------------------------------------------------ */
.btn, button.btn, input[type=submit].btn {
  font-family: var(--font-mono);
  font-size: .78rem; text-transform: uppercase; letter-spacing: .04em;
  border: 1px solid var(--hairline);
  background: var(--panel); color: var(--ink);
  border-radius: var(--radius);
  padding: .45rem .8rem; cursor: pointer;
  display: inline-block; text-decoration: none;
}
.btn:hover { border-color: var(--ink); text-decoration: none; }
/* The single primary action per view — the only blue button anywhere.
   .btn.btn-primary keeps specificity above the button.btn base rule. */
.btn.btn-primary, button.btn-primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn.btn-primary:hover, button.btn-primary:hover { color: #fff; opacity: .92; border-color: var(--accent); }
.btn-ghost { background: transparent; }
.btn-sm { padding: .3rem .55rem; font-size: .7rem; }

/* --- Stat cards (big numbers) ------------------------------------------- */
.statgrid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: .75rem;
}
.stat {
  border: 1px solid var(--hairline); border-radius: var(--radius);
  background: var(--panel); padding: 1rem 1.1rem;
}
.stat .stat-label {
  font-family: var(--font-mono); font-size: .66rem; text-transform: uppercase;
  letter-spacing: .05em; color: var(--muted);
}
.stat .stat-value {
  font-family: var(--font-mono); font-weight: 700;
  font-size: 1.9rem; line-height: 1.1; margin-top: .35rem; letter-spacing: -.01em;
}
.stat .stat-foot { margin-top: .35rem; display: flex; gap: .5rem; align-items: baseline; }
.stat .stat-period { font-size: .68rem; color: var(--faint); }

/* Delta / status chips — muted green / red, mono, small. */
.chip {
  font-family: var(--font-mono); font-size: .66rem; text-transform: uppercase;
  border-radius: 4px; padding: .05rem .35rem; border: 1px solid transparent;
}
.chip.up { color: var(--green); border-color: var(--green); }
.chip.down { color: var(--red); border-color: var(--red); }
.chip.flat { color: var(--muted); border-color: var(--hairline); }
.chip.ph { color: var(--faint); border-color: var(--hairline); }

/* --- Deck sections & tool cards ----------------------------------------- */
.deck-section { margin-bottom: 1.75rem; }
.deck-head {
  font-family: var(--font-mono); text-transform: uppercase; letter-spacing: .08em;
  font-size: .8rem; color: var(--muted);
  border-bottom: 1px solid var(--hairline);
  padding-bottom: .35rem; margin-bottom: .9rem;
}
.tiles {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: .75rem;
}
.tile {
  border: 1px solid var(--hairline); border-radius: var(--radius);
  background: var(--panel); padding: .85rem .9rem;
  display: flex; flex-direction: column; min-height: 96px; text-decoration: none;
}
.tile:hover { text-decoration: none; border-color: var(--ink); }
.tile .it { font-family: var(--font-mono); font-size: .7rem; color: var(--muted); }
.tile .name { font-family: var(--font-head); font-weight: 700; margin-top: .15rem; color: var(--ink); }
.tile .badge {
  align-self: flex-start; margin-top: auto;
  font-family: var(--font-mono); font-size: .62rem; text-transform: uppercase;
  border: 1px solid var(--hairline); border-radius: 4px; padding: .1rem .35rem;
  color: var(--muted);
}
.tile.active { border-color: var(--ink); }
.tile.locked { color: var(--locked); background: var(--panel-2); }
.tile.locked .name { color: var(--locked); }
.tile.locked .requires { font-family: var(--font-mono); font-size: .68rem; margin-top: .4rem; color: var(--locked); }
.tile.coming_soon { opacity: .78; }
.tile.proposed { border-style: dashed; border-color: var(--faint); background: var(--panel); }
.tile.proposed .badge { border-style: dashed; }

/* Expandable card wrapper (chevron accordion) */
.card { border: 1px solid var(--hairline); border-radius: var(--radius); background: var(--panel); margin-bottom: .6rem; overflow: hidden; }
.card.coming_soon { opacity: .82; }
.card.locked { background: var(--panel-2); }
.card.proposed { border-style: dashed; border-color: var(--faint); }
.card-head {
  display: flex; align-items: center; gap: .75rem;
  padding: .8rem .9rem; cursor: pointer; user-select: none;
}
.card-head .it { font-family: var(--font-mono); font-size: .7rem; color: var(--muted); min-width: 66px; }
.card-head .name { font-family: var(--font-head); font-weight: 700; flex: 1; text-decoration: none; color: var(--ink); }
.tile .name { text-decoration: none; }
.card.locked .card-head .name { color: var(--locked); }
.card-head .chev { font-family: var(--font-mono); color: var(--muted); transition: transform .15s; }
.card.open .card-head .chev { transform: rotate(90deg); }
/* Primary action: always-visible OPEN on live tools (no hunting in the
   accordion); ⓘ is the progressive-disclosure affordance. */
.card-head .open-btn {
  font-family: var(--font-mono); font-size: .7rem; letter-spacing: .08em;
  color: #fff; background: var(--ink); border-radius: 5px;
  padding: .3rem .85rem; text-decoration: none; flex: 0 0 auto;
  transition: filter .12s;
}
.card-head .open-btn:hover { filter: brightness(1.6); }
.card-head .info-toggle {
  font-family: var(--font-mono); font-size: .85rem; line-height: 1;
  color: var(--muted); background: none; border: 1px solid var(--hairline);
  border-radius: 999px; width: 1.6rem; height: 1.6rem; flex: 0 0 auto;
  cursor: pointer; padding: 0; transition: color .12s, border-color .12s;
}
.card-head .info-toggle:hover { color: var(--ink); border-color: var(--ink); }
.card.open .card-head .info-toggle {
  color: var(--accent); border-color: var(--accent);
}
.card-body { padding: 0 .9rem 0; max-height: 0; overflow: hidden; transition: max-height .2s ease; }
.card.open .card-body { max-height: 1400px; padding: .2rem .9rem 1rem; }
.card-body h4 { font-family: var(--font-mono); font-size: .68rem; text-transform: uppercase; color: var(--muted); letter-spacing: .05em; margin: .9rem 0 .25rem; }
.card-meta { border-top: 1px dashed var(--hairline); margin-top: .9rem; padding-top: .6rem; }
.card-meta table { font-size: .8rem; }

/* --- Tables ------------------------------------------------------------- */
table { border-collapse: collapse; width: 100%; font-size: .85rem; }
th, td { text-align: left; padding: .45rem .6rem; border-bottom: 1px solid var(--hairline); vertical-align: top; }
th { font-family: var(--font-mono); text-transform: uppercase; font-size: .7rem; letter-spacing: .05em; color: var(--muted); }
td.data, td .mono { font-family: var(--font-mono); }

/* --- Panels / forms ----------------------------------------------------- */
.panel { background: var(--panel); border: 1px solid var(--hairline); border-radius: var(--radius); padding: 1.25rem; }
.grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1rem; }
label.field { display: block; margin-bottom: .8rem; }
label.field span { display: block; font-family: var(--font-mono); font-size: .72rem; text-transform: uppercase; color: var(--muted); margin-bottom: .25rem; }
input[type=text], input[type=password], input[type=number], input[type=url], select, textarea {
  width: 100%; padding: .5rem .6rem; border: 1px solid var(--hairline);
  border-radius: var(--radius); font-family: var(--font-mono); font-size: .9rem;
  background: #fff; color: var(--ink);
}
.row-inline { display: flex; gap: .5rem; align-items: flex-end; flex-wrap: wrap; }

/* --- Login card --------------------------------------------------------- */
.auth-wrap { min-height: 80vh; display: flex; align-items: center; justify-content: center; }
.auth-card { width: 100%; max-width: 380px; }
.auth-card h1 { text-align: center; text-transform: uppercase; letter-spacing: .06em; }

/* --- Notices ------------------------------------------------------------ */
.notice { border-radius: var(--radius); padding: .6rem .8rem; font-size: .85rem; border: 1px solid var(--hairline); margin-bottom: 1rem; }
.notice.error { border-color: var(--red); color: var(--red); }
.notice.ok { border-color: var(--green); color: var(--green); }
.notice.invite { border-color: var(--ink); font-family: var(--font-mono); }
.notice.invite code { font-size: 1.1rem; color: var(--ink); }

/* --- Status pills -------------------------------------------------------- */
.pill { font-family: var(--font-mono); font-size: .7rem; text-transform: uppercase; padding: .1rem .4rem; border-radius: 4px; border: 1px solid var(--hairline); color: var(--muted); }
.pill.ok { color: var(--green); border-color: var(--green); }
.pill.bad { color: var(--red); border-color: var(--red); }

.clock-on { color: var(--green); text-transform: uppercase; }
.clock-off { color: var(--muted); text-transform: uppercase; }

.checkline { display: flex; align-items: center; gap: .6rem; padding: .4rem 0; border-bottom: 1px solid var(--hairline); }
.checkline.done { color: var(--muted); text-decoration: line-through; }

.section-title { font-family: var(--font-mono); text-transform: uppercase; letter-spacing: .06em; font-size: .8rem; color: var(--muted); margin: 1.5rem 0 .6rem; }
.mission { font-size: 1.05rem; color: var(--ink); border-left: 3px solid var(--ink); padding-left: .8rem; margin: .25rem 0 1.5rem; }
.board-row { display: flex; justify-content: space-between; align-items: center; padding: .4rem 0; border-bottom: 1px solid var(--hairline); }

/* --- Utility: replaces every inline style= (strict CSP: no unsafe-inline) - */
.text-center { text-align: center; }
.form-inline { display: inline; }
.mt-sm { margin-top: .6rem; }
.mt-md { margin-top: 1rem; }
/* Stat card that contains a CTA button rather than a big number */
.stat-action { display: flex; flex-direction: column; justify-content: center; }
/* Flex-ratio labels inside .row-inline (dispatch / crew-me add-board forms) */
label.field-flex1 { flex: 1; margin: 0; }
label.field-flex2 { flex: 2; margin: 0; }
/* Flex-ratio inputs inside .row-inline (kpi edit row) */
.flex-1 { flex: 1 !important; }
.flex-2 { flex: 2 !important; }
/* Visitor log: highlight guests still on site */
tr.visitor-active { border-left: 3px solid var(--accent); }

/* --- KPI edit panel -------------------------------------------------------- */
/* Pillar header row: title left, EDIT VALUES toggle right */
.kpi-pillar-head {
  display: flex; align-items: center; justify-content: space-between;
  margin: 1.5rem 0 .6rem;
}
.kpi-pillar-head .section-title { margin: 0; }
/* Edit forms hidden by default; revealed when parent gains .kpi-editing */
.kpi-edit-form { display: none; margin-top: .6rem; }
.kpi-editing .kpi-edit-form { display: block; }

/* --- KPI tabs ------------------------------------------------------------ */
.tabs { display: flex; gap: .3rem; border-bottom: 1px solid var(--hairline); margin: .5rem 0 1.25rem; }
.tab {
  font-family: var(--font-mono); font-size: .74rem; text-transform: uppercase;
  letter-spacing: .05em; color: var(--muted); text-decoration: none;
  padding: .45rem .8rem; border: 1px solid transparent; border-bottom: none;
  border-radius: var(--radius) var(--radius) 0 0; margin-bottom: -1px;
}
.tab:hover { color: var(--ink); text-decoration: none; }
.tab.active { color: var(--ink); border-color: var(--hairline); background: var(--panel); }

/* Source chip on a KPI card */
.srcchip {
  font-family: var(--font-mono); font-size: .58rem; letter-spacing: .03em;
  text-transform: uppercase; color: var(--faint); margin-top: .35rem;
}
/* Clickable stat label/value */
.stat-link { text-decoration: none; color: var(--ink); display: block; }
.stat-link:hover { text-decoration: none; }
.stat-link:hover .stat-value { text-decoration: underline; }

/* New-metric toggle + form */
.kpi-new { margin: .25rem 0 1.5rem; }
.kpi-new-form { display: none; }
.kpi-new.open .kpi-new-form { display: block; }

/* --- KPI drill-down chart / funnel -------------------------------------- */
.chart-wrap, .funnel-wrap { max-width: 720px; margin: .5rem 0 1rem; }
.chart-wrap svg, .funnel-wrap svg { width: 100%; height: auto; display: block; }

/* Seven pillar funnels side by side, horizontally scrollable. */
.funnel-row {
  display: flex; gap: .75rem; overflow-x: auto;
  margin: .75rem 0 1rem; padding-bottom: .6rem;
}
.funnel-card {
  flex: 0 0 258px; width: 258px;
  border: 1px solid var(--hairline); border-radius: var(--radius);
  background: var(--panel); padding: .8rem .85rem;
}
.funnel-card-head {
  font-family: var(--font-mono); font-size: .68rem; text-transform: uppercase;
  letter-spacing: .05em; color: var(--muted); margin-bottom: .5rem;
  display: flex; align-items: center; justify-content: space-between; gap: .4rem;
}
.funnel-card svg { width: 100%; height: auto; display: block; }
.chart-legend { display: flex; gap: 1rem; color: var(--muted); margin: .5rem 0; }
.chart-legend .lg-ink { color: var(--ink); }
.chart-legend .lg-grey, .chart-legend .lg-dash { color: var(--faint); }

/* --- Tool pictograms + status traffic lights ---------------------------- */
.card-head .ticon { color: var(--ink); display: inline-flex; flex: 0 0 auto; line-height: 0; }
.card.not-live .card-head .ticon { color: var(--muted); }
.card.locked .card-head .ticon { color: var(--locked); }
.statuslight {
  font-family: var(--font-mono); font-size: .62rem; text-transform: uppercase;
  letter-spacing: .03em; color: var(--muted);
  display: inline-flex; align-items: center; gap: .35rem; white-space: nowrap;
}
.statusdot {
  width: .55rem; height: .55rem; border-radius: 999px; flex: 0 0 auto;
  background: var(--faint); border: 1px solid var(--faint);
}
.statusdot.live { background: var(--green); border-color: var(--green); }
.statusdot.dev { background: var(--amber, #8A6D1A); border-color: var(--amber, #8A6D1A); }
.statusdot.blocked { background: var(--red); border-color: var(--red); }
.statusdot.grey { background: var(--locked); border-color: var(--locked); }
.statusdot.proposed { background: transparent; border-color: var(--faint); }
/* Not-live cards read one notch quieter than LIVE ones. */
.card.not-live .card-head .name { color: var(--muted); }
.card.not-live { background: var(--panel-2); }

/* --- L1-L6 progression bar ---------------------------------------------- */
.lbar { display: inline-flex; gap: 2px; vertical-align: middle; margin-left: .35rem; }
.lseg { width: 9px; height: 6px; border: 1px solid var(--hairline); border-radius: 1px; }
.lseg.filled, .lseg.current { background: var(--ink); border-color: var(--ink); }
.who-lbars { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .3rem; }
.lrow { display: inline-flex; align-items: center; gap: .3rem; margin-right: .6rem; }
.lbar-list li { display: flex; align-items: center; }
.premortem { color: var(--muted); }

/* --- Responsive: sidebar collapses to a top bar + hamburger ------------- */
@media (max-width: 768px) {
  .hamburger { display: block; }
  .sidebar { transform: translateX(-100%); transition: transform .2s ease; z-index: 30; box-shadow: 0 0 0 100vmax rgba(0,0,0,0); }
  body.nav-open .sidebar { transform: translateX(0); box-shadow: 0 0 40px rgba(0,0,0,.15); }
  body.has-nav .content { margin-left: 0; padding-top: 3.2rem; }
}

/* COM-002 Airlock Reports Viewer — redacted markdown render (md_lite). */
.md-body { margin-top: .75rem; }
.md-body h1, .md-body h2, .md-body h3, .md-body h4 {
  font-family: var(--font-head); margin: 1rem 0 .4rem; }
.md-body h1 { font-size: 1.15rem; }
.md-body h2 { font-size: 1.05rem; }
.md-body h3, .md-body h4 { font-size: .95rem; }
.md-body p { margin: .4rem 0; }
.md-body ul { margin: .4rem 0 .4rem 1.1rem; padding: 0; }
.md-body li { margin: .15rem 0; }
.md-body code { font-family: var(--font-mono); font-size: .85em;
  background: var(--panel-2); padding: .05rem .3rem; border-radius: 4px; }
.md-body pre { background: var(--panel-2); border: 1px solid var(--hairline);
  border-radius: var(--radius); padding: .75rem 1rem; overflow-x: auto; }
.md-body pre code { background: none; padding: 0; }
.md-body blockquote { margin: .6rem 0; padding: .5rem .9rem;
  border-left: 3px solid var(--accent); background: var(--panel-2);
  color: var(--muted); font-size: .9rem; }
details.panel > summary { cursor: pointer; font-family: var(--font-mono);
  list-style: none; }
details.panel > summary::-webkit-details-marker { display: none; }
details.panel[open] > summary { margin-bottom: .5rem;
  border-bottom: 1px solid var(--hairline); padding-bottom: .5rem; }

/* ===== AGENTS v5 — full-width light theme ===== */
/* Full-width override: agents pages opt in via .content-wide on <main>. */
body.has-nav .content.content-wide { max-width: none; }

/* --- About-this-page panel (universal, all pages) ---------------------- */
details.page-about {
  border: 1px solid var(--hairline); border-left: 3px solid var(--accent);
  border-radius: var(--radius); background: var(--panel-2);
  padding: .55rem .85rem; margin: 0 0 1.4rem;
}
details.page-about > summary {
  cursor: pointer; list-style: none;
  font-family: var(--font-mono); font-size: .72rem; letter-spacing: .04em;
  text-transform: uppercase; color: var(--muted);
}
details.page-about > summary::-webkit-details-marker { display: none; }
details.page-about[open] > summary { margin-bottom: .55rem; color: var(--ink); }
.page-about-body .pa-obj { margin: 0 0 .5rem; font-size: .84rem; color: var(--ink); }
.page-about-body dl { margin: 0; display: grid; gap: .3rem; }
.page-about-body dl > div { display: flex; gap: .5rem; flex-wrap: wrap; }
.page-about-body dt {
  font-family: var(--font-mono); font-size: .64rem; text-transform: uppercase;
  letter-spacing: .05em; color: var(--faint); min-width: 92px;
}
.page-about-body dd { margin: 0; font-size: .82rem; color: var(--muted); }

/* --- State dots (four-state colour; only the dot carries colour) ------- */
.sdot {
  display: inline-block; width: .62rem; height: .62rem; border-radius: 50%;
  vertical-align: middle; background: var(--faint);
}
.dot-good    { background: #2E7D4F; }
.dot-working { background: #0072CE; }
.dot-blocked { background: #C9A227; }
.dot-error   { background: #B3402A; }
.dot-idle    { background: var(--hairline); }

/* --- Attention strip (red items) -------------------------------------- */
.attn-strip {
  border: 1px solid var(--red); border-left: 3px solid var(--red);
  border-radius: var(--radius); background: #FBF1EE;
  padding: .7rem .95rem; margin: 0 0 1rem;
}
.attn-hd {
  font-family: var(--font-mono); font-size: .66rem; letter-spacing: .12em;
  text-transform: uppercase; color: var(--red); margin: 0 0 .45rem;
}
.attn-strip ul { list-style: none; margin: 0; padding: 0; }
.attn-strip li { padding: .16rem 0; font-size: .84rem; }
.attn-strip li a { color: var(--red); }
.nominal-ok {
  border: 1px solid var(--hairline); border-radius: var(--radius);
  background: var(--panel); padding: .55rem .9rem; margin: 0 0 1rem;
  font-size: .82rem; color: var(--green);
}

/* --- Org chart -------------------------------------------------------- */
.org { margin: .2rem 0 .5rem; }
.org-node {
  display: inline-flex; flex-direction: column; gap: .12rem;
  border: 1px solid var(--hairline); border-radius: var(--radius);
  background: var(--panel); padding: .7rem .95rem; min-width: 190px;
  text-decoration: none; color: var(--ink); position: relative;
}
.org-node:hover { border-color: var(--ink); text-decoration: none; }
.org-node.command {
  border-color: var(--ink); border-width: 1px 1px 1px 3px;
  border-left-color: var(--accent); display: flex;
}
.org-node .org-dot {
  display: inline-block; width: .55rem; height: .55rem; border-radius: 50%;
  position: absolute; top: .8rem; right: .85rem;
}
.org-emoji { font-size: 1.1rem; }
.org-name { font-family: var(--font-head); font-weight: 700; font-size: .95rem; }
.org-title { font-family: var(--font-mono); font-size: .68rem; color: var(--muted); }
.org-state {
  font-family: var(--font-mono); font-size: .58rem; letter-spacing: .1em;
  text-transform: uppercase; color: var(--faint); margin-top: .15rem;
}
.org-reports {
  display: flex; flex-wrap: wrap; gap: .7rem; margin-top: .9rem;
  padding-top: .9rem; border-top: 1px dashed var(--hairline);
}

/* --- Agents status table ---------------------------------------------- */
.agents-table { width: 100%; }
.agents-table thead th {
  font-family: var(--font-mono); font-size: .62rem; letter-spacing: .1em;
  text-transform: uppercase; color: var(--muted); text-align: left;
  border-bottom: 1px solid var(--hairline); padding: .45rem .5rem; font-weight: 400;
}
.agents-table td { padding: .5rem .5rem; border-bottom: 1px solid var(--hairline); vertical-align: middle; }
.agents-table tr:last-child td { border-bottom: none; }
.agents-table .c-state { width: 1.4rem; text-align: center; }
.agents-table .c-open { text-align: right; width: 4rem; }
.agents-table .c-agent a { text-decoration: none; font-weight: 700; font-family: var(--font-head); }
.agents-table .c-agent a:hover { text-decoration: underline; }
.agents-table .c-now { font-size: .8rem; color: var(--muted); }
.agents-table tbody tr:hover { background: var(--panel-2); }
.agents-table .row-unassigned { color: var(--faint); }
.agents-table .row-unassigned td { color: var(--faint); }
.agents-legend {
  display: flex; gap: 1.3rem; flex-wrap: wrap; margin: .6rem 0 0;
  font-family: var(--font-mono); font-size: .66rem; color: var(--muted);
}
.agents-legend span { display: inline-flex; align-items: center; gap: .35rem; }

/* --- Week roster ------------------------------------------------------ */
.roster {
  display: grid; grid-template-columns: repeat(7, 1fr);
  border: 1px solid var(--hairline); border-radius: var(--radius); overflow: hidden;
}
.rday { border-left: 1px solid var(--hairline); padding: .5rem .55rem; min-height: 5.5rem; }
.rday:first-child { border-left: none; }
.rday.today { background: var(--panel-2); }
.rday-hd {
  display: flex; justify-content: space-between; font-family: var(--font-mono);
  font-size: .6rem; letter-spacing: .1em; color: var(--faint); margin-bottom: .45rem;
}
.rday.today .rday-hd { color: var(--ink); }
.rev { font-size: .68rem; line-height: 1.3; margin-bottom: .45rem; color: var(--ink); }
.rev-t { font-family: var(--font-mono); font-weight: 700; }
.rev.red, .rev.red .rev-t { color: var(--red); }
.rev-who { color: var(--muted); }
.upcoming-strip {
  border: 1px solid var(--red); border-left: 3px solid var(--red);
  border-radius: var(--radius); background: #FBF1EE;
  margin-top: .7rem; padding: .6rem .9rem;
}
.up-row { font-size: .78rem; color: var(--red); padding: .12rem 0; }

/* --- Agent detail ----------------------------------------------------- */
.agent-hd {
  border: 1px solid var(--hairline); border-left: 3px solid var(--hairline);
  border-radius: var(--radius); background: var(--panel);
  padding: 1rem 1.15rem; margin-bottom: 1rem;
}
.agent-hd.state-good    { border-left-color: #2E7D4F; }
.agent-hd.state-working { border-left-color: #0072CE; }
.agent-hd.state-blocked { border-left-color: #C9A227; }
.agent-hd.state-error   { border-left-color: #B3402A; }
.agent-hd-row { display: flex; align-items: baseline; gap: 1rem; flex-wrap: wrap; }
.agent-hd h1 { margin: 0; }
.agent-title { font-family: var(--font-mono); font-size: .74rem; color: var(--muted); margin: .35rem 0 0; }
.agent-mission { font-size: .9rem; color: var(--ink); margin: .55rem 0 0; }
.agent-impact {
  font-size: .84rem; color: var(--muted); margin: .45rem 0 0;
  border-left: 2px solid var(--hairline); padding-left: .7rem;
}
.chip .sdot { width: .5rem; height: .5rem; margin-right: .25rem; }
.warn-card { border-color: #C9A227; }
.warn-card .section-title { color: var(--amber); border-color: var(--hairline); }
.err-line { color: var(--red); font-size: .8rem; margin: 0 0 .6rem; }
.guidance-q {
  border: 1px solid #E4D9B0; background: #FBF7E8; border-radius: var(--radius);
  padding: .8rem .9rem; margin: 0 .9rem .6rem;
}
.guidance-q:last-child { margin-bottom: .5rem; }
.guidance-q h2 { font-size: .9rem; margin: 0 0 .35rem; }
.guidance-q textarea {
  width: 100%; box-sizing: border-box; font-family: var(--font-mono);
  font-size: .82rem; border: 1px solid var(--hairline); border-radius: var(--radius);
  padding: .5rem .6rem; margin-top: .4rem; background: var(--panel); color: var(--ink);
}
.guidance-q form > div { margin-top: .5rem; }
.cal-list { list-style: none; margin: 0; padding: 0; }
.cal-list li { font-size: .82rem; padding: .32rem 0; border-top: 1px solid var(--hairline); }
.cal-list li:first-child { border-top: none; }
.cal-list li.red { color: var(--red); }
.cal-t { font-family: var(--font-mono); font-weight: 700; }
.agent-links { margin-top: .9rem; display: flex; gap: .5rem; flex-wrap: wrap; }

@media (max-width: 768px) {
  .agents-table .c-now, .agents-table thead th.c-now { display: none; }
  .org-node, .org-reports .org-node { min-width: 0; flex: 1 1 100%; }
  .roster { grid-template-columns: repeat(2, 1fr); }
}

.gc-build-footer{padding:8px 16px;font-size:10px;color:#555;font-family:"IBM Plex Mono",ui-monospace,monospace;border-top:1px solid #222;}

/* org card detail v5.1 */
.org-node{display:flex;flex-direction:column;gap:6px;}
.org-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;text-decoration:none;color:inherit;}
.org-now{font-size:12px;color:#555;line-height:1.4;}
.org-proj{font-size:12px;color:#1a1a1a;text-decoration:none;font-weight:600;}
.org-proj:hover{text-decoration:underline;}
.org-proj-more{color:#0072CE;font-weight:400;margin-left:4px;}
.org-open{font-size:11px;color:#0072CE;text-decoration:none;letter-spacing:.03em;text-transform:uppercase;}
.org-open:hover{text-decoration:underline;}

/* --- DISPATCH live feed (v5) ---------------------------------------------- */
/* Red sidebar bubble whenever there are open orders not yet shipped. */
.countbadge.alert { background: var(--red); color: #fff; }
.navlink.active .countbadge.alert { background: var(--red); color: #fff; }
.section-title.alert { color: var(--red); }
.feedline { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; font-size: .8rem; margin-bottom: .75rem; }
.feeddot { width: .55rem; height: .55rem; border-radius: 50%; background: var(--muted); display: inline-block; }
.feeddot.ok { background: var(--green); }
.age-late { color: var(--red); font-weight: 600; }
table.orders td.actions { white-space: nowrap; text-align: right; }
table.orders td.actions form { margin-left: .3rem; }
ul.items { margin: 0; padding-left: 0; list-style: none; font-size: .82rem; }
ul.items li { padding: .05rem 0; }
.ordernote { color: var(--amber); margin-top: .3rem; }


/* --- /count (stock count) --------------------------------------------- */
.count-wrap { max-width: 560px; margin: 0 auto; }
.count-bigbtn { width: 100%; padding: 1.1rem; font-size: 1.05rem; }
.count-reader { width: 100%; min-height: 220px; }
.count-reader video { width: 100% !important; border-radius: 6px; }
.count-searchrow { display: flex; gap: .5rem; }
.count-searchrow input { flex: 1; min-width: 0; }
.count-itemtitle { font-size: 1.15rem; font-weight: 700; }
.count-btnrow { display: flex; flex-direction: column; gap: .5rem; }
.count-result { display: block; width: 100%; text-align: left; }
.count-recent { padding: .5rem .8rem; font-size: .9rem; opacity: .85; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.tablewrap { overflow-x: auto; }
.count-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.count-table th, .count-table td { padding: .35rem .5rem; text-align: left; white-space: nowrap; }
.count-table tr.count-big td { background: rgba(255,170,0,.12); }
.count-table tr.count-bad td { background: rgba(255,60,60,.14); }
.btn-sm { padding: .15rem .5rem; font-size: .8rem; }
#qtyInput { font-size: 1.4rem; }