.game{grid-template:"case head""case ctrl"1fr/minmax(0,520px) minmax(0,1fr);align-items:start;column-gap:40px;padding:16px 0 32px;display:grid}.game-head{grid-area:head;padding-top:8px}.game-head h1{margin:0 0 8px}.game-date{color:var(--color-muted);margin:0 0 12px}.game-how{max-width:40ch;margin:0}.case{grid-area:case}.game-ctrl,.end{grid-area:ctrl;padding-top:24px}@media (width<=959px){.game{grid-template-rows:none;grid-template-columns:minmax(0,1fr);grid-template-areas:"head""case""ctrl";max-width:560px;margin:0 auto;padding-top:12px}.game-head{padding:0 0 12px}.game-head h1,.game-date{margin-bottom:4px}.game-ctrl,.end{padding-top:16px}}@media (width<=640px){.game{padding-top:8px}.game-head{padding-bottom:8px}.game-how{display:none}.game-date{margin:0}.game-ctrl,.end{padding-top:12px}}.case{background:var(--color-felt);box-shadow:var(--shadow-case);border-radius:20px;padding:16px}.sets,.cards{gap:12px;display:grid}.cards{grid-template-columns:repeat(4,minmax(0,1fr))}.sets:not(:empty)+.cards:not(:empty){margin-top:12px}@media (width<=640px){.case{border-radius:16px;padding:8px}.sets,.cards{gap:8px}.sets:not(:empty)+.cards:not(:empty){margin-top:8px}}.card{appearance:none;font:inherit;color:var(--color-ink);text-align:left;cursor:pointer;perspective:900px;-webkit-tap-highlight-color:transparent;transition:transform var(--dur-short) var(--ease-out);background:0 0;border:0;border-radius:10px;margin:0;padding:0}.card-in{transform-style:preserve-3d;transition:transform .45s var(--ease-out) var(--delay,0s);display:grid;position:relative}.card-front,.card-back{-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:10px;grid-area:1/1}.card-front{background:var(--color-card);box-shadow:var(--shadow-card);transition:background-color var(--dur-short) var(--ease-out), box-shadow var(--dur-short) var(--ease-out);gap:4px;padding:4px;display:grid}.face{aspect-ratio:1;object-fit:cover;background:var(--color-page-3);border-radius:6px;width:100%;height:auto;display:block}.face.none{font:700 var(--text-2xl)/1 var(--font-display);color:var(--color-muted);place-items:center;display:grid}.plate{min-width:0;padding:0 8px 4px;display:grid;container-type:inline-size}.fn{font-size:var(--text-xs);color:var(--color-muted);white-space:nowrap;text-overflow:ellipsis;line-height:1.25;overflow:hidden}.sn{min-width:0;font:700 max(12px, min(var(--text-lg), calc(100cqi / (var(--n) * .46)))) / 1.15 var(--font-display);white-space:nowrap}.card:hover .card-front{box-shadow:var(--shadow-card), inset 0 0 0 2px var(--color-felt-ink)}.card:active{transform:translateY(1px)}.card:focus-visible{outline:3px solid var(--color-page);outline-offset:3px}.card[aria-pressed=true]{transform:translateY(-6px)rotate(-1.5deg)}.card:nth-child(2n)[aria-pressed=true]{transform:translateY(-6px)rotate(1.5deg)}.card[aria-pressed=true] .card-front{background:var(--color-red);box-shadow:var(--shadow-lift)}.card[aria-pressed=true] .fn,.card[aria-pressed=true] .sn{color:var(--color-card)}.card.nudge .card-front{box-shadow:var(--shadow-lift), 0 0 0 3px var(--color-l0)}@media (width<=640px){.card-front{gap:2px}.plate{padding:0 4px 2px}.sn{font-size:max(12px, min(1.0625rem, calc(100cqi / (var(--n) * .46))))}}@media (width<=360px){.plate{padding:0 0 4px}}.card-back{text-align:center;background:var(--color-card);align-content:center;justify-items:center;gap:4px;padding:8px;display:grid;transform:rotateY(180deg);container-type:inline-size}.card.l0 .card-back{background:var(--color-l0)}.card.l1 .card-back{background:var(--color-l1)}.card.l2 .card-back{background:var(--color-l2)}.card.l3 .card-back{background:var(--color-l3)}.back-fact{font:700 clamp(var(--text-sm), 14cqi, var(--text-xl)) / 1.1 var(--font-display);text-transform:uppercase;overflow-wrap:break-word;min-width:0}.back-name{font-size:var(--text-xs)}.card.flip .card-in{transform:rotateY(180deg)}.card.flip{cursor:default;transform:none}.set{min-height:104px;color:var(--color-ink);border-radius:12px;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:16px;padding:12px 16px;display:grid;position:relative;overflow:hidden}.set.l0{background:var(--color-l0)}.set.l1{background:var(--color-l1)}.set.l2{background:var(--color-l2)}.set.l3{background:var(--color-l3)}.set.missed{outline:2px dashed var(--edge-strong);outline-offset:-6px}.set-faces{display:flex}.set-faces img,.set-faces .mini{object-fit:cover;background:var(--color-page-3);width:56px;height:56px;box-shadow:0 0 0 2px var(--color-card);border-radius:8px;margin-left:-12px}.set-faces>:first-child{margin-left:0}.mini{font:700 var(--text-md)/1 var(--font-display);color:var(--color-muted);place-items:center;display:grid}.set-text{gap:4px;min-width:0;display:grid}.set-name{font:700 var(--text-lg)/1.1 var(--font-display);text-transform:uppercase}.set-who{font-size:var(--text-sm)}@media (width<=640px){.set{gap:12px;min-height:0;padding:12px}.set-faces img,.set-faces .mini{border-radius:6px;width:36px;height:36px;margin-left:-8px}.set-name{font-size:var(--text-md)}}.set:after{content:"";background:linear-gradient(105deg, transparent 35%, var(--color-sheen) 50%, transparent 65%);pointer-events:none;position:absolute;inset:0;transform:translate(-120%)}.sets.won .set:after{animation:foil 1.1s var(--ease-out) forwards}.sets.won .set:nth-child(2):after{animation-delay:.12s}.sets.won .set:nth-child(3):after{animation-delay:.24s}.sets.won .set:nth-child(4):after{animation-delay:.36s}@keyframes foil{to{transform:translate(120%)}}.lives{color:var(--color-ink-2);align-items:center;gap:8px;margin:0 0 16px;display:flex}.lives>span:first-child{margin-right:4px}.ball{fill:none;width:24px;height:24px;stroke:var(--color-ink);stroke-width:1.75px;stroke-linecap:round;stroke-linejoin:round;transition:opacity var(--dur-long) var(--ease-out)}.ball.spent{opacity:.2}.controls{flex-wrap:wrap;gap:8px;display:flex}.note{min-height:1.5em;margin:12px 0 0;font-weight:600}@media (width<=640px){.lives{justify-content:center;margin-bottom:12px}.controls{grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.controls .btn{padding:12px 8px}.note{text-align:center}}.end-card{border-radius:var(--radius);background:var(--color-card);max-width:520px;box-shadow:var(--shadow);gap:16px;padding:24px;display:grid}.end-card h2{margin:0}.end-grid{justify-content:start;gap:4px;display:grid}.end-grid .row{gap:4px;display:flex}.sq{border-radius:4px;width:24px;height:24px}.sq.l0{background:var(--color-l0)}.sq.l1{background:var(--color-l1)}.sq.l2{background:var(--color-l2)}.sq.l3{background:var(--color-l3)}.end-stats{flex-wrap:wrap;gap:24px;margin:0;display:flex}.end-stats div{gap:4px;display:grid}.end-stats dt{font-size:var(--text-sm);color:var(--color-muted)}.end-stats dd{font:700 var(--text-2xl)/1 var(--font-display);margin:0}.end-next{color:var(--color-ink-2);margin:0}.share-box{gap:8px;display:grid}.share-box textarea{width:100%;font:inherit;color:var(--color-ink);background:var(--color-page-2);border:1px solid var(--edge-strong);border-radius:var(--radius-sm);resize:vertical;padding:12px}.sets-page{margin-top:16px}.answers-y .muted{margin:0}.arch{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin-top:16px;display:grid}.arch a{background:var(--color-card);box-shadow:var(--shadow-card);color:var(--color-ink);transition:background-color var(--dur-short) var(--ease-out);border-radius:10px;gap:4px;padding:12px 16px;text-decoration:none;display:grid}.arch a:hover{background:var(--color-page-2)}.arch a:active{transform:translateY(1px)}.arch b{font:700 var(--text-xl)/1 var(--font-display)}.arch span{font-size:var(--text-sm);color:var(--color-muted)}.arch-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.arch-head h2{margin:0}.arch a.won{box-shadow:inset 4px 0 0 var(--color-l1), var(--shadow-card)}.arch a.done{box-shadow:inset 4px 0 0 var(--color-page-3), var(--shadow-card)}.arch a.started{box-shadow:inset 4px 0 0 var(--color-l0), var(--shadow-card)}.arch .mark{font-style:normal;font-size:var(--text-xs);color:var(--color-ink-2);font-weight:600}.credits{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin:0;padding:0;list-style:none;display:grid}.credits li{align-items:center;gap:12px;display:flex}.credits img{object-fit:cover;background:var(--color-page-3);border-radius:8px;width:56px;height:56px}.game-more{flex-wrap:wrap;gap:8px 24px;margin:24px 0 0;display:flex}.game-more a{padding:4px 0;font-weight:600;display:inline-block}@media (width<=640px){.game-more{justify-content:center;margin-top:16px}}.section h3{margin:40px 0 8px}.section h2+h3{margin-top:40px}.sets-page .set{min-height:0}.section h3+.sets-page{margin-top:0}.controls.quiet{margin-top:8px}.btn-quiet{border-color:var(--color-page-3);min-height:44px;color:var(--color-ink-2);padding:8px 16px}.btn-quiet:hover{border-color:var(--color-ink-2);background:var(--color-page-2)}.btn-quiet[data-sure]{border-color:var(--color-red);color:var(--color-red-2)}.hints{gap:8px;margin:12px 0 0;padding:0;list-style:none;display:grid}.hints:empty{display:none}.hints li{align-items:center;gap:8px;font-weight:600;display:flex}.hints .sq{flex:none;width:16px;height:16px}@media (width<=640px){.controls.quiet{grid-template-columns:repeat(2,minmax(0,1fr))}}.link-btn{appearance:none;font:inherit;color:var(--color-ink);text-decoration:underline;text-decoration-color:var(--color-red);text-underline-offset:3px;cursor:pointer;background:0 0;border:0;margin-left:8px;padding:4px 0;font-weight:600;text-decoration-thickness:2px}.link-btn:hover{color:var(--color-red-2)}.link-btn:active{color:var(--color-ink-2)}dialog.how{border-radius:var(--radius);background:var(--color-card);width:min(100% - 32px,440px);max-width:none;color:var(--color-ink);box-shadow:var(--shadow);border:0;padding:24px}dialog.how::backdrop{background:var(--color-scrim)}dialog.how h2{margin:0 0 12px}dialog.how ol{gap:8px;margin:0 0 16px;padding-left:1.2em;display:grid}dialog.how form{justify-content:flex-end;display:flex}dialog.how[open]{animation:how-in var(--dur-long) var(--ease-out)}@keyframes how-in{0%{opacity:0;transform:scale(.96)}}@media (prefers-reduced-motion:reduce){.card,.card-in,.card-front,.ball{transition:none}.card[aria-pressed=true],.card:nth-child(2n)[aria-pressed=true]{transform:none}.sets.won .set:after,dialog.how[open]{animation:none}}
