:root {
    --font-sans: Inter, "Avenir Next", "Segoe UI", sans-serif;
    --site-bg: #0b0f14;
    --body-background:
        radial-gradient(circle at 50% -24rem, rgba(78, 104, 137, .16), transparent 50rem),
        #0b0f14;
    --header-background: rgba(0, 0, 0, .5);
    --header-border: #000;
    --footer-background: rgba(0, 0, 0, .28);
    --menu-background: #111820;
    --surface-1: #0f1620;
    --surface-2: #121b26;
    --surface-3: #172233;
    --border: rgba(255, 255, 255, .1);
    --border-strong: rgba(255, 255, 255, .24);
    --divider: rgba(255, 255, 255, .08);
    --text-strong: #fff;
    --text-primary: rgba(255, 255, 255, .76);
    --text-secondary: rgba(255, 255, 255, .68);
    --text-muted: rgba(255, 255, 255, .48);
    --heading: #bfbfbf;
    --brand-text: #f4f4f4;
    --accent: #f40337;
    --accent-soft: rgba(244, 3, 55, .62);
    --accent-text: #ff526f;
    --control-radius: 12px;
    --thumb-radius: 10px;
    --content-width: 1440px;
    --shadow-small: 0 6px 18px rgba(0, 0, 0, .35);
    --shadow-large: 0 10px 30px rgba(0, 0, 0, .45);
}