
:root {
  color-scheme: light dark;
  --paper:#f8f9fa; --ink:#1a1a2e; --blue:#0066cc; --hairline:#dee2e6; --muted:#666;
  --card:#fff; --chip:#eef2f7;
  /* Form-control boundary: a STRONGER border than the decorative --hairline so an input's hit
     region clears WCAG 1.4.11 non-text contrast (>=3:1). #8e959e ~3.02:1 on #fff. */
  --control-border:#8e959e;
}
@media (prefers-color-scheme: dark) {
  :root {
    --paper:#14161b; --ink:#e8e9ec; --blue:#5c9ded; --hairline:#333741; --muted:#8b919c;
    --card:#1d2027; --chip:#232833;
    --control-border:#6d7482; /* ~3.47:1 on the dark --card #1d2027 */
  }
}
* { box-sizing: border-box; }
body { background:var(--paper); color:var(--ink); margin:0 auto; max-width:52rem; padding:0 1rem 4rem;
  font-family: ui-monospace, 'Courier New', Courier, monospace; line-height:1.5; }
a { color:var(--blue); text-decoration:none; } a:hover { text-decoration:underline; }
a:focus-visible, button:focus-visible, summary:focus-visible, textarea:focus-visible, input:focus-visible {
  outline:2px solid var(--blue); outline-offset:2px; }
/* E12 M3: every text control + button carries the livery on EVERY page — the adopt/contest/confirm/
   handoff controls previously rode UA defaults (light-on-light in dark mode, no >=3:1 border). The
   per-class rules below only add layout specifics. */
textarea { font:inherit; width:100%; padding:0.4rem; background:var(--card); color:var(--ink); border:1px solid var(--control-border); }
input[type=text] { font:inherit; padding:0.3rem; background:var(--card); color:var(--ink); border:1px solid var(--control-border); }
button { font:inherit; padding:0.4rem 1.2rem; min-height:1.75rem; cursor:pointer; }
.anon-toggle { display:block; margin:0.4rem 0; font-size:0.85rem; color:var(--muted); }
.idform { margin:0.4rem 0 1rem; }
.idform input { width:100%; max-width:32rem; }
/* E12 L6: post-action feedback + nav affordances get visible shape (were unstyled = body copy). */
.notice { padding:0.5rem 0.7rem; margin:0.5rem 0; background:var(--chip); border-radius:3px; }
.start, .more, .crumb { margin:0.75rem 0; }
.reply-link { margin:0.3rem 0 0; }
.masthead { text-align:center; padding:2rem 0 1rem; border-bottom:1px solid var(--hairline); }
.wordmark { color:var(--ink); font-size:1.6rem; font-weight:bold; overflow-wrap:anywhere; }
.tagline { color:var(--muted); font-size:0.85rem; margin:0.25rem 0 0; }
.utility { display:flex; justify-content:center; gap:0.9rem; flex-wrap:wrap; margin-top:0.65rem; font-size:0.85rem; }
.languages { display:flex; justify-content:center; gap:0.8rem; flex-wrap:wrap; margin-top:0.65rem; font-size:0.8rem; }
.languages [aria-current=page] { color:var(--ink); font-weight:bold; text-decoration:underline; text-underline-offset:0.18rem; }
.composer textarea { width:100%; font:inherit; padding:0.5rem; border:1px solid var(--control-border); background:var(--card); color:var(--ink); }
.composer button { font:inherit; margin-top:0.5rem; padding:0.4rem 1.2rem; min-height:1.75rem; cursor:pointer; }
.posting-consequences { margin:0.4rem 0; padding:0.35rem 0.55rem; border-left:2px solid var(--hairline); color:var(--muted); font-size:0.78rem; }
.posting-consequences p { margin:0.15rem 0; }
.post { border:1px solid var(--hairline); background:var(--card); padding:0.6rem 0.8rem; margin:0.6rem 0; }
.post .body { margin:0 0 0.4rem; white-space:pre-wrap; overflow-wrap:anywhere; }
.post .meta { margin:0; font-size:0.8rem; color:var(--muted); }
.post .author { color:var(--ink); font-weight:bold; }
h1 { overflow-wrap:anywhere; }
.body-preview { margin:0.5rem 0; white-space:pre-wrap; overflow-wrap:anywhere; }
blockquote.draft { white-space:pre-wrap; overflow-wrap:anywhere; }
.threads { list-style:none; padding:0; margin:0.6rem 0; }
.threads li { border-top:1px solid var(--hairline); padding:0.65rem 0; }
.threads li:last-child { border-bottom:1px solid var(--hairline); }
.thread-title { display:inline-block; overflow-wrap:anywhere; font-weight:bold; }
.thread-meta { display:flex; flex-wrap:wrap; gap:0.35rem 0.8rem; margin:0.25rem 0 0; color:var(--muted); font-size:0.75rem; }
.reply-count, .thread-activity { white-space:nowrap; }
.anchor-title { overflow-wrap:anywhere; }
.outcomes li { overflow-wrap:anywhere; }
.tombstone { color:var(--muted); font-style:italic; }
.machine-note, .translation-note { margin:0.15rem 0 0; font-size:0.75rem; color:var(--muted); font-style:italic; overflow-wrap:anywhere; }
.bilingual .original summary { font-size:0.8rem; color:var(--blue); cursor:pointer; padding:0.2rem 0; }
.body-original { margin:0.25rem 0 0; white-space:pre-wrap; overflow-wrap:anywhere; color:var(--muted); }
.tags { margin:0.2rem 0; font-size:0.8rem; }
.tag { display:inline-block; background:var(--chip); color:var(--blue); padding:0.03rem 0.32rem; border-radius:3px; }
.tags-compact { color:var(--muted); }
details.tags-more { display:inline; }
details.tags-more > summary { display:inline; cursor:pointer; color:var(--blue); white-space:nowrap; }
.tags-expanded { display:inline; margin-left:0.15rem; }
details.branch { margin-left:1.25rem; }
details.branch > summary { padding:0.15rem 0; }
details.reply summary, details.report summary, details.author-controls > summary {
  font-size:0.8rem; color:var(--blue); cursor:pointer; padding:0.2rem 0; }
