/* APOL Command Center — operating console. Dependency-free design system. */

/* P1-PERF-R1 F1 — Inter, served from APOL's own origin.
 *
 * The console used to reach Inter's upstream CDN for this: a render-blocking stylesheet on a
 * third-party origin, then the font files behind it — about 446 KB and an extra connection before
 * anything painted. Removing the link alone left "Inter" named in --sans below with nothing to
 * satisfy it, so the typeface a tester saw depended on whether their phone happened to have Inter
 * installed already.
 *
 * One file now carries it. This is Inter's Latin subset as a VARIABLE font, so a single 48 KB face
 * covers the whole range the console actually uses — the declarations below run 400, 500, 600, 650,
 * 700, 750, 800, 850 and 900, and a pair of static weights would have flattened all of that onto
 * two. Latin only: nothing in this console renders Greek, Cyrillic or Vietnamese, and carrying them
 * would have cost more than the third-party request did.
 *
 * font-display: swap so the text is readable in the fallback stack from the first paint and never
 * invisible while 48 KB arrives over a slow connection.
 *
 * Inter is (c) The Inter Project Authors, SIL Open Font License 1.1 — see fonts/Inter-LICENSE.txt.
 */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/fonts/inter-latin-var.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
                 U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
                 U+FEFF, U+FFFD;
}

:root {
  --bg: #080d18;
  --panel: #0e1626;
  --panel-2: #121d31;
  --panel-3: #16223a;
  --border: #1e2c46;
  --border-soft: #182338;
  --ink: #e8eefb;
  --muted: #93a3c0;
  --faint: #6b7c9c;
  --accent: #19c37d;
  --accent-soft: rgba(25, 195, 125, 0.14);
  --indigo: #7c8cff;
  --indigo-soft: rgba(124, 140, 255, 0.14);
  --warn: #f5a623;
  --warn-soft: rgba(245, 166, 35, 0.14);
  --bad: #ef5a6f;
  --bad-soft: rgba(239, 90, 111, 0.14);
  --radius: 8px;
  --radius-sm: 8px;
  --shadow: 0 1px 0 rgba(255, 255, 255, 0.03), 0 18px 40px -24px rgba(0, 0, 0, 0.8);
  --mono: ui-monospace, "SF Mono", "Cascadia Code", "Roboto Mono", Menlo, monospace;
  --sans: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
  color-scheme: dark;
}

* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; overflow-x: hidden; }
body {
  background: radial-gradient(1200px 600px at 80% -10%, rgba(124, 140, 255, 0.06), transparent 60%),
              radial-gradient(900px 500px at -10% 10%, rgba(25, 195, 125, 0.05), transparent 55%),
              var(--bg);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; }
button { font-family: inherit; cursor: pointer; }

/* ---- App frame ---- */
.app {
  display: grid;
  grid-template-columns: 252px 1fr;
  min-height: 100vh;
}

