:root{
/* --- Brand ramp: Safe Zone teal (logo #38A49F) --- */
--teal-50:#EEF7F6;--teal-100:#D6ECEA;--teal-200:#ACD9D6;--teal-300:#7CC3BF;--teal-400:#52AFAA;
--teal-500:#38A49F;--teal-600:#2C8480;--teal-700:#226762;--teal-800:#1A4E4B;--teal-900:#123634;
/* --- Neutral ramp: graphite, cooled with a trace of the brand teal --- */
--graphite-50:#F2F6F6;--graphite-100:#E1E9EA;--graphite-200:#C4D2D4;--graphite-300:#9AAEB2;
--graphite-400:#6E858A;--graphite-500:#4C6367;--graphite-600:#33474C;--graphite-700:#223438;
--graphite-800:#172528;--graphite-900:#101A1C;--graphite-950:#0B1214;
--white:#FFFFFF;--black:#000000;
/* --- Semantic status --- */
--status-pass:#2F9E5F;--status-pass-soft:#E6F4EC;
--status-attention:#C9861B;--status-attention-soft:#FBF1E0;
--status-fail:#C6413B;--status-fail-soft:#FAEAE9;
--status-info:#2C6FB3;--status-info-soft:#E9F1FA;
/* --- Brand aliases --- */
--brand:var(--teal-500);--brand-hover:var(--teal-600);--brand-active:var(--teal-700);
--brand-soft:var(--teal-50);--brand-border:var(--teal-200);--brand-on:var(--white);
/* --- Text --- */
--text-strong:var(--graphite-950);--text-body:var(--graphite-700);--text-muted:var(--graphite-400);
--text-inverse:var(--white);--text-inverse-muted:#9FB4B6;--text-brand:var(--teal-600);
--text-link:var(--teal-600);--text-link-hover:var(--teal-800);
/* --- Surfaces --- */
--surface-page:var(--white);--surface-subtle:var(--graphite-50);--surface-card:var(--white);
--surface-inset:var(--graphite-100);--surface-dark:var(--graphite-950);--surface-dark-2:var(--graphite-900);
--surface-dark-card:#13201F;--surface-brand:var(--teal-500);
--surface-scrim:rgba(11,18,20,.72);--surface-glass:rgba(255,255,255,.72);
--surface-glass-dark:rgba(11,18,20,.62);
/* --- Borders --- */
--border-subtle:var(--graphite-100);--border-default:var(--graphite-200);--border-strong:var(--graphite-300);
--border-dark:rgba(255,255,255,.10);--border-dark-strong:rgba(255,255,255,.20);
--border-focus:var(--teal-500);
/* --- Accent gradients (used sparingly: hairlines, mark washes) --- */
--grad-hairline:linear-gradient(90deg,transparent,var(--teal-500),transparent);
--grad-dark-wash:radial-gradient(120% 90% at 15% 0%,#173230 0%,var(--graphite-950) 60%);
}
