/* Dark theme: [data-theme="dark"] override block, activated by
   themeState.js setting that attribute on <html>. Only redefines the
   tokens that actually change — everything else (spacing, font sizes,
   border widths, radius, transitions, z-index) is layout/motion, not
   color, and stays identical across themes per tokens.css.

   Palette: deep navy, sampled from the user's reference screenshot
   (2026-11-02): page #0b0d13, panels/chart canvas #161d27, hairlines
   #2a3447, gridlines #242c3b, white primary text, #a3aec0 secondary,
   teal/rose for P&L (the chart's own up/down are blue/amber, see
   colors.js). Replaces the earlier "IntelliJ Islands Dark" palette.

   Mirrored by colors.js's DARK_PALETTE for the canvas-drawn half of the
   palette (candles, depth/OI/ΔOI bars, level lines/bands) that CSS
   custom properties can't reach — kept in sync by hand, same tradeoff
   tokens.css/colors.js already documents. */

:root[data-theme="dark"] {
    color-scheme: dark;

    --color-bg: #0b0d13; /* page */
    --color-fg: #ffffff; /* primary text */
    --color-heading: #ffffff; /* section headings: white, more pronounced than fg */
    --color-border: #a3aec0; /* = secondary text */
    --color-border-light: #2a3447; /* panel hairlines */
    --color-muted: #a3aec0; /* secondary text */
    --color-grid: #242c3b; /* gridlines */
    --color-overlay-backdrop: rgba(0, 0, 0, 0.6);
    --color-surface: #161d27; /* panels / chart canvas */

    /* Load-bearing: up is green, down is red (UI text: PnL, day change). */
    --color-up: #2ed3b0;
    --color-down: #ff5c7a;
}