:root {
    /* ── Brand (overridden per theme) ── */
    --c-primary:          #0877e8;
    --c-primary-rgb:      8, 119, 232;
    --c-primary-hover:    #0262cc;
    --c-primary-light:    #e8f1ff;
    --c-primary-soft:     rgba(var(--c-primary-rgb), 0.10);
    --c-primary-contrast: #ffffff;
    --c-accent:           #16c7d7;
    --c-accent-rgb:       22, 199, 215;
    --c-dark:             #0b1f3a;
    --c-dark-rgb:         11, 31, 58;

    /* ── Neutrals ── */
    --c-surface:          #ffffff;
    --c-surface-raised:   #ffffff;
    --c-surface-glass:    rgba(255, 255, 255, 0.78);
    --c-bg:               #f6f8fb;
    --c-page-bg:          #f6f8fb;
    --c-bg-2:             #eef3f8;
    --c-border:           #e2e8f0;
    --c-border-soft:      rgba(148, 163, 184, 0.22);
    --c-border-strong:    #cbd5e1;

    /* ── Text ── */
    --c-text:             #132033;
    --c-text-muted:       #64748b;
    --c-text-light:       #94a3b8;
    --c-text-inverse:     #ffffff;

    /* ── Semantic ── */
    --c-success:          #16a34a;
    --c-success-rgb:      22, 163, 74;
    --c-success-text:     #0f7a3a;
    --c-success-light:    #dcfce7;
    --c-warning:          #f59e0b;
    --c-warning-rgb:      245, 158, 11;
    --c-warning-text:     #9a5b00;
    --c-warning-light:    #fef3c7;
    --c-error:            #e5484d;
    --c-error-rgb:        229, 72, 77;
    --c-error-text:       #b4232a;
    --c-error-light:      #fee2e2;
    --c-info:             #3b82f6;
    --c-info-light:       #dbeafe;

    /* ── Spacing ── */
    --sp-1:   4px;
    --sp-2:   8px;
    --sp-3:   12px;
    --sp-4:   16px;
    --sp-5:   20px;
    --sp-6:   24px;
    --sp-8:   32px;
    --sp-10:  40px;
    --sp-12:  48px;
    --sp-16:  64px;

    /* ── Radius ── */
    --r-xs:   4px;
    --r-sm:   8px;
    --r-md:   12px;
    --r-lg:   20px;
    --r-xl:   28px;
    --r-full: 9999px;

    /* ── Shadows ── */
    --sh-xs:  0 1px 2px rgba(15, 23, 42, .04);
    --sh-sm:  0 1px 3px rgba(15, 23, 42, .07), 0 1px 2px rgba(15, 23, 42, .04);
    --sh-md:  0 8px 28px rgba(15, 23, 42, .08), 0 2px 4px rgba(15, 23, 42, .04);
    --sh-lg:  0 18px 55px rgba(15, 23, 42, .12), 0 4px 12px rgba(15, 23, 42, .05);
    --sh-glass: 0 18px 55px rgba(15, 23, 42, .14);
    --sh-brand: 0 12px 30px rgba(var(--c-primary-rgb), .24);

    /* ── Typography ── */
    --font:         'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    --text-xs:      0.75rem;    /* 12px */
    --text-sm:      0.875rem;   /* 14px */
    --text-base:    1rem;       /* 16px */
    --text-lg:      1.125rem;   /* 18px */
    --text-xl:      1.25rem;    /* 20px */
    --text-2xl:     1.5rem;     /* 24px */
    --text-3xl:     1.875rem;   /* 30px */
    --text-4xl:     2.25rem;    /* 36px */
    --fw-normal:    400;
    --fw-medium:    500;
    --fw-semi:      600;
    --fw-bold:      700;
    --lh-tight:     1.25;
    --lh-snug:      1.375;
    --lh-base:      1.5;
    --lh-relaxed:   1.7;

    /* ── Layout ── */
    --nav-top-h:      64px;
    --nav-bottom-h:   64px;
    --content-max:    1200px;
    --content-pad-x:  var(--sp-4);
    --content-pad-y:  var(--sp-6);

    /* Premium surfaces */
    --glass-bg:        rgba(255, 255, 255, 0.76);
    --glass-bg-strong: rgba(255, 255, 255, 0.90);
    --glass-border:    rgba(148, 163, 184, 0.22);
    --glass-blur:      18px;
    --focus-ring:      0 0 0 3px rgba(var(--c-primary-rgb), 0.14);

    /* Navigation */
    --nav-bg:          rgba(255, 255, 255, 0.82);
    --nav-border:      rgba(148, 163, 184, 0.18);
    --nav-shadow:      0 10px 30px rgba(15, 23, 42, 0.07);
    --nav-link-bg:     rgba(var(--c-primary-rgb), 0.09);

    /* Footer */
    --footer-bg:       #f3f6fa;
    --footer-bg-2:     #f8fafc;
    --footer-border:   rgba(15, 23, 42, 0.08);
    --footer-title:    #64748b;
    --footer-text:     #475569;
    --footer-muted:    #64748b;
    --footer-link:     #334155;
    --footer-link-hover: var(--c-primary);

    /* ── Motion ── */
    --ease:         cubic-bezier(0.4, 0, 0.2, 1);
    --t-fast:       0.12s;
    --t-base:       0.2s;
    --t-slow:       0.35s;

    /* ── Z-index ── */
    --z-base:    1;
    --z-sticky:  10;
    --z-nav:     100;
    --z-overlay: 150;
    --z-modal:   200;
    --z-toast:   300;
}

/* ── Dark mode (future) ── */
@media (prefers-color-scheme: dark) {
    :root {
        /* placeholder — implement when needed */
    }
}