:root {
  --bg: #fbfaf7; --fg: #1d1c1a; --muted: #6b675f; --line: #e3dfd6; --card: #ffffff;
  --good: #1f7a44; --good-bg: #dff3e6; --bad: #b3261e; --bad-bg: #fbe1de; --mid-bg: #f3ecd9; --mid: #6d5a1e;
  --accent: #2a5bd7; --tip-bg: #1d1c1a; --tip-fg: #fbfaf7;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #15161a; --fg: #ecebe8; --muted: #a09c94; --line: #2c2e35; --card: #1c1e23;
    --good: #7fd6a0; --good-bg: #1d3a2a; --bad: #ff9a90; --bad-bg: #44211e; --mid-bg: #3a3420; --mid: #e8d48a;
    --accent: #8eb1ff; --tip-bg: #ecebe8; --tip-fg: #15161a;
  }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--fg); font: 15px/1.45 system-ui, -apple-system, "Segoe UI", sans-serif; }
header { display: flex; gap: 18px; align-items: baseline; flex-wrap: wrap; padding: 14px 20px 6px; }
h1 { font-size: 18px; margin: 0; letter-spacing: .02em; }
nav a { color: var(--muted); margin-right: 14px; text-decoration: none; font-size: 14px; }
nav a:hover { color: var(--fg); }
main { padding: 0 20px 60px; max-width: 1400px; }
section { margin: 18px 0 34px; }
h2 { font-size: 15px; margin: 0 0 8px; }
.muted { color: var(--muted); }
.scroll { overflow-x: auto; }
table { border-collapse: collapse; background: var(--card); color: var(--fg); }
th, td { border-bottom: 1px solid var(--line); padding: 6px 8px; text-align: left; vertical-align: middle; }
th { font-weight: 600; font-size: 13px; color: var(--muted); white-space: nowrap; }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }
.play { width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--line); background: var(--card); color: var(--fg); cursor: pointer; font-size: 12px; }
.play.on { background: var(--accent); color: var(--bg); border-color: var(--accent); }
.verdict { display: inline-block; padding: 1px 8px; border-radius: 10px; font-size: 12px; white-space: nowrap; }
.rejected { background: var(--bad-bg); color: var(--bad); }
.accepted { background: var(--good-bg); color: var(--good); }
.unclear { background: var(--mid-bg); color: var(--mid); }
.score { display: inline-block; min-width: 28px; text-align: center; padding: 2px 4px; border-radius: 4px; font-variant-numeric: tabular-nums; font-size: 13px; cursor: default; }
.agree { background: var(--good-bg); color: var(--good); }
.disagree { background: var(--bad-bg); color: var(--bad); }
.neutral { background: var(--mid-bg); color: var(--mid); }
.req { max-width: 340px; }
.scene { color: var(--muted); font-size: 13px; }
.cands { display: flex; flex-wrap: wrap; gap: 8px; }
.cand { border: 1px solid var(--line); border-radius: 8px; padding: 6px 8px; background: var(--card); color: var(--fg); display: flex; gap: 8px; align-items: center; font-size: 13px; }
.cand a { color: var(--accent); }
ul.plain { margin: 0; padding-left: 18px; max-width: 900px; }
ul.plain li { margin: 3px 0; }
p.prose { max-width: 900px; margin: 0; }
#tip { position: fixed; z-index: 10; max-width: 360px; background: var(--tip-bg); color: var(--tip-fg); padding: 6px 9px; border-radius: 6px; font-size: 13px; pointer-events: none; white-space: pre-line; }
.error { color: var(--bad); }