.hx-player{gap:var(--hx-spacing-scale-md);max-width:56rem;display:grid}.hx-player__stage{position:relative}.hx-player__card{aspect-ratio:3;border-radius:var(--hx-radius-scale-card);box-shadow:inset 0 0 0 1px var(--hx-color-line-hairline);background-color:#0000;position:relative;overflow:hidden}.hx-player__card .hx-preview__surface{fill:#0000}.hx-player__card--animated{padding:3.33333%}.hx-player__card--framed>svg{width:100%;height:auto;display:block}.hx-player__wave{align-items:center;column-gap:calc(100% / (3 * var(--hx-bar-count,48) - 1));height:100%;display:flex;position:relative}.hx-player__bar{z-index:1;height:calc(var(--hx-bar-height,.08) * 100%);background-color:var(--hx-color-waveform-bar-from);transform:scaleY(var(--hx-bar-amp,1));transform-origin:50%;will-change:transform;border-radius:999px;flex:1 1 0;position:relative}.hx-player__bar:after{content:"";border-radius:inherit;background-color:var(--hx-color-waveform-bar-to);opacity:max(var(--hx-bar-sharpness,0), var(--hx-bar-energy,0));position:absolute;inset:0}.hx-player__bar--transient{background-color:var(--hx-color-event-transient,var(--hx-color-waveform-bar-to))}.hx-player__bar--transient:after{background-color:color-mix(in oklab, var(--hx-color-event-transient,var(--hx-color-waveform-bar-to)) 55%, var(--hx-color-ink-primary));opacity:var(--hx-bar-energy,0)}.hx-player__capsule{top:50%;left:calc(var(--hx-cap-start,0) * 100%);width:min(max(calc(var(--hx-cap-width,0) * 100%), calc(200% / (3 * var(--hx-bar-count,48) - 1))), calc((1 - var(--hx-cap-start,0)) * 100%));height:calc(var(--hx-cap-height,.22) * 100%);background-image:linear-gradient(to top, var(--hx-color-waveform-bar-from), var(--hx-color-waveform-bar-to));opacity:calc(.35 * (1 + .5 * var(--hx-cap-energy,0)));border-radius:999px;position:absolute;transform:translateY(-50%)}.hx-player__playhead{z-index:2;top:4%;bottom:4%;left:calc(var(--hx-playhead-x,0) * 100%);background-color:var(--hx-color-accent-copper);opacity:0;border-radius:2px;width:2px;margin-left:-1px;position:absolute}.hx-player__playhead.is-visible{opacity:1}.hx-player__marker{top:10%;bottom:10%;left:calc(var(--hx-marker-x,0) * 100%);background-color:var(--hx-color-accent-copper);opacity:0;border-radius:2px;width:3px;margin-left:-1.5px;position:absolute}.hx-player__marker.is-visible{opacity:1}@media (prefers-reduced-motion:no-preference){.hx-player__bar{animation:hx-player-rise var(--hx-motion-duration-slow) var(--hx-motion-easing-enter) backwards;animation-delay:calc(var(--hx-bar-index,0) * 10ms)}}@keyframes hx-player-rise{0%{opacity:0;transform:scaleY(.05)}}.hx-player__controls{align-items:center;gap:var(--hx-spacing-scale-sm) var(--hx-spacing-scale-md);flex-wrap:wrap;display:flex}.hx-player__icon{fill:currentColor;flex:none;width:1.1em;height:1.1em}.hx-player__scrub{align-items:center;gap:var(--hx-spacing-scale-md);min-height:var(--hx-spacing-min-tap-target);flex:14rem;display:flex}.hx-player__position{min-width:8rem;min-height:var(--hx-spacing-min-tap-target);accent-color:var(--hx-color-accent-copper);cursor:pointer;flex:auto;margin:0}.hx-player__position:disabled{cursor:not-allowed}.hx-player__clock{color:var(--hx-color-ink-muted);font-variant-numeric:tabular-nums;white-space:nowrap;flex:none}.hx-player__notes{color:var(--hx-color-ink-muted);font-size:var(--hx-type-scale-caption-size);line-height:var(--hx-type-scale-caption-line-height)}.hx-player__error{color:var(--hx-color-semantic-danger)}
