/* Unbundled so Vite preserves its position before the head initializer.
   Approved Ticket 027 palettes and semantic roles are recorded in DESIGN.md. */
:root {
  color-scheme: light;
  --color-page-bg: #f8f9f4;
  --color-surface-soft: #edf0e6;
  --color-text: #183e34;
  --color-text-muted: #526458;
  --color-border: #c8d1c5;
  --color-control-border: #7b8f7e;
  --color-control-border-emphasis: #778977;
  --color-emphasis-bg: #e7edb7;
  --color-emphasis-border: #a5b181;
  --color-action-bg: #183e34;
  --color-action-text: #f8f9f4;
  --color-selected-bg: var(--color-action-bg);
  --color-selected-text: var(--color-action-text);
  --color-hover-bg: #e9eddf;
  --color-focus-ring: #183e34;
  --color-error: var(--color-text);
  --color-disabled-text: var(--color-text-muted);
  --color-disabled-on-emphasis: #7a8560;
  --color-brand-mark: #6b803e;
  background: var(--color-page-bg);
  color: var(--color-text);
  accent-color: var(--color-selected-bg);
  scrollbar-color: var(--color-control-border) var(--color-page-bg);
}

:root[data-theme='dark'] {
  color-scheme: dark;
  --color-page-bg: #17201b;
  --color-surface-soft: #222d25;
  --color-text: #dce4d5;
  --color-text-muted: #abb8a6;
  --color-border: #465246;
  --color-control-border: #7e8e75;
  --color-control-border-emphasis: var(--color-control-border);
  --color-emphasis-bg: #303a26;
  --color-emphasis-border: #68764c;
  --color-action-bg: #b8cda0;
  --color-action-text: #17201b;
  --color-hover-bg: #2c392e;
  --color-focus-ring: #c6d78d;
  --color-disabled-on-emphasis: #a1ad8b;
  --color-brand-mark: #b8c97e;
}

/* With no initializer, retain a system-aware document canvas. Keep this block
   equal to the explicit dark block; the theme contrast test checks that contract. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme: dark;
    --color-page-bg: #17201b;
    --color-surface-soft: #222d25;
    --color-text: #dce4d5;
    --color-text-muted: #abb8a6;
    --color-border: #465246;
    --color-control-border: #7e8e75;
    --color-control-border-emphasis: var(--color-control-border);
    --color-emphasis-bg: #303a26;
    --color-emphasis-border: #68764c;
    --color-action-bg: #b8cda0;
    --color-action-text: #17201b;
    --color-hover-bg: #2c392e;
    --color-focus-ring: #c6d78d;
    --color-disabled-on-emphasis: #a1ad8b;
    --color-brand-mark: #b8c97e;
  }
}

::selection {
  color: var(--color-selected-text);
  background: var(--color-selected-bg);
}
