/* Elephant Harbor operating-console design system
   Source of truth: elephantharbor.github.io/shared/eh-console.css
   Segment sites load this file; keep only thin segment accents locally.

   Brand kinship: /brand/tokens.css (Maren steward) — Harbor Ink, Deep Tide,
   Signal Brass, Canvas, Fog. Console supports dark (default) + light themes.
   Theme toggle: shared/eh-theme.js (localStorage eh-console-theme).
   See docs/CONSOLE-THEME.md
*/
:root,
html[data-theme="dark"] {
  /* Canonical brand primitives */
  --eh-harbor-ink: #10262C;
  --eh-deep-tide: #236B6A;
  --eh-signal-brass: #D49A45;
  --eh-canvas: #F5F2EA;
  --eh-fog: #E8EFED;

  /* Dark desk surfaces */
  --bg: #0c1014;
  --bg2: #141a22;
  --bg3: #1c2430;
  --border: #2a3340;
  --text: #e8eef4;
  --muted: #8b9aab;
  --dim: #5c6b7a;

  --accent: #4a9e9c;
  --live: #3d9a6a;
  --warn: var(--eh-signal-brass);
  --danger: #c45c5c;
  --ok: #5a9a6e;
  --paper: var(--eh-signal-brass);

  /* Segment identity (distinctive, readable on dark) */
  --portfolio: #3db8b4;
  --capital: #5ba3e0;
  --presence: #a78bfa;
  --foundry: #d4a05a;
  --local: #2ec4a8;
  --eats: #e08a5c;
  --reach: #1a8fa8;
  --gaming: #9b5de5;

  /* Capital markets — related family, mutually distinct */
  --market-securities: #60a5fa;
  --market-options: #c084fc;
  --market-event: #4ade80;
  --market-crypto: #f59e0b;
  --market-sports: #38bdf8;
  --market-cash: #94a3b8;

  --font: "Manrope", "IBM Plex Sans", "Segoe UI", system-ui, sans-serif;
  --mono: "IBM Plex Mono", "SF Mono", ui-monospace, monospace;
  --segment: var(--portfolio);
  --atmosphere: var(--segment);
  --atmosphere-rgb: 61, 184, 180;
}

html[data-theme="light"] {
  --bg: var(--eh-canvas);
  --bg2: #ffffff;
  --bg3: var(--eh-fog);
  --border: color-mix(in srgb, var(--eh-harbor-ink) 14%, transparent);
  --text: var(--eh-harbor-ink);
  --muted: color-mix(in srgb, var(--eh-harbor-ink) 62%, white);
  --dim: color-mix(in srgb, var(--eh-harbor-ink) 48%, white);
  --accent: var(--eh-deep-tide);
  --live: #1f7a4d;
  --danger: #b33b3b;
  --ok: #2f7a4a;
  --portfolio: #1a7a76;
  --capital: #2b6ea8;
  --presence: #6d4fc4;
  --foundry: #a67a2e;
  --local: #0f8f78;
  --eats: #b85f35;
  --reach: #2eb8d4;
  --gaming: #c77dff;
  --market-securities: #2563eb;
  --market-options: #7c3aed;
  --market-event: #15803d;
  --market-crypto: #b45309;
  --market-sports: #0284c7;
  --market-cash: #475569;
}

/* Segment / market → atmosphere */
body.eh-portfolio { --segment: var(--portfolio); --atmosphere: var(--portfolio); --atmosphere-rgb: 61, 184, 180; }
body.eh-capital { --segment: var(--capital); --atmosphere: var(--capital); --atmosphere-rgb: 91, 163, 224; }
body.eh-presence { --segment: var(--presence); --atmosphere: var(--presence); --atmosphere-rgb: 167, 139, 250; }
body.eh-foundry { --segment: var(--foundry); --atmosphere: var(--foundry); --atmosphere-rgb: 212, 160, 90; }
body.eh-local { --segment: var(--local); --atmosphere: var(--local); --atmosphere-rgb: 46, 196, 168; }
body.eh-eats { --segment: var(--eats); --atmosphere: var(--eats); --atmosphere-rgb: 224, 138, 92; }
body.eh-reach { --segment: var(--reach); --atmosphere: var(--reach); --atmosphere-rgb: 26, 143, 168; }
body.eh-gaming { --segment: var(--gaming); --atmosphere: var(--gaming); --atmosphere-rgb: 155, 93, 229; }

body.eh-market-securities { --atmosphere: var(--market-securities); --atmosphere-rgb: 96, 165, 250; --segment: var(--market-securities); }
body.eh-market-options { --atmosphere: var(--market-options); --atmosphere-rgb: 192, 132, 252; --segment: var(--market-options); }
body.eh-market-event { --atmosphere: var(--market-event); --atmosphere-rgb: 74, 222, 128; --segment: var(--market-event); }
body.eh-market-crypto { --atmosphere: var(--market-crypto); --atmosphere-rgb: 245, 158, 11; --segment: var(--market-crypto); }
body.eh-market-sports { --atmosphere: var(--market-sports); --atmosphere-rgb: 56, 189, 248; --segment: var(--market-sports); }
body.eh-market-cash { --atmosphere: var(--market-cash); --atmosphere-rgb: 148, 163, 184; --segment: var(--market-cash); }

