:root{
  /* ===== Brand ===== */
  --leon-yellow:#FFCB05;      /* primary brand */
  --leon-black:#0A0A0A;       /* brand ink */
  --leon-white:#FFFFFF;

  /* Yellow scale */
  --yellow-50:#FFF9E0;
  --yellow-100:#FFF3C2;
  --yellow-200:#FFE885;
  --yellow-300:#FFDC4D;
  --yellow-400:#FFD01F;
  --yellow-500:#FFCB05;       /* = brand */
  --yellow-600:#E0B200;
  --yellow-700:#B8920A;
  --yellow-800:#8A6E0C;
  --yellow-900:#5C4A0A;

  /* Neutral / ink scale (warm-neutral) */
  --ink-950:#0A0A0A;
  --ink-900:#141414;
  --ink-800:#1F1F1F;
  --ink-700:#2E2E2E;
  --ink-600:#4A4A4A;
  --ink-500:#6B6B6B;
  --ink-400:#949494;
  --ink-300:#C4C4C4;
  --ink-200:#E2E2E0;
  --ink-100:#F1F1EF;
  --ink-50:#F8F8F6;

  /* Semantic status (muted, professional) */
  --success:#2E7D4F;
  --success-soft:#E6F2EB;
  --warning:#B8920A;
  --warning-soft:#FFF3C2;
  --danger:#C7412F;
  --danger-soft:#FBE9E6;
  --info:#2C5E8A;
  --info-soft:#E7EEF5;

  /* ===== Semantic aliases (light) ===== */
  --bg-base:var(--leon-white);
  --bg-subtle:var(--ink-50);
  --bg-sunken:var(--ink-100);
  --surface-card:var(--leon-white);
  --surface-inverse:var(--leon-black);
  --surface-brand:var(--leon-yellow);

  --text-primary:var(--ink-950);
  --text-secondary:var(--ink-600);
  --text-muted:var(--ink-500);
  --text-inverse:var(--leon-white);
  --text-on-brand:var(--leon-black);
  --text-link:var(--ink-950);

  --border-subtle:var(--ink-200);
  --border-default:var(--ink-300);
  --border-strong:var(--ink-950);
  --border-brand:var(--leon-yellow);

  --focus-ring:var(--leon-yellow);
}