@property --press{syntax:"<number>";inherits:true;initial-value:0}@property --tilt-x{syntax:"<number>";inherits:true;initial-value:0}@property --tilt-y{syntax:"<number>";inherits:true;initial-value:0}.wd-arcade-row{width:100%;container-type:inline-size}.wd-arcade-row-inner{justify-content:center;align-items:flex-start;gap:clamp(12px,6cqw,48px);display:flex}.wd-arcade{--cap-size:clamp(56px, min(30cqw, 13svh), 132px);--bezel-size:calc(var(--cap-size) * 1.45);--travel:calc(var(--cap-size) * .085);--press:0;--wall-now:calc(var(--travel) * (1 - var(--press) * .85));--cap-rest-lift:calc(var(--travel) * -.3);--sink-now:calc(var(--travel) * .2 * var(--press));--cap-scale:calc(1 - var(--press) * .028);--tilt-degrees:9deg;--plastic-glare:color-mix(in oklab, var(--plastic) 40%, white);--plastic-light:color-mix(in oklab, var(--plastic) 74%, white);--plastic-shade:color-mix(in oklab, var(--plastic) 80%, black);--plastic-dark:color-mix(in oklab, var(--plastic) 60%, black);--plastic-deep:color-mix(in oklab, var(--plastic) 44%, black);--well-color:color-mix(in oklab, var(--plastic) 26%, black);align-items:center;gap:calc(var(--cap-size) * .12);color:var(--label-color);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;background:0 0;border:0;flex-direction:column;padding:0;display:inline-flex;position:relative}.wd-arcade[data-size=sm]{--cap-size:52px}.wd-arcade[data-side=a]{--plastic:var(--side-a-cap);--label-color:var(--side-a-label)}.wd-arcade[data-side=b]{--plastic:var(--side-b-cap);--label-color:var(--side-b-label)}.wd-arcade[data-side=gold]{--plastic:var(--wd-gold-cap);--label-color:var(--wd-gold-ink)}.wd-arcade:disabled{cursor:default}.wd-bezel{width:var(--bezel-size);height:var(--bezel-size);perspective:calc(var(--cap-size) * 5);box-shadow:0 calc(var(--cap-size) * .07) calc(var(--cap-size) * .14) #00000061, 0 calc(var(--cap-size) * .02) calc(var(--cap-size) * .04) #00000047, 0 0 0 1px #00000024;border-radius:9999px;place-items:center;display:grid;position:relative}.wd-bezel>*,.wd-cap>*{border-radius:9999px;position:absolute}.wd-well{background:var(--well-color);box-shadow:inset 0 calc(var(--cap-size) * .06) calc(var(--cap-size) * .08) #000000a6, inset 0 calc(var(--cap-size) * -.01) calc(var(--cap-size) * .02) #ffffff14;inset:12.4%}.wd-lip{background:linear-gradient(330deg, #ffffff57 0%, #ffffff14 30%, transparent 48%, #0003 70%, #00000073 100%), var(--plastic-shade);inset:0;-webkit-mask:radial-gradient(closest-side,#0000 75.2%,#000 75.7% 78.5%,#0000 81.5%);mask:radial-gradient(closest-side,#0000 75.2%,#000 75.7% 78.5%,#0000 81.5%)}.wd-ring{background:radial-gradient(42% 28% at 30% 16%, #ffffff8c 0%, #ffffff2e 55%, transparent 100%), linear-gradient(150deg, #ffffff5c 0%, #ffffff1a 28%, transparent 46%, #00000029 64%, #0000007a 100%), radial-gradient(closest-side, var(--plastic-deep) 75.2%, var(--plastic-dark) 78%, var(--plastic-shade) 82%, var(--plastic) 88%, var(--plastic) 92%, var(--plastic-shade) 96.5%, var(--plastic-deep) 100%);inset:0;-webkit-mask:radial-gradient(closest-side,#0000 75.2%,#0000008c 75.7%,#000 79%);mask:radial-gradient(closest-side,#0000 75.2%,#0000008c 75.7%,#000 79%)}.wd-cap{z-index:1;width:var(--cap-size);height:var(--cap-size);transform:translateY(calc(var(--cap-rest-lift) + var(--sink-now))) scale(var(--cap-scale)) rotateX(calc(var(--tilt-y) * -1 * var(--tilt-degrees))) rotateY(calc(var(--tilt-x) * var(--tilt-degrees)));will-change:transform;position:relative}.wd-cap-wall{transform:translateY(var(--wall-now));background:linear-gradient(90deg, var(--plastic-dark) 0%, var(--plastic-deep) 50%, color-mix(in oklab, var(--plastic) 34%, black) 100%);box-shadow:0 calc(var(--cap-size) * .025) calc(var(--cap-size) * .05) #000000a6, inset 0 calc(var(--cap-size) * -.02) calc(var(--cap-size) * .02) #0006;inset:0}.wd-cap-face{background:radial-gradient(closest-side, transparent 68%, #0000000d 82%, #00000021 90%, #fff3 94%, #0003 97.5%, #00000080 100%), radial-gradient(100% 100% at 58% 70%, transparent 22%, #0000001f 60%, #00000061 100%), var(--plastic);inset:0}.wd-cap-face:before{content:"";background:radial-gradient(34% 22% at 38% 24%, var(--plastic-glare) 0%, transparent 100%), radial-gradient(74% 66% at 42% 32%, var(--plastic-light) 0%, transparent 70%);opacity:calc(1 - var(--press) * .55);border-radius:9999px;position:absolute;inset:0}.wd-cap-face:after{content:"";box-shadow:inset 0 calc(var(--press) * var(--cap-size) * .07) calc(var(--press) * var(--cap-size) * .1) #0000007a;border-radius:9999px;position:absolute;inset:0}.wd-label{max-width:calc(var(--bezel-size) * 1.5);font-size:calc(var(--cap-size) * .145);letter-spacing:.05em;text-align:center;text-transform:uppercase;overflow-wrap:anywhere;font-weight:800;line-height:1.15}.wd-arcade[data-size=sm] .wd-label{font-size:.8125rem}.wd-arcade[data-state=voted]{--press:.8}.wd-arcade[data-pressed=true],.wd-arcade[data-state=locked]{--press:1}.wd-arcade[data-state=voted] .wd-label{color:var(--foreground)}.wd-arcade[data-state=locked]{opacity:.55;filter:saturate(.65)brightness(.85)}@media (prefers-reduced-motion:no-preference){.wd-arcade{--spring:linear(0, .47 5.5%, .86 11%, 1.11 19%, 1.05 29%, .97 41%, 1.015 54%, .995 68%, 1);transition:--press .28s var(--spring), --tilt-x .24s var(--spring), --tilt-y .24s var(--spring)}.wd-arcade[data-pressed=true]{transition:--press 45ms cubic-bezier(.4,0,.8,.6),--tilt-x 70ms ease-out,--tilt-y 70ms ease-out}.wd-bezel{transition:transform .28s var(--spring)}.wd-arcade[data-pressed=true] .wd-bezel{transition:transform 60ms ease-out;transform:scale(.988)}.wd-arcade[data-state=locked]{transition-delay:.11s}}.wd-arcade:focus-visible{outline:none}.wd-arcade:focus-visible .wd-bezel{outline:3px solid var(--ring);outline-offset:calc(var(--bezel-size) * .05)}.wd-arcade[data-layout=inline]{flex-direction:row;align-items:center;gap:.85rem}.wd-arcade[data-layout=inline] .wd-label{text-align:left;min-width:10.5rem;max-width:none}