/* Day colours remain the existing CSS fallbacks. No automatic OS-theme switch. */
:root{color-scheme:light}
html[data-theme="dark"]{color-scheme:dark;
 --night-surface:#111111;--night-surface-alt:#202020;
 --night-text-strong:#e7e7e7;--night-text-muted:#b1b1b1;
 --night-text-link:#70b8d4;--night-text-gold:#e7bb54;
 --night-text-danger:#ec928b;--night-text-positive:#73c4a5;--night-text-purple:#baa0dd;
 --night-border-soft:#2c2c2c;--night-action:#087aa7;
 --night-tint-blue:#172b34;--night-tint-green:#192d25;--night-tint-warm:#30281a;--night-tint-red:#322226;
 --blue:var(--night-text-link);--blue2:var(--night-tint-blue);--ink:var(--night-text-strong);
 --muted:var(--night-text-muted);--line:var(--night-border-soft);--green:var(--night-text-positive);
 --gold:var(--night-text-gold);--danger:var(--night-text-danger);--shadow:0 3px 18px #0003;
 scrollbar-color:#505050 #111111;
}
html[data-theme="dark"] body{background:#191919}
html[data-theme="dark"] .search-stage{background-color:#0d0d0d}
html[data-theme="dark"] input,html[data-theme="dark"] textarea,html[data-theme="dark"] select{color:var(--ink);background-color:var(--night-surface-alt)}
html[data-theme="dark"] .search-form input,html[data-theme="dark"] .search-form select{background-color:var(--night-surface)}
html[data-theme="dark"] input::placeholder,html[data-theme="dark"] textarea::placeholder{color:#929292;opacity:1}
html[data-theme="dark"] dialog::backdrop{background:#000000a6}
html[data-theme="dark"] :focus-visible{outline-color:#70b8d4}
/* Restyle SVG/HTML chart chrome directly, retaining series colours and state. */
html[data-theme="dark"] .highcharts-background{fill:var(--night-surface)}
html[data-theme="dark"] .highcharts-scrollable-mask{fill:var(--night-surface)}
html[data-theme="dark"] .highcharts-plot-background{fill:transparent}
html[data-theme="dark"] .highcharts-grid-line,html[data-theme="dark"] .highcharts-axis-line,html[data-theme="dark"] .highcharts-tick{stroke:var(--line)}
html[data-theme="dark"] .highcharts-axis-labels text,html[data-theme="dark"] .highcharts-axis-title,html[data-theme="dark"] .highcharts-range-selector-group text,html[data-theme="dark"] .highcharts-button text,html[data-theme="dark"] .highcharts-data-label text,html[data-theme="dark"] .highcharts-legend-item text,html[data-theme="dark"] .highcharts-title,html[data-theme="dark"] .highcharts-subtitle{fill:var(--ink)!important}
html[data-theme="dark"] .highcharts-text-outline{display:none}
html[data-theme="dark"] .highcharts-stack-labels text{fill:var(--ink)!important}
html[data-theme="dark"] .highcharts-legend-item-hidden text{fill:#777777!important}
html[data-theme="dark"] .highcharts-button-box,html[data-theme="dark"] .highcharts-navigator-handle,html[data-theme="dark"] .highcharts-scrollbar-button,html[data-theme="dark"] .highcharts-scrollbar-track{fill:var(--night-surface-alt);stroke:var(--line)}
html[data-theme="dark"] .highcharts-button-pressed .highcharts-button-box,html[data-theme="dark"] .highcharts-button-hover .highcharts-button-box{fill:#253d48}
html[data-theme="dark"] .highcharts-scrollbar-thumb{fill:#444444;stroke:#656565}
html[data-theme="dark"] .highcharts-scrollbar-arrow{fill:var(--muted)}
html[data-theme="dark"] .highcharts-navigator-outline{stroke:#535353}
html[data-theme="dark"] .highcharts-navigator-mask-outside{fill:#19191988}
html[data-theme="dark"] .highcharts-tooltip-box{fill:#202020;stroke:#414141}
html[data-theme="dark"] .highcharts-tooltip text{fill:var(--ink)!important}
html[data-theme="dark"] .highcharts-tooltip span{color:var(--ink)}
html[data-theme="dark"] .traffic-tooltip-content{background:#202020;color:var(--ink)}
html[data-theme="dark"] .highcharts-flags-series text{fill:var(--ink)!important}
/* A flag's fill belongs to its child label-box, not to the point group.
   Semantic series classes also survive the renderer's hover colour changes. */
html[data-theme="dark"] .power-event-win .highcharts-label-box{fill:#1a251f;stroke:#3d5b49}
html[data-theme="dark"] .power-event-loss .highcharts-label-box{fill:#2a1e21;stroke:#634348}
html[data-theme="dark"] .power-event-win text{fill:#8ac6a5!important}
html[data-theme="dark"] .power-event-loss text{fill:#e6a1a6!important}
html[data-theme="dark"] .power-event-win .highcharts-point-hover .highcharts-label-box{fill:#253b2e;stroke:#5e9172}
html[data-theme="dark"] .power-event-loss .highcharts-point-hover .highcharts-label-box{fill:#402b30;stroke:#95646c}
/* Inline chart labels and marker outlines also have a visible dark surface. */
html[data-theme="dark"] .history-chart text,html[data-theme="dark"] .task-history svg text{fill:var(--ink)}
html[data-theme="dark"] .history-chart [fill="#fff"],html[data-theme="dark"] .task-history svg [fill="#fff"]{fill:var(--night-surface)}
