[Summary view] [Print] [Text view]

   1  .waveform-player{--wfp-accent:#71717a;--wfp-button-color:hsla(0,0%,100%,.9);--wfp-text-color:#fff;--wfp-text-secondary-color:hsla(0,0%,100%,.6);color:inherit;font-family:inherit;line-height:var(--waveform-line-height,1.4)}.waveform-player.waveform-theme-light{--wfp-button-color:rgba(0,0,0,.8);--wfp-text-color:#333;--wfp-text-secondary-color:rgba(0,0,0,.6)}.waveform-player *{box-sizing:border-box}.waveform-body{display:flex;flex-direction:column;gap:var(--waveform-body-gap,8px)}.waveform-track{gap:var(--waveform-track-gap,12px);position:relative}.waveform-btn,.waveform-track{align-items:center;display:flex}.waveform-btn{background:transparent;border:2px solid;border-radius:50%;color:var(--wfp-button-color,inherit);cursor:pointer;flex-shrink:0;height:var(--wfp-btn-size,36px);justify-content:center;min-width:var(--wfp-btn-size,36px);opacity:.9;padding:0;transition:all .2s ease;width:var(--wfp-btn-size,36px)}.waveform-btn:hover:not(:disabled){opacity:1;transform:scale(1.05)}.waveform-btn-minimal{border:none;border-radius:0;height:calc(var(--wfp-btn-size, 36px)*1.1);min-width:calc(var(--wfp-btn-size, 36px)*1.1);opacity:.7;width:calc(var(--wfp-btn-size, 36px)*1.1)}.waveform-btn-minimal:hover:not(:disabled){opacity:1;transform:none}.waveform-btn.waveform-btn-minimal svg{height:calc(var(--wfp-btn-size, 36px)*.94);width:calc(var(--wfp-btn-size, 36px)*.94)}.waveform-btn:disabled{cursor:not-allowed;opacity:.3}.waveform-btn>*{align-items:center;display:flex;height:100%;justify-content:center;width:100%}.waveform-btn svg{fill:currentColor;display:block;height:calc(var(--wfp-btn-size, 36px)*.45);width:calc(var(--wfp-btn-size, 36px)*.45)}.waveform-icon-play svg{margin-left:1px}.waveform-container{cursor:pointer;flex:1;min-height:60px;min-width:0;position:relative;width:100%}.waveform-container:focus-visible{outline:2px solid currentColor}.waveform-container canvas{display:block;height:100%;max-width:100%;position:relative;transition:opacity .3s ease;width:100%;z-index:1}.waveform-info{align-items:center;display:flex;font-size:13px;gap:8px;min-height:20px}.waveform-text{display:flex;flex:1;flex-direction:column;gap:2px;min-width:0}.waveform-title{color:var(--wfp-text-color);font-weight:500}.waveform-artist,.waveform-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.waveform-artist{color:var(--wfp-text-secondary-color);font-size:11px}.waveform-bpm,.waveform-time{color:var(--wfp-text-secondary-color);flex-shrink:0;font-size:11px;white-space:nowrap}.waveform-bpm{align-items:center;display:inline-flex;gap:4px}.waveform-loading{background:rgba(0,0,0,.102)}.waveform-error,.waveform-loading{inset:0;position:absolute;z-index:10}.waveform-error{align-items:center;background:rgba(0,0,0,.2);display:flex;justify-content:center}.waveform-error-text{font-size:12px;opacity:.7;padding:0 20px;text-align:center}.waveform-markers{inset:0;pointer-events:none;position:absolute;z-index:5}.waveform-marker{background:hsla(0,0%,100%,.502);border:none;cursor:pointer;height:100%;padding:0;pointer-events:all;position:absolute;top:0;transition:all .2s;width:2px}.waveform-marker:hover{width:4px;z-index:20}.waveform-marker.active{background:currentColor;width:4px;z-index:10}.waveform-marker-tooltip{background:rgba(0,0,0,.902);border-radius:4px;bottom:calc(100% + 4px);color:#fff;font-size:11px;left:50%;opacity:0;padding:4px 8px;pointer-events:none;position:absolute;transform:translate(-50%);transition:opacity .2s;white-space:nowrap;z-index:1000}.waveform-marker.show-label .waveform-marker-tooltip,.waveform-marker:hover .waveform-marker-tooltip{opacity:1}.waveform-hover-time{background:rgba(0,0,0,.902);border-radius:4px;bottom:calc(100% + 4px);color:#fff;font-size:11px;font-variant-numeric:tabular-nums;padding:3px 7px;transform:translate(-50%);transition:opacity .15s;white-space:nowrap;z-index:1000}.waveform-hover-time,.waveform-seek-handle{opacity:0;pointer-events:none;position:absolute}.waveform-seek-handle{background:#fff;border-radius:50%;box-shadow:0 1px 4px rgba(0,0,0,.349);height:11px;left:0;top:50%;transform:translate(-50%,-50%) scale(0);transition:opacity .12s ease,transform .12s ease;width:11px;z-index:6}.waveform-seek-handle.is-visible{opacity:1;transform:translate(-50%,-50%) scale(1)}.waveform-seek-handle.is-active{transform:translate(-50%,-50%) scale(1.25)}.waveform-btn:focus-visible{outline:2px solid currentColor;outline-offset:2px}.waveform-marker:focus-visible{outline:2px solid currentColor;outline-offset:1px;width:4px}.waveform-speed{flex-shrink:0;position:relative}.speed-btn{background:transparent;border:1px solid hsla(0,0%,100%,.2);border-radius:4px;color:inherit;cursor:pointer;font-size:11px;min-width:40px;padding:4px 8px;transition:all .2s}.speed-btn:hover{background:hsla(0,0%,100%,.051);border-color:hsla(0,0%,100%,.302)}.speed-value{font-weight:600}.speed-menu{background:rgba(0,0,0,.949);border:1px solid hsla(0,0%,100%,.2);border-radius:6px;bottom:100%;margin-bottom:4px;min-width:60px;padding:4px;position:absolute;right:0;z-index:100}.speed-option{background:transparent;border:none;border-radius:4px;color:hsla(0,0%,100%,.702);cursor:pointer;display:block;font-size:12px;padding:6px 12px;text-align:left;transition:all .2s;width:100%}.speed-option:hover{background:hsla(0,0%,100%,.102);color:#fff}.speed-option.active{background:hsla(0,0%,100%,.161);color:#fff;font-weight:600}.waveform-player.waveform-focused{border-radius:4px;outline:2px solid var(--wfp-accent);outline-offset:2px}.waveform-player:focus{outline:none}.waveform-player:focus-visible{outline:1px solid var(--wfp-accent);outline-offset:1px}.waveform-layout-preview .waveform-meta{display:none!important}.waveform-layout-preview .waveform-info{justify-content:center}.waveform-layout-preview .waveform-text{align-items:center;flex:0 1 auto;text-align:center}.waveform-player.waveform-focused{outline:none}.waveform-track.waveform-align-top{align-items:flex-start}.waveform-track.waveform-align-top .waveform-btn{margin-top:5px}.waveform-track.waveform-align-center{align-items:center}.waveform-track.waveform-align-bottom{align-items:flex-end}.waveform-track.waveform-align-bottom .waveform-btn{margin-bottom:5px}@media (max-width:480px){.waveform-btn{height:32px;min-width:32px;width:32px}.waveform-container{min-height:50px}.waveform-info{font-size:12px}.waveform-artist,.waveform-bpm,.waveform-time{font-size:10px}}@media (prefers-reduced-motion:reduce){.waveform-player *,.waveform-player :after,.waveform-player :before{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.wp-block-playlist .wp-block-playlist__waveform-player{margin:var(--wp--preset--spacing--20,.625em) 0;position:relative;width:100%}.wp-block-playlist .wp-block-playlist__waveform-player:focus-visible{outline:revert;outline-offset:revert}.wp-block-playlist .waveform-track{gap:0;height:100px}.wp-block-playlist .waveform-btn{background:currentColor;border:none;border-end-start-radius:.125rem;border-radius:0;border-start-start-radius:.125rem;height:100px;margin:0;min-width:100px;width:100px}.wp-block-playlist .waveform-btn:hover:not(:disabled){transform:none}.wp-block-playlist .waveform-btn svg{height:3rem;width:3rem}.wp-block-playlist .waveform-btn .waveform-icon-pause svg{height:2.625rem;width:2.625rem}.wp-block-playlist .waveform-player.has-play-button-artwork .waveform-btn{background-image:var(--wp--playlist--play-button-artwork);background-position:50%;background-size:cover;color:#fff}.wp-block-playlist .waveform-player.has-play-button-artwork .waveform-btn svg{filter:drop-shadow(0 1px 2px rgba(0,0,0,.45))}.wp-block-playlist .waveform-player.has-play-button-artwork .waveform-btn svg path{fill:#fff!important}.wp-block-playlist .waveform-track.waveform-align-bottom .waveform-btn{margin-bottom:0}.wp-block-playlist .waveform-btn:focus-visible,.wp-block-playlist .waveform-container:focus-visible{outline:revert;outline-offset:revert}.wp-block-playlist .waveform-artist{opacity:.7}.wp-block-playlist .waveform-artist,.wp-block-playlist .waveform-info,.wp-block-playlist .waveform-time,.wp-block-playlist .waveform-title{font-size:inherit}.wp-block-playlist .wp-block-playlist__tracklist{list-style:none;margin:0;padding-left:0}.wp-block-playlist .wp-block-playlist__tracklist.wp-block-playlist__tracklist-artist-is-hidden .wp-block-playlist-track__artist,.wp-block-playlist .wp-block-playlist__tracklist.wp-block-playlist__tracklist-is-hidden,.wp-block-playlist .wp-block-playlist__tracklist.wp-block-playlist__tracklist-length-is-hidden .wp-block-playlist-track__length{display:none}.wp-block-playlist .wp-block-playlist__tracklist.wp-block-playlist__tracklist-show-numbers{counter-reset:playlist-track}