/**
 * BetDNA Typography System — HF-001
 * One permanent scale. No page may invent ad-hoc text sizes.
 * Minimum readable size: 12px (0.75rem) for supporting text.
 * Micro (0.72rem) reserved for badges/captions only.
 */
:root {
  /* Semantic roles */
  --bdna-type-display: 1.5rem;
  --bdna-type-page-title: 1.25rem;
  --bdna-type-section: 0.95rem;
  --bdna-type-card-title: 0.9rem;
  --bdna-type-subheading: 0.85rem;
  --bdna-type-body: 0.875rem;
  --bdna-type-supporting: 0.8125rem;
  --bdna-type-caption: 0.75rem;
  --bdna-type-micro: 0.72rem;
  --bdna-type-button: 0.9rem;
  --bdna-type-input: 0.875rem;
  --bdna-type-badge: 0.72rem;
  --bdna-type-tooltip: 0.8125rem;
  --bdna-type-help: 0.8125rem;

  /* Readable contrast — from theme engine */
  --text-secondary: var(--bdna-text-secondary);
  --text-muted: var(--bdna-text-muted);
  --text-disabled: var(--bdna-text-disabled);
}

/* Base body rhythm */
body {
  font-size: var(--bdna-type-body);
  line-height: 1.5;
  letter-spacing: 0.01em;
}

/* Semantic type classes */
.bdna-type-display { font-size: var(--bdna-type-display); font-weight: 700; line-height: 1.25; }
.bdna-type-page-title { font-size: var(--bdna-type-page-title); font-weight: 700; line-height: 1.3; }
.bdna-type-section { font-size: var(--bdna-type-section); font-weight: 600; line-height: 1.35; }
.bdna-type-card-title { font-size: var(--bdna-type-card-title); font-weight: 600; line-height: 1.35; }
.bdna-type-subheading { font-size: var(--bdna-type-subheading); font-weight: 600; line-height: 1.4; }
.bdna-type-body { font-size: var(--bdna-type-body); line-height: 1.5; }
.bdna-type-supporting { font-size: var(--bdna-type-supporting); line-height: 1.45; color: var(--text-secondary); }
.bdna-type-caption { font-size: var(--bdna-type-caption); line-height: 1.4; color: var(--text-muted); }
.bdna-type-micro { font-size: var(--bdna-type-micro); line-height: 1.35; color: var(--text-muted); }
.bdna-type-help { font-size: var(--bdna-type-help); line-height: 1.5; color: var(--text-secondary); }

/* Legacy class harmonisation */
.header h1 { font-size: var(--bdna-type-display); }
.subtitle { font-size: var(--bdna-type-subheading); color: var(--text-secondary); line-height: 1.45; }
.workspace-question { font-size: var(--bdna-type-subheading); line-height: 1.45; }
.strategy-bar h2 { font-size: var(--bdna-type-section); }
.strategy-bar p { font-size: var(--bdna-type-supporting); color: var(--text-secondary); line-height: 1.5; }
.stat-lbl { font-size: var(--bdna-type-caption); color: var(--text-muted); }
.stat-val { font-variant-numeric: tabular-nums; }
.meta, .tap-hint, .small { font-size: var(--bdna-type-caption); color: var(--text-muted); line-height: 1.4; }
.pred-grid .lbl, .metric-lbl, .history-metrics .lbl, .filter-lbl {
  font-size: var(--bdna-type-caption);
  color: var(--text-muted);
}
.expand-panel { font-size: var(--bdna-type-supporting); color: var(--text-secondary); line-height: 1.5; }
.empty-msg { font-size: var(--bdna-type-body); color: var(--text-secondary); line-height: 1.5; }
.hub-desc { font-size: var(--bdna-type-caption); color: var(--text-secondary); line-height: 1.45; }

/* Paragraph readability — max comfortable line length in prose blocks */
.how-section p,
.how-section li,
.brief-panel p,
.workspace-brief p {
  max-width: 65ch;
  line-height: 1.55;
}

/* Button typography */
.btn-primary,
.btn-secondary,
.btn-utility {
  font-size: var(--bdna-type-button);
  line-height: 1.3;
  letter-spacing: 0.01em;
}

