/* Pharos design tokens — single source of truth for brand values.
   Raw palette tokens never change; semantic tokens flip between light and
   dark (dark follows the app convention: prefers-color-scheme unless the
   page pins [data-theme="light"], plus an explicit [data-theme="dark"]).
   Keep the two dark blocks identical. Canonical values: brand.tokens.json. */

@font-face {
  font-family: "Inter Variable";
  src: url("/vendor/fonts/inter-latin-wght-normal.woff2") format("woff2-variations");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Raw palette */
  --pharos-charcoal: #08090C;
  --pharos-charcoal-soft: #111318;
  --pharos-ivory: #F7F7F4;
  --pharos-white: #FFFFFF;
  --pharos-amber: #F5B83D;
  --pharos-amber-bright: #FFC44D;
  --pharos-amber-dark: #9A6818;
  --pharos-gray: #A9ADB5;
  --pharos-sage: #7E9484;

  /* Typography */
  --pharos-font: "Inter Variable", Inter, ui-sans-serif, system-ui,
    -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --pharos-tracking-caps: 0.14em;   /* eyebrows / small caps labels */
  --pharos-tracking-wordmark: 0.32em; /* matches the drawn PHAROS wordmark */

  /* Shape and elevation */
  --pharos-radius-sm: 6px;
  --pharos-radius-md: 10px;
  --pharos-radius-lg: 16px;
  --pharos-radius-pill: 999px;
  --pharos-shadow-1: 0 1px 3px rgba(4, 5, 8, 0.14);
  --pharos-shadow-2: 0 8px 28px rgba(4, 5, 8, 0.30);

  /* Semantic — light (ivory) surfaces */
  --pharos-bg: var(--pharos-ivory);
  --pharos-surface: var(--pharos-white);
  --pharos-text: #14161B;
  --pharos-text-2: #4A4F58;
  --pharos-muted: #5F646D;
  --pharos-line: #E3E2DA;
  --pharos-border: rgba(20, 22, 27, 0.10);
  /* Amber is the lighthouse light: CTAs, links, focus. Bright amber fails
     contrast on light surfaces, so light mode uses amber-dark (~5:1). */
  --pharos-accent: var(--pharos-amber-dark);
  --pharos-accent-ink: var(--pharos-white);
  --pharos-focus: var(--pharos-amber-dark);
  /* Callouts: sage = grounding/context note, amber = caveat/warning,
     crisis red is reserved for crisis support and errors only. */
  --pharos-note-bg: #EDF2EE;
  --pharos-note-edge: var(--pharos-sage);
  --pharos-note-ink: #33473B;
  --pharos-warn-bg: #FBF3E2;
  --pharos-warn-edge: #D6A53D;
  --pharos-warn-ink: #6A4A10;
  --pharos-crisis: #8A1C24;
  --pharos-crisis-bg: #FBECED;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --pharos-bg: var(--pharos-charcoal);
    --pharos-surface: var(--pharos-charcoal-soft);
    --pharos-text: var(--pharos-ivory);
    --pharos-text-2: #C7CAD1;
    --pharos-muted: var(--pharos-gray);
    --pharos-line: #23262D;
    --pharos-border: rgba(247, 247, 244, 0.10);
    --pharos-accent: var(--pharos-amber);
    --pharos-accent-ink: var(--pharos-charcoal);
    --pharos-focus: var(--pharos-amber);
    --pharos-note-bg: #141B16;
    --pharos-note-edge: var(--pharos-sage);
    --pharos-note-ink: #B9C9BE;
    --pharos-warn-bg: #1D1708;
    --pharos-warn-edge: var(--pharos-amber-dark);
    --pharos-warn-ink: #E8C87A;
    --pharos-crisis: #F2B8BC;
    --pharos-crisis-bg: #2E1518;
  }
}

:root[data-theme="dark"] {
  --pharos-bg: var(--pharos-charcoal);
  --pharos-surface: var(--pharos-charcoal-soft);
  --pharos-text: var(--pharos-ivory);
  --pharos-text-2: #C7CAD1;
  --pharos-muted: var(--pharos-gray);
  --pharos-line: #23262D;
  --pharos-border: rgba(247, 247, 244, 0.10);
  --pharos-accent: var(--pharos-amber);
  --pharos-accent-ink: var(--pharos-charcoal);
  --pharos-focus: var(--pharos-amber);
  --pharos-note-bg: #141B16;
  --pharos-note-edge: var(--pharos-sage);
  --pharos-note-ink: #B9C9BE;
  --pharos-warn-bg: #1D1708;
  --pharos-warn-edge: var(--pharos-amber-dark);
  --pharos-warn-ink: #E8C87A;
  --pharos-crisis: #F2B8BC;
  --pharos-crisis-bg: #2E1518;
}