.turntable-fit{justify-content:center;width:100%;display:flex;container-type:inline-size}.turntable{border-radius:var(--radius-lg);border:1px solid var(--color-border);background:color-mix(in srgb, var(--color-surface-2) 55%, transparent);width:248px;height:216px;transition:opacity var(--dur-base) var(--ease-standard);flex:none;position:relative}.turntable[data-frozen=true]{opacity:.6}@container (width<=247px){.turntable{margin-block:-16px;scale:.85}}.turntable-hit{inset-block-start:12px;touch-action:manipulation;-webkit-tap-highlight-color:transparent;border-radius:50%;width:192px;height:192px;position:absolute;left:12px}.turntable-scratch{width:100%;height:100%;transition:transform var(--dur-base) var(--ease-spring);border-radius:50%}.turntable-scratch[data-scratch=true]{transition:transform var(--dur-fast) var(--ease-out);transform:rotate(-40deg)}.turntable-record{border:1px solid var(--color-border);background:conic-gradient(from 20deg, transparent 0deg, color-mix(in srgb, var(--color-fg) 6%, transparent) 22deg, transparent 46deg, transparent 180deg, color-mix(in srgb, var(--color-fg) 6%, transparent) 202deg, transparent 226deg, transparent 360deg), repeating-radial-gradient(circle, var(--color-bg-deep) 0 7px, color-mix(in srgb, var(--color-fg) 7%, var(--color-bg-deep)) 8px 9px);border-radius:50%;place-items:center;width:100%;height:100%;display:grid}.turntable[data-spinning=true] .turntable-record{animation:turntable-spin var(--turntable-rev) linear infinite;will-change:transform}.turntable[data-spinning=true][data-entrance=drop] .turntable-record{animation:turntable-spin-up var(--turntable-spin-up) var(--ease-accelerate) var(--dur-page) 1 both, turntable-spin var(--turntable-rev) linear calc(var(--dur-page) + var(--turntable-spin-up)) infinite}.turntable-label{width:72px;height:72px;color:var(--color-action-ink);background:var(--color-violet-wash);transition:background-color var(--dur-base) var(--ease-standard);border-radius:50%;place-items:center;display:grid;position:relative}.turntable[data-spinning=true] .turntable-label{background:var(--color-brand)}.turntable-glyph{opacity:0;transition:opacity var(--dur-fast) var(--ease-accelerate);place-items:center;display:grid;position:absolute}.turntable-glyph[data-on=true]{opacity:1;transition:opacity var(--dur-base) var(--ease-decelerate) var(--dur-fast)}.turntable-arm{background:var(--color-fg-secondary);transform-origin:50% 0;pointer-events:none;border-radius:999px;width:4px;height:132px;position:absolute;top:26px;left:224px}.turntable-arm[data-arm=travel]{transition:transform var(--turntable-poll) linear}.turntable-arm[data-arm=settle]{transition:transform var(--dur-fast) var(--ease-out)}.turntable-arm[data-arm=drop]{transition:transform var(--dur-page) var(--ease-spring)}.turntable-arm:after{content:"";background:var(--color-fg);border-radius:4px;width:14px;height:20px;position:absolute;bottom:-6px;left:-5px}.turntable-pivot{background:var(--color-surface-2);border:1px solid var(--color-border-strong);pointer-events:none;border-radius:50%;width:20px;height:20px;position:absolute;top:16px;left:216px}.turntable-lamp{background:var(--color-accent-violet);width:8px;height:8px;transition:background-color var(--dur-base) var(--ease-standard);border-radius:50%;position:absolute;bottom:12px;left:222px}.turntable-lamp[data-lamp=live]{background:var(--color-live)}.turntable-lamp[data-lamp=caution]{background:var(--color-warning)}.turntable-lamp[data-lamp=muted]{background:var(--color-fg-muted)}.turntable-lamp[data-breathing=true]{animation:wait-breathe var(--turntable-lamp) var(--ease-standard) infinite}.turntable-meter{height:28px;color:var(--color-border-strong);transition:color var(--dur-base) var(--ease-standard), opacity var(--dur-base) var(--ease-standard);justify-content:center;align-items:flex-end;gap:4px;display:flex}.turntable-meter[data-live=true]{color:var(--color-accent-green)}.turntable-meter[data-frozen=true]{opacity:.6}.turntable-meter>span{transform-origin:50% 100%;background:currentColor;border-radius:2px;width:4px;transform:scaleY(.4)}.turntable-meter[data-live=true]>span{animation:turntable-meter var(--dur-slow) var(--ease-standard) calc(var(--bar) * -137ms) infinite alternate}.turntable-meter[data-live=true][data-entrance=drop]>span{animation-delay:calc(.7s + var(--bar) * 60ms)}.generation-wait[data-active=false] .turntable-record,.generation-wait[data-active=false] .turntable-lamp,.generation-wait[data-active=false] .turntable-meter>span,.generation-wait[data-active=false] .wait-bar-sheen{animation-play-state:paused}.generation-wait[data-active=false] .turntable-arm{transition:none}.wait-bar{background:var(--color-surface-2);border-radius:999px;width:100%;height:6px;position:relative;overflow:hidden}.wait-bar-fill{background:var(--color-accent);transform-origin:0;width:100%;height:100%;transition:transform var(--dur-base) var(--ease-standard);border-radius:999px}[dir=rtl] .wait-bar-fill{transform-origin:100%}.wait-bar-sheen{inset-block:0;background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--color-accent) 70%, transparent), transparent);width:40%;animation:wait-sheen var(--turntable-rev) linear infinite;border-radius:999px;position:absolute;left:0}[dir=rtl] .wait-bar-sheen{animation-direction:reverse}.backstage-eyebrow{letter-spacing:.1em;text-transform:uppercase}.backstage-eyebrow:lang(ar),.backstage-eyebrow:lang(ja),.backstage-eyebrow:lang(ko),.backstage-eyebrow:lang(zh){letter-spacing:normal;text-transform:none}.backstage-line{text-wrap:balance}.backstage-line[data-phase=in]{animation:backstage-in var(--dur-base) var(--ease-decelerate) var(--dur-fast) both}.backstage-line[data-phase=out]{inset-inline:0;animation:backstage-out var(--dur-fast) var(--ease-accelerate) both;position:absolute;top:0}@keyframes turntable-spin-up{0%{transform:rotate(0)}to{transform:rotate(120deg)}}@keyframes turntable-spin{0%{transform:rotate(120deg)}to{transform:rotate(480deg)}}@keyframes turntable-meter{0%{transform:scaleY(.4)}to{transform:scaleY(1)}}@keyframes wait-breathe{0%,to{opacity:1}50%{opacity:.45}}@keyframes wait-sheen{0%{transform:translate(250%)}to{transform:translate(-100%)}}@keyframes backstage-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes backstage-out{0%{opacity:1}to{opacity:0}}@media (hover:hover) and (pointer:fine){.turntable-hit{cursor:grab}.turntable-hit:active{cursor:grabbing}}@media (prefers-reduced-motion:reduce){.generation-wait .turntable-record,.generation-wait .turntable-lamp,.generation-wait .turntable-meter>span,.generation-wait .wait-bar-sheen{animation:none}.generation-wait .turntable-arm,.generation-wait .turntable-scratch,.generation-wait .wait-bar-fill{transition:none}.generation-wait .turntable-scratch[data-scratch=true]{transform:none}.generation-wait .wait-bar-sheen{background:color-mix(in srgb, var(--color-accent) 35%, transparent);width:100%}.generation-wait .backstage-line[data-phase=in]{animation:reveal-fade var(--dur-fast) var(--ease-standard) both}.generation-wait .backstage-line[data-phase=out]{display:none}}:root{--page-travel-dir:1}:root[dir=rtl]{--page-travel-dir:-1}@media (prefers-reduced-motion:no-preference){:root:active-view-transition-type(page-forward)::view-transition-group(page-content){animation-duration:var(--dur-base)}:root:active-view-transition-type(page-back)::view-transition-group(page-content){animation-duration:var(--dur-base)}:root:active-view-transition-type(page-forward)::view-transition-new(page-content){--page-travel-from:calc(24px * var(--page-travel-dir));animation:page-travel-in var(--dur-base) var(--ease-out) both}:root:active-view-transition-type(page-forward)::view-transition-new(page-frame){--page-travel-from:calc(24px * var(--page-travel-dir));animation:page-travel-in var(--dur-base) var(--ease-out) both}:root:active-view-transition-type(page-forward)::view-transition-old(page-content){--page-travel-to:calc(-12px * var(--page-travel-dir));animation:page-travel-out var(--dur-fast) var(--ease-accelerate) both}:root:active-view-transition-type(page-forward)::view-transition-old(page-frame){--page-travel-to:calc(-12px * var(--page-travel-dir));animation:page-travel-out var(--dur-fast) var(--ease-accelerate) both}:root:active-view-transition-type(page-back)::view-transition-new(page-content){--page-travel-from:calc(-24px * var(--page-travel-dir));animation:page-travel-in var(--dur-base) var(--ease-out) both}:root:active-view-transition-type(page-back)::view-transition-new(page-frame){--page-travel-from:calc(-24px * var(--page-travel-dir));animation:page-travel-in var(--dur-base) var(--ease-out) both}:root:active-view-transition-type(page-back)::view-transition-old(page-content){--page-travel-to:calc(12px * var(--page-travel-dir));animation:page-travel-out var(--dur-fast) var(--ease-accelerate) both}:root:active-view-transition-type(page-back)::view-transition-old(page-frame){--page-travel-to:calc(12px * var(--page-travel-dir));animation:page-travel-out var(--dur-fast) var(--ease-accelerate) both}}@keyframes page-travel-in{0%{opacity:0;translate:var(--page-travel-from,0) 0}to{opacity:1;translate:0}}@keyframes page-travel-out{0%{opacity:1;translate:0}to{opacity:0;translate:var(--page-travel-to,0) 0}}
