:root {
    --font-main: var(--font-ui);
    --font-headers: var(--font-ui);

    --scale-small: 0.875rem;
    --scale-sm:    var(--text-xs);
    --scale-base:  1rem;
    --scale-md:    1.125rem;
    --scale-sub:   var(--text-xl);
    --scale-h5:    var(--text-xl);
    --scale-h4:    var(--text-2xl);
    --scale-h3:    2rem;
    --scale-h2:    2.5rem;
    --scale-h1:    var(--text-5xl);

    --space-xs:  var(--s-1);
    --space-sm:  var(--s-2);
    --space-md:  var(--s-4);
    --space-lg:  var(--s-6);
    --space-xl:  var(--s-7);
    --space-xxl: var(--s-9);

    --radius-sm:   var(--r-sm);
    --radius-md:   var(--r-md);
    --radius-lg:   var(--r-lg);
    --radius-xl:   var(--r-2xl);
    --radius-full: var(--r-full);

    --color-text:        var(--ink);
    --color-text-light:  var(--ink-muted);
    --color-headings:    var(--ink-strong);
    --color-dark:        var(--ink);
    --color-dark-offset: light-dark(var(--n-700), var(--n-300));

    --color-light:        var(--surface);
    --color-light-offset: var(--canvas);
    --on-accent:          var(--primary-ink);

    --color-primary:       var(--primary);
    --color-primary-light: light-dark(var(--azure-400), var(--azure-300));
    --color-primary-dark:  var(--primary-hover);

    --color-link: light-dark(var(--azure-700), var(--azure-300));

    --band-fill: linear-gradient(135deg, var(--azure-600), var(--azure-800));
    --on-band: oklch(98% 0.01 248);
    --on-band-muted: oklch(100% 0 0 / 0.9);
    --band-line: oklch(100% 0 0 / 0.22);
    --band-surface: oklch(100% 0 0 / 0.08);
    --band-button: oklch(99% 0.005 248);
    --band-button-ink: var(--azure-700);

    --color-complementary:       var(--signal);
    --color-complementary-light: light-dark(var(--signal-500), var(--signal-400));
    --color-complementary-dark:  light-dark(var(--signal-700), var(--signal-600));

    --grad-azure: light-dark(oklch(55% 0.186 248), oklch(76% 0.150 248));
    --grad-red:   light-dark(oklch(57% 0.190 26),  oklch(74% 0.165 26));

    --color-line:        var(--line);
    --color-line-soft:   var(--line-soft);
    --color-line-strong: var(--line-strong);

    --color-success:       var(--success);
    --color-success-light: var(--success-soft);
    --color-warning:       var(--warning);
    --color-danger:        var(--danger);
    --color-danger-light:  var(--danger-soft);
    --color-info:          var(--primary);

    --shadow:        var(--shadow-md);
    --shadow-hover:  var(--shadow-lg);
    --shadow-xl:     var(--shadow-pop);
    --shadow-active: var(--shadow-sm);

    --shadow-primary:       0 4px 12px light-dark(oklch(55% 0.186 248 / 0.20), oklch(71% 0.148 248 / 0.26));
    --shadow-primary-hover: 0 6px 16px light-dark(oklch(55% 0.186 248 / 0.30), oklch(71% 0.148 248 / 0.36));
    --focus-ring: 0 0 0 3px var(--primary-ring);

    --header-height: 64px;
    --footer-height: 300px;

    --transition-duration: var(--dur-2);
    --transition-easing: var(--ease);
    --hover-move-x: 1px;
    --hover-move-y: -2px;
}