* { box-sizing: border-box; }
html, body {
  margin: 0; padding: 0;
  background: var(--bg); color: var(--text);
  font: 13px/1.45 var(--font);
  min-height: 100%;
  position: relative;
}
body {
  background:
    radial-gradient(1200px 600px at 10% -10%, rgba(var(--atmosphere-rgb), 0.28), transparent 55%),
    radial-gradient(900px 500px at 90% 0%, rgba(var(--atmosphere-rgb), 0.16), transparent 50%),
    linear-gradient(165deg, color-mix(in srgb, var(--atmosphere) 18%, var(--bg)) 0%, var(--bg) 42%, var(--bg) 100%);
  background-attachment: fixed;
}
body::before,
body::after {
  content: "";
  position: fixed;
  inset: -18%;
  pointer-events: none;
  z-index: 0;
}
body::before {
  opacity: 1;
  background:
    radial-gradient(circle at 14% 22%, rgba(var(--atmosphere-rgb), 0.72), transparent 48%),
    radial-gradient(circle at 86% 10%, rgba(var(--atmosphere-rgb), 0.5), transparent 44%),
    radial-gradient(circle at 68% 84%, rgba(var(--atmosphere-rgb), 0.58), transparent 50%),
    radial-gradient(circle at 46% 50%, rgba(var(--atmosphere-rgb), 0.28), transparent 58%);
  animation: eh-aurora 9s ease-in-out infinite alternate;
  will-change: transform, opacity;
  filter: saturate(1.15);
}
body::after {
  opacity: 0.55;
  background-image:
    linear-gradient(rgba(var(--atmosphere-rgb), 0.22) 1px, transparent 1px),
    linear-gradient(90deg, rgba(var(--atmosphere-rgb), 0.22) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse at center, #000 45%, transparent 82%);
  -webkit-mask-image: radial-gradient(ellipse at center, #000 45%, transparent 82%);
  animation: eh-drift 18s linear infinite;
  will-change: transform;
}
body > * { position: relative; z-index: 1; }
@keyframes eh-aurora {
  0% { transform: translate3d(-6%, 4%, 0) scale(1); opacity: 0.65; }
  50% { transform: translate3d(8%, -7%, 0) scale(1.18); opacity: 1; }
  100% { transform: translate3d(-7%, 5%, 0) scale(1.1); opacity: 0.8; }
}
@keyframes eh-drift {
  0% { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(48px, 48px, 0); }
}
@media (prefers-reduced-motion: reduce) {
  body::before,
  body::after { animation: none; opacity: 0.35; }
}
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
a:focus-visible, button:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
button { font: inherit; cursor: pointer; }

.topbar {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  padding: 10px 16px; border-bottom: 1px solid var(--border); background: var(--bg2);
}
.brand { display: flex; gap: 10px; align-items: center; min-width: 0; }
.mark {
  width: 32px; height: 32px; display: grid; place-items: center; flex: 0 0 auto;
  background: var(--bg3); border: 1px solid var(--border); border-radius: 4px;
  font-weight: 700; letter-spacing: 0.04em; color: var(--segment); font-size: 12px;
  text-decoration: none;
}
.topbar h1 { margin: 0; font-size: 15px; font-weight: 600; }
.sub, .muted { margin: 0; color: var(--muted); font-size: 12px; }
.dim { color: var(--dim); }
.updated, .top-meta { color: var(--dim); font-size: 12px; display: flex; gap: 10px; align-items: center; }

/* Cross-portfolio way-home */
.wayhome {
  display: flex; flex-wrap: wrap; gap: 2px; align-items: center;
  padding: 6px 12px; border-bottom: 1px solid var(--border); background: var(--bg);
  position: sticky; top: 0; z-index: 20;
}
.wayhome a {
  color: var(--muted); padding: 6px 10px; border-radius: 4px; border: 1px solid transparent;
  font-size: 13px;
}
.wayhome a:hover { color: var(--text); background: var(--bg2); text-decoration: none; }
.wayhome a.active {
  color: var(--text); background: var(--bg3); border-color: color-mix(in srgb, var(--segment) 45%, var(--border));
  box-shadow: inset 0 -2px 0 var(--segment);
}
.wayhome a[data-segment="capital"], .wayhome a[href*="harbor-capital"] { color: color-mix(in srgb, var(--capital) 75%, var(--muted)); }
.wayhome a[data-segment="presence"], .wayhome a[href*="harbor-presence"] { color: color-mix(in srgb, var(--presence) 75%, var(--muted)); }
.wayhome a[data-segment="foundry"], .wayhome a[href*="harbor-foundry"] { color: color-mix(in srgb, var(--foundry) 75%, var(--muted)); }
.wayhome a[data-segment="local"], .wayhome a[href*="harbor-local"], .wayhome a[href="#local"] { color: color-mix(in srgb, var(--local) 75%, var(--muted)); }
.wayhome a[data-segment="eats"], .wayhome a[href*="harbor-eats"] { color: color-mix(in srgb, var(--eats) 75%, var(--muted)); }
.wayhome a[data-segment="reach"], .wayhome a[href*="harbor-reach"] { color: color-mix(in srgb, var(--reach) 75%, var(--muted)); }
.wayhome a[data-segment="gaming"], .wayhome a[href*="harbor-gaming"] { color: color-mix(in srgb, var(--gaming) 75%, var(--muted)); }
.wayhome a[data-segment="portfolio"], .wayhome a.active[href="/"], .wayhome a.active[href="./"] {
  color: color-mix(in srgb, var(--portfolio) 80%, var(--text));
}
.wayhome .sep { color: var(--dim); padding: 0 4px; font-size: 12px; }

/* In-app primary nav (buttons or links) */
.nav {
  display: flex; flex-wrap: wrap; gap: 2px; padding: 6px 12px;
  border-bottom: 1px solid var(--border); background: var(--bg);
}
.nav button, .nav > a {
  background: transparent; border: 1px solid transparent; color: var(--muted);
  padding: 6px 10px; border-radius: 4px; font-size: 13px;
}
.nav button:hover, .nav > a:hover {
  color: var(--text); background: var(--bg2); text-decoration: none;
}
.nav button.active, .nav > a.active {
  color: var(--text); background: var(--bg3); border-color: var(--border);
}

/* Main content width — Local-wide column for every desk (≤1399: ~1280).
   Segment CSS must NOT set a competing main { max-width }. */
main { padding: 12px 16px 40px; max-width: 1280px; margin: 0 auto; }
.foot {
  border-top: 1px solid var(--border); padding: 8px 16px;
  color: var(--dim); font-size: 11px; max-width: 1280px; margin: 0 auto 12px;
}
@media (min-width: 1400px) {
  main,
  .foot {
    max-width: min(1680px, calc(100vw - 48px));
  }
}
@media (min-width: 1800px) {
  main,
  .foot {
    max-width: min(1840px, calc(100vw - 64px));
  }
}

.badge {
  display: inline-block; padding: 1px 7px; border-radius: 3px; font-size: 11px;
  border: 1px solid var(--border); color: var(--muted); white-space: nowrap;
}
.badge-operating, .badge-building, .badge-live, .badge.active {
  color: var(--live); border-color: #2d5a42; background: #14241c;
}
.badge-waiting, .badge.warn {
  color: var(--warn); border-color: #5a4020; background: #241a10;
}
.badge-paused, .badge-closed { color: var(--dim); }
.badge-capital { color: var(--capital); border-color: #3a5a78; }
.badge-presence { color: var(--presence); border-color: #4a3a68; }
.badge-foundry { color: var(--foundry); border-color: #5a4020; }
.badge-local { color: var(--local); border-color: #2a5a50; }
.badge-eats { color: var(--eats); border-color: #5a3a28; }
.badge-reach { color: var(--reach); border-color: #2a5058; }
.badge-gaming { color: var(--gaming); border-color: #4a3560; }
.badge-portfolio { color: var(--portfolio); border-color: #2a5a58; }
.badge-paper { color: var(--paper); border-color: #5a4a20; background: #241e10; }

.card, .tile, .attention, .note, .stat, .empty, .callout {
  border: 1px solid var(--border); border-radius: 8px; background: var(--bg2);
  padding: 12px 14px;
}

/* —— Desk surface primitives (Harbor Capital card model) ——
   Readable desk content must sit on opaque var(--bg2), never on the atmosphere grid.
   Adopters: segment desks (Eats, Gaming, Reach, …). See docs/NEW-SEGMENT-DESK.md */
.eh-desk-view {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.eh-desk-panel,
.eh-desk-card {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg2);
  padding: 12px 14px;
}
.eh-desk-panel__title,
.eh-desk-card__title {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 650;
  color: var(--text);
}
.eh-desk-panel__help,
.eh-desk-card__help {
  margin: 0 0 12px;
  font-size: 12px;
  color: var(--muted);
  max-width: 72ch;
}
.eh-desk-panel__body,
.eh-desk-card__body {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.eh-desk-card--inset {
  background: var(--bg3);
}
.eh-desk-table-wrap,
.card.table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin-top: 4px;
}
table.data,
table.eh-desk-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
table.data th,
table.data td,
table.eh-desk-table th,
table.eh-desk-table td {
  padding: 8px 12px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--border);
}
table.data th,
table.eh-desk-table th {
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--dim);
  background: var(--bg3);
  white-space: nowrap;
}
table.data tbody tr:last-child td,
table.eh-desk-table tbody tr:last-child td {
  border-bottom: none;
}
table.data tbody tr:hover td,
table.eh-desk-table tbody tr:hover td {
  background: color-mix(in srgb, var(--segment, var(--accent)) 6%, transparent);
}
.eh-desk-empty {
  padding: 18px 14px;
  text-align: center;
  color: var(--muted);
  font-size: 13px;
  border: 1px dashed var(--border);
  border-radius: 8px;
  background: var(--bg2);
}
.eh-desk-empty strong {
  display: block;
  color: var(--text);
  margin-bottom: 4px;
}
.callout.info { border-color: #3a5a78; }
.callout.warn { border-color: #5a4020; }
.section-title {
  margin: 20px 0 8px; font-size: 12px; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--dim); font-weight: 600;
}
.section-help { margin: 0 0 10px; color: var(--muted); font-size: 13px; max-width: 72ch; }
.lede { font-size: 15px; font-weight: 600; margin: 0 0 6px; }
.intro, .plain { color: var(--muted); max-width: 72ch; }

.kpi-row, .stats, .grid {
  display: grid; gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
}
.kpi, .stat {
  border: 1px solid var(--border); background: var(--bg2); border-radius: 6px; padding: 10px 12px;
}
.kpi .label, .stat .k {
  color: var(--dim); font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em;
}
.kpi .val, .stat .v { font-size: 18px; font-weight: 600; margin-top: 2px; }
.kpi .hint { color: var(--dim); font-size: 11px; margin-top: 2px; }

.btn {
  display: inline-block; padding: 7px 11px; border-radius: 4px;
  border: 1px solid var(--border); background: var(--bg3); color: var(--text); font-size: 13px;
}
.btn:hover { border-color: var(--accent); text-decoration: none; }
.btn.primary { border-color: #3a5a78; background: #1a2836; color: var(--accent); }
.btn.ghost { color: var(--muted); }

.attention.empty { color: var(--dim); }
.attention.hot { border-color: var(--warn); }
.loading { color: var(--muted); }
.error { color: var(--danger); }

.skip-link {
  position: absolute; left: -999px; top: 0; background: var(--bg3); color: var(--text);
  padding: 8px 12px; z-index: 100;
}
.skip-link:focus { left: 8px; top: 8px; }

@media (max-width: 520px) {
  .topbar { flex-wrap: wrap; }
  .updated { white-space: normal; }
}

/* Next Up (scheduled routines) */
.next-up {
  border: 1px solid var(--border); border-radius: 8px; background: var(--bg2);
  padding: 12px 14px; margin: 0 0 14px;
}
.next-up h2, .next-up .next-up-title {
  margin: 0 0 8px; font-size: 12px; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--dim); font-weight: 600;
}
.next-up .next-up-help { margin: -4px 0 10px; color: var(--muted); font-size: 12px; }
.next-up.empty .next-up-empty { color: var(--dim); font-size: 13px; margin: 0; }
.next-up ol {
  list-style: none; margin: 0; padding: 0; display: grid; gap: 8px;
}
.next-up li {
  display: grid; grid-template-columns: 1fr auto; gap: 4px 12px;
  border-top: 1px solid var(--border); padding-top: 8px;
}
.next-up li:first-child { border-top: none; padding-top: 0; }
.next-up .nu-title { font-size: 13px; font-weight: 550; color: var(--text); }
.next-up .nu-meta { font-size: 12px; color: var(--muted); grid-column: 1 / -1; }
.next-up .nu-when {
  font-size: 12px; color: var(--accent); font-variant-numeric: tabular-nums;
  white-space: nowrap; text-align: right;
}
.next-up .nu-area {
  display: inline-block; font-size: 11px; color: var(--dim);
  border: 1px solid var(--border); border-radius: 3px; padding: 1px 6px; margin-right: 6px;
}
@media (max-width: 520px) {
  .next-up li { grid-template-columns: 1fr; }
  .next-up .nu-when { text-align: left; }
}

/* —— Session Log (Capital layout — portfolio standard) —— */
.session-log {
  margin: 12px 0 18px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--bg2);
}
.session-log h2, .session-log .session-log-title {
  margin: 0 0 6px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--muted);
}
.session-log .session-log-help {
  margin: 0 0 14px;
  color: var(--dim);
  font-size: 12px;
}
.session-log.empty .session-log-empty {
  margin: 0;
  color: var(--dim);
  font-size: 13px;
}
.session-log ol {
  list-style: none;
  margin: 0;
  padding: 0;
}
.session-log li {
  display: block;
  padding: 14px 0;
  border-top: 1px solid var(--border);
  background: transparent;
  border-left: none;
  box-shadow: none;
}
.session-log li:first-child { border-top: none; padding-top: 0; }
.session-log .sl-head {
  display: flex;
  flex-wrap: nowrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px 24px;
  margin-bottom: 6px;
}
.session-log .sl-when {
  flex: 0 0 auto;
  font-size: 12px;
  color: var(--accent);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  line-height: 1.35;
}
.session-log .sl-actor {
  flex: 1 1 auto;
  text-align: right;
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.session-log .sl-summary {
  display: block;
  font-size: 13px;
  font-weight: 550;
  color: var(--text);
  line-height: 1.45;
  margin: 0 0 4px;
}
.session-log .sl-desk {
  display: block;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.4;
}
.session-log .sl-lesson {
  display: block;
  font-size: 12px;
  color: var(--dim);
  margin-top: 2px;
}
@media (max-width: 640px) {
  .session-log .sl-head { flex-wrap: wrap; }
  .session-log .sl-actor { text-align: left; white-space: normal; }
}

/* Lesson origination date */
.lesson .origination, .lesson-origination {
  display: inline-block;
  margin: 0 0 8px;
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--dim);
  font-variant-numeric: tabular-nums;
}
.lesson .origination.missing, .lesson-origination.missing {
  color: var(--warn);
}


/* —— Theme toggle —— */
.eh-theme-toggle {
  appearance: none;
  border: 1px solid var(--border);
  background: var(--bg3);
  color: var(--muted);
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  cursor: pointer;
  white-space: nowrap;
}
.eh-theme-toggle:hover {
  color: var(--text);
  border-color: color-mix(in srgb, var(--segment) 50%, var(--border));
}
.eh-theme-toggle:focus-visible {
  outline: 2px solid var(--segment);
  outline-offset: 2px;
}
.top-meta, .updated {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

/* —— Segment tiles (aggregate pages) —— */
.tile {
  border-top: 3px solid var(--border);
  box-shadow: inset 0 0 0 1px transparent;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--tile-accent, var(--border)) 14%, var(--bg2)) 0%, var(--bg2) 48%),
    var(--bg2);
}
.tile[data-segment="capital"], .tile.seg-capital { --tile-accent: var(--capital); border-top-color: var(--capital); }
.tile[data-segment="presence"], .tile.seg-presence { --tile-accent: var(--presence); border-top-color: var(--presence); }
.tile[data-segment="foundry"], .tile.seg-foundry { --tile-accent: var(--foundry); border-top-color: var(--foundry); }
.tile[data-segment="local"], .tile.seg-local { --tile-accent: var(--local); border-top-color: var(--local); }
.tile[data-segment="eats"], .tile.seg-eats { --tile-accent: var(--eats); border-top-color: var(--eats); }
.tile[data-segment="reach"], .tile.seg-reach { --tile-accent: var(--reach); border-top-color: var(--reach); }
.tile[data-segment="gaming"], .tile.seg-gaming { --tile-accent: var(--gaming); border-top-color: var(--gaming); }
.tile[data-segment="portfolio"], .tile.seg-portfolio { --tile-accent: var(--portfolio); border-top-color: var(--portfolio); }

.mark {
  border-color: color-mix(in srgb, var(--segment) 40%, var(--border));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--segment) 25%, transparent);
}

.nav button.active, .nav > a.active {
  border-color: color-mix(in srgb, var(--segment) 40%, var(--border));
  box-shadow: inset 0 -2px 0 var(--segment);
}

/* Capital market subnav / cards */
.markets-subnav button.active,
.nav button[data-view^="market-"].active {
  color: var(--text);
  border-color: color-mix(in srgb, var(--atmosphere) 50%, var(--border));
  box-shadow: inset 0 -2px 0 var(--atmosphere);
}
.market-accent-securities, [data-market="securities"] { --tile-accent: var(--market-securities); border-top-color: var(--market-securities); }
.market-accent-options, [data-market="options"] { --tile-accent: var(--market-options); border-top-color: var(--market-options); }
.market-accent-event, [data-market="event"] { --tile-accent: var(--market-event); border-top-color: var(--market-event); }
.market-accent-crypto, [data-market="crypto"] { --tile-accent: var(--market-crypto); border-top-color: var(--market-crypto); }
.market-accent-sports, [data-market="sports"] { --tile-accent: var(--market-sports); border-top-color: var(--market-sports); }

html[data-theme="light"] body {
  background:
    radial-gradient(1000px 520px at 8% -8%, rgba(var(--atmosphere-rgb), 0.18), transparent 55%),
    radial-gradient(800px 420px at 92% 0%, rgba(var(--atmosphere-rgb), 0.10), transparent 50%),
    linear-gradient(165deg, color-mix(in srgb, var(--atmosphere) 10%, var(--eh-canvas)) 0%, var(--eh-canvas) 40%, var(--eh-canvas) 100%);
}
html[data-theme="light"] .card,
html[data-theme="light"] .tile,
html[data-theme="light"] .attention,
html[data-theme="light"] .next-up,
html[data-theme="light"] .session-log,
html[data-theme="light"] .eh-desk-panel,
html[data-theme="light"] .eh-desk-card,
html[data-theme="light"] .eh-desk-empty {
  background: var(--bg2);
  border: 1px solid var(--border);
  box-shadow: 0 1px 2px rgba(16, 38, 44, 0.06);
}


/* —— Shared Lessons (Capital layout; segment color via --segment) —— */
.stack { display: flex; flex-direction: column; gap: 10px; }
.lesson {
  border-bottom: 1px solid var(--border);
  padding: 12px 0 14px;
}
.lesson:last-child { border-bottom: 0; }
.lesson .conclusion {
  font-size: 14px;
  font-weight: 650;
  color: var(--text);
  margin: 0 0 8px;
  line-height: 1.35;
  border-left: 3px solid var(--segment);
  padding-left: 10px;
}
.lesson .id {
  font-family: var(--mono);
  color: var(--segment);
  font-weight: 650;
  font-size: 12px;
}
.lesson .row {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 6px;
  margin-top: 5px;
}
.lesson .row .k {
  color: var(--muted);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.lesson .row .v { font-size: 12px; color: var(--text); }
.lesson-card-wrap, .lessons-panel .card {
  border-top: 2px solid var(--segment);
}

/* Official Harbor Gate mark in topbar */
.mark.eh-logo {
  width: 36px;
  height: 36px;
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--segment) 40%, var(--border));
  background: var(--bg3);
  overflow: hidden;
}
.mark.eh-logo img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}
html[data-theme="dark"] .mark.eh-logo { background: #0a1214; }
html[data-theme="light"] .mark.eh-logo { background: var(--eh-canvas); }

/* Trial clock banner */
.trial-clock {
  margin: 0 0 14px;
  padding: 12px 14px;
  border-radius: 8px;
  border: 1px solid color-mix(in srgb, var(--eh-signal-brass) 55%, var(--border));
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--eh-signal-brass) 22%, var(--bg2)), var(--bg2));
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  align-items: baseline;
  justify-content: space-between;
}
.trial-clock .tc-label {
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--eh-signal-brass);
  font-weight: 700;
}
.trial-clock .tc-days {
  font-size: 22px;
  font-weight: 750;
  color: var(--text);
  font-variant-numeric: tabular-nums;
}
.trial-clock .tc-meta { font-size: 12px; color: var(--muted); }
.trial-clock.urgent {
  border-color: var(--danger);
  background: linear-gradient(90deg, color-mix(in srgb, var(--danger) 25%, var(--bg2)), var(--bg2));
}
.trial-clock.urgent .tc-label { color: var(--danger); }

