/* ==========================================================================
   EconViz design tokens (redesign C1 -> C2)
   Source of truth: docs/redesign/design_handoff_econviz_c1/tokens.json
   JS-drawn colors live in EconVizTheme (js/common.js) and must be kept in
   sync with the values here when the palette flips.
   Structural: the diagram stage / narration masks / dollarColors.VOID stay
   #FFFFFF regardless of theme (see docs/redesign/asset-inventory.md).
   ========================================================================== */

/* --- Self-hosted webfonts (OFL, downloaded from Google Fonts) ------------ */

@font-face {
    font-family: 'Spectral';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('fonts/spectral-600.woff2') format('woff2');
}
@font-face {
    font-family: 'Spectral';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('fonts/spectral-700.woff2') format('woff2');
}
/* Source Sans 3 ships as a variable font: one file per style covers 400-700 */
@font-face {
    font-family: 'Source Sans 3';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('fonts/source-sans-3.woff2') format('woff2');
}
@font-face {
    font-family: 'Source Sans 3';
    font-style: italic;
    font-weight: 400 700;
    font-display: swap;
    src: url('fonts/source-sans-3-italic.woff2') format('woff2');
}

/* --- Tokens --------------------------------------------------------------- */

:root {
    /* Type */
    --font-heading: 'Spectral', Georgia, 'Times New Roman', serif;
    --font-body: 'Source Sans 3', 'Segoe UI', Arial, sans-serif;

    /* Neutrals */
    --ink: #2B2723;
    --ink-muted: #6E6558;
    --ink-secondary: #574F44;
    --line: #E4DDD1;
    --hairline: #EFE9DE;
    --panel: #F7F3EC;
    --paper: #F3EEE6;
    --stage: #FFFFFF; /* structural -- do not theme */

    /* Tints */
    --tint-green: #E7F3EC;
    --tint-amber: #FBF0DA;
    --tint-blue: #E8EEF8;

    /* Flow role colors (canonical copies of EconVizTheme.dollarColors) */
    --flow-general: #1A7A44;
    --flow-taxed: #6E3FC3;
    --flow-deficit: #BD3B26;
    --flow-saved: #9A6200;
    --flow-coreflow: #85562E;
    --flow-leakage: #2E5FA8;
    --flow-injection: #14603A;
    --flow-water: #C2E5D6;
    --flow-water-stripe: #8FCDB4;

    /* Annotation / key-idea hues (shared with EconVizTheme.annotation) */
    --annotation-fill: #FDF6DC;
    --annotation-border: #E5C878;
    --annotation-border-selected: #D08C1F;
    --annotation-step: #9A6200;
    --annotation-link: #2E5FA8;
    --annotation-highlight: #FBEFC5;

    /* Chrome */
    --btn-primary-bg: #14603A;
    --btn-primary-bg-hover: #0F4D2E;
    --btn-primary-text: #FFFFFF;
    --btn-ghost-bg: #FFFFFF;
    --btn-ghost-border: #D9D1C2;
    --btn-ghost-border-hover: #C9BFAE;
    --btn-ghost-bg-hover: #FBF8F2;
    --btn-ghost-text: #574F44;
    --input-bg: #F7F3EC;
    --audio-progress-fill: #1A7A44;
    --audio-progress-track: #EFE9DE;

    /* Radii */
    --radius-block: 3px;
    --radius-control: 8px;
    --radius-card: 10px;
    --radius-panel: 12px;

    /* Shadow.
       ENGRAVED-SPEC section D6 removes blur from the chrome entirely: "rules
       replace shadows... no blur anywhere", the one exception being the primary
       button's hard offset block, which is a letterpress impression rather than
       a shadow. --shadow-card is kept only so any stray reference still
       resolves; it should not be used by new rules. */
    --shadow-card: none;
    --shadow-card-legacy: 0 1px 3px rgba(43, 39, 35, 0.06);

    /* Plate construction (D6): 2px ink border + 3px gap + this hairline inner
       rule. The device that unifies annotation cards, panels and the
       balance-sheet visualiser. */
    --plate-rule: #CFC5B4;
    --plate-border-width: 2px;
    /* Letterpress offset for the primary button: a hard block, never a blur */
    --letterpress-offset: 2px;

    /* Motion */
    --ease-standard: cubic-bezier(0.2, 0, 0, 1);
    --ease-decelerate: cubic-bezier(0, 0, 0.2, 1);
    --duration-fast: 150ms;
    --duration-reveal: 260ms;
    --duration-move: 450ms;
    --duration-pulse: 1200ms;
}
