/* Only dark mode supplies these tokens. Light mode uses the original colors
   in each stylesheet, including the separate public and console palettes. */
:root { color-scheme: light; }
:root[data-theme="dark"] {
  color-scheme: dark;
  --theme-background: #10151e;
  --theme-surface: #171f2c;
  --theme-section: #141d2a;
  --theme-text: #e6ecf5;
  --theme-muted: #a6b2c5;
  --theme-accent: #8cafff;
  --theme-button: #315fd6;
  --theme-button-hover: #3e6ee5;
  --theme-line: #2c384b;
  --theme-interactive: #657a99;
  --theme-accent-tint: #1e2d49;
  --theme-accent-line: #3b5380;
  --theme-grid: #1b2636;
  --theme-contact: #152135;
  --theme-hover: #22334e;
  --theme-subtle-line: #273246;
  --theme-strong-line: #526580;
  --theme-motif: #7a91b1;
  --theme-green-surface: #192b29;
  --theme-green: #93d4b4;
  --theme-amber-surface: #332a1b;
  --theme-amber: #edc47e;
  --theme-red-surface: #352127;
  --theme-red: #f4a6b2;
  --theme-violet-surface: #2b2340;
  --theme-violet: #c2a9f6;
  --theme-rose-surface: #342330;
  --theme-rose: #f0abc4;
  --theme-slate-surface: #263143;
  --theme-slate: #b2c3df;
  --theme-column: #151e2c;
  --theme-inset: #121a27;
  --theme-raised: #1d293b;
  --theme-overlay: #080d16b3;
  --theme-translucent: #171f2ced;
  --theme-shadow: #00000040;
  --org-accent: var(--theme-accent);
  --org-tint: var(--theme-accent-tint);
}
:root[data-theme="dark"] .org-md a {
  text-decoration: underline;
  text-underline-offset: 3px;
}
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder {
  color: var(--theme-muted);
  opacity: 1;
}
/* Native system fallback, including when JavaScript is disabled or fails. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme: dark;
    --theme-background: #10151e;
    --theme-surface: #171f2c;
    --theme-section: #141d2a;
    --theme-text: #e6ecf5;
    --theme-muted: #a6b2c5;
    --theme-accent: #8cafff;
    --theme-button: #315fd6;
    --theme-button-hover: #3e6ee5;
    --theme-line: #2c384b;
    --theme-interactive: #657a99;
    --theme-accent-tint: #1e2d49;
    --theme-accent-line: #3b5380;
    --theme-grid: #1b2636;
    --theme-contact: #152135;
    --theme-hover: #22334e;
    --theme-subtle-line: #273246;
    --theme-strong-line: #526580;
    --theme-motif: #7a91b1;
    --theme-green-surface: #192b29;
    --theme-green: #93d4b4;
    --theme-amber-surface: #332a1b;
    --theme-amber: #edc47e;
    --theme-red-surface: #352127;
    --theme-red: #f4a6b2;
    --theme-violet-surface: #2b2340;
    --theme-violet: #c2a9f6;
    --theme-rose-surface: #342330;
    --theme-rose: #f0abc4;
    --theme-slate-surface: #263143;
    --theme-slate: #b2c3df;
    --theme-column: #151e2c;
    --theme-inset: #121a27;
    --theme-raised: #1d293b;
    --theme-overlay: #080d16b3;
    --theme-translucent: #171f2ced;
    --theme-shadow: #00000040;
    --org-accent: var(--theme-accent);
    --org-tint: var(--theme-accent-tint);
  }
  :root:not([data-theme]) .org-md a {
    text-decoration: underline;
    text-underline-offset: 3px;
  }
  :root:not([data-theme]) input::placeholder,
  :root:not([data-theme]) textarea::placeholder {
    color: var(--theme-muted);
    opacity: 1;
  }
}

.theme-picker {
  position: relative;
  flex: 0 0 auto;
  color: var(--theme-text, #202329);
  font: 13px/1.5 Manrope, system-ui, sans-serif;
}
.theme-picker[hidden], .theme-picker [hidden] { display: none !important; }
.theme-picker > .theme-trigger {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  margin: 0;
  border: 1px solid transparent;
  border-radius: 6px;
  color: var(--theme-muted, #55616e);
  background: transparent;
  list-style: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.theme-trigger::-webkit-details-marker { display: none; }
.theme-picker > .theme-trigger:hover,
.theme-picker[open] > .theme-trigger {
  background: var(--theme-accent-tint, #edf2ff);
  color: var(--theme-accent, #244fc2);
}
.theme-picker :focus-visible {
  outline: 3px solid var(--theme-accent, #244fc2);
  outline-offset: 3px;
}
.theme-picker .theme-panel {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 30;
  width: 208px;
  padding: 8px;
  border: 1px solid var(--theme-line, #d8ddd9);
  border-radius: 10px;
  background: var(--theme-surface, #fff);
  box-shadow: 0 12px 36px var(--theme-shadow, #1c232b1f);
}
.theme-panel-label {
  display: block;
  padding: 8px 10px;
  color: var(--theme-muted, #55616e);
  font-size: 10px;
  font-weight: 650;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.theme-picker .theme-choice {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 44px;
  margin: 2px 0 0;
  padding: 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
}
.theme-choice svg { flex-shrink: 0; }
.theme-choice .theme-check { margin-left: auto; opacity: 0; }
.theme-picker .theme-choice:hover { background: var(--theme-hover, #f3f5f9); }
.theme-picker .theme-choice[aria-pressed="true"] {
  background: var(--theme-accent-tint, #edf2ff);
  color: var(--theme-accent, #244fc2);
}
.theme-choice[aria-pressed="true"] .theme-check { opacity: 1; }
.login-theme { position: absolute; top: 20px; right: 20px; z-index: 5; }
@media (max-width: 1100px) and (min-width: 901px) {
  .header-actions { gap: 12px; }
  .header-inner { gap: 16px; }
  .desktop-nav { gap: 16px; }
}
@media (max-width: 380px) {
  .header-actions { gap: 3px; }
  .language-switch a { min-width: 24px; }
}
@media (max-width: 650px) {
  .topbar { gap: 10px; position: relative; }
  .account { gap: 10px; }
  .account > span { max-width: 120px; overflow: hidden; text-overflow: ellipsis; }
  .account .theme-picker { position: static; }
  .account .theme-panel { right: 18px; max-width: calc(100vw - 36px); }
}