/* Color discipline helpers */
.seg-accent { color: var(--segment); }
.seg-rule { border-left: 3px solid var(--segment); padding-left: 10px; }
.kpi .val { color: var(--segment); }

/* —— Active Ventures (V1) —— */
.active-ventures { margin: 0 0 18px; }
.av-stack { display: flex; flex-direction: column; gap: 10px; }
.av-card {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: 8px;
  border-left: 3px solid var(--segment, var(--accent));
  padding: 12px 14px;
}
.av-head { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: baseline; justify-content: space-between; }
.av-head h3 { margin: 0; font-size: 15px; font-weight: 650; color: var(--text); }
.av-status {
  font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em;
  color: var(--segment, var(--accent));
  border: 1px solid color-mix(in srgb, var(--segment, var(--accent)) 45%, var(--border));
  border-radius: 3px; padding: 2px 6px; white-space: nowrap;
}
.av-sub { margin: 4px 0 0; font-size: 11px; color: var(--dim); text-transform: uppercase; letter-spacing: 0.04em; }
.av-desc { margin: 8px 0 0; font-size: 13px; color: var(--muted); line-height: 1.45; max-width: 72ch; }
.av-meta {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 14px;
  margin: 10px 0 0; padding: 0;
}
.av-meta .av-span { grid-column: 1 / -1; }
.av-meta dt {
  margin: 0; font-size: 10px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--dim);
}
.av-meta dd { margin: 2px 0 0; font-size: 12px; color: var(--text); }
.av-foot {
  display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; justify-content: space-between;
  margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--border);
}
.av-link { font-size: 12px; font-weight: 650; color: var(--segment, var(--accent)); text-decoration: none; }
.av-link:hover { text-decoration: underline; }
.av-updated { font-size: 11px; color: var(--dim); }

