:root {
  /* Shared dark palette. Each feature keeps its authored light color. */
  color-scheme: light dark;
  --dark-page: #151d18;
  --dark-surface: #202b24;
  --dark-surface-raised: #26342b;
  --dark-soft: #293e31;
  --dark-input: #18231d;
  --dark-ink: #e8f0eb;
  --dark-muted: #b1c3b7;
  --dark-line: #617d6a;
  --dark-accent: #9bddb7;
  --dark-accent-hover: #b7edce;
  --dark-on-accent: #123321;
  --dark-success: #9bddb7;
  --dark-success-bg: #223c2e;
  --dark-warn: #f2c66d;
  --dark-warn-bg: #453824;
  --dark-warning: var(--dark-warn);
  --dark-warning-bg: var(--dark-warn-bg);
  --dark-error: #ffb4ab;
  --dark-error-bg: #42262a;
  --dark-info: #b7daf9;
  --dark-info-bg: #223342;
  --dark-purple: #d4b8f5;
  --dark-orange: #e8a676;
  --dark-rose: #dfa4c2;
  --dark-olive: #c5d795;
  --dark-category-base: #2f4d3c;
  --dark-category-build: #2d4559;
  --dark-category-race: #443452;
  --dark-category-taper: #4b422c;
  --dark-category-recovery: #3a443d;
}
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] { color-scheme: dark; }
.settings-appearance h2 { margin-bottom: 10px; }
.appearance-control { max-width: 360px; }
.appearance-control label { margin-top: 0; }
.appearance-control select { min-height: 44px; }
.appearance-status { margin-top: 8px; }
:where([data-theme="dark"]) :where(a:any-link) { color: var(--dark-accent); }
:root[data-theme="dark"] :where(input, textarea)::placeholder {
  color: var(--dark-muted);
  opacity: 1;
}
:root[data-theme="dark"] :where(a, button, summary, input, select, textarea):focus-visible {
  outline: 3px solid var(--dark-accent);
  outline-offset: 2px;
}