/* ---- Sidebar ---- */
.sidebar {
  position: sticky;
  top: 0;
  align-self: start;
  height: 100vh;
  background: linear-gradient(180deg, var(--panel) 0%, #0a1120 100%);
  border-right: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  padding: 20px 14px;
  gap: 8px;
}
.brand { display: flex; align-items: center; gap: 11px; padding: 6px 8px 18px; }
.brand-mark {
  width: 34px; height: 34px; border-radius: 9px;
  background: linear-gradient(135deg, var(--accent), #0e8e5b);
  display: grid; place-items: center; font-weight: 800; color: #04130c;
  box-shadow: 0 6px 18px -8px var(--accent);
}
.brand-text strong { display: block; font-size: 15px; letter-spacing: .2px; }
.brand-text span { font-size: 11px; color: var(--faint); letter-spacing: .14em; text-transform: uppercase; }

.nav { display: flex; flex-direction: column; gap: 3px; }
.nav-item {
  display: flex; align-items: center; gap: 11px;
  padding: 11px 12px; border-radius: 10px;
  background: transparent; border: 1px solid transparent;
  color: var(--muted); font-size: 14px; font-weight: 600; text-align: left; width: 100%;
  transition: background .15s, color .15s, border-color .15s;
}
.nav-item .ico { width: 18px; text-align: center; opacity: .9; }
.nav-item:hover { background: var(--panel-2); color: var(--ink); }
.nav-item.active { background: var(--accent-soft); color: var(--ink); border-color: rgba(25,195,125,.3); }
.nav-item .tag { margin-left: auto; font-size: 10px; color: var(--faint); font-family: var(--mono); }

.sidebar-foot { margin-top: auto; padding: 12px 10px 4px; border-top: 1px solid var(--border-soft); }
.sys-line { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--muted); margin-top: 7px; }
.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.dot.idle { background: var(--faint); box-shadow: none; }

/* ---- Main ---- */
.main { min-width: 0; display: flex; flex-direction: column; }
.topbar {
  position: sticky; top: 0; z-index: 5;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 10px 20px;
  background: rgba(8, 13, 24, 0.82);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
}
.menu-btn { display: none; background: var(--panel-2); border: 1px solid var(--border); color: var(--ink); border-radius: 8px; padding: 8px 11px; font-size: 16px; }
.nav-controls { display: flex; gap: 8px; }
.nav-control {
  min-height: 34px;
  padding: 0 11px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--panel-2);
  color: var(--ink);
  font-weight: 800;
  font-size: 12px;
}
.topbar h1 { font-size: 17px; margin: 0; font-weight: 700; letter-spacing: .2px; }
.topbar .crumb { display: none; }
.page-summary {
  max-width: 900px;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.page-summary.tap {
  border-radius: 7px;
  outline-offset: 3px;
}
.page-command-strip {
  display: flex;
  gap: 6px;
  margin-top: 7px;
  align-items: center;
  max-width: min(920px, calc(100vw - 500px));
  min-height: 28px;
}
.page-command-card {
  display: none;
  min-height: 48px;
  padding: 7px 9px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: rgba(18, 29, 49, .82);
  color: var(--ink);
  text-align: left;
}
.page-command-card span {
  display: block;
  margin-bottom: 4px;
  color: var(--faint);
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.page-command-card strong {
  display: block;
  color: #d7e3f8;
  font-size: 11px;
  line-height: 1.28;
  font-weight: 750;
  max-height: 28px;
  overflow: hidden;
}
.page-command-actions {
  display: flex;
  align-items: stretch;
  gap: 6px;
  flex-wrap: wrap;
  min-width: 0;
  max-width: none;
}
.command-pill {
  min-height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  border: 1px solid rgba(25,195,125,.28);
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 10.5px;
  font-weight: 850;
  text-decoration: none;
  white-space: nowrap;
}
.command-pill:hover {
  border-color: rgba(124,140,255,.48);
  color: var(--ink);
}
.topbar-status {
  display: none;
  align-items: center; gap: 10px;
  font-family: var(--mono); font-size: 12px; color: var(--muted);
  max-width: 46%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}
.topbar-status .pulse { color: var(--accent); }
.badges { display: flex; gap: 8px; align-items: center; }

.badge {
  font-size: 11px; font-weight: 700; letter-spacing: .03em;
  padding: 5px 10px; border-radius: 999px; border: 1px solid var(--border);
  background: var(--panel-2); color: var(--muted); white-space: nowrap;
}
.badge.ok { color: var(--accent); border-color: rgba(25,195,125,.35); background: var(--accent-soft); }
.badge.warn { color: var(--warn); border-color: rgba(245,166,35,.35); background: var(--warn-soft); }
.badge.bad { color: var(--bad); border-color: rgba(239,90,111,.35); background: var(--bad-soft); }
.badge.indigo { color: var(--indigo); border-color: rgba(124,140,255,.35); background: var(--indigo-soft); }

.home-session-panel {
  padding: 12px;
  border-color: rgba(25,195,125,.3);
  background: linear-gradient(180deg, rgba(14, 49, 45, .55), rgba(14, 22, 38, .94));
}
.home-session-grid {
  display: grid;
  grid-template-columns: minmax(240px, .85fr) minmax(280px, 1fr) minmax(280px, 1fr);
  gap: 10px;
}
.home-session-grid.signed-in {
  grid-template-columns: minmax(280px, .9fr) minmax(240px, 1fr) minmax(240px, 1fr);
}
.session-card {
  min-width: 0;
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(8, 13, 24, .62);
}
.session-card .k,
.session-card strong,
.session-card em {
  display: block;
}
.session-card .k {
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.session-card strong {
  margin-top: 4px;
  font-size: 15px;
  line-height: 1.2;
}
.session-card em {
  margin-top: 6px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}
.session-form {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}
.session-form label span {
  display: block;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.session-form input,
.session-form select {
  width: 100%;
  min-height: 34px;
  padding: 7px 9px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #08111f;
  color: var(--ink);
}
.session-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 8px;
}
.session-status {
  min-height: 16px;
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
}

/* APOL identity — a user-facing gateway into the protected Leader workspace. */
.apol-identity-card {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  overflow: hidden;
  border-color: rgba(25, 195, 125, .42);
  background:
    radial-gradient(circle at 100% 0, rgba(80, 225, 169, .18), transparent 38%),
    linear-gradient(145deg, #0a2e27, #101b31 72%);
}
.apol-auth-card-mark {
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border-radius: 15px;
  background: linear-gradient(135deg, #2ee59d, #0da6a6);
  color: #041711;
  font-size: 22px;
  font-weight: 950;
  box-shadow: 0 12px 28px rgba(25, 195, 125, .25);
}
.apol-auth-card-copy p {
  margin: 6px 0 0;
  color: #a8b7c7;
  font-size: 12px;
  line-height: 1.45;
}
.apol-auth-open,
.apol-auth-header-open {
  border: 0;
  color: #041711;
  background: linear-gradient(135deg, #59efad, #28d5c2);
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(25, 195, 125, .2);
}
.apol-auth-open {
  grid-column: 1 / -1;
  min-height: 42px;
  border-radius: 10px;
}
.apol-auth-header-open {
  min-height: 31px;
  padding: 5px 12px;
  border-radius: 999px;
  white-space: nowrap;
}
.apol-auth-header-open span { color: #08755d; }
.apol-auth-open:hover,
.apol-auth-header-open:hover { filter: brightness(1.06); transform: translateY(-1px); }
.apol-auth-open:focus-visible,
.apol-auth-header-open:focus-visible { outline: 3px solid rgba(89, 239, 173, .42); outline-offset: 2px; }

.apol-auth-dialog {
  width: min(920px, calc(100vw - 32px));
  max-height: min(720px, calc(100vh - 32px));
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(105, 226, 179, .36);
  border-radius: 24px;
  background: #fff;
  color: #10261e;
  box-shadow: 0 35px 100px rgba(2, 10, 24, .58);
}
.apol-auth-dialog::backdrop {
  background: rgba(2, 8, 19, .76);
  backdrop-filter: blur(8px);
}
.apol-auth-layout { display: grid; grid-template-columns: minmax(280px, .9fr) minmax(340px, 1.1fr); min-height: 560px; }
.apol-auth-story,
.apol-auth-form { position: relative; padding: clamp(32px, 5vw, 58px); }
.apol-auth-story {
  display: flex;
  flex-direction: column;
  background:
    radial-gradient(circle at 20% 10%, rgba(72, 232, 170, .3), transparent 25%),
    radial-gradient(circle at 90% 75%, rgba(79, 113, 255, .24), transparent 35%),
    linear-gradient(145deg, #062a24, #0b1830 74%);
  color: #fff;
}
.apol-auth-story::after {
  content: '';
  position: absolute;
  right: 24px;
  bottom: 22px;
  width: 90px;
  height: 90px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 50%;
  box-shadow: 0 0 0 22px rgba(255,255,255,.035), 0 0 0 44px rgba(255,255,255,.025);
}
.apol-auth-eyebrow {
  color: #15956f;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.apol-auth-story .apol-auth-eyebrow { color: #67f0b8; }
.apol-auth-story h2 { margin: 18px 0 34px; max-width: 360px; font-size: clamp(30px, 4vw, 44px); line-height: 1.04; }
.apol-auth-benefits { display: grid; gap: 14px; position: relative; z-index: 1; }
.apol-auth-benefits div { display: grid; grid-template-columns: 34px 1fr; gap: 10px; align-items: center; }
.apol-auth-benefits b { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 50%; background: rgba(103, 240, 184, .14); color: #67f0b8; font-size: 11px; }
.apol-auth-benefits span { font-size: 14px; font-weight: 760; }
.apol-auth-privacy { margin: auto 0 0; max-width: 280px; color: #a7c9be; font-size: 12px; line-height: 1.5; position: relative; z-index: 1; }
.apol-auth-form { display: flex; flex-direction: column; justify-content: center; background: linear-gradient(180deg, #fff, #f4fbf7); }
.apol-auth-form h2 { margin: 8px 0 6px; font-size: 34px; }
.apol-auth-intro { margin: 0 0 24px; color: #60736b; font-size: 14px; }
.apol-auth-close { position: absolute; top: 18px; right: 18px; display: grid; width: 36px; height: 36px; place-items: center; border: 0; border-radius: 50%; cursor: pointer; font-size: 24px; line-height: 1; }
.apol-auth-close--light { display: none; background: rgba(255,255,255,.1); color: #fff; }
.apol-auth-close--dark { background: #eaf4ef; color: #183c30; }
.apol-auth-google,
.apol-auth-email,
.apol-auth-dev-button,
.apol-auth-redirect {
  width: 100%; min-height: 48px; border-radius: 12px; font-weight: 850; cursor: pointer;
}
.apol-auth-google { border: 1px solid #ccd9d3; background: #fff; color: #14271f; }
.apol-auth-google-g { display: inline-grid; width: 24px; height: 24px; margin-right: 10px; place-items: center; border-radius: 50%; background: linear-gradient(135deg, #4285f4 0 25%, #34a853 25% 50%, #fbbc05 50% 75%, #ea4335 75%); color: #fff; }
.apol-auth-divider { display: flex; align-items: center; gap: 12px; margin: 18px 0; color: #7b8c85; font-size: 11px; text-transform: uppercase; letter-spacing: .1em; }
.apol-auth-divider::before,
.apol-auth-divider::after { content: ''; flex: 1; height: 1px; background: #dbe7e1; }
.apol-auth-label { margin-bottom: 6px; color: #314a40; font-size: 12px; font-weight: 850; }
.apol-auth-input { width: 100%; min-height: 48px; box-sizing: border-box; padding: 10px 13px; border: 1px solid #cadbd3; border-radius: 12px; background: #fff; color: #13271f; font: inherit; }
.apol-auth-input:focus { outline: 3px solid rgba(24, 177, 123, .18); border-color: #18b17b; }
.apol-auth-email { margin-top: 10px; border: 0; background: linear-gradient(135deg, #087658, #0d9d75); color: #fff; }
.apol-auth-google:disabled,
.apol-auth-email:disabled { cursor: not-allowed; opacity: .62; }
.apol-auth-state { display: inline-block; margin-left: 8px; padding: 2px 7px; border-radius: 999px; background: #8a5a00; color: #fff; font-size: 9px; }
.apol-auth-dev { margin-top: 14px; color: #53665e; font-size: 12px; }
.apol-auth-dev summary { cursor: pointer; font-weight: 800; }
.apol-auth-dev .apol-auth-label { display: block; margin-top: 10px; }
.apol-auth-dev-button { margin-top: 8px; border: 0; background: #173e34; color: #fff; }
.apol-auth-redirect { margin-top: 7px; border: 1px solid #cadbd3; background: #edf6f1; color: #173e34; }
.apol-auth-status { min-height: 18px; margin-top: 14px; color: #657770; font-size: 12px; line-height: 1.4; }
.apol-auth-status.is-error { color: #b4233b; }
.apol-auth-terms { margin: 16px 0 0; color: #73847d; font-size: 11px; text-align: center; }

@media (max-width: 700px) {
  .apol-auth-dialog { width: min(100vw - 18px, 520px); max-height: calc(100vh - 18px); overflow-y: auto; border-radius: 18px; }
  .apol-auth-layout { grid-template-columns: 1fr; }
  .apol-auth-story { min-height: 220px; padding: 30px 26px; }
  .apol-auth-story h2 { margin: 12px 0 20px; font-size: 30px; }
  .apol-auth-benefits { gap: 8px; }
  .apol-auth-privacy { margin-top: 22px; }
  .apol-auth-story::after { width: 60px; height: 60px; }
  .apol-auth-close--light { display: grid; }
  .apol-auth-close--dark { display: none; }
  .apol-auth-form { padding: 32px 24px; }
  .apol-auth-form h2 { font-size: 28px; }
}

/* Audience — the guided population digital-twin workspace. */
.view[data-view="audience"].active {
  background:
    radial-gradient(circle at 8% 0, rgba(32, 186, 128, .11), transparent 32%),
    radial-gradient(circle at 92% 15%, rgba(66, 116, 255, .1), transparent 30%),
    #eef7f2;
}
.view[data-view="audience"] > .view-head { display: none; }
.view[data-view="audience"] > #apol-beta-governed-counts,
.view[data-view="audience"] > #apol-location-reference { display: none !important; }
.view[data-view="audience"] .apol-aud .panel-h h3,
.view[data-view="audience"] .apol-aud-lead { color: #10271f; }
.view[data-view="audience"] .apol-aud .panel-h p,
.view[data-view="audience"] .apol-aud-note { color: #526a60; }
.audience-twin {
  --aud-ink: #10271f;
  --aud-muted: #60766c;
  --aud-green: #087b59;
  --aud-lime: #55e5a5;
  --aud-blue: #3267e8;
  --aud-orange: #f0a021;
  display: grid;
  gap: 16px;
  max-width: 1260px;
  margin: 0 auto;
  color: var(--aud-ink);
}
.audience-twin * { box-sizing: border-box; }
.audience-twin-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 180px;
  align-items: center;
  min-height: 220px;
  padding: clamp(28px, 4vw, 48px);
  overflow: hidden;
  border-radius: 24px;
  background:
    radial-gradient(circle at 82% 10%, rgba(99, 242, 184, .24), transparent 26%),
    linear-gradient(135deg, #062b25, #10213d 76%);
  color: #fff;
  box-shadow: 0 20px 50px rgba(19, 64, 50, .16);
}
.audience-twin-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 30px 30px;
  mask-image: linear-gradient(90deg, transparent, #000);
}
.audience-twin-kicker { color: #64efb9; font-size: 11px; font-weight: 950; letter-spacing: .17em; text-transform: uppercase; }
.audience-twin-hero h3 { position: relative; margin: 10px 0 10px; max-width: 760px; font-size: clamp(30px, 4vw, 52px); line-height: 1.02; letter-spacing: -.04em; }
.audience-twin-hero p { position: relative; max-width: 690px; margin: 0; color: #b8d2c9; font-size: 15px; line-height: 1.55; }
.audience-orbit { position: relative; width: 152px; height: 152px; display: grid; place-items: center; border: 1px solid rgba(101, 240, 185, .34); border-radius: 50%; }
.audience-orbit::before,
.audience-orbit::after { content: ''; position: absolute; border: 1px solid rgba(101, 240, 185, .18); border-radius: 50%; }
.audience-orbit::before { inset: 18px; }
.audience-orbit::after { inset: 40px; background: rgba(94, 236, 179, .08); }
.audience-orbit b { position: relative; z-index: 2; color: #70f2bf; font-size: 14px; letter-spacing: .12em; }
.audience-orbit i { position: absolute; z-index: 3; width: 12px; height: 12px; border-radius: 50%; background: #61efb7; box-shadow: 0 0 18px #61efb7; }
.audience-orbit i:nth-child(1) { top: 14px; left: 68px; }
.audience-orbit i:nth-child(2) { right: 17px; bottom: 34px; background: #6e91ff; box-shadow: 0 0 18px #6e91ff; }
.audience-orbit i:nth-child(3) { left: 13px; bottom: 42px; background: #f4ad36; box-shadow: 0 0 18px #f4ad36; }
.audience-twin-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); gap: 16px; }
.audience-builder,
.audience-result,
.audience-blueprint { border: 1px solid #cfe2d8; border-radius: 22px; background: rgba(255,255,255,.92); box-shadow: 0 12px 34px rgba(32, 75, 59, .08); }
.audience-builder,
.audience-result { min-width: 0; padding: 22px; }
.audience-section-title { display: flex; gap: 11px; align-items: center; margin-bottom: 18px; }
.audience-section-title > span { display: grid; width: 35px; height: 35px; flex: 0 0 auto; place-items: center; border-radius: 11px; background: #ddf8eb; color: var(--aud-green); font-size: 11px; font-weight: 950; }
.audience-section-title b,
.audience-section-title small { display: block; }
.audience-section-title b { font-size: 17px; }
.audience-section-title small { margin-top: 2px; color: var(--aud-muted); font-size: 11px; }
.audience-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.audience-fields label { min-width: 0; color: #385047; font-size: 11px; font-weight: 850; }
.audience-fields select { display: block; width: 100%; min-height: 45px; margin-top: 5px; padding: 8px 34px 8px 11px; border: 1px solid #c3d9ce; border-radius: 11px; background: #f8fcfa; color: #15352a; font: inherit; font-size: 12px; font-weight: 750; }
.audience-fields select:focus-visible { outline: 3px solid rgba(32, 190, 133, .2); border-color: #20a979; }
.audience-field-wide { grid-column: 1 / -1; }
.audience-interpretation { margin-top: 13px; padding: 13px 14px; border-left: 4px solid var(--aud-blue); border-radius: 10px; background: #eef3ff; }
.audience-interpretation span,
.audience-interpretation strong,
.audience-interpretation em { display: block; }
.audience-interpretation span { color: #46606f; font-size: 9px; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }
.audience-interpretation strong { margin-top: 5px; color: #17334b; font-size: 13px; line-height: 1.4; }
.audience-interpretation em { margin-top: 5px; color: #668094; font-size: 10px; font-style: normal; }
.audience-primary,
.audience-secondary { min-height: 46px; border: 0; border-radius: 12px; font-weight: 900; cursor: pointer; }
.audience-primary { width: 100%; margin-top: 13px; background: linear-gradient(135deg, #0a815d, #23bc86); color: #fff; box-shadow: 0 8px 20px rgba(9, 129, 93, .19); }
.audience-primary:disabled { cursor: wait; opacity: .68; }
.audience-result { display: flex; flex-direction: column; }
.audience-result-main { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 16px; align-items: center; flex: 1; }
.audience-ring { --audience-progress: 0%; display: grid; width: 144px; height: 144px; place-items: center; border-radius: 50%; background: conic-gradient(var(--aud-green) var(--audience-progress), #dfece6 0); }
.audience-ring::before { content: ''; grid-area: 1/1; width: 112px; height: 112px; border-radius: 50%; background: #fff; }
.audience-ring > div { z-index: 1; grid-area: 1/1; max-width: 92px; text-align: center; }
.audience-ring strong,
.audience-ring span { display: block; }
.audience-ring strong { color: #0d382a; font-size: 21px; line-height: 1; overflow-wrap: anywhere; }
.audience-ring span { margin-top: 6px; color: var(--aud-muted); font-size: 9px; line-height: 1.3; }
.audience-coverage { display: grid; gap: 14px; }
.audience-coverage span { display: flex; justify-content: space-between; gap: 10px; color: #476057; font-size: 10px; font-weight: 800; }
.audience-coverage i { display: block; height: 8px; margin-top: 6px; overflow: hidden; border-radius: 99px; background: #e4eee9; }
.audience-coverage em { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #3267e8, #4fddbb); transition: width .35s ease; }
.audience-result-status { min-height: 56px; margin-top: 17px; padding: 11px 13px; border-radius: 11px; background: #f0f5f2; color: #536b61; font-size: 11px; line-height: 1.45; }
.audience-result-status[data-tone="success"] { background: #e4f8ef; color: #116844; }
.audience-result-status[data-tone="protected"] { background: #fff4dd; color: #76500a; }
.audience-result-status[data-tone="attention"] { background: #fff0ee; color: #8b3328; }
.audience-blueprint { padding: 22px; }
.audience-flow { display: grid; grid-template-columns: repeat(7, auto); gap: 8px; align-items: center; }
.audience-flow > button { display: grid; min-width: 0; min-height: 104px; padding: 12px; border: 1px solid #d6e5de; border-radius: 14px; background: #f7fbf9; color: #17382c; text-align: left; cursor: pointer; }
.audience-flow > button:hover,
.audience-flow > button:focus-visible { border-color: #31b985; background: #eaf8f1; transform: translateY(-2px); outline: 0; }
.audience-flow button > span { display: grid; width: 24px; height: 24px; place-items: center; border-radius: 8px; background: #dff5eb; color: #087b59; font-size: 9px; font-weight: 900; }
.audience-flow button b { align-self: end; margin-top: 10px; font-size: 12px; overflow-wrap: anywhere; }
.audience-flow button small { color: var(--aud-muted); font-size: 9px; }
.audience-flow > i { color: #7da093; font-style: normal; }
.audience-blueprint-actions { display: flex; justify-content: space-between; gap: 12px; align-items: center; margin-top: 16px; }
.audience-secondary { padding: 0 18px; border: 1px solid #0d8963; background: #fff; color: #0d7858; }
.audience-blueprint-actions > span { color: var(--aud-muted); font-size: 10px; }

@media (max-width: 920px) {
  .audience-twin-grid { grid-template-columns: 1fr; }
  .audience-result-main { grid-template-columns: 160px 1fr; }
}
@media (max-width: 640px) {
  .audience-twin { gap: 10px; }
  .audience-twin-hero { grid-template-columns: 1fr; min-height: 0; padding: 24px 20px; border-radius: 17px; }
  .audience-twin-hero h3 { font-size: 31px; }
  .audience-orbit { display: none; }
  .audience-builder,
  .audience-result,
  .audience-blueprint { padding: 17px; border-radius: 16px; }
  .audience-fields { grid-template-columns: 1fr; }
  .audience-field-wide { grid-column: auto; }
  .audience-result-main { grid-template-columns: 1fr; justify-items: center; }
  .audience-coverage { width: 100%; }
  .audience-flow { grid-template-columns: 1fr 20px 1fr; }
  .audience-flow > i:nth-of-type(2) { display: none; }
  .audience-flow > button:nth-of-type(3) { grid-column: 1; }
  .audience-flow > button:nth-of-type(4) { grid-column: 3; }
  .audience-blueprint-actions { align-items: stretch; flex-direction: column; }
  .audience-secondary { width: 100%; }
}

/* Leadership release pages — consistent product workspaces, not engineering dashboards. */
.apol-release{--rel-ink:#10271f;--rel-muted:#5d746a;--rel-green:#087b59;display:grid;gap:16px;max-width:1260px;margin:0 auto;color:var(--rel-ink)}
.apol-release *{box-sizing:border-box}.apol-release-hero{display:flex;align-items:end;justify-content:space-between;gap:20px;padding:28px;border-radius:22px;background:linear-gradient(135deg,#062b25,#10213d);color:#fff;box-shadow:0 18px 44px rgba(17,55,43,.14)}
.apol-release-hero>div>span{color:#62ebb5;font-size:10px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.apol-release-hero h2{margin:7px 0 5px;font-size:clamp(26px,3vw,42px);line-height:1.05;letter-spacing:-.035em}.apol-release-hero p{max-width:760px;margin:0;color:#bdd1ca;font-size:14px;line-height:1.5}.apol-release-hero>b{display:grid;width:76px;height:76px;place-items:center;border:1px solid rgba(99,238,184,.35);border-radius:50%;color:#62ebb5}
.apol-release-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(330px,.9fr);gap:16px}.apol-release-card{min-width:0;padding:21px;border:1px solid #d2e2da;border-radius:18px;background:#fff;box-shadow:0 10px 30px rgba(24,70,53,.07)}.apol-release-card h3{margin:0 0 14px;font-size:18px}.apol-release-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.apol-release-card-head>span{color:var(--rel-muted);font-size:10px;font-weight:800;text-transform:uppercase}
.apol-release label{display:grid;gap:5px;margin:0 0 11px;color:#40584e;font-size:11px;font-weight:800}.apol-release input,.apol-release select,.apol-release textarea{width:100%;min-height:44px;padding:10px 11px;border:1px solid #c6d9cf;border-radius:10px;background:#f9fcfa;color:#17332a;font:inherit;font-size:12px}.apol-release textarea{resize:vertical}.apol-release button{min-height:42px;padding:9px 13px;border:1px solid #bfd5ca;border-radius:10px;background:#fff;color:#174535;font-weight:850;cursor:pointer}.apol-release button:hover,.apol-release button:focus-visible{border-color:#14956a;background:#eaf8f1;outline:3px solid rgba(20,149,106,.16)}.apol-release .apol-release-primary{border:0;background:linear-gradient(135deg,#087b59,#21b77f);color:#fff;box-shadow:0 7px 18px rgba(8,123,89,.18)}.apol-release .apol-release-primary:disabled{opacity:.6;cursor:wait}
.apol-release-tabs,.apol-release-actions,.apol-release-gates{display:flex;flex-wrap:wrap;gap:7px;margin:12px 0}.apol-release-tabs button[aria-pressed="true"]{background:#173b31;color:#fff}.apol-release-preview{min-height:190px;padding:18px;border-radius:14px;background:#f1f6f3;color:#294a3d;white-space:pre-wrap;line-height:1.55}.apol-release-actions{justify-content:flex-end}.apol-release-status{min-height:42px;padding:12px 14px;border-radius:11px;background:#e9f6ef;color:#116544;font-size:12px}.apol-release-status:empty{display:none}.apol-release-status[data-tone="warn"]{background:#fff2dc;color:#7a5005}
.apol-release-cost{display:grid;gap:0;margin:15px 0}.apol-release-cost>div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid #dbe7e1}.apol-release-cost b{font-size:20px}.apol-release-gates span{padding:7px 9px;border-radius:99px;background:#eef5f1;color:#4f675c;font-size:10px;font-weight:800}.apol-release-search>div:first-child{display:grid;grid-template-columns:1fr auto;gap:8px}.apol-release-results,.apol-release-queue{display:grid;margin-top:15px}.apol-release-result,.apol-release-queue button{display:flex;align-items:center;justify-content:space-between;gap:12px;border:0;border-bottom:1px solid #dbe7e1;border-radius:0;background:transparent;text-align:left}.apol-release-result span,.apol-release-result small{display:block}.apol-release-result small{margin-top:3px;color:var(--rel-muted);font-weight:500}.apol-release-result em{color:#18694d;font-size:10px;font-style:normal;text-transform:uppercase}.apol-release-result.selected{background:#e9f8f1}.apol-release-empty{padding:18px 0;color:var(--rel-muted)}
.apol-release-funnel{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.apol-release-funnel button{display:grid;min-height:120px;place-items:center;background:linear-gradient(180deg,#f7f0ff,#eee1ff);color:#6439a0}.apol-release-funnel b{font-size:25px}.apol-release-funnel span{font-size:10px}.apol-release .view-head{display:none}
@media(max-width:760px){.apol-release-grid{grid-template-columns:1fr}.apol-release-hero{align-items:flex-start;padding:22px;flex-direction:column}.apol-release-hero>b{display:none}.apol-release-funnel{grid-template-columns:repeat(2,1fr)}}
@media(max-width:420px){.apol-release{gap:10px}.apol-release-card{padding:16px;border-radius:14px}.apol-release-search>div:first-child{grid-template-columns:1fr}.apol-release-actions{align-items:stretch;flex-direction:column}.apol-release-actions button{width:100%}}
.social-login-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 2px;
}
.social-login-grid button:disabled {
  cursor: not-allowed;
  opacity: .56;
  filter: saturate(.55);
}
.social-login-mount {
  margin-top: 8px;
  min-height: 0;
}
.individual-access-card .session-actions .action,
.individual-access-card .social-login-grid .action {
  min-height: 40px;
}

.nation-dashboard {
  display: grid;
  gap: 12px;
}
.nation-dashboard-head,
.nation-dashboard-split,
.nation-next-actions {
  display: grid;
  gap: 10px;
}
.nation-dashboard-head {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
}
.nation-dashboard-head h2 {
  margin: 3px 0 4px;
  font-size: 24px;
  line-height: 1.15;
}
.nation-dashboard-head p {
  margin: 0;
  max-width: 760px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}
.nation-recommendation {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px 14px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(25,195,125,.45);
  border-radius: 8px;
  background: rgba(3, 72, 53, .32);
}
.nation-recommendation span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.nation-recommendation strong {
  display: block;
  margin-top: 2px;
  color: var(--ink);
  font-size: 20px;
  line-height: 1.15;
}
.nation-recommendation .action {
  grid-row: 1 / span 2;
  grid-column: 2;
  min-width: 110px;
}
.nation-session-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.nation-metrics,
.nation-network-grid,
.nation-attention-grid,
.nation-next-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.nation-network-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.nation-attention-grid.compact {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.nation-attention-grid.compact.response {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.nation-dashboard-split {
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr);
}
.nation-metric,
.nation-network-card,
.nation-attention-card,
.nation-panel,
.nation-row {
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(8, 13, 24, .62);
}
.nation-metric,
.nation-network-card,
.nation-attention-card {
  padding: 11px 12px;
}
.nation-metric span,
.nation-network-card span,
.nation-attention-card span,
.nation-panel .k {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
}
.nation-metric strong,
.nation-network-card strong,
.nation-attention-card strong {
  display: block;
  margin-top: 4px;
  color: var(--ink);
  font-size: 21px;
  line-height: 1.1;
}
.nation-metric em,
.nation-network-card em,
.nation-attention-card em {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  line-height: 1.35;
}
.nation-network-card {
  cursor: pointer;
  text-align: left;
}
.nation-attention-card.as-button {
  width: 100%;
  cursor: pointer;
  text-align: left;
}
.nation-network-card:hover,
.nation-attention-card:hover {
  border-color: rgba(25,195,125,.52);
}
.nation-attention-card.as-button:hover {
  transform: translateY(-1px);
}
.nation-panel {
  padding: 12px;
}
.nation-panel .k {
  color: var(--accent);
  font-family: var(--mono);
  letter-spacing: .13em;
  text-transform: uppercase;
}
.nation-list {
  display: grid;
  gap: 7px;
  margin-top: 8px;
}
.nation-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 10px;
}
.nation-row strong,
.nation-row span {
  min-width: 0;
}
.nation-row span {
  color: var(--muted);
  font-size: 12px;
  text-align: right;
}
.nation-row.muted {
  opacity: .78;
}
.nation-next-actions {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.nation-next-actions .action {
  min-height: 40px;
}

.view { padding: 14px 18px 64px; display: none; animation: fade .25s ease; }
.view.active { display: block; }
@keyframes fade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.action-dock {
  position: fixed;
  right: 20px;
  bottom: 18px;
  z-index: 30;
  width: min(460px, calc(100vw - 40px));
  margin: 0;
  display: grid;
  grid-template-columns: minmax(160px, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 7px 8px;
  border: 1px solid rgba(25,195,125,.34);
  border-radius: 8px;
  background: rgba(10, 17, 32, .94);
  box-shadow: 0 18px 40px rgba(0,0,0,.35);
}
.action-dock[hidden] { display: none; }
.action-dock-main strong,
.action-dock-main span,
.action-dock-main .k { display: block; }
.action-dock-main .k {
  color: var(--accent);
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.action-dock-main strong {
  margin-top: 2px;
  font-size: 12px;
  line-height: 1.25;
}
.action-dock-main span:not(.k) {
  display: none;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
}
.action-dock-routes {
  display: none;
}
.action-dock-routes span {
  min-height: 44px;
  padding: 7px 8px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: rgba(18,29,49,.72);
  color: #d7e3f8;
  font-size: 11px;
  line-height: 1.25;
}
.action-dock-routes b {
  display: block;
  margin-bottom: 3px;
  color: var(--faint);
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.action-dock-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  flex-wrap: wrap;
}
.action-dock-actions .action {
  min-height: 28px;
  padding: 0 9px;
  font-size: 11px;
}
.icon-action {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--panel-2);
  color: var(--muted);
  font-weight: 900;
}

.view-head { margin-bottom: 10px; }
.view-head h2 { margin: 0 0 4px; font-size: 22px; letter-spacing: .2px; }
.view-head p { display: none; margin: 0; color: var(--muted); font-size: 14px; max-width: 900px; }

.page-work-canvas {
  display: none;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin: 0 0 12px;
}
.work-canvas-card {
  min-height: 50px;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  padding: 9px 11px;
  border: 1px solid rgba(25,195,125,.26);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(25,195,125,.09), rgba(124,140,255,.06)),
    rgba(14,22,38,.88);
  color: inherit;
  text-align: left;
  box-shadow: var(--shadow);
}
.work-canvas-card:hover {
  border-color: rgba(25,195,125,.58);
  transform: translateY(-1px);
}
.work-canvas-card span {
  color: var(--accent);
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.work-canvas-card strong {
  color: #f5f8ff;
  font-size: 12px;
  line-height: 1.15;
}
.work-canvas-card small {
  display: none;
}
.work-canvas-card em {
  display: none;
}

.view[data-view="intake"] .hidden-machinery {
  display: none;
}

.input-action-dashboard {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 12px;
}
.input-action-dashboard.secondary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}
.input-action-card,
.input-action-chip {
  border: 1px solid rgba(25,195,125,.28);
  border-radius: 8px;
  background: rgba(15, 35, 38, .72);
  color: var(--ink);
  cursor: pointer;
}
.input-action-card {
  min-height: 56px;
  padding: 11px 12px;
}
.input-action-card strong,
.input-action-card span {
  display: block;
}
.input-action-card strong {
  font-size: 14px;
}
.input-action-card span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
}
.input-action-chip {
  width: auto;
  min-height: 30px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
}
.user-first-home-panel {
  min-height: auto;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  border-color: rgba(25,195,125,.42);
  background:
    linear-gradient(135deg, rgba(25,195,125,.14), rgba(124,140,255,.06) 46%, transparent 100%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.network-os-v1 .page-summary,
.network-os-v1 .page-command-strip,
.network-os-v1 .page-work-canvas,
.network-os-v1 .action-dock {
  display: none !important;
}
.network-os-v1 .view:not(.internal-view) > .view-head {
  display: none !important;
}
.network-os-v1 .view-head p,
.network-os-v1 .reach-people-steps,
.network-os-v1 .quick-steps,
.network-os-v1 .simple-communication-panel > p.muted.small {
  display: none !important;
}
.operator-home-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}
.operator-home-card {
  min-height: 76px;
  padding: 12px;
  border: 1px solid rgba(25,195,125,.34);
  border-radius: 8px;
  background: rgba(12, 29, 37, .78);
  color: var(--ink);
  text-align: left;
}
.operator-home-card.primary-action {
  border-color: rgba(25,195,125,.68);
  background: rgba(14, 49, 45, .9);
}
.operator-home-card:hover {
  border-color: rgba(25,195,125,.78);
  background: rgba(18, 53, 56, .94);
}
.operator-home-card strong,
.operator-home-card span {
  display: block;
}
.operator-home-card strong {
  font-size: 16px;
  line-height: 1.08;
}
.operator-home-card span {
  margin-top: 5px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.3;
}
.network-status-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(25,195,125,.34);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(25,195,125,.10), rgba(124,140,255,.05)),
    rgba(9, 22, 34, .88);
  box-shadow: inset 0 0 0 1px rgba(139, 166, 209, .06);
}
.network-status-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.network-status-head h3 {
  margin: 4px 0 0;
  color: var(--ink);
  font-size: 18px;
  line-height: 1.18;
}
.help-dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin-left: 5px;
  border: 1px solid rgba(139, 166, 209, .34);
  border-radius: 999px;
  color: var(--muted);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  vertical-align: middle;
}
.network-status-alert {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 177, 66, .38);
  border-radius: 8px;
  background: rgba(255, 177, 66, .10);
}
.network-status-alert strong,
.network-status-alert span {
  display: block;
}
.network-status-alert strong {
  color: #ffdca3;
  font-size: 13px;
}
.network-status-alert span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}
.network-status-auth-card {
  gap: 10px;
}
.network-status-auth-form {
  display: grid;
  grid-template-columns: 180px minmax(220px, 1fr) auto minmax(160px, 1fr);
  gap: 10px;
  align-items: end;
}
.network-status-auth-form label {
  display: grid;
  gap: 5px;
}
.network-status-auth-form label span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.network-status-auth-form select,
.network-status-auth-form input {
  min-height: 42px;
  width: 100%;
  border: 1px solid rgba(139, 166, 209, .26);
  border-radius: 8px;
  background: rgba(5, 12, 22, .78);
  color: var(--text);
  font: inherit;
  font-weight: 800;
  padding: 0 12px;
}
.network-status-auth-form button {
  min-height: 42px;
  border: 0;
  border-radius: 8px;
  background: var(--accent);
  color: #02130c;
  cursor: pointer;
  font: inherit;
  font-weight: 900;
  padding: 0 14px;
}
.network-status-auth-result {
  align-self: center;
  color: #ffdca3;
  font-size: 12px;
  font-weight: 800;
}
.network-status-metrics,
.network-inventory-strip,
.audience-library-strip,
.network-status-lists {
  display: grid;
  gap: 8px;
}
.network-status-metrics {
  grid-template-columns: repeat(7, minmax(0, 1fr));
}
.network-inventory-strip {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.audience-library-strip {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.network-status-lists {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  margin-top: 2px;
}
.network-status-metric,
.network-inventory-strip div,
.audience-library-strip div,
.network-list {
  min-height: 62px;
  padding: 10px;
  border: 1px solid rgba(139, 166, 209, .22);
  border-radius: 8px;
  background: rgba(5, 12, 22, .54);
}
.network-status-metric span,
.network-inventory-strip span,
.audience-library-strip span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
}
.network-status-metric strong,
.network-inventory-strip strong,
.audience-library-strip strong {
  display: block;
  margin-top: 6px;
  color: var(--ink);
  font-size: 20px;
  line-height: 1.1;
}
.network-list-title {
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
}
.network-list {
  display: grid;
  gap: 6px;
  min-height: 74px;
}
.network-list-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid rgba(139, 166, 209, .18);
  border-radius: 8px;
  background: rgba(17, 31, 50, .48);
}
.network-list-row strong,
.network-list-row span,
.network-empty-row {
  font-size: 12px;
  line-height: 1.3;
}
.network-list-row strong {
  color: var(--ink);
}
.network-list-row span,
.network-empty-row {
  color: var(--muted);
}
.recent-upload-row {
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
}
.operator-workspace-shell {
  display: grid;
  gap: 10px;
}
.operator-flowbar {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
.operator-flow-step,
.operator-action-card {
  border: 1px solid rgba(139, 166, 209, .24);
  border-radius: 8px;
  background: rgba(9, 22, 34, .82);
  color: var(--ink);
  text-align: left;
}
.operator-flow-step {
  min-height: 82px;
  padding: 13px;
}
.operator-flow-step.primary-step,
.operator-action-card:hover,
.operator-flow-step:hover {
  border-color: rgba(25,195,125,.62);
  background: rgba(14, 49, 45, .9);
}
.operator-flow-step strong,
.operator-flow-step span,
.operator-action-card strong,
.operator-action-card span {
  display: block;
}
.operator-flow-step strong {
  font-size: 18px;
}
.operator-flow-step span,
.operator-action-card span {
  margin-top: 7px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.operator-gate-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.operator-action-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.operator-action-grid.five-actions {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.operator-action-grid.four-actions {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.operator-action-grid.three-actions {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.operator-action-grid.two-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.view.workspace-direct-mode .operator-action-grid,
.view.workspace-direct-mode .operator-flowbar {
  display: none;
}
.view[data-view="network"].workspace-direct-mode .operator-action-grid {
  display: grid;
}
.view.workspace-direct-mode .workspace-active-panel {
  margin-top: 0;
}
.workspace-change-action {
  margin-left: auto;
}
.operator-action-card {
  min-height: 76px;
  padding: 12px;
}
.operator-action-card.primary-action {
  border-color: rgba(25,195,125,.68);
  background: rgba(14, 49, 45, .9);
}
.operator-action-card.active {
  border-color: rgba(25,195,125,.82);
  background: rgba(12, 65, 54, .96);
  box-shadow: inset 0 0 0 1px rgba(25,195,125,.22);
}
.operator-action-card strong {
  font-size: 16px;
  line-height: 1.14;
}
.operator-workspace-status {
  min-height: 46px;
  display: flex;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: rgba(9, 22, 34, .72);
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
}
.workspace-active-panel {
  min-height: 0;
  padding: 10px;
  border: 1px solid rgba(25,195,125,.32);
  border-radius: 8px;
  background: rgba(9, 22, 34, .9);
  box-shadow: inset 0 0 0 1px rgba(139, 166, 209, .06);
}
.workspace-active-head {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: baseline;
  margin-bottom: 8px;
}
.workspace-active-head h3 {
  margin: 0;
  font-size: 18px;
  line-height: 1.15;
}
.workspace-upload-hero {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(220px, .55fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(25,195,125,.48);
  border-radius: 8px;
  background: rgba(11, 53, 47, .9);
}
.workspace-upload-hero strong {
  display: block;
  margin-top: 5px;
  color: var(--ink);
  font-size: 24px;
  line-height: 1;
}
.workspace-upload-hero small {
  display: block;
  margin-top: 6px;
  color: var(--muted);
}
.workspace-import-status {
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(37, 99, 235, .38);
  border-radius: 8px;
  background: rgba(37, 99, 235, .12);
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.4;
}
.workspace-import-status.ok {
  border-color: rgba(16, 185, 129, .58);
  background: rgba(16, 185, 129, .13);
  color: var(--ink);
}
.workspace-import-status.warn {
  border-color: rgba(245, 158, 11, .58);
  background: rgba(245, 158, 11, .13);
  color: var(--ink);
}
.workspace-import-status.bad {
  border-color: rgba(244, 63, 94, .62);
  background: rgba(244, 63, 94, .13);
  color: var(--ink);
}
.workspace-file-input {
  display: grid;
  gap: 7px;
  color: var(--ink);
  font-weight: 900;
  min-width: min(100%, 220px);
  touch-action: manipulation;
}
.workspace-file-input input {
  width: 100%;
  min-height: 48px;
  padding: 10px;
  border: 1px solid rgba(139, 166, 209, .34);
  border-radius: 8px;
  background: rgba(5, 12, 22, .9);
  color: var(--ink);
  touch-action: manipulation;
}
.workspace-import-button {
  min-height: 54px;
  min-width: 160px;
  font-size: 15px;
  touch-action: manipulation;
}
.workspace-secondary-upload {
  margin-top: 8px;
}
.workspace-form,
.workspace-result-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.workspace-form-panel {
  display: grid;
  gap: 8px;
}
.workspace-advanced {
  border: 1px solid rgba(139, 166, 209, .18);
  border-radius: 8px;
  background: rgba(5, 12, 22, .42);
  padding: 8px 10px;
}
.workspace-advanced summary {
  cursor: pointer;
  color: var(--muted);
  font-weight: 800;
}
.workspace-advanced[open] summary {
  margin-bottom: 10px;
}
.communication-primary-form {
  grid-template-columns: minmax(0, 2fr) minmax(180px, .8fr);
}
.communication-delivery-form {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.workspace-form label,
.workspace-wide-label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
}
.workspace-form input,
.workspace-form select,
.workspace-wide-label textarea,
.workspace-textarea,
.workspace-search-row input {
  width: 100%;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: rgba(5, 12, 22, .9);
  color: var(--ink);
  font: inherit;
  padding: 9px 10px;
}
/* APOL-AUDIENCE-FIT — the Audience Location Research controls, contained at every width.
 *
 * MEASURED DEFECT (390x844, signed out, commit cc525dd): INPUT#apt-location-q had box
 * {x:256, w:203, right:459} against a 390px viewport. 69px of the field was off-screen and
 * unreachable, and elementFromPoint could not be asked about a single pixel of it beyond x=390.
 *
 * MECHANISM, measured rather than assumed. The label is fine: it is a grid item of
 * .workspace-result-grid, whose tracks are repeat(3, minmax(0, 1fr)) -- 106.656px each at this
 * width -- and it measured exactly 107px wide, right=363, inside the viewport. What overflowed
 * was the CONTROL INSIDE it. `input` and `select` have an intrinsic width from their default
 * `size` (20 for this input -> 203px) and nothing here gave them a width, so they laid out at
 * their intrinsic size and spilled out of a 107px label.
 *
 * .workspace-form already solves this for its own labels ("width: 100%" a few rules above), and
 * .workspace-result-grid shares only the grid declaration with it -- never the control rules.
 * That gap is the whole defect.
 *
 * Two remedies commonly suggested for this shape are NO-OPS here and were verified as such
 * before this rule was written, rather than pasted in:
 *   - `min-width: 0` on the label. min-width:auto only resolves to an automatic minimum size
 *     when the item spans a track whose MIN sizing function is auto. These tracks are
 *     minmax(0, 1fr), so it already resolves to zero. Adding it to the label moved nothing:
 *     the input stayed w=203 right=459.
 *   - `box-sizing: border-box`. Already global from `* { box-sizing: border-box; }` at the top
 *     of this file; the input computed border-box before any change.
 * `width: 100%` on the control alone is what fixes it (measured: w=203 -> w=107, right=363), so
 * that one declaration is all this rule carries. Neither no-op is repeated here.
 *
 * Scoped to this grid, not to every .workspace-result-grid on the console, because the other
 * twenty-odd uses of that class are on signed-in surfaces this change was not able to exercise.
 */
.location-filter-grid > label > input,
.location-filter-grid > label > select {
  width: 100%;
}

/* Contained is not the same as usable. With the rule above, the three filters at 390px are
 * correct 107px boxes inside the viewport -- and a 107px SELECT clips its own chosen option
 * mid-word ("All cited State|"), so the control tells the reader something other than what it
 * holds. The three-column track is what is wrong at this width, not the controls in it, so the
 * row becomes one column per control on a phone. Scoped to this grid: .workspace-result-grid
 * keeps its three columns everywhere else.
 */
@media (max-width: 640px) {
  .location-filter-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* The resolved states of #apt-location-metrics are a sentence, not a metric. A sentence dropped
 * into one 107px column of a three-column grid wraps into a column of single words, so it spans
 * the row it is the only occupant of. */
.location-reference-state {
  grid-column: 1 / -1;
  color: var(--muted);
}
.workspace-actions,
.workspace-gate-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.workspace-tool-card {
  min-height: 86px;
  padding: 10px;
  border: 1px solid rgba(139, 166, 209, .22);
  border-radius: 8px;
  background: rgba(17, 31, 50, .72);
  color: var(--ink);
  text-align: left;
}
.workspace-tool-card strong,
.workspace-tool-card small {
  display: block;
}
.workspace-tool-card strong {
  margin-top: 6px;
  font-size: 18px;
  line-height: 1.1;
}
.workspace-tool-card small {
  margin-top: 6px;
  color: var(--muted);
  line-height: 1.28;
}
.workspace-queue {
  display: grid;
  gap: 6px;
  margin-top: 8px;
}
.workspace-row {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) minmax(220px, 2fr) auto;
  gap: 12px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid rgba(139, 166, 209, .18);
  border-radius: 8px;
  background: rgba(5, 12, 22, .56);
}
.workspace-row span,
.workspace-row em,
.workspace-note,
.workspace-empty {
  color: var(--muted);
}
.workspace-row em {
  font-style: normal;
  font-size: 12px;
  font-weight: 800;
}
.workspace-empty,
.workspace-note {
  padding: 10px;
  border: 1px dashed rgba(139, 166, 209, .28);
  border-radius: 8px;
  background: rgba(5, 12, 22, .42);
}
.audience-ready-panel {
  display: grid;
  grid-template-columns: minmax(180px, .35fr) minmax(0, 1fr);
  gap: 8px;
  align-items: stretch;
  padding: 10px;
  border: 1px solid rgba(25,195,125,.46);
  border-radius: 8px;
  background: rgba(8, 43, 39, .8);
}
.audience-ready-main {
  display: grid;
  align-content: center;
  min-height: 82px;
  padding: 10px;
  border: 1px solid rgba(25,195,125,.34);
  border-radius: 8px;
  background: rgba(5, 12, 22, .5);
}
.audience-ready-main strong {
  display: block;
  margin-top: 2px;
  font-size: 30px;
  line-height: 1;
}
.audience-ready-main small {
  color: var(--muted);
  font-weight: 750;
}
.audience-ready-facts,
.network-compact-metrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}
.audience-ready-facts div,
.network-compact-metrics div {
  min-height: 60px;
  padding: 8px;
  border: 1px solid rgba(139, 166, 209, .18);
  border-radius: 8px;
  background: rgba(5, 12, 22, .52);
}
.audience-ready-facts span,
.network-compact-metrics span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.audience-ready-facts strong,
.network-compact-metrics strong {
  display: block;
  margin-top: 5px;
  color: var(--ink);
  font-size: 18px;
  line-height: 1.05;
}
.audience-next-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.audience-detail-collapse {
  margin-top: 10px;
}
.compact-metric-grid .workspace-tool-card {
  min-height: 92px;
}
.network-status-compact {
  display: grid;
  gap: 10px;
}
.network-status-compact summary {
  display: grid;
  grid-template-columns: auto minmax(180px, .3fr) minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  cursor: pointer;
}
.network-status-compact summary strong {
  font-size: 18px;
}
.network-status-compact summary small {
  color: var(--muted);
  font-weight: 750;
}
.network-status-compact summary em {
  font-style: normal;
  justify-self: end;
  color: var(--accent);
  font-size: 11px;
  font-weight: 850;
}
.network-status-lists.compact {
  margin-top: 10px;
}
.workspace-message-preview {
  margin-top: 12px;
  padding: 14px;
  border: 1px solid rgba(25,195,125,.28);
  border-radius: 8px;
  background: rgba(6, 31, 30, .72);
}
.workspace-message-preview p {
  margin: 8px 0 0;
  color: var(--muted);
  line-height: 1.45;
}
.workspace-search-panel {
  display: grid;
  gap: 12px;
}
.workspace-search-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}
.agentic-result-grid {
  margin-top: 12px;
}
.agentic-work-card {
  display: grid;
  gap: 8px;
  min-height: 170px;
}
.agentic-empty {
  display: grid;
  gap: 4px;
}
.search-start-grid {
  width: 100%;
}
.network-build-journey {
  display: grid;
  grid-template-columns: repeat(9, minmax(0, 1fr));
  gap: 8px;
  margin: 2px 0 16px;
}
.network-build-step {
  min-height: 142px;
  padding: 12px;
  border: 1px solid rgba(139, 166, 209, .24);
  border-radius: 8px;
  background: rgba(9, 22, 34, .78);
  color: var(--ink);
  text-align: left;
}
.network-build-step.primary-step {
  border-color: rgba(25,195,125,.58);
  background: linear-gradient(180deg, rgba(14, 49, 45, .92), rgba(10, 26, 36, .92));
}
.network-build-step:hover {
  border-color: rgba(25,195,125,.76);
  background: rgba(14, 36, 46, .96);
}
.network-build-step em,
.network-build-step strong,
.network-build-step span {
  display: block;
}
.network-build-step em {
  width: 32px;
  height: 24px;
  margin-bottom: 10px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(132, 159, 255, .15);
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
}
.network-build-step.primary-step em {
  background: rgba(25,195,125,.18);
  color: var(--accent);
}
.network-build-step strong {
  font-size: 14px;
  line-height: 1.18;
}
.network-build-step span {
  margin-top: 8px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.36;
}
.user-first-action-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}
.user-first-action-card {
  min-height: 164px;
  padding: 18px;
  border: 1px solid rgba(25,195,125,.32);
  border-radius: 8px;
  background: rgba(12, 29, 37, .74);
  color: var(--ink);
  text-align: left;
}
.user-first-action-card.primary-action {
  border-color: rgba(25,195,125,.62);
  background: rgba(14, 49, 45, .88);
}
.user-first-action-card:hover {
  border-color: rgba(25,195,125,.72);
  background: rgba(18, 53, 56, .92);
}
.user-first-action-card strong,
.user-first-action-card span {
  display: block;
}
.user-first-action-card strong {
  font-size: 22px;
  line-height: 1.12;
}
.user-first-action-card span {
  margin-top: 12px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.42;
}
.user-first-note {
  max-width: 900px;
  margin: 16px 0 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}
.network-operator-panel {
  border-color: rgba(25,195,125,.36);
  background:
    linear-gradient(135deg, rgba(25,195,125,.10), rgba(124,140,255,.06) 48%, transparent 100%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.network-action-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
.network-action-card {
  min-height: 116px;
  padding: 14px;
  border: 1px solid rgba(25,195,125,.30);
  border-radius: 8px;
  background: rgba(15, 35, 38, .66);
  color: var(--ink);
  text-align: left;
}
.network-action-card:hover {
  border-color: rgba(25,195,125,.56);
  background: rgba(18, 45, 48, .88);
}
.network-action-card strong,
.network-action-card span,
.audience-doctrine strong,
.audience-doctrine span {
  display: block;
}
.network-action-card strong {
  font-size: 16px;
}
.network-action-card span {
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.38;
}
.audience-doctrine {
  margin-top: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(255,180,66,.28);
  border-radius: 8px;
  background: rgba(255,180,66,.08);
}
.audience-doctrine strong {
  color: #ffdca3;
  font-size: 13px;
}
.audience-doctrine span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.view[data-view="input"] .page-map,
#activation-panel > p,
#universal-input-panel > p {
  display: none;
}
.advanced-intake {
  margin-top: 10px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: rgba(5, 10, 20, .28);
}
.advanced-intake summary {
  min-height: 34px;
  display: flex;
  align-items: center;
  padding: 0 11px;
  color: var(--muted);
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
}
.advanced-intake .intake-grid {
  padding: 0 11px 11px;
}

.simple-communication-panel {
  border-color: rgba(25,195,125,.34);
  background:
    linear-gradient(135deg, rgba(25,195,125,.10), transparent 44%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.reach-people-steps {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}
.reach-step-card {
  min-height: 78px;
  padding: 12px;
  border: 1px solid rgba(25,195,125,.28);
  border-radius: 8px;
  background: rgba(15, 35, 38, .66);
  color: var(--ink);
  text-align: left;
}
.reach-step-card strong,
.reach-step-card span {
  display: block;
}
.reach-step-card strong {
  color: var(--accent);
  font-family: var(--mono);
  font-size: 11px;
  text-transform: uppercase;
}
.reach-step-card span {
  margin-top: 6px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.quick-steps,
.quick-result-strip,
.quick-empty {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}
.quick-result-strip {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
.quick-step-card,
.quick-preview-card,
.quick-message-card,
.quick-sample-row {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(18, 29, 49, .82);
  color: var(--ink);
  text-align: left;
}
.quick-step-card {
  min-height: 64px;
  padding: 12px;
}
.quick-step-card strong,
.quick-step-card span,
.quick-preview-card strong,
.quick-preview-card span,
.quick-preview-card em,
.quick-preview-card small {
  display: block;
}
.quick-step-card strong {
  color: #f5f8ff;
  font-size: 14px;
}
.quick-step-card span,
.quick-preview-card em,
.quick-preview-card small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.quick-preview-card {
  min-height: 132px;
  padding: 14px;
}
.quick-preview-card .k,
.quick-message-card .k {
  display: block;
  margin-bottom: 8px;
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}
.quick-preview-card strong {
  margin-bottom: 6px;
  font-size: 22px;
  line-height: 1.1;
}
.quick-message-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.quick-message-card {
  min-height: 180px;
  padding: 14px;
}
.quick-message-card .msg {
  min-height: 132px;
}
.quick-audience-sample {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}
.quick-audience-why {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: 12px;
  margin: 0 0 12px;
}
.quick-audience-why .quick-message-card {
  min-height: 128px;
}
.quick-sample-row {
  min-height: 66px;
  padding: 10px;
}
.quick-sample-row strong,
.quick-sample-row span {
  display: block;
}
.quick-sample-row strong {
  font-size: 12px;
}
.quick-sample-row span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.3;
}

/* ---- Panels & grid ---- */
.grid { display: grid; gap: 16px; }
.grid.cols-2 { grid-template-columns: repeat(2, 1fr); }
.grid.cols-3 { grid-template-columns: repeat(3, 1fr); }
.grid.cols-4 { grid-template-columns: repeat(4, 1fr); }
.grid.cols-6 { grid-template-columns: repeat(3, 1fr); }

.panel {
  background: linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 16px;
  box-shadow: var(--shadow);
}
.panel.tap { cursor: pointer; transition: transform .12s, border-color .15s; }
.panel.tap:hover { transform: translateY(-2px); border-color: rgba(124,140,255,.4); }
.row.tap,
.gate-row.tap,
.step-card.tap,
.digest-mini.tap,
.loop-step.tap,
.map-cell.tap,
.agent-live.tap,
.pipeline-grid > div.tap,
.hero-metrics > div.tap,
.mini-metric.tap,
.page-command-card.tap,
.doctrine-card.tap { cursor: pointer; transition: border-color .15s, transform .12s, background .15s; }
.row.tap:hover,
.gate-row.tap:hover,
.step-card.tap:hover,
.digest-mini.tap:hover,
.loop-step.tap:hover,
.map-cell.tap:hover,
.agent-live.tap:hover,
.pipeline-grid > div.tap:hover,
.hero-metrics > div.tap:hover,
.mini-metric.tap:hover,
.page-command-card.tap:hover,
.doctrine-card.tap:hover { border-color: rgba(124,140,255,.4); transform: translateY(-1px); }
.as-button {
  width: 100%;
  display: block;
  text-align: left;
  color: inherit;
  font: inherit;
}
.panel-h { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.panel-h .k { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--faint); font-family: var(--mono); }
.panel-h h3 { margin: 0; font-size: 16px; font-weight: 700; }
.panel-h .right { margin-left: auto; }

.metric { font-size: 30px; font-weight: 800; letter-spacing: -.5px; line-height: 1; }
.metric.sm { font-size: 22px; }
.metric-label { font-size: 12px; color: var(--muted); margin-top: 6px; }
.metric-row { display: flex; gap: 26px; flex-wrap: wrap; }
.mini-metric {
  min-height: 132px;
  padding: 14px;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-sm);
  background: var(--panel-3);
}
.mini-metric h3 { margin: 8px 0 5px; font-size: 14px; }
.mini-metric p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.35; }
.mini-metric .k { display: block; color: var(--faint); font-family: var(--mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 8px; }

.aol-operating-run-shell {
  border-color: rgba(25, 195, 125, .32);
  background:
    linear-gradient(135deg, rgba(25, 195, 125, .08), transparent 42%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.population-utility-run-shell {
  display: block;
}
.population-utility-answer {
  border-color: rgba(25, 195, 125, .36);
}
.population-utility-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.population-utility-card {
  min-height: 142px;
  padding: 14px;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-sm);
  background: rgba(15, 28, 50, .78);
}
.population-utility-card .k {
  display: block;
  margin-bottom: 10px;
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.population-utility-card strong {
  display: block;
  margin-bottom: 8px;
  font-size: 20px;
  line-height: 1.15;
}
.population-utility-card span,
.population-utility-card small {
  display: block;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.population-utility-card small {
  margin-top: 10px;
  color: var(--faint);
}
.network-score-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.population-path-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
.population-path-step {
  min-height: 118px;
  padding: 12px;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-sm);
  background: var(--panel-3);
}
.population-path-step b {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin-bottom: 10px;
  border-radius: 8px;
  background: rgba(124, 140, 255, .14);
  color: var(--muted);
  font-family: var(--mono);
  font-size: 12px;
}
.population-path-step strong {
  display: block;
  margin-bottom: 6px;
  font-size: 13px;
}
.population-path-step span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.35;
}
.population-path-step.active {
  border-color: rgba(25, 195, 125, .36);
  background: rgba(25, 195, 125, .08);
}
.population-path-step.review,
.population-path-step.next {
  border-color: rgba(255, 177, 66, .28);
}
.population-path-step.held {
  border-color: rgba(255, 93, 122, .28);
}

.hero-network {
  min-height: 180px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .9fr);
  gap: 18px;
  align-items: stretch;
}
.hero-copy {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(25,195,125,.16), transparent 38%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
  border: 1px solid rgba(25,195,125,.28);
  border-radius: var(--radius);
  padding: 20px;
  box-shadow: var(--shadow);
}
.hero-copy::after { display: none; }
.eyebrow {
  color: var(--accent);
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.hero-copy h2 {
  max-width: 760px;
  margin: 12px 0 8px;
  font-size: 34px;
  line-height: 1.08;
  letter-spacing: 0;
}
.hero-copy p {
  max-width: 780px;
  color: #b7c6e5;
  font-size: 13px;
  margin: 0;
}
.hero-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }
.page-map {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.page-map-card {
  min-height: 82px;
  display: flex;
  flex-direction: column;
  gap: 7px;
  justify-content: center;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--panel-2);
  color: var(--ink);
  text-align: left;
}
.page-map-card:hover {
  border-color: rgba(25,195,125,.45);
  background: var(--panel-3);
}
.page-map-card strong { font-size: 14px; }
.page-map-card span { color: var(--muted); font-size: 12px; line-height: 1.35; }
.delivery-plan-grid {
  display: grid;
  grid-template-columns: minmax(260px, .85fr) minmax(0, 1.15fr);
  gap: 16px;
}
.delivery-plan-grid > .panel:nth-child(n + 3) {
  grid-column: span 1;
}
.user-layer-detail .panel {
  min-height: 190px;
}
.action {
  min-height: 40px;
  padding: 0 14px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--panel-3);
  color: var(--ink);
  font-weight: 800;
}
.action.primary {
  background: var(--accent);
  color: #04130c;
  border-color: var(--accent);
}
.action.danger {
  color: var(--bad);
  border-color: rgba(239,90,111,.35);
  background: var(--bad-soft);
}
.hero-metrics {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.hero-metrics div {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 146px;
  padding: 20px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
  box-shadow: var(--shadow);
}
.hero-metrics span {
  font-size: 34px;
  line-height: 1;
  font-weight: 900;
}
.hero-metrics small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.operating-doctrine-panel {
  border-color: rgba(25,195,125,.28);
}
.doctrine-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.network-definition-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
.network-definition-card {
  min-height: 116px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7, 12, 22, .54);
  color: inherit;
}
.network-definition-card strong {
  display: block;
  margin-bottom: 8px;
  color: #f5f8ff;
  font-size: 13px;
  line-height: 1.25;
}
.network-definition-card span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.38;
}
.doctrine-card {
  min-height: 118px;
  padding: 15px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(8, 13, 24, .46);
}
.doctrine-card strong {
  display: block;
  margin-bottom: 9px;
  color: #f5f8ff;
  font-size: 14px;
  line-height: 1.25;
}
.doctrine-card span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.value-card h3 { margin: 10px 0 6px; font-size: 17px; }
.value-card p, .rollout p { margin: 0; color: var(--muted); font-size: 13px; }
.live-value {
  min-height: 168px;
  border-color: rgba(25,195,125,.22);
}
.today-value-board-panel {
  border-color: rgba(25,195,125,.34);
  background:
    linear-gradient(135deg, rgba(25,195,125,.09), transparent 42%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.today-value-board {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 10px;
}
.today-value-card {
  min-height: 188px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px;
  border: 1px solid rgba(25,195,125,.22);
  border-radius: 8px;
  background: rgba(7, 12, 22, .68);
  color: inherit;
  text-align: left;
}
.today-value-card:hover {
  border-color: rgba(25,195,125,.62);
  background: rgba(14, 29, 41, .94);
}
.today-value-card .k {
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.today-value-card strong {
  color: #f5f8ff;
  font-size: 28px;
  line-height: 1;
}
.today-value-card em {
  min-height: 38px;
  color: var(--ink);
  font-size: 13px;
  font-style: normal;
  font-weight: 750;
  line-height: 1.2;
}
.today-value-card small {
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.32;
}
.today-route {
  margin-top: auto;
  color: var(--accent);
  font-size: 12px;
  font-weight: 800;
}
.today-agents {
  color: var(--faint);
  font-size: 10.5px;
  line-height: 1.35;
}
.today-agents b {
  color: var(--indigo);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.value-inventory-panel {
  border-color: rgba(245,166,35,.32);
  background:
    linear-gradient(135deg, rgba(245,166,35,.08), transparent 42%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.value-inventory-board {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.value-inventory-summary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.utility-proof-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.utility-proof-card {
  min-height: 118px;
  padding: 13px;
  border: 1px solid rgba(25,195,125,.28);
  border-radius: 8px;
  background: rgba(7, 12, 22, .66);
  color: inherit;
  text-align: left;
}
.utility-proof-card:hover {
  border-color: rgba(25,195,125,.62);
  background: rgba(14,29,41,.92);
}
.utility-proof-card span,
.utility-proof-card strong,
.utility-proof-card em,
.utility-proof-card small {
  display: block;
}
.utility-proof-card span {
  color: var(--accent);
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.utility-proof-card strong {
  margin-top: 8px;
  color: #f5f8ff;
  font-size: 24px;
  line-height: 1;
}
.utility-proof-card em {
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}
.utility-proof-card small {
  margin-top: 8px;
  color: var(--faint);
  font-size: 11px;
  line-height: 1.3;
}
.utility-proof-run-panel {
  border-color: rgba(25,195,125,.36);
  background:
    linear-gradient(135deg, rgba(25,195,125,.09), transparent 44%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.utility-proof-run-board {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.utility-proof-run-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.utility-proof-run-card {
  min-height: 142px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px;
  border: 1px solid rgba(25,195,125,.28);
  border-radius: 8px;
  background: rgba(7, 12, 22, .68);
  color: inherit;
  text-align: left;
}
.utility-proof-run-card:hover {
  border-color: rgba(25,195,125,.66);
  background: rgba(14,29,41,.94);
}
.utility-proof-run-card.blocked {
  border-color: rgba(255,93,108,.42);
}
.utility-proof-run-card.ready {
  border-color: rgba(25,195,125,.7);
}
.utility-proof-run-card span {
  color: var(--accent);
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.utility-proof-run-card strong {
  color: #f5f8ff;
  font-size: 25px;
  line-height: 1;
}
.utility-proof-run-card em {
  color: var(--ink);
  font-size: 12.5px;
  font-style: normal;
  line-height: 1.35;
}
.utility-proof-run-card small {
  margin-top: auto;
  color: var(--faint);
  font-size: 11px;
  line-height: 1.35;
}
.utility-proof-run-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.utility-proof-run-rule {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}
.utility-progress {
  height: 7px;
  margin-top: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
}
.utility-progress span {
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--accent), #f5a623);
}
.inventory-north-star,
.inventory-doctrine-card {
  min-height: 124px;
  padding: 14px;
  border: 1px solid rgba(245,166,35,.26);
  border-radius: 8px;
  background: rgba(7, 12, 22, .62);
  color: inherit;
  text-align: left;
}
.inventory-north-star:hover,
.inventory-doctrine-card:hover,
.value-inventory-card:hover {
  border-color: rgba(245,166,35,.62);
  background: rgba(25, 31, 42, .94);
}
.inventory-north-star .k,
.inventory-doctrine-card .k,
.value-inventory-card .k {
  display: block;
  color: var(--warn);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.inventory-north-star strong,
.inventory-doctrine-card strong {
  display: block;
  margin-top: 7px;
  color: #f5f8ff;
  font-size: 16px;
  line-height: 1.2;
}
.inventory-north-star em,
.inventory-doctrine-card em {
  display: block;
  margin-top: 7px;
  color: var(--muted);
  font-size: 12.5px;
  font-style: normal;
  line-height: 1.35;
}
.inventory-north-star small {
  display: block;
  margin-top: 8px;
  color: var(--faint);
  font-size: 11.5px;
  line-height: 1.35;
}
.value-inventory-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 10px;
}
.value-inventory-card {
  min-height: 168px;
  display: flex;
  flex-direction: column;
  gap: 7px;
  padding: 12px;
  border: 1px solid rgba(245,166,35,.22);
  border-radius: 8px;
  background: rgba(7, 12, 22, .68);
  color: inherit;
  text-align: left;
}
.value-inventory-card strong {
  color: #f5f8ff;
  font-size: 26px;
  line-height: 1;
}
.value-inventory-card em {
  min-height: 40px;
  color: var(--ink);
  font-size: 12.5px;
  font-style: normal;
  font-weight: 750;
  line-height: 1.22;
}
.value-inventory-card small {
  margin-top: auto;
  color: var(--muted);
  font-size: 10.8px;
  line-height: 1.28;
}
.inventory-progress {
  width: 100%;
  height: 6px;
  border-radius: 999px;
  background: rgba(245,166,35,.12);
  overflow: hidden;
}
.inventory-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--warn), var(--accent));
}
.value-inventory-doctrine {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.value-verification-workspace {
  border-color: rgba(25,195,125,.34);
  background:
    linear-gradient(135deg, rgba(25,195,125,.08), transparent 40%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.value-verification-board {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.value-verification-summary {
  display: grid;
  grid-template-columns: minmax(280px, .9fr) 1.4fr;
  gap: 10px;
}
.value-verification-north,
.value-proof-card,
.value-verification-card {
  min-height: 126px;
  padding: 14px;
  border: 1px solid rgba(25,195,125,.26);
  border-radius: 8px;
  background: rgba(7, 12, 22, .66);
  color: inherit;
  text-align: left;
}
.value-verification-north:hover,
.value-proof-card:hover,
.value-verification-card:hover {
  border-color: rgba(25,195,125,.62);
  background: rgba(14,29,41,.92);
}
.value-verification-north .k,
.value-proof-card span,
.value-verification-card span {
  display: block;
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}
.value-verification-north strong,
.value-proof-card strong,
.value-verification-card strong {
  display: block;
  margin-top: 8px;
  color: #f5f8ff;
  font-size: 18px;
  line-height: 1.16;
}
.value-proof-card strong {
  font-size: 14px;
}
.value-verification-north em,
.value-verification-card em {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 12.5px;
  font-style: normal;
  line-height: 1.35;
}
.value-verification-north small,
.value-verification-card small {
  display: block;
  margin-top: 9px;
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.32;
}
.value-proof-grid,
.value-verification-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.value-verification-grid.compact {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.value-verification-card.ready {
  border-color: rgba(25,195,125,.52);
  background: rgba(15, 47, 38, .52);
}
.value-verification-card.blocked {
  border-color: rgba(255,184,77,.46);
  background: rgba(48, 35, 17, .42);
}
.inventory-chip-row,
.exchange-loop-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.inventory-chip,
.exchange-loop-chip {
  min-height: 26px;
  padding: 0 9px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: rgba(18, 29, 49, .82);
  color: var(--ink);
  font-size: 10.5px;
  font-weight: 800;
}
.inventory-chip:hover,
.exchange-loop-chip:hover {
  border-color: rgba(25,195,125,.45);
  color: var(--accent);
}
.success-model-panel {
  border-color: rgba(25,195,125,.3);
  background:
    linear-gradient(135deg, rgba(25,195,125,.08), transparent 48%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.success-model-board,
.inventory-builder-board {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.success-model-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 9px;
}
.success-chain-card,
.scoreboard-metric,
.success-priority,
.builder-priority,
.builder-milestone-card,
.builder-work-card,
.builder-loop-step {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7, 12, 22, .68);
  color: inherit;
  text-align: left;
}
.success-chain-card {
  min-height: 126px;
  padding: 12px;
}
.success-chain-card:hover,
.scoreboard-metric:hover,
.success-priority:hover,
.builder-priority:hover,
.builder-milestone-card:hover,
.builder-work-card:hover,
.builder-loop-step:hover {
  border-color: rgba(25,195,125,.55);
  background: rgba(14,29,41,.9);
}
.success-chain-card span,
.success-chain-card strong,
.success-chain-card em,
.success-chain-card small,
.builder-milestone-card span,
.builder-milestone-card strong,
.builder-milestone-card em,
.builder-milestone-card small,
.builder-work-card span,
.builder-work-card strong,
.builder-work-card em,
.builder-work-card small {
  display: block;
}
.success-chain-card span,
.builder-milestone-card span,
.builder-work-card span {
  color: var(--accent);
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.success-chain-card strong,
.builder-milestone-card strong {
  margin-top: 8px;
  color: #f5f8ff;
  font-size: 24px;
  line-height: 1;
}
.success-chain-card em,
.builder-milestone-card em,
.builder-work-card em {
  margin-top: 8px;
  color: var(--ink);
  font-size: 12px;
  font-style: normal;
  font-weight: 760;
  line-height: 1.25;
}
.success-chain-card small,
.builder-milestone-card small,
.builder-work-card small {
  margin-top: 8px;
  color: var(--muted);
  font-size: 10.8px;
  line-height: 1.3;
}
.success-scoreboard,
.inventory-builder-summary {
  display: grid;
  grid-template-columns: minmax(260px, .85fr) minmax(0, 1.15fr);
  gap: 10px;
}
.success-priority,
.builder-priority {
  min-height: 132px;
  padding: 14px;
  border-color: rgba(245,166,35,.28);
}
.success-priority .k,
.builder-priority .k {
  color: var(--warn);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.success-priority strong,
.builder-priority strong {
  display: block;
  margin-top: 7px;
  color: #f5f8ff;
  font-size: 17px;
  line-height: 1.2;
}
.success-priority em,
.builder-priority em {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 12.5px;
  font-style: normal;
}
.success-priority small,
.builder-priority small {
  display: block;
  margin-top: 9px;
  color: var(--faint);
  font-size: 11px;
}
.scoreboard-daily,
.builder-loop {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.scoreboard-metric,
.builder-loop-step {
  min-height: 62px;
  padding: 10px;
}
.scoreboard-metric strong {
  display: block;
  color: #f5f8ff;
  font-size: 21px;
  line-height: 1;
}
.scoreboard-metric span,
.builder-loop-step span {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.25;
}
.builder-loop-step strong {
  color: #f5f8ff;
  font-size: 12px;
}
.scoreboard-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.scoreboard-chip {
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  padding: 0 9px;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--muted);
  background: rgba(18,29,49,.72);
  font-size: 10.5px;
  font-weight: 800;
}
.inventory-builder-panel {
  border-color: rgba(124,140,255,.28);
  background:
    linear-gradient(135deg, rgba(124,140,255,.08), transparent 45%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.builder-milestone-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}
.builder-milestone-card {
  min-height: 120px;
  padding: 12px;
  border-color: rgba(124,140,255,.24);
}
.builder-work-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}
.builder-work-card {
  min-height: 148px;
  padding: 12px;
}
.builder-work-card strong {
  margin-top: 8px;
  display: block;
  color: #f5f8ff;
  font-size: 13px;
  line-height: 1.2;
}
.utility-creation-panel {
  border-color: rgba(25,195,125,.34);
  background:
    linear-gradient(135deg, rgba(25,195,125,.1), transparent 52%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.utility-creation-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.utility-creation-head {
  display: grid;
  grid-template-columns: minmax(260px, 1.1fr) minmax(360px, 1.4fr);
  gap: 10px;
}
.utility-creation-priority,
.creation-score-card,
.creation-mission-card,
.utility-stage-card,
.creation-action-chip,
.creation-chain-chip,
.creation-run-card {
  border: 1px solid rgba(25,195,125,.24);
  border-radius: 8px;
  background: rgba(7, 12, 22, .72);
  color: inherit;
}
.utility-creation-priority {
  min-height: 142px;
  padding: 14px;
  text-align: left;
}
.utility-creation-priority strong,
.creation-mission-card strong,
.creation-run-card strong {
  display: block;
  margin-top: 8px;
  color: #f5f8ff;
  font-size: 14px;
  line-height: 1.22;
}
.utility-creation-priority em,
.creation-mission-card em,
.creation-run-card em {
  display: block;
  margin-top: 8px;
  color: var(--text);
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}
.utility-creation-priority small,
.creation-mission-card small,
.creation-run-card small {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.3;
}
.creation-score-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.creation-score-card {
  min-height: 66px;
  padding: 10px;
  text-align: left;
}
.creation-score-card strong {
  display: block;
  color: #f5f8ff;
  font-size: 22px;
  line-height: 1;
}
.creation-score-card span {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 11px;
}

.utility-expansion-scoreboard-panel {
  border-color: rgba(35, 211, 166, .24);
}
.utility-expansion-scoreboard {
  display: grid;
  gap: 12px;
}
.utility-expansion-priority-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.utility-expansion-priority,
.utility-expansion-period,
.utility-expansion-period-head,
.utility-expansion-metric {
  border: 1px solid var(--border);
  background: rgba(15, 27, 48, .82);
  border-radius: 8px;
}
.utility-expansion-priority,
.utility-expansion-period-head,
.utility-expansion-metric {
  display: block;
  width: 100%;
  text-align: left;
}
.utility-expansion-priority {
  min-height: 106px;
  padding: 13px;
}
.utility-expansion-priority .k,
.utility-expansion-period-head .k {
  color: var(--green);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.utility-expansion-priority strong,
.utility-expansion-period-head strong {
  display: block;
  margin-top: 7px;
  color: #f5f8ff;
  font-size: 16px;
  line-height: 1.18;
}
.utility-expansion-priority em {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}
.utility-expansion-period-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.utility-expansion-period {
  padding: 9px;
}
.utility-expansion-period-head {
  min-height: 68px;
  padding: 10px;
  border-color: rgba(35, 211, 166, .2);
}
.utility-expansion-metric-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-top: 8px;
}
.utility-expansion-metric {
  min-height: 88px;
  padding: 10px;
}
.utility-expansion-metric strong {
  display: block;
  color: #f5f8ff;
  font-size: 21px;
  line-height: 1;
}
.utility-expansion-metric span {
  display: block;
  margin-top: 7px;
  color: var(--text);
  font-size: 12px;
  font-weight: 800;
}
.utility-expansion-metric small {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.3;
}
.utility-expansion-run {
  display: grid;
  grid-template-columns: minmax(240px, .9fr) minmax(0, 1.4fr);
  gap: 9px;
  margin-top: 10px;
}
.utility-acquisition-run {
  display: grid;
  grid-template-columns: minmax(260px, .82fr) minmax(0, 1.18fr);
  gap: 9px;
  margin-top: 10px;
}
.utility-acquisition-primary,
.utility-acquisition-card,
.utility-acquisition-lane {
  border: 1px solid rgba(125,211,252,.24);
  border-radius: 8px;
  background: rgba(11,21,38,.78);
  color: inherit;
  text-align: left;
}
.utility-acquisition-primary {
  min-height: 148px;
  padding: 14px;
}
.utility-acquisition-primary strong,
.utility-acquisition-card strong {
  display: block;
  margin-top: 8px;
  color: #f5f8ff;
  font-size: 14px;
  line-height: 1.24;
}
.utility-acquisition-primary em,
.utility-acquisition-card em {
  display: block;
  margin-top: 8px;
  color: var(--text);
  font-size: 12px;
  font-style: normal;
  line-height: 1.34;
}
.utility-acquisition-primary small,
.utility-acquisition-card small,
.utility-acquisition-lane small {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.3;
}
.utility-acquisition-lane-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}
.utility-acquisition-lane {
  min-height: 92px;
  padding: 10px;
}
.utility-acquisition-lane strong {
  display: block;
  color: #f5f8ff;
  font-size: 22px;
  line-height: 1;
}
.utility-acquisition-lane span,
.utility-acquisition-card span {
  display: block;
  margin-top: 7px;
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.utility-acquisition-source-grid {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.utility-acquisition-card {
  min-height: 132px;
  padding: 11px;
}
.utility-acquisition-card.verify {
  border-color: rgba(245,158,11,.34);
}
.utility-milestone-run {
  display: grid;
  grid-template-columns: minmax(260px, .82fr) minmax(0, 1.18fr);
  gap: 9px;
  margin-top: 10px;
}
.utility-milestone-primary,
.utility-milestone-queue,
.utility-milestone-score,
.utility-milestone-target,
.utility-milestone-work,
.utility-ledger-stage {
  border: 1px solid rgba(25,195,125,.26);
  border-radius: 8px;
  background: rgba(7, 12, 22, .72);
  color: inherit;
  text-align: left;
}
.utility-milestone-primary {
  min-height: 160px;
  padding: 14px;
}
.utility-milestone-queue-wrap {
  min-width: 0;
}
.utility-milestone-queue {
  width: 100%;
  min-height: 160px;
  padding: 14px;
  border-color: rgba(255,181,71,.36);
  cursor: pointer;
}
.utility-milestone-queue:hover,
.utility-milestone-queue:focus-visible {
  border-color: rgba(255,181,71,.72);
  box-shadow: 0 0 0 1px rgba(255,181,71,.12), 0 12px 32px rgba(0,0,0,.18);
}
.utility-milestone-primary strong,
.utility-milestone-queue strong,
.utility-milestone-score strong,
.utility-milestone-target strong,
.utility-milestone-work strong,
.utility-ledger-stage strong {
  display: block;
  margin-top: 8px;
  color: #f5f8ff;
  font-size: 14px;
  line-height: 1.22;
}
.utility-milestone-score strong,
.utility-milestone-target strong,
.utility-ledger-stage strong {
  font-size: 19px;
  line-height: 1;
}
.utility-milestone-primary em,
.utility-milestone-queue em,
.utility-milestone-target em,
.utility-milestone-work em,
.utility-ledger-stage em {
  display: block;
  margin-top: 8px;
  color: var(--text);
  font-size: 12px;
  font-style: normal;
  line-height: 1.34;
}
.utility-milestone-primary small,
.utility-milestone-queue small,
.utility-milestone-score small,
.utility-milestone-target small,
.utility-milestone-work small,
.utility-ledger-stage small {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.3;
}
.utility-milestone-queue .chip-wrap {
  margin-top: 12px;
}
.utility-milestone-work-status {
  min-height: 22px;
  margin-top: 8px;
  font-size: 11px;
}
.utility-milestone-score-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.utility-milestone-score {
  min-height: 92px;
  padding: 10px;
}
.utility-milestone-score span,
.utility-milestone-target span,
.utility-milestone-work span,
.utility-ledger-stage span {
  display: block;
  margin-top: 7px;
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.utility-milestone-target-grid,
.utility-milestone-work-grid,
.utility-ledger-chain {
  grid-column: 1 / -1;
  display: grid;
  gap: 8px;
}
.utility-ledger-chain {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
.utility-milestone-target-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.utility-milestone-work-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.utility-milestone-target {
  min-height: 108px;
  padding: 11px;
}
.utility-milestone-work {
  min-height: 128px;
  padding: 11px;
}
.utility-ledger-stage {
  min-height: 122px;
  padding: 11px;
}
.first100-utility-workpack {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(260px, .75fr) minmax(0, 1.25fr);
  gap: 9px;
}
.first100-primary,
.first100-target-card,
.first100-work-card {
  border: 1px solid rgba(25,195,125,.28);
  border-radius: 8px;
  background: rgba(6, 20, 24, .76);
  color: inherit;
  text-align: left;
}
.first100-primary {
  min-height: 170px;
  padding: 14px;
  border-color: rgba(25,195,125,.48);
  cursor: pointer;
}
.first100-primary:hover,
.first100-primary:focus-visible {
  border-color: rgba(25,195,125,.8);
  box-shadow: 0 0 0 1px rgba(25,195,125,.12), 0 12px 32px rgba(0,0,0,.18);
}
.first100-primary strong,
.first100-target-card strong,
.first100-work-card strong {
  display: block;
  margin-top: 8px;
  color: #f5f8ff;
  font-size: 15px;
  line-height: 1.18;
}
.first100-target-card strong {
  font-size: 19px;
  line-height: 1;
}
.first100-primary em,
.first100-target-card em,
.first100-work-card em {
  display: block;
  margin-top: 8px;
  color: var(--text);
  font-size: 12px;
  font-style: normal;
  line-height: 1.34;
}
.first100-primary small,
.first100-target-card small,
.first100-work-card small {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.3;
}
.first100-target-card span,
.first100-work-card span {
  display: block;
  margin-top: 7px;
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.first100-target-grid,
.first100-work-grid {
  display: grid;
  gap: 8px;
}
.first100-target-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.first100-work-grid {
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.first100-target-card {
  min-height: 112px;
  padding: 11px;
}
.first100-work-card {
  min-height: 130px;
  padding: 11px;
}
.response-learning-run {
  display: grid;
  grid-template-columns: minmax(260px, .9fr) minmax(0, 1.1fr);
  gap: 9px;
}
.response-learning-primary,
.response-learning-score,
.response-chain-card,
.response-match-card,
.response-channel-card,
.response-steward-card,
.response-doctrine-card {
  border: 1px solid rgba(125,211,252,.24);
  border-radius: 8px;
  background: rgba(7, 12, 22, .72);
  color: inherit;
  text-align: left;
}
.response-learning-primary {
  min-height: 168px;
  padding: 14px;
}
.response-learning-primary strong,
.response-match-card strong,
.response-channel-card strong,
.response-steward-card strong,
.response-doctrine-card strong {
  display: block;
  margin-top: 8px;
  color: #f5f8ff;
  font-size: 14px;
  line-height: 1.24;
}
.response-learning-primary em,
.response-match-card em,
.response-channel-card em,
.response-steward-card em,
.response-doctrine-card em,
.response-chain-card em {
  display: block;
  margin-top: 8px;
  color: var(--text);
  font-size: 12px;
  font-style: normal;
  line-height: 1.34;
}
.response-learning-primary small,
.response-match-card small,
.response-channel-card small,
.response-steward-card small,
.response-doctrine-card small,
.response-chain-card small,
.response-learning-score small {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.3;
}
.response-learning-score-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.response-learning-score {
  min-height: 78px;
  padding: 10px;
}
.response-learning-score strong,
.response-chain-card strong {
  display: block;
  color: #f5f8ff;
  font-size: 22px;
  line-height: 1;
}
.response-learning-score span,
.response-chain-card span,
.response-match-card span,
.response-channel-card span,
.response-steward-card span {
  display: block;
  margin-top: 7px;
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.response-chain-grid,
.response-match-grid,
.response-channel-grid,
.response-steward-grid {
  grid-column: 1 / -1;
  display: grid;
  gap: 8px;
}
.response-chain-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
.response-match-grid,
.response-channel-grid,
.response-steward-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.response-chain-card,
.response-match-card,
.response-channel-card,
.response-steward-card {
  min-height: 118px;
  padding: 11px;
}
.response-action-row {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.response-action-chip {
  min-height: 38px;
}
.response-doctrine-card {
  grid-column: 1 / -1;
  padding: 13px;
  border-color: rgba(25,195,125,.26);
}
.utility-expansion-primary,
.utility-expansion-target,
.utility-expansion-work,
.utility-actor-card {
  border: 1px solid rgba(25,195,125,.24);
  border-radius: 8px;
  background: rgba(7, 12, 22, .72);
  color: inherit;
  text-align: left;
}
.utility-expansion-primary {
  min-height: 176px;
  padding: 14px;
}
.utility-expansion-primary strong,
.utility-expansion-work strong,
.utility-actor-card strong {
  display: block;
  margin-top: 8px;
  color: #f5f8ff;
  font-size: 14px;
  line-height: 1.22;
}
.utility-expansion-primary em,
.utility-expansion-work em {
  display: block;
  margin-top: 8px;
  color: var(--text);
  font-size: 12px;
  font-style: normal;
  line-height: 1.34;
}
.utility-expansion-primary small,
.utility-expansion-target small,
.utility-expansion-work small,
.utility-actor-card small {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.3;
}
.utility-expansion-target-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.utility-expansion-target {
  min-height: 88px;
  padding: 10px;
}
.utility-expansion-target strong {
  display: block;
  margin-top: 6px;
  color: #f5f8ff;
  font-size: 20px;
  line-height: 1;
}
.utility-expansion-target em {
  display: block;
  margin-top: 6px;
  color: var(--text);
  font-size: 11px;
  font-style: normal;
  line-height: 1.25;
}
.utility-expansion-work-grid {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.utility-expansion-work {
  min-height: 126px;
  padding: 11px;
}
.utility-expansion-work span,
.utility-actor-card span {
  display: block;
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.utility-actor-grid {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}
.utility-actor-card {
  min-height: 104px;
  padding: 11px;
}
.utility-stage-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  margin-top: 10px;
}
.utility-stage-card {
  min-height: 118px;
  padding: 12px;
  text-align: left;
}
.utility-stage-card strong {
  display: block;
  margin-top: 8px;
  color: #f5f8ff;
  font-size: 20px;
  line-height: 1;
}
.utility-stage-card em {
  display: block;
  margin-top: 8px;
  color: var(--text);
  font-size: 12px;
  font-style: normal;
  line-height: 1.3;
}
.utility-stage-card small {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.3;
}
.utility-period-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin-top: 10px;
}
.utility-period-card {
  min-height: 88px;
  padding: 11px;
  border: 1px solid rgba(148,163,184,.18);
  border-radius: 8px;
  background: rgba(18,29,49,.5);
}
.utility-period-card .k {
  display: block;
  margin-bottom: 8px;
}
.utility-period-card .scoreboard-chip {
  margin: 0 6px 6px 0;
  border-radius: 8px;
  cursor: pointer;
}
.creation-chain-row,
.creation-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 10px;
}
.creation-chain-chip,
.creation-action-chip {
  min-height: 34px;
  padding: 8px 10px;
  color: #dbeafe;
  font-size: 11px;
  line-height: 1.2;
  text-align: left;
}
.creation-mission-grid,
.creation-run-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
  margin-top: 10px;
}
.creation-mission-card,
.creation-run-card {
  min-height: 138px;
  padding: 12px;
  text-align: left;
}
.exchange-creation-run-preview {
  border: 1px solid rgba(25,195,125,.22);
  border-radius: 8px;
  padding: 12px;
  background: rgba(7, 12, 22, .45);
}
.creation-proof-row {
  display: flex !important;
  flex-wrap: wrap;
  gap: 5px;
}
.creation-proof-chip {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 3px 6px;
  border-radius: 999px;
  border: 1px solid rgba(148,163,184,.28);
  color: var(--muted);
  font-size: 10px;
  line-height: 1;
}
.creation-proof-chip.ok {
  border-color: rgba(25,195,125,.38);
  color: var(--ok);
}
.creation-proof-chip.warn {
  border-color: rgba(245,158,11,.38);
  color: var(--warn);
}
.creation-step-mini {
  min-height: 78px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px;
  border: 1px solid rgba(25,195,125,.22);
  border-radius: 8px;
  background: rgba(7, 12, 22, .72);
}
.creation-step-mini strong {
  color: #f5f8ff;
  font-size: 12px;
  line-height: 1.2;
}
.creation-step-mini small {
  color: var(--muted);
  font-size: 10.8px;
  line-height: 1.28;
}
.network-band {
  border: 1px solid rgba(124,140,255,.26);
  border-radius: var(--radius);
  padding: 20px;
  background: linear-gradient(180deg, rgba(124,140,255,.09), rgba(18,29,49,.72));
  box-shadow: var(--shadow);
}
.network-pipeline {
  border-color: rgba(25,195,125,.24);
}
.simple-workspace-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
.simple-workspace-card {
  min-height: 112px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(25,195,125,.08), rgba(18,29,49,.74));
  color: inherit;
}
.simple-workspace-card strong {
  display: block;
  font-size: 14px;
  line-height: 1.2;
}
.simple-workspace-card span {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.live-flow-panel {
  margin-top: 16px;
  border-color: rgba(25,195,125,.34);
  background:
    linear-gradient(90deg, rgba(25,195,125,.08), rgba(124,140,255,.08)),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.live-value-flow {
  position: relative;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}
.live-value-flow::before {
  content: "";
  position: absolute;
  left: 8%;
  right: 8%;
  top: 50%;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(25,195,125,.12), rgba(25,195,125,.72), rgba(124,140,255,.56), rgba(25,195,125,.12));
  transform: translateY(-50%) scaleX(.72);
  transform-origin: left;
  animation: valueFlowPulse 4.8s ease-in-out infinite;
  pointer-events: none;
}
@keyframes valueFlowPulse {
  0%, 100% { opacity: .42; transform: translateY(-50%) scaleX(.54); }
  50% { opacity: .94; transform: translateY(-50%) scaleX(1); }
}
.flow-node {
  position: relative;
  z-index: 1;
  min-height: 148px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 6px;
  padding: 13px;
  border: 1px solid rgba(25,195,125,.24);
  border-radius: 8px;
  background: rgba(7, 12, 22, .86);
  color: inherit;
  text-align: left;
  box-shadow: 0 14px 30px -26px rgba(25,195,125,.8);
}
.flow-node:hover {
  border-color: rgba(25,195,125,.62);
  background: rgba(14, 29, 41, .94);
}
.flow-index {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(25,195,125,.38);
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 900;
}
.flow-node strong {
  display: block;
  color: #f5f8ff;
  font-size: 14px;
  line-height: 1.2;
}
.flow-node b {
  display: block;
  color: var(--accent);
  font-size: 22px;
  line-height: 1;
}
.flow-node small {
  display: block;
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.32;
}
.flow-node em {
  display: block;
  color: var(--faint);
  font-style: normal;
  font-size: 10.5px;
  line-height: 1.28;
}
.home-first-value-panel {
  border-color: rgba(25,195,125,.34);
  background:
    radial-gradient(circle at 12% 16%, rgba(25,195,125,.14), transparent 36%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.home-first-value-preview {
  display: grid;
  grid-template-columns: minmax(220px, 1.08fr) minmax(320px, 1.45fr) minmax(220px, .95fr);
  gap: 12px;
  align-items: stretch;
}
.home-value-hero,
.home-channel-card,
.home-trust-card {
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7,12,22,.7);
  color: inherit;
  text-align: left;
}
.home-value-hero {
  min-height: 230px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 12px;
}
.home-value-hero strong {
  color: #f5f8ff;
  font-size: clamp(24px, 3vw, 42px);
  line-height: 1;
  letter-spacing: 0;
}
.home-value-hero small,
.home-value-hero em {
  color: var(--muted);
  font-size: 13px;
  font-style: normal;
  line-height: 1.4;
}
.home-channel-stack {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.home-channel-card {
  min-height: 110px;
  padding: 13px;
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.home-channel-card span {
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.home-channel-card strong {
  color: #f5f8ff;
  font-size: 13px;
  line-height: 1.2;
}
.home-channel-card em {
  color: var(--muted);
  font-size: 11.5px;
  font-style: normal;
  line-height: 1.35;
}
.home-trust-card {
  padding: 15px;
}
.home-trust-card strong {
  display: block;
  margin: 7px 0 12px;
  color: #f5f8ff;
  font-size: 18px;
  line-height: 1.15;
}
.mini-kv {
  gap: 6px 10px;
}
.mini-kv dt,
.mini-kv dd {
  font-size: 11px;
  line-height: 1.3;
}
.home-value-hero:hover,
.home-channel-card:hover,
.home-trust-card:hover {
  border-color: rgba(25,195,125,.56);
  background: rgba(11,20,35,.92);
  transform: translateY(-1px);
}
.home-response-strip {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.operator-workbench {
  border-color: rgba(25,195,125,.34);
}
.input-activation-pipeline {
  border-color: rgba(25,195,125,.34);
  background:
    linear-gradient(135deg, rgba(25,195,125,.1), rgba(124,140,255,.05)),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.input-pipeline-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
.input-pipeline-card {
  min-height: 134px;
  display: flex;
  flex-direction: column;
  gap: 7px;
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7,12,22,.62);
  color: inherit;
  text-align: left;
}
.input-pipeline-card:hover {
  border-color: rgba(25,195,125,.55);
  transform: translateY(-1px);
}
.input-pipeline-card span {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(25,195,125,.38);
  border-radius: 999px;
  color: var(--accent);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 900;
}
.input-pipeline-card strong {
  color: #f5f8ff;
  font-size: 13.5px;
  line-height: 1.15;
}
.input-pipeline-card small {
  flex: 1;
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.3;
}
.input-pipeline-card em {
  color: var(--faint);
  font-size: 10.5px;
  font-style: normal;
  font-weight: 800;
  line-height: 1.25;
}
.input-pipeline-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.recipient-value-worklist {
  border-color: rgba(124,140,255,.34);
  background:
    linear-gradient(135deg, rgba(124,140,255,.10), rgba(25,195,125,.06)),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.recipient-value-summary,
.recipient-value-empty {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.recipient-value-empty {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.recipient-value-summary-card,
.recipient-value-card {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7,12,22,.62);
  color: inherit;
  text-align: left;
}
.recipient-value-summary-card {
  min-height: 94px;
  padding: 13px;
}
.recipient-value-summary-card span,
.recipient-value-summary-card strong,
.recipient-value-summary-card em {
  display: block;
}
.recipient-value-summary-card span {
  color: var(--faint);
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.recipient-value-summary-card strong {
  margin-top: 7px;
  color: #f5f8ff;
  font-size: 26px;
  line-height: 1;
}
.recipient-value-summary-card em {
  margin-top: 8px;
  color: var(--muted);
  font-size: 11.5px;
  font-style: normal;
  line-height: 1.3;
}
.recipient-value-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.recipient-value-card {
  min-height: 260px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.recipient-value-card:hover,
.recipient-value-summary-card:hover {
  border-color: rgba(25,195,125,.55);
  background: rgba(11, 20, 35, .9);
}
.recipient-value-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.recipient-value-card .k {
  color: var(--faint);
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.recipient-value-card strong {
  display: block;
  color: #f5f8ff;
  font-size: 14px;
  line-height: 1.25;
}
.recipient-value-card strong small {
  display: inline-block;
  margin-left: 6px;
  color: var(--muted);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
}
.recipient-value-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.recipient-value-grid span {
  min-height: 58px;
  padding: 8px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: rgba(18,29,49,.72);
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.28;
  overflow-wrap: anywhere;
}
.recipient-value-grid b {
  display: block;
  margin-bottom: 4px;
  color: var(--accent);
  font-size: 9.5px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.recipient-value-card p {
  margin: 0;
  color: #d7e3f8;
  font-size: 12.5px;
  line-height: 1.36;
}
.recipient-value-card em {
  margin-top: auto;
  color: var(--muted);
  font-size: 11.5px;
  font-style: normal;
  line-height: 1.32;
}
.recipient-response-buttons {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}
.recipient-response-button {
  min-height: 36px;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 8px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: rgba(18,29,49,.72);
  color: var(--ink);
  font-size: 11px;
  font-weight: 800;
}
.recipient-response-button:hover {
  border-color: rgba(25,195,125,.5);
  background: rgba(25,195,125,.12);
}
.recipient-response-button b {
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
}
.recipient-response-button span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.recipient-response-result {
  display: block;
  width: 100%;
  min-height: 78px;
  padding: 10px;
  border: 1px solid rgba(25,195,125,.28);
  border-radius: 8px;
  background: rgba(25,195,125,.08);
  color: inherit;
  text-align: left;
}
.recipient-response-result.empty {
  border-color: var(--border-soft);
  background: rgba(7,12,22,.5);
}
.recipient-response-result .k,
.recipient-response-result strong,
.recipient-response-result em {
  display: block;
}
.recipient-response-result .k {
  color: var(--accent);
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.recipient-response-result strong {
  margin-top: 5px;
  color: #f5f8ff;
  font-size: 12.5px;
  line-height: 1.25;
}
.recipient-response-result em {
  margin-top: 5px;
  color: var(--muted);
  font-size: 11.5px;
  font-style: normal;
  line-height: 1.3;
}
.recipient-contribution-loop {
  margin-top: 9px;
  padding: 9px;
  border: 1px solid rgba(245,166,35,.28);
  border-radius: 8px;
  background: rgba(245,166,35,.09);
}
.recipient-contribution-loop b,
.recipient-contribution-loop span,
.recipient-contribution-loop small {
  display: block;
}
.recipient-contribution-loop b {
  color: var(--warn);
  font-size: 11.5px;
  line-height: 1.25;
}
.recipient-contribution-loop span {
  margin-top: 4px;
  color: #e8eefb;
  font-size: 11px;
  line-height: 1.3;
}
.recipient-contribution-loop small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 10.5px;
  line-height: 1.3;
}
.leadership-scale-workspace {
  border-color: rgba(124,140,255,.38);
  background:
    linear-gradient(135deg, rgba(124,140,255,.11), transparent 36%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.scale-decision-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}
.scale-summary-card,
.leadership-scale-card {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7, 12, 22, .62);
  color: inherit;
  text-align: left;
}
.scale-summary-card {
  min-height: 88px;
  padding: 13px;
}
.scale-summary-card strong {
  display: block;
  color: var(--ink);
  font-size: 24px;
  line-height: 1;
}
.scale-summary-card span {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.leadership-scale-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}
.leadership-scale-card {
  min-height: 340px;
  padding: 15px;
}
.scale-score {
  display: flex;
  align-items: baseline;
  gap: 7px;
  margin: 8px 0 12px;
}
.scale-score strong {
  color: var(--ink);
  font-size: 34px;
  line-height: 1;
}
.scale-score span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.scale-flow {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}
.scale-flow div {
  min-height: 98px;
  padding: 11px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: rgba(12, 20, 36, .72);
}
.scale-flow b,
.scale-flow span {
  display: block;
}
.scale-flow b {
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.scale-flow span {
  margin-top: 6px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.scale-stage-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.scale-decision-note {
  padding: 11px;
  border: 1px solid rgba(124,140,255,.32);
  border-radius: 8px;
  background: rgba(124,140,255,.09);
}
.scale-decision-note .k,
.scale-decision-note strong,
.scale-decision-note em {
  display: block;
}
.scale-decision-note .k {
  color: var(--indigo);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.scale-decision-note strong {
  margin-top: 5px;
  color: var(--ink);
  font-size: 13px;
}
.scale-decision-note em {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}
.steward-decision-workspace {
  border-color: rgba(255,184,77,.36);
  background:
    linear-gradient(135deg, rgba(255,184,77,.09), transparent 38%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.steward-auth-panel {
  border-color: rgba(124,140,255,.34);
  background:
    linear-gradient(135deg, rgba(124,140,255,.08), transparent 42%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.steward-auth-grid {
  display: grid;
  grid-template-columns: minmax(260px, .8fr) 1.2fr;
  gap: 12px;
  align-items: stretch;
}
.steward-auth-summary {
  min-height: 116px;
  padding: 14px;
  border: 1px solid rgba(124,140,255,.26);
  border-radius: 8px;
  background: rgba(7, 12, 22, .62);
}
.steward-auth-summary strong,
.steward-auth-summary span {
  display: block;
}
.steward-auth-summary strong {
  color: var(--ink);
  font-size: 17px;
  line-height: 1.2;
}
.steward-auth-summary span {
  margin-top: 8px;
  color: var(--muted);
  font-size: 12.5px;
  line-height: 1.35;
}
.steward-auth-form {
  display: grid;
  grid-template-columns: .8fr 1fr auto;
  gap: 10px;
  align-items: end;
  padding: 14px;
  border: 1px solid rgba(124,140,255,.22);
  border-radius: 8px;
  background: rgba(7, 12, 22, .62);
}
.compact-actions {
  align-items: end;
  margin-top: 0;
}
.steward-decision-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 14px;
}
.steward-decision-card {
  min-height: 258px;
  padding: 15px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7, 12, 22, .62);
}
.steward-decision-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.decision-audit-note {
  padding: 11px;
  border: 1px solid rgba(25,195,125,.25);
  border-radius: 8px;
  background: rgba(25,195,125,.07);
}
.decision-audit-note .k,
.decision-audit-note strong,
.decision-audit-note em {
  display: block;
}
.decision-audit-note .k {
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.decision-audit-note strong {
  margin-top: 5px;
  color: var(--ink);
  font-size: 13px;
}
.decision-audit-note em {
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}
.role-workbench {
  border-color: rgba(124,140,255,.34);
  background:
    linear-gradient(135deg, rgba(124,140,255,.09), transparent 42%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.role-workbench-form {
  display: grid;
  gap: 12px;
}
.role-workbench-preview {
  margin-top: 14px;
}
.web-user-value-workspace {
  border-color: rgba(25,195,125,.36);
  background:
    linear-gradient(135deg, rgba(25,195,125,.09), transparent 40%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.web-user-value-form {
  display: grid;
  gap: 12px;
}
.web-user-value-preview {
  margin-top: 14px;
}
.web-user-value-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.web-user-value-card {
  min-height: 178px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7, 12, 22, .62);
  color: inherit;
  text-align: left;
}
.web-user-value-card .k,
.web-user-value-card strong,
.web-user-value-card em,
.web-user-value-card small {
  display: block;
}
.web-user-value-card .k {
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.web-user-value-card strong {
  margin-top: 8px;
  color: var(--ink);
  font-size: 15px;
  line-height: 1.2;
}
.web-user-value-card em {
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}
.web-user-value-card small {
  margin-top: 8px;
  color: var(--faint);
  font-size: 11px;
  line-height: 1.35;
}
.web-user-value-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.voice-language-workspace {
  border-color: rgba(124,140,255,.36);
  background:
    linear-gradient(135deg, rgba(124,140,255,.1), transparent 40%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.voice-language-form {
  display: grid;
  gap: 12px;
}
.voice-language-preview {
  margin-top: 14px;
}
.voice-language-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.voice-language-card {
  min-height: 178px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7, 12, 22, .62);
  color: inherit;
  text-align: left;
}
.voice-language-card .k,
.voice-language-card strong,
.voice-language-card em,
.voice-language-card small {
  display: block;
}
.voice-language-card .k {
  color: var(--indigo);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.voice-language-card strong {
  margin-top: 8px;
  color: var(--ink);
  font-size: 15px;
  line-height: 1.2;
}
.voice-language-card em {
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}
.voice-language-card small {
  margin-top: 8px;
  color: var(--faint);
  font-size: 11px;
  line-height: 1.35;
}
.voice-language-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.leadership-communication-workspace,
.end-user-journey-workspace {
  border-color: rgba(25,195,125,.34);
  background:
    linear-gradient(135deg, rgba(25,195,125,.09), transparent 38%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.approval-flow,
.end-user-journey-board,
.audience-gate-grid {
  display: grid;
  gap: 10px;
}
.approval-flow {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.audience-gate-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.end-user-journey-board {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
.approval-card,
.audience-gate-card,
.journey-card {
  min-height: 156px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7, 12, 22, .64);
  color: inherit;
  text-align: left;
}
.approval-card .k,
.journey-card .k {
  display: block;
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.approval-card strong,
.audience-gate-card strong,
.journey-card strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 15px;
  line-height: 1.18;
}
.approval-card em,
.audience-gate-card em,
.journey-card em {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}
.approval-card small,
.audience-gate-card small,
.journey-card small {
  display: block;
  margin-top: 9px;
  color: var(--faint);
  font-size: 11px;
  line-height: 1.32;
}
.decision-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.population-scorecard-panel {
  border-color: rgba(25,195,125,.34);
  background:
    linear-gradient(135deg, rgba(25,195,125,.09), transparent 40%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.scorecard-summary {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  gap: 10px;
}
.population-scorecard-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
}
.scorecard-north-star,
.scorecard-card {
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7, 12, 22, .64);
  color: inherit;
  text-align: left;
}
.scorecard-card {
  min-height: 164px;
}
.scorecard-north-star .k,
.scorecard-card .k {
  display: block;
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.scorecard-north-star strong,
.scorecard-card strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 16px;
  line-height: 1.2;
}
.scorecard-card strong {
  color: #f5f8ff;
  font-size: 28px;
  line-height: 1;
}
.scorecard-north-star em,
.scorecard-card em {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}
.scorecard-north-star small,
.scorecard-card small {
  display: block;
  margin-top: 8px;
  color: var(--faint);
  font-size: 11px;
  line-height: 1.32;
}
.outcome-inventory-panel {
  border-color: rgba(25,195,125,.32);
}
.outcome-north-star {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.outcome-hero-card,
.outcome-card,
.outcome-loop-chip,
.outcome-category-chip {
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: rgba(18, 29, 49, .82);
  color: inherit;
}
.outcome-hero-card {
  min-height: 112px;
  padding: 14px;
}
.outcome-hero-card span,
.outcome-hero-card strong,
.outcome-hero-card em,
.outcome-hero-card small,
.outcome-card span,
.outcome-card strong,
.outcome-card em,
.outcome-card small {
  display: block;
}
.outcome-hero-card .k,
.outcome-card .k {
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.outcome-hero-card strong {
  margin-top: 8px;
  font-size: 18px;
  line-height: 1.15;
}
.outcome-hero-card em,
.outcome-hero-card small {
  margin-top: 7px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}
.outcome-inventory-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.outcome-card {
  min-height: 96px;
  padding: 12px;
}
.outcome-card strong {
  margin-top: 9px;
  font-size: 28px;
  line-height: 1;
}
.outcome-card em {
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}
.outcome-card small {
  margin-top: 7px;
  color: var(--faint);
  font-size: 11px;
  line-height: 1.25;
}
.outcome-loop-row,
.outcome-category-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 12px;
}
.outcome-loop-chip,
.outcome-category-chip {
  width: auto;
  min-height: 30px;
  padding: 0 10px;
  color: var(--accent);
  font-size: 11px;
  font-weight: 850;
}
.outcome-confirmation-panel {
  border-color: rgba(25,195,125,.34);
  background:
    linear-gradient(135deg, rgba(25,195,125,.09), rgba(124,140,255,.05)),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.outcome-confirmation-preview {
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.outcome-confirmation-card {
  min-height: 112px;
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7,12,22,.66);
}
.outcome-confirmation-card span,
.outcome-confirmation-card strong,
.outcome-confirmation-card em,
.outcome-confirmation-card small {
  display: block;
}
.outcome-confirmation-card span {
  color: var(--faint);
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.outcome-confirmation-card strong {
  margin-top: 7px;
  color: #f5f8ff;
  font-size: 20px;
  line-height: 1.1;
}
.outcome-confirmation-card em {
  margin-top: 7px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}
.outcome-confirmation-card small {
  margin-top: 8px;
  color: var(--faint);
  font-size: 11px;
  line-height: 1.3;
}
.exchange-closure-panel {
  border-color: rgba(25,195,125,.38);
  background:
    linear-gradient(135deg, rgba(25,195,125,.10), rgba(255,179,71,.05)),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.exchange-closure-preview {
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.exchange-closure-card {
  min-height: 126px;
  padding: 13px;
  border: 1px solid rgba(25,195,125,.28);
  border-radius: 8px;
  background: rgba(7,12,22,.68);
  color: inherit;
  text-align: left;
}
.exchange-closure-card:hover {
  border-color: rgba(25,195,125,.62);
  background: rgba(14,29,41,.92);
}
.exchange-closure-card span,
.exchange-closure-card strong,
.exchange-closure-card em,
.exchange-closure-card small {
  display: block;
}
.exchange-closure-card span {
  color: var(--accent);
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.exchange-closure-card strong {
  margin-top: 8px;
  color: #f5f8ff;
  font-size: 18px;
  line-height: 1.12;
}
.exchange-closure-card em {
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}
.exchange-closure-card small {
  margin-top: 8px;
  color: var(--faint);
  font-size: 11px;
  line-height: 1.3;
}
.participation-review-panel {
  border-color: rgba(255,179,71,.34);
  background:
    linear-gradient(135deg, rgba(255,179,71,.09), rgba(25,195,125,.05)),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.participation-review-metrics {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}
.participation-metric-card,
.participation-work-card {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7,12,22,.66);
  color: inherit;
  text-align: left;
}
.participation-metric-card {
  min-height: 112px;
  padding: 13px;
}
.participation-metric-card strong,
.participation-metric-card span,
.participation-metric-card small {
  display: block;
}
.participation-metric-card strong {
  color: var(--warn);
  font-size: 28px;
  line-height: 1;
}
.participation-metric-card span {
  margin-top: 8px;
  color: #f5f8ff;
  font-weight: 850;
  line-height: 1.18;
}
.participation-metric-card small {
  margin-top: 8px;
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.3;
}
.participation-work-grid,
.participation-empty {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.participation-empty {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.participation-work-card {
  min-height: 220px;
  padding: 14px;
}
.participation-work-card .k,
.participation-work-card strong,
.participation-work-card em,
.participation-work-card small {
  display: block;
}
.participation-work-card .k {
  color: var(--warn);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.participation-work-card strong {
  margin-top: 8px;
  color: #f5f8ff;
  font-size: 15px;
  line-height: 1.22;
}
.participation-work-card em {
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}
.participation-work-card small {
  margin-top: 10px;
  color: var(--faint);
  font-size: 11.5px;
  line-height: 1.32;
}
.participation-metric-card:hover,
.participation-work-card:hover {
  border-color: rgba(255,179,71,.56);
  background: rgba(18,26,39,.92);
}
.participation-loop-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.loop-chip {
  border: 1px solid rgba(25,195,125,.28);
  border-radius: 8px;
  background: rgba(25,195,125,.08);
  color: var(--ink);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 900;
  padding: 8px 10px;
}
.multilingual-channel-workspace {
  border-color: rgba(124,140,255,.34);
  background:
    linear-gradient(135deg, rgba(124,140,255,.1), transparent 38%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.language-channel-summary,
.channel-readiness-grid,
.language-readiness-grid {
  display: grid;
  gap: 10px;
}
.language-channel-summary {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.channel-readiness-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.language-readiness-grid {
  grid-template-columns: repeat(9, minmax(0, 1fr));
}
.language-channel-card,
.channel-readiness-card,
.language-readiness-card {
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7, 12, 22, .64);
  color: inherit;
  text-align: left;
}
.language-channel-card {
  min-height: 142px;
}
.channel-readiness-card,
.language-readiness-card {
  min-height: 154px;
}
.language-channel-card .k,
.channel-readiness-card .k,
.language-readiness-card .k {
  display: block;
  color: var(--indigo);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.language-channel-card strong,
.channel-readiness-card strong,
.language-readiness-card strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 15px;
  line-height: 1.18;
}
.language-channel-card strong {
  font-size: 24px;
}
.language-channel-card em,
.channel-readiness-card em,
.language-readiness-card em {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}
.language-channel-card small,
.channel-readiness-card small,
.language-readiness-card small {
  display: block;
  margin-top: 8px;
  color: var(--faint);
  font-size: 11px;
  line-height: 1.32;
}
.end-user-channel-workspace {
  border-color: rgba(25,195,125,.36);
  background:
    linear-gradient(135deg, rgba(25,195,125,.1), transparent 36%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.end-user-channel-preview {
  margin-top: 14px;
}
.population-channel-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.population-channel-card {
  min-height: 188px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7, 12, 22, .62);
  color: inherit;
  text-align: left;
}
.population-channel-card .k {
  display: block;
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.population-channel-card strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 15px;
  line-height: 1.2;
}
.population-channel-card p {
  min-height: 72px;
  margin: 10px 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.population-channel-card small {
  display: block;
  color: var(--faint);
  font-size: 11px;
  line-height: 1.35;
}
.population-learning-panel {
  border-color: rgba(25,195,125,.24);
}
.role-output-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.role-output-card {
  min-height: 112px;
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7, 12, 22, .62);
  color: inherit;
}
.role-output-card .k {
  display: block;
  color: var(--faint);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.role-output-card strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 14px;
  line-height: 1.25;
}
.role-output-card em {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}
.role-response-panel,
.search-response-panel,
.population-learning-panel {
  border-color: rgba(25,195,125,.28);
}
.role-response-button,
.search-response-button,
.end-user-response-button {
  text-align: left;
}
.role-response-result,
.role-response-empty,
.search-response-result,
.search-response-empty,
.end-user-response-result,
.end-user-response-empty {
  display: block;
  width: 100%;
  min-height: 96px;
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7, 12, 22, .58);
  color: inherit;
  text-align: left;
}
.role-response-result .k,
.role-response-empty .k,
.search-response-result .k,
.search-response-empty .k,
.end-user-response-result .k,
.end-user-response-empty .k {
  display: block;
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.role-response-result strong,
.role-response-empty strong,
.search-response-result strong,
.search-response-empty strong,
.end-user-response-result strong,
.end-user-response-empty strong {
  display: block;
  margin-top: 7px;
  font-size: 14px;
  line-height: 1.25;
}
.role-response-result em,
.role-response-empty em,
.search-response-result em,
.search-response-empty em,
.end-user-response-result em,
.end-user-response-empty em {
  display: block;
  margin: 7px 0 10px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}
.transaction-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}
.transaction-card {
  min-height: 96px;
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7, 12, 22, .58);
  color: inherit;
}
.transaction-card strong {
  display: block;
  font-size: 13px;
}
.transaction-card span {
  display: block;
  margin-top: 7px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.span-all { grid-column: 1 / -1; }
.input-value-chain {
  border-color: rgba(25,195,125,.38);
  background:
    linear-gradient(135deg, rgba(25,195,125,.11), transparent 38%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.input-triage-panel {
  border-color: rgba(25,195,125,.32);
  background:
    linear-gradient(135deg, rgba(25,195,125,.10), rgba(124,140,255,.07)),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.input-triage-board {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}
.input-triage-card {
  min-height: 172px;
  padding: 13px;
  border: 1px solid rgba(25,195,125,.26);
  border-radius: 8px;
  background: rgba(7, 12, 22, .72);
  color: inherit;
  text-align: left;
}
.input-triage-card:hover {
  border-color: rgba(25,195,125,.58);
  background: rgba(14,29,41,.92);
}
.input-triage-card .k,
.input-triage-card strong,
.input-triage-card b,
.input-triage-card small,
.input-triage-card em,
.input-triage-card i {
  display: block;
}
.input-triage-card .k {
  color: var(--faint);
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .12em;
  line-height: 1.25;
  text-transform: uppercase;
}
.input-triage-card strong {
  margin-top: 9px;
  color: #f5f8ff;
  font-size: 13.5px;
  line-height: 1.2;
}
.input-triage-card b {
  margin-top: 10px;
  color: var(--accent);
  font-size: 25px;
  line-height: 1;
}
.input-triage-card small {
  margin-top: 8px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.3;
}
.input-triage-card em,
.input-triage-card i {
  margin-top: 8px;
  color: var(--faint);
  font-size: 10.5px;
  font-style: normal;
  line-height: 1.28;
}
.source-to-utility-panel {
  border-color: rgba(25,195,125,.42);
  background:
    linear-gradient(135deg, rgba(25,195,125,.12), rgba(124,140,255,.07)),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.source-to-utility-hero {
  width: 100%;
  min-height: 92px;
  padding: 15px;
  border: 1px solid rgba(25,195,125,.30);
  border-radius: 8px;
  background: rgba(7, 12, 22, .62);
  color: inherit;
  text-align: left;
}
.source-to-utility-hero strong,
.source-to-utility-hero em,
.source-to-utility-hero small {
  display: block;
}
.source-to-utility-hero strong {
  color: #f5f8ff;
  font-size: 18px;
  line-height: 1.2;
}
.source-to-utility-hero em {
  margin-top: 8px;
  color: var(--accent);
  font-size: 13px;
  font-style: normal;
  line-height: 1.35;
}
.source-to-utility-hero small {
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.source-to-utility-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  align-items: center;
  margin-top: 12px;
}
.source-to-utility-grid,
.source-to-utility-chain,
.source-to-utility-candidates {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}
.source-to-utility-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.source-to-utility-chain { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.source-to-utility-candidates { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.source-to-utility-stat,
.source-to-utility-step,
.source-to-utility-candidate {
  min-height: 92px;
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7, 12, 22, .62);
  color: inherit;
  text-align: left;
}
.source-to-utility-stat span,
.source-to-utility-step span,
.source-to-utility-candidate .k {
  display: block;
  color: var(--faint);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.source-to-utility-stat strong,
.source-to-utility-candidate strong {
  display: block;
  margin-top: 8px;
  color: var(--ink);
  font-size: 18px;
  line-height: 1.12;
}
.source-to-utility-stat em,
.source-to-utility-step em,
.source-to-utility-candidate em,
.source-to-utility-candidate small {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 11.5px;
  font-style: normal;
  line-height: 1.32;
}
.source-url-utility-panel {
  border-color: rgba(35, 211, 166, .28);
}
.source-url-utility-preview,
.source-url-utility-grid,
.source-url-candidate-grid {
  display: grid;
  gap: 10px;
}
.source-url-utility-grid {
  grid-template-columns: 1.45fr repeat(3, minmax(0, 1fr));
}
.source-url-candidate-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 10px;
}
.source-url-utility-card,
.source-url-candidate-card,
.source-url-utility-empty {
  min-height: 110px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7, 12, 22, .66);
  color: inherit;
  text-align: left;
}
.source-url-utility-card.primary {
  border-color: rgba(35, 211, 166, .35);
  background: linear-gradient(180deg, rgba(35, 211, 166, .11), rgba(15, 27, 48, .9));
}
.source-url-utility-card span,
.source-url-candidate-card .k,
.source-url-utility-empty .k {
  display: block;
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.source-url-utility-card strong,
.source-url-candidate-card strong,
.source-url-utility-empty strong {
  display: block;
  margin-top: 7px;
  color: #f5f8ff;
  font-size: 16px;
  line-height: 1.2;
}
.source-url-utility-card em,
.source-url-candidate-card em,
.source-url-utility-empty em {
  display: block;
  margin-top: 7px;
  color: var(--muted);
  font-size: 11.5px;
  font-style: normal;
  line-height: 1.35;
}
.source-url-utility-card small,
.source-url-candidate-card small {
  display: block;
  margin-top: 8px;
  color: var(--faint);
  font-size: 10.5px;
  line-height: 1.35;
  word-break: break-word;
}
.source-batch-utility-panel {
  border-color: rgba(34, 211, 238, .32);
}
.source-batch-utility-preview,
.source-batch-score-grid,
.source-batch-target-grid,
.source-batch-candidate-grid,
.source-batch-delivery-grid,
.source-batch-execution-grid,
.source-batch-workpack-grid {
  display: grid;
  gap: 10px;
}
.source-batch-score-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 12px;
}
.source-batch-target-grid,
.source-batch-candidate-grid,
.source-batch-delivery-grid,
.source-batch-execution-grid,
.source-batch-workpack-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 10px;
}
.source-batch-card,
.source-batch-target,
.source-batch-candidate,
.source-batch-delivery,
.source-batch-execution,
.source-batch-workpack,
.source-batch-empty {
  min-height: 118px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7, 12, 22, .66);
  color: inherit;
  text-align: left;
}
.source-batch-card.primary {
  border-color: rgba(34, 211, 238, .42);
  background: linear-gradient(180deg, rgba(34, 211, 238, .12), rgba(15, 27, 48, .9));
}
.source-batch-workpack.primary {
  grid-column: span 2;
  border-color: rgba(16, 185, 129, .5);
  background: linear-gradient(180deg, rgba(16, 185, 129, .14), rgba(15, 27, 48, .92));
}
.source-batch-execution.primary {
  grid-column: span 2;
  border-color: rgba(124, 140, 255, .52);
  background: linear-gradient(180deg, rgba(124, 140, 255, .16), rgba(15, 27, 48, .92));
}
.source-batch-card span,
.source-batch-target span,
.source-batch-candidate .k,
.source-batch-delivery .k,
.source-batch-execution .k,
.source-batch-workpack .k,
.source-batch-empty .k {
  display: block;
  color: var(--accent);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.source-batch-card strong,
.source-batch-target strong,
.source-batch-candidate strong,
.source-batch-delivery strong,
.source-batch-execution strong,
.source-batch-workpack strong,
.source-batch-empty strong {
  display: block;
  margin-top: 7px;
  color: #f5f8ff;
  font-size: 16px;
  line-height: 1.2;
}
.source-batch-card em,
.source-batch-target em,
.source-batch-candidate em,
.source-batch-delivery em,
.source-batch-execution em,
.source-batch-workpack em,
.source-batch-empty em {
  display: block;
  margin-top: 7px;
  color: var(--muted);
  font-size: 11.5px;
  font-style: normal;
  line-height: 1.35;
}
.source-batch-target small,
.source-batch-candidate small,
.source-batch-delivery small,
.source-batch-execution small,
.source-batch-workpack small {
  display: block;
  margin-top: 8px;
  color: var(--faint);
  font-size: 10.5px;
  line-height: 1.35;
  word-break: break-word;
}
.chain-summary-grid,
.channel-preview-grid,
.activation-lane-grid {
  display: grid;
  gap: 10px;
}
.chain-summary-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.channel-preview-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.activation-lane-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.chain-step-card,
.chain-channel-card,
.activation-lane-card {
  min-height: 104px;
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7, 12, 22, .58);
  color: inherit;
  text-align: left;
  text-decoration: none;
}
.chain-step-card .k,
.chain-channel-card .k,
.activation-lane-card span {
  display: block;
  color: var(--faint);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.chain-step-card strong,
.chain-channel-card strong,
.activation-lane-card strong {
  display: block;
  margin-top: 7px;
  color: var(--ink);
  font-size: 14px;
  line-height: 1.25;
}
.chain-step-card em {
  display: block;
  margin-top: 7px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.35;
}
.activation-lane-card em,
.activation-lane-card small {
  display: block;
  margin-top: 7px;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  line-height: 1.32;
}
.activation-lane-card {
  min-height: 118px;
  border-color: rgba(25,195,125,.22);
}
.activation-blockers {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 10px;
  color: var(--muted);
  font-size: 12px;
}
.chain-channel-card p {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.38;
}
.compact-panel {
  min-height: 210px;
}
.response-chip-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.response-chip {
  min-height: 68px;
  padding: 9px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--panel-3);
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
}
.response-chip b {
  display: inline-grid;
  width: 22px;
  height: 22px;
  place-items: center;
  margin-right: 6px;
  border-radius: 7px;
  background: var(--accent-soft);
  color: var(--accent);
  font-family: var(--mono);
}
.response-chip small {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 650;
  line-height: 1.3;
}
.utility-activation-response-button {
  text-align: left;
  cursor: pointer;
}
.utility-activation-response-button:hover {
  border-color: rgba(25,195,125,.58);
  background: rgba(14,29,41,.94);
}
.utility-response-empty,
.utility-response-main,
.utility-work-order-main,
.utility-work-order-queue,
.utility-closure-card,
.utility-work-order-card,
.utility-chain-closure-card {
  display: block;
  width: 100%;
  padding: 11px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7, 12, 22, .62);
  color: inherit;
  text-align: left;
}
.utility-response-empty {
  min-height: 94px;
}
.utility-response-closure {
  display: grid;
  gap: 9px;
}
.utility-response-main {
  border-color: rgba(25,195,125,.34);
  background:
    linear-gradient(135deg, rgba(25,195,125,.12), rgba(124,140,255,.07)),
    rgba(7, 12, 22, .76);
}
.utility-work-order-main {
  border-color: rgba(124,140,255,.34);
  background:
    linear-gradient(135deg, rgba(124,140,255,.12), rgba(25,195,125,.07)),
    rgba(7, 12, 22, .76);
}
.utility-work-order-queue {
  cursor: pointer;
  border-color: rgba(255,181,71,.38);
  background:
    linear-gradient(135deg, rgba(255,181,71,.12), rgba(25,195,125,.07)),
    rgba(7, 12, 22, .76);
}
.utility-work-order-queue:hover {
  border-color: rgba(255,181,71,.62);
}
.utility-chain-closure-grid,
.utility-work-order-grid,
.utility-closure-grid {
  display: grid;
  gap: 8px;
}
.utility-chain-closure-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
.utility-closure-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.utility-work-order-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.utility-response-empty .k,
.utility-response-main .k,
.utility-work-order-main .k,
.utility-work-order-queue .k,
.utility-closure-card .k,
.utility-work-order-card span,
.utility-chain-closure-card span {
  display: block;
  color: var(--faint);
  font-family: var(--mono);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.utility-response-empty strong,
.utility-response-main strong,
.utility-work-order-main strong,
.utility-work-order-queue strong,
.utility-closure-card strong,
.utility-work-order-card strong,
.utility-chain-closure-card strong {
  display: block;
  margin-top: 7px;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.25;
}
.utility-response-empty em,
.utility-response-main em,
.utility-work-order-main em,
.utility-work-order-queue em,
.utility-closure-card em,
.utility-work-order-card em,
.utility-chain-closure-card em {
  display: block;
  margin-top: 7px;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  line-height: 1.32;
}
.utility-work-order-card small {
  display: block;
  margin-top: 7px;
  color: var(--faint);
  font-size: 10.5px;
  line-height: 1.3;
}
.utility-chain-closure-card strong {
  color: var(--accent);
  font-family: var(--mono);
  font-size: 18px;
}
.compact-kv {
  font-size: 12.5px;
}
.trust-gate-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 12px;
}
.public-intelligence-shell,
.source-refresh-shell,
.source-refresh-run-shell,
.source-refresh-promotion-shell,
.discovery-delivery-shell,
.daily-intelligence-shell,
.network-resilience-shell,
.population-activation-shell {
  border-color: rgba(25,195,125,.32);
  background:
    linear-gradient(180deg, rgba(25,195,125,.08), rgba(18,29,49,.8));
}
.value-search-summary,
.value-search-card,
.value-session-card {
  border-color: rgba(124,140,255,.28);
}
.value-search-summary {
  background:
    linear-gradient(135deg, rgba(124,140,255,.16), transparent 42%),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.search-discovery-panel {
  border-color: rgba(124,140,255,.32);
  background:
    linear-gradient(135deg, rgba(124,140,255,.10), rgba(25,195,125,.07)),
    linear-gradient(180deg, var(--panel) 0%, var(--panel-2) 100%);
}
.search-preset-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}
.search-discovery-board {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.search-discovery-card {
  min-height: 132px;
  padding: 14px;
  border: 1px solid rgba(124,140,255,.28);
  border-radius: 8px;
  background: rgba(7, 12, 22, .68);
  color: inherit;
  text-align: left;
}
.search-discovery-card:hover {
  border-color: rgba(25,195,125,.54);
  background: rgba(14, 29, 41, .9);
}
.search-discovery-card .k,
.search-discovery-card strong,
.search-discovery-card b,
.search-discovery-card small {
  display: block;
}
.search-discovery-card .k {
  color: var(--faint);
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.search-discovery-card strong {
  margin-top: 8px;
  color: #f5f8ff;
  font-size: 14px;
  line-height: 1.2;
}
.search-discovery-card b {
  margin-top: 10px;
  color: var(--accent);
  font-size: 28px;
  line-height: 1;
}
.search-discovery-card small {
  margin-top: 9px;
  color: var(--muted);
  font-size: 11.5px;
  line-height: 1.35;
}
.value-session-card {
  background:
    linear-gradient(180deg, rgba(124,140,255,.08), rgba(18,29,49,.78));
}
.value-search-card .kv dd {
  max-height: none;
}
.mini-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 10px 0 12px;
}
.mini-action {
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid rgba(25,195,125,.28);
  border-radius: 999px;
  background: rgba(25,195,125,.1);
  color: #b8ffd9;
  font-size: 11px;
  font-weight: 850;
  white-space: nowrap;
}
.mini-action:hover {
  border-color: rgba(124,140,255,.48);
  background: rgba(124,140,255,.12);
  color: var(--ink);
}
.search-channel-package {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}
.search-channel-card {
  min-height: 112px;
  padding: 11px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(7,12,22,.68);
  color: inherit;
  text-align: left;
}
.search-channel-card:hover {
  border-color: rgba(124,140,255,.55);
  background: rgba(13,22,38,.92);
}
.search-channel-card span,
.search-channel-card strong,
.search-channel-card em {
  display: block;
}
.search-channel-card span {
  color: var(--indigo);
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.search-channel-card strong {
  margin-top: 6px;
  color: #f5f8ff;
  font-size: 13px;
  line-height: 1.15;
}
.search-channel-card em {
  margin-top: 8px;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  line-height: 1.35;
}
.search-result-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.digest-card {
  min-height: 248px;
}
.primary-digest {
  border-color: rgba(25,195,125,.35);
}
.population-value-panel {
  border-color: rgba(25,195,125,.32);
  background:
    linear-gradient(180deg, rgba(25,195,125,.09), rgba(18,29,49,.76));
}
.compact-loop {
  flex-direction: column;
}
.loop-step {
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-sm);
  background: rgba(7, 12, 22, .58);
  padding: 12px;
}
.loop-step span {
  display: block;
  color: var(--accent);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.loop-step p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: 12.5px;
}
.digest-mini-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.digest-mini {
  min-height: 92px;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-sm);
  background: rgba(7, 12, 22, .58);
  padding: 12px;
}
.digest-mini strong {
  display: block;
  font-size: 24px;
  line-height: 1;
}
.digest-mini span {
  display: block;
  margin-top: 8px;
  font-weight: 800;
  font-size: 12px;
}
.digest-mini small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
}
.pipeline-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}
.pipeline-grid div,
.pipeline-grid button {
  min-height: 112px;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-sm);
  background: rgba(7, 12, 22, .5);
  padding: 14px;
}
.pipeline-grid strong {
  display: block;
  font-size: 13px;
  margin-bottom: 8px;
}
.pipeline-grid span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.band-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}
.band-head .k {
  color: var(--indigo);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.band-head h3 {
  margin: 5px 0 0;
  font-size: 19px;
}
.agent-live-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.agent-live {
  min-height: 146px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: rgba(7, 12, 22, .58);
  padding: 15px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.agent-live strong {
  font-size: 14px;
}
.agent-live small {
  color: var(--muted);
  font-size: 12px;
}
.intelligence-map {
  overflow: hidden;
}
.map-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.map-cell {
  min-height: 104px;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-sm);
  background:
    linear-gradient(135deg, rgba(25,195,125,.11), transparent 46%),
    var(--panel-3);
  padding: 14px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.map-cell strong {
  font-size: 14px;
}
.map-cell span {
  font-size: 28px;
  font-weight: 900;
  line-height: 1;
}
.map-cell small {
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: 11px;
}
.rollout {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 14px;
  cursor: pointer;
}
.rollout .stage {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: var(--accent-soft);
  border: 1px solid rgba(25,195,125,.35);
  color: var(--accent);
  font-weight: 900;
  font-family: var(--mono);
}

.intake-panel {
  border-color: rgba(25,195,125,.26);
}
.intake-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.intake-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.intake-form label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .03em;
}
.intake-form input,
.intake-form select,
.intake-form textarea {
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #070c16;
  color: var(--ink);
  min-height: 40px;
  padding: 10px 11px;
  font: 600 13px/1.35 var(--sans);
  outline: none;
}
.intake-form textarea {
  min-height: 92px;
  resize: vertical;
  font-family: var(--mono);
  font-weight: 500;
}
.intake-form input:focus,
.intake-form select:focus,
.intake-form textarea:focus {
  border-color: rgba(25,195,125,.55);
  box-shadow: 0 0 0 3px var(--accent-soft);
}
.bulk-label span {
  color: var(--faint);
  font-weight: 600;
  letter-spacing: 0;
}
.intake-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.file-row {
  display: grid;
  grid-template-columns: minmax(280px, .7fr) minmax(0, 1fr);
  gap: 12px;
  align-items: end;
  padding: 12px;
  border: 1px solid var(--border-soft);
  border-radius: 8px;
  background: rgba(7, 12, 22, .42);
}
.file-help {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.intake-status {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 14px;
}
.step-card {
  min-height: 162px;
  position: relative;
}
.step-card .stage {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: var(--panel-3);
  color: var(--muted);
  font-family: var(--mono);
  font-weight: 900;
  margin-bottom: 12px;
}
.step-card.pass .stage {
  background: var(--accent-soft);
  color: var(--accent);
}
.step-card h3 {
  margin: 0 0 8px;
  font-size: 15px;
}
.step-card p {
  margin: 10px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.kv { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; font-size: 13.5px; }
.kv dt { color: var(--faint); }
.kv dd { margin: 0; color: var(--ink); }

.list { display: flex; flex-direction: column; gap: 10px; }
.row {
  display: flex; gap: 12px; align-items: flex-start;
  padding: 12px 14px; border: 1px solid var(--border-soft); border-radius: var(--radius-sm);
  background: var(--panel-3);
}
.row .lead { font-weight: 700; font-size: 14px; }
.row .sub { color: var(--muted); font-size: 13px; margin-top: 3px; }
.row .src { font-family: var(--mono); font-size: 11.5px; color: var(--accent); margin-top: 6px; word-break: break-all; }

.chip { font-size: 11px; font-weight: 700; padding: 4px 9px; border-radius: 7px; border: 1px solid var(--border); color: var(--muted); background: var(--panel); }
.chip.on { color: var(--accent); border-color: rgba(25,195,125,.4); background: var(--accent-soft); }
.chip.off { color: var(--faint); }
.chip-wrap { display: flex; gap: 6px; flex-wrap: wrap; }
.chip-button {
  font-family: inherit;
  text-align: left;
  cursor: pointer;
}
.chip-button:hover {
  border-color: rgba(124,140,255,.45);
  color: var(--ink);
}
.population-expansion-ladder .expansion-stage {
  min-height: 118px;
  align-items: flex-start;
}
.population-expansion-ladder .expansion-stage .badge {
  margin-left: auto;
}

.msg {
  font-family: var(--mono); font-size: 12.5px; line-height: 1.65; color: #cdd9f0;
  background: #070c16; border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 14px 16px; white-space: pre-wrap; word-break: break-word;
}
.label-q { color: var(--accent); font-weight: 700; }

/* recipient card */
.recipient .who { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; }
.recipient .who strong { font-size: 17px; }

/* agent roles */
.agent { display: flex; flex-direction: column; gap: 10px; }
.agent .top { display: flex; align-items: center; gap: 10px; }
.agent .glyph { width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; background: var(--indigo-soft); color: var(--indigo); font-weight: 800; }
.agent h4 { margin: 0; font-size: 14.5px; }
.agent .fn { color: var(--muted); font-size: 12.5px; }
.agent .io { font-family: var(--mono); font-size: 12px; color: var(--ink); background: #070c16; border: 1px solid var(--border-soft); border-radius: 8px; padding: 9px 11px; }
.status-dot { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 11px; color: var(--accent); font-weight: 700; }

/* learning loop stepper */
.loop { display: flex; flex-wrap: wrap; gap: 10px; align-items: stretch; }
.loop .step {
  flex: 1 1 150px; min-width: 140px;
  border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 12px 13px;
  background: var(--panel-3); position: relative;
}
.loop .step .n { font-family: var(--mono); font-size: 11px; color: var(--faint); }
.loop .step .nm { font-weight: 700; font-size: 13.5px; margin: 3px 0 5px; }
.loop .step .dt { font-size: 12px; color: var(--muted); }
.loop .arrow { align-self: center; color: var(--faint); font-size: 18px; }

.counterfactual { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 6px; }
.cf { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 14px; background: var(--panel-3); }
.cf .big { font-size: 26px; font-weight: 800; }
.cf.lose { border-color: rgba(239,90,111,.35); }
.cf.win { border-color: rgba(25,195,125,.35); }
.cf.lose .big { color: var(--bad); }
.cf.win .big { color: var(--accent); }
.down { text-align: center; color: var(--faint); font-size: 18px; margin: 6px 0; }
.row.improved { border-color: rgba(25,195,125,.35); }
.row.improved .k { color: var(--accent); }
.row.needs-work {
  border-color: rgba(239,90,111,.35);
  background: linear-gradient(180deg, rgba(239,90,111,.08), var(--panel-3));
}
.row.needs-work .k { color: var(--bad); }
.mini-grid { gap: 10px; }
.verdict-row {
  align-items: center;
  justify-content: space-between;
}
.verdict-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}
.test-script {
  border-color: rgba(124,140,255,.3);
}
.test-script-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr);
  gap: 18px;
}
.test-script ol {
  margin: 8px 0 0;
  padding-left: 20px;
  color: var(--ink);
}
.test-script li {
  margin: 6px 0;
  color: var(--muted);
}
.test-script p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 13px;
}

/* acceptance */
.accept-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.bullets { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 9px; }
.bullets li { padding-left: 22px; position: relative; font-size: 13.5px; color: var(--ink); }
.bullets li::before { content: ""; position: absolute; left: 4px; top: 8px; width: 7px; height: 7px; border-radius: 50%; }
.bullets.good li::before { background: var(--accent); }
.bullets.review li::before { background: var(--warn); }
.gate-row { display: flex; align-items: center; gap: 12px; padding: 13px 15px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--panel-3); }
.gate-row .nm { font-weight: 700; }
.gate-row .st { margin-left: auto; }

.muted { color: var(--muted); }
.small { font-size: 12px; }
.mono { font-family: var(--mono); }
.spacer { height: 16px; }
.loading { color: var(--faint); font-family: var(--mono); font-size: 12px; }
.hidden-machinery { display: none !important; }

/* mobile */
.scrim { display: none; }
@media (max-width: 980px) {
  .grid.cols-2, .grid.cols-3, .grid.cols-4, .grid.cols-6, .accept-grid, .counterfactual, .hero-network, .delivery-plan-grid { grid-template-columns: 1fr; }
  .action-dock { grid-template-columns: 1fr; top: 88px; }
  .action-dock-routes { grid-template-columns: 1fr; }
  .action-dock-actions { flex-wrap: wrap; }
  .page-work-canvas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page-command-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 100%; }
  .page-command-actions { grid-column: 1 / -1; }
  .page-map { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .doctrine-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .network-definition-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .simple-workspace-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .input-action-dashboard { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .operator-home-grid,
  .home-session-grid,
  .operator-flowbar,
  .network-status-metrics,
  .network-inventory-strip,
  .audience-library-strip,
  .operator-action-grid.five-actions,
  .operator-action-grid.four-actions,
  .operator-action-grid.three-actions,
  .operator-action-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .network-build-journey { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .network-build-step { min-height: 118px; }
  .user-first-action-grid,
  .reach-people-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .network-action-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quick-audience-why { grid-template-columns: 1fr; }
  .quick-steps,
  .quick-result-strip,
  .quick-empty,
  .quick-message-grid,
  .quick-audience-sample { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-first-value-preview { grid-template-columns: 1fr; }
  .utility-expansion-priority-row,
  .utility-expansion-period-grid { grid-template-columns: 1fr; }
  .today-value-board { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .success-model-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .success-scoreboard,
  .inventory-builder-summary,
  .utility-creation-head,
  .response-learning-run,
  .utility-acquisition-run,
  .utility-expansion-run,
  .utility-milestone-run,
  .first100-utility-workpack { grid-template-columns: 1fr; }
  .utility-stage-grid,
  .utility-period-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .builder-milestone-grid,
  .builder-work-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .creation-score-grid,
  .creation-mission-grid,
  .creation-run-grid,
  .response-learning-score-grid,
  .response-chain-grid,
  .response-match-grid,
  .response-channel-grid,
  .response-steward-grid,
  .utility-acquisition-lane-grid,
  .utility-acquisition-source-grid,
  .utility-ledger-chain,
  .utility-milestone-score-grid,
  .utility-milestone-target-grid,
  .utility-milestone-work-grid,
  .first100-target-grid,
  .first100-work-grid,
  .utility-expansion-target-grid,
  .utility-expansion-work-grid,
  .utility-actor-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .value-inventory-summary,
  .value-verification-summary,
  .value-proof-grid,
  .value-verification-grid,
  .utility-proof-board,
  .utility-proof-run-grid,
  .utility-creation-grid,
  .value-inventory-doctrine { grid-template-columns: 1fr; }
  .value-verification-grid.compact { grid-template-columns: 1fr; }
  .value-inventory-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .live-value-flow { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .live-value-flow::before { display: none; }
  .transaction-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .input-pipeline-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .recipient-value-summary,
  .recipient-value-empty,
  .recipient-value-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .scale-decision-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .leadership-scale-grid { grid-template-columns: 1fr; }
  .approval-flow,
  .audience-gate-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .end-user-journey-board { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .scorecard-summary { grid-template-columns: 1fr; }
  .population-scorecard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .participation-review-metrics,
  .participation-work-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .participation-empty { grid-template-columns: 1fr; }
  .outcome-confirmation-preview,
  .exchange-closure-preview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .language-channel-summary,
  .channel-readiness-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .language-readiness-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .steward-auth-grid,
  .steward-auth-form { grid-template-columns: 1fr; }
  .steward-decision-grid { grid-template-columns: 1fr; }
  .web-user-value-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .voice-language-grid,
  .voice-language-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .search-discovery-board { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .search-channel-package { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .input-triage-board { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .source-to-utility-grid,
  .source-to-utility-chain,
  .source-to-utility-candidates,
  .source-url-utility-grid,
  .source-url-candidate-grid,
  .source-batch-score-grid,
  .source-batch-target-grid,
  .source-batch-candidate-grid,
  .source-batch-delivery-grid,
  .source-batch-execution-grid,
  .source-batch-workpack-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .source-batch-execution.primary { grid-column: span 2; }
  .role-output-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .population-channel-grid,
  .chain-summary-grid,
  .activation-lane-grid,
  .utility-chain-closure-grid,
  .utility-closure-grid,
  .utility-work-order-grid,
  .channel-preview-grid,
  .response-chip-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pipeline-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .agent-live-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .test-script-grid { grid-template-columns: 1fr; }
  .intake-grid { grid-template-columns: 1fr; }
  .file-row { grid-template-columns: 1fr; }
  .hero-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  .app { grid-template-columns: 1fr; }
  .sidebar {
    position: fixed; z-index: 40; left: 0; top: 0; width: 264px;
    transform: translateX(-100%); transition: transform .22s ease;
  }
  .app.nav-open .sidebar { transform: none; }
  .app.nav-open .scrim { display: block; position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 30; }
  .menu-btn { display: inline-block; }
  .topbar-status { display: none; }
  .topbar { align-items: flex-start; flex-wrap: wrap; }
  .action-dock { margin: 0 16px; top: 132px; }
  .topbar > div:nth-of-type(2) { width: 100%; }
  .nav-controls { order: 3; width: 100%; }
  .view { padding: 18px 16px; }
  .hero-copy { padding: 22px; }
  .hero-copy h2 { font-size: 38px; }
  .pipeline-grid { grid-template-columns: 1fr; }
  .agent-live-grid, .map-grid { grid-template-columns: 1fr; }
  .band-head { align-items: flex-start; flex-direction: column; }
  .hero-metrics { grid-template-columns: 1fr; }
  .hero-metrics div { min-height: 112px; }
}
@media (max-width: 640px) {
  body {
    font-size: 16px;
  }
  .topbar {
    gap: 8px;
    padding: 9px 10px;
  }
  .topbar h1 {
    font-size: 15px;
    line-height: 1.25;
  }
  .badges {
    width: 100%;
    overflow-x: auto;
    padding-bottom: 2px;
  }
  .badge {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
  }
  .brand {
    padding-bottom: 10px;
  }
  .brand-text strong {
    font-size: 14px;
  }
  .brand-text span {
    font-size: 10px;
    letter-spacing: .08em;
  }
  .nav-item,
  .nav-control,
  .action,
  .as-button,
  .command-pill,
  button {
    min-height: 44px;
  }
  input,
  select,
  textarea,
  .session-form input,
  .session-form select {
    min-height: 44px;
    font-size: 16px;
  }
  .home-session-panel {
    padding: 10px;
  }
  .session-card {
    padding: 12px;
  }
  .session-card strong {
    font-size: 16px;
  }
  .session-actions,
  .social-login-grid {
    grid-template-columns: 1fr;
    display: grid;
  }
  .session-actions .action,
  .social-login-grid .action {
    width: 100%;
    justify-content: center;
  }
  .social-login-mount > div {
    max-width: 100%;
  }
  .view {
    padding: 12px 10px 56px;
  }
  .action-dock { position: static; margin: 0 16px 8px; border-top: 1px solid rgba(25,195,125,.34); border-radius: 8px; }
  .page-work-canvas { grid-template-columns: 1fr; }
  .page-map { grid-template-columns: 1fr; }
  .doctrine-grid { grid-template-columns: 1fr; }
  .network-definition-grid { grid-template-columns: 1fr; }
  .simple-workspace-grid { grid-template-columns: 1fr; }
  .network-build-journey,
  .operator-home-grid,
  .home-session-grid,
  .operator-flowbar,
  .network-status-metrics,
  .network-inventory-strip,
  .audience-library-strip,
  .operator-action-grid.five-actions,
  .operator-action-grid.four-actions,
  .operator-action-grid.three-actions,
  .operator-action-grid,
  .user-first-action-grid,
  .reach-people-steps { grid-template-columns: 1fr; }
  .user-first-home-panel { min-height: auto; }
  .network-action-grid,
  .quick-audience-why { grid-template-columns: 1fr; }
  .input-action-dashboard { grid-template-columns: 1fr; }
  .quick-steps,
  .quick-result-strip,
  .quick-empty,
  .quick-message-grid,
  .quick-audience-sample { grid-template-columns: 1fr; }
  .home-first-value-preview,
  .home-channel-stack,
  .nation-dashboard-head,
  .nation-dashboard-split,
  .nation-metrics,
  .nation-network-grid,
  .nation-attention-grid,
  .nation-attention-grid.compact,
  .nation-attention-grid.compact.response,
  .nation-next-actions { grid-template-columns: 1fr; }
  .nation-recommendation {
    grid-template-columns: 1fr;
  }
  .nation-recommendation .action {
    grid-row: auto;
    grid-column: auto;
    width: 100%;
  }
  .nation-session-actions,
  .nation-row {
    justify-content: flex-start;
  }
  .nation-row {
    align-items: flex-start;
    flex-direction: column;
  }
  .nation-row span {
    text-align: left;
  }
  .utility-expansion-priority-row,
  .utility-expansion-period-grid,
  .utility-expansion-metric-grid { grid-template-columns: 1fr; }
  .today-value-board { grid-template-columns: 1fr; }
  .success-model-grid,
  .scoreboard-daily,
  .builder-loop,
  .builder-milestone-grid,
  .builder-work-grid,
  .utility-creation-head,
  .response-learning-run,
  .utility-acquisition-run,
  .utility-milestone-run,
  .first100-utility-workpack,
  .utility-acquisition-lane-grid,
  .utility-acquisition-source-grid,
  .utility-ledger-chain,
  .utility-milestone-score-grid,
  .utility-milestone-target-grid,
  .utility-milestone-work-grid,
  .first100-target-grid,
  .first100-work-grid,
  .utility-stage-grid,
  .utility-period-grid,
  .creation-score-grid,
  .creation-mission-grid,
  .creation-run-grid,
  .response-learning-score-grid,
  .response-chain-grid,
  .response-match-grid,
  .response-channel-grid,
  .response-steward-grid { grid-template-columns: 1fr; }
  .value-inventory-summary,
  .value-inventory-grid,
  .value-verification-summary,
  .value-proof-grid,
  .value-verification-grid,
  .utility-proof-board,
  .utility-proof-run-grid,
  .utility-creation-grid,
  .value-inventory-doctrine { grid-template-columns: 1fr; }
  .value-verification-grid.compact { grid-template-columns: 1fr; }
  .live-value-flow { grid-template-columns: 1fr; }
  .transaction-grid { grid-template-columns: 1fr; }
  .input-pipeline-grid { grid-template-columns: 1fr; }
  .recipient-value-summary,
  .recipient-value-empty,
  .recipient-value-list,
  .recipient-value-grid { grid-template-columns: 1fr; }
  .scale-decision-summary,
  .leadership-scale-grid,
  .scale-flow,
  .approval-flow,
  .audience-gate-grid,
  .end-user-journey-board,
  .scorecard-summary,
  .population-scorecard-grid,
  .participation-review-metrics,
  .participation-work-grid,
  .participation-empty,
  .outcome-confirmation-preview,
  .exchange-closure-preview,
  .language-channel-summary,
  .channel-readiness-grid,
  .language-readiness-grid { grid-template-columns: 1fr; }
  .steward-auth-grid,
  .steward-auth-form { grid-template-columns: 1fr; }
  .steward-decision-grid { grid-template-columns: 1fr; }
  .web-user-value-grid { grid-template-columns: 1fr; }
  .voice-language-grid,
  .voice-language-columns { grid-template-columns: 1fr; }
  .search-discovery-board { grid-template-columns: 1fr; }
  .search-channel-package { grid-template-columns: 1fr; }
  .input-triage-board { grid-template-columns: 1fr; }
  .source-to-utility-grid,
  .source-to-utility-chain,
  .source-to-utility-candidates,
  .source-url-utility-grid,
  .source-url-candidate-grid,
  .source-batch-score-grid,
  .source-batch-target-grid,
  .source-batch-candidate-grid,
  .source-batch-delivery-grid,
  .source-batch-execution-grid,
  .source-batch-workpack-grid { grid-template-columns: 1fr; }
  .source-batch-execution.primary { grid-column: span 1; }
  .source-batch-workpack.primary { grid-column: span 1; }
  .role-output-grid { grid-template-columns: 1fr; }
  .population-channel-grid,
  .chain-summary-grid,
  .activation-lane-grid,
  .utility-chain-closure-grid,
  .utility-closure-grid,
  .utility-work-order-grid,
  .channel-preview-grid,
  .response-chip-grid { grid-template-columns: 1fr; }
  .page-command-strip { grid-template-columns: 1fr; }
}

/* CTO Dispatch 001 — WS5 Founder Acceptance Mode panel */
.founder-acceptance-mode {
  margin: 0 0 1rem;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.03);
}
.founder-acceptance-head { display: flex; flex-direction: column; gap: 0.1rem; margin-bottom: 0.6rem; }
.founder-acceptance-head .k { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: #64748b; }
.founder-acceptance-head h3 { margin: 0; font-size: 0.98rem; }
.founder-acceptance-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.35rem; }
.founder-acceptance-list li {
  display: flex; justify-content: space-between; gap: 1rem; align-items: baseline;
  padding: 0.35rem 0.55rem; border-radius: 8px;
  background: rgba(255, 255, 255, 0.75); border-left: 4px solid #94a3b8;
}
.founder-acceptance-list li[data-ok="yes"] { border-left-color: #0f766e; }
.founder-acceptance-list li[data-ok="no"] { border-left-color: #b45309; }
.founder-acceptance-list li span { color: #475569; }
.founder-acceptance-list li strong { text-align: right; word-break: break-word; }

/* Password/secret field with reversible eye toggle (Founder front door) */
.password-field { position: relative; display: inline-flex; align-items: center; width: 100%; }
.password-field input { flex: 1; padding-right: 3.4rem; }
.password-toggle {
  position: absolute; right: 0.3rem; top: 50%; transform: translateY(-50%);
  background: transparent; border: 1px solid rgba(148,163,184,0.5); border-radius: 6px;
  cursor: pointer; font-size: 0.72rem; font-weight: 700; padding: 0.15rem 0.45rem; opacity: 0.85;
}
.password-toggle:hover { opacity: 1; }
.workspace-import-approve { background: #166534 !important; }
.workspace-import-cancel { background: #e2e8f0 !important; color: #0f172a !important; }

/* Phase 1 operator import cockpit — durable "Recent Import Jobs" panel (high contrast for the live browser) */
.workspace-import-jobs-panel { margin-top: 0.9rem; padding: 0.9rem 1rem; border: 1px solid #94a3b8; border-radius: 12px; background: #ffffff; box-shadow: 0 1px 3px rgba(15, 23, 42, 0.18); }
.workspace-import-jobs-panel .workspace-active-head { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.4rem; }
.workspace-import-jobs-panel .workspace-active-head .k { color: #1e3a8a !important; background: #dbeafe; padding: 0.1rem 0.45rem; border-radius: 999px; font-size: 0.66rem; font-weight: 800; letter-spacing: 0.04em; }
.workspace-import-jobs-panel h3 { margin: 0; font-size: 1.02rem; color: #0f172a !important; font-weight: 800; }
.workspace-import-jobs-panel .action { color: #0f172a; background: #e2e8f0; border: 1px solid #94a3b8; }
.workspace-import-jobs { display: flex; flex-direction: column; gap: 0.55rem; margin: 0.55rem 0; }
.workspace-import-jobs-note { color: #334155; font-size: 0.75rem; font-weight: 600; }
.import-job-row { padding: 0.6rem 0.7rem; border-radius: 8px; border: 1px solid #cbd5e1; background: #f8fafc; font-size: 0.82rem; line-height: 1.45; color: #0f172a; }
.import-job-row .import-job-head { font-weight: 800; color: #0f172a; margin-bottom: 0.15rem; }
.import-job-row .import-job-meta, .import-job-row .import-job-counts, .import-job-row .import-job-class { color: #1e293b; }
.import-job-row .import-job-gate { color: #166534; font-weight: 700; margin-top: 0.15rem; }
.import-job-completed { border-left: 5px solid #16a34a; }
.import-job-importing { border-left: 5px solid #d97706; }
.import-job-canceled, .import-job-resumable { border-left: 5px solid #dc2626; }
.import-job-canceled .import-job-head { color: #b91c1c; }
.import-job-failed { border-left: 5px solid #991b1b; }
.import-job-rolledback { border-left: 5px solid #b45309; opacity: 0.92; }
.import-job-rolledback .import-job-head { color: #b45309; }
.import-job-actions { margin-top: 0.35rem; }
.import-job-actions .action { color: #0f172a; background: #fde68a; border: 1px solid #b45309; font-size: 0.75rem; padding: 0.25rem 0.55rem; }
/* Per-job result PINNED directly under the clicked row (CANDIDATE-13) — guaranteed adjacent + visible. */
.import-job-result:empty { display: none; }
.import-job-result { margin-top: 0.5rem; }
.import-job-actions .lifecycle-done { color: #b45309; font-weight: 700; font-size: 0.75rem; }
/* Governed Data Lifecycle panel (CANDIDATE-10) — high-contrast, readable. */
.workspace-lifecycle-panel { margin-top: 0.9rem; padding: 0.9rem 1rem; border: 1px solid #94a3b8; border-radius: 12px; background: #ffffff; box-shadow: 0 1px 3px rgba(15, 23, 42, 0.18); }
.workspace-lifecycle-panel .workspace-active-head { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.4rem; }
.workspace-lifecycle-panel .workspace-active-head .k { color: #7c2d12 !important; background: #fed7aa; padding: 0.1rem 0.45rem; border-radius: 999px; font-size: 0.66rem; font-weight: 800; letter-spacing: 0.04em; }
.workspace-lifecycle-panel h3 { margin: 0; font-size: 1.02rem; color: #0f172a !important; font-weight: 800; }
.workspace-lifecycle-note { display: block; color: #334155; font-size: 0.75rem; font-weight: 600; margin-bottom: 0.5rem; }
.lifecycle-control { padding: 0.55rem 0.65rem; border: 1px solid #cbd5e1; border-radius: 8px; background: #f8fafc; margin-bottom: 0.5rem; color: #0f172a; }
.lifecycle-control > strong { color: #0f172a; font-weight: 800; }
.lifecycle-help { color: #334155; font-size: 0.75rem; margin: 0.25rem 0 0; }
.lifecycle-retire-form { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.4rem; align-items: flex-end; }
.lifecycle-retire-form label { display: flex; flex-direction: column; font-size: 0.72rem; font-weight: 700; color: #0f172a; gap: 0.15rem; }
.lifecycle-retire-form input, .lifecycle-retire-form select { padding: 0.3rem 0.4rem; border: 1px solid #94a3b8; border-radius: 6px; background: #ffffff; color: #0f172a; }
.lifecycle-output { margin-top: 0.5rem; }
.lifecycle-retire-output { width: 100%; }
.lifecycle-impact { padding: 0.55rem 0.7rem; border: 1px solid #94a3b8; border-radius: 8px; background: #fffbeb; color: #0f172a; font-size: 0.8rem; }
.lifecycle-impact > strong { display: block; margin-bottom: 0.3rem; color: #7c2d12; }
.lifecycle-impact-row { display: flex; justify-content: space-between; gap: 1rem; border-bottom: 1px dashed #e2e8f0; padding: 0.1rem 0; }
.lifecycle-impact-row span { color: #334155; }
.lifecycle-impact-row strong { color: #0f172a; }
.lifecycle-status-strip { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; margin-bottom: 0.4rem; }
.lifecycle-inventory { color: #0f172a; font-weight: 800; font-size: 0.82rem; background: #dbeafe; border: 1px solid #93c5fd; border-radius: 999px; padding: 0.15rem 0.6rem; }
.lifecycle-livesend-banner { color: #7f1d1d; font-weight: 800; font-size: 0.78rem; letter-spacing: 0.04em; background: #fee2e2; border: 1px solid #fca5a5; border-radius: 999px; padding: 0.15rem 0.6rem; }
.lifecycle-role-badge { color: #14532d; font-weight: 800; font-size: 0.78rem; background: #dcfce7; border: 1px solid #86efac; border-radius: 999px; padding: 0.15rem 0.6rem; }
.lifecycle-role-note { color: #7c2d12; font-weight: 700; font-size: 0.72rem; }
.lifecycle-replace-form { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.4rem; align-items: center; }
.lifecycle-replace-form input[type=file] { font-size: 0.75rem; }
.nation-noncanonical-note { display: block; color: #7c2d12; font-weight: 600; font-size: 0.72rem; margin: 0.15rem 0 0.35rem; }
.lifecycle-livesend-line { margin-top: 0.35rem; color: #7f1d1d; font-weight: 700; font-size: 0.74rem; }
.workspace-lifecycle-panel .workspace-active-head .action { color: #0f172a; background: #e2e8f0; border: 1px solid #94a3b8; }
@keyframes lifecycleFlash { 0% { box-shadow: 0 0 0 3px #fbbf24; } 100% { box-shadow: 0 0 0 0 rgba(251,191,36,0); } }
.lifecycle-flash { animation: lifecycleFlash 0.9s ease-out; }


/* R5: single persistent identity banner, compact Audience cockpit, and no orphan Home spacers. */
.identity-banner {
  position: sticky;
  top: 0;
  z-index: 9;
  min-width: 0;
  height: 28px;
  overflow: hidden;
  display: flex;
  align-items: center;
  border-bottom: 1px solid rgba(124, 140, 255, .34);
  background: rgba(9, 16, 30, .98);
  color: #dbeafe;
  font: 700 11px/1.2 var(--mono);
  letter-spacing: .02em;
}
.identity-banner-track {
  display: flex;
  width: max-content;
  white-space: nowrap;
  animation: apol-identity-scroll 28s linear infinite;
  will-change: transform;
}
.identity-banner-track span { padding-inline: 2.5rem; }
.identity-banner:hover .identity-banner-track,
.identity-banner:focus .identity-banner-track,
.identity-banner:focus-within .identity-banner-track { animation-play-state: paused; }
@keyframes apol-identity-scroll { to { transform: translateX(-33.333333%); } }
.topbar { top: 28px; }
.view[data-view="intake"] > .spacer:has(+ .hidden-machinery) { display: none; }

.audience-primary-actions { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.audience-secondary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
  align-items: start;
}
.audience-compact-card {
  min-width: 0;
  border: 1px solid rgba(124, 140, 255, .24);
  border-radius: 10px;
  background: rgba(12, 21, 38, .94);
  color: var(--ink);
}
.audience-compact-card[open] { grid-column: 1 / -1; }
.audience-compact-card > summary {
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  color: var(--ink);
  font-weight: 800;
}
.audience-compact-card > summary span { color: var(--muted); font-size: 11px; font-weight: 600; }
.audience-compact-card > summary:focus-visible { outline: 2px solid var(--indigo); outline-offset: 2px; }
.audience-compact-body { padding: 0 10px 10px; }
.view[data-view="audience"] .workspace-import-jobs-panel,
.view[data-view="audience"] .workspace-lifecycle-panel {
  margin-top: 0;
  border-color: rgba(124, 140, 255, .22);
  background: rgba(8, 13, 24, .72);
  color: var(--ink);
  box-shadow: none;
}
.view[data-view="audience"] .workspace-import-jobs-panel h3,
.view[data-view="audience"] .workspace-lifecycle-panel h3 { color: var(--ink) !important; }
.view[data-view="audience"] .workspace-import-jobs-panel .action,
.view[data-view="audience"] .workspace-lifecycle-panel .action {
  color: var(--ink);
  background: var(--panel-2);
  border-color: var(--border);
}
@media (max-width: 980px) {
  .audience-primary-actions,
  .audience-secondary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .audience-primary-actions,
  .audience-secondary-grid { grid-template-columns: 1fr; }
  .audience-compact-card[open] { grid-column: auto; }
  .identity-banner { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .identity-banner-track { width: 100%; animation: none; transform: none; }
  .identity-banner-track span:first-child { overflow: hidden; text-overflow: ellipsis; padding-inline: 12px; }
  .identity-banner-track span[aria-hidden="true"] { display: none; }
}


/* UX/Assistant Truth Release 1: readable identity and explicit aggregate status semantics. */
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.identity-banner { height: 34px; font-size: clamp(12px, 1.1vw, 14px); line-height: 1.35; }
.identity-banner-track span { background: linear-gradient(90deg,#93c5fd,#c4b5fd,#f9a8d4,#fde68a,#86efac,#67e8f9); -webkit-background-clip: text; background-clip: text; color: transparent; }
.topbar { top: 34px; }
.nation-metric[data-status-kind]:not([data-status-kind=""]) strong { font-size: clamp(12px, .9vw, 15px) !important; line-height: 1.25; white-space: normal; overflow-wrap: anywhere; word-break: normal; }
.nation-metric[data-status-kind="not-verified"] strong { color: #fbbf24; }
.nation-metric[data-status-kind="not-calculated"] strong { color: #c4b5fd; }
.nation-metric[data-status-kind="source-not-connected"] strong { color: #fca5a5; }
.nation-metric[data-status-kind="unknown-unmapped"] strong { color: #93c5fd; }
.nation-metric[data-status-kind="conflicting-sources"] strong { color: #fdba74; }
@media (max-width: 620px) { .identity-banner { font-size: 12px; } }
@media (prefers-reduced-motion: reduce) {
.identity-banner { position: relative; height: auto; min-height: 34px; overflow: visible; }
.identity-banner-track { white-space: normal; }
.identity-banner-track span:first-child { overflow: visible; text-overflow: clip; white-space: normal; padding: 8px 12px; }
.topbar { top: 0; }
}
@media (forced-colors: active) { .identity-banner-track span { color: CanvasText; background: none; } }

/* ---------------------------------------------------------------------------
   P1 — Community Operator surface.
   A Community Operator (Operator / Read Only) gets the product, not the
   engineering furniture around it. Founder and Admin are unaffected: every
   internal diagnostic stays exactly where it was for them.
   These rules hide presentation only; they grant and revoke no authority.
   --------------------------------------------------------------------------- */
body.apol-community-operator .identity-banner { display: none; }
body.apol-community-operator .founder-acceptance-mode,
body.apol-community-operator [data-internal-only="true"] { display: none; }

/* P1R — connection requests inside the Search Home. */
.apt-connection-block { margin-top: 18px; padding-top: 14px; border-top: 1px solid rgba(148,163,184,.28); }
.apt-connection-block h4 { margin: 12px 0 6px; font-size: 14px; }
.workspace-row.apt-selectable { display: flex; gap: 10px; align-items: baseline; cursor: pointer; }
.workspace-row.apt-selectable input.apt-select { flex: none; }
button.action[disabled] { opacity: .55; cursor: not-allowed; }

/* P1R-R1 — governed counts sit at the top of the canonical Search Home. */
.apt-governed-counts:empty { display: none; }
.apt-governed-counts { margin-bottom: 14px; }
.apt-governed-counts .nation-population { margin: 0; }

/* ---------------------------------------------------------------------------
   P1 — static identity statement.
   The banner was a continuously scrolling marquee whose text was tripled so the
   loop could wrap seamlessly. Motion made it hard to read and the repetition
   read as a rendering fault. It is now one static, wrapping statement: the
   animation is removed outright (so reduced-motion needs no special case) and
   the two aria-hidden duplicates are not rendered.
   Community Operators keep the banner suppressed entirely via
   body.apol-community-operator above.
   --------------------------------------------------------------------------- */
.identity-banner-track {
  width: auto;
  white-space: normal;
  animation: none;
  will-change: auto;
}
.identity-banner-track span[aria-hidden="true"] { display: none; }
.identity-banner-track span { padding: 6px 12px; }
.identity-banner {
  align-items: flex-start;
  line-height: 1.35;
}
/* The pause-on-hover rules only existed to interrupt the scroll; with no
   animation they are inert, but keep the selector honest. */
.identity-banner:hover .identity-banner-track,
.identity-banner:focus .identity-banner-track,
.identity-banner:focus-within .identity-banner-track { animation: none; }

/* ---------------------------------------------------------------------------
   P1-BETA1A — invited leadership beta shell.
   The beta strip and the offline banner are static text only. No governed figure is
   rendered by either one, online or offline.
   --------------------------------------------------------------------------- */
.beta-strip {
  margin: 10px 18px 0;
  padding: 10px 12px;
  border: 1px solid rgba(124, 140, 255, .28);
  border-radius: 10px;
  background: rgba(12, 21, 38, .94);
  color: var(--ink);
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: stretch;
  /* A phone is the only device this beta is reviewed on. Long words in the task and boundary
     copy break rather than push the document sideways at 360px. */
  min-width: 0;
  overflow-wrap: anywhere;
}
.beta-title { margin: 0; font-size: 14px; line-height: 1.35; color: var(--ink); }
.beta-note { margin: 0; flex: 1 1 260px; min-width: 0; font-size: 13px; line-height: 1.45; color: var(--muted); }
.beta-note strong { color: var(--ink); }
.beta-access-status { margin: 0; min-width: 0; font-size: 13px; line-height: 1.45; color: var(--ink); }
.beta-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.beta-cta,
.beta-install,
.beta-install-help {
  min-height: 44px;
  padding: 8px 14px;
  border-radius: 10px;
  border: 1px solid rgba(25, 195, 125, .38);
  background: rgba(12, 21, 38, .94);
  color: var(--ink);
  font-size: 14px;
}
/* The primary action must stay a comfortable thumb target in both dimensions. */
.beta-cta {
  min-width: 44px;
  border-color: rgba(25, 195, 125, .62);
  font-weight: 600;
}
.beta-cta[disabled] { opacity: .55; cursor: not-allowed; }
.beta-install[disabled] { opacity: .55; cursor: not-allowed; }
.beta-ios-steps { flex: 1 1 100%; margin: 0; font-size: 13px; line-height: 1.45; color: var(--muted); }
.beta-strip [hidden] { display: none; }

.offline-banner {
  margin: 10px 18px 0;
  padding: 10px 12px;
  border: 1px solid rgba(251, 191, 36, .45);
  border-radius: 10px;
  background: rgba(48, 33, 8, .94);
  color: #fde68a;
  font-size: 13px;
  line-height: 1.45;
}
.offline-banner[hidden] { display: none; }
.offline-banner strong { color: #fff7d6; }

/* The feedback launcher (apol-feedback-ui.js) is fixed at bottom-right, and the action dock
   sits in the same corner. On a phone they overlap, and the dock is where primary actions
   live — so the dock clears the launcher rather than the other way round. */
@media (max-width: 640px) {
  .beta-strip,
  .offline-banner { margin-left: 10px; margin-right: 10px; }
  .beta-actions { width: 100%; }
  .beta-cta,
  .beta-install,
  .beta-install-help { flex: 1 1 auto; }
  .action-dock {
    left: 10px;
    right: 10px;
    width: auto;
    bottom: 74px;
  }
}

/* 360px is the narrowest phone this beta supports. Nothing may push the page sideways, and
   the fixed dock must not bury the end of a scrolled view. */
@media (max-width: 420px) {
  body { max-width: 100%; overflow-x: hidden; }
  .view { padding-left: 10px; padding-right: 10px; padding-bottom: 150px; }
  .beta-note,
  .beta-access-status,
  .beta-ios-steps { font-size: 12.5px; }
  .beta-strip,
  .offline-banner { overflow-wrap: anywhere; }
  /* 44px in both dimensions survives the narrowest supported phone. */
  .beta-cta { min-height: 44px; min-width: 44px; }
}

/* ---------------------------------------------------------------------------
   P1-BETA1A — mobile corrections found by driving a real browser at 360/390/412px.
   Each of these was invisible to a "does the page scroll sideways" check: the layout
   fitted the viewport and was still unusable.
   --------------------------------------------------------------------------- */

/* The identity statement is permanently static now, but the banner kept the fixed height and
   overflow:hidden it needed while the text scrolled past. On a phone the statement wrapped to
   three lines inside a 34px box and was cut off mid-sentence — the opposite of the readable
   static statement the marquee was replaced with. The reduced-motion block already had the
   right geometry; it applies unconditionally here, because there is no longer any motion to
   reduce. */
.identity-banner {
  position: relative;
  height: auto;
  min-height: 34px;
  overflow: visible;
}
.identity-banner-track span:first-child {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  padding: 8px 12px;
}
/* The banner no longer sticks, so the bar below it starts at the top of the scroll area
   rather than being offset by a height the banner no longer has. */
.topbar { top: 0; }

@media (max-width: 640px) {
  /* The three-column topbar put the page title in a narrow auto-sized column: at 390px it
     rendered one word per line, and the status badge was pushed past the right edge (only
     hidden because the page clips horizontal overflow). Stack the bar instead: controls on
     one row, then title, status and badges each on their own full-width row. */
  .topbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
  }
  .menu-btn { order: 1; }
  .nav-controls { order: 2; }
  .topbar > div:nth-of-type(2) { order: 3; flex: 1 1 100%; min-width: 0; }
  .topbar-status { order: 4; flex: 1 1 100%; }
  .badges { order: 5; flex: 1 1 100%; overflow-x: visible; flex-wrap: wrap; display: flex; gap: 6px; }
  .topbar h1 { font-size: 16px; line-height: 1.3; overflow-wrap: anywhere; }
  /* A badge that cannot wrap is a badge that leaves the screen. */
  .badge { white-space: normal; max-width: 100%; }

  /* The assistant launcher (apol-assistant.js) is fixed in a bottom corner and covered the
     sign-in button. That module is outside this change, so it is made compact here and the
     scrolling content is given enough room that any primary action can be scrolled clear of it.

     APOL-FEEDBACK-FIX: #apol-feedback-fab is deliberately no longer named in this rule. It is
     not a fixed launcher any more — it sits in the topbar control row in normal flow (see
     .apol-feedback-launcher below), so it has no `bottom` for a rule here to constrain and there
     is nothing for content to be scrolled clear of. Leaving it named would have left an inert
     declaration reading as though an overlay were still being managed. */
  #apol-assistant-fab {
    bottom: 8px !important;
    padding: 7px 11px !important;
    font-size: 12px !important;
  }
  .view { padding-bottom: 132px; }
}

/* BETA-01 — the one statement of what this beta does not do. Readable at a phone width,
   never a banner that competes with the offline notice for the same attention. */
.beta-unavailable-statement {
  margin: 0 0 10px;
  padding: 8px 12px;
  border: 1px solid #2a3a55;
  border-left: 3px solid #62b4ff;
  border-radius: 8px;
  background: #0e1626;
  color: #cbd5e1;
  font-size: 13px;
  line-height: 1.45;
}

/* ==========================================================================================
   BETA-02 INC-2 — the Leader workspace shell.

   One workspace, four sections, mounted inside the Home session panel. The rules that matter
   here are not decorative: an UNAVAILABLE state must never look like a zero, a state must be
   readable without colour vision, a focused heading must be visibly focused, and nothing may
   overflow a phone. Colour is always accompanied by the state word the module writes out.
   ========================================================================================== */

.leader-workspace {
  margin: 12px 0 0;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--panel);
  box-shadow: var(--shadow);
}

.leader-workspace-head h2 {
  margin: 0 0 4px;
  font-size: 18px;
  line-height: 1.25;
}

.leader-workspace-statement {
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}

.leader-workspace-refresh {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-bottom: 12px;
}

.leader-workspace-refresh .leader-note { margin: 0; }

/* Real anchors to real headings. They wrap rather than scroll off a narrow screen. */
.leader-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px 0 12px;
  border-bottom: 1px solid var(--border-soft);
}

.leader-nav-link {
  display: inline-block;
  padding: 7px 11px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--panel-2);
  color: var(--ink);
  font-size: 13px;
  line-height: 1.2;
  text-decoration: none;
}

.leader-nav-link:hover { background: var(--panel-3); }

.leader-section {
  padding: 14px 0;
  border-bottom: 1px solid var(--border-soft);
}

.leader-section:last-child { border-bottom: 0; }

.leader-section > h3 {
  margin: 0 0 8px;
  font-size: 15px;
  line-height: 1.3;
}

/* A heading that receives focus after in-page navigation has to SHOW that it did. */
.leader-nav-link:focus-visible,
.leader-section > h3:focus,
.leader-section > h3:focus-visible,
.leader-workspace button:focus-visible {
  outline: 2px solid var(--indigo);
  outline-offset: 2px;
  border-radius: 4px;
}

.leader-block { margin: 0 0 14px; }
.leader-block > h4 { margin: 0 0 4px; font-size: 13px; line-height: 1.3; }

.leader-source,
.leader-coverage,
.leader-loaded,
.leader-note {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.leader-evidence {
  margin: 6px 0 0;
  padding-left: 16px;
  color: var(--faint);
  font-size: 11px;
  line-height: 1.55;
}

.leader-evidence li { overflow-wrap: anywhere; }
.leader-evidence a { color: var(--indigo); overflow-wrap: anywhere; }

.leader-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 10px;
  margin-top: 10px;
}

.leader-metric {
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-left: 3px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--panel-2);
  min-width: 0;
}

.leader-metric-label {
  display: block;
  color: var(--muted);
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.leader-metric-value {
  display: block;
  margin: 3px 0;
  font-size: 20px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

/* The state word, always rendered, so the distinction never rests on colour alone. */
.leader-metric-state {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 999px;
  font-size: 10px;
  letter-spacing: 0.06em;
}

.leader-metric[data-metric-state="AVAILABLE"] { border-left-color: var(--accent); }
.leader-metric[data-metric-state="AVAILABLE"] .leader-metric-state {
  background: var(--accent-soft);
  color: var(--accent);
}

/* Unavailable is visually and semantically a DIFFERENT thing from a figure of zero: no
   emphasis weight, a warning edge, and the word itself in the value slot. */
.leader-metric[data-metric-state="UNAVAILABLE"] { border-left-color: var(--warn); }
.leader-metric[data-metric-state="UNAVAILABLE"] .leader-metric-value {
  font-size: 13px;
  font-weight: 500;
  color: var(--warn);
}
.leader-metric[data-metric-state="UNAVAILABLE"] .leader-metric-state {
  background: var(--warn-soft);
  color: var(--warn);
}

.leader-state {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  margin: 8px 0;
  padding: 9px 12px;
  border: 1px solid var(--border);
  border-left: 3px solid var(--faint);
  border-radius: var(--radius-sm);
  background: var(--panel-2);
}

.leader-state-label {
  font-size: 11px;
  letter-spacing: 0.06em;
}

.leader-state-message {
  margin: 0;
  flex: 1 1 240px;
  min-width: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
}

.leader-state[data-state="UNAVAILABLE"] { border-left-color: var(--warn); }
.leader-state[data-state="UNAVAILABLE"] .leader-state-label { color: var(--warn); }
.leader-state[data-state="LOADING"] { border-left-color: var(--indigo); }
.leader-state[data-state="LOADING"] .leader-state-label { color: var(--indigo); }

.leader-drafts {
  list-style: none;
  margin: 10px 0 0;
  padding: 0;
  display: grid;
  gap: 10px;
}

.leader-draft {
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--panel-2);
  min-width: 0;
}

.leader-draft-title {
  margin: 0;
  font-size: 14px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.leader-sources { margin-top: 10px; }

/* ==========================================================================================
   BETA-02 INC-3 — the Create a Value Item form.

   It is the one write affordance on this surface, so it is styled to look like what it is: a
   distinct block, sitting above My Mission and outside it. Every control is a real labelled
   form control, every field wraps rather than overflowing a phone, and the outcome state
   (READY / SAVING / DRAFT CREATED / NOT SAVED) is a WORD in the DOM, reusing .leader-state so
   it is readable without colour vision exactly as every other state on this workspace is.
   ========================================================================================== */

.leader-compose { padding: 14px 0; }

.leader-compose > h3 {
  margin: 0 0 8px;
  font-size: 15px;
  line-height: 1.3;
}

.leader-compose > h3:focus,
.leader-compose > h3:focus-visible {
  outline: 2px solid var(--indigo);
  outline-offset: 2px;
  border-radius: 4px;
}

.leader-field {
  margin: 0 0 10px;
  min-width: 0;
}

.leader-field label {
  display: block;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.leader-field input,
.leader-field textarea,
.leader-compose select {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--panel-2);
  color: var(--ink);
  font: inherit;
  font-size: 13px;
  line-height: 1.4;
}

.leader-field textarea { resize: vertical; min-height: 92px; }

.leader-field input:focus-visible,
.leader-field textarea:focus-visible,
.leader-compose select:focus-visible,
.leader-choice input:focus-visible {
  outline: 2px solid var(--indigo);
  outline-offset: 2px;
}

.leader-fieldset {
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--panel-2);
  min-width: 0;
}

.leader-fieldset > legend {
  padding: 0 4px;
  color: var(--ink);
  font-size: 12px;
  line-height: 1.3;
}

.leader-choices {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin-top: 6px;
}

.leader-choice {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.leader-choice input { flex: 0 0 auto; margin: 0; }

.leader-compose-submit-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin: 12px 0 0;
}

.leader-compose-errors { color: var(--warn); font-size: 12px; }
.leader-compose-errors li { overflow-wrap: anywhere; }

.leader-state[data-state="DRAFT CREATED"] { border-left-color: var(--accent); }
.leader-state[data-state="DRAFT CREATED"] .leader-state-label { color: var(--accent); }
.leader-state[data-state="NOT SAVED"] { border-left-color: var(--warn); }
.leader-state[data-state="NOT SAVED"] .leader-state-label { color: var(--warn); }
.leader-state[data-state="SAVING"] { border-left-color: var(--indigo); }
.leader-state[data-state="SAVING"] .leader-state-label { color: var(--indigo); }

/* ==========================================================================================
   BETA-02 INC-4 — the per-draft communication preview.

   Composed locally from the draft's own fields, so it is presented as a quotation of what the
   draft would say rather than as another evidence list. Its state (AVAILABLE / UNAVAILABLE) is a
   WORD in the DOM as well as a colour, so a preview that could not be composed is readable
   without colour vision.
   ========================================================================================== */

.leader-preview {
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-left: 3px solid var(--indigo);
  border-radius: var(--radius-sm);
  background: var(--panel);
  min-width: 0;
}

.leader-preview[data-preview-state="UNAVAILABLE"] { border-left-color: var(--warn); }
.leader-preview[data-preview-state="UNAVAILABLE"] .leader-preview-label { color: var(--warn); }

.leader-preview-heading {
  margin: 0 0 4px;
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
}

.leader-preview-message { margin-top: 8px; }
.leader-preview-message p { margin: 0 0 6px; overflow-wrap: anywhere; }
.leader-preview-message p:last-child { margin-bottom: 0; }

.leader-preview-headline {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
}

.leader-preview-text { font-size: 13px; line-height: 1.5; }

.leader-preview-what,
.leader-preview-audience,
.leader-preview-cta {
  font-size: 12px;
  color: var(--muted);
}

.leader-preview-missing { margin-top: 8px; font-size: 12px; }
.leader-preview-missing p { margin: 4px 0; overflow-wrap: anywhere; }
.leader-preview-label { letter-spacing: 0.04em; }

/* ==========================================================================================
   BETA-02 INC-5 — the smartphone and SMS rendering of that same composed message.

   Two presentations of ONE text: a handset frame showing the lines a reader would see, and the
   plain text with its GSM-03.38 character and segment figures. Its state (AVAILABLE /
   UNAVAILABLE) is a WORD in the DOM as well as a colour, so a rendering that could not be
   measured is readable without colour vision. Nothing here may widen a phone: the frame is
   capped at the column width and the text block wraps rather than scrolling the page sideways.
   ========================================================================================== */

.leader-sms-preview {
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-left: 3px solid var(--accent);
  border-radius: var(--radius-sm);
  background: var(--panel);
  min-width: 0;
}

.leader-sms-preview[data-preview-state="UNAVAILABLE"] { border-left-color: var(--warn); }
.leader-sms-preview[data-preview-state="UNAVAILABLE"] .leader-preview-label { color: var(--warn); }

.leader-sms-device {
  margin: 8px 0;
  width: 100%;
  max-width: 260px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: var(--bg);
  padding: 8px;
  min-width: 0;
}

.leader-sms-device-bar {
  display: block;
  text-align: center;
  font-size: 10px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  padding-bottom: 6px;
}

.leader-sms-screen {
  border-radius: 12px;
  background: var(--panel);
  padding: 8px;
  min-width: 0;
}

.leader-sms-bubble {
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 8px 10px;
  background: var(--bg);
  min-width: 0;
}

.leader-sms-line {
  margin: 0 0 6px;
  font-size: 13px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.leader-sms-line:last-child { margin-bottom: 0; }

.leader-sms-plain { margin-top: 8px; min-width: 0; }

.leader-sms-text {
  margin: 4px 0 8px;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg);
  font-size: 12px;
  line-height: 1.5;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  max-width: 100%;
}

.leader-sms-note {
  margin: 4px 0 0;
  font-size: 12px;
  color: var(--muted);
  overflow-wrap: anywhere;
}

.leader-sms-note[data-sms-multipart="yes"] { color: var(--warn); }

.leader-sms-missing { margin-top: 8px; font-size: 12px; }
.leader-sms-missing p { margin: 4px 0; overflow-wrap: anywhere; }

@media (max-width: 720px) {
  .leader-workspace { padding: 12px 10px; }
  .leader-metrics { grid-template-columns: 1fr; }
  .leader-nav-link { flex: 1 1 auto; text-align: center; }
  .leader-metric-value { font-size: 18px; }
  .leader-choices { gap: 6px 10px; }
  .leader-fieldset { padding: 10px; }
}

/* ==========================================================================================
   CL-002 — the Audience beneficiary-definition workflow (apol-audience-workflow.js).

   Every colour here is stated explicitly against the dark ground the shell paints. The
   harness's DOM booleans have missed white-on-white text three times in this engagement, so
   no rule below inherits a colour it has not named, and no state rests on colour alone: each
   status and each figure carries its state as a WORD as well.
   ========================================================================================== */

.apol-aud {
  margin-bottom: 14px;
  min-width: 0;
}

.apol-aud .panel-h { margin-bottom: 8px; }

.apol-aud-lead {
  margin: 0 0 8px;
  color: var(--ink);
  font-size: 13px;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.apol-aud-note {
  margin: 0 0 8px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

.apol-aud-link { color: var(--indigo); overflow-wrap: anywhere; }

/* A fieldset defaults to min-width:auto, which is the classic source of a grid child that
   refuses to shrink and pushes the document sideways on a phone. */
.apol-aud-step {
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--panel-2);
  min-width: 0;
}

.apol-aud-step > legend {
  padding: 0 4px;
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.3;
}

.apol-aud-field { margin: 0 0 10px; min-width: 0; }

.apol-aud-field label {
  display: block;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.apol-aud-field input,
.apol-aud-field select {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--panel-3);
  color: var(--ink);
  font: inherit;
  font-size: 13px;
  line-height: 1.4;
}

/* Some platforms paint a native option list on a light ground and inherit the control's
   colour into it, which is exactly how white-on-white happens. Both are named. */
.apol-aud-field select option {
  background: var(--panel-3);
  color: var(--ink);
}

.apol-aud-field input:focus-visible,
.apol-aud-field select:focus-visible,
.apol-aud button:focus-visible,
.apol-aud a:focus-visible,
.apol-aud h3:focus,
.apol-aud h3:focus-visible {
  outline: 2px solid var(--indigo);
  outline-offset: 2px;
  border-radius: 4px;
}

.apol-aud-state {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  margin: 8px 0 0;
  padding: 9px 12px;
  border: 1px solid var(--border);
  border-left: 3px solid var(--faint);
  border-radius: var(--radius-sm);
  background: var(--panel);
  min-width: 0;
}

.apol-aud-state-label {
  color: var(--ink);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
}

.apol-aud-state-message {
  margin: 0;
  flex: 1 1 220px;
  min-width: 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.apol-aud-state[data-state="AVAILABLE"],
.apol-aud-state[data-state="AUDIENCE SAVED"] { border-left-color: var(--accent); }
.apol-aud-state[data-state="AVAILABLE"] .apol-aud-state-label,
.apol-aud-state[data-state="AUDIENCE SAVED"] .apol-aud-state-label { color: var(--accent); }

.apol-aud-state[data-state="UNAVAILABLE"],
.apol-aud-state[data-state="NOT SAVED"],
.apol-aud-state[data-state="NONE YET"] { border-left-color: var(--warn); }
.apol-aud-state[data-state="UNAVAILABLE"] .apol-aud-state-label,
.apol-aud-state[data-state="NOT SAVED"] .apol-aud-state-label,
.apol-aud-state[data-state="NONE YET"] .apol-aud-state-label { color: var(--warn); }

.apol-aud-state[data-state="LOADING"],
.apol-aud-state[data-state="SAVING"] { border-left-color: var(--indigo); }
.apol-aud-state[data-state="LOADING"] .apol-aud-state-label,
.apol-aud-state[data-state="SAVING"] .apol-aud-state-label { color: var(--indigo); }

.apol-aud-counts { margin-top: 8px; min-width: 0; }

.apol-aud-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
  margin: 8px 0;
}

.apol-aud-metric {
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-left: 3px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--panel);
  min-width: 0;
}

.apol-aud-metric-label {
  display: block;
  color: var(--muted);
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.apol-aud-metric-value {
  display: block;
  margin: 3px 0;
  color: var(--ink);
  font-size: 20px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

/* The state word, always rendered, so the distinction never rests on colour alone. */
.apol-aud-metric-state {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.06em;
}

.apol-aud-metric[data-metric-state="AVAILABLE"] { border-left-color: var(--accent); }
.apol-aud-metric[data-metric-state="AVAILABLE"] .apol-aud-metric-state {
  background: var(--accent-soft);
  color: var(--accent);
}

/* UNAVAILABLE is visually and semantically a DIFFERENT thing from a figure of zero: the word
   itself sits in the value slot, without the emphasis weight a real figure carries. */
.apol-aud-metric[data-metric-state="UNAVAILABLE"] { border-left-color: var(--warn); }
.apol-aud-metric[data-metric-state="UNAVAILABLE"] .apol-aud-metric-value {
  font-size: 13px;
  font-weight: 700;
  color: var(--warn);
}
.apol-aud-metric[data-metric-state="UNAVAILABLE"] .apol-aud-metric-state {
  background: var(--warn-soft);
  color: var(--warn);
}

/* Class, scope, source and as-of, on their own lines under every figure. */
.apol-aud-provenance {
  margin: 6px 0 0;
  color: var(--faint);
  font-size: 11px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.apol-aud-provenance span { display: block; }
.apol-aud-unavailable-note { color: var(--warn); }

.apol-aud-submit-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin: 10px 0 0;
}

.apol-aud-errors {
  margin: 8px 0 0;
  padding-left: 16px;
  color: var(--warn);
  font-size: 12px;
  line-height: 1.55;
}

.apol-aud-errors li { overflow-wrap: anywhere; }

@media (max-width: 720px) {
  .apol-aud-metrics { grid-template-columns: 1fr; }
  .apol-aud-step { padding: 10px; }
  .apol-aud-metric-value { font-size: 18px; }
}

/* ---------------------------------------------------------------------------
   APOL-FEEDBACK-FIX — where the tester-feedback control lives, and the safe area.

   The launcher was `position: fixed; right: 16px; bottom: 16px`. Measured at 390x844 on the
   build before this one, `document.elementFromPoint` inside the 75x44 button at x=299 y=792
   returned BUTTON#apol-feedback-fab rather than the page: on Audience it took 2286 px^2 of the
   "Ward, Village or Clan" INPUT and 1952 px^2 of its LABEL, so the right-hand part of that field
   opened Feedback instead of taking focus; on Home it took 1123 px^2 of the "How these national
   figures are established" SUMMARY. At 1280x900 it took 1097 px^2 of a Home drill-down detail
   and 2675 px^2 of the Audience task note. Every one of those was at scroll offset 0.

   `.view { padding-bottom: 132px }` above was the previous attempt and is why it survived: bottom
   padding lets the END of a column clear an overlay, and says nothing about the middle of it.

   `.main` is the `1fr` track of `.app` at every width, so the console has no gutter a fixed control
   could occupy. The launcher is therefore in normal flow, in the topbar control row that already
   reserves its space. Its overlap with page content is zero because it is not in the overlay layer,
   not because its coordinates happen to miss.
   --------------------------------------------------------------------------- */
:root {
  /* env() resolved once here so script can read the insets back as plain pixels. 0px everywhere
     that has no notch, no rounded corner and no home indicator. */
  --apol-safe-top: env(safe-area-inset-top, 0px);
  --apol-safe-right: env(safe-area-inset-right, 0px);
  --apol-safe-bottom: env(safe-area-inset-bottom, 0px);
  --apol-safe-left: env(safe-area-inset-left, 0px);
}

.apol-feedback-launcher {
  /* Stated, not inherited: nothing may put this control back into the overlay layer. */
  position: static;
  flex: 0 0 auto;
  white-space: nowrap;
  /* Exactly as tall as the .nav-control buttons it stands beside. A taller launcher grows the
     topbar, and the topbar height is where the Audience view starts: at 1280x900 one extra pixel
     here moved that view from y=91 to y=92. */
  min-height: 34px;
}

/* The in-flow fallback rail, for any surface that has no topbar control row to host the launcher.
   It is the end of the main column, in the flow, above the home indicator — never an overlay. */
#apol-feedback-rail {
  display: flex;
  justify-content: flex-end;
  padding: 12px 18px;
  padding-bottom: calc(12px + var(--apol-safe-bottom, 0px));
}

@media (max-width: 640px) {
  /* 44px in both dimensions is the tap target this beta holds itself to on the narrowest phone
     it supports. The control row wraps rather than pushing anything off the edge. */
  .apol-feedback-launcher { min-height: 44px; }
  .nav-controls { flex-wrap: wrap; }
  #apol-feedback-rail { padding-left: 10px; padding-right: 10px; }
}

/* ===========================================================================================
   APOL-VIS-023 — the rolling Abasi-language identity banner, restored.

   BASELINE PORTED FROM: 7b0c9da6587c7f674e23d60b1fd84810334b7c7d
   ("feat(p1): community operator search home with governed, non-hard-coded eligibility").

   Why that commit and not another. The banner is one element — `.identity-banner` /
   `.identity-banner-track` — and which behaviour it has is decided purely by which
   declaration of `animation` on `.identity-banner-track` is last in this stylesheet.
   Reading the shipped bytes of each candidate:

     7b0c9da  `.identity-banner-track { animation: apol-identity-scroll 28s linear infinite }`
              is the LAST unconditional declaration. Only `@media (prefers-reduced-motion:
              reduce)` sets `animation: none`. The banner rolls.
     c088237  adds the block commented "P1 — static identity statement", which sets
              `animation: none`, `white-space: normal` and `span[aria-hidden="true"]
              { display: none }` UNCONDITIONALLY. From here on the banner is one static line
              and two of its three copies are not rendered.
     3569148  inherits that block unchanged (it is a Home-composition commit, not a banner
              one) and adds the four dashboards.
     7ff71b1  inherits it too, plus the P1-BETA1A geometry that grew the static box.

   So the last state in which the rolling banner existed is 7b0c9da, and the animation, the
   three-copy seamless track, the pause-on-hover and the pinned ribbon geometry are ported
   from that commit's rules verbatim. Nothing else is taken from it: 7b0c9da has no Home
   infographics at all (`grep -c apol-home-infographics` on its command-center.html is 0),
   so the four dashboards, the withdrawn population figure, the 37 jurisdictions and every
   other improvement in 7ff71b1 are untouched by this restoration.

   What is deliberately NOT reverted. The static, wrapping, single-copy statement that
   c088237 introduced was the right answer for someone who has asked their operating system
   to reduce motion, and for forced-colours. Both keep it, below. What changes is which of
   the two is the DEFAULT.
   =========================================================================================== */

/* The ribbon leads the application again: pinned above the navigation bar, one line tall,
   clipping the track that slides through it. The flex order that puts it first is set on
   `.main > .identity-banner` in command-center.html; this is the geometry that makes the
   clip work. */
.identity-banner {
  position: sticky;
  top: 0;
  z-index: 9;
  min-width: 0;
  height: 34px;
  overflow: hidden;
  display: flex;
  align-items: center;
  line-height: 1.2;
}

/* Three copies of the same sentence on one unwrapped line, translated by exactly one third,
   which is what makes the loop seamless rather than a jump. */
.identity-banner-track {
  display: flex;
  width: max-content;
  white-space: nowrap;
  animation: apol-identity-scroll 28s linear infinite;
  will-change: transform;
}
.identity-banner-track span,
.identity-banner-track span:first-child {
  display: block;
  white-space: nowrap;
  overflow: visible;
  text-overflow: clip;
  padding: 0 2.5rem;
}
/* The two decorative repeats are rendered again. They carry aria-hidden, so the statement is
   still announced exactly once. */
.identity-banner-track span[aria-hidden="true"] { display: block; }

/* Pause on hover and on focus, so the statement can be read and a keyboard user is never
   chasing moving text. These selectors are (0,2,0) and the P1 block set `animation: none` on
   them, which would out-specify the (0,1,0) rule above; they are restated here so the pause
   is a pause rather than a stop. */
.identity-banner:hover .identity-banner-track,
.identity-banner:focus .identity-banner-track,
.identity-banner:focus-within .identity-banner-track {
  animation: apol-identity-scroll 28s linear infinite;
  animation-play-state: paused;
}

/* The navigation bar stacks directly under the ribbon rather than beneath it in the same
   sticky slot. 34px is this banner's height, stated once here and once above. */
.topbar { top: 34px; }

@media (max-width: 640px) {
  /* On a phone the sticky navigation bar already wraps to several rows, and a second pinned
     strip above it would spend the first viewport on furniture. The ribbon still leads the
     page and still rolls; it simply scrolls away with the content instead of holding 34px of
     an 844px screen for the whole session. */
  .identity-banner { position: static; }
  .topbar { top: 0; }
}

@media (prefers-reduced-motion: reduce) {
  /* Unchanged in substance from what 7ff71b1 shipped for everyone: one static statement that
     wraps and is never clipped, with the decorative repeats not rendered. It is now the
     answer for the people who asked for it rather than the answer for everybody. */
  .identity-banner {
    position: static;
    height: auto;
    min-height: 34px;
    overflow: visible;
    align-items: flex-start;
    line-height: 1.35;
  }
  .identity-banner-track {
    width: auto;
    white-space: normal;
    animation: none;
    will-change: auto;
  }
  .identity-banner-track span,
  .identity-banner-track span:first-child {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    padding: 8px 12px;
  }
  .identity-banner-track span[aria-hidden="true"] { display: none; }
  .identity-banner:hover .identity-banner-track,
  .identity-banner:focus .identity-banner-track,
  .identity-banner:focus-within .identity-banner-track { animation: none; }
  .topbar { top: 0; }
}

/* Forced colours: the gradient fill is a decoration, and CanvasText is the only readable ink
   there. Restated after the rules above because those re-declare the span box. */
@media (forced-colors: active) {
  .identity-banner-track span { color: CanvasText; background: none; }
}

/* Community Operators still have the banner suppressed entirely. Restated last so no rule
   above can bring it back for them. */
body.apol-community-operator .identity-banner { display: none; }
