/*
  North Keeper brand tokens. Portable, framework neutral.

  Single source of truth for the North Keeper visual brand: the dark midnight
  and gold palette, Fraunces and IBM Plex type, radii and shadows. These are
  plain CSS custom properties in the OKLCH colour space, so any consumer can use
  them directly: the Next.js homepage, the Vite verify module, and the static
  map (link this file, or copy it in, then read the --nk-* variables).

  Brand source: northkeeper-home (the live homepage). Keep this file and the
  copy in northkeeper-verify (src/brand-tokens.css) in sync.

  Semantic mapping (which primitive is "primary", "card", and so on) is left to
  each consumer, because that is app specific. This file only states the brand
  truth: the primitives.
*/
:root {
  /* Midnight scale. Deep blue black, hue 260. Darkest is the page ground. */
  --nk-midnight-deep: oklch(0.06 0.008 260);   /* page background */
  --nk-midnight: oklch(0.09 0.008 260);        /* cards, popovers */
  --nk-midnight-raised: oklch(0.12 0.008 260); /* secondary, muted surfaces */
  --nk-midnight-accent: oklch(0.14 0.01 260);  /* inputs, subtle accents */
  --nk-border: oklch(0.18 0.008 260);          /* hairline borders */

  /* Gold. The single accent. */
  --nk-gold: oklch(0.80 0.12 85);              /* primary accent */
  --nk-gold-bright: oklch(0.86 0.12 88);       /* hover, emphasis */
  --nk-gold-foreground: oklch(0.16 0.01 260);  /* text on a gold fill */

  /* Parchment and text. */
  --nk-parchment: oklch(0.94 0.005 90);        /* foreground text */
  --nk-muted-foreground: oklch(0.55 0.015 90); /* secondary text */

  /* Status. */
  --nk-destructive: oklch(0.58 0.22 27);

  /* Typography. Fraunces for display, IBM Plex for UI and data.
     "Fraunces Variable" is the family name used by the self hosted variable
     font; "Fraunces" covers the next/font name on the homepage. */
  --nk-font-display: "Fraunces Variable", "Fraunces", Georgia, "Times New Roman", serif;
  --nk-font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --nk-font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, monospace;

  /* Radius. Sharp, 4px base, matching the homepage. */
  --nk-radius: 0.25rem;
  --nk-radius-sm: calc(var(--nk-radius) - 4px);
  --nk-radius-md: calc(var(--nk-radius) - 2px);
  --nk-radius-lg: var(--nk-radius);
  --nk-radius-xl: calc(var(--nk-radius) + 4px);

  /* Shadows. The brand leans on borders and opacity; shadows stay subtle. */
  --nk-shadow-sm: 0 1px 2px 0 oklch(0 0 0 / 0.30);
  --nk-shadow-lg: 0 10px 30px -10px oklch(0 0 0 / 0.55);

  /* The animated gold gradient used for accents and the homepage hero word. */
  --nk-gold-gradient: linear-gradient(
    45deg,
    #b8923f 0%,
    #d8b25e 25%,
    #f0d28a 50%,
    #d8b25e 75%,
    #b8923f 100%
  );

  /* A faint gold aurora over deep midnight, anchored top centre. */
  --nk-aurora: radial-gradient(
    60rem 40rem at 50% -10%,
    oklch(0.80 0.12 85 / 0.06),
    transparent 70%
  );
}