/* Cadence — colour tokens. Tier 1 primitives + Tier 2 semantic. Components consume Tier 2 only. */
:root {
  /* ---- Tier 1: primitives ---- */
  --indigo-50:#EFF1FF; --indigo-100:#E0E4FF; --indigo-200:#C4CBFF; --indigo-300:#9BA6FF;
  --indigo-400:#6674FF; --indigo-500:#2E42FF; --indigo-600:#2334D6; --indigo-700:#1B28A8;
  --indigo-800:#141D7A; --indigo-900:#0D134D;

  --neutral-0:#FFFFFF; --neutral-50:#F5F5F9; --neutral-100:#EFEFF4; --neutral-200:#E4E4EC;
  --neutral-300:#D2D2DC; --neutral-400:#A9A9B6; --neutral-500:#82828F; --neutral-600:#61616C;
  --neutral-900:#16161A; --neutral-950:#0B0B0E;

  --green-50:#ECFDF3; --green-500:#16B364; --green-600:#099250; --green-700:#087443;
  --amber-50:#FFFAEB; --amber-500:#F79009; --amber-700:#B54708;
  --red-50:#FEF3F2; --red-500:#F04438; --red-700:#B42318;

  /* AI gradient hues — outlines and sparkles ONLY, never fills */
  --ai-violet:#8B5CF6; --ai-pink:#F43F8E; --ai-cyan:#22D3EE;
  --gradient-ai:linear-gradient(135deg,#8B5CF6,#F43F8E,#22D3EE); /* @kind color */

  /* Alpha primitives — content overlays are ALWAYS alpha, never opaque */
  --alpha-black-40:rgba(11,11,14,.40);
  --alpha-black-60:rgba(11,11,14,.60);
  --alpha-indigo-10:rgba(46,66,255,.10);
  --alpha-indigo-16:rgba(46,66,255,.16);
  --alpha-indigo-24:rgba(46,66,255,.24);

  /* ---- Tier 2: semantic (light) ---- */
  --bg-canvas:var(--neutral-0);
  --bg-canvas-grouped:var(--neutral-50);
  --bg-surface:var(--neutral-0);
  --bg-surface-raised:var(--neutral-0);
  --bg-surface-sunken:var(--neutral-50);
  --bg-surface-brand:var(--indigo-50);
  --bg-surface-inverse:var(--neutral-900);

  --fg-primary:var(--neutral-900);
  --fg-secondary:var(--neutral-600);
  --fg-tertiary:var(--neutral-500); /* corrected from observed #A9A9B6 — that fails AA */
  --fg-placeholder:var(--neutral-500);
  --fg-disabled:var(--neutral-400);
  --fg-brand:var(--indigo-500);
  --fg-on-brand:var(--neutral-0);
  --fg-success:var(--green-700);
  --fg-success-icon:var(--green-600);
  --fg-commercial:var(--amber-700);
  --fg-danger:var(--red-500);
  --fg-danger-text:var(--red-700);

  --border-hairline:var(--neutral-200);
  --border-control:var(--neutral-300);
  --border-brand:var(--indigo-500);
  --border-focus:var(--indigo-500);

  --fill-brand:var(--indigo-500);
  --fill-brand-pressed:var(--indigo-600);
  --fill-success-subtle:var(--green-50);
  --fill-commercial-subtle:var(--amber-50);
  --fill-danger-subtle:var(--red-50);

  --scrim:var(--alpha-black-40);
  --track:var(--neutral-100);          /* progress/slider track */
  --track-off:var(--neutral-300);      /* toggle OFF fill */
  --skeleton-base:var(--neutral-100);
  --skeleton-sheen:var(--neutral-50);
  --glass-bg:rgba(255,255,255,.72);
  --glass-rim:rgba(255,255,255,.65);
  --glass-shadow:0 8px 24px -6px rgba(11,11,14,.18);
  --glass-fg:var(--fg-primary);
  --halo-brand:var(--alpha-indigo-16);

  --reading-paper:var(--neutral-0);
  --reading-ink:var(--neutral-900);
  --reading-highlight-sentence:var(--alpha-indigo-10);
  --reading-highlight-word:var(--alpha-indigo-24);

  --opacity-disabled:.4; /* @kind other */
}

/* Sepia reading theme — reader surfaces only */
[data-theme="sepia"] {
  --reading-paper:#F6EEDD;
  --reading-ink:#16161A;
  --bg-canvas:#F6EEDD;
}

/* Dark theme. Raised = LIGHTER surface (tonal elevation inverts, no shadow retune).
   Brand stop lightens to indigo-400 — 3.13:1 at 500 on the dark canvas is non-negotiable. */
[data-theme="dark"] {
  --glass-bg:rgba(22,22,26,.82);
  --glass-rim:rgba(255,255,255,.12);
  --glass-shadow:0 8px 24px -6px rgba(0,0,0,.5);
  --track:#2A2A31;
  --track-off:#3A3A44;
  --skeleton-base:#232329;
  --skeleton-sheen:#2E2E36;
  --bg-canvas:var(--neutral-950);
  --bg-canvas-grouped:var(--neutral-950);
  --bg-surface:var(--neutral-900);
  --bg-surface-raised:#2A2A31;
  --bg-surface-sunken:var(--neutral-900);
  --bg-surface-brand:rgba(102,116,255,.16);
  --bg-surface-inverse:var(--neutral-0);

  --fg-primary:#FFFFFF;
  --fg-secondary:var(--neutral-400);
  --fg-tertiary:var(--neutral-500);
  --fg-placeholder:var(--neutral-500);
  --fg-brand:var(--indigo-400);
  --fg-on-brand:#FFFFFF;

  --border-hairline:#2A2A31;
  --border-control:#3A3A44;
  --border-brand:var(--indigo-400);
  --border-focus:var(--indigo-400);

  --fill-brand:var(--indigo-400);
  --fill-brand-pressed:var(--indigo-500);

  --reading-paper:var(--neutral-950);
  --reading-ink:var(--neutral-100); /* never #FFF body text — halation */
}