:root {
    --bg: #f3f5f7;
    --surface: #ffffff;
    --surface-soft: #e9edf1;
    --text: #11151a;
    --muted: #737b86;
    --muted-2: #9ba3ad;
    --line: rgba(17, 21, 26, 0.11);
    --accent: #008dd5;
    --accent-strong: #149fe8;

    --dark-bg: #090b0e;
    --dark-surface: #11151a;
    --dark-text: #f4f6f8;
    --dark-muted: #8c96a2;
    --dark-line: rgba(255, 255, 255, 0.14);

    --font-main: "Onest", sans-serif;

    --container: min(1800px, calc(100vw - 96px));
    --radius-sm: 14px;
    --radius-md: 24px;
    --radius-lg: 36px;
    --radius-xl: 44px;

    --shadow-soft: 0 20px 60px rgba(0, 0, 0, 0.08);
    --ease: cubic-bezier(.2, .75, .2, 1);
}

html[data-theme="dark"] {
    --bg: var(--dark-bg);
    --surface: var(--dark-surface);
    --surface-soft: #151a20;
    --text: var(--dark-text);
    --muted: var(--dark-muted);
    --muted-2: #65707d;
    --line: var(--dark-line);
}