/* God Stories colour and type tokens.
   Copied from design/letters_retro_tokens.css. The variable names come from an
   earlier theme (for example --wonz-blue is the teal), but the values are final. */
:root {
  --wonz-blue:  #2F6F6A;  /* teal: the signature colour */
  --wonz-white: #FBF8F2;  /* cream paper */
  --wonz-ink:   #1F1B18;  /* sepia black */
  --wonz-gold:  #A8431A;  /* rust accent */

  --blue-950: #102624;
  --blue-900: #163532;
  --blue-800: #1d4541;
  --blue-700: #275c58;
  --blue-600: #2F6F6A;
  --blue-500: #4a8883;
  --blue-400: #6fa39e;
  --blue-300: #9cc0bc;
  --blue-200: #c7dcd9;
  --blue-100: #e3eeec;
  --blue-50:  #f1f6f5;

  --gold-700: #b8862a;
  --gold-600: #D9A33A;  /* mustard */
  --gold-500: #A8431A;
  --gold-400: #f7d23f;
  --gold-300: #fcde6e;
  --gold-200: #fdee9e;
  --gold-100: #f8eed5;

  --ink-950: #1F1B18;
  --ink-900: #27221e;
  --ink-800: #302a25;
  --ink-700: #3e3630;
  --ink-600: #584f44;
  --ink-500: #756b5d;
  --ink-400: #9a8f7f;
  --ink-300: #c4b9a6;
  --ink-200: #ddd4c4;
  --ink-100: #ece5d8;
  --ink-50:  #f4efe5;
  --paper:   #FBF8F2;

  --fg-1: var(--ink-950);
  --fg-2: var(--ink-600);
  --fg-3: var(--ink-400);
  --fg-on-blue: var(--wonz-white);
  --fg-on-ink: var(--wonz-white);

  --bg-1: var(--paper);
  --bg-2: var(--ink-50);
  --bg-blue: var(--wonz-blue);
  --bg-ink: var(--ink-950);

  --accent: var(--wonz-blue);
  --accent-hover: var(--blue-700);
  --highlight: var(--wonz-gold);
  --link: var(--wonz-blue);
  --border: var(--ink-200);
  --border-strong: var(--ink-300);

  --success: #2f8f5b;
  --warning: var(--gold-600);
  --danger:  #A8431A;

  --font-display: 'Fraunces', Georgia, serif;
  --font-sans: 'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'Courier Prime', 'Courier New', monospace;
  --font-script: 'Caveat', cursive;

  --track-display: -0.01em;

  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
  --radius-pill: 999px;

  --shadow-sm: 0 1px 2px rgba(10,10,10,.06), 0 1px 3px rgba(10,10,10,.08);
  --shadow-md: 0 4px 12px rgba(31,27,24,.10), 0 2px 4px rgba(31,27,24,.06);
  --shadow-lg: 0 18px 40px rgba(31,27,24,.16);
  --shadow-blue: 0 14px 30px rgba(47,111,106,.28);

  --container: 1200px;

  --airmail: repeating-linear-gradient(135deg, #A8431A 0 14px, #FBF8F2 14px 22px, #2F6F6A 22px 36px, #FBF8F2 36px 44px);
}