.av-stamps { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 0; }
.av-stamp {
  display: inline-flex; align-items: center;
  font-size: 10px; font-weight: 650; letter-spacing: 0.04em; text-transform: uppercase;
  padding: 2px 7px; border-radius: 999px; border: 1px solid transparent;
  line-height: 1.3; white-space: nowrap;
}
.av-stamp-segment.av-segment-capital,
.av-stamp-segment[data-segment="capital"] {
  color: var(--capital);
  border-color: color-mix(in srgb, var(--capital) 45%, var(--border));
  background: color-mix(in srgb, var(--capital) 14%, transparent);
}
.av-stamp-segment.av-segment-presence,
.av-stamp-segment[data-segment="presence"] {
  color: var(--presence);
  border-color: color-mix(in srgb, var(--presence) 45%, var(--border));
  background: color-mix(in srgb, var(--presence) 14%, transparent);
}
.av-stamp-segment.av-segment-foundry,
.av-stamp-segment[data-segment="foundry"] {
  color: var(--foundry);
  border-color: color-mix(in srgb, var(--foundry) 45%, var(--border));
  background: color-mix(in srgb, var(--foundry) 14%, transparent);
}
.av-stamp-segment.av-segment-local,
.av-stamp-segment[data-segment="local"] {
  color: var(--local);
  border-color: color-mix(in srgb, var(--local) 45%, var(--border));
  background: color-mix(in srgb, var(--local) 14%, transparent);
}
.av-stamp-segment.av-segment-reach,
.av-stamp-segment[data-segment="reach"] {
  color: var(--reach);
  border-color: color-mix(in srgb, var(--reach) 45%, var(--border));
  background: color-mix(in srgb, var(--reach) 14%, transparent);
}
.av-stamp-segment.av-segment-gaming,
.av-stamp-segment[data-segment="gaming"] {
  color: var(--gaming);
  border-color: color-mix(in srgb, var(--gaming) 45%, var(--border));
  background: color-mix(in srgb, var(--gaming) 14%, transparent);
}
.av-stamp-segment.av-segment-portfolio,
.av-stamp-segment[data-segment="portfolio"] {
  color: var(--portfolio);
  border-color: color-mix(in srgb, var(--portfolio) 45%, var(--border));
  background: color-mix(in srgb, var(--portfolio) 14%, transparent);
}
.av-stamp-market.av-market-securities,
.av-stamp-market[data-market="securities"] {
  color: var(--market-securities);
  border-color: color-mix(in srgb, var(--market-securities) 45%, var(--border));
  background: color-mix(in srgb, var(--market-securities) 14%, transparent);
}
.av-stamp-market.av-market-options,
.av-stamp-market[data-market="options"] {
  color: var(--market-options);
  border-color: color-mix(in srgb, var(--market-options) 45%, var(--border));
  background: color-mix(in srgb, var(--market-options) 14%, transparent);
}
.av-stamp-market.av-market-event,
.av-stamp-market[data-market="event"] {
  color: var(--market-event);
  border-color: color-mix(in srgb, var(--market-event) 45%, var(--border));
  background: color-mix(in srgb, var(--market-event) 14%, transparent);
}
.av-stamp-market.av-market-crypto,
.av-stamp-market[data-market="crypto"] {
  color: var(--market-crypto);
  border-color: color-mix(in srgb, var(--market-crypto) 45%, var(--border));
  background: color-mix(in srgb, var(--market-crypto) 14%, transparent);
}
.av-stamp-market.av-market-sports,
.av-stamp-market[data-market="sports"] {
  color: var(--market-sports);
  border-color: color-mix(in srgb, var(--market-sports) 45%, var(--border));
  background: color-mix(in srgb, var(--market-sports) 14%, transparent);
}
.av-stamp-market.av-market-cash,
.av-stamp-market[data-market="cash"] {
  color: var(--market-cash);
  border-color: color-mix(in srgb, var(--market-cash) 45%, var(--border));
  background: color-mix(in srgb, var(--market-cash) 14%, transparent);
}
.av-card.av-accent-segment-capital { border-left-color: var(--capital); }
.av-card.av-accent-segment-presence { border-left-color: var(--presence); }
.av-card.av-accent-segment-foundry { border-left-color: var(--foundry); }
.av-card.av-accent-segment-local { border-left-color: var(--local); }
.av-card.av-accent-segment-reach { border-left-color: var(--reach); }
.av-card.av-accent-segment-gaming { border-left-color: var(--gaming); }
.av-card.av-accent-segment-portfolio { border-left-color: var(--portfolio); }
.av-card.av-accent-market-securities { border-left-color: var(--market-securities); }
.av-card.av-accent-market-options { border-left-color: var(--market-options); }
.av-card.av-accent-market-event { border-left-color: var(--market-event); }
.av-card.av-accent-market-crypto { border-left-color: var(--market-crypto); }
.av-card.av-accent-market-sports { border-left-color: var(--market-sports); }
.av-card.av-accent-market-cash { border-left-color: var(--market-cash); }