.author-controls { margin-top:0.2rem; }
.author-controls h3 { margin:0.55rem 0 0.2rem; font-size:0.9rem; }
.author-help, .topic-context, .search-meta { color:var(--muted); font-size:0.78rem; }
.author-help { margin:0.2rem 0; }
.search-results { padding-left:1.3rem; }
.search-results li { margin:0.9rem 0; padding-bottom:0.7rem; border-bottom:1px solid var(--hairline); }
.search-thread { font-weight:bold; overflow-wrap:anywhere; }
.search-meta { margin:0.2rem 0; }
.edited { color:var(--muted); font-size:0.85rem; }
.editform textarea { width:100%; font:inherit; padding:0.5rem; border:1px solid var(--control-border); background:var(--card); color:var(--ink); }
.editform input, .withdrawform input { font:inherit; padding:0.3rem; margin:0.35rem 0; width:100%; max-width:24rem; background:var(--card); color:var(--ink); border:1px solid var(--control-border); }
.editform button, .withdrawform button { font:inherit; margin-top:0.35rem; padding:0.4rem 1.2rem; min-height:1.75rem; cursor:pointer; }
.warn { color:var(--muted); font-size:0.85rem; }
.continue { margin-left:1.25rem; font-size:0.9rem; }
.empty, .pending, .error { margin-top:2rem; }
footer.foot { text-align:center; color:var(--muted); font-size:0.8rem; border-top:1px solid var(--hairline);
  margin-top:3rem; padding-top:1rem; }
.family { display:flex; justify-content:center; gap:1rem; flex-wrap:wrap; }
@media (max-width: 32rem) {
  body { padding:0 0.6rem 3rem; }
  .masthead { padding:1.25rem 0 0.75rem; }
  .wordmark { font-size:1.35rem; }
  details.branch { margin-left:0.75rem; }
  .continue { margin-left:0.75rem; }
}
