.header-tools {
  display: flex;
  align-items: center;
  gap: 10px;
}

.theme-toggle {
  display: inline-grid;
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 50%;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font-size: 17px;
  line-height: 1;
  transition: color .2s ease, background .2s ease, border-color .2s ease;
}

.theme-toggle:hover {
  border-color: var(--line);
  background: var(--paper-deep);
  color: var(--ink);
}

.theme-toggle:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 2px;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --paper: #171b18;
  --paper-deep: #202622;
  --ink: #e6ebe6;
  --muted: #a1aaa2;
  --line: #343d36;
  --green: #a3c8ad;
  --green-dark: #b0d2b8;
  --green-pale: #29372e;
  --orange: #e69670;
}

html[data-theme="dark"] body {
  background: var(--paper);
  color: var(--ink);
}

html[data-theme="dark"] .site-header {
  border-bottom-color: #343a35;
}

html[data-theme="dark"] .wordmark-light,
html[data-theme="dark"] .nav-link,
html[data-theme="dark"] .milestone-date,
html[data-theme="dark"] .milestone-location,
html[data-theme="dark"] .footer-note,
html[data-theme="dark"] .footer-date {
  color: #a0aaa1;
}

html[data-theme="dark"] .header-action,
html[data-theme="dark"] .hero-link,
html[data-theme="dark"] .about-link,
html[data-theme="dark"] .source-link,
html[data-theme="dark"] .aside-link,
html[data-theme="dark"] .text-button {
  color: var(--green-dark);
}

html[data-theme="dark"] .header-action {
  border-color: #48554a;
}

html[data-theme="dark"] .header-action:hover,
html[data-theme="dark"] .hero-link:hover,
html[data-theme="dark"] .theme-toggle:hover {
  background: var(--green-pale);
}

html[data-theme="dark"] .hero,
html[data-theme="dark"] .catalog-hero {
  border-bottom-color: var(--line);
}

