/* Site theme. html.theme-light / html.theme-dark beat :root so one file covers
   the homepage shell and the inlined page CSS. */

html.theme-light {
  --bg: #eceae6;
  --surface: #f4f3f0;
  --input: #f7f6f3;
  --ink: #14161a;
  --ink-2: #3a3d42;
  --muted: #5d6168;
  --line: #cfcbc3;
  --link: #0a4ec8;
  --signup: #f3ebe7;
  --signup-line: #e4cfc6;
  --table-head: #e4e2dc;
  --spbar: #e4e2dc;
  --spbar-line: #d0cec8;
  --code-bg: #16181c;
  --code-fg: #e8e6df;
  --card: #f4f3f0;
  --mut: #5d6168;
  --input-border: #b5b4ae;
  --plate: #e6e4de;
  color-scheme: light;
}
html.theme-dark {
  --bg: #141613;
  --surface: #22261f;
  --input: #1a1d18;
  --ink: #eceae3;
  --ink-2: #c9c6bc;
  --muted: #a8aca3;
  --line: #3c4038;
  --link: #9ec0ff;
  --signup: #2c2622;
  --signup-line: #6e4a3e;
  --table-head: #2a2e28;
  --spbar: #1c1f1b;
  --spbar-line: #3c4038;
  --code-bg: #0e100e;
  --code-fg: #e6e4db;
  --card: #22261f;
  --mut: #a8aca3;
  --input-border: #4d5248;
  --plate: #2c3128;
  color-scheme: dark;
}

html.theme-light body,
html.theme-dark body {
  background: var(--bg);
  color: var(--ink);
}

html.theme-light .card,
html.theme-light .steps li,
html.theme-light .tool,
html.theme-light .note,
html.theme-light .roles li,
html.theme-light .post,
html.theme-light .xposts article,
html.theme-light .chips a,
html.theme-light .tier,
html.theme-light .dstrip .oc,
html.theme-light .dd2-tool,
html.theme-light .dd2-step,
html.theme-light .tt,
html.theme-light .skip,
html.theme-light .srcs,
html.theme-light .btn-ghost,
html.theme-light .archive-card,
html.theme-light .badge-disclosure,
html.theme-light .past-days,
html.theme-light .rc-card,
html.theme-dark .card,
html.theme-dark .steps li,
html.theme-dark .tool,
html.theme-dark .note,
html.theme-dark .roles li,
html.theme-dark .post,
html.theme-dark .xposts article,
html.theme-dark .chips a,
html.theme-dark .tier,
html.theme-dark .dstrip .oc,
html.theme-dark .dd2-tool,
html.theme-dark .dd2-step,
html.theme-dark .tt,
html.theme-dark .skip,
html.theme-dark .srcs,
html.theme-dark .btn-ghost,
html.theme-dark .archive-card,
html.theme-dark .badge-disclosure,
html.theme-dark .past-days,
html.theme-dark .rc-card {
  background-color: var(--surface);
  border-color: var(--line);
  color: var(--ink);
}
html.theme-light .card p,
html.theme-dark .card p,
html.theme-light .tool-type,
html.theme-dark .tool-type,
html.theme-light .tool-desc,
html.theme-dark .tool-desc {
  color: var(--ink-2);
}
html.theme-light .past-days h2,
html.theme-light .past-days li,
html.theme-dark .past-days h2,
html.theme-dark .past-days li,
html.theme-light .badge-disclosure summary,
html.theme-dark .badge-disclosure summary,
html.theme-light .archive-card h2,
html.theme-dark .archive-card h2 {
  color: var(--ink);
}
html.theme-light .past-days a,
html.theme-dark .past-days a,
html.theme-light .archive-card a,
html.theme-dark .archive-card a {
  color: var(--link);
}

