/* Design tokens: Vestland palette, type, motion. Dark mode = dusk over the fjord. */

@property --heat { syntax: '<number>'; inherits: true; initial-value: 0; }
@property --strain { syntax: '<number>'; inherits: true; initial-value: 0; }
@property --power { syntax: '<number>'; inherits: true; initial-value: 0; }

:root {
    --fjord-900: #0b2a36;
    --fjord-700: #134556;
    --fjord-500: #1f6f86;
    --fjord-300: #7fb9c9;
    --glacier: #f3f8f8;
    --moss: #4f7d55;
    --birch: #ece6d8;
    --stove-red: #a83a2c;

    --zone-good: #2f8a57;
    --zone-mid: #c8901c;
    --zone-high: #c4482f;

    --cat-bustad: #1f6f86;
    --cat-mat: #6c9a3f;
    --cat-transport: #d0812e;
    --cat-fritid: #8a5aa8;

    --bg: #f5f2ea;
    --surface: #fffdf8;
    --surface-2: #ece7db;
    --text: #13242c;
    --text-muted: #51636b;
    --line: #d9d2c2;
    --accent: var(--fjord-500);
    --accent-ink: #ffffff;
    --focus: #f0a43a;

    --font-sans: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --font-display: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;

    --radius-s: 10px;
    --radius-m: 16px;
    --radius-l: 24px;
    --shadow-1: 0 1px 2px rgb(19 36 44 / .06), 0 4px 14px rgb(19 36 44 / .06);
    --shadow-2: 0 10px 40px rgb(19 36 44 / .16);

    --ease-out: cubic-bezier(.2, .8, .2, 1);
    --ease-in-out: cubic-bezier(.65, 0, .35, 1);
    --ease-spring: linear(0, .009, .035 2.1%, .141 4.4%, .723 12.9%, .938 16.7%, 1.017 19.4%, 1.067, 1.099 24.3%, 1.103 26.3%, 1.096 28.6%, 1.035 37.1%, 1.008 42.1%, .995 47.9%, .999 70.4%, 1);
    --dur-fast: 180ms;
    --dur-med: 420ms;
    --dur-slow: 1400ms;

    color-scheme: light;
}

@supports not (transition-timing-function: linear(0, 1)) {
    :root { --ease-spring: cubic-bezier(.34, 1.4, .64, 1); }
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        color-scheme: dark;
        --bg: #0c1a21;
        --surface: #12242d;
        --surface-2: #1a3039;
        --text: #e8efef;
        --text-muted: #9fb3ba;
        --line: #26414c;
        --accent: #4fb3cc;
        --accent-ink: #062029;
        --shadow-1: 0 1px 2px rgb(0 0 0 / .3), 0 4px 14px rgb(0 0 0 / .25);
        --shadow-2: 0 10px 40px rgb(0 0 0 / .45);
        --zone-good: #4cc083;
        --zone-mid: #e3b043;
        --zone-high: #ee6a4f;
        --cat-bustad: #4fb3cc;
        --cat-mat: #93c25e;
        --cat-transport: #eda05a;
        --cat-fritid: #b98ad6;
    }
}

:root[data-theme="dark"] {
    color-scheme: dark;
    --bg: #0c1a21;
    --surface: #12242d;
    --surface-2: #1a3039;
    --text: #e8efef;
    --text-muted: #9fb3ba;
    --line: #26414c;
    --accent: #4fb3cc;
    --accent-ink: #062029;
    --shadow-1: 0 1px 2px rgb(0 0 0 / .3), 0 4px 14px rgb(0 0 0 / .25);
    --shadow-2: 0 10px 40px rgb(0 0 0 / .45);
    --zone-good: #4cc083;
    --zone-mid: #e3b043;
    --zone-high: #ee6a4f;
    --cat-bustad: #4fb3cc;
    --cat-mat: #93c25e;
    --cat-transport: #eda05a;
    --cat-fritid: #b98ad6;
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --dur-fast: 1ms;
        --dur-med: 1ms;
        --dur-slow: 1ms;
    }
}