html[data-theme="dark"] .hero-art {
  border-color: #38443a;
  background-image: radial-gradient(#39443a 0.7px, transparent 0.7px);
}

html[data-theme="dark"] .art-caption,
html[data-theme="dark"] .art-footer {
  color: #a0aaa1;
}

html[data-theme="dark"] .hero-description,
html[data-theme="dark"] .section-intro,
html[data-theme="dark"] .catalog-deck,
html[data-theme="dark"] .milestone p,
html[data-theme="dark"] .aside-card p,
html[data-theme="dark"] .aside-note p,
html[data-theme="dark"] .about-block p,
html[data-theme="dark"] .people-principle p,
html[data-theme="dark"] .ethics-hold p,
html[data-theme="dark"] .person-contribution,
html[data-theme="dark"] .company-contribution,
html[data-theme="dark"] .race-method p,
html[data-theme="dark"] .race-caveat,
html[data-theme="dark"] .credit-copy p,
html[data-theme="dark"] .credit-note p {
  color: #aab3aa;
}

html[data-theme="dark"] .hero-latest,
html[data-theme="dark"] .aside-card,
html[data-theme="dark"] .people-principle,
html[data-theme="dark"] .race-method,
html[data-theme="dark"] .credit-note {
  background: #232c25;
}

html[data-theme="dark"] .hero-latest:hover {
  background: #29352c;
}

html[data-theme="dark"] .hero-latest > span:last-child,
html[data-theme="dark"] .picker-stage-title h3,
html[data-theme="dark"] .person-info h3,
html[data-theme="dark"] .company-info h3,
html[data-theme="dark"] .leader-details strong,
html[data-theme="dark"] .race-method p strong,
html[data-theme="dark"] .credit-copy p em,
html[data-theme="dark"] .about-block h2 {
  color: #e1e8e1 !important;
}

html[data-theme="dark"] .model-name {
  color: #e1e8e1 !important;
}

html[data-theme="dark"] .picker-inner,
html[data-theme="dark"] .milestone,
html[data-theme="dark"] .person-card,
html[data-theme="dark"] .company-card,
html[data-theme="dark"] .people-search,
html[data-theme="dark"] .race-latest,
html[data-theme="dark"] .model-list-wrap,
html[data-theme="dark"] .credit-feature {
  border-color: #3a443c;
  background: #202622;
}

html[data-theme="dark"] .race-perspective {
  border-left-color: #526254;
}

html[data-theme="dark"] .race-perspective p {
  color: #b7c2b8;
}

html[data-theme="dark"] .race-perspective cite {
  color: #929d93;
}

html[data-theme="dark"] .milestone:hover {
  border-color: #657d69;
}

html[data-theme="dark"] .milestone.is-highlighted {
  animation-name: timeline-arrival-dark;
}

@keyframes timeline-arrival-dark {
  0%, 35% { border-color: var(--orange); background: #342a25; box-shadow: 0 0 0 3px rgba(230, 150, 112, .12); }
  100% { border-color: #3a443c; background: #202622; box-shadow: none; }
}

html[data-theme="dark"] .search-box,
html[data-theme="dark"] .filter-select,
html[data-theme="dark"] kbd {
  border-color: #3a443c;
  background: #202622;
}

html[data-theme="dark"] .search-box input,
html[data-theme="dark"] .filter-select select {
  color: #d1d9d1;
}

html[data-theme="dark"] .filter-select select {
  color: #aab3aa;
}

html[data-theme="dark"] .search-box input::placeholder,
html[data-theme="dark"] .timeline-meta,
html[data-theme="dark"] .empty-state p {
  color: #9aa59b;
}

html[data-theme="dark"] .filter-select::after {
  border-color: #a8b5a9;
}

html[data-theme="dark"] .search-box svg {
  stroke: #a8b5a9;
}

html[data-theme="dark"] .filters {
  border-color: #384139;
  background-color: transparent;
}

html[data-theme="dark"] .timeline-list::before {
  background-color: #384139;
}

html[data-theme="dark"] .empty-state {
  border-color: #3a443c;
}

html[data-theme="dark"] .category-tag[data-category="Systems"] {
  color: #9db9d8;
}

html[data-theme="dark"] .category-tag[data-category="Policy"] {
  color: #c0b9ed;
}

html[data-theme="dark"] .category-tag[data-category="Products"] {
  color: #f0a787;
}

html[data-theme="dark"] .category-tag[data-category="Society"] {
  color: #e2c27b;
}

html[data-theme="dark"] .milestone-footer,
html[data-theme="dark"] .picker-heading,
html[data-theme="dark"] .picker-footer,
html[data-theme="dark"] .story-sources,
html[data-theme="dark"] .story-sources a,
html[data-theme="dark"] .about-block,
html[data-theme="dark"] .credit-links {
  border-color: #384139;
}

html[data-theme="dark"] .year-choice,
html[data-theme="dark"] .month-choice {
  border-color: #3b453d;
  background: #29312b;
  color: #d0d8d0;
}

html[data-theme="dark"] .latest-entry {
  border-color: #3b453d;
  background: #29312b;
}

html[data-theme="dark"] .model-table tbody tr {
  background-image: linear-gradient(to right, #2a3a2e 0, #2a3a2e var(--score-fill), transparent var(--score-fill), transparent 100%);
}

html[data-theme="dark"] .model-score-value {
  color: #dcebe0;
}

html[data-theme="dark"] .month-choice:disabled {
  background: #222823;
  color: #737d74;
}

html[data-theme="dark"] .picker-close,
html[data-theme="dark"] .decade-button,
html[data-theme="dark"] .back-to-years {
  color: #aab8ac;
}

html[data-theme="dark"] .picker-close,
html[data-theme="dark"] .decade-button {
  border-color: #3b453d;
}

html[data-theme="dark"] .picker-close:hover,
html[data-theme="dark"] .decade-button:hover:not(:disabled),
html[data-theme="dark"] .back-to-years:hover,
html[data-theme="dark"] .year-choice:hover,
html[data-theme="dark"] .month-choice:hover:not(:disabled) {
  background: #303d33;
}

html[data-theme="dark"] .year-choice[aria-pressed="true"],
html[data-theme="dark"] .month-choice[aria-pressed="true"] {
  background: var(--green);
  color: #172019;
}

html[data-theme="dark"] .month-choice[aria-pressed="true"] .month-marker {
  background: #24352a;
}

html[data-theme="dark"] .people-search input,
html[data-theme="dark"] .model-table td {
  color: #c2cbc2;
}

html[data-theme="dark"] .people-search input::placeholder {
  color: #838d84;
}

html[data-theme="dark"] .people-principle strong,
html[data-theme="dark"] .ethics-hold strong,
html[data-theme="dark"] .editorial-note strong {
  color: #dce7dc;
}

html[data-theme="dark"] .person-role,
html[data-theme="dark"] .company-role,
html[data-theme="dark"] .company-marker span,
html[data-theme="dark"] .person-bulb > span,
html[data-theme="dark"] .person-heart > span,
html[data-theme="dark"] .person-math > span:last-child,
html[data-theme="dark"] .person-domain-marker > span,
html[data-theme="dark"] .person-score span,
html[data-theme="dark"] .company-score span,
html[data-theme="dark"] .latest-entry-date,
html[data-theme="dark"] .model-config,
html[data-theme="dark"] .model-table th,
html[data-theme="dark"] .race-meta,
html[data-theme="dark"] .race-caveat {
  color: #929d93;
}

html[data-theme="dark"] .company-marker span {
  color: #a0aaa1;
}

html[data-theme="dark"] .company-marker-research { color: #a9c3ee; }
html[data-theme="dark"] .company-marker-infrastructure { color: #9fc2d1; }
html[data-theme="dark"] .company-marker-open { color: #abd0b0; }
html[data-theme="dark"] .company-marker-product { color: #e3b28c; }
html[data-theme="dark"] .company-marker-safety { color: #9bc7a8; }
html[data-theme="dark"] .company-marker-compute { color: #c0ace7; }

html[data-theme="dark"] .bulb-base {
  fill: #a0b09f;
}

html[data-theme="dark"] .model-table th,
html[data-theme="dark"] .model-table td,
html[data-theme="dark"] .model-table tr:last-child td {
  border-color: #384139;
}

html[data-theme="dark"] .model-table tbody tr:hover {
  background: #29332b;
}

html[data-theme="dark"] .story-header h1 em,
html[data-theme="dark"] .story-body .story-lead,
html[data-theme="dark"] .story-body h2,
html[data-theme="dark"] .story-body blockquote p,
html[data-theme="dark"] .next-question p {
  color: #e1e8e1;
}

html[data-theme="dark"] .latest-masthead,
html[data-theme="dark"] .story-kicker span,
html[data-theme="dark"] .story-visual,
html[data-theme="dark"] .story-body blockquote,
html[data-theme="dark"] .editorial-note,
html[data-theme="dark"] .next-question {
  border-color: #39433b;
  background: #232b25;
}

html[data-theme="dark"] .article-navigation button {
  color: var(--green-dark);
}

html[data-theme="dark"] .story-body,
html[data-theme="dark"] .story-body p,
html[data-theme="dark"] .story-deck,
html[data-theme="dark"] .step-name,
html[data-theme="dark"] .visual-topline,
html[data-theme="dark"] .visual-bottom,
html[data-theme="dark"] .story-byline,
html[data-theme="dark"] .rail-card p,
html[data-theme="dark"] .rail-note p,
html[data-theme="dark"] .editorial-note p,
html[data-theme="dark"] .story-sources a {
  color: #b5beb5;
}

html[data-theme="dark"] .story-body blockquote cite {
  color: #a0aaa1;
}

html[data-theme="dark"] .person-heart {
  color: #ee9a8d;
}

html[data-theme="dark"] .person-math {
  color: #a9c3ee;
}

html[data-theme="dark"] .person-engineering { color: #9bc7da; }
html[data-theme="dark"] .person-safety { color: #a1d5b5; }
html[data-theme="dark"] .person-governance { color: #c5afe5; }
html[data-theme="dark"] .person-education { color: #e3c08f; }

html[data-theme="dark"] .latest-entry h3 {
  color: #dce7dc;
}

html[data-theme="dark"] .latest-entry p {
  color: #aab3aa;
}

html[data-theme="dark"] .step-symbol {
  border-color: #536454;
  background: #1c231e;
}

html[data-theme="dark"] .rail-card {
  background: #29352c;
}

html[data-theme="dark"] .rail-note {
  border-color: #39433b;
}

html[data-theme="dark"] .story-sources a {
  border-bottom-color: #39433b;
}

@media (max-width: 760px) {
  .header-tools { gap: 4px; }
  .theme-toggle { width: 30px; height: 30px; font-size: 15px; }
}