/* Palette extracted from index-claude.html. Only the optional light theme
   overrides the site's original colors. Typography and layout stay intact. */
html[data-wl-theme="light"] {
  --bg: #FAF8F4;
  --bg-1: #F1EFE9;
  --surface: #FFFFFF;
  --surface-2: #F1EFE9;
  --ink: #191E1B;
  --ink-1: #5C645F;
  --muted: #5C645F;
  --faint: #8B928D;
  --line: #DAD7CE;
  --line-2: #B9B5A9;
  --accent: #0D5D3E;
  --accent-bright: #249366;
  --accent-deep: #0D5D3E;
  --accent-ink: #FFFFFF;
  --cream: #FFFFFF;
  --glow: rgba(36, 147, 102, .26);
  --wl-chat-accent: #0D5D3E;
}

/* The only new control, immediately after the language switch. */
.wl-theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid var(--line-2);
  border-radius: 50%;
  background: transparent;
  color: var(--ink);
  cursor: pointer;
}
.wl-theme-toggle svg { width: 20px; height: 20px; }
.wl-theme-toggle:hover { color: var(--accent-bright); border-color: var(--accent-bright); }
.wl-theme-toggle:focus-visible { outline: 2px solid var(--accent-bright); outline-offset: 3px; }
html[data-wl-theme="light"] .wl-theme-toggle { background: #E4EFE9; color: #0D5D3E; }

/* These components originally use the background token as foreground ink. */
html[data-wl-theme="light"] .about-method,
html[data-wl-theme="light"] .founder-tag { color: #191E1B; }