.coin{position:relative;display:grid;justify-items:center;width:240px;height:280px;margin-top:8px;perspective:900px}.coin-toss{width:200px;height:200px;margin-top:30px}.coin-spin{position:relative;width:100%;height:100%;transform-style:preserve-3d}.coin-spin[data-face=Tails]{transform:rotateX(180deg)}.coin-face{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:2px;border:10px solid var(--pk-sun-edge);border-radius:50%;background:radial-gradient(circle at 35% 30%,color-mix(in srgb,white 45%,var(--pk-sun)),var(--pk-sun) 55%);box-shadow:inset 0 0 0 5px color-mix(in srgb,var(--pk-ink) 12%,transparent);color:var(--pk-ink);font-family:var(--pk-display);font-size:30px;font-weight:900;letter-spacing:-.03em;backface-visibility:hidden}.coin-heads img{width:72px;height:72px;border-radius:50%;object-fit:cover}.coin-tails{font-size:44px;transform:rotateX(180deg)}.coin-shadow{position:absolute;bottom:18px;width:150px;height:18px;border-radius:50%;background:color-mix(in srgb,var(--pk-ink) 22%,transparent);filter:blur(3px)}.coin[data-rolling] .coin-toss{animation:coin-toss 1.1s cubic-bezier(.3,.7,.4,1) both}.coin[data-rolling] .coin-spin{animation:coin-spin 1.1s cubic-bezier(.25,.6,.3,1) both}.coin[data-rolling] .coin-shadow{animation:coin-shadow 1.1s cubic-bezier(.3,.7,.4,1) both}.coin:not([data-rolling]) .coin-spin[data-face] .coin-face{animation:coin-glow .7s ease-out both}.coin-tally{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;font-size:14px;font-weight:600}.coin-tally strong{margin-left:4px;font-family:var(--pk-display);font-size:26px;font-weight:900;font-variant-numeric:tabular-nums}.coin-tally small{color:var(--pk-muted);font-size:13px}@keyframes coin-toss{0%{transform:translateY(0) scale(1)}45%{transform:translateY(-46px) scale(1.12)}80%{transform:translateY(4px) scale(.98)}to{transform:translateY(0) scale(1)}}@keyframes coin-spin{0%{transform:rotateX(0)}to{transform:rotateX(var(--coin-end))}}@keyframes coin-shadow{45%{transform:scale(.6);opacity:.5}}@keyframes coin-glow{0%{box-shadow:inset 0 0 0 5px color-mix(in srgb,var(--pk-ink) 12%,transparent),0 0 color-mix(in srgb,var(--pk-sun) 70%,transparent)}to{box-shadow:inset 0 0 0 5px color-mix(in srgb,var(--pk-ink) 12%,transparent),0 0 0 28px color-mix(in srgb,var(--pk-sun) 0%,transparent)}}@media(max-width:959px){.coin{height:236px;margin-top:0}.coin-toss{width:168px;height:168px;margin-top:26px}}@media(prefers-reduced-motion:reduce){.coin[data-rolling] .coin-toss,.coin[data-rolling] .coin-spin,.coin[data-rolling] .coin-shadow,.coin:not([data-rolling]) .coin-spin[data-face] .coin-face{animation:tk-fade .24s ease-out both}}