/* Shared semantic color tokens. System preference also works without JS. */
:root {
  color-scheme: light;
  --background: #faf9f6;
  --foreground: #1a1712;
  --muted-foreground: #514a40;
  --border: #ddd8cc;
  --surface: #eeeae1;
  --accent: #805329;
  --link: #70491f;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --background: #181b20;
  --foreground: #f0ede6;
  --muted-foreground: #b9b7b1;
  --border: #41444b;
  --surface: #262a31;
  --accent: #e0b47d;
  --link: #e0b47d;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --background: #181b20;
    --foreground: #f0ede6;
    --muted-foreground: #b9b7b1;
    --border: #41444b;
    --surface: #262a31;
    --accent: #e0b47d;
    --link: #e0b47d;
  }
}
[hidden] { display: none !important; }
.theme-toggle-btn, .theme-toggle-menu-item {
  align-items: center; justify-content: center; border: 0;
  background: transparent; color: var(--muted-foreground); cursor: pointer;
  font: inherit;
}
.theme-toggle-btn { display: inline-flex; width: 2.25rem; height: 2.25rem; }
.theme-toggle-menu-item { display: none; gap: 0.75rem; min-height: 44px; text-align: left; }
[data-theme-toggle]:hover { color: var(--foreground); }
[data-theme-toggle]:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
@media (max-width: 760px) {
  .theme-toggle-btn { display: none; }
  .site-header:has(.mobile-nav[open]) .theme-toggle-menu-item { display: flex; justify-content: flex-start; }
}

.lang-toggle a[aria-current="true"] { background: var(--surface); color: var(--foreground); font-weight: 700; }

/* Optional language suggestion, mirroring mikbry.com's visitor-led switch. */
.lang-suggest { background: var(--surface); border-bottom: 1px solid var(--border); color: var(--foreground); font-size: 0.9rem; }
.lang-suggest-inner { padding-block: 0.75rem; }
.lang-suggest p { margin: 0; }
.lang-suggest-actions { display: flex; align-items: center; gap: 0.5rem 1.25rem; flex-wrap: wrap; }
.lang-suggest-actions a { font-weight: 600; color: var(--link); }
.lang-suggest-actions a, .lang-suggest-actions button { min-height: 44px; display: inline-flex; align-items: center; }
.lang-suggest-actions button { border: 0; padding: 0; background: none; color: var(--muted-foreground); font: inherit; cursor: pointer; }
.lang-suggest-actions :focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.lang-suggest .lang-suggest-note { color: var(--muted-foreground); font-size: 0.8rem; line-height: 1.5; }