:root {
    /* ── Brand ── */
    --color-primary: #1A4F6E; /* #292075; /* deep indigo */
    --color-primary-light: #3d2f9e; /* hover / active shade */
    --color-accent: #F4BB44; /* golden yellow */
    --color-accent-dim: #c9962a; /* darker accent for text on light */
    /* ── Surface ── */
    --color-bg: #ffffff;
    --color-surface: #f4f3fb; /* primary-tinted neutral */
    --color-surface-raised: #eceaf6; /* cards, inputs */
    --color-border: #d0cde8; /* primary-tinted border */
    /* ── Text ── */
    --color-text: #1a1640; /* near-black, primary-hue */
    --color-text-muted: #5e5a80; /* secondary text */
    --color-text-on-primary: #ffffff;
    --color-text-on-accent: #1a1100; /* readable dark on gold */
    /* ── Feedback ── */
    --color-error: #ba1a1a;
    --color-success: #1a6e3b;
    /* ── Form Tokens ── */
    --input-bg: var(--color-bg);
    --input-border: var(--color-border);
    --input-border-focus: var(--color-primary);
    --input-shadow-focus: 0 0 0 3px rgba(41, 32, 117, 0.18);
    --input-radius: 0.5rem;
    --input-padding: 0.625rem 0.875rem;
    --btn-radius: 0.5rem;
    --btn-primary-bg: var(--color-primary);
    --btn-primary-text: var(--color-text-on-primary);
    --btn-primary-hover-bg: var(--color-primary-light);
    --btn-accent-bg: var(--color-accent);
    --btn-accent-text: var(--color-text-on-accent);
    --btn-accent-hover-bg: #e0ab34;
}

/* Global defaults */
html {
    scroll-behavior: smooth;
}

body {
    background-color: var(--background);
    color: var(--on-background);
    font-family: var(--font-body);
    font-size: var(--text-body-md);
    line-height: var(--text-body-md-line);
    font-weight: var(--text-body-md-weight);
    min-height: max(884px, 100dvh);
}

/* Text Selection */
::selection {
    background-color: var(--primary-fixed);
    color: var(--on-primary-fixed);
}