/* Party mode additions. Uses the tokens defined in index.html. */
.qrbox{background:var(--paper);padding:10px;border-radius:14px;align-self:center;width:min(100%,300px)}
.qrbox canvas{display:block;width:100%;height:auto;image-rendering:pixelated}
.center{text-align:center}
.chips{display:flex;flex-wrap:wrap;gap:8px;min-height:38px}
.chips span{background:var(--deep);border:1.5px solid var(--line);border-radius:999px;padding:6px 14px;font-weight:700}
.chips span.off{opacity:.45}
.seg{display:inline-flex;border:1.5px solid var(--line);border-radius:999px;overflow:hidden}
.seg button{background:transparent;border:0;padding:9px 16px;cursor:pointer;color:var(--muted)}
.seg button[aria-pressed="true"]{background:var(--brass);color:var(--ink);font-weight:700}
.board{list-style:none;margin:0;padding:0;display:grid;gap:6px;counter-reset:pos}
.board li{counter-increment:pos;display:flex;justify-content:space-between;gap:10px;background:var(--deep);border-radius:10px;padding:10px 14px;font-variant-numeric:tabular-nums}
.board li::before{content:counter(pos);color:var(--muted);width:1.6em}
.board li b{flex:1;overflow-wrap:anywhere}
.board li:first-child{box-shadow:inset 0 0 0 1.5px var(--brass)}
.board li i{font-style:normal;color:var(--right);font-size:14px;align-self:center}
.status{font-family:var(--display);font-weight:800;font-size:clamp(26px,7vw,38px);line-height:1.1;text-wrap:balance}
.opts.big .opt{padding:20px 16px;font-size:19px}
div.opt{cursor:default}
.mode.wide{grid-column:1/-1;border-color:var(--brass)}
.err{color:var(--wrong)}
.opt.picked{border-color:var(--brass)}