/* ============================================================================
   tokens.css, THE design-token source of truth (UI direction, 2026-07-05)
   ----------------------------------------------------------------------------
   Replaces the three competing colour passes (MASTER.md's retired teal spec,
   per-page Tailwind configs, ad-hoc overrides). Locked decisions:
     - Brand green #19b366 is the ONE accent; teal #2dd4bf supports.
     - Type: Cinzel (headings/hero ONLY: inscriptional caps, unreadable as
       body), Josefin Sans (body + labels), monospace for aligned numbers
       (neither brand face ships tabular-nums).
     - Neutrals are green-biased so they read as chosen, not defaulted.
     - Semantic good/warn/crit stay separate from the accent.
     - One motion budget: 150-250ms ease for state; 400-600ms reserved for
       the one or two signature moments. Honour prefers-reduced-motion.
   Dark mode = one variable flip on .dark, no !important.
   Visual brief: https://claude.ai/code/artifact/beb26307-47a4-4ace-85d3-0eeba3ecb972
   ========================================================================== */

/* ---- Self-hosted brand face (variable weights; no font CDN at runtime) --
   2026-07-05: Cinzel/Josefin reverted on the human's call. 2026-07-18: Lexend
   approved. 2026-07-28: Lexend rejected by the owner; Plus Jakarta Sans is the
   product face now (upright + italic, the wordmark uses italic). Inter stays
   self-hosted as the fallback. */
@font-face {
    font-family: 'Plus Jakarta Sans';
    src: url('/public/fonts/plusjakarta-var.woff2') format('woff2');
    font-weight: 200 800;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Plus Jakarta Sans';
    src: url('/public/fonts/plusjakarta-italic-var.woff2') format('woff2');
    font-weight: 200 800;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Inter';
    src: url('/public/fonts/inter-var.woff2') format('woff2');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

:root {
    /* Accent (the one green) + support */
    --rc-accent: #19b366;          /* brand fill */
    --rc-accent-strong: #12a166;   /* readable on light ground */
    --rc-accent-hover: #1bb268;
    --rc-accent-active: #149054;
    --rc-accent-text: #0c7a43;     /* AA text on light surfaces */
    --rc-accent-support: #2dd4bf;  /* teal, support only */
    --rc-accent-tint-15: rgba(25, 179, 102, 0.15);
    --rc-accent-tint-25: rgba(25, 179, 102, 0.25);

    /* Green-biased neutrals */
    --rc-fg-base: #101815;
    --rc-fg-subtle: #55635c;
    --rc-fg-faint: #8a998f;
    --rc-bg-base: #f7f9f8;
    --rc-bg-raised: #ffffff;
    --rc-bg-sunken: #eef3f0;
    --rc-line: rgba(16, 40, 30, 0.12);
    --rc-line-strong: rgba(16, 40, 30, 0.22);

    /* Semantic states (never overloaded onto the accent) */
    --rc-good: #12a166;
    --rc-warn: #b7791f;
    --rc-crit: #c0362c;

    --rc-shadow: 0 1px 2px rgba(16, 40, 30, 0.05), 0 8px 30px -12px rgba(16, 40, 30, 0.18);

    /* Type (Plus Jakarta Sans product-wide; display = heavier weight, not a serif) */
    --rc-font-display: 'Plus Jakarta Sans', 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    --rc-font-body: 'Plus Jakarta Sans', 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    --rc-font-mono: ui-monospace, 'SF Mono', 'JetBrains Mono', 'Cascadia Code', Menlo, Consolas, monospace;

    /* Space scale (4/8/16/24/32/48) */
    --rc-space-xs: 4px;
    --rc-space-sm: 8px;
    --rc-space-md: 16px;
    --rc-space-lg: 24px;
    --rc-space-xl: 32px;
    --rc-space-2xl: 48px;

    /* Radius */
    --rc-radius-sm: 8px;
    --rc-radius-md: 12px;
    --rc-radius-lg: 16px;
    --rc-radius-full: 9999px;

    /* Motion budget */
    --rc-motion-fast: 150ms;
    --rc-motion-base: 200ms;
    --rc-motion-slow: 250ms;
    --rc-motion-signature: 500ms; /* panel slide, Phil thinking, nothing else */
    --rc-ease: cubic-bezier(0.2, 0, 0, 1);
}

.dark {
    --rc-fg-base: #e8efeb;
    --rc-fg-subtle: #93a49b;
    --rc-fg-faint: #64736b;
    --rc-bg-base: #0a0e0c;
    --rc-bg-raised: #121815;
    --rc-bg-sunken: #1a221e;
    --rc-line: rgba(255, 255, 255, 0.10);
    --rc-line-strong: rgba(255, 255, 255, 0.20);
    --rc-accent-strong: #34d492;
    --rc-accent-text: #2fc57f;
    --rc-good: #34d492;
    --rc-warn: #e0a94a;
    --rc-crit: #ef6a5f;
    --rc-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 18px 40px -18px rgba(0, 0, 0, 0.7);
}

/* ---- Base application ---------------------------------------------------- */
body {
    font-family: var(--rc-font-body);
}

/* Aligned figures: prices, yields, dates. */
.rc-num {
    font-family: var(--rc-font-mono);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important; /* a11y: the single sanctioned !important */
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}