@media (max-width: 640px) {
  .av-meta { grid-template-columns: 1fr; }
}
html[data-theme="light"] .av-card {
  background: var(--bg2);
  box-shadow: 0 1px 2px rgba(16, 38, 44, 0.06);
}

/* —— Learning desk (V0) —— */
.learning-desk { margin: 0 0 18px; }
.lrn-stack { display: flex; flex-direction: column; gap: 8px; }
.lrn-card {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: 8px;
  border-left: 3px solid var(--segment, var(--accent));
  overflow: hidden;
}
.lrn-card[open] { border-color: color-mix(in srgb, var(--segment, var(--accent)) 35%, var(--border)); }
.lrn-summary {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) auto auto minmax(0, 1fr);
  gap: 6px 10px;
  align-items: start;
  padding: 10px 12px;
  cursor: pointer;
  list-style: none;
  font-size: 12px;
  line-height: 1.4;
}
.lrn-summary::-webkit-details-marker { display: none; }
.lrn-summary::before {
  content: "▸";
  grid-column: 1;
  grid-row: 1 / span 4;
  align-self: start;
  margin-right: 2px;
  color: var(--dim);
  font-size: 11px;
  transition: transform 0.15s ease;
}
.lrn-card[open] .lrn-summary::before { transform: rotate(90deg); }
.lrn-title {
  grid-column: 1 / -1;
  font-size: 14px;
  font-weight: 650;
  color: var(--text);
  padding-left: 14px;
}
.lrn-pill {
  display: inline-flex;
  align-items: center;
  font-size: 10px;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 2px 7px;
  border-radius: 999px;
  border: 1px solid var(--border);
  white-space: nowrap;
}
.lrn-status { border-color: color-mix(in srgb, var(--accent) 45%, var(--border)); color: var(--accent); }
.lrn-status-candidate { color: var(--warn); border-color: color-mix(in srgb, var(--warn) 45%, var(--border)); }
.lrn-status-testing { color: var(--accent); }
.lrn-status-confirmed { color: var(--ok); border-color: color-mix(in srgb, var(--ok) 45%, var(--border)); }
.lrn-status-institutionalized { color: var(--ok); background: color-mix(in srgb, var(--ok) 12%, transparent); }
.lrn-status-weakening { color: var(--warn); }
.lrn-status-superseded,
.lrn-status-rejected { color: var(--dim); text-decoration: line-through; }
.lrn-segment {
  color: var(--segment, var(--accent));
  border-color: color-mix(in srgb, var(--segment, var(--accent)) 45%, var(--border));
  background: color-mix(in srgb, var(--segment, var(--accent)) 10%, transparent);
}
.lrn-owner { grid-column: 1 / -1; padding-left: 14px; color: var(--muted); font-size: 11px; }
.lrn-change {
  grid-column: 1 / -1;
  padding-left: 14px;
  color: var(--text);
  font-size: 12px;
  max-width: 72ch;
}
.lrn-review,
.lrn-primitive {
  padding-left: 14px;
  color: var(--dim);
  font-size: 11px;
}
.lrn-body {
  padding: 0 12px 12px;
  border-top: 1px solid var(--border);
  margin-top: 0;
}
.lrn-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 14px;
  margin: 10px 0 0;
  padding: 0;
}
.lrn-meta dt {
  margin: 0;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--dim);
}
.lrn-meta dd {
  margin: 2px 0 0;
  font-size: 12px;
  color: var(--text);
  line-height: 1.45;
}
.lrn-foot {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid var(--border);
}
.lrn-link { font-size: 12px; font-weight: 650; color: var(--segment, var(--accent)); text-decoration: none; }
.lrn-link:hover { text-decoration: underline; }
.lrn-accent-segment-capital { border-left-color: var(--capital); --segment: var(--capital); }
.lrn-accent-segment-presence { border-left-color: var(--presence); --segment: var(--presence); }
.lrn-accent-segment-foundry { border-left-color: var(--foundry); --segment: var(--foundry); }
.lrn-accent-segment-local { border-left-color: var(--local); --segment: var(--local); }
.lrn-accent-segment-reach { border-left-color: var(--reach); --segment: var(--reach); }
.lrn-accent-segment-gaming { border-left-color: var(--gaming); --segment: var(--gaming); }
.lrn-accent-segment-portfolio { border-left-color: var(--portfolio); --segment: var(--portfolio); }
.lrn-accent-segment-cross { border-left-color: var(--accent); --segment: var(--accent); }