/* Tables — scannable rows */
.boss-table th,
.bet-ledger-table th {
  font-size: var(--bdna-type-caption);
  color: var(--text-muted);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.boss-table td,
.bet-ledger-table td {
  font-size: var(--bdna-type-supporting);
  line-height: 1.45;
}

/* Five-second rule strip */
.hf-first-impression {
  display: grid;
  gap: 6px;
  padding: 10px 14px;
  margin-bottom: 12px;
  background: var(--surface);
  border-radius: var(--radius);
  border-left: 3px solid var(--accent2);
  font-size: var(--bdna-type-supporting);
  line-height: 1.45;
}
.hf-first-impression strong { color: var(--text); font-weight: 600; }
.hf-first-impression .hf-muted { color: var(--text-muted); font-size: var(--bdna-type-caption); }

.hf-advanced {
  margin-bottom: 12px;
  padding: 0;
  border: 1px dashed var(--surface2);
}
.hf-advanced-summary {
  cursor: pointer;
  padding: 12px 14px;
  font-size: var(--bdna-type-supporting);
  font-weight: 600;
  color: var(--text-secondary);
  list-style: none;
}
.hf-advanced-summary::-webkit-details-marker { display: none; }
.hf-advanced-body { padding: 0 14px 14px; line-height: 1.5; }

/* HF-001 — 12px minimum for scannable labels in main content */
#content .badge,
#content .pred-grid .lbl,
#content .metric-lbl,
#content .metric-sub,
#content .lambda,
#content .intel-rec-lbl,
#content .intel-formula-chip,
#content .feed-status-pill,
#content .free-badge,
#content .chip-end,
#content .league-table th,
#content .conf-lbl,
#content .filter-lbl {
  font-size: 0.75rem !important;
}

