/**
 * Forge design tokens.
 *
 * The single styling source of truth. Static per-preset values are keyed
 * on [data-ec-preset][data-color-scheme] attributes set on the html
 * element; dynamic values (accent triplet, container width, grid density,
 * font pairing and radius overrides) are injected inline at runtime by
 * the framework's TokenCompiler and win the cascade by order.
 *
 * Token inventory (do not extend ad hoc; see docs/SPEC.md, Tokens):
 *   Color:      --ec-bg, --ec-surface, --ec-surface-2, --ec-fg, --ec-fg-2,
 *               --ec-border, --ec-accent, --ec-accent-fg, --ec-accent-soft
 *   Shape:      --ec-radius, --ec-btn-radius, --ec-img-radius, --ec-shadow
 *   Type:       --ec-font-display, --ec-font-body, --ec-disp-weight,
 *               --ec-disp-style, --ec-disp-tracking, --ec-disp-transform
 *   Layout:     --ec-cw, --ec-gut, --ec-sect-y, --ec-grid, --ec-grid-gap
 *   Motion:     --ec-dur-1, --ec-dur-2, --ec-dur-3, --ec-ease
 */

:root {
    /* Defaults: Editorial light. Presets below override. */
    --ec-bg: #ffffff;
    --ec-surface: #ffffff;
    --ec-surface-2: #f5f5f5;
    --ec-fg: #0a0a0a;
    --ec-fg-2: #525252;
    --ec-border: #e5e5e5;
    --ec-accent: #0a0a0a;
    --ec-accent-fg: #ffffff;
    --ec-accent-soft: rgba(10, 10, 10, 0.12);

    --ec-radius: 0px;
    --ec-btn-radius: 0px;
    --ec-img-radius: 0px;
    --ec-shadow: none;

    --ec-font-display: 'Newsreader', Georgia, 'Times New Roman', serif;
    --ec-font-body: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --ec-disp-weight: 500;
    --ec-disp-style: normal;
    --ec-disp-tracking: -0.01em;
    --ec-disp-transform: none;

    --ec-cw: 1280px;
    --ec-gut: 1.5rem;
    --ec-sect-y: 4rem;
    --ec-grid: 3;
    --ec-grid-gap: 1.5rem;

    --ec-dur-1: 150ms;
    --ec-dur-2: 250ms;
    --ec-dur-3: 400ms;
    --ec-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* Editorial: luxury monochrome */
[data-ec-preset="editorial"][data-color-scheme="dark"] {
    --ec-bg: #0a0a0a;
    --ec-surface: #111111;
    --ec-surface-2: #1a1a1a;
    --ec-fg: #fafafa;
    --ec-fg-2: #a3a3a3;
    --ec-border: #262626;
    --ec-accent: #fafafa;
    --ec-accent-fg: #0f0f0f;
    --ec-accent-soft: rgba(250, 250, 250, 0.12);
}

/* Studio: clean SaaS neutral */
[data-ec-preset="studio"] {
    --ec-bg: #ffffff;
    --ec-surface: #ffffff;
    --ec-surface-2: #f8fafc;
    --ec-fg: #0f172a;
    --ec-fg-2: #64748b;
    --ec-border: #e2e8f0;
    --ec-accent: #6366f1;
    --ec-accent-fg: #ffffff;
    --ec-accent-soft: rgba(99, 102, 241, 0.12);

    --ec-radius: 12px;
    --ec-btn-radius: 12px;
    --ec-img-radius: 12px;
    --ec-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);

    --ec-font-display: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --ec-font-body: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --ec-disp-weight: 700;
    --ec-disp-tracking: -0.02em;
}

[data-ec-preset="studio"][data-color-scheme="dark"] {
    --ec-bg: #0b1120;
    --ec-surface: #0f172a;
    --ec-surface-2: #1e293b;
    --ec-fg: #f1f5f9;
    --ec-fg-2: #94a3b8;
    --ec-border: #1e293b;
    --ec-accent: #818cf8;
    --ec-accent-fg: #0f0f0f;
    --ec-accent-soft: rgba(129, 140, 248, 0.12);
    --ec-shadow: none;
}

/* Motion is opt-out at the token layer */
@media (prefers-reduced-motion: reduce) {
    :root {
        --ec-dur-1: 0ms;
        --ec-dur-2: 0ms;
        --ec-dur-3: 0ms;
    }
}