@media (max-width: 640px) {
  .lrn-meta { grid-template-columns: 1fr; }
}
html[data-theme="light"] .lrn-card {
  background: var(--bg2);
  box-shadow: 0 1px 2px rgba(16, 38, 44, 0.06);
}

/* —— Desk grid / query primitive (OS v2 §6) —— */
.eh-desk-grid {
  margin: 0 0 18px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg2);
  overflow: hidden;
}
.eh-desk-grid__title {
  margin: 0;
  padding: 12px 14px 0;
}
.eh-desk-grid__toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--bg3) 55%, var(--bg2));
}
.eh-desk-grid__toolbar-main {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  min-width: 0;
  flex: 1 1 auto;
}
.eh-desk-grid__count {
  font-size: 12px;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.eh-desk-grid__count--pending {
  color: var(--dim);
}
.eh-desk-grid__count--empty {
  margin: 8px 0 0;
  font-size: 12px;
}
.eh-desk-grid__count-page {
  font-weight: 650;
  color: var(--text);
}
.eh-desk-grid__table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.eh-desk-grid__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.eh-desk-grid__table th,
.eh-desk-grid__table td {
  padding: 8px 12px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--border);
}
.eh-desk-grid__table th {
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--dim);
  background: var(--bg3);
  white-space: nowrap;
}
.eh-desk-grid__table tbody tr:last-child td {
  border-bottom: none;
}
.eh-desk-grid__table tbody tr:hover td {
  background: color-mix(in srgb, var(--segment, var(--accent)) 6%, transparent);
}
.eh-desk-grid__sort {
  appearance: none;
  border: none;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 0;
  margin: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.eh-desk-grid__sort:hover {
  color: var(--text);
}
.eh-desk-grid__sort:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-radius: 2px;
}
.eh-desk-grid__sort-indicator {
  font-size: 10px;
  color: var(--segment, var(--accent));
}
.eh-desk-grid__pager {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: center;
  justify-content: flex-end;
  padding: 8px 14px;
  border-top: 1px solid var(--border);
  background: var(--bg2);
}
.eh-desk-grid__page-btn {
  appearance: none;
  border: 1px solid var(--border);
  background: var(--bg3);
  color: var(--text);
  border-radius: 4px;
  padding: 5px 10px;
  font-size: 12px;
}
.eh-desk-grid__page-btn:hover:not(:disabled) {
  border-color: var(--accent);
}
.eh-desk-grid__page-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.eh-desk-grid__page-status {
  font-size: 12px;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.eh-desk-grid__state {
  padding: 16px 14px;
  color: var(--muted);
  font-size: 13px;
}
.eh-desk-grid__loading {
  display: flex;
  align-items: center;
  gap: 10px;
}
.eh-desk-grid__spinner {
  width: 14px;
  height: 14px;
  border: 2px solid var(--border);
  border-top-color: var(--segment, var(--accent));
  border-radius: 50%;
  animation: eh-dg-spin 0.7s linear infinite;
  flex: 0 0 auto;
}
@keyframes eh-dg-spin {
  to { transform: rotate(360deg); }
}
.eh-desk-grid__empty strong {
  color: var(--text);
  display: block;
  margin-bottom: 4px;
}
.eh-desk-grid[data-dg-status="loading"] .eh-desk-grid__count {
  visibility: hidden;
}
@media (prefers-reduced-motion: reduce) {
  .eh-desk-grid__spinner { animation: none; opacity: 0.6; }
}
html[data-theme="light"] .eh-desk-grid {
  box-shadow: 0 1px 2px rgba(16, 38, 44, 0.06);
}

/* —— Portfolio Maturity desk (2026-09-26) —— */
.mat-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  align-items: center;
  padding: 8px 10px;
  border-radius: 6px;
  background: var(--bg2);
  border: 1px solid var(--border);
  font-size: 12px;
}
.mat-strip-empty { color: var(--muted); }
.mat-strip-label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--dim);
  font-weight: 650;
}
.mat-stage-chip {
  font-size: 11px;
  font-weight: 650;
  padding: 2px 8px;
  border-radius: 4px;
  border: 1px solid color-mix(in srgb, var(--accent) 40%, var(--border));
  background: color-mix(in srgb, var(--accent) 12%, var(--bg3));
  color: var(--text);
  white-space: nowrap;
}
.mat-next { color: var(--muted); line-height: 1.35; flex: 1 1 12rem; min-width: 0; }
.mat-next-k { color: var(--dim); font-size: 10px; text-transform: uppercase; letter-spacing: 0.04em; }