.tcc-status-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0;
}
.tcc-status-chip {
  background: var(--surface2);
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 0.75rem;
}
.tcc-status-chip.muted { color: var(--text-muted); }
.tcc-refresh-meta { margin-top: 4px; }
.tcc-yesterday-summary { margin: 8px 0; padding: 8px 12px; background: var(--bg); border-radius: 8px; }
.tcc-locked-picks {
  margin: 16px 0;
  padding: 16px;
  border-radius: 12px;
  border: 1px solid rgba(34, 197, 94, 0.35);
  background: rgba(34, 197, 94, 0.06);
}
.tcc-locked-picks.tcc-locked-empty {
  border-color: var(--border);
  background: var(--surface2);
}
.tcc-locked-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 12px;
}
.tcc-locked-card {
  padding: 14px 16px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--surface);
}
.tcc-locked-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 10px;
}
.tcc-locked-strategy {
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--bdna-success);
}
.tcc-locked-match { margin: 4px 0 0; font-size: 0.88rem; }
.tcc-locked-badge {
  flex-shrink: 0;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(34, 197, 94, 0.15);
  color: var(--bdna-success);
}
.tcc-locked-metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin: 0 0 10px;
}
.tcc-locked-metrics div {
  padding: 8px;
  border-radius: 8px;
  background: var(--surface2);
}
.tcc-locked-metrics dt {
  margin: 0;
  font-size: 0.7rem;
  text-transform: uppercase;
  color: var(--text-muted);
}
.tcc-locked-metrics dd {
  margin: 2px 0 0;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.tcc-locked-bet { margin: 0 0 6px; font-size: 0.95rem; }
.tcc-locked-reason { margin: 0 0 10px; }
@media (max-width: 640px) {
  .tcc-locked-metrics { grid-template-columns: repeat(2, 1fr); }
}
.tcc-empty-fallback { margin: 10px 0; padding: 14px; border-left: 3px solid var(--accent2); }
.tcc-empty-fallback .btn-secondary { margin-top: 8px; margin-right: 8px; width: auto; display: inline-block; }

/* Constitutional Intelligence Centre (Loop 002) */
.today-intelligence-centre { border-left: 4px solid var(--accent2); padding: 12px 14px; margin-bottom: 10px; }
.tic-eyebrow { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); margin: 0 0 2px; }
.tic-global-header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.tic-clock { margin: 4px 0 0; font-size: 0.92rem; }
.tic-status-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: 6px 10px; margin: 0; font-size: 0.78rem; }
.tic-status-grid dt { color: var(--muted); font-size: 0.68rem; text-transform: uppercase; }
.tic-status-grid dd { margin: 0; }
.tic-summary-bar { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0; }
.tic-summary-chip { display: inline-flex; flex-direction: column; align-items: center; min-width: 56px; padding: 6px 8px; border-radius: 8px; background: var(--surface); border: 1px solid var(--border); }
.tic-summary-lbl { font-size: 0.65rem; color: var(--muted); text-transform: uppercase; }
.tic-filter-row, .tic-sport-filter { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 8px 0; }
.tic-filter-chip, .tic-sport-chip { padding: 5px 10px; border-radius: 999px; border: 1px solid var(--border); background: var(--bg); font-size: 0.78rem; cursor: pointer; }
.tic-filter-chip.active, .tic-sport-chip.active { border-color: var(--accent2); background: var(--surface); }
.tic-filter-label { margin-right: 4px; }
.tic-section-title { font-size: 0.95rem; margin: 12px 0 6px; }
.tic-featured-list { display: flex; flex-direction: column; gap: 8px; }
.tic-featured-card { padding: 10px 12px; border-radius: 8px; border: 1px solid var(--border); background: var(--bg); }
.tic-featured-head { display: flex; gap: 8px; align-items: flex-start; }
.tic-featured-rank { font-weight: 700; color: var(--accent2); min-width: 24px; }
.tic-featured-match { margin: 0; }
.tic-conf-badge { margin-left: auto; font-weight: 700; font-size: 0.88rem; color: var(--accent); }
.tic-featured-pick { margin: 6px 0; }
.tic-featured-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin: 8px 0; font-size: 0.78rem; }
.tic-featured-metrics dt { color: var(--muted); font-size: 0.65rem; }
.tic-featured-metrics dd { margin: 0; }
.tic-featured-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.tic-live-list { display: flex; flex-direction: column; gap: 6px; }
.tic-live-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px; border-radius: 8px; border: 1px solid var(--border); }
.tic-live-score { font-weight: 700; }
.tic-upcoming-bucket { margin-bottom: 8px; }
.tic-upcoming-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.tic-upcoming-chip { padding: 4px 8px; border-radius: 6px; border: 1px solid var(--border); background: var(--surface); font-size: 0.78rem; cursor: pointer; }
.tic-alerts { margin: 8px 0; }
.tic-alert { margin: 4px 0; padding: 6px 10px; border-radius: 6px; font-size: 0.82rem; }
.tic-alert-warn { background: rgba(234, 179, 8, 0.12); border-left: 3px solid var(--warn, #eab308); }
.tic-alert-info { background: var(--surface); border-left: 3px solid var(--muted); }
.tic-freshness { margin: 6px 0 8px; padding: 8px 12px; border-radius: 8px; font-size: 0.82rem; }
.tic-freshness-refreshing { background: rgba(96, 165, 250, 0.12); border-left: 3px solid var(--accent, #60a5fa); }
.tic-freshness-offline { background: rgba(234, 179, 8, 0.12); border-left: 3px solid var(--warn, #eab308); }
.tic-freshness-unavailable { background: rgba(239, 68, 68, 0.12); border-left: 3px solid var(--danger, #ef4444); }
.tic-freshness-stale, .tic-freshness-delayed { background: rgba(234, 179, 8, 0.1); border-left: 3px solid var(--warn, #eab308); }
.tic-quick-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border); }
.tic-doctor-strip { margin-top: 8px; }
.tic-doctor-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px; }
.tic-all-fixtures { margin-top: 8px; padding: 10px 12px; }
.tic-all-fixtures summary { cursor: pointer; font-size: 0.9rem; }
.tic-empty { opacity: 0.92; }
.tic-state { padding: 16px; text-align: center; }
.tic-state-failure, .tic-state-offline { border-left: 4px solid var(--warn, #eab308); }
.tic-explanation-list { display: flex; flex-direction: column; gap: 8px; }
.tic-explanation-card { padding: 10px 12px; border-radius: 8px; border: 1px solid var(--border); background: var(--bg); }

.siw-empty { opacity: 0.92; }

/* Constitutional Sports Intelligence Workspace (Loop 003) */
.sports-intelligence-workspace { border-left: 4px solid var(--accent); padding: 12px 14px; margin-bottom: 10px; }
.siw-summary-bar { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.siw-summary-chip { display: inline-flex; flex-direction: column; align-items: center; min-width: 56px; padding: 6px 8px; border-radius: 8px; background: var(--surface); border: 1px solid var(--border); }
.siw-summary-chip .lbl { font-size: 0.65rem; color: var(--muted); text-transform: uppercase; }
.siw-section-title { font-size: 0.95rem; margin: 12px 0 6px; }
.siw-sport-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 8px; }
.siw-sport-card {
  padding: 10px; border-radius: 8px; border: 1px solid var(--border); background: var(--bg); cursor: pointer;
  overflow: hidden; min-width: 0; box-sizing: border-box;
}
.siw-sport-card.dim { opacity: 0.55; }
.siw-sport-head { display: flex; gap: 8px; align-items: flex-start; min-width: 0; }
.siw-sport-head > div { min-width: 0; flex: 1; overflow: hidden; }
.siw-sport-head strong,
.siw-sport-head .small {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.siw-sport-head strong { -webkit-line-clamp: 2; }
.siw-sport-head .small { -webkit-line-clamp: 2; margin: 2px 0 0; }
.siw-sport-why {
  margin: 6px 0 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  overflow-wrap: anywhere;
}
.siw-sport-icon { font-size: 1.4rem; flex-shrink: 0; }
.siw-fav-btn { margin-left: auto; background: none; border: none; cursor: pointer; font-size: 1rem; flex-shrink: 0; }
.siw-fav-btn.active { color: var(--accent2); }
.siw-sport-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; margin-top: 8px; }
.siw-sport-metrics dt { font-size: 0.62rem; color: var(--muted); text-transform: uppercase; }
.siw-sport-metrics dd { margin: 0; font-weight: 600; }
.siw-filters { margin: 10px 0; }
.siw-search { width: 100%; max-width: 360px; margin-bottom: 8px; padding: 8px 10px; border-radius: 8px; border: 1px solid var(--border); background: var(--bg); }
.siw-filter-row { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.siw-chip { padding: 4px 10px; border-radius: 999px; border: 1px solid var(--border); background: var(--bg); font-size: 0.76rem; cursor: pointer; }
.siw-chip.active { border-color: var(--accent); background: var(--surface); }
.siw-fixture-grid-wrap { overflow-x: auto; }
.siw-fixture-grid { width: 100%; border-collapse: collapse; }
.siw-fixture-grid th, .siw-fixture-grid td { padding: 6px 8px; border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; }
.siw-sport-tag { font-size: 0.72rem; text-transform: uppercase; color: var(--muted); }
.siw-status-live { color: var(--accent2); font-weight: 600; }
.siw-status-upcoming { color: var(--muted); }
.siw-status-completed { color: var(--text-muted); }
.siw-actions { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; max-width: 100%; }
.siw-fixture-row td strong {
  display: inline-block; max-width: 100%;
  overflow-wrap: anywhere; word-break: break-word;
}
.siw-live-list { display: flex; flex-direction: column; gap: 6px; }
.siw-live-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px; border-radius: 8px; border: 1px solid var(--border); }
.siw-live-score { font-weight: 700; }
.siw-quick-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border); }
.siw-freshness { margin: 6px 0 8px; padding: 8px 12px; border-radius: 8px; font-size: 0.82rem; }
.siw-freshness-refreshing { background: rgba(96, 165, 250, 0.12); border-left: 3px solid var(--accent, #60a5fa); }
.siw-freshness-offline, .siw-freshness-stale, .siw-freshness-delayed { background: rgba(234, 179, 8, 0.1); border-left: 3px solid var(--warn, #eab308); }
.siw-freshness-unavailable { background: rgba(239, 68, 68, 0.12); border-left: 3px solid var(--danger, #ef4444); }
.piw-freshness { margin: 6px 0 8px; padding: 8px 12px; border-radius: 8px; font-size: 0.82rem; }
.piw-freshness-refreshing { background: rgba(96, 165, 250, 0.12); border-left: 3px solid var(--accent, #60a5fa); }
.piw-freshness-offline, .piw-freshness-stale, .piw-freshness-delayed { background: rgba(234, 179, 8, 0.1); border-left: 3px solid var(--warn, #eab308); }
.piw-freshness-unavailable { background: rgba(239, 68, 68, 0.12); border-left: 3px solid var(--danger, #ef4444); }
.game-theatre-panel { margin: 12px 0; }
.game-theatre-summary { cursor: pointer; font-size: 0.92rem; padding: 4px 0; }
.game-theatre-body { margin-top: 8px; }
.game-football-hero {
  border-left: 3px solid var(--accent, #22c55e);
  margin-bottom: 12px;
}
.game-hero-kicker {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  margin: 0 0 6px;
}
.game-football-match { margin: 0 0 6px; font-size: 1.15rem; }
.game-results-hero { text-align: center; }
.game-next-day-callout {
  padding: 14px 16px;
  margin-bottom: 12px;
  border-radius: 10px;
  background: rgba(34, 197, 94, 0.08);
  border: 1px solid rgba(34, 197, 94, 0.25);
}
.game-next-kicker {
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #86efac;
  margin: 0 0 4px;
}
.game-next-date { margin: 0 0 6px; font-size: 1.05rem; }
.game-next-row { margin-top: 8px; }
.game-next-day-btn:not(:disabled) {
  box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.22);
}
.game-busy-banner:not([hidden]) { display: block; }
.game-settled-matches { display: flex; flex-direction: column; gap: 10px; }
.game-settled-match {
  padding: 10px 12px;
  border-radius: 8px;
  background: var(--surface2, rgba(255,255,255,0.04));
  border-left: 3px solid var(--muted);
}
.game-settled-match.win { border-left-color: #22c55e; }
.game-settled-match.loss { border-left-color: #64748b; }
.game-settled-top { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.game-full-theatre { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--surface2); }
.fmd-director-embedded { border: none; box-shadow: none; padding: 0; background: transparent; }
.fmd-director-embedded .fmd-header { display: none; }
.siw-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 4px 0 10px; font-size: 0.82rem; }
.siw-crumb-sep { opacity: 0.5; }
.siw-crumb-btn { background: none; border: none; color: var(--accent); cursor: pointer; padding: 0; font-size: inherit; }
.siw-crumb-btn:hover { text-decoration: underline; }
.siw-crumb-current { font-weight: 600; }
.siw-doctor { margin-top: 8px; }
.siw-doctor-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px; }
.siw-meta { margin-top: 8px; }
.siw-hunt-tools { margin-top: 10px; padding: 10px 12px; }
.siw-global-header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.siw-status-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: 6px; margin: 0; }
.siw-status-grid dt { font-size: 0.62rem; color: var(--muted); text-transform: uppercase; }
.siw-status-grid dd { margin: 0; font-weight: 600; font-size: 0.82rem; }
.siw-eyebrow { font-size: 0.72rem; text-transform: uppercase; color: var(--muted); margin: 0 0 4px; }
.siw-state { padding: 16px; text-align: center; }
.siw-state-failure, .siw-state-offline { border-left: 4px solid var(--warn, #eab308); }
.siw-sticky-head th { position: sticky; top: 0; background: var(--bg); z-index: 1; box-shadow: 0 1px 0 var(--border); }
.siw-fixture-grid-wrap { max-height: 520px; overflow: auto; }
.siw-pagination { display: flex; align-items: center; gap: 10px; margin: 8px 0; }
.siw-fixture-detail { padding: 8px 10px; background: var(--surface); border-radius: 8px; border: 1px solid var(--border); }
.siw-detail-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 6px; margin: 0 0 8px; }
.siw-detail-grid dt { font-size: 0.62rem; color: var(--muted); text-transform: uppercase; }
.siw-detail-grid dd { margin: 0; }
.siw-detail-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.siw-comp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 8px; margin-bottom: 8px; }
.siw-comp-card { padding: 10px; border-radius: 8px; border: 1px solid var(--border); cursor: pointer; }
.siw-comp-card.active { border-color: var(--accent); background: var(--surface); }
.siw-comp-metrics { display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px; margin-top: 6px; }
.siw-comp-metrics dt { font-size: 0.62rem; color: var(--muted); }
.siw-comp-metrics dd { margin: 0; font-weight: 600; }

/* Constitutional Lab Intelligence Workspace (Loop 004) */
.lab-intelligence-workspace { border-left: 4px solid var(--accent2); padding: 12px 14px; margin-bottom: 10px; }
.liw-section-title { font-size: 0.95rem; margin: 12px 0 6px; }
.liw-summary-bar, .liw-home-grid { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.liw-chip { display: inline-flex; flex-direction: column; align-items: center; min-width: 56px; padding: 6px 8px; border-radius: 8px; background: var(--surface); border: 1px solid var(--border); }
.liw-chip .lbl { font-size: 0.65rem; color: var(--muted); text-transform: uppercase; }
.liw-home-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 6px; }
.liw-home-grid dt { font-size: 0.62rem; color: var(--muted); text-transform: uppercase; }
.liw-home-grid dd { margin: 0; font-weight: 600; }
.liw-sport-filter, .liw-filter-row { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
.liw-filter-chip { padding: 4px 10px; border-radius: 999px; border: 1px solid var(--border); background: var(--bg); font-size: 0.76rem; cursor: pointer; }
.liw-filter-chip.active { border-color: var(--accent2); background: var(--surface); }
.liw-sport-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 8px; }
.liw-sport-card { padding: 10px; border-radius: 8px; border: 1px solid var(--border); background: var(--bg); }
.liw-sport-metrics { display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px; margin-top: 6px; }
.liw-pipe-flow { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin: 8px 0; }
.liw-pipe-stage { padding: 6px 10px; border-radius: 8px; background: var(--surface); border: 1px solid var(--border); text-align: center; min-width: 72px; }
.liw-pipe-label { display: block; font-size: 0.62rem; color: var(--muted); text-transform: uppercase; }
.liw-pipe-arrow { color: var(--muted); font-size: 0.8rem; }
/* Honesty notice: Lab records promotions but does not yet change any prediction.
   Deliberately readable rather than muted grey — it qualifies the numbers above
   it, so it must not read as decoration. Contrast is checked by the a11y audit. */
.liw-not-applied, .lrc-not-applied {
  margin: 10px 0 0; padding: 8px 10px; border-radius: 8px;
  border: 1px solid var(--border); border-left: 3px solid var(--accent2);
  background: var(--surface); color: var(--fg); line-height: 1.45;
}
.liw-table { width: 100%; border-collapse: collapse; }
.liw-table th, .liw-table td { padding: 6px 8px; border-bottom: 1px solid var(--border); text-align: left; }
.liw-baseline-card { margin-bottom: 6px; padding: 8px; border-radius: 8px; border: 1px solid var(--border); }
.liw-quick-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border); }
.liw-opt-tools { margin-top: 10px; padding: 10px 12px; }
.liw-opt-tools summary { cursor: pointer; font-size: 0.9rem; }
.liw-global-header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.liw-status-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: 6px; margin: 0; }
.liw-status-grid dt { font-size: 0.62rem; color: var(--muted); text-transform: uppercase; }
.liw-status-grid dd { margin: 0; font-weight: 600; font-size: 0.82rem; }
.liw-eyebrow { font-size: 0.72rem; text-transform: uppercase; color: var(--muted); margin: 0 0 4px; }
.liw-state { padding: 16px; text-align: center; }
.liw-state-failure, .liw-state-offline { border-left: 4px solid var(--warn, #eab308); }
.liw-search { width: 100%; max-width: 360px; margin-bottom: 8px; padding: 8px 10px; border-radius: 8px; border: 1px solid var(--border); background: var(--bg); }
.liw-quality-bar { margin-top: 4px; }
.liw-filter-chip.fav { border-color: var(--accent2); }
.liw-fav-btn { margin-left: auto; background: none; border: none; cursor: pointer; font-size: 0.9rem; }
.liw-pagination { display: flex; align-items: center; gap: 10px; margin: 8px 0; }
.liw-table-wrap { max-height: 420px; overflow: auto; }
.liw-sticky-head th { position: sticky; top: 0; background: var(--bg); z-index: 1; box-shadow: 0 1px 0 var(--border); }
.liw-detail-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 6px; }
.liw-detail-grid dt { font-size: 0.62rem; color: var(--muted); text-transform: uppercase; }
.liw-detail-grid dd { margin: 0; }
.liw-compare-list { display: flex; flex-direction: column; gap: 6px; }
.liw-compare-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px; border-radius: 8px; border: 1px solid var(--border); }
.liw-timeline-list { list-style: none; padding: 0; margin: 0; }
.liw-timeline-event { padding: 4px 0; border-bottom: 1px solid var(--border); }
.liw-timeline-when { color: var(--muted); margin-right: 8px; }
.liw-kg-flow { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin: 8px 0; }
.liw-kg-node { padding: 6px 10px; border-radius: 8px; border: 1px solid var(--border); background: var(--surface); font-size: 0.76rem; cursor: pointer; }
.liw-kg-arrow { color: var(--muted); }
.liw-mission-queue { list-style: none; padding: 0; margin: 8px 0; }
.liw-explorer-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.liw-sim-types { line-height: 1.5; }
.liw-meta { margin-top: 8px; }

/* Constitutional Play Intelligence Workspace (Loop 005) */
.play-intelligence-workspace { border-left: 4px solid var(--accent); padding: 12px 14px; margin-bottom: 10px; }
.piw-section-title { font-size: 0.95rem; margin: 12px 0 6px; }
.piw-summary-bar, .piw-home-grid { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.piw-chip { display: inline-flex; flex-direction: column; align-items: center; min-width: 56px; padding: 6px 8px; border-radius: 8px; background: var(--surface); border: 1px solid var(--border); }
.piw-chip .lbl { font-size: 0.65rem; color: var(--muted); text-transform: uppercase; }
.piw-home-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 6px; }
.piw-home-grid dt { font-size: 0.62rem; color: var(--muted); text-transform: uppercase; }
.piw-home-grid dd { margin: 0; font-weight: 600; }
.piw-mode-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 8px; margin: 8px 0; }
.piw-mode-card { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 10px; border-radius: 8px; border: 1px solid var(--border); background: var(--bg); cursor: pointer; text-align: left; }
.piw-sport-filter { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
.piw-filter-chip { padding: 4px 10px; border-radius: 999px; border: 1px solid var(--border); background: var(--bg); font-size: 0.76rem; cursor: pointer; }
.piw-filter-chip.active { border-color: var(--accent); background: var(--surface); }
.piw-sport-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 6px; }
.piw-sport-card { padding: 8px; border-radius: 8px; border: 1px solid var(--border); background: var(--bg); display: flex; flex-direction: column; gap: 2px; font-size: 0.8rem; }
.piw-sport-card.ready { border-color: var(--accent); }
.piw-table { width: 100%; border-collapse: collapse; }
.piw-table th, .piw-table td { padding: 6px 8px; border-bottom: 1px solid var(--border); text-align: left; }
.piw-ach-grid { display: flex; flex-wrap: wrap; gap: 6px; }
.piw-ach { padding: 4px 8px; border-radius: 999px; border: 1px solid var(--border); font-size: 0.75rem; }
.piw-ach.unlocked { border-color: var(--accent); background: var(--surface); }
.piw-season-tools { margin-top: 10px; padding: 10px 12px; }
.piw-season-tools summary { cursor: pointer; font-size: 0.9rem; }

/* Constitutional Product Experience (Loop 006) */
.pex-status-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 12px; margin: 0 0 8px; border-bottom: 1px solid var(--border); background: var(--surface); }
.pex-status-chip { display: inline-flex; flex-direction: column; align-items: center; min-width: 52px; padding: 4px 8px; border-radius: 8px; border: 1px solid var(--border); font-size: 0.75rem; }
.pex-status-chip .lbl { font-size: 0.6rem; color: var(--muted); text-transform: uppercase; }
.pex-status-meta { margin-left: auto; }
.pex-header-tools { display: inline-flex; align-items: center; margin-left: 8px; position: relative; }
.pex-notif-btn { background: transparent; border: 1px solid var(--border); border-radius: 8px; padding: 4px 8px; cursor: pointer; font-size: 0.9rem; position: relative; }
.pex-notif-btn.has-items { border-color: var(--accent); }
.pex-notif-count { position: absolute; top: -4px; right: -4px; background: var(--accent); color: var(--bg); font-size: 0.6rem; padding: 1px 4px; border-radius: 999px; min-width: 14px; text-align: center; }
.pex-notif-panel { position: absolute; top: 100%; right: 0; z-index: 200; min-width: 280px; max-width: 360px; margin-top: 6px; padding: 10px; box-shadow: 0 8px 24px rgba(0,0,0,0.25); }
.pex-notif-list { list-style: none; margin: 0; padding: 0; }
.pex-notif-row { display: flex; flex-direction: column; align-items: flex-start; width: 100%; text-align: left; background: transparent; border: none; padding: 8px 4px; cursor: pointer; border-bottom: 1px solid var(--border); }
.pex-notif-item.warn .pex-notif-row strong { color: var(--warn, #f59e0b); }
.pex-notif-item.success .pex-notif-row strong { color: var(--accent); }
.mode-guest .bottom-nav .nav-btn[data-view="lab"],
.mode-guest .bottom-nav .nav-btn[data-view="game"],
.mode-guest .bottom-nav .nav-btn[data-view="sports"],
.mode-basic .bottom-nav .nav-btn[data-view="lab"],
.mode-basic .bottom-nav .nav-btn[data-view="sports"] { display: none; }

.pex-journey-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; padding: 6px 12px; margin: 0 0 6px; font-size: 0.78rem; background: var(--surface); border-bottom: 1px solid var(--border); }
.pex-crumb { background: none; border: none; color: var(--muted); cursor: pointer; padding: 2px 4px; font-size: inherit; }
.pex-crumb.current { color: var(--text); font-weight: 600; }
.pex-crumb-sep { color: var(--muted); font-size: 0.7rem; }
.pex-fixture-flow { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0; padding: 8px; border-radius: 8px; background: var(--surface); border: 1px solid var(--border); }
.pex-permission-denied { padding: 10px 12px; margin: 0 0 8px; border-left: 4px solid var(--warn, #eab308); background: var(--surface); border-radius: 0 8px 8px 0; }
.pex-journey-health { margin: 4px 12px 8px; padding: 8px; border-radius: 8px; border: 1px solid var(--border); }
.pex-sev-ok strong, .pex-sev-ok { color: var(--accent, #22c55e); }
.pex-sev-warn strong, .pex-sev-warn { color: var(--warn, #eab308); }
.pex-sev-bad strong, .pex-sev-bad { color: var(--danger, #ef4444); }
.pex-status-link { cursor: pointer; background: var(--surface); }
.pex-alerts-strip { display: flex; flex-wrap: wrap; gap: 6px; padding: 4px 12px 8px; background: var(--surface); border-bottom: 1px solid var(--border); }
.pex-alert { border: 1px solid var(--border); border-radius: 999px; padding: 2px 10px; font-size: 0.72rem; cursor: pointer; background: var(--bg); }
.pex-alert-warn { border-color: var(--warn, #eab308); }
.pex-alert-success { border-color: var(--accent); }
.pex-page-health { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 6px 12px; margin: 0 0 6px; font-size: 0.72rem; background: var(--surface); border-bottom: 1px solid var(--border); }
.pex-page-health-chip { display: inline-flex; flex-direction: column; padding: 2px 8px; border-radius: 6px; border: 1px solid var(--border); }
.pex-page-health-chip .lbl { font-size: 0.6rem; color: var(--muted); text-transform: uppercase; }
.pex-page-verdict { font-weight: 700; padding: 2px 8px; border-radius: 6px; border: 1px solid var(--border); }
.pex-widget-help { margin: 4px 0; }
.betdna-doctor-drill-nav { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.betdna-doctor-drill-btn { font-size: 0.72rem; }
.betdna-doctor-metric-link { background: transparent; border: 1px solid var(--border); border-radius: 8px; padding: 4px 8px; cursor: pointer; }

/* Loop 012 — workspace productivity */
.wsp-quick-bar { display: flex; flex-wrap: wrap; gap: 4px; padding: 4px 12px 6px; background: var(--surface); border-bottom: 1px solid var(--border); overflow-x: auto; }
.wsp-quick-btn { display: inline-flex; flex-direction: column; align-items: center; min-width: 44px; padding: 4px 6px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg); cursor: pointer; font-size: 0.65rem; }
.wsp-quick-icon { font-size: 0.85rem; line-height: 1; }
.wsp-quick-label { color: var(--muted); margin-top: 2px; }
.wsp-panel-strip { display: flex; flex-wrap: wrap; gap: 4px; padding: 0 12px 6px; background: var(--surface); }
.wsp-panel-tab { font-size: 0.72rem; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--border); background: var(--bg); cursor: pointer; }
.wsp-pin-btn { background: transparent; border: none; cursor: pointer; font-size: 0.9rem; padding: 0 4px; }
.wsp-pin-btn.is-pinned { color: #fbbf24; }
.wsp-context-menu { position: fixed; z-index: 300; min-width: 180px; padding: 4px; box-shadow: 0 8px 24px rgba(0,0,0,0.3); }
.wsp-ctx-item { display: block; width: 100%; text-align: left; padding: 8px 10px; border: none; background: transparent; cursor: pointer; font-size: 0.82rem; }
.wsp-ctx-item:hover { background: var(--surface); }
.wsp-recents-list { list-style: none; margin: 0; padding: 0; }
.wsp-recent-btn { background: none; border: none; color: var(--accent); cursor: pointer; padding: 2px 0; font-size: 0.82rem; }
.wsp-workspace-list { list-style: none; margin: 0; padding: 0; }
.wsp-workspace-row { display: flex; gap: 6px; align-items: center; margin-bottom: 6px; }
.wsp-workspace-restore { flex: 1; text-align: left; background: transparent; border: 1px solid var(--border); border-radius: 6px; padding: 6px 8px; cursor: pointer; }
.cmd-section { margin-bottom: 8px; }
.cmd-section-title { margin: 4px 8px; text-transform: uppercase; letter-spacing: 0.04em; }
.pex-notif-item.is-read { opacity: 0.65; }
.pex-notif-actions { display: inline-flex; gap: 4px; margin-left: 8px; }
.pex-notif-filters { display: flex; gap: 6px; margin-bottom: 8px; }

.fir-pred-line, .fir-learn-pred, .fir-history-delta { margin-top: 6px; }

@media (max-width: 480px) {
  :root {
    --bdna-type-body: 0.9rem;
    --bdna-type-supporting: 0.85rem;
  }
  .stat-lbl { font-size: var(--bdna-type-caption); }
}
