/* ==========================================================================
   Celestial Rings - design tokens
   --------------------------------------------------------------------------
   Every brand decision lives here: the game's own violet night, antique
   gold, verdigris and parchment, and its engraved-line look. Change these
   and the whole site follows. The values match Celestial in the game's
   GameAssets.cs and NIGHT in Tools/art/sprites.js.
   ========================================================================== */

/* Typefaces (self-hosted, SIL Open Font License; see assets/fonts) ----------
   Cormorant SC for names and big moments, Alegreya Sans for everything you
   read, as in the game. Neither licence reserves a font name, so both are cut
   down to the characters English needs. */
@font-face {
  font-family: "Cormorant SC";
  src: url("../fonts/cormorant-sc-semibold.woff2") format("woff2");
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Alegreya Sans";
  src: url("../fonts/alegreya-sans-medium.woff2") format("woff2");
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "Alegreya Sans";
  src: url("../fonts/alegreya-sans-bold.woff2") format("woff2");
  font-weight: 700;
  font-display: swap;
}

:root {
  color-scheme: dark;

  /* Colour: the game's palette */
  --color-ink: #0b0724;             /* the night's edge, footer */
  --color-night: #1a1145;           /* page */
  --color-night-hi: #30226b;        /* the night's centre */
  --color-card: rgb(28 19 66 / 0.85);
  --color-card-solid: #1c1342;
  --color-gold: #e9c678;            /* rules, numerals, accents */
  --color-gold-hi: #fff0c4;         /* headings, buttons */
  --color-gold-dim: #8d7a4d;
  --color-teal: #62cdb9;            /* Luna, links on dark */
  --color-teal-hi: #c8f5ea;
  --color-red: #ff5d4d;             /* danger only */
  --color-parchment: #f4ecd8;       /* body text (14.6:1 on the night) */
  --color-mute: #b9addb;            /* secondary text (8.4:1 on the night) */
  --color-on-gold: #1a1436;
  --color-header: rgb(14 9 38 / 0.88);
  --night: radial-gradient(120% 80% at 50% 0%, #30226b 0%, #1a1145 45%, #0b0724 100%);

  /* Type */
  --font-display: "Cormorant SC", "Cormorant Garamond", Georgia, serif;
  --font-body: "Alegreya Sans", "Gill Sans", system-ui, sans-serif;
  --text-sm: 0.9375rem;
  --text-base: 1.1875rem;
  --text-lg: 1.3125rem;
  --text-xl: 1.625rem;
  --text-2xl: clamp(2rem, 1.35rem + 2.9vw, 3.1rem);
  --text-3xl: clamp(2.5rem, 1.6rem + 4.2vw, 4rem);

  /* Space */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4.5rem;
  --gutter: 1rem;
  --container: 73.75rem;

  /* Shape: engraved line, never flat fill */
  --radius-sm: 0.375rem;
  --radius-md: 0.75rem;
  --rule: 1px solid rgb(233 198 120 / 0.45);
  --rule-strong: 1px solid rgb(233 198 120 / 0.8);
  --glow: 0 0 1.75rem rgb(233 198 120 / 0.18);
  --shadow-picture: 0 0.75rem 2rem rgb(0 0 0 / 0.45);

  /* Motion */
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --header-height: 4.25rem;
}