:root {
  color-scheme: light;
  --ink: #141414;
  --muted: #626262;
  --gold: #bd9300;
  --gold-light: #f5eab8;
  --line: #d8d8d2;
  --paper: #fff;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: "IBM Plex Mono", "Courier New", monospace;
  text-align: center;
  line-height: 1.5;
}
main {
  width: min(100% - 2rem, 48rem);
  min-height: calc(100vh - 2rem);
  margin: 1rem auto;
  padding: clamp(1.5rem, 4vw, 3.5rem);
  border: 1px solid var(--ink);
  border-top: 6px solid var(--ink);
}
main:has(> .admin-meta) {
  width: min(100% - 2rem, 90rem);
  max-width: none;
  display: flex;
  flex-direction: column;
}
main:has(> .admin-meta) > button[data-copy] { align-self:center; }
.mitre { display:block; width:48px; height:48px; margin:0 auto 1rem; color:var(--ink); image-rendering:pixelated; }
header { font-size:1rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
header::after { content:""; display:block; width:2rem; height:4px; margin:1rem auto 0; background:var(--gold); }
h1, h2, h3, button, .button { font-family:inherit; }
h1 { margin:.7rem 0 1.5rem; font-size:clamp(2rem,4vw,3.4rem); line-height:1.08; letter-spacing:-.06em; }
h2 { font-size:clamp(1.15rem,2vw,1.65rem); line-height:1.2; letter-spacing:-.035em; }
p { margin:.7rem 0; }
a { color:var(--ink); text-decoration-color:var(--gold); text-decoration-thickness:2px; text-underline-offset:.2em; }
a:hover { text-decoration-color:var(--ink); }
button, .button {
  display:inline-block; margin:.75rem .25rem; padding:.85rem 1.2rem;
  border:1px solid var(--ink); border-radius:0; background:var(--ink); color:#fff;
  font-size:.85rem; font-weight:700; letter-spacing:.025em; cursor:pointer; text-decoration:none;
  box-shadow:4px 4px 0 var(--gold);
}
button:hover, .button:hover { background:#303030; }
button:focus-visible, a:focus-visible, input:focus-visible, summary:focus-visible { outline:3px solid var(--gold); outline-offset:3px; }
button:disabled { opacity:.4; cursor:not-allowed; box-shadow:none; }
input:not([type=radio]):not([type=checkbox]) { max-width:100%; padding:.8rem; border:1px solid var(--ink); border-radius:0; font:inherit; color:var(--ink); background:#fff; }
input[type=checkbox], input[type=radio] { accent-color:#9d7900; width:1.1rem; height:1.1rem; }
label { display:block; margin:.5rem 0; padding:.9rem 1rem; background:#f8f8f5; border:1px solid var(--line); text-align:left; overflow-wrap:anywhere; }
.qr { align-self:center; width: min(15rem, 100%); height:auto; padding:.6rem; background:#fff; border:1px solid var(--line); image-rendering:pixelated; }
.winner { font-size:clamp(2.5rem,8vw,7rem); line-height:1.05; font-weight:700; overflow-wrap:anywhere; }
.smoke { font-size:1rem; color:var(--muted); }
.smoke-canvas { position:fixed; inset:0; width:100%; height:100%; pointer-events:none; image-rendering:pixelated; z-index:0; }
main { position:relative; z-index:1; }
.waiting { font-size:2rem; }
summary { cursor:pointer; text-decoration:underline; text-decoration-color:var(--gold); text-underline-offset:.2em; }
.admin-meta { margin-top:auto; padding-top:3rem; color:var(--muted); font-size:.75rem; }
.admin-meta p { margin:.35rem 0; }
.admin-meta summary { margin:.75rem 0; }
.admin-meta button { padding:.5rem .7rem; font-size:.7rem; box-shadow:2px 2px 0 var(--gold); }
.lobby-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:.5rem; }
.response-progress { width:100%; margin:1rem auto; }
.response-progress h2 { margin:.5rem 0; }
.response-progress p { color:var(--muted); }
.cardinal-table, .history-table { width:100%; border-collapse:collapse; table-layout:fixed; text-align:left; }
.cardinal-table th, .cardinal-table td, .history-table th, .history-table td { padding:.8rem 1rem; border-bottom:1px solid var(--line); overflow-wrap:anywhere; }
.cardinal-table thead, .history-table thead { border-top:2px solid var(--ink); border-bottom:2px solid var(--ink); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; }
.cardinal-table .pending { background:#f5f5f3; }
.cardinal-table .pending td { color:#555; font-weight:700; }
.cardinal-table .done td { color:#22764a; font-weight:700; }
.candidate-list, .round-results { max-height:none; overflow:visible; }
.candidate-list { display:grid; grid-template-columns:minmax(0,1fr); width:min(100%,42rem); margin:1rem auto 0; border-top:2px solid var(--ink); text-align:left; }
.candidate-list p { margin:0; padding:.7rem .85rem; border-bottom:1px solid var(--line); overflow-wrap:anywhere; }
.candidate-list p:nth-child(even) { background:#f8f8f5; }
.round-results { width:100%; margin:1.5rem auto; text-align:left; }
.round-results h2 { text-align:center; }
.result-list { display:grid; gap:.75rem; }
.result-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(4rem,2fr) auto; gap:.75rem; align-items:center; }
.result-name { overflow-wrap:anywhere; }
.result-track { height:1rem; background:#ecece7; overflow:hidden; }
.result-bar { height:100%; background:var(--gold); }
.result-row.eliminated .result-name { color:#bb242d; }
.result-votes { white-space:nowrap; font-size:.85em; }
@media (min-width: 1100px) { main:has(> .admin-meta) { font-size:1.1rem; } .qr { width:18rem; } }
@media (max-width: 500px) {
  main, main:has(> .admin-meta) { width:100%; min-height:100vh; margin:0; padding:1.5rem 1rem; border-width:4px 0 0; }
  .cardinal-table th, .cardinal-table td, .history-table th, .history-table td { padding:.65rem .4rem; font-size:.82rem; }
  .result-row { grid-template-columns:minmax(0,1fr) auto; }
  .result-track { grid-column:1 / -1; grid-row:2; }
}
