/* Match the RouTok homepage palette in both appearances. */
:root {
  color-scheme: light;
  --paper: #f7f8f4; --surface: #fff; --ink: #172c27; --muted: #5c6b64;
  --line: #dbe2da; --brand: #23654d; --soft: #e8eee6; --lime: #d4ee97; --forest: #203f32;
  --action-bg: #203f32; --action-ink: #f7f8f4; --action-hover: #23654d;
  --code-bg: #1b2822; --code-ink: #d9e6d9; --selection-ink: #172c27;
}
@media screen and (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --paper: #121c18; --surface: #1a2821; --ink: #edf2e9; --muted: #b0c1b4;
    --line: #34463a; --brand: #b5dbad; --soft: #24372b;
    --action-bg: #d4ee97; --action-ink: #203421; --action-hover: #b5dbad;
    --code-bg: #0e1712;
  }
}
@media screen {
  :root[data-theme="dark"] {
    color-scheme: dark;
    --paper: #121c18; --surface: #1a2821; --ink: #edf2e9; --muted: #b0c1b4;
    --line: #34463a; --brand: #b5dbad; --soft: #24372b;
    --action-bg: #d4ee97; --action-ink: #203421; --action-hover: #b5dbad;
    --code-bg: #0e1712;
  }
}
/* Static counterpart of New API / QuantumNous ThemeSwitch and DropdownMenu. */
.theme-switch { position: relative; display: inline-flex; flex-shrink: 0; }
.theme-switch[hidden], .theme-menu[hidden] { display: none; }
.theme-switch .theme-toggle {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; padding: 0; border: 1px solid transparent; border-radius: 8px;
  color: var(--ink); background: transparent; cursor: pointer;
  transition: background-color 150ms, box-shadow 150ms;
}
.theme-switch .theme-toggle:is(:hover, [aria-expanded="true"]) { background: var(--soft); }
.theme-toggle svg { position: absolute; width: 19.2px; height: 19.2px; pointer-events: none; transition: transform 150ms; }
.theme-toggle .theme-sun { transform: rotate(0) scale(1); }
.theme-toggle .theme-moon { transform: rotate(90deg) scale(0); }
:root[data-theme="dark"] .theme-sun { transform: rotate(-90deg) scale(0); }
:root[data-theme="dark"] .theme-moon { transform: rotate(0) scale(1); }
.theme-menu {
  position: absolute; top: calc(100% + 4px); right: 0; z-index: 50;
  min-width: 128px; padding: 4px; border: 1px solid color-mix(in srgb, var(--ink) 10%, transparent);
  border-radius: 8px; background: var(--surface); color: var(--ink);
  box-shadow: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;
  transform-origin: top right; animation: theme-menu-in 100ms ease-out;
}
.theme-menu [role="menuitemradio"] {
  display: flex; align-items: center; justify-content: space-between; gap: 6px;
  width: 100%; margin: 0; padding: 4px 6px; border: 0; border-radius: 6px;
  background: transparent; color: inherit; font: 14px/20px Inter, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  white-space: nowrap; text-align: left; cursor: default;
}
.theme-menu [role="menuitemradio"]:is(:hover, :focus) { background: var(--soft); outline: none; }
.theme-menu .theme-check { width: 14px; height: 14px; flex-shrink: 0; visibility: hidden; pointer-events: none; }
.theme-menu [aria-checked="true"] .theme-check { visibility: visible; }
.theme-switch .theme-toggle:focus-visible { outline: 3px solid var(--brand); outline-offset: 3px; }
@keyframes theme-menu-in { from { opacity: 0; transform: translateY(-4px) scale(.95); } to { opacity: 1; transform: translateY(0) scale(1); } }
@media (prefers-reduced-motion: reduce) {
  .theme-toggle svg, .theme-switch .theme-toggle { transition: none; }
  .theme-menu { animation: none; }
}
@media print { .theme-switch { display: none; } }