/* Shared by the app shell, public guides, legal pages and offline entry points. */
:root {
  color-scheme: light;
  --merita-verde: #3B8C50;
  --merita-verde-oscuro: #1F5F3A;
  --merita-surface-page: #F6F8F5;
  --merita-surface-card: #FFFFFF;
  --merita-surface-support: #EAF3EC;
  --merita-action: #1F5F3A;
  --merita-action-hover: #184A2E;
  --merita-text: #18251D;
  --merita-text-secondary: #5F6B64;
  --merita-border: #DCE5DE;
  --merita-dark-page: #111B15;
  --merita-dark-card: #18251D;
  --merita-dark-support: #22362A;
  --merita-dark-text: #F6F8F5;
  --merita-dark-secondary: #B7C6BC;
  --merita-dark-border: #3C5343;
  --merita-dark-link: #A8D5B2;
  --merita-font-display: 'Bricolage Grotesque', Georgia, serif;
  --merita-font-ui: 'Atkinson Hyperlegible Next', system-ui, sans-serif;
  --merita-font-mono: 'IBM Plex Mono', ui-monospace, monospace;
  --bg: var(--merita-surface-page);
  --card: var(--merita-surface-card);
  --muted: var(--merita-surface-support);
  --muted-shadow: var(--merita-border);
  --ink: var(--merita-text);
  --ink-soft: var(--merita-text-secondary);
  --ink-faint: var(--merita-text-secondary);
  --line: var(--merita-border);
  --primary: var(--merita-action);
  --primary-ink: var(--merita-action);
  --primary-soft: var(--muted);
  --primary-shadow: var(--merita-action-hover);
  --on-primary: #FFFFFF;
  --correct: var(--merita-action);
  --correct-ink: var(--merita-action);
  --error: #B52D24;
  --error-ink: #B52D24;
  --accent2: #E8B85C;
  --accent2-ink: #6C4514;
  --streak: #B45309;
  --focus: var(--primary-ink);
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: var(--merita-dark-page);
  --card: var(--merita-dark-card);
  --muted: var(--merita-dark-support);
  --muted-shadow: #0B130E;
  --ink: var(--merita-dark-text);
  --ink-soft: var(--merita-dark-secondary);
  --ink-faint: var(--merita-dark-secondary);
  --line: var(--merita-dark-border);
  --primary-ink: var(--merita-dark-link);
  --correct-ink: var(--merita-dark-link);
  --error-ink: #FFB4A8;
  --accent2-ink: #F4D29B;
  --streak: #F4D29B;
}
/* Standalone documents follow the device; the app's explicit preference wins. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme: dark;
    --bg: var(--merita-dark-page);
    --card: var(--merita-dark-card);
    --muted: var(--merita-dark-support);
    --muted-shadow: #0B130E;
    --ink: var(--merita-dark-text);
    --ink-soft: var(--merita-dark-secondary);
    --ink-faint: var(--merita-dark-secondary);
    --line: var(--merita-dark-border);
    --primary-ink: var(--merita-dark-link);
    --correct-ink: var(--merita-dark-link);
    --error-ink: #FFB4A8;
    --accent2-ink: #F4D29B;
    --streak: #F4D29B;
  }
}
html { background: var(--bg); }
body { background: var(--bg); color: var(--ink); font-family: var(--merita-font-ui); }
::selection { background: var(--muted); color: var(--ink); }
:where(a) { color: var(--primary-ink); text-underline-offset: 3px; }
:where(a, button, input, select, textarea, [tabindex]):focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }