:root {
  color-scheme: light;
  --paper: #fefefe; --control: #fff; --ink: #1e1e1e;
  --subtle: #f5f5f5; --field: #f2f2f2; --hover: #eee; --surface: #dedede;
  --separator: #ddd; --line: #ccc; --line-strong: #aaa; --edge: #777; --edge-strong: #444;
  --ink-muted: #555; --ink-dim: #626262;
}
:root[data-theme=dark] {
  color-scheme: dark;
  --paper: #171717; --control: #141414; --ink: #e8e8e8;
  --subtle: #1e1e1e; --field: #222; --hover: #292929; --surface: #333;
  --separator: #383838; --line: #444; --line-strong: #666; --edge: #888; --edge-strong: #bbb;
  --ink-muted: #bbb; --ink-dim: #aaa;
  --background: 0 0% 9%; --foreground: 0 0% 91%;
  --card: 0 0% 20%; --card-foreground: 0 0% 91%;
  --popover: 0 0% 20%; --popover-foreground: 0 0% 91%;
  --primary: 0 0% 91%; --primary-foreground: 0 0% 8%;
  --secondary: 0 0% 27%; --secondary-foreground: 0 0% 91%;
  --muted: 0 0% 16%; --muted-foreground: 0 0% 73%;
  --accent: 0 0% 91%; --accent-foreground: 0 0% 91%;
  --destructive: 0 0% 80%; --destructive-foreground: 0 0% 8%;
  --border: 0 0% 55%; --input: 0 0% 8%; --ring: 0 0% 91%;
  --status-created: 0 0% 70%; --status-running: 0 0% 91%;
  --status-review: 0 0% 80%; --status-completed: 0 0% 80%; --status-failed: 0 0% 80%;
}
.theme-toggle {
  display: grid; place-items: center; flex-shrink: 0; width: 44px; height: 44px;
  border: 0; padding: 0; border-radius: 0; background: transparent; color: var(--ink); cursor: pointer;
}
.theme-toggle:hover { background: var(--hover); }
.theme-toggle:focus-visible { outline: 2px solid var(--ink); outline-offset: -4px; }
.theme-toggle-static { position: fixed; top: 2px; right: 20px; z-index: 50; background: var(--paper); }
.theme-sun, [data-theme=dark] .theme-moon { display: none; }
[data-theme=dark] .theme-sun { display: inline; }
@media (max-width: 700px) { .theme-toggle-static { right: 12px; } }
/* Keep the account control in the same palette without changing its behavior. */
:root[data-theme] .account-trigger { background: var(--subtle); color: var(--ink); }
:root[data-theme] .account-trigger:hover, :root[data-theme] .account-trigger[aria-expanded=true] { background: var(--surface); }
:root[data-theme] .account-panel { border: 0; background: var(--surface); color: var(--ink); }
:root[data-theme] .account-identity { border: 0; }
:root[data-theme] .account-panel [role=menuitem]:hover, :root[data-theme] .account-panel [role=menuitem]:focus-visible { background: var(--hover); }
@media (min-width: 701px) {
  :root[data-theme] .account-popover { width: calc(var(--conversation-history-width, 272px) - max(16px, env(safe-area-inset-left)) - 16px); }
}
/* The animated VFX alpha mask reveals the new palette through the old snapshot. */
::view-transition { pointer-events: none; }
/* The old snapshot dissolves above the fully rendered new theme. */
::view-transition-group(root), ::view-transition-old(root), ::view-transition-new(root) { animation: none; mix-blend-mode: normal; }
::view-transition-old(root) { z-index: 1; image-rendering: pixelated; mask-size: 100% 100%; mask-repeat: no-repeat; }
::view-transition-new(root) { z-index: 0; }