.setwrap{max-width:860px;margin:0 auto;padding:0 var(--gut) 72px}
.setwrap h1{font-size:clamp(30px,6vw,52px);font-variation-settings:var(--wonk);
  margin:26px 0 8px;text-wrap:balance}
.setwrap h1 b{background:var(--teal-vivid);color:var(--on-vivid);
  border:2px solid var(--ink);padding:0 10px 2px;border-radius:4px;
  display:inline-block;transform:rotate(-1.4deg)}
.setwrap .lede{color:var(--ink-2);font-size:17.5px;max-width:54ch}
.setnote{font-size:14.5px;color:var(--ink-3);margin:10px 0 30px}
.mu{border:2px solid var(--ink);border-radius:var(--rad);background:var(--surface);
  padding:20px 20px 16px;margin:0 0 22px;box-shadow:4px 4px 0 var(--line)}
.mu h2{font-size:22px;font-variation-settings:var(--wonk);margin:0 0 3px;
  text-wrap:balance}
.mu .msub{color:var(--ink-3);font-size:14.5px;margin:0 0 16px}
.mvs{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;
  align-items:stretch}
@media (max-width:560px){
  .mvs{grid-template-columns:1fr}
  .mvs .mid{padding:2px 0}
}
.side{display:flex;flex-direction:column;gap:6px;text-align:left;
  background:var(--ground);border:2px solid var(--line);
  border-radius:var(--rad-sm);padding:14px 15px;font:inherit;color:var(--ink);
  cursor:pointer;width:100%;
  transition:border-color .12s ease,transform .08s ease}
.side:hover{border-color:var(--teal-vivid);transform:translateY(-2px)}
.side:active{transform:translateY(0)}
.side:focus-visible{outline:3px solid var(--teal-vivid);outline-offset:2px}
.side .pname{font-family:var(--display);font-weight:800;font-size:18px;
  line-height:1.15}
.side .pitem{color:var(--ink-2);font-size:14.5px}
.side .pwhere{color:var(--ink-3);font-size:12.5px;font-family:var(--mono)}
.ringwrap{position:relative;margin:4px 0 14px;border-radius:var(--rad-sm);
  overflow:hidden;background:var(--ground)}
.ringwrap canvas{display:block;width:100%;height:210px}
@media (max-width:560px){.ringwrap canvas{height:168px}}
.mvs{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:stretch}
@media (max-width:560px){.mvs{grid-template-columns:1fr}}
.side{position:relative}
.side::before{content:"";position:absolute;top:-1px;left:14px;right:auto;
  width:34px;height:5px;border-radius:0 0 3px 3px}
.side[data-k="a"]::before{background:var(--teal-vivid)}
.side[data-k="b"]::before{background:var(--amber-vivid)}
.mu.voted .side{cursor:default;transform:none}
.mu.voted .side:hover{border-color:var(--line);transform:none}
.mu.voted .side[data-k="a"].win,
.mu.voted .side[data-k="a"].you{border-color:var(--teal-vivid)}
.mu.voted .side[data-k="b"].win,
.mu.voted .side[data-k="b"].you{border-color:var(--amber-vivid)}
.mu.voted .side.you{box-shadow:0 0 0 1px currentColor inset}
.mu.voted .side.you::after{content:"your pick";align-self:flex-start;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3);margin-top:2px}
.mres{margin-top:14px}
.mres .vsplit{height:12px;border-radius:99px;overflow:hidden;
  background:var(--line);display:flex}
.mres .vsplit i{display:block;height:100%}
.mres .vsplit .ia{background:var(--teal-vivid)}
.mres .vsplit .ib{background:var(--amber-vivid)}
.mres .nums{display:flex;justify-content:space-between;margin-top:7px;
  font-family:var(--mono);font-size:12.5px;color:var(--ink-3)}
.mres .nums b{color:var(--ink);font-size:14px}
.mfoot{margin-top:12px;font-size:13px;color:var(--ink-3)}
.mfoot a{color:var(--ink-2)}
.mclosed{font-family:var(--mono);font-size:11.5px;text-transform:uppercase;
  letter-spacing:.07em;color:var(--ink-3);border:1px solid var(--line);
  border-radius:99px;padding:3px 9px;white-space:nowrap;
  display:inline-block}
@media (max-width:560px){
  .mres .nums{display:grid;grid-template-columns:1fr;gap:3px}
  .mres .nums span:last-child{text-align:right}
}
.setempty{border:2px dashed var(--line);border-radius:var(--rad);
  padding:26px 22px;color:var(--ink-2)}
