/* Light theme. Opt in with (or on any wrapper element).
Rules: yellow becomes a SURFACE, never text — #F5B81C on white is 1.8:1 and fails.
Black ink on yellow is 11.8:1 and passes AAA. Links are ink, not yellow. */
[data-theme="light"]{
/* The neutral alpha ramp flips from white-on-dark to ink-on-light.
Token names keep the --white-* prefix so components need no changes. */
--white:#0A0A0A;
--white-70:rgba(10,10,10,0.72);
--white-55:rgba(10,10,10,0.62);
--white-40:rgba(10,10,10,0.45);
--white-14:rgba(10,10,10,0.14);
--white-08:rgba(10,10,10,0.06);
--white-04:rgba(10,10,10,0.03);
--bg-page:#FFFFFF;
--bg-page-gradient:none;
--surface-card:#FFFFFF;
--surface-card-hover:#FAFAF8;
--surface-raised:#FFFFFF;
--surface-inset:#FAFAF8;
--text-primary:#0A0A0A;
--text-secondary:rgba(10,10,10,0.62);
--text-muted:rgba(10,10,10,0.45);
--text-on-accent:#0A0A0A;
--border-hairline:rgba(10,10,10,0.10);
--border-strong:rgba(10,10,10,0.18);
/* Yellow as text fails on white — links and inline emphasis go to ink. */
--link:#0A0A0A;
--link-hover:#5A4400;
--nav-bg:rgba(255,255,255,0.86);
--panel-bg:rgba(255,255,255,0.96);
--tooltip-bg:#0A0A0A;
--scrim:rgba(10,10,10,0.42);
--option-bg:#FFFFFF;
/* Glow reads as haze on white — keep it faint, and drop black drop-shadows to soft ink. */
--shadow-card:0 1px 2px rgba(10,10,10,0.04),0 8px 24px rgba(10,10,10,0.06);
--shadow-raised:0 24px 60px rgba(10,10,10,0.16);
--shadow-accent:0 6px 20px rgba(245,184,28,0.34);
--shadow-accent-strong:0 0 0 1px rgba(245,184,28,0.5),0 10px 30px rgba(245,184,28,0.42);
--glow-yellow-soft:radial-gradient(circle at 50% 50%,rgba(245,184,28,0.22) 0%,rgba(245,184,28,0) 70%); /* @kind color */
--glow-matrix-soft:radial-gradient(circle at 50% 50%,rgba(0,255,65,0.14) 0%,rgba(0,255,65,0) 70%); /* @kind color */
}
[data-theme="light"] ::selection{background:#F5B81C;color:#0A0A0A}