/* Three themes, each a deliberate field — not a dark mode by inversion.
   chalk (default) · on-graphite · on-field. Put the attribute on any element;
   primitives read the --ri-theme-* set so they invert correctly inside a field. */
:root,[data-ri-theme="chalk"]{
--ri-theme-bg:var(--ri-chalk);
--ri-theme-fg:var(--ri-graphite);
--ri-theme-fg-dim:var(--ri-slate);
--ri-theme-fg-muted:var(--ri-grey);
--ri-theme-accent:var(--ri-field-deep);
--ri-theme-rule:var(--ri-hairline);
--ri-theme-link:var(--ri-field-deep);
--ri-theme-link-hover:var(--ri-graphite);
--ri-theme-focus:var(--ri-field);
}
[data-ri-theme="on-graphite"]{
--ri-theme-bg:var(--ri-graphite);
--ri-theme-fg:var(--ri-chalk);
--ri-theme-fg-dim:rgba(250,249,247,.72);
--ri-theme-fg-muted:rgba(250,249,247,.58);
--ri-theme-accent:var(--ri-field);
--ri-theme-rule:rgba(250,249,247,.18);
--ri-theme-link:var(--ri-field);
--ri-theme-link-hover:var(--ri-chalk);
--ri-theme-focus:var(--ri-field);
}
/* On the field, everything is knockout chalk and nothing is small: 19px/600 floor. */
[data-ri-theme="on-field"]{
--ri-theme-bg:var(--ri-field);
--ri-theme-fg:var(--ri-on-field);
--ri-theme-fg-dim:var(--ri-on-field-dim);
--ri-theme-fg-muted:var(--ri-on-field-dim);
--ri-theme-accent:var(--ri-on-field);
--ri-theme-rule:rgba(250,249,247,.32);
--ri-theme-link:var(--ri-on-field);
--ri-theme-link-hover:var(--ri-chalk);
--ri-theme-focus:var(--ri-chalk);
}
[data-ri-theme]{background:var(--ri-theme-bg);color:var(--ri-theme-fg)}
[data-ri-theme] a:not([class*="ri-"]){color:var(--ri-theme-link)}
[data-ri-theme] a:not([class*="ri-"]):hover{color:var(--ri-theme-link-hover)}
[data-ri-theme] :focus-visible{outline:2px solid var(--ri-theme-focus);outline-offset:var(--ri-focus-offset)}
[data-ri-theme="on-field"] :is(p,li){font-size:max(19px,1em);font-weight:600}