/* MONO — variables.css : monochrome design tokens, light + dark */
:root {
    --background: #ffffff;
    --surface: #f7f7f7;
    --surface-raised: #ffffff;
    --text-primary: #111111;
    --text-secondary: #666666;
    --text-tertiary: #8f8f8f;
    --border: #dedede;
    --border-strong: #c3c3c3;
    --positive: #1a7f37;
    --negative: #b42318;
    --focus-ring: #111111;
    --overlay: rgba(17, 17, 17, 0.45);
    --shadow-sm: 0 1px 2px rgba(17, 17, 17, 0.06);
    --shadow-md: 0 4px 16px rgba(17, 17, 17, 0.08);

    --chart-line: #111111;
    --chart-grid: #e6e6e6;
    --chart-bar-1: #111111;
    --chart-bar-2: #8f8f8f;
    --chart-bar-3: #c3c3c3;

    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --radius-full: 999px;

    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 24px;
    --space-6: 32px;
    --space-7: 48px;
    --space-8: 64px;

    --font-sans: -apple-system, BlinkMacSystemFont, "Inter", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;

    --duration-fast: 120ms;
    --duration-base: 200ms;
    --easing: cubic-bezier(0.2, 0, 0, 1);

    --header-height: 60px;
    --bottom-nav-height: 64px;
    --sidebar-width: 240px;
    --safe-bottom: env(safe-area-inset-bottom, 0px);
    --safe-top: env(safe-area-inset-top, 0px);
}

[data-theme="dark"] {
    --background: #0b0b0b;
    --surface: #161616;
    --surface-raised: #1c1c1c;
    --text-primary: #ffffff;
    --text-secondary: #aaaaaa;
    --text-tertiary: #7a7a7a;
    --border: #303030;
    --border-strong: #3f3f3f;
    --positive: #4ade80;
    --negative: #f87171;
    --focus-ring: #ffffff;
    --overlay: rgba(0, 0, 0, 0.6);
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);

    --chart-line: #ffffff;
    --chart-grid: #2a2a2a;
    --chart-bar-1: #ffffff;
    --chart-bar-2: #8f8f8f;
    --chart-bar-3: #4a4a4a;
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --background: #0b0b0b;
        --surface: #161616;
        --surface-raised: #1c1c1c;
        --text-primary: #ffffff;
        --text-secondary: #aaaaaa;
        --text-tertiary: #7a7a7a;
        --border: #303030;
        --border-strong: #3f3f3f;
        --positive: #4ade80;
        --negative: #f87171;
        --focus-ring: #ffffff;
        --overlay: rgba(0, 0, 0, 0.6);
        --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
        --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
        --chart-line: #ffffff;
        --chart-grid: #2a2a2a;
        --chart-bar-1: #ffffff;
        --chart-bar-2: #8f8f8f;
        --chart-bar-3: #4a4a4a;
    }
}