/* Shared presentation asset for authenticated pages and the public login. */
.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  gap: 8px;
  width: 40px;
  height: 40px;
  padding: 9px;
  border: 1px solid var(--line, #e2e8f0);
  border-radius: 10px;
  color: var(--text-2, #475569);
  background: var(--panel, #fff);
  font: 600 12px/1.4 var(--sans, sans-serif);
  cursor: pointer;
  transition: background .16s ease, border-color .16s ease, color .16s ease;
}
.theme-toggle svg { display: block; width: 20px; height: 20px; flex-shrink: 0; }
.theme-toggle:hover { color: var(--primary, #1a365d); background: var(--primary-soft, #edf2f8); border-color: var(--line-2, #cbd5e1); }
.theme-toggle:focus-visible { outline: 2px solid var(--primary, #1a365d); outline-offset: 3px; }
.login-theme-toggle { position: absolute; top: 26px; right: max(36px, calc((100vw - 1160px) / 2)); z-index: 2; }

html[data-theme="dark"] {
  color-scheme: dark;
  --primary: #a5c9ef;
  --primary-dark: #bddbfa;
  --primary-light: #8ab4df;
  --primary-soft: #253548;
  --secondary: #78b7c8;
  --ink: #0f1318;
  --ink-2: #151a20;
  --panel: #181d23;
  --panel-2: #20262e;
  --line: #2b333e;
  --line-2: #3b4858;
  --text: #edf2f8;
  --text-2: #c0cad7;
  --text-3: #96a5b7;
  --amber: var(--primary);
  --amber-dim: var(--primary-light);
  --teal: #79c6b4;
  --red: #f19da3;
  --data-1: #8bb5e1;
  --data-2: #79c6b4;
  --data-3: #d7b084;
  --data-track: #2b3440;
  --shadow: 0 3px 16px rgb(0 0 0 / 12%);
  --theme-button: #9fc5ed;
  --theme-button-hover: #b6d6f5;
  --theme-button-text: #14263a;
  --theme-hover: #222d3a;
  --theme-danger-bg: #322328;
  --theme-warning-bg: #302b22;
  --theme-warning: #e4c18a;
  --theme-success-bg: #20332f;
  --theme-purple: #c2a8ea;
  --theme-focus: 0 0 0 3px rgb(145 188 232 / 15%);
  background: var(--ink);
  scrollbar-color: #485667 var(--ink);
}
html[data-theme="dark"] body { background: var(--ink); color: var(--text); }
html[data-theme="dark"] ::selection { color: #f2f7ff; background: #3d5a7d; }
html[data-theme="dark"] :focus-visible { outline-color: var(--primary-light); }
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea { color-scheme: dark; caret-color: var(--primary); }
html[data-theme="dark"] option { color: var(--text); background: var(--panel-2); }
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color: var(--text-3); opacity: 1; }
html[data-theme="dark"] input:-webkit-autofill,
html[data-theme="dark"] input:-webkit-autofill:hover,
html[data-theme="dark"] input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--text);
  -webkit-box-shadow: 0 0 0 1000px var(--panel-2) inset;
  caret-color: var(--primary);
}

/* Quiet, layered graphite surfaces with the same blue identity. */
html[data-theme="dark"] .masthead { background: #181d23; border-color: var(--line); }
html[data-theme="dark"] .mark,
html[data-theme="dark"] .story-brand .mark { color: #d8eafe; background: #2d4563; }
html[data-theme="dark"] .wordmark,
html[data-theme="dark"] .counter-num,
html[data-theme="dark"] .footer-brand { color: var(--text); }
html[data-theme="dark"] .tabs { background: var(--ink-2); }
html[data-theme="dark"] .tab { color: var(--text-3); }
html[data-theme="dark"] .tab.is-on { background: #2a3c51; border-color: #3a526d; color: #c6e0fc; }
html[data-theme="dark"] .tab:hover:not(.is-on) { color: var(--text); background: var(--panel-2); }
html[data-theme="dark"] .theme-toggle { background: var(--panel-2); color: var(--primary); border-color: var(--line); }
html[data-theme="dark"] .theme-toggle:hover { background: var(--theme-hover); border-color: var(--line-2); }
html[data-theme="dark"] .skip-link { color: var(--theme-button-text); background: var(--theme-button); }
html[data-theme="dark"] .logout { color: var(--text-2); }
html[data-theme="dark"] .logout:hover { color: var(--red); border-color: #87575d; background: var(--theme-danger-bg); }
html[data-theme="dark"] .foot { border-color: var(--line); }
html[data-theme="dark"] .hl { color: #d9ebff; background: #345070; }
html[data-theme="dark"] .sex-f { color: #d6afc5; }
html[data-theme="dark"] .fg-f { fill: #d6afc5; }
html[data-theme="dark"] .mark-ext.is-ig { color: var(--theme-purple); border-color: #665477; background: #292431; }
html[data-theme="dark"] .mark-ext.is-warn,
html[data-theme="dark"] .ext-tag.is-warn { color: var(--theme-warning); border-color: #746143; background: var(--theme-warning-bg); }
html[data-theme="dark"] .mark-ext.is-bad,
html[data-theme="dark"] .ext-tag.is-bad,
html[data-theme="dark"] .badge-bad { border-color: #825058; color: var(--red); background: var(--theme-danger-bg); }
html[data-theme="dark"] .ext-alarm { background: var(--theme-danger-bg); }
html[data-theme="dark"] .split > div b { color: var(--theme-button-text); text-shadow: none; }

/* Search: fields stay distinct from panels, with no bright white flashes. */
html[data-theme="dark"] #view-search { --search-muted: var(--text-3); }
html[data-theme="dark"] #view-search :is(.console, .results, .empty) { background: var(--panel); border-color: var(--line); box-shadow: none; }
html[data-theme="dark"] #view-search :is(h1, .empty h2, .rcount, .rc-hint, .filter-group legend) { color: var(--text); }
html[data-theme="dark"] #view-search .qbox { background: var(--ink-2); border-color: var(--line-2); }
html[data-theme="dark"] #view-search .qbox:focus-within { background: var(--ink-2); border-color: var(--primary-light); box-shadow: var(--theme-focus); }
html[data-theme="dark"] #view-search #q::placeholder { color: var(--text-3); }
html[data-theme="dark"] #view-search .qgo,
html[data-theme="dark"] #view-search .filter-apply,
html[data-theme="dark"] .login-go {
  color: var(--theme-button-text);
  background: var(--theme-button);
  border-color: var(--theme-button);
}
html[data-theme="dark"] #view-search .qgo:hover,
html[data-theme="dark"] #view-search .qgo:focus-visible,
html[data-theme="dark"] #view-search .filter-apply:hover,
html[data-theme="dark"] .login-go:hover:not(:disabled) { color: var(--theme-button-text); background: var(--theme-button-hover); border-color: var(--theme-button-hover); }
html[data-theme="dark"] #view-search :is(kbd, .query-mode select, .per select) { background: var(--panel-2); border-color: var(--line-2); color: var(--text-2); }
html[data-theme="dark"] #view-search :is(.active-filters, .search-help, .rhead, .pager, .result-skeleton) { border-color: var(--line); }
html[data-theme="dark"] #view-search .active-filters button { color: #c1daf5; background: #26374b; border-color: #3c536e; }
html[data-theme="dark"] #view-search .active-filters button:hover { background: #30455e; border-color: #6683a4; }
html[data-theme="dark"] #view-search .filters { background: var(--ink-2); border-color: var(--line); }
html[data-theme="dark"] #view-search :is(.f > span, .search-help summary, .result-open .rest) { color: var(--text-2); }
html[data-theme="dark"] #view-search :is(.f input, .f select) { background: var(--panel-2); border-color: var(--line-2); color: var(--text); }
html[data-theme="dark"] #view-search :is(.f input, .f select):focus,
html[data-theme="dark"] .login-card .f input:focus { background: var(--panel-2); border-color: var(--primary-light); box-shadow: var(--theme-focus); }
html[data-theme="dark"] #view-search .f input::placeholder { color: var(--text-3); }
html[data-theme="dark"] #view-search .filter-count { background: #3d5877; color: #e1efff; }
html[data-theme="dark"] #view-search .filter-actions .ghost,
html[data-theme="dark"] #view-search :is(.pbtn, #cancelSearch, #emptyFilters),
html[data-theme="dark"] #view-search .search-feedback button { color: var(--primary); background: var(--panel-2); border-color: var(--line-2); }
html[data-theme="dark"] #view-search .filter-actions .clear-all { background: transparent; border-color: transparent; color: var(--text-3); }
html[data-theme="dark"] #view-search .filter-actions .ghost:hover,
html[data-theme="dark"] #view-search .pbtn:hover:not(:disabled),
html[data-theme="dark"] #view-search :is(#cancelSearch, #emptyFilters):hover,
html[data-theme="dark"] #view-search .search-feedback button:hover { color: var(--text); background: var(--theme-hover); border-color: #6683a4; }
html[data-theme="dark"] #view-search .query-error { background: var(--theme-danger-bg); border-color: #cf7c85; color: #f1b4b9; }
html[data-theme="dark"] #view-search #q[aria-invalid="true"] { color: #f1b4b9; }
html[data-theme="dark"] #view-search .search-feedback { background: #1d2b3b; border-color: var(--line); color: var(--text-2); }
html[data-theme="dark"] #view-search .search-feedback-box:is(.is-error, .error) { color: #f1b4b9; }
html[data-theme="dark"] #view-search .search-draft { color: var(--theme-warning); }
html[data-theme="dark"] #view-search #refStatus { background: var(--theme-warning-bg); color: var(--theme-warning); border-color: #66563e; }
html[data-theme="dark"] #view-search #retryReferences { background: #3b3225; color: #efd5ad; border-color: #796747; }
html[data-theme="dark"] #view-search .rtable thead th { background: var(--panel-2); color: var(--text-2); }
html[data-theme="dark"] #view-search .rtable thead th.is-sorted { color: var(--primary); }
html[data-theme="dark"] #view-search .rtable tbody tr { border-color: var(--line); }
html[data-theme="dark"] #view-search .rtable tbody tr:hover,
html[data-theme="dark"] #view-search .rtable tbody tr.is-cursor { background: var(--theme-hover); }
html[data-theme="dark"] #view-search :is(.result-open-arrow, .result-copy, .rtable td.c-idx, .rcount .status-bad) { color: var(--text-3); }
html[data-theme="dark"] #view-search .result-copy:hover,
html[data-theme="dark"] #view-search .result-copy:focus-visible { background: #304158; border-color: #4a607c; color: #d0e5fc; }
html[data-theme="dark"] #view-search .empty-illustration { background: #253448; }
html[data-theme="dark"] #view-search .empty-tips > span { background: var(--panel-2); border-color: var(--line); }
html[data-theme="dark"] #view-search .result-skeleton i { background-image: linear-gradient(90deg, #25303b 25%, #344251 50%, #25303b 75%); }

/* The record panel remains a separate layer, including asynchronous states. */
html[data-theme="dark"] .drawer-scrim { background: rgb(5 8 12 / 68%); }
html[data-theme="dark"] #drawer { background: var(--panel); border-color: var(--line-2); box-shadow: -18px 0 60px rgb(0 0 0 / 28%); }
html[data-theme="dark"] #drawer .dr-top { background: var(--panel); border-color: var(--line); }
html[data-theme="dark"] #drawer .dr-fio { color: var(--text); }
html[data-theme="dark"] #drawer .drawer-stepper { border-color: var(--line); }
html[data-theme="dark"] #drawer :is(.drawer-stepper button, #retryCard) { color: var(--primary); background: var(--panel-2); border-color: var(--line-2); }
html[data-theme="dark"] #drawer .drawer-stepper button:hover:not(:disabled),
html[data-theme="dark"] #drawer #retryCard:hover { background: var(--theme-hover); border-color: #6683a4; }
html[data-theme="dark"] #drawer :is(.dr-position, .drawer-loading) { color: var(--text-3); }
html[data-theme="dark"] #drawer .drawer-error { color: var(--red); }
html[data-theme="dark"] #drawer .drawer-announcement { color: var(--teal); }
html[data-theme="dark"] #drawer :is(.tel, .ig, .rel, .ext-row, .iinseg b) { background: var(--panel-2); }
html[data-theme="dark"] #drawer :is(.rel:hover, .tel.is-matched) { background: var(--theme-hover); }
html[data-theme="dark"] #drawer .fg-wrap { background: var(--ink-2); }
html[data-theme="dark"] #drawer .leaflet-container { border-color: var(--line-2); background: var(--panel-2); }
html[data-theme="dark"] #drawer :is(.leaflet-control-zoom a, .leaflet-control-attribution) { color: var(--text); background: var(--panel-2); border-color: var(--line-2); }
html[data-theme="dark"] #drawer .leaflet-control-attribution a { color: var(--primary); }

/* Statistics, including every category, table, chart and birthday panel. */
html[data-theme="dark"] .st-workspace { --st-navy: var(--text); --st-muted: var(--text-3); --st-line: var(--line); }
html[data-theme="dark"] #view-stats {
  --c-navy: #8bb5e1;
  --c-teal: #79bfc7;
  --c-text: var(--text);
  --c-muted: var(--text-3);
  --c-track: #29333f;
  --c-border: var(--line);
}
html[data-theme="dark"] :is(.st-summary-card, .st-scope-strip, .st-panel, .st-state, .c-panel, .c-tile) { color: var(--text); background: var(--panel); border-color: var(--line); }
html[data-theme="dark"] .st-main-number { color: #edf4fd; background: #24384f; box-shadow: inset 0 0 0 1px #354b66; }
html[data-theme="dark"] .st-main-top { color: #c7d8ed; }
html[data-theme="dark"] :is(.st-main-unit, .st-main-bottom) { color: #b2c5dd; }
html[data-theme="dark"] .st-main-art { opacity: .08; }
html[data-theme="dark"] :is(.st-eyebrow, .st-heading p span, .st-summary-label, .st-summary-sub, .st-metric > span, .st-panel-head p, .st-panel-foot, .st-data-note, .st-section-heading p, .st-state p) { color: var(--text-3); }
html[data-theme="dark"] .st-eyebrow span { color: #56667a; }
html[data-theme="dark"] :is(.st-summary-arrow, .st-no-data) { color: #8498af; }
html[data-theme="dark"] .st-no-data strong { color: var(--text-2); }
html[data-theme="dark"] .st-panel h3 { color: var(--text); }
html[data-theme="dark"] :is(.st-panel-foot, .st-metric) { border-color: var(--line); }
html[data-theme="dark"] .st-panel-foot button { color: var(--primary); }
html[data-theme="dark"] .st-panel-foot button:hover { color: #d2e6fc; }
html[data-theme="dark"] :is(.st-btn, .st-icon-btn) { background: var(--panel-2); border-color: var(--line-2); color: var(--text-2); }
html[data-theme="dark"] :is(.st-btn:hover, .st-icon-btn:hover, .st-icon-btn[aria-pressed="true"]) { color: var(--primary); background: #293b51; border-color: #597391; }
html[data-theme="dark"] .st-btn-primary { background: var(--theme-button); color: var(--theme-button-text); border-color: var(--theme-button); }
html[data-theme="dark"] .st-btn-primary:hover { background: var(--theme-button-hover); color: var(--theme-button-text); border-color: var(--theme-button-hover); }
html[data-theme="dark"] .st-section-nav { background: var(--ink-2); border-color: var(--line); }
html[data-theme="dark"] .st-section-nav button { color: var(--text-3); }
html[data-theme="dark"] .st-section-nav button:hover { background: var(--panel-2); color: var(--text); }
html[data-theme="dark"] .st-section-nav button[aria-selected="true"] { background: #293b50; border-color: #3c546e; color: #c8e1fa; box-shadow: none; }
html[data-theme="dark"] .st-summary-card:hover { border-color: #4d6580; box-shadow: 0 5px 20px rgb(0 0 0 / 12%); }
html[data-theme="dark"] .st-summary-icon { color: var(--primary); background: #26384e; }
html[data-theme="dark"] .st-summary-card:nth-child(3) .st-summary-icon { background: #213933; color: #8bc8bb; }
html[data-theme="dark"] .st-summary-card:nth-child(4) .st-summary-icon { background: #302a40; color: #c2afe8; }
html[data-theme="dark"] .st-section-heading > span { background: var(--panel-2); border-color: var(--line); color: var(--text-2); }
html[data-theme="dark"] .st-spinner { border-color: var(--line-2); border-top-color: var(--primary); }
html[data-theme="dark"] .c-gridline { stroke: var(--line); }
html[data-theme="dark"] .c-line-dot { fill: var(--panel); }
html[data-theme="dark"] .c-column:hover .c-column-fill { fill: #b0d0f2; }
html[data-theme="dark"] .c-pyr-side { background: var(--c-track); }
html[data-theme="dark"] .c-scroll { scrollbar-color: #485b70 transparent; }
html[data-theme="dark"] .c-table thead th { background: var(--panel-2); }
html[data-theme="dark"] .c-table tbody tr:hover { background: var(--theme-hover); }
html[data-theme="dark"] .c-empty { background: var(--ink-2); }
html[data-theme="dark"] .c-heat-cell { background: color-mix(in srgb, var(--c-navy) calc(var(--c-opacity) * 100%), var(--c-track)); }
html[data-theme="dark"] :is(.c-heat-cell.is-zero, .c-heat-key b.is-zero) { background: var(--ink-2); border-color: var(--line-2); }
html[data-theme="dark"] :is(.c-heat-cell.is-missing, .c-heat-key b.is-missing, .c-bar-row.is-missing .c-bar-track) { background: repeating-linear-gradient(135deg, #1c242e 0 3px, #344152 3px 5px); }
html[data-theme="dark"] .c-heat-scale > i { background: linear-gradient(90deg, var(--c-track), var(--c-navy)); }
html[data-theme="dark"] .c-split > span { color: #102234; }
/* Chart data series are inline values; map both swatches and SVG segments together. */
html[data-theme="dark"] #view-stats [style*="--c-tone:#294f7d"] { --c-tone: #8bb5e1 !important; }
html[data-theme="dark"] #view-stats [style*="--c-tone:#408a98"] { --c-tone: #79bfc7 !important; }
html[data-theme="dark"] #view-stats [style*="--c-tone:#8278b0"] { --c-tone: #b7a7e0 !important; }
html[data-theme="dark"] #view-stats [style*="--c-tone:#b68551"] { --c-tone: #d5b086 !important; }
html[data-theme="dark"] #view-stats [style*="--c-tone:#5b80ba"] { --c-tone: #8ea2dc !important; }
html[data-theme="dark"] #view-stats [style*="--c-tone:#9faec0"] { --c-tone: #b9c6d5 !important; }
html[data-theme="dark"] #view-stats [style*="--c-tone:#c9d3df"] { --c-tone: #54677e !important; }
html[data-theme="dark"] .c-donut-segment[stroke="#294f7d"] { stroke: #8bb5e1; }
html[data-theme="dark"] .c-donut-segment[stroke="#408a98"] { stroke: #79bfc7; }
html[data-theme="dark"] .c-donut-segment[stroke="#8278b0"] { stroke: #b7a7e0; }
html[data-theme="dark"] .c-donut-segment[stroke="#b68551"] { stroke: #d5b086; }
html[data-theme="dark"] .c-donut-segment[stroke="#5b80ba"] { stroke: #8ea2dc; }
html[data-theme="dark"] .c-donut-segment[stroke="#9faec0"] { stroke: #b9c6d5; }
html[data-theme="dark"] .c-donut-segment[stroke="#c9d3df"] { stroke: #54677e; }

html[data-theme="dark"] :is(.bd-explorer, .bd-explorer h4, .bd-facts strong) { color: var(--text); }
html[data-theme="dark"] .bd-facts > div { background: var(--panel-2); border-color: var(--line); }
html[data-theme="dark"] :is(.bd-facts span, .bd-facts small, .bd-months button > span, .bd-days button > span, .bd-month-heading > span, .bd-hint, .bd-detail span, .bd-top-heading > span, .bd-top-list small, .bd-rank) { color: var(--text-3); }
html[data-theme="dark"] :is(.bd-months button, .bd-days button, .bd-top-list button) { color: var(--text-2); background: var(--panel-2); border-color: var(--line); }
html[data-theme="dark"] :is(.bd-months button, .bd-days button, .bd-top-list button):hover { background: var(--theme-hover); border-color: #597391; }
html[data-theme="dark"] .bd-months button i { background: #354353; }
html[data-theme="dark"] .bd-months button i b { background: #718eaf; }
html[data-theme="dark"] .bd-months button[aria-pressed="true"] { background: #293e55; border-color: #7099c4; color: #e0edfc; }
html[data-theme="dark"] .bd-months button[aria-pressed="true"] > span { color: #bfd8f2; }
html[data-theme="dark"] .bd-months button[aria-pressed="true"] i b { background: #a1c6ed; }
html[data-theme="dark"] .bd-days button[aria-pressed="true"] { background: #a1c6ed; border-color: #a1c6ed; color: #13263c; }
html[data-theme="dark"] .bd-days button[aria-pressed="true"] > span { color: #284663; }
html[data-theme="dark"] .bd-days button.is-unknown:not([aria-pressed="true"]) { background: var(--ink-2); }
html[data-theme="dark"] .bd-detail { background: #223247; border-color: #384e69; border-left-color: #91b9e2; }
html[data-theme="dark"] .bd-detail span { color: #b0c2d8; }
html[data-theme="dark"] .bd-warning { background: var(--theme-warning-bg); border-color: #6b583e; color: var(--theme-warning); }
html[data-theme="dark"] .bd-top { border-color: var(--line); }
html[data-theme="dark"] .st-panel[data-panel="calendar"] .st-icon-btn { color: var(--primary); }

/* Login keeps its illustration and composition, now with layered dark paper. */
html[data-theme="dark"] .login-wrap { background: var(--panel); border-color: var(--line); box-shadow: 0 20px 60px rgb(0 0 0 / 18%); }
html[data-theme="dark"] .login-story { background: #181f28; border-color: var(--line); }
html[data-theme="dark"] .login-panel { background: var(--panel); }
html[data-theme="dark"] :is(.story-content h1, .login-card h2, .story-brand) { color: var(--text); }
html[data-theme="dark"] .story-content h1 span { color: var(--primary); }
html[data-theme="dark"] .login-card .f input { background: var(--panel-2); border-color: var(--line-2); }
html[data-theme="dark"] .art-grid { background-image: linear-gradient(#7e9cbd12 1px, transparent 1px), linear-gradient(90deg, #7e9cbd12 1px, transparent 1px); }
html[data-theme="dark"] .art-record { background: #2b394b; border-color: #4a617c; box-shadow: 0 15px 32px rgb(0 0 0 / 20%); }
html[data-theme="dark"] .art-record-back { background: #203043; border-color: #354d69; }
html[data-theme="dark"] .art-record i { background: #93acc8; }
html[data-theme="dark"] .login-err { background: var(--theme-danger-bg); color: #f1b4b9; }

@media (max-width: 1100px) {
  .masthead { gap: 14px; }
}
@media (max-width: 760px) {
  .masthead { column-gap: 9px; }
  .masthead .theme-toggle { width: 36px; height: 36px; padding: 7px; }
  html[data-theme="dark"] #view-search .rtable tbody tr { background: var(--panel-2); }
  html[data-theme="dark"] #view-search .rtable tbody tr:hover,
  html[data-theme="dark"] #view-search .rtable tbody tr.is-cursor { background: var(--theme-hover); }
}
@media (max-width: 640px) {
  .login-theme-toggle { top: 13px; right: 16px; }
  .login-back { padding-right: 48px; }
}
@media (prefers-reduced-motion: reduce) {
  .theme-toggle { transition: none; }
}