html.theme-light .nbox,
html.theme-light .signup,
html.theme-light .feat,
html.theme-light .nlq,
html.theme-light .rc-new,
html.theme-dark .nbox,
html.theme-dark .signup,
html.theme-dark .feat,
html.theme-dark .nlq,
html.theme-dark .rc-new {
  background-color: var(--signup);
  border-color: var(--signup-line);
  color: var(--ink);
}
html.theme-dark .signup .sbs,
html.theme-dark .signup .fine,
html.theme-dark .sbox .sbs,
html.theme-dark .nbox,
html.theme-dark .rc-new {
  color: var(--ink-2);
}
html.theme-dark .signup strong,
html.theme-dark .nbox strong {
  color: var(--ink);
}
html.theme-dark .signup a,
html.theme-dark .nbox a,
html.theme-dark .rc-new a {
  color: #ffb199;
}

html.theme-light .nf input[type="email"],
html.theme-light .search input,
html.theme-light .sf input[type="email"],
html.theme-light .stack input,
html.theme-light .stack textarea,
html.theme-light select,
html.theme-light input[type="search"],
html.theme-light input[type="email"],
html.theme-light input[type="text"],
html.theme-light input[type="password"],
html.theme-light textarea,
html.theme-dark .nf input[type="email"],
html.theme-dark .search input,
html.theme-dark .sf input[type="email"],
html.theme-dark .stack input,
html.theme-dark .stack textarea,
html.theme-dark select,
html.theme-dark input[type="search"],
html.theme-dark input[type="email"],
html.theme-dark input[type="text"],
html.theme-dark input[type="password"],
html.theme-dark textarea {
  background: var(--input);
  color: var(--ink);
  border-color: var(--input-border);
}
html.theme-dark input::placeholder,
html.theme-dark textarea::placeholder {
  color: #8e9388;
}

html.theme-light .spbar,
html.theme-dark .spbar {
  background: var(--spbar);
  color: var(--ink);
  border-bottom: 1px solid var(--spbar-line);
}
html.theme-dark .spbar a { color: var(--link); }

html.theme-light .tt th,
html.theme-dark .tt th {
  background: var(--table-head);
  color: var(--ink-2);
}
html.theme-light .tt,
html.theme-dark .tt { color: var(--ink); }

html.theme-light .setup,
html.theme-dark .setup,
html.theme-light .setup pre,
html.theme-dark .setup pre,
html.theme-light .badge-snippet,
html.theme-dark .badge-snippet {
  background: var(--code-bg);
  color: var(--code-fg);
  border-color: var(--line);
}
html.theme-dark .setup h3 { color: var(--code-fg); }
html.theme-dark li > code,
html.theme-dark p > code,
html.theme-dark .steps code,
html.theme-dark .badge {
  color: #ffb199;
}

