@layer components{.odd-stage{overscroll-behavior:contain;touch-action:pan-y;background:radial-gradient(80% 50% at 50% 20%, color-mix(in oklab, var(--acc) 22%, #0b0b0e), #0b0b0e 70%);padding-inline:max(24px,50% - 340px);overflow-y:auto}.odd-kicker{letter-spacing:.14em;color:var(--on-dark-dim);align-items:center;gap:8px;margin-top:8px;font-size:12px;font-weight:600;display:flex}.odd-kicker.is-good{color:var(--rn)}.odd-kicker.is-bad{color:#ff8a7a}.odd-big{letter-spacing:-.045em;animation:screen-in .36s var(--ease-out) both;margin-top:10px;font-size:clamp(30px,9cqw,44px);font-weight:600;line-height:1.02}.odd-who{color:var(--c)}.odd-copy{max-width:36ch;color:var(--on-dark-dim);margin-top:14px;font-size:16px;line-height:1.35}.odd-dot{background:var(--c);border-radius:50%;flex:none;width:12px;height:12px;display:inline-block;box-shadow:inset 0 -2px #0003}.odd-names{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:18px;margin-bottom:18px;display:grid}.odd-name{background:#ffffff0f;border-radius:14px;align-items:center;gap:10px;height:44px;padding:0 12px;display:flex;box-shadow:inset 0 0 0 1px #ffffff14}.odd-name:focus-within{box-shadow:inset 0 0 0 2px var(--rn)}.odd-name input{color:#fff;background:0 0;outline:none;flex:1;min-width:0;height:100%;font-size:15px;font-weight:500}.odd-name input::placeholder{color:#ffffff59}.odd-card{color:#0d0d0f;background:linear-gradient(160deg, var(--acc-hi), var(--acc) 55%, var(--acc-lo));touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;width:100%;min-height:220px;transition:transform .2s var(--ease-spring);border-radius:24px;place-items:center;margin-top:18px;display:grid;position:relative;box-shadow:inset 0 1px #ffffff59,inset 0 -4px #00000029,0 20px 40px -16px #0009}.odd-card:active{transform:scale(.98)}.odd-card:focus-visible{outline:3px solid var(--rn);outline-offset:3px}.odd-back{text-align:center;color:#fff;gap:6px;display:grid}.odd-back b{letter-spacing:-.03em;font-size:24px;font-weight:650}.odd-back span{opacity:.8;font-size:14px}.odd-face{border-radius:inherit;letter-spacing:-.05em;text-align:center;color:#0d0d0f;opacity:0;transition:opacity .12s ease, transform .18s var(--ease-out);background:#fbfaf6;place-items:center;padding:16px;font-weight:650;line-height:1;display:grid;position:absolute;inset:0;transform:rotateX(70deg)}.odd-card.is-open .odd-face{opacity:1;transform:none}.odd-clock{aspect-ratio:1;place-items:center;width:min(260px,70cqw);margin:24px auto 0;display:grid;position:relative}.odd-clock svg{position:absolute;inset:0;transform:rotate(-90deg)}.odd-clock circle{fill:none;stroke:#ffffff14;stroke-width:7px}.odd-clock .odd-ring{stroke:var(--rn);stroke-linecap:round;stroke-dasharray:276.5;transition:stroke-dashoffset 1s linear}.odd-clock.is-late .odd-ring{stroke:#ffb020}.odd-clock b{letter-spacing:-.04em;font-size:56px;font-weight:600}.odd-skip{position:absolute;bottom:-64px;left:50%;translate:-50%}.odd-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:20px;display:grid}.odd-pick{text-align:left;color:#fff;min-height:52px;transition:background .16s ease, transform .2s var(--ease-spring);background:#ffffff12;border-radius:16px;align-items:center;gap:10px;padding:0 14px;font-size:16px;font-weight:600;display:flex}.odd-pick span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.odd-pick:active{transform:scale(.96)}.odd-pick.is-on{color:#0d0d0f;background:var(--rn)}.odd-pick:focus-visible{outline:2px solid var(--rn);outline-offset:2px}.odd-flip{color:#0d0d0f;min-height:120px;animation:odd-flip .6s var(--ease-out) both;background:#fbfaf6;border-radius:22px;place-items:center;margin-top:18px;display:grid}.odd-flip span{text-align:center;letter-spacing:-.05em;padding:12px;font-weight:650;line-height:1}@keyframes odd-flip{0%{opacity:0;transform:perspective(600px)rotateY(90deg)}}.odd-answer{color:var(--on-dark-dim);font-size:15px}.odd-answer b{color:#fff}.odd-scores{flex-wrap:wrap;gap:6px;display:flex}.odd-scores span{color:var(--on-dark-dim);background:#ffffff12;border-radius:999px;align-items:center;gap:6px;padding:5px 10px;font-size:13px;display:inline-flex}.odd-scores b{color:#fff}.odd-scores .is-top{color:var(--rn);background:#ccff3d26}@media (prefers-reduced-motion:reduce){.odd-big,.odd-flip,.odd-face{transition:none;animation:none}}}