.mat-stale-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--danger);
  border: 1px solid color-mix(in srgb, var(--danger) 55%, var(--border));
  background: color-mix(in srgb, var(--danger) 18%, var(--bg2));
  padding: 1px 6px;
  border-radius: 3px;
  vertical-align: middle;
}
.mat-stale-secondary {
  color: var(--eh-signal-brass);
  border-color: color-mix(in srgb, var(--eh-signal-brass) 50%, var(--border));
  background: color-mix(in srgb, var(--eh-signal-brass) 15%, var(--bg2));
}

.maturity-rollup { margin: 0 0 18px; }
.mat-rollup-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 10px;
}
.mat-rollup-card {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 10px 12px;
  border-top: 3px solid var(--border);
}
.mat-rollup-card[data-segment="capital"] { border-top-color: var(--capital); }
.mat-rollup-card[data-segment="presence"] { border-top-color: var(--presence); }
.mat-rollup-card[data-segment="foundry"] { border-top-color: var(--foundry); }
.mat-rollup-card[data-segment="local"] { border-top-color: var(--local); }
.mat-rollup-card[data-segment="eats"] { border-top-color: var(--eats); }
.mat-rollup-card[data-segment="reach"] { border-top-color: var(--reach); }
.mat-rollup-card[data-segment="gaming"] { border-top-color: var(--gaming); }
.mat-rollup-card[data-segment="systems"] { border-top-color: var(--portfolio); }
.mat-rollup-head { display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; justify-content: space-between; }
.mat-rollup-name { font-size: 13px; font-weight: 650; color: var(--text); }
.mat-rollup-next { margin: 8px 0 0; font-size: 12px; color: var(--muted); line-height: 1.4; }
.mat-rollup-meta { margin: 6px 0 0; font-size: 11px; color: var(--dim); }

