:root{
/* base — abyss (deep navy stage) */
--abyss-950:#050C18;
--abyss-900:#071426;
--abyss-800:#0C2038;
--abyss-700:#12304F;
--abyss-600:#1B4571;

/* base — ink (near-black navy, for depth gradients) */
--ink-950:#02060E;
--ink-900:#050D1A;
--ink-700:#0E2440;

/* base — mist (light values: text and highlights) */
--mist-000:#EAF2FA;
--mist-200:#C3D5E8;
--mist-400:#8AA2BC;
--mist-600:#5C728C;

/* base — azure (primary accent) */
--azure-300:#7FC8F5;
--azure-500:#2E9BD6;
--azure-700:#14587F;

/* base — coral (urgency, sparing) */
--coral-400:#F0685C;
--coral-500:#D94A3E;
--coral-700:#8F2A22;

/* base — steel (implant metal, technical) */
--steel-300:#C3CAD2;
--steel-400:#8C97A3;
--steel-600:#4B5563;

/* glass */
--glass-fill:rgba(234,242,250,.06);
--glass-fill-strong:rgba(234,242,250,.11);
--glass-border:rgba(234,242,250,.15);
--glass-border-strong:rgba(234,242,250,.28);

/* semantic — dark is the default mode */
--bg-page:var(--abyss-900);
--bg-surface:var(--abyss-800);
--bg-surface-raised:var(--abyss-700);
--bg-glass:var(--glass-fill);
--bg-glass-strong:var(--glass-fill-strong);

--text-primary:var(--mist-000);
--text-secondary:var(--mist-200);
--text-muted:var(--mist-400);
--text-on-accent:var(--abyss-950);

--accent-primary:var(--azure-300);
--accent-primary-strong:var(--azure-500);
--accent-critical:var(--coral-500);
--accent-critical-bright:var(--coral-400);
--accent-technical:var(--steel-400);

--border-default:var(--glass-border);
--border-strong:var(--glass-border-strong);
--focus-ring:var(--azure-300);
}

/* light mode — lesson handouts, printed material, documents */
.theme-light{
--bg-page:#F1F5FA;
--bg-surface:#FFFFFF;
--bg-surface-raised:#F7FAFD;
--bg-glass:rgba(5,12,24,.04);
--bg-glass-strong:rgba(5,12,24,.07);

--text-primary:#071426;
--text-secondary:#425A73;
--text-muted:#7B90A8;
--text-on-accent:#FFFFFF;

--accent-primary:var(--azure-700);
--accent-primary-strong:#0F4462;
--accent-critical:var(--coral-500);
--accent-technical:var(--steel-600);

--border-default:rgba(5,12,24,.13);
--border-strong:rgba(5,12,24,.28);
}
