/* =============================================================================
 * Blueprint — CoryAI design tokens (v0.1, light mode)
 *
 * The single source of color, type, radius, spacing and elevation for both
 * blueprint/app and blueprint/brochure. Components never hard-code a hex value;
 * a future dark theme redefines these tokens and nothing else.
 *
 * Color follows 60-30-10:
 *   60% dominant  — warm drafting paper (--paper / --surface)
 *   30% secondary — deep navy (text, dark bands, device frames)
 *   10% accent    — electric blue, reserved for actions: CTAs, the mic, links,
 *                   the active tab. If it isn't tappable, it usually isn't blue.
 * Green means confirm/saved only. Wood is a warm brand accent (eyebrows,
 * illustrations), never a UI state.
 *
 * Every text pairing here meets WCAG AA (4.5:1) on paper, paper-2 and surface;
 * measured when these values were set (Blueprint v0.1).
 * ============================================================================= */

/* Self-hosted fonts (latin subset, variable woff2 from Google Fonts, OFL).
 * No third-party request, and they load offline. */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 500 600;
  font-display: swap;
  src: url('fonts/fraunces-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/fraunces-italic-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('fonts/inter-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* Surfaces */
  --paper:      #F7F4EE;   /* app + page background (warm drafting paper) */
  --paper-2:    #EFE9DF;   /* recessed areas, skeletons */
  --surface:    #FFFFFF;   /* cards, sheets */
  --surface-2:  #FBF9F5;   /* nested card rows */

  /* Ink */
  --ink:        #0B1B34;   /* primary text, navy */
  --ink-2:      #45536B;   /* secondary text */
  --ink-3:      #5F6A7D;   /* tertiary / captions (AA on paper-2) */
  --ink-inv:    #FFFFFF;

  /* Lines */
  --line:       #E6E0D5;
  --line-2:     #D6CEC0;
  --grid:       rgba(30, 91, 255, 0.07); /* blueprint grid lines */

  /* Brand */
  --blue:       #1E5BFF;   /* Cory / voice / primary action */
  --blue-600:   #1646CC;
  --blue-50:    #EBF0FF;
  --blue-100:   #D5E0FF;
  --navy:       #0B1B34;
  --navy-2:     #15305A;
  --wood:       #B7814A;
  --wood-50:    #F4EADC;
  --wood-ink:   #87572A;   /* wood as text — AA on paper + wood-50 */

  /* Semantic — each with a soft tint for backgrounds */
  --go:         #0B6E4C;   /* confirm / saved */
  --go-600:     #08573C;
  --go-50:      #E3F3EB;
  --warn:       #8A5300;
  --warn-50:    #FCF0DA;
  --stop:       #B93A22;
  --stop-50:    #FAE8E3;

  /* Roles (60-30-10) */
  --c-dominant:  var(--paper);
  --c-secondary: var(--navy);
  --c-accent:    var(--blue);
  --link:        var(--blue-600);

  /* Keyboard focus — double ring reads on any background */
  --focus-ring: 0 0 0 2px var(--surface), 0 0 0 4.5px var(--blue);

  /* Type — rem so text scales with the user's browser setting */
  --font-display: 'Fraunces', 'Georgia', serif;
  --font-ui:      'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --fs-xs:   0.75rem;
  --fs-sm:   0.8125rem;
  --fs-md:   0.9375rem;
  --fs-lg:   1.0625rem;
  --fs-xl:   1.375rem;
  --fs-2xl:  1.75rem;
  --fs-3xl:  2.25rem;

  /* Radius */
  --r-xs:  8px;
  --r-sm:  12px;
  --r-md:  16px;
  --r-lg:  22px;
  --r-xl:  30px;
  --r-pill: 999px;

  /* Spacing (4px base) */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px;
  --s-5: 20px; --s-6: 24px; --s-8: 32px; --s-10: 40px; --s-12: 48px;

  /* Elevation — navy-tinted, never pure black */
  --shadow-1: 0 1px 2px rgba(11, 27, 52, 0.05), 0 1px 1px rgba(11, 27, 52, 0.03);
  --shadow-2: 0 8px 24px -10px rgba(11, 27, 52, 0.18), 0 2px 6px -2px rgba(11, 27, 52, 0.06);
  --shadow-3: 0 24px 60px -20px rgba(11, 27, 52, 0.35), 0 8px 20px -8px rgba(11, 27, 52, 0.12);
  --shadow-orb: 0 12px 28px -6px rgba(30, 91, 255, 0.55), 0 2px 6px rgba(30, 91, 255, 0.35);

  /* Motion */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --t-fast: 140ms;
  --t-med:  260ms;

  /* Touch */
  --tap: 44px;
}

/* Author display rules must never beat the hidden attribute */
[hidden] { display: none !important; }
