.pan-player{position:fixed;z-index:2;pointer-events:none;overflow:hidden;--control-bg:#f5f5f5;--control-ink:#171717}
.pan-player .player-toggle{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:48px;height:48px;max-width:45%;max-height:65%;padding:12px;border-radius:50%;background:var(--control-bg);color:var(--control-ink);display:grid;place-items:center;border:0}
.player-toggle svg{width:100%;height:100%;fill:currentColor}.play-icon{display:none}.paused .play-icon{display:block}.paused .pause-icon{display:none}
.player-toggle,.player-timeline{opacity:0;transition:opacity 100ms ease;pointer-events:none}.paused .player-toggle,.awake .player-toggle,.awake .player-timeline,.scrubbing .player-timeline{opacity:1;pointer-events:auto}
.player-toggle:focus-visible,.player-timeline:focus-within{opacity:1;pointer-events:auto}
.player-timeline{position:absolute;bottom:8px;left:12px;right:12px}.player-timeline input{display:block;width:100%;margin:0;height:16px;accent-color:var(--control-ink);cursor:ew-resize}
.player-times{display:flex;justify-content:space-between;visibility:hidden;font:12px Lato,sans-serif;color:var(--control-ink);margin-bottom:4px}.player-times span{background:var(--control-bg);padding:2px 6px;border-radius:999px}.scrubbing .player-times{visibility:visible}


/* A continuous played/unplayed line; retain a larger invisible hit area. */
.player-timeline input[type=range]{appearance:none;-webkit-appearance:none;background:transparent;border:0;box-shadow:none;border-radius:0;outline:none;--played:rgba(255,255,255,.95);--unplayed:rgba(255,255,255,.3)}
.player-timeline input[type=range]::-webkit-slider-runnable-track{height:5px;border:0;border-radius:999px;box-shadow:none;background:linear-gradient(to right,var(--played) 0 var(--progress,0%),var(--unplayed) var(--progress,0%) 100%)}
.player-timeline input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:1px;height:16px;margin-top:-5.5px;background:transparent;border:0;border-radius:0;box-shadow:none}
.player-timeline input[type=range]::-moz-range-track{height:5px;border:0;border-radius:999px;background:var(--unplayed)}
.player-timeline input[type=range]::-moz-range-progress{height:5px;border:0;border-radius:999px;background:var(--played)}
.player-timeline input[type=range]::-moz-range-thumb{width:1px;height:16px;background:transparent;border:0;border-radius:0;box-shadow:none}
.player-timeline input[type=range]:focus-visible{filter:brightness(1.3)}

.pan-player .player-toggle{width:var(--play-size,48px);height:var(--play-size,48px);max-width:none;max-height:none;aspect-ratio:1;padding:calc(var(--play-size,48px) / 4);flex-shrink:0}

.pan-player .player-timeline{pointer-events:none}.pan-player .player-timeline input{pointer-events:none}.pan-player.awake .player-timeline input,.pan-player.scrubbing .player-timeline input,.pan-player .player-timeline:focus-within input{pointer-events:auto}

.pan-player .player-toggle{padding:0}
.pan-player .player-toggle svg{width:var(--symbol-percent,65%);height:var(--symbol-percent,65%);overflow:visible}
.pan-player.paused .player-toggle svg{transform:translateX(calc(var(--play-size,48px) * var(--triangle-offset,-.01)))}

.pan-player .player-toggle{box-shadow:var(--player-shadow,0 0 15px 5px rgba(0,0,0,.2))}