.experiment-registry { margin: 0 0 18px; }
.mat-exp-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--bg2);
}
.mat-exp-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.mat-exp-table th,
.mat-exp-table td {
  padding: 8px 10px;
  text-align: left;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
}
.mat-exp-table th {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--dim);
  background: var(--bg3);
}
.mat-exp-table tbody tr:last-child td { border-bottom: 0; }
.mat-exp-title { font-weight: 550; color: var(--text); max-width: 22ch; }
.mat-exp-hypo { color: var(--muted); max-width: 28ch; }
.mat-exp-status {
  display: inline-block;
  font-size: 10px;
  font-weight: 650;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  padding: 2px 6px;
  border-radius: 3px;
  border: 1px solid var(--border);
  white-space: nowrap;
}
.mat-exp-running { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 45%, var(--border)); }
.mat-exp-complete { color: var(--success, #3d9a6a); }
.mat-exp-paused { color: var(--eh-signal-brass); }
.mat-exp-killed { color: var(--danger); }
.mat-exp-forming { color: var(--muted); }
.mat-exp-seg { font-weight: 650; font-size: 11px; }
.mat-seg-capital { color: var(--capital); }
.mat-seg-presence { color: var(--presence); }
.mat-seg-foundry { color: var(--foundry); }
.mat-seg-local { color: var(--local); }
.mat-seg-eats { color: var(--eats); }
.mat-seg-reach { color: var(--reach); }

.mat-omitted { margin-top: 10px; padding: 10px 12px; border-radius: 6px; background: var(--bg2); border: 1px dashed var(--border); }
.mat-omitted-title { margin: 0 0 6px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--dim); }
.mat-omitted-list { margin: 0; padding-left: 1.1rem; font-size: 12px; color: var(--muted); }
.mat-omitted-seg { font-weight: 600; color: var(--text); }