:root{
/* ── Base palette ─────────────────────────────────────────────
   Derived from the logo mark (#FF66C4 / #5CE1E6 / #FFDE59) and the
   banner lockups (#1976D2 field, #ECEFF1 light field). Blue and grey
   ramps follow Material's Blue / Blue Grey values, which is where the
   two banner colours come from. */

/* Blue — primary. --blue-700 is the header-banner field. */
--blue-50:#E3F2FD;--blue-100:#BBDEFB;--blue-200:#90CAF9;--blue-300:#64B5F6;--blue-400:#42A5F5;--blue-500:#2196F3;--blue-600:#1E88E5;--blue-700:#1976D2;--blue-800:#1565C0;--blue-900:#0D47A1;--blue-950:#072F6B;

/* Pink — accent 1. --pink-400 is the logo pink. */
--pink-100:#FFE6F5;--pink-200:#FFC2E7;--pink-300:#FF99D6;--pink-400:#FF66C4;--pink-500:#F53DAE;--pink-600:#D11A8C;--pink-700:#A00B69;

/* Cyan — accent 2. --cyan-400 is the logo cyan. */
--cyan-100:#DEFAFB;--cyan-200:#B8F4F6;--cyan-300:#8AEBEF;--cyan-400:#5CE1E6;--cyan-500:#2CCBD1;--cyan-600:#12A6AC;--cyan-700:#0B7E83;

/* Yellow — accent 3. --yellow-400 is the logo yellow. */
--yellow-100:#FFF8DC;--yellow-200:#FFF0B0;--yellow-300:#FFE888;--yellow-400:#FFDE59;--yellow-500:#F5C91F;--yellow-600:#D1A400;--yellow-700:#A07D00;

/* Neutral — blue-cast grey. --grey-100 is the footer-banner field. */
--grey-0:#FFFFFF;--grey-50:#F5F7F8;--grey-100:#ECEFF1;--grey-200:#DDE3E7;--grey-300:#C3CDD3;--grey-400:#94A5AF;--grey-500:#6B7F8B;--grey-600:#4E606B;--grey-700:#384752;--grey-800:#24313A;--grey-900:#141E25;
--ink:#0B1620;

/* Status hues */
--green-100:#DCF5E3;--green-400:#3DD68C;--green-600:#12A150;--green-700:#0B7A3C;
--red-100:#FFE4E4;--red-400:#FF6B6B;--red-600:#DC2626;--red-700:#A91616;

/* ── Semantic aliases ───────────────────────────────────────── */

/* Brand */
--brand-primary:var(--blue-700);
--brand-primary-hover:var(--blue-800);
--brand-primary-active:var(--blue-900);
--brand-accent-1:var(--pink-400);
--brand-accent-2:var(--cyan-400);
--brand-accent-3:var(--yellow-400);

/* Text */
--text-strong:var(--ink);
--text-body:var(--grey-800);
--text-muted:var(--grey-500);
--text-disabled:var(--grey-400);
--text-on-brand:var(--grey-0);
--text-on-accent:var(--ink);
--text-link:var(--blue-800);
--text-link-hover:var(--pink-600);

/* Surface */
--surface-page:var(--grey-100);
--surface-card:var(--grey-0);
--surface-sunken:var(--grey-50);
--surface-inverse:var(--ink);
--surface-brand:var(--blue-700);
--surface-brand-subtle:var(--blue-50);
--surface-accent-1-subtle:var(--pink-100);
--surface-accent-2-subtle:var(--cyan-100);
--surface-accent-3-subtle:var(--yellow-100);

/* Border — SHIAI-KüN borders are ink, not grey tints. */
--border-strong:var(--ink);
--border-default:var(--grey-300);
--border-subtle:var(--grey-200);
--border-brand:var(--blue-700);
--focus-ring:var(--cyan-400);

/* Status */
--status-live:var(--pink-500);
--status-success:var(--green-600);
--status-success-subtle:var(--green-100);
--status-warning:var(--yellow-600);
--status-warning-subtle:var(--yellow-100);
--status-danger:var(--red-600);
--status-danger-subtle:var(--red-100);
--status-info:var(--blue-700);
--status-info-subtle:var(--blue-50);
--status-idle:var(--grey-400);
}