.media-audio{--med-y: 100%;--med-offset: var(--ok-5xs);transform:translateY(var(--med-y))}.media-audio[open]{--med-y: 0;position:sticky}.media-audio[playing]{--med-play-display: none;--med-pause-display: block}.media-audio[dragging]{--med-scrub-opacity: 1}@media only screen and (min-width:56.25rem){.media-audio{--med-text-width: 12.5rem;--med-prog-top: -1.25rem;--med-prog-width: auto;--med-offset: 0}}@media only screen and (min-width:75rem){.media-audio{--med-text-width: 15.625rem}}.media-audio-control:hover{background:hsla(var(--ok-foreground-base-hsl),.125)}.media-audio-play{display:var(--med-play-display, block)}.media-audio-pause{display:var(--med-pause-display, none)}.media-audio-text{width:var(--med-text-width, auto)}.media-audio-text,.media-audio-seek{margin:0 var(--med-offset)}.media-audio-progress{width:var(--med-prog-width, 100%);height:.1875rem;touch-action:none;-webkit-user-select:none;user-select:none;cursor:pointer}.media-audio-progress:before{height:var(--ok-m);top:var(--med-prog-top, -.625rem);left:-.3125rem;right:-.3125rem}.media-audio-progress:hover{--med-scrub-opacity: 1}.media-audio-bar{background:hsla(var(--ok-foreground-base-hsl),.2);height:inherit}.media-audio-bar:after{background:var(--ok-foreground-base);transform:scaleX(var(--med-progress-bar));transform-origin:0 0}.media-audio-scrub{--ok-prop: opacity;--ok-duration: .1s;top:-.21875rem;left:-.3125rem;opacity:var(--med-scrub-opacity, 0);transform:translate(var(--med-progress-scrub))}.media-audio-tracks,.media-audio-tracks-compact{--med-cell-height: var(--ok-2xl);--med-head-right: var(--ok-2xs);--clp-inset: calc((var(--med-cell-height) / 2) - (var(--ok-xs) / 2)) 0 auto auto;--clp-position: absolute;container-type:inline-size;container-name:track-wide}@media only screen and (min-width:56.25rem){.media-audio-tracks,.media-audio-tracks-compact{--med-cell-height: var(--ok-3xl);--med-head-right: var(--ok-m);--med-item-right: var(--ok-m)}}.media-audio-tracks-compact{container-name:track-compact}.media-audio-track{--ok-border-color: var(--ok-foreground-tint)}.media-audio-track[data-media-track=playing]{--med-row-border-color: var(--ok-faded-color);--med-row-opacity: 1;--med-play-display: none;--med-pause-display: block;position:relative;z-index:1}.media-audio-track:hover{--med-row-opacity: 1}.media-audio-track-item{min-height:var(--med-cell-height);padding-right:var(--med-item-right, var(--ok-s))}.media-audio-track-item:before{opacity:var(--med-row-opacity, 0);background:var(--ok-foreground-light);box-shadow:0 0 0 .0625rem var(--ok-foreground-light);left:calc(var(--ok-container-padding)*-1);width:calc(var(--med-row-width, 100%) + var(--ok-container-padding)*2);border-radius:var(--ok-border-radius-s);border:.0625rem solid var(--med-row-border-color, var(--ok-foreground-light));z-index:-1}.media-audio-track-cell-s,.media-audio-track-cell-m,.media-audio-track-cell-l{min-width:var(--med-cell-width, 5rem)}.media-audio-track-cell-m{--med-cell-width: 12.5rem}.media-audio-track-cell-l{--med-cell-width: clamp(12.5rem, 16.6666666667vw + 9.375rem, 18.75rem)}.media-audio-track-wide{display:none}@container track-wide (width > 50rem){.media-audio-track-head{padding-right:var(--med-head-right)}.media-audio-track-wide{display:table-cell}.media-audio-track-compact{display:none}}@container track-compact (width > 37.5rem){.media-audio-track-head{padding-right:var(--med-head-right)}.media-audio-track-wide{display:table-cell}.media-audio-track-compact{display:none}}