/* Shared public-site theme. Media and chart data colors stay untouched. */
:root {
  color-scheme: dark !important;
  --site-bg: #101214;
  --site-panel: #181c20;
  --site-text: #e2e6e9;
  --site-muted: #a2adb7;
  --site-border: #343c44;
  --site-link: #8dc7ff;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace !important;
  color: var(--site-text) !important;
  background: var(--site-bg) !important;
}
body {
  font-family: inherit !important;
  color: var(--site-text) !important;
  background: var(--site-bg) !important;
}
body :where(h1, h2, h3, h4, p, a, li, span, div, label, table, summary, pre, code, button, input, select, textarea, output) {
  font-family: inherit !important;
}
a { color: var(--site-link) !important; }
a:hover { color: #c2e1ff !important; }
:focus-visible { outline: 2px solid var(--site-link); outline-offset: 3px; }
::selection { background: #294967; color: #fff; }
header, footer, details, article, .notice, .distinctions article,
.field-input, .summary-item, .chart, .chart-tooltip, .mode-toggle,
.stats-table, .chart-block, .diagnostics {
  background: var(--site-panel) !important;
  color: var(--site-text) !important;
  border-color: var(--site-border) !important;
}
li, header, footer, th, td, .table-wrap, .document-page, .chart-tooltip-sub {
  border-color: var(--site-border) !important;
}
button, input, select, textarea {
  color: var(--site-text) !important;
  background-color: var(--site-panel) !important;
  border-color: var(--site-border) !important;
  accent-color: var(--site-link);
}
button:hover { background-color: #26313b !important; }
button.active, button[data-running="true"] {
  background-color: #294967 !important;
  color: #fff !important;
  border-color: var(--site-link) !important;
}
th { background: var(--site-panel) !important; color: var(--site-muted) !important; }
tbody tr:hover { background: #20262c !important; }
time, header span, footer, .page-marker, .empty-page, summary,
.sub, .intro, .hint, .affix, .field-label, .summary-item .label,
.chart-tooltip-sub, .chart-tooltip-row .name, .message,
.period-value, .lift-angle-value, .unlock-threshold-value, #status {
  color: var(--site-muted) !important;
}
.chart h2, .table-section h2 { color: var(--site-text) !important; }
.summary-item.big { background: #162a22 !important; border-color: #3f6653 !important; }
.summary-item.big .value, td.total { color: #88deb0 !important; }
td.savings { color: var(--site-link) !important; }
body.site-home {
  max-width: 48rem;
  margin: 0 auto;
  padding: clamp(2rem, 8vw, 5rem) 1.25rem;
  font-size: 1rem;
  line-height: 1.6;
}
.site-home h1 { font-size: 1.6rem; }
.site-home ul { list-style: none; padding: 0; }
.site-home li { padding: 1rem 0; border-bottom: 1px solid var(--site-border); }
