.zc-card {
  margin: 26px 0;
  padding: clamp(16px, 4vw, 28px);
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--surface);
}
.zc-card h2 { margin-top: 0; }
.zc-position { max-width: 340px; margin: 16px auto; }
.zc-board { display: block; width: 100%; height: auto; }
.zc-board text { fill: var(--muted); text-anchor: middle; font-size: 13px; }
.zc-w { color: #172239; --piece-fill: #fffdf6; }
.zc-b { color: #fffdf6; --piece-fill: #172239; }
.zc-piece .sh { fill: var(--piece-fill); stroke: currentColor; stroke-width: 1.4; }
.zc-piece .eye { fill: currentColor; }
.zc-choices:not([hidden]) { display: flex; flex-wrap: wrap; gap: 8px; }
.zc-choices button {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 7px 16px;
  background: var(--bg);
  color: var(--ink);
  font: inherit;
  font-weight: 650;
  cursor: pointer;
}
.zc-choices button[aria-pressed="true"] { border-color: var(--ink); background: var(--ink); color: var(--bg); }
.zc-choices button:focus-visible, .zc-answer summary:focus-visible { outline: 3px solid var(--dot); outline-offset: 3px; }
.zc-feedback { flex-basis: 100%; margin: 0; }
.zc-feedback:not(:empty) { margin: 8px 0 12px; }
.zc-answer { margin-top: 14px; }
.zc-answer summary { cursor: pointer; font-weight: 650; }
#zetcheck-score { font-weight: 700; }
