/* Neritation. Chakra Nebula palette tokens. APPROVED 2026-08-20.
   Canonical copy of New Website/tokens.css. Change there, then here.

   Single dark theme, committed. There is no light variant.

   Every contrast figure below is measured against --void (#0A0A12) unless the comment
   says otherwise. WCAG AA needs 4.5:1 for normal text and 3:1 for large text and UI.

   THE ONE TRAP: Starlight on Throat Blue is 2.50:1. White text on the blue is broken.
   Blue fills take a Void label, not a white one. See --on-action below. */

:root {
  /* ---- Ground ---- */
  --void: #0A0A12;          /* page ground */
  --void-raised: #14141F;   /* raised surface, one step up */
  --void-edge: #23233A;     /* hairline rules and dividers */

  /* ---- Brand tier. The palette exactly as approved. ---- */
  --starlight: #F4F4F8;     /* 17.97:1  safe everywhere */
  --throat-blue: #1FA2FF;   /*  7.20:1  safe for body text. 44.5 percent weight. */
  --ajna-indigo: #5C33FF;   /*  3.17:1  fills and large type only. 44.5 percent weight. */
  --crown-violet: #B44DFF;  /*  5.11:1  safe for body text. 9 percent weight, the flash. */
  --dust: #5F6072;          /*  3.19:1  borders and icons only, never text */

  /* ---- Text tier. AA safe on --void AND --void-raised. Hue and saturation held,
     lightness lifted. Any new token here must clear 4.5:1 against #14141F, not just
     the page ground, or it fails the moment it lands on a card. ---- */
  --text-primary: var(--starlight);        /* 17.97:1 */
  --text-muted: #BDBDCB;                   /* ~10.5:1  sublines and body that is not the headline */
  --text-secondary: #7D7E95;               /*  4.97:1 on --void, 4.60:1 on --void-raised */
  --text-accent: var(--throat-blue);       /*  7.20:1  already safe, no lift needed */
  --text-indigo: #8864FF;                  /*  4.99:1 on --void, 4.63:1 on --void-raised */
  --text-violet: var(--crown-violet);      /*  5.11:1  already safe, no lift needed */

  /* ---- Roles ----
     Throat Blue is the ONLY interactive colour. If it is blue, you can act on it.
     Ajna Indigo is surface and gradient partner, never a link.
     Crown Violet is the 9 percent flash: the mark's centre ring, focus, and rare emphasis.
     The three accents sit between 1.41:1 and 2.27:1 of each other, so they can never
     encode hierarchy or state relative to one another. Only against the ground. */
  --action: var(--throat-blue);
  --action-hover: #4DB6FF;
  --on-action: var(--void);          /* 7.20:1 on --action. NEVER --starlight, that is 2.50:1 */
  --surface-strong: var(--ajna-indigo);
  --on-surface-strong: var(--starlight);  /* 5.68:1 on --ajna-indigo */
  --flash: var(--crown-violet);
  --on-flash: var(--void);           /* 5.11:1 on --crown-violet */
  --focus-ring: var(--crown-violet);

  /* ---- Gradients ----
     The mark runs Throat Blue to Ajna Indigo on a diagonal, with Crown Violet reserved
     for the centre ring. Page gradients follow the same two stops. */
  --gradient-brand: linear-gradient(135deg, var(--throat-blue) 0%, var(--ajna-indigo) 100%);
  --gradient-flash: linear-gradient(135deg, var(--ajna-indigo) 0%, var(--crown-violet) 100%);

  /* ---- State ---- */
  --danger: #FF5C6E;
  --success: #35D6A0;
}

/* The brand gradient is diagonal, so it must mirror with the page or the mark's
   light direction contradicts the layout in Hebrew. */
:root:dir(rtl) {
  --gradient-brand: linear-gradient(225deg, var(--throat-blue) 0%, var(--ajna-indigo) 100%);
  --gradient-flash: linear-gradient(225deg, var(--ajna-indigo) 0%, var(--crown-violet) 100%);
}

html {
  background: var(--void);
  color: var(--text-primary);
  color-scheme: dark;
}