/* Shared graphite surfaces and freestanding topic icons.
   The book's own paper/ink palette remains independent. */
[data-theme="dark"] body {
  --bg: #101719;
  --bg-2: #141f22;
  --panel: #1c282b;
  --panel-solid: #1c282b;
  --panel-border: #314247;
  --line-strong: #314247;
  --heading: #f1f5f4;
  --text: #d0dbd8;
  --muted: #a9bab5;
  --ink3: #a9bab5;
  --accent: #20c7a7;
  --accent-ink: #20c7a7;
  --accent-soft: #203b3b;
  --on-accent: #082722;
  --chip: #243438;
  --hover: #243438;
  --grid-line: #314247;
  --shadow: none;
  --nav-bg: #152326;
  --nav-text: #d0dbd8;
  --nav-muted: #a9bab5;
  --nav-hover: #1c3033;
  --nav-line: #314247;
}
[data-theme="dark"] body .topbar { background: #141f22; border-bottom: 1px solid var(--panel-border); box-shadow: none; }
[data-theme="dark"] body .topbar .search input { background: var(--panel); border-color: var(--line-strong); }
[data-theme="dark"] body .topbar .search input:focus { border-color: var(--accent); }
[data-theme="dark"] body .topbar .search::before { opacity: 1; }
[data-theme="dark"] .view { background: var(--bg); }
[data-theme="dark"] .nav-title { color: var(--nav-muted); }
[data-theme="dark"] .nav-item:hover { color: var(--heading); border-left-color: transparent; }
[data-theme="dark"] .sidebar .nav-item.active,
[data-theme="dark"] .sidebar .nav-item.active:hover { background: #203b3b; color: var(--heading); border-left-color: var(--accent); }
[data-theme="dark"] .nav-item:focus-visible { outline: 2px solid var(--accent); outline-offset: -3px; }
[data-theme="dark"] .view :is(.page-head h1, .section-head h2, .person-title h1, .card-head h3, .insight-title, .hl-value, .record-value, .stat-value, .chart-title .card-heading-text) { color: var(--heading); }
[data-theme="dark"] .view .stat .stat-value { color: var(--heading); }
[data-theme="dark"] .view :is(.nav-card, .card.soft) { background: var(--panel); }
[data-theme="dark"] .view :is(a.card, a.stat):hover { background: var(--hover); border-color: var(--panel-border); transform: none; box-shadow: none; }
[data-theme="dark"] table.table tbody tr:hover,
[data-theme="dark"] table.table tbody tr:focus-within { background: var(--hover); }
[data-theme="dark"] svg.chart.donut .donut-center { fill: var(--heading); }
