:root {
  --bg: #f6f5f2;
  --fg: #1d1c1a;
  --muted: #5e5b55;
  --card: #ffffff;
  --line: #dcd9d2;
  --accent: #2f5d50;
  --accent-fg: #ffffff;
  --warn: #8a4b12;
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #161614;
    --fg: #efede8;
    --muted: #a9a59c;
    --card: #1f1f1c;
    --line: #34332f;
    --accent: #7fb9a6;
    --accent-fg: #10201b;
    --warn: #e0a96a;
  }
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  min-height: 100vh;
  min-height: 100dvh;
  display: grid;
  place-items: center;
  padding: 24px 16px;
  background: var(--bg);
  color: var(--fg);
  font: 16px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif;
}
main {
  width: 100%;
  max-width: 26rem;
  padding: 28px 24px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 14px;
}
h1 { margin: 0 0 8px; font-size: 1.35rem; line-height: 1.25; }
p { margin: 0 0 16px; color: var(--muted); }
ol { margin: 0 0 16px; padding-left: 1.25rem; color: var(--muted); }
li { margin-bottom: 6px; }
.mark { margin: 0 0 18px; font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--accent); }
button {
  min-height: 44px;
  padding: 0 20px;
  font: inherit;
  font-weight: 600;
  color: var(--accent-fg);
  background: var(--accent);
  border: 0;
  border-radius: 10px;
}
button:focus-visible { outline: 3px solid var(--fg); outline-offset: 2px; }
[hidden] { display: none; }
body[data-state="working"] h1::after {
  content: "";
  display: inline-block;
  width: 0.9em;
  height: 0.9em;
  margin-left: 0.5em;
  vertical-align: -0.1em;
  border: 2px solid var(--line);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: spin 0.9s linear infinite;
}
body[data-state="problem"] h1 { color: var(--warn); }
@keyframes spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { body[data-state="working"] h1::after { animation: none; } }
body[data-reason="removed"] #retry, body[data-reason="invalid"] #retry { display: none; }