html.theme-dark .b-hi,
html.theme-dark .pt-autonomous { background: #143322; color: #8fd0a8; }
html.theme-dark .b-mid,
html.theme-dark .pt-ai-assisted { background: #3a2e14; color: #f0d48a; }
html.theme-dark .b-lo,
html.theme-dark .pt-banned { background: #3a1814; color: #ffb0a4; }
html.theme-dark .b-na,
html.theme-dark .pt { background: #2a2e28; color: #eceae3; }
html.theme-dark .pt-human-in-the-loop { background: #1a2744; color: #b7c9ff; }
html.theme-dark .signal { background: #1c2433; color: var(--ink); }
html.theme-light .signal { background: #e4eaf6; }
html.theme-dark .crew-roles span,
html.theme-dark .kv dt,
html.theme-dark .rc-name,
html.theme-dark .dd2-step a span:last-child { color: var(--ink-2); }
html.theme-dark .dd2-tname { color: var(--ink); }
html.theme-dark .dd2-meta { color: var(--muted); }
html.theme-dark .dd2-k { color: #ff8a62; }
html.theme-dark .btn,
html.theme-dark .try,
html.theme-dark .signup button,
html.theme-dark .search button,
html.theme-dark .nf button,
html.theme-dark .sf button,
html.theme-dark nav .cta,
html.theme-dark .site-head nav a.cta {
  color: #14161a;
}
html.theme-dark .rc-when,
html.theme-dark .rc-src,
html.theme-dark .sm { color: var(--muted); }

html.theme-light .rc-ax { fill: #4e545c; }
html.theme-dark .rc-ax { fill: #a8aca3; }
html.theme-light .rc-dayn,
html.theme-dark .rc-dayn { fill: var(--ink); }
html.theme-light .rc-x,
html.theme-dark .rc-x { stroke: var(--ink); }
html.theme-light .rc-base { stroke: var(--line); }
html.theme-dark .rc-base,
html.theme-dark .rc-gap { stroke: #5c6158; }
html.theme-light .rc-pt { fill: var(--surface); }
html.theme-dark .rc-pt { fill: var(--bg); stroke: #ff6a4a; }
html.theme-dark .rc-line,
html.theme-dark .rc-nowc { stroke: #ff6a4a; fill: none; }
html.theme-dark .rc-nowc { fill: #ff6a4a; }
html.theme-dark .rc-area { fill: #ff6a4a; opacity: .16; }
html.theme-light .rc-hl,
html.theme-dark .rc-hl { fill: var(--ink); stroke: var(--surface); }
html.theme-dark .rc-sub { color: #8fd0a8; }
html.theme-dark .rc-tbl summary { color: var(--link); }
html.theme-light .rc-chips button,
html.theme-dark .rc-chips button {
  background: var(--surface);
  color: var(--ink);
  border-color: var(--line);
}
html.theme-dark .rc-chips button[aria-pressed="true"] {
  background: var(--ink);
  color: var(--bg);
  border-color: var(--ink);
}
html.theme-light .rc-badge { background: var(--ink); color: var(--bg); }
html.theme-dark .rc-badge { background: var(--ink); color: var(--bg); }
html.theme-dark .rc-tip { background: #0e100e; color: var(--ink); }
html.theme-dark .rc-tip b { color: #ffb199; }

html.theme-light .rw { background-color: #e6e4de; }
html.theme-dark .rw {
  --p: #243026;
  --ink: #d7e4c8;
  --mut: #b4c0aa;
  --acc: #ff8a62;
  --line: #5d6e54;
  background-color: #1a1e18;
  color: #d7e4c8;
}
html.theme-dark .rw-row { color: var(--ink); }
html.theme-dark .rw-trg { background: #3a4634; }
html.theme-dark .lw {
  --lw-bg: #1a1e18;
  --lw-panel: #243026;
  --lw-ink: #d7e4c8;
  --lw-muted: #b4c0aa;
  --lw-accent: #ff8a62;
  --lw-link: #9ec0ff;
  --lw-line: #5d6e54;
  --lw-cat-0: #d7e4c8;
  --lw-cat-8: #eceae3;
  background-color: #1a1e18;
  color: #d7e4c8;
  color-scheme: dark;
}

html.theme-light .arena-app {
  --bg: #eceae6;
  --surface: #f4f3f0;
  --ink: #14161a;
  --ink-2: #3a3d42;
  --muted: #5d6168;
  --line: #cfcbc3;
  --link: #0a4ec8;
  --plate: #e6e4de;
  color-scheme: light;
}
html.theme-dark .arena-app {
  --bg: #141613;
  --surface: #22261f;
  --ink: #eceae3;
  --ink-2: #c9c6bc;
  --muted: #a8aca3;
  --line: #3c4038;
  --link: #9ec0ff;
  --plate: #2c3128;
  background: var(--bg);
  color: var(--ink);
  color-scheme: dark;
}
html.theme-dark .arena-app .mini-mascot { background: var(--plate); }
html.theme-dark body.aa-page .arena-app .board-note button,
html.theme-dark body.aa-page .arena-app .roaming-hint,
html.theme-dark body.aa-page .arena-app .source-note p,
html.theme-dark body.aa-page .arena-app .source-note span,
html.theme-dark body.aa-page .arena-app .spotlight-footer span,
html.theme-dark body.aa-page .arena-app .spotlight-top .quiet-button,
html.theme-dark body.aa-page .arena-app .spotlight-top span,
html.theme-dark body.aa-page .arena-app .filter-tabs button,
html.theme-dark body.aa-page .arena-app .board-row .rank,
html.theme-dark body.aa-page .arena-app .source-note button {
  color: #c9c6bc;
}
html.theme-dark body.aa-page .arena-app .filter-tabs button.active {
  color: #eceae3;
}
html.theme-dark body.aa-page .arena-app .card-top .agent-tag {
  color: #d5e2c6 !important;
}
html.theme-dark body.aa-page .arena-app .board-row.first {
  background: #2a3324 !important;
}
html.theme-dark body.aa-page .arena-app .board-row.first .rank,
html.theme-dark body.aa-page .arena-app .board-row.first,
html.theme-dark body.aa-page .arena-app .status-date {
  color: #d7e4c8;
}
html.theme-dark body.aa-page .arena-app .x-logo { color: var(--ink); }
html.theme-dark body.archive-page { background: var(--bg); color: var(--ink); }
html.theme-dark body.archive-page h1,
html.theme-dark body.archive-page .archive-card,
html.theme-dark body.archive-page .archive-card h2 { color: var(--ink); }
html.theme-dark body.archive-page .archive-lead a,
html.theme-dark body.archive-page .archive-card a { color: var(--link); }

html.theme-dark form.login,
html.theme-dark .sbc,
html.theme-dark .warn {
  background: var(--surface);
  color: var(--ink);
  border-color: var(--line);
}
html.theme-dark form.login button {
  background: #9ec0ff;
  color: #141613;
}
html.theme-dark .newb { background: #143322; color: #8fd0a8; border-color: #245c38; }
html.theme-dark .fell { background: #3a1814; color: #ffb0a4; border-color: #6a3030; }
html.theme-dark .stl { background: #3a2e14; color: #f0d48a; border-color: #6a5430; }
html.theme-dark .err { color: #ffb0a4; }
html.theme-dark svg text { fill: var(--muted); }

.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-height: 36px;
  margin: 4px 0 4px 8px;
  padding: 0 10px;
  border: 1px solid var(--line, #cfcbc3);
  border-radius: 6px;
  background: var(--surface, #f4f3f0);
  color: var(--ink, #14161a);
  font: inherit;
  font-size: .8125rem;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
}
header .theme-toggle,
.site-head .theme-toggle {
  background: transparent;
  color: var(--dd-text, #f5f5f0);
  border-color: #a0a6b2;
}
.theme-toggle:focus-visible {
  outline: 2px solid var(--link, #0a4ec8);
  outline-offset: 2px;
}
header .theme-toggle:focus-visible,
.site-head .theme-toggle:focus-visible { outline-color: #f5f5f0; }
.theme-toggle .theme-toggle-dark { display: none; }
html.theme-dark .theme-toggle .theme-toggle-light { display: none; }
html.theme-dark .theme-toggle .theme-toggle-dark { display: inline; }

.theme-preview-bar {
  background: #2a201c;
  color: #f5f5f0;
  text-align: center;
  padding: 8px 12px;
  font-size: 14px;
}
.theme-preview-bar p { margin: 0 auto; max-width: 70ch; }
.theme-preview-bar a { color: #ffb199; }

@media (prefers-reduced-motion: no-preference) {
  html.theme-ready body,
  html.theme-ready .card,
  html.theme-ready .spbar,
  html.theme-ready .nbox,
  html.theme-ready .signup,
  html.theme-ready .rc-card,
  html.theme-ready .rw,
  html.theme-ready .arena-app {
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
  }
}
@media (prefers-reduced-motion: reduce) {
  html.theme-ready body,
  html.theme-ready .card,
  html.theme-ready .rc-card,
  html.theme-ready .rw {
    transition: none;
  }
}

/* Go-live contrast and layout fixes (2026-10-25 QA): keep text >= 4.5:1 on the
   grey and dark surfaces, and stop the toggle stretching on /stats/. */
html.theme-light .sbox .sbd,
html.theme-dark .sbox .sbd,
html.theme-light .aa-signup .sbd,
html.theme-dark .aa-signup .sbd { color: var(--muted); }
html.theme-light .kv dt { color: var(--muted); }
html.theme-light .rc-tbl summary { color: var(--link); }
html.theme-dark .dd2-tool .dd2-try { color: #f5f5f0; }
html.theme-dark .arena-app .champion-plaque > span { color: var(--lime, #d3f891); }
html.theme-dark .sm.lbl { color: var(--dd-bg, #0e1016); }
html .theme-toggle { width: auto; max-width: max-content; }
