ecplayer 1.0.4 → 1.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/ecplayer.es.js +197 -184
  2. package/dist/ecplayer.umd.js +5 -5
  3. package/package.json +1 -1
package/dist/ecplayer.es.js CHANGED
@@ -1,6 +1,6 @@
1
- (function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode(".ecp-full-width{width:100%}.ecp-h-full{height:100%}.ecp-relative{position:relative}.ecp-absolute{position:absolute}.ecp-inset-0{top:0;right:0;bottom:0;left:0}.ecp-z-10{z-index:10}.ecp-flex{display:flex}.ecp-inline-flex{display:inline-flex}.ecp-flex-col{flex-direction:column}.ecp-flex-wrap{flex-wrap:wrap}.ecp-flex-1{flex:1 1 0%}.ecp-flex-shrink-0{flex-shrink:0}.ecp-grid{display:grid}.ecp-grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.ecp-hidden{display:none}.ecp-items-center{align-items:center}.ecp-items-end{align-items:flex-end}.ecp-items-start{align-items:flex-start}.ecp-justify-center{justify-content:center}.ecp-justify-between{justify-content:space-between}.ecp-justify-end{justify-content:flex-end}.ecp-justify-start{justify-content:flex-start}.ecp-text-center{text-align:center}.ecp-text-right{text-align:right}.ecp-self-center{align-self:center}.ecp-gap-1{gap:.25rem}.ecp-gap-2{gap:.5rem}.ecp-gap-3{gap:.75rem}.ecp-gap-px{gap:1px}.ecp-gap-05{gap:2px}.ecp-mb-1{margin-bottom:.25rem}.ecp-mb-2{margin-bottom:.5rem}.ecp-mb-4{margin-bottom:1rem}.ecp-mb-6{margin-bottom:1.5rem}.ecp-mr-2{margin-right:.5rem}.ecp-mt-4{margin-top:1rem}.ecp-mt-6{margin-top:1.5rem}.ecp-ml-auto{margin-left:auto}.ecp-p-1{padding:.25rem}.ecp-p-1-5{padding:.375rem}.ecp-p-2{padding:.5rem}.ecp-p-3{padding:.75rem}.ecp-p-4{padding:1rem}.ecp-p-6{padding:1.5rem}.ecp-p-8{padding:2rem}.ecp-px-2{padding-left:.5rem;padding-right:.5rem}.ecp-px-3{padding-left:.75rem;padding-right:.75rem}.ecp-px-4{padding-left:1rem;padding-right:1rem}.ecp-px-6{padding-left:1.5rem;padding-right:1.5rem}.ecp-py-1{padding-top:.25rem;padding-bottom:.25rem}.ecp-py-2{padding-top:.5rem;padding-bottom:.5rem}.ecp-py-3{padding-top:.75rem;padding-bottom:.75rem}.ecp-py-5{padding-top:1.25rem;padding-bottom:1.25rem}.ecp-pb-2{padding-bottom:.5rem}.ecp-pt-2{padding-top:.5rem}.ecp-w-1{width:.25rem}.ecp-w-3{width:.75rem}.ecp-w-4{width:1rem}.ecp-w-10{width:2.5rem}.ecp-w-12{width:3rem}.ecp-w-20{width:5rem}.ecp-w-24{width:6rem}.ecp-w-px{width:1px}.ecp-w-full{width:100%}.ecp-max-w-xs{max-width:20rem}.ecp-max-w-lg{max-width:32rem}.ecp-max-w-4xl{max-width:56rem}.ecp-h-0-5{height:.125rem}.ecp-h-1{height:.25rem}.ecp-h-1-5{height:.375rem}.ecp-h-2{height:.5rem}.ecp-h-3{height:.75rem}.ecp-h-4{height:1rem}.ecp-h-6{height:1.5rem}.ecp-h-8{height:2rem}.ecp-h-10{height:2.5rem}.ecp-h-12{height:3rem}.ecp-h-20{height:5rem}.ecp-h-40{width:10rem;height:40px}.ecp-h-64{height:16rem}.ecp-h-screen{height:100vh}.ecp-min-h-screen{min-height:100vh}.ecp-min-h-0{min-height:0}.ecp-min-w-12{min-width:3rem}.ecp-min-w-0{min-width:0}.ecp-aspect-square{aspect-ratio:1 / 1}.ecp-text-xs{font-size:.75rem;line-height:1rem}.ecp-text-sm{font-size:.875rem;line-height:1.25rem}.ecp-text-lg{font-size:1.125rem;line-height:1.75rem}.ecp-text-2xl{font-size:1.5rem;line-height:2rem}.ecp-font-medium{font-weight:500}.ecp-font-semibold{font-weight:600}.ecp-font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}.ecp-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ecp-text-white{color:#fff}.ecp-text-transparent{color:transparent}.ecp-text-gray-400{color:#9ca3af}.ecp-text-gray-500{color:#6b7280}.ecp-text-gray-600{color:#4b5563}.ecp-text-gray-700{color:#374151}.ecp-text-gray-800{color:#1f2937}.ecp-text-gray-100{color:#f3f4f6}.ecp-text-gray-200{color:#e5e7eb}.ecp-text-gray-300{color:#d1d5db}.ecp-text-red-500{color:#ef4444}.ecp-dark .ecp-text-dark-100{color:#f3f4f6}.ecp-dark .ecp-text-dark-200{color:#e5e7eb}.ecp-dark .ecp-text-dark-300{color:#d1d5db}.ecp-bg-white{background-color:#fff}.ecp-bg-black-20{background-color:#0003}.ecp-bg-black-30{background-color:#0000004d}.ecp-bg-black-40{background-color:#0006}.ecp-bg-black-50{background-color:#00000080}.ecp-bg-gray-100{background-color:#f3f4f6}.ecp-bg-gray-200{background-color:#e5e7eb}.ecp-bg-gray-300{background-color:#d1d5db}.ecp-bg-gray-700{background-color:#374151}.ecp-bg-gray-800{background-color:#1f2937}.ecp-bg-red-50{background-color:#fef2f2}.ecp-bg-transparent{background-color:transparent}.ecp-border{border-width:1px}.ecp-border-2{border-width:2px}.ecp-border-r{border-right-width:1px}.ecp-border-transparent{border-color:transparent}.ecp-border-gray-300{border-color:#d1d5db}.ecp-border-red-300{border-color:#fca5a5}.ecp-border-current{border-color:currentColor}.ecp-border-none{border:none}.ecp-outline-none{outline:none}.ecp-rounded{border-radius:.25rem}.ecp-rounded-lg{border-radius:.5rem}.ecp-rounded-xl{border-radius:.75rem}.ecp-rounded-2xl{border-radius:1rem}.ecp-rounded-full{border-radius:9999px}.ecp-rounded-t{border-top-left-radius:.25rem;border-top-right-radius:.25rem}.ecp-shadow-sm{box-shadow:0 1px 2px #0000000d}.ecp-shadow-lg{box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a}.ecp-shadow-2xl{box-shadow:0 25px 50px -12px #00000040}.ecp-opacity-20{opacity:.2}.ecp-opacity-40{opacity:.4}.ecp-opacity-70{opacity:.7}.ecp-opacity-80{opacity:.8}.ecp-cursor-pointer{cursor:pointer}.ecp-cursor-not-allowed{cursor:not-allowed}.ecp-pointer-events-none{pointer-events:none}.ecp-transition{transition-property:color,background-color,border-color,opacity,box-shadow,transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ecp-transition-all{transition:all .15s cubic-bezier(.4,0,.2,1)}.ecp-duration-75{transition-duration:75ms}.ecp-duration-100{transition-duration:.1s}.ecp-duration-150{transition-duration:.15s}.ecp-duration-300{transition-duration:.3s}.ecp-scale-0{transform:scale(0)}.ecp-translate-y-10{transform:translateY(2.5rem)}.ecp--translate-y-10{transform:translateY(-2.5rem)}.ecp-rotate-180{transform:rotate(180deg)}.ecp-hover-scale-105:hover{transform:scale(1.05)}.ecp-hover-scale-110:hover{transform:scale(1.1)}@keyframes ecp-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.ecp-animation-spin{animation:ecp-spin 15s infinite linear}.ecp-object-contain{-o-object-fit:contain;object-fit:contain}.ecp-backdrop-blur-xl{-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}.ecp-overflow-hidden{overflow:hidden}.ecp-top-0{top:0}.ecp-left-0{left:0}.ecp-fixed{position:fixed}.ecp-z-9999{z-index:9999}.ecp-appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.ecp-page-wrapper{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1rem}@media (min-width: 768px){.ecp-page-wrapper{padding:2rem}}.ecp-demo-container{width:100%;height:100%}@media (min-width: 768px){.ecp-demo-container{height:auto;max-width:56rem}}.ecp-container-glass{border-radius:.75rem;padding:2rem}.ecp-demo-header{margin-bottom:1.5rem;display:flex;justify-content:space-between;align-items:flex-start}.ecp-demo-title{font-size:1.5rem;font-weight:600;color:#1f2937;margin-bottom:.25rem}.ecp-demo-title--dark{color:#e5e7eb}.ecp-demo-subtitle{font-size:.875rem;color:#6b7280}.ecp-theme-btn{background:#fff;border:1px solid #d1d5db;color:#374151;padding:.5rem 1rem;border-radius:.5rem;font-size:.875rem;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:.5rem}.ecp-theme-btn:hover{background:#f9fafb}.ecp-demo-actions{margin-top:1.5rem;display:flex;flex-wrap:wrap;align-items:center;gap:.75rem}.ecp-action-btn{background:#fff;border:1px solid #d1d5db;color:#374151;padding:.5rem 1.5rem;border-radius:.5rem;font-size:.875rem;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:.5rem}.ecp-action-btn:hover{background:#f9fafb}.ecp-file-input-hidden{display:none}.ecp-theme-selector-panel{border-radius:.75rem;padding:1.5rem;margin-bottom:1.5rem}.ecp-theme-selector-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.ecp-theme-selector-title{font-size:1.125rem;font-weight:600;color:#1f2937}.ecp-theme-selector-close{color:#6b7280;font-size:.875rem;font-weight:500;background:none;border:none;cursor:pointer}.ecp-theme-selector-close:hover{color:#374151}.ecp-theme-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}@media (min-width: 640px){.ecp-theme-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (min-width: 768px){.ecp-theme-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}.ecp-theme-card{background:#fff;padding:1rem;border-radius:.5rem;cursor:pointer;border:2px solid transparent;transition:all .15s cubic-bezier(.4,0,.2,1)}.ecp-theme-card--active{border-color:currentColor;box-shadow:0 10px 15px -3px #0000001a}.ecp-theme-color-preview{height:2.5rem;border-radius:.25rem;margin-bottom:.5rem}.ecp-theme-name{font-size:.875rem;font-weight:500;color:#374151}.ecp-vp-wrapper{width:100%;border-radius:.75rem;overflow:hidden}.ecp-vp-bg{padding:1rem}.ecp-vp-vu-outer{position:relative}.ecp-vp-vu-bg{border-radius:.5rem;margin-bottom:1.5rem;padding:1rem;box-shadow:0 1px 2px #0000000d}.ecp-vp-vu-bg--light{background:#ffffffb3}.ecp-vp-vu-bg--dark{background:#0006}.ecp-vp-vu-bg--dimmed{opacity:.3}.ecp-vp-vu-bg--no-margin{margin-bottom:0}.ecp-vp-vu-bars{display:flex;justify-content:center;align-items:flex-end;gap:.25rem;height:16rem}.ecp-vp-eq-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;width:100%;justify-content:center;z-index:10;border-radius:.5rem;padding:1rem;box-shadow:0 1px 2px #0000000d;transition:all .3s cubic-bezier(.4,0,.2,1)}.ecp-vp-eq-overlay--light{background:#fffc}.ecp-vp-eq-overlay--dark{background:#00000080}.ecp-vp-eq-title{font-size:.875rem;font-weight:500;margin-bottom:1rem}.ecp-vp-eq-title--light{color:#374151}.ecp-vp-eq-title--dark{color:#e5e7eb}.ecp-vp-eq-bands{display:flex;flex-direction:column;gap:1rem}.ecp-vp-eq-band-header{display:flex;justify-content:space-between;margin-bottom:.25rem}.ecp-vp-eq-band-label{font-size:.75rem}.ecp-vp-eq-band-label--light{color:#4b5563}.ecp-vp-eq-band-label--dark{color:#d1d5db}.ecp-vp-eq-band-range{display:flex;align-items:center;gap:.75rem}.ecp-vp-eq-range-bound{font-size:.75rem}.ecp-vp-eq-range-bound--light{color:#6b7280}.ecp-vp-eq-range-bound--dark{color:#9ca3af}.ecp-vp-eq-slider{flex:1;height:2rem;background:#d1d5db;border-radius:.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.ecp-vp-eq-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:0;height:0;background:transparent;border:none;box-shadow:none}.ecp-vp-eq-slider::-moz-range-thumb{width:0;height:0;background:transparent;border:none;box-shadow:none}.ecp-vp-eq-footer{display:flex;justify-content:flex-end;margin-top:1rem}.ecp-vp-eq-reset{padding:.25rem .75rem;border-radius:.25rem;font-size:.75rem;cursor:pointer;transition:all .15s;border:none}.ecp-vp-eq-reset--light{background:#e5e7eb;color:#374151}.ecp-vp-eq-reset--light:hover{background:#d1d5db}.ecp-vp-eq-reset--dark{background:#374151;color:#e5e7eb}.ecp-vp-eq-reset--dark:hover{background:#4b5563}.ecp-vp-track{margin-bottom:1.5rem;display:flex;align-items:center}.ecp-vp-thumbnail-wrap{margin-right:.5rem;width:3rem;flex-shrink:0}.ecp-vp-thumbnail{height:3rem;width:3rem;border-radius:9999px}.ecp-vp-track-info{width:100%;min-width:0}.ecp-vp-track-name{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ecp-vp-track-name--light{color:#374151}.ecp-vp-track-name--dark{color:#f3f4f6}.ecp-vp-track-author{font-size:.75rem}.ecp-vp-track-author--light{color:#6b7280}.ecp-vp-track-author--dark{color:#d1d5db}.ecp-vp-seekbar{margin-bottom:1.5rem}.ecp-vp-seekbar-row{display:flex;align-items:center;gap:.25rem}.ecp-vp-time{font-size:.75rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;width:3rem}.ecp-vp-time--right{text-align:right}.ecp-vp-time--light{color:#4b5563}.ecp-vp-time--dark{color:#f3f4f6}.ecp-vp-seek-input{flex:1;height:.5rem;background:#e5e7eb;border-radius:.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.ecp-vp-seek-input:disabled{opacity:.4;cursor:not-allowed}.ecp-vp-seek-input::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;cursor:pointer;border:2px solid white;box-shadow:0 2px 6px #0003}.ecp-vp-seek-input::-moz-range-thumb{width:16px;height:16px;border-radius:50%;cursor:pointer;border:2px solid white;box-shadow:0 2px 6px #0003}.ecp-vp-controls{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem}.ecp-vp-controls--sm{gap:.5rem}.ecp-vp-play-btn{padding:.5rem 1rem;min-width:6rem;border-radius:9999px;font-size:.875rem;font-weight:500;color:#fff;border:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:opacity .15s}.ecp-vp-play-btn:hover{opacity:.9}.ecp-vp-play-btn:disabled{opacity:.4;cursor:not-allowed}.ecp-vp-play-btn--compact{padding:1.25rem .75rem;min-width:unset}.ecp-vp-play-icon-wrap{position:relative;width:1rem;display:flex;align-items:center}.ecp-vp-stop-btn{padding:.75rem;border-radius:9999px;font-size:.875rem;font-weight:500;border:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .15s}.ecp-vp-stop-btn--light{background:#374151;color:#fff}.ecp-vp-stop-btn--light:hover{background:#1f2937}.ecp-vp-stop-btn--dark{background:#f3f4f6;color:#000}.ecp-vp-stop-btn--dark:hover{background:#d1d5db}.ecp-vp-stop-btn:disabled{opacity:.4;cursor:not-allowed}.ecp-vp-stop-btn--wide{padding:.5rem 1rem}.ecp-vp-eq-btn{padding:.75rem;border-radius:9999px;font-size:.875rem;font-weight:500;border:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .15s}.ecp-vp-eq-btn--off{background:#f3f4f6;color:#374151}.ecp-vp-eq-btn--off:hover{background:#d1d5db}.ecp-vp-eq-btn--on{color:#fff}.ecp-vp-eq-btn:disabled{opacity:.4;cursor:not-allowed}.ecp-vp-eq-btn--wide{padding:.5rem 1rem}.ecp-vp-loop-btn{padding:.75rem;border-radius:9999px;font-size:.875rem;font-weight:500;border:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .15s}.ecp-vp-loop-btn--off{background:#f3f4f6;color:#374151}.ecp-vp-loop-btn--off:hover{background:#d1d5db}.ecp-vp-loop-btn--on{color:#fff}.ecp-vp-loop-btn:disabled{opacity:.4;cursor:not-allowed}.ecp-vp-loop-btn--wide{padding:.5rem 1rem}.ecp-vp-loop-icon--active{transform:rotate(180deg)}.ecp-vp-speed-wrap{display:flex;align-items:center}.ecp-vp-speed-select{border-radius:9999px;font-size:.875rem;font-weight:500;border:none;outline:none;cursor:pointer;transition:all .15s;background:transparent}.ecp-vp-speed-select--light{color:#1f2937}.ecp-vp-speed-select--dark{color:#e5e7eb}.ecp-vp-speed-option--light{background:#fff;color:#1f2937}.ecp-vp-speed-option--dark{background:#1f2937;color:#f3f4f6}.ecp-vp-volume{display:flex;align-items:center;gap:.25rem;margin-left:auto}@media (min-width: 768px){.ecp-vp-volume{gap:.75rem}}.ecp-vp-mute-btn{padding:.5rem;border-radius:9999px;background:none;border:none;cursor:pointer;transition:all .15s}.ecp-vp-mute-btn:hover{background:#f3f4f680}.ecp-vp-mute-icon--light{color:#4b5563}.ecp-vp-mute-icon--dark{color:#f3f4f6}.ecp-vp-volume-slider{width:6rem;height:.5rem;border-radius:.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.ecp-vp-volume-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;cursor:pointer;border:2px solid white;box-shadow:0 2px 6px #0003}.ecp-vp-volume-slider::-moz-range-thumb{width:16px;height:16px;border-radius:50%;cursor:pointer;border:2px solid white;box-shadow:0 2px 6px #0003}@media (max-width: 460px){.ecp-vp-volume-slider{display:none}}.ecp-vp-volume-pct{font-size:.75rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;width:2.5rem;text-align:right}.ecp-vp-volume-pct--light{color:#374151}.ecp-vp-volume-pct--dark{color:#f3f4f6}.ecp-vp-error{font-size:.875rem;color:#ef4444;background:#fef2f2;padding:.75rem;border-radius:.25rem;margin-bottom:1rem;border:1px solid #fca5a5}.ecp-wave-outer{width:100%;max-width:32rem;position:relative}.ecp-wave-audio-el{display:none}.ecp-wave-card{border-radius:1rem;box-shadow:0 25px 50px -12px #00000040}.ecp-wave-card-inner{border-radius:1rem;padding:1.5rem;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}.ecp-wave-thumbnail-wrap{width:100%;padding:1rem}.ecp-wave-thumbnail{width:100%;aspect-ratio:1 / 1;border-radius:.75rem}.ecp-wave-seek{position:relative;height:5rem;margin-bottom:1.5rem;cursor:pointer}.ecp-wave-bars{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:flex-end;justify-content:center;height:100%;width:100%;gap:1px}.ecp-wave-bar{width:.25rem;border-radius:.25rem .25rem 0 0;transition:all .15s}.ecp-wave-progress-line{position:absolute;top:0;height:100%;width:.25rem;background:#fff;border-right:1px solid black;border-radius:9999px;transition:all .15s;transform:translate(-50%)}.ecp-wave-times{display:flex;justify-content:space-between;font-size:.875rem;margin-bottom:1.5rem}.ecp-wave-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;justify-content:space-between;margin-bottom:1rem}.ecp-wave-left-controls{display:flex;align-items:center;gap:.5rem}.ecp-wave-vol-btn{padding:.5rem;border-radius:9999px;border:none;cursor:pointer;transition:all .15s}.ecp-wave-vol-slider{width:5rem;height:.375rem;border-radius:.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.ecp-wave-vol-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;cursor:pointer;border:2px solid white;box-shadow:0 1px 3px #0003}.ecp-wave-vol-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;cursor:pointer;border:2px solid white}.ecp-wave-center-controls{display:flex;justify-content:center}.ecp-wave-play-btn{padding:1rem;border-radius:9999px;border:none;cursor:pointer;transition:all .15s;box-shadow:0 10px 15px -3px #0000001a}.ecp-wave-play-btn:hover{transform:scale(1.05)}.ecp-wave-right-controls{display:flex;align-items:center;gap:.75rem}.ecp-wave-speed-select{padding:.25rem .5rem;border-radius:.5rem;font-size:.875rem;border:none;cursor:pointer}.ecp-wave-speed-select--light{background:#f3f4f6;color:#374151}.ecp-wave-speed-select--dark{background:#1f2937;color:#f3f4f6}.ecp-wave-eq-btn{padding:.5rem;border-radius:9999px;border:none;cursor:pointer;transition:all .15s}.ecp-wave-eq-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#0003;display:flex;align-items:center;justify-content:center;z-index:10;border-radius:1rem;padding:1rem}.ecp-wave-eq-panel{max-width:20rem;width:100%;padding:.5rem 1rem 1rem;border-radius:.75rem}.ecp-wave-eq-panel--light{background:#fff}.ecp-wave-eq-panel--dark{background:#1f2937}.ecp-wave-eq-title{font-size:1.125rem;font-weight:500;margin-bottom:.5rem}.ecp-wave-eq-title--light{color:#374151}.ecp-wave-eq-title--dark{color:#e5e7eb}.ecp-wave-eq-bands{display:flex;flex-direction:column;gap:1rem}.ecp-wave-eq-band-header{display:flex;justify-content:space-between;margin-bottom:.25rem}.ecp-wave-eq-label--light{font-size:.75rem;color:#4b5563}.ecp-wave-eq-label--dark{font-size:.75rem;color:#d1d5db}.ecp-wave-eq-range-row{display:flex;align-items:center;gap:.75rem}.ecp-wave-eq-bound--light{font-size:.75rem;color:#6b7280}.ecp-wave-eq-bound--dark{font-size:.75rem;color:#9ca3af}.ecp-wave-eq-slider{flex:1;height:1rem;background:#d1d5db;border-radius:.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.ecp-wave-eq-slider::-webkit-slider-thumb{-webkit-appearance:none;width:0;height:0;background:transparent;border:none;box-shadow:none}.ecp-wave-eq-slider::-moz-range-thumb{width:0;height:0;background:transparent;border:none}.ecp-wave-eq-footer{display:flex;justify-content:space-between;margin-top:1.5rem}.ecp-wave-eq-footer-btn{padding:.25rem .75rem;border-radius:.25rem;font-size:.75rem;cursor:pointer;border:none;transition:all .15s}.ecp-wave-eq-footer-btn--light{background:#e5e7eb;color:#374151}.ecp-wave-eq-footer-btn--light:hover{background:#d1d5db}.ecp-wave-eq-footer-btn--dark{background:#374151;color:#e5e7eb}.ecp-wave-eq-footer-btn--dark:hover{background:#4b5563}.ecp-wave-error{padding:1.5rem;border-radius:.75rem;text-align:center}.ecp-wave-error-title{font-weight:500}.ecp-wave-error-msg{font-size:.875rem}.ecp-wave-error--light{color:#dc2626}.ecp-wave-error--dark{color:#fca5a5}.ecp-nano-wrapper{position:relative;overflow:hidden;display:inline-flex;flex-direction:column;padding:.5rem .75rem;box-shadow:0 10px 15px -3px #0000001a}.ecp-nano-wrapper--pill{border-radius:9999px;width:110px;height:40px}.ecp-nano-wrapper--card{border-radius:1rem;width:120px;height:150px}.ecp-nano-progress-bg{position:absolute;top:0;left:0;height:100%;opacity:.2}.ecp-nano-content{position:absolute;display:flex;flex-direction:column}.ecp-nano-thumbnail-wrap{width:6rem;padding-bottom:.5rem}.ecp-nano-thumbnail{width:6rem;aspect-ratio:1 / 1;border-radius:.75rem}.ecp-nano-row{display:flex;align-items:center;gap:.5rem}.ecp-nano-play-btn{padding:.375rem;border-radius:9999px;border:none;cursor:pointer;flex-shrink:0;transition:transform .15s}.ecp-nano-play-btn:hover{transform:scale(1.1)}.ecp-nano-waveform{display:flex;width:100%;min-width:3rem;align-items:center;gap:2px;height:1.5rem}.ecp-nano-wave-bar{border-radius:9999px;width:100%;transition:height .2s}.ecp-video-wrapper{border-radius:.75rem;overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1)}.ecp-video-wrapper--fullscreen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;display:flex;flex-direction:column;height:100vh;width:100vw;background:#000}.ecp-video-inner{height:auto}.ecp-video-inner--fullscreen{display:flex;flex-direction:column;flex:1}.ecp-video-inner--padded{padding:1rem}.ecp-video-name{margin-bottom:1rem;font-weight:500}.ecp-video-name--light{color:#374151}.ecp-video-name--dark{color:#f3f4f6}.ecp-video-layout{position:relative;margin-bottom:1rem}.ecp-video-layout--row{display:flex;gap:.75rem}.ecp-video-layout--col{display:flex;flex-direction:column;gap:.75rem}.ecp-video-layout--fullscreen{flex:1;min-height:0}.ecp-video-vu-top,.ecp-video-vu-bottom{width:100%;height:3rem}.ecp-video-vu-side{width:3rem;background:#00000080;border-radius:.5rem;padding:.25rem}.ecp-video-el-wrap{flex:1;border-radius:.5rem;overflow:hidden;position:relative}.ecp-video-el-wrap--light{background:#ffffffb3}.ecp-video-el-wrap--dark{background:#000000b3}.ecp-video-el{width:100%;height:100%;-o-object-fit:contain;object-fit:contain}.ecp-video-eq-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;width:100%;justify-content:center;z-index:10;border-radius:.5rem;padding:1rem;box-shadow:0 1px 2px #0000000d;transition:all .3s}.ecp-video-eq-panel{max-width:600px;width:100%;margin:0 auto;display:flex;flex-direction:column;justify-content:center;border-radius:.5rem;padding:1rem;box-shadow:0 1px 2px #0000000d;transition:all .3s}.ecp-video-eq-panel--light{background:#fffc}.ecp-video-eq-panel--dark{background:#000000b3}.ecp-video-eq-title{font-size:.875rem;font-weight:500;margin-bottom:1rem}.ecp-video-eq-title--light{color:#374151}.ecp-video-eq-title--dark{color:#e5e7eb}.ecp-video-eq-bands{display:flex;flex-direction:column;gap:1rem}.ecp-video-eq-band-header{display:flex;justify-content:space-between;margin-bottom:.25rem}.ecp-video-eq-label--light{font-size:.75rem;color:#4b5563}.ecp-video-eq-label--dark{font-size:.75rem;color:#d1d5db}.ecp-video-eq-range-row{display:flex;align-items:center;gap:.75rem}.ecp-video-eq-bound--light{font-size:.75rem;color:#6b7280}.ecp-video-eq-bound--dark{font-size:.75rem;color:#9ca3af}.ecp-video-eq-slider{flex:1;height:1.5rem;background:#d1d5db;border-radius:.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.ecp-video-eq-slider::-webkit-slider-thumb{-webkit-appearance:none;width:0;height:0;background:transparent;border:none;box-shadow:none}.ecp-video-eq-slider::-moz-range-thumb{width:0;height:0;background:transparent;border:none}.ecp-video-eq-footer{display:flex;justify-content:space-between;margin-top:1.5rem}.ecp-video-eq-footer-btn{padding:.25rem .75rem;border-radius:.25rem;font-size:.75rem;cursor:pointer;border:none;transition:all .15s}.ecp-video-eq-footer-btn--light{background:#e5e7eb;color:#374151}.ecp-video-eq-footer-btn--light:hover{background:#d1d5db}.ecp-video-eq-footer-btn--dark{background:#374151;color:#e5e7eb}.ecp-video-eq-footer-btn--dark:hover{background:#4b5563}.ecp-video-seekbar{margin-bottom:1rem}.ecp-video-seekbar--fullscreen{margin-top:.75rem}.ecp-video-seekbar-row{display:flex;align-items:center;gap:.75rem}.ecp-video-time{font-size:.75rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;width:3rem}.ecp-video-time--right{text-align:right}.ecp-video-time--light{color:#4b5563}.ecp-video-time--dark{color:#f3f4f6}.ecp-video-seek-input{flex:1;height:.5rem;border-radius:.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.ecp-video-seek-input:disabled{opacity:.4;cursor:not-allowed}.ecp-video-seek-input::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;cursor:pointer;border:2px solid white;box-shadow:0 2px 6px #0003}.ecp-video-seek-input::-moz-range-thumb{width:16px;height:16px;border-radius:50%;cursor:pointer;border:2px solid white;box-shadow:0 2px 6px #0003}.ecp-video-controls{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem}.ecp-video-play-btn{border-radius:9999px;font-size:.875rem;font-weight:500;color:#fff;border:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:opacity .15s;padding:.5rem 1rem}.ecp-video-play-btn:hover{opacity:.9}.ecp-video-play-btn:disabled{opacity:.4;cursor:not-allowed}.ecp-video-play-btn--compact{padding:1.25rem .75rem}.ecp-video-play-icon-wrap{position:relative;width:1rem;display:flex;align-items:center}.ecp-video-stop-btn{padding:.75rem;border-radius:9999px;font-size:.875rem;font-weight:500;border:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .15s}.ecp-video-stop-btn--light{background:#374151;color:#fff}.ecp-video-stop-btn--light:hover{background:#1f2937}.ecp-video-stop-btn--dark{background:#f3f4f6;color:#000}.ecp-video-stop-btn--dark:hover{background:#d1d5db}.ecp-video-stop-btn:disabled{opacity:.4;cursor:not-allowed}.ecp-video-fullscreen-btn{border-radius:9999px;font-size:.875rem;font-weight:500;border:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .15s;padding:.75rem}.ecp-video-fullscreen-btn--light{background:#374151;color:#fff}.ecp-video-fullscreen-btn--light:hover{background:#1f2937}.ecp-video-fullscreen-btn--dark{background:#f3f4f6;color:#000}.ecp-video-fullscreen-btn--dark:hover{background:#d1d5db}.ecp-video-fullscreen-btn--wide{padding:.5rem 1rem}.ecp-video-eq-toggle-btn{padding:.75rem;border-radius:9999px;font-size:.875rem;font-weight:500;border:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .15s}.ecp-video-eq-toggle-btn--off{background:#f3f4f6;color:#374151}.ecp-video-eq-toggle-btn--off:hover{background:#d1d5db}.ecp-video-eq-toggle-btn--on{color:#fff}.ecp-video-eq-toggle-btn:disabled{opacity:.4;cursor:not-allowed}.ecp-video-eq-toggle-btn--wide{padding:.5rem 1rem}.ecp-video-speed-wrap{display:flex;align-items:center}.ecp-video-speed-select{border-radius:9999px;font-size:.875rem;font-weight:500;border:none;outline:none;cursor:pointer;background:transparent;transition:all .15s}.ecp-video-speed-select--light{color:#1f2937}.ecp-video-speed-select--dark{color:#e5e7eb}.ecp-video-speed-option--light{background:#f3f4f6;color:#1f2937}.ecp-video-speed-option--dark{background:#1f2937;color:#f3f4f6}.ecp-video-volume{display:flex;align-items:center;gap:.25rem;margin-left:auto}@media (min-width: 768px){.ecp-video-volume{gap:.75rem}}.ecp-video-mute-btn{padding:.5rem;border-radius:.5rem;background:none;border:none;cursor:pointer;transition:all .15s}.ecp-video-mute-btn:hover{background:#f3f4f6}.ecp-video-mute-icon--light{color:#4b5563}.ecp-video-mute-icon--dark{color:#f3f4f6}.ecp-video-vol-slider{width:6rem;height:.5rem;border-radius:.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.ecp-video-vol-slider::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;cursor:pointer;border:2px solid white;box-shadow:0 2px 6px #0003}.ecp-video-vol-slider::-moz-range-thumb{width:16px;height:16px;border-radius:50%;cursor:pointer;border:2px solid white;box-shadow:0 2px 6px #0003}@media (max-width: 460px){.ecp-video-vol-slider{display:none}}.ecp-video-vol-pct{font-size:.75rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;width:2.5rem;text-align:right}.ecp-video-vol-pct--light{color:#374151}.ecp-video-vol-pct--dark{color:#f3f4f6}.ecp-video-error{font-size:.875rem;color:#ef4444;background:#fef2f2;padding:.75rem;border-radius:.25rem;margin-bottom:1rem;border:1px solid #fca5a5}.ecp-vu-bar-wrap{flex:1;height:100%;position:relative;display:flex;flex-direction:column;justify-content:flex-end}.ecp-vu-bar-fill{border-radius:.25rem .25rem 0 0;transition:height 75ms}.ecp-vu-peak-line{position:absolute;width:100%;height:2px;transition:top .1s}")),document.head.appendChild(e)}}catch(r){console.error("vite-plugin-css-injected-by-js",r)}})();
1
+ (function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode(".ecp-full-width{width:100%}.ecp-h-full{height:100%}.ecp-relative{position:relative}.ecp-absolute{position:absolute}.ecp-inset-0{top:0;right:0;bottom:0;left:0}.ecp-z-10{z-index:10}.ecp-flex{display:flex}.ecp-inline-flex{display:inline-flex}.ecp-flex-col{flex-direction:column}.ecp-flex-wrap{flex-wrap:wrap}.ecp-flex-1{flex:1 1 0%}.ecp-flex-shrink-0{flex-shrink:0}.ecp-grid{display:grid}.ecp-grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.ecp-hidden{display:none}.ecp-items-center{align-items:center}.ecp-items-end{align-items:flex-end}.ecp-items-start{align-items:flex-start}.ecp-justify-center{justify-content:center}.ecp-justify-between{justify-content:space-between}.ecp-justify-end{justify-content:flex-end}.ecp-justify-start{justify-content:flex-start}.ecp-text-center{text-align:center}.ecp-text-right{text-align:right}.ecp-self-center{align-self:center}.ecp-gap-1{gap:.25rem}.ecp-gap-2{gap:.5rem}.ecp-gap-3{gap:.75rem}.ecp-gap-px{gap:1px}.ecp-gap-05{gap:2px}.ecp-mb-1{margin-bottom:.25rem}.ecp-mb-2{margin-bottom:.5rem}.ecp-mb-4{margin-bottom:1rem}.ecp-mb-6{margin-bottom:1.5rem}.ecp-mr-2{margin-right:.5rem}.ecp-mt-4{margin-top:1rem}.ecp-mt-6{margin-top:1.5rem}.ecp-ml-auto{margin-left:auto}.ecp-p-1{padding:.25rem}.ecp-p-1-5{padding:.375rem}.ecp-p-2{padding:.5rem}.ecp-p-3{padding:.75rem}.ecp-p-4{padding:1rem}.ecp-p-6{padding:1.5rem}.ecp-p-8{padding:2rem}.ecp-px-2{padding-left:.5rem;padding-right:.5rem}.ecp-px-3{padding-left:.75rem;padding-right:.75rem}.ecp-px-4{padding-left:1rem;padding-right:1rem}.ecp-px-6{padding-left:1.5rem;padding-right:1.5rem}.ecp-py-1{padding-top:.25rem;padding-bottom:.25rem}.ecp-py-2{padding-top:.5rem;padding-bottom:.5rem}.ecp-py-3{padding-top:.75rem;padding-bottom:.75rem}.ecp-py-5{padding-top:1.25rem;padding-bottom:1.25rem}.ecp-pb-2{padding-bottom:.5rem}.ecp-pt-2{padding-top:.5rem}.ecp-w-1{width:.25rem}.ecp-w-3{width:.75rem}.ecp-w-4{width:1rem}.ecp-w-10{width:2.5rem}.ecp-w-12{width:3rem}.ecp-w-20{width:5rem}.ecp-w-24{width:6rem}.ecp-w-px{width:1px}.ecp-w-full{width:100%}.ecp-max-w-xs{max-width:20rem}.ecp-max-w-lg{max-width:32rem}.ecp-max-w-4xl{max-width:56rem}.ecp-h-0-5{height:.125rem}.ecp-h-1{height:.25rem}.ecp-h-1-5{height:.375rem}.ecp-h-2{height:.5rem}.ecp-h-3{height:.75rem}.ecp-h-4{height:1rem}.ecp-h-6{height:1.5rem}.ecp-h-8{height:2rem}.ecp-h-10{height:2.5rem}.ecp-h-12{height:3rem}.ecp-h-20{height:5rem}.ecp-h-40{width:10rem;height:40px}.ecp-h-64{height:16rem}.ecp-h-screen{height:100vh}.ecp-min-h-screen{min-height:100vh}.ecp-min-h-0{min-height:0}.ecp-min-w-12{min-width:3rem}.ecp-min-w-0{min-width:0}.ecp-aspect-square{aspect-ratio:1 / 1}.ecp-text-xs{font-size:.75rem;line-height:1rem}.ecp-text-sm{font-size:.875rem;line-height:1.25rem}.ecp-text-lg{font-size:1.125rem;line-height:1.75rem}.ecp-text-2xl{font-size:1.5rem;line-height:2rem}.ecp-font-medium{font-weight:500}.ecp-font-semibold{font-weight:600}.ecp-font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}.ecp-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ecp-text-white{color:#fff}.ecp-text-transparent{color:transparent}.ecp-text-gray-400{color:#9ca3af}.ecp-text-gray-500{color:#6b7280}.ecp-text-gray-600{color:#4b5563}.ecp-text-gray-700{color:#374151}.ecp-text-gray-800{color:#1f2937}.ecp-text-gray-100{color:#f3f4f6}.ecp-text-gray-200{color:#e5e7eb}.ecp-text-gray-300{color:#d1d5db}.ecp-text-red-500{color:#ef4444}.ecp-dark .ecp-text-dark-100{color:#f3f4f6}.ecp-dark .ecp-text-dark-200{color:#e5e7eb}.ecp-dark .ecp-text-dark-300{color:#d1d5db}.ecp-bg-white{background-color:#fff}.ecp-bg-black-20{background-color:#0003}.ecp-bg-black-30{background-color:#0000004d}.ecp-bg-black-40{background-color:#0006}.ecp-bg-black-50{background-color:#00000080}.ecp-bg-gray-100{background-color:#f3f4f6}.ecp-bg-gray-200{background-color:#e5e7eb}.ecp-bg-gray-300{background-color:#d1d5db}.ecp-bg-gray-700{background-color:#374151}.ecp-bg-gray-800{background-color:#1f2937}.ecp-bg-red-50{background-color:#fef2f2}.ecp-bg-transparent{background-color:transparent}.ecp-border{border-width:1px}.ecp-border-2{border-width:2px}.ecp-border-r{border-right-width:1px}.ecp-border-transparent{border-color:transparent}.ecp-border-gray-300{border-color:#d1d5db}.ecp-border-red-300{border-color:#fca5a5}.ecp-border-current{border-color:currentColor}.ecp-border-none{border:none}.ecp-outline-none{outline:none}.ecp-rounded{border-radius:.25rem}.ecp-rounded-lg{border-radius:.5rem}.ecp-rounded-xl{border-radius:.75rem}.ecp-rounded-2xl{border-radius:1rem}.ecp-rounded-full{border-radius:9999px}.ecp-rounded-t{border-top-left-radius:.25rem;border-top-right-radius:.25rem}.ecp-shadow-sm{box-shadow:0 1px 2px #0000000d}.ecp-shadow-lg{box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a}.ecp-shadow-2xl{box-shadow:0 25px 50px -12px #00000040}.ecp-opacity-20{opacity:.2}.ecp-opacity-40{opacity:.4}.ecp-opacity-70{opacity:.7}.ecp-opacity-80{opacity:.8}.ecp-cursor-pointer{cursor:pointer}.ecp-cursor-not-allowed{cursor:not-allowed}.ecp-pointer-events-none{pointer-events:none}.ecp-transition{transition-property:color,background-color,border-color,opacity,box-shadow,transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ecp-transition-all{transition:all .15s cubic-bezier(.4,0,.2,1)}.ecp-duration-75{transition-duration:75ms}.ecp-duration-100{transition-duration:.1s}.ecp-duration-150{transition-duration:.15s}.ecp-duration-300{transition-duration:.3s}.ecp-scale-0{transform:scale(0)}.ecp-translate-y-10{transform:translateY(2.5rem)}.ecp--translate-y-10{transform:translateY(-2.5rem)}.ecp-rotate-180{transform:rotate(180deg)}.ecp-hover-scale-105:hover{transform:scale(1.05)}.ecp-hover-scale-110:hover{transform:scale(1.1)}@keyframes ecp-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.ecp-animation-spin{animation:ecp-spin 15s infinite linear}.ecp-object-contain{-o-object-fit:contain;object-fit:contain}.ecp-backdrop-blur-xl{-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}.ecp-overflow-hidden{overflow:hidden}.ecp-top-0{top:0}.ecp-left-0{left:0}.ecp-fixed{position:fixed}.ecp-z-9999{z-index:9999}.ecp-appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.ecp-page-wrapper{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1rem}@media (min-width: 768px){.ecp-page-wrapper{padding:2rem}}.ecp-demo-container{width:100%;height:100%}@media (min-width: 768px){.ecp-demo-container{height:auto;max-width:56rem}}.ecp-container-glass{border-radius:.75rem;padding:2rem}.ecp-demo-header{margin-bottom:1.5rem;display:flex;justify-content:space-between;align-items:flex-start}.ecp-demo-title{font-size:1.5rem;font-weight:600;color:#1f2937;margin-bottom:.25rem}.ecp-demo-title--dark{color:#e5e7eb}.ecp-demo-subtitle{font-size:.875rem;color:#6b7280}.ecp-theme-btn{background:#fff;border:1px solid #d1d5db;color:#374151;padding:.5rem 1rem;border-radius:.5rem;font-size:.875rem;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:.5rem}.ecp-theme-btn:hover{background:#f9fafb}.ecp-demo-actions{margin-top:1.5rem;display:flex;flex-wrap:wrap;align-items:center;gap:.75rem}.ecp-action-btn{background:#fff;border:1px solid #d1d5db;color:#374151;padding:.5rem 1.5rem;border-radius:.5rem;font-size:.875rem;font-weight:500;cursor:pointer;display:flex;align-items:center;gap:.5rem}.ecp-action-btn:hover{background:#f9fafb}.ecp-file-input-hidden{display:none}.ecp-theme-selector-panel{border-radius:.75rem;padding:1.5rem;margin-bottom:1.5rem}.ecp-theme-selector-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.ecp-theme-selector-title{font-size:1.125rem;font-weight:600;color:#1f2937}.ecp-theme-selector-close{color:#6b7280;font-size:.875rem;font-weight:500;background:none;border:none;cursor:pointer}.ecp-theme-selector-close:hover{color:#374151}.ecp-theme-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}@media (min-width: 640px){.ecp-theme-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (min-width: 768px){.ecp-theme-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}.ecp-theme-card{background:#fff;padding:1rem;border-radius:.5rem;cursor:pointer;border:2px solid transparent;transition:all .15s cubic-bezier(.4,0,.2,1)}.ecp-theme-card--active{border-color:currentColor;box-shadow:0 10px 15px -3px #0000001a}.ecp-theme-color-preview{height:2.5rem;border-radius:.25rem;margin-bottom:.5rem}.ecp-theme-name{font-size:.875rem;font-weight:500;color:#374151}.ecp-vp-wrapper{width:100%;border-radius:.75rem;overflow:hidden}.ecp-vp-bg{padding:1rem}.ecp-vp-vu-outer{position:relative}.ecp-vp-vu-bg{border-radius:.5rem;margin-bottom:1.5rem;padding:1rem;box-shadow:0 1px 2px #0000000d}.ecp-vp-vu-bg--light{background:#ffffffb3}.ecp-vp-vu-bg--dark{background:#0006}.ecp-vp-vu-bg--transparent{background:transparent!important;padding:0!important;box-shadow:none!important}.ecp-vp-vu-bg--dimmed{opacity:.3}.ecp-vp-vu-bg--no-margin{margin-bottom:0}.ecp-vp-vu-bars{display:flex;justify-content:center;align-items:flex-end;gap:.25rem;height:16rem}.ecp-vp-eq-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;width:100%;justify-content:center;z-index:10;border-radius:.5rem;padding:1rem;box-shadow:0 1px 2px #0000000d;transition:all .3s cubic-bezier(.4,0,.2,1)}.ecp-vp-eq-overlay--light{background:#fffc}.ecp-vp-eq-overlay--dark{background:#00000080}.ecp-vp-eq-title{font-size:.875rem;font-weight:500;margin-bottom:1rem}.ecp-vp-eq-title--light{color:#374151}.ecp-vp-eq-title--dark{color:#e5e7eb}.ecp-vp-eq-bands{display:flex;flex-direction:column;gap:1rem}.ecp-vp-eq-band-header{display:flex;justify-content:space-between;margin-bottom:.25rem}.ecp-vp-eq-band-label{font-size:.75rem}.ecp-vp-eq-band-label--light{color:#4b5563}.ecp-vp-eq-band-label--dark{color:#d1d5db}.ecp-vp-eq-band-range{display:flex;align-items:center;gap:.75rem}.ecp-vp-eq-range-bound{font-size:.75rem}.ecp-vp-eq-range-bound--light{color:#6b7280}.ecp-vp-eq-range-bound--dark{color:#9ca3af}.ecp-vp-eq-slider{flex:1;height:2rem;background:#d1d5db;border-radius:.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.ecp-vp-eq-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:0;height:0;background:transparent;border:none;box-shadow:none}.ecp-vp-eq-slider::-moz-range-thumb{width:0;height:0;background:transparent;border:none;box-shadow:none}.ecp-vp-eq-footer{display:flex;justify-content:flex-end;margin-top:1rem}.ecp-vp-eq-reset{padding:.25rem .75rem;border-radius:.25rem;font-size:.75rem;cursor:pointer;transition:all .15s;border:none}.ecp-vp-eq-reset--light{background:#e5e7eb;color:#374151}.ecp-vp-eq-reset--light:hover{background:#d1d5db}.ecp-vp-eq-reset--dark{background:#374151;color:#e5e7eb}.ecp-vp-eq-reset--dark:hover{background:#4b5563}.ecp-vp-track{margin-bottom:1.5rem;display:flex;align-items:center}.ecp-vp-thumbnail-wrap{margin-right:.5rem;width:3rem;flex-shrink:0}.ecp-vp-thumbnail{height:3rem;width:3rem;border-radius:9999px}.ecp-vp-track-info{width:100%;min-width:0}.ecp-vp-track-name{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ecp-vp-track-name--light{color:#374151}.ecp-vp-track-name--dark{color:#f3f4f6}.ecp-vp-track-author{font-size:.75rem}.ecp-vp-track-author--light{color:#6b7280}.ecp-vp-track-author--dark{color:#d1d5db}.ecp-vp-seekbar{margin-bottom:1.5rem}.ecp-vp-seekbar-row{display:flex;align-items:center;gap:.25rem}.ecp-vp-time{font-size:.75rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;width:3rem}.ecp-vp-time--right{text-align:right}.ecp-vp-time--light{color:#4b5563}.ecp-vp-time--dark{color:#f3f4f6}.ecp-vp-seek-input{flex:1;height:.5rem;background:#e5e7eb;border-radius:.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.ecp-vp-seek-input:disabled{opacity:.4;cursor:not-allowed}.ecp-vp-seek-input::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;cursor:pointer;background:var(--thumb-color, #ffffff);border:none;box-shadow:0 2px 6px #0003}.ecp-vp-seek-input::-moz-range-thumb{width:16px;height:16px;border-radius:50%;cursor:pointer;background:var(--thumb-color, #ffffff);border:none;box-shadow:0 2px 6px #0003}.ecp-vp-controls{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem}.ecp-vp-controls--sm{gap:.5rem}.ecp-vp-play-btn{padding:.5rem 1rem;min-width:6rem;border-radius:9999px;font-size:.875rem;font-weight:500;color:#fff;border:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:opacity .15s}.ecp-vp-play-btn:hover{opacity:.9}.ecp-vp-play-btn:disabled{opacity:.4;cursor:not-allowed}.ecp-vp-play-btn--compact{padding:1.25rem .75rem;min-width:unset}.ecp-vp-play-icon-wrap{position:relative;width:1rem;display:flex;align-items:center}.ecp-vp-stop-btn{padding:.75rem;border-radius:9999px;font-size:.875rem;font-weight:500;border:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .15s}.ecp-vp-stop-btn--light{background:#374151;color:#fff}.ecp-vp-stop-btn--light:hover{background:#1f2937}.ecp-vp-stop-btn--dark{background:#f3f4f6;color:#000}.ecp-vp-stop-btn--dark:hover{background:#d1d5db}.ecp-vp-stop-btn:disabled{opacity:.4;cursor:not-allowed}.ecp-vp-stop-btn--wide{padding:.5rem 1rem}.ecp-vp-eq-btn{padding:.75rem;border-radius:9999px;font-size:.875rem;font-weight:500;border:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .15s}.ecp-vp-eq-btn--off{background:#f3f4f6;color:#374151}.ecp-vp-eq-btn--off:hover{background:#d1d5db}.ecp-vp-eq-btn--on{color:#fff}.ecp-vp-eq-btn:disabled{opacity:.4;cursor:not-allowed}.ecp-vp-eq-btn--wide{padding:.5rem 1rem}.ecp-vp-loop-btn{padding:.75rem;border-radius:9999px;font-size:.875rem;font-weight:500;border:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .15s}.ecp-vp-loop-btn--off{background:#f3f4f6;color:#374151}.ecp-vp-loop-btn--off:hover{background:#d1d5db}.ecp-vp-loop-btn--on{color:#fff}.ecp-vp-loop-btn:disabled{opacity:.4;cursor:not-allowed}.ecp-vp-loop-btn--wide{padding:.5rem 1rem}.ecp-vp-loop-icon--active{transform:rotate(180deg)}.ecp-vp-speed-wrap{display:flex;align-items:center}.ecp-vp-speed-select{border-radius:9999px;font-size:.875rem;font-weight:500;border:none;outline:none;cursor:pointer;transition:all .15s;background:transparent}.ecp-vp-speed-select--light{color:#1f2937}.ecp-vp-speed-select--dark{color:#e5e7eb}.ecp-vp-speed-option--light{background:#fff;color:#1f2937}.ecp-vp-speed-option--dark{background:#1f2937;color:#f3f4f6}.ecp-vp-volume{display:flex;align-items:center;gap:.25rem;margin-left:auto}@media (min-width: 768px){.ecp-vp-volume{gap:.75rem}}.ecp-vp-mute-btn{padding:.5rem;border-radius:9999px;background:none;border:none;cursor:pointer;transition:all .15s}.ecp-vp-mute-btn:hover{background:#f3f4f680}.ecp-vp-mute-icon--light{color:#4b5563}.ecp-vp-mute-icon--dark{color:#f3f4f6}.ecp-vp-volume-slider{width:6rem;height:.5rem;border-radius:.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.ecp-vp-volume-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;cursor:pointer;background:var(--thumb-color, #ffffff);border:none;box-shadow:0 2px 6px #0003}.ecp-vp-volume-slider::-moz-range-thumb{width:16px;height:16px;border-radius:50%;cursor:pointer;background:var(--thumb-color, #ffffff);border:none;box-shadow:0 2px 6px #0003}@media (max-width: 460px){.ecp-vp-volume-slider{display:none}}.ecp-vp-volume-pct{font-size:.75rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;width:2.5rem;text-align:right}.ecp-vp-volume-pct--light{color:#374151}.ecp-vp-volume-pct--dark{color:#f3f4f6}.ecp-vp-error{font-size:.875rem;color:#ef4444;background:#fef2f2;padding:.75rem;border-radius:.25rem;margin-bottom:1rem;border:1px solid #fca5a5}.ecp-wave-outer{width:100%;max-width:32rem;position:relative}.ecp-wave-audio-el{display:none}.ecp-wave-card{border-radius:1rem;box-shadow:0 25px 50px -12px #00000040}.ecp-wave-card-inner{border-radius:1rem;padding:1.5rem;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}.ecp-wave-thumbnail-wrap{width:100%;padding:1rem}.ecp-wave-thumbnail{width:100%;aspect-ratio:1 / 1;border-radius:.75rem}.ecp-wave-seek{position:relative;height:5rem;margin-bottom:1.5rem;cursor:pointer}.ecp-wave-bars{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:flex-end;justify-content:center;height:100%;width:100%;gap:1px}.ecp-wave-bar{width:.25rem;border-radius:.25rem .25rem 0 0;transition:all .15s}.ecp-wave-progress-line{position:absolute;top:0;height:100%;width:.25rem;background:#fff;border-right:1px solid black;border-radius:9999px;transition:all .15s;transform:translate(-50%)}.ecp-wave-times{display:flex;justify-content:space-between;font-size:.875rem;margin-bottom:1.5rem}.ecp-wave-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;justify-content:space-between;margin-bottom:1rem}.ecp-wave-left-controls{display:flex;align-items:center;gap:.5rem}.ecp-wave-vol-btn{padding:.5rem;border-radius:9999px;border:none;cursor:pointer;transition:all .15s}.ecp-wave-vol-slider{width:5rem;height:.375rem;border-radius:.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.ecp-wave-vol-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;cursor:pointer;background:var(--thumb-color, #ffffff);border:none;box-shadow:0 1px 3px #0003}.ecp-wave-vol-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;cursor:pointer;background:var(--thumb-color, #ffffff);border:none}.ecp-wave-center-controls{display:flex;justify-content:center}.ecp-wave-play-btn{padding:1rem;border-radius:9999px;border:none;cursor:pointer;transition:all .15s;box-shadow:0 10px 15px -3px #0000001a}.ecp-wave-play-btn:hover{transform:scale(1.05)}.ecp-wave-right-controls{display:flex;align-items:center;gap:.75rem}.ecp-wave-speed-select{padding:.25rem .5rem;border-radius:.5rem;font-size:.875rem;border:none;cursor:pointer}.ecp-wave-speed-select--light{background:#f3f4f6;color:#374151}.ecp-wave-speed-select--dark{background:#1f2937;color:#f3f4f6}.ecp-wave-eq-btn{padding:.5rem;border-radius:9999px;border:none;cursor:pointer;transition:all .15s}.ecp-wave-eq-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#0003;display:flex;align-items:center;justify-content:center;z-index:10;border-radius:1rem;padding:1rem}.ecp-wave-eq-panel{max-width:20rem;width:100%;padding:.5rem 1rem 1rem;border-radius:.75rem}.ecp-wave-eq-panel--light{background:#fff}.ecp-wave-eq-panel--dark{background:#1f2937}.ecp-wave-eq-title{font-size:1.125rem;font-weight:500;margin-bottom:.5rem}.ecp-wave-eq-title--light{color:#374151}.ecp-wave-eq-title--dark{color:#e5e7eb}.ecp-wave-eq-bands{display:flex;flex-direction:column;gap:1rem}.ecp-wave-eq-band-header{display:flex;justify-content:space-between;margin-bottom:.25rem}.ecp-wave-eq-label--light{font-size:.75rem;color:#4b5563}.ecp-wave-eq-label--dark{font-size:.75rem;color:#d1d5db}.ecp-wave-eq-range-row{display:flex;align-items:center;gap:.75rem}.ecp-wave-eq-bound--light{font-size:.75rem;color:#6b7280}.ecp-wave-eq-bound--dark{font-size:.75rem;color:#9ca3af}.ecp-wave-eq-slider{flex:1;height:1rem;background:#d1d5db;border-radius:.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.ecp-wave-eq-slider::-webkit-slider-thumb{-webkit-appearance:none;width:0;height:0;background:transparent;border:none;box-shadow:none}.ecp-wave-eq-slider::-moz-range-thumb{width:0;height:0;background:transparent;border:none}.ecp-wave-eq-footer{display:flex;justify-content:space-between;margin-top:1.5rem}.ecp-wave-eq-footer-btn{padding:.25rem .75rem;border-radius:.25rem;font-size:.75rem;cursor:pointer;border:none;transition:all .15s}.ecp-wave-eq-footer-btn--light{background:#e5e7eb;color:#374151}.ecp-wave-eq-footer-btn--light:hover{background:#d1d5db}.ecp-wave-eq-footer-btn--dark{background:#374151;color:#e5e7eb}.ecp-wave-eq-footer-btn--dark:hover{background:#4b5563}.ecp-wave-error{padding:1.5rem;border-radius:.75rem;text-align:center}.ecp-wave-error-title{font-weight:500}.ecp-wave-error-msg{font-size:.875rem}.ecp-wave-error--light{color:#dc2626}.ecp-wave-error--dark{color:#fca5a5}.ecp-nano-wrapper{position:relative;overflow:hidden;display:inline-flex;flex-direction:column;padding:.5rem .75rem;box-shadow:0 10px 15px -3px #0000001a}.ecp-nano-wrapper--pill{border-radius:9999px;width:110px;height:40px}.ecp-nano-wrapper--card{border-radius:1rem;width:120px;height:150px}.ecp-nano-progress-bg{position:absolute;top:0;left:0;height:100%;opacity:.2}.ecp-nano-content{position:absolute;display:flex;flex-direction:column}.ecp-nano-thumbnail-wrap{width:6rem;padding-bottom:.5rem}.ecp-nano-thumbnail{width:6rem;aspect-ratio:1 / 1;border-radius:.75rem}.ecp-nano-row{display:flex;align-items:center;gap:.5rem}.ecp-nano-play-btn{padding:.375rem;border-radius:9999px;border:none;cursor:pointer;flex-shrink:0;transition:transform .15s}.ecp-nano-play-btn:hover{transform:scale(1.1)}.ecp-nano-waveform{display:flex;width:100%;min-width:3rem;align-items:center;gap:2px;height:1.5rem}.ecp-nano-wave-bar{border-radius:9999px;width:100%;transition:height .2s}.ecp-video-wrapper{border-radius:.75rem;overflow:hidden;transition:all .3s cubic-bezier(.4,0,.2,1)}.ecp-video-wrapper--fullscreen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;display:flex;flex-direction:column;height:100vh;width:100vw;background:#000}.ecp-video-inner{height:auto}.ecp-video-inner--fullscreen{display:flex;flex-direction:column;flex:1;min-height:0}.ecp-video-inner--padded{padding:1rem}.ecp-video-name{margin-bottom:1rem;font-weight:500}.ecp-video-name--light{color:#374151}.ecp-video-name--dark{color:#f3f4f6}.ecp-video-layout{position:relative;margin-bottom:1rem}.ecp-video-layout--row{display:flex;gap:.75rem}.ecp-video-layout--col{display:flex;flex-direction:column;gap:.75rem}.ecp-video-layout--fullscreen{flex:1;min-height:0}.ecp-video-vu-top,.ecp-video-vu-bottom{width:100%;height:3rem}.ecp-video-vu-side{width:3rem;background:#00000080;border-radius:.5rem;padding:.25rem}.ecp-video-el-wrap{flex:1;border-radius:.5rem;overflow:hidden;position:relative}.ecp-video-el-wrap--light{background:#ffffffb3}.ecp-video-el-wrap--dark{background:#000000b3}.ecp-video-el{width:100%;height:100%;-o-object-fit:contain;object-fit:contain}.ecp-video-eq-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;width:100%;justify-content:center;z-index:10;border-radius:.5rem;padding:1rem;box-shadow:0 1px 2px #0000000d;transition:all .3s}.ecp-video-eq-panel{max-width:600px;width:100%;margin:0 auto;display:flex;flex-direction:column;justify-content:center;border-radius:.5rem;padding:1rem;box-shadow:0 1px 2px #0000000d;transition:all .3s}.ecp-video-eq-panel--light{background:#fffc}.ecp-video-eq-panel--dark{background:#000000b3}.ecp-video-eq-title{font-size:.875rem;font-weight:500;margin-bottom:1rem}.ecp-video-eq-title--light{color:#374151}.ecp-video-eq-title--dark{color:#e5e7eb}.ecp-video-eq-bands{display:flex;flex-direction:column;gap:1rem}.ecp-video-eq-band-header{display:flex;justify-content:space-between;margin-bottom:.25rem}.ecp-video-eq-label--light{font-size:.75rem;color:#4b5563}.ecp-video-eq-label--dark{font-size:.75rem;color:#d1d5db}.ecp-video-eq-range-row{display:flex;align-items:center;gap:.75rem}.ecp-video-eq-bound--light{font-size:.75rem;color:#6b7280}.ecp-video-eq-bound--dark{font-size:.75rem;color:#9ca3af}.ecp-video-eq-slider{flex:1;height:1.5rem;background:#d1d5db;border-radius:.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.ecp-video-eq-slider::-webkit-slider-thumb{-webkit-appearance:none;width:0;height:0;background:transparent;border:none;box-shadow:none}.ecp-video-eq-slider::-moz-range-thumb{width:0;height:0;background:transparent;border:none}.ecp-video-eq-footer{display:flex;justify-content:space-between;margin-top:1.5rem}.ecp-video-eq-footer-btn{padding:.25rem .75rem;border-radius:.25rem;font-size:.75rem;cursor:pointer;border:none;transition:all .15s}.ecp-video-eq-footer-btn--light{background:#e5e7eb;color:#374151}.ecp-video-eq-footer-btn--light:hover{background:#d1d5db}.ecp-video-eq-footer-btn--dark{background:#374151;color:#e5e7eb}.ecp-video-eq-footer-btn--dark:hover{background:#4b5563}.ecp-video-seekbar{margin-bottom:1rem}.ecp-video-seekbar--fullscreen{margin-top:.75rem}.ecp-video-seekbar-row{display:flex;align-items:center;gap:.75rem}.ecp-video-time{font-size:.75rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;width:3rem}.ecp-video-time--right{text-align:right}.ecp-video-time--light{color:#4b5563}.ecp-video-time--dark{color:#f3f4f6}.ecp-video-seek-input{flex:1;height:.5rem;border-radius:.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.ecp-video-seek-input:disabled{opacity:.4;cursor:not-allowed}.ecp-video-seek-input::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;cursor:pointer;background:var(--thumb-color, #ffffff);border:none;box-shadow:0 2px 6px #0003}.ecp-video-seek-input::-moz-range-thumb{width:16px;height:16px;border-radius:50%;cursor:pointer;background:var(--thumb-color, #ffffff);border:none;box-shadow:0 2px 6px #0003}.ecp-video-controls{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem}.ecp-video-play-btn{border-radius:9999px;font-size:.875rem;font-weight:500;color:#fff;border:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:opacity .15s;padding:.5rem 1rem}.ecp-video-play-btn:hover{opacity:.9}.ecp-video-play-btn:disabled{opacity:.4;cursor:not-allowed}.ecp-video-play-btn--compact{padding:1.25rem .75rem}.ecp-video-play-icon-wrap{position:relative;width:1rem;display:flex;align-items:center}.ecp-video-stop-btn{padding:.75rem;border-radius:9999px;font-size:.875rem;font-weight:500;border:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .15s}.ecp-video-stop-btn--light{background:#374151;color:#fff}.ecp-video-stop-btn--light:hover{background:#1f2937}.ecp-video-stop-btn--dark{background:#f3f4f6;color:#000}.ecp-video-stop-btn--dark:hover{background:#d1d5db}.ecp-video-stop-btn:disabled{opacity:.4;cursor:not-allowed}.ecp-video-fullscreen-btn{border-radius:9999px;font-size:.875rem;font-weight:500;border:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .15s;padding:.75rem}.ecp-video-fullscreen-btn--light{background:#374151;color:#fff}.ecp-video-fullscreen-btn--light:hover{background:#1f2937}.ecp-video-fullscreen-btn--dark{background:#f3f4f6;color:#000}.ecp-video-fullscreen-btn--dark:hover{background:#d1d5db}.ecp-video-fullscreen-btn--wide{padding:.5rem 1rem}.ecp-video-eq-toggle-btn{padding:.75rem;border-radius:9999px;font-size:.875rem;font-weight:500;border:none;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .15s}.ecp-video-eq-toggle-btn--off{background:#f3f4f6;color:#374151}.ecp-video-eq-toggle-btn--off:hover{background:#d1d5db}.ecp-video-eq-toggle-btn--on{color:#fff}.ecp-video-eq-toggle-btn:disabled{opacity:.4;cursor:not-allowed}.ecp-video-eq-toggle-btn--wide{padding:.5rem 1rem}.ecp-video-speed-wrap{display:flex;align-items:center}.ecp-video-speed-select{border-radius:9999px;font-size:.875rem;font-weight:500;border:none;outline:none;cursor:pointer;background:transparent;transition:all .15s}.ecp-video-speed-select--light{color:#1f2937}.ecp-video-speed-select--dark{color:#e5e7eb}.ecp-video-speed-option--light{background:#f3f4f6;color:#1f2937}.ecp-video-speed-option--dark{background:#1f2937;color:#f3f4f6}.ecp-video-volume{display:flex;align-items:center;gap:.25rem;margin-left:auto}@media (min-width: 768px){.ecp-video-volume{gap:.75rem}}.ecp-video-mute-btn{padding:.5rem;border-radius:.5rem;background:none;border:none;cursor:pointer;transition:all .15s}.ecp-video-mute-btn:hover{background:#f3f4f6}.ecp-video-mute-icon--light{color:#4b5563}.ecp-video-mute-icon--dark{color:#f3f4f6}.ecp-video-vol-slider{width:6rem;height:.5rem;border-radius:.5rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer}.ecp-video-vol-slider::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;cursor:pointer;background:var(--thumb-color, #ffffff);border:none;box-shadow:0 2px 6px #0003}.ecp-video-vol-slider::-moz-range-thumb{width:16px;height:16px;border-radius:50%;cursor:pointer;background:var(--thumb-color, #ffffff);border:none;box-shadow:0 2px 6px #0003}@media (max-width: 460px){.ecp-video-vol-slider{display:none}}.ecp-video-vol-pct{font-size:.75rem;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;width:2.5rem;text-align:right}.ecp-video-vol-pct--light{color:#374151}.ecp-video-vol-pct--dark{color:#f3f4f6}.ecp-video-error{font-size:.875rem;color:#ef4444;background:#fef2f2;padding:.75rem;border-radius:.25rem;margin-bottom:1rem;border:1px solid #fca5a5}.ecp-vu-bar-wrap{flex:1;height:100%;position:relative;display:flex;flex-direction:column;justify-content:flex-end}.ecp-vu-bar-fill{border-radius:.25rem .25rem 0 0;transition:height 75ms}.ecp-vu-peak-line{position:absolute;width:100%;height:2px;transition:top .1s}")),document.head.appendChild(e)}}catch(r){console.error("vite-plugin-css-injected-by-js",r)}})();
2
2
  import { jsx as e, Fragment as Ve, jsxs as c } from "react/jsx-runtime";
3
- import { forwardRef as Qe, createElement as Ie, useState as m, useRef as h, useEffect as $ } from "react";
3
+ import { forwardRef as Qe, createElement as Ie, useState as m, useRef as b, useEffect as $ } from "react";
4
4
  /**
5
5
  * @license lucide-react v0.540.0 - ISC
6
6
  *
@@ -65,7 +65,7 @@ const et = Qe(
65
65
  ...O
66
66
  },
67
67
  [
68
- ...y.map(([j, I]) => Ie(j, I)),
68
+ ...y.map(([F, I]) => Ie(F, I)),
69
69
  ...Array.isArray(f) ? f : [f]
70
70
  ]
71
71
  )
@@ -322,7 +322,7 @@ const ft = [
322
322
  slider: "#ec4899"
323
323
  }
324
324
  };
325
- function vt({ theme: s, setTheme: l, close: u }) {
325
+ function ht({ theme: s, setTheme: l, close: u }) {
326
326
  const v = Object.keys(ge).map((C) => ({
327
327
  key: C,
328
328
  name: ge[C].name,
@@ -353,7 +353,7 @@ function vt({ theme: s, setTheme: l, close: u }) {
353
353
  )) })
354
354
  ] });
355
355
  }
356
- function ht({
356
+ function vt({
357
357
  audio: s,
358
358
  name: l = "No track loaded",
359
359
  author: u,
@@ -373,15 +373,15 @@ function ht({
373
373
  },
374
374
  mode: O = "light",
375
375
  bands: x = null,
376
- transparent: j = !1,
376
+ transparent: F = !1,
377
377
  autoPlay: I = !1,
378
- equalizer: M = { bass: 0, mid: 0, treble: 0 }
378
+ equalizer: z = { bass: 0, mid: 0, treble: 0 }
379
379
  }) {
380
- const [L, H] = m(!1), [B, F] = m(0), [P, D] = m(0), [k, z] = m(C || 100), [ae, me] = m(!1), [V, ee] = m(!1), [se, ie] = m(!1), [ce, de] = m([]), [R, Q] = m(!1), [Y, oe] = m({
381
- bass: M.bass || 0,
382
- mid: M.mid || 0,
383
- treble: M.treble || 0
384
- }), [ue, te] = m(1), [G, w] = m(0), p = h(null), A = h(null), K = h(null), fe = h(null), W = h(null), re = h(null), X = h(null), N = h(null), T = h(null), Z = h(null);
380
+ const [E, H] = m(!1), [j, P] = m(0), [M, D] = m(0), [k, S] = m(C || 100), [ae, me] = m(!1), [V, ee] = m(!1), [se, ie] = m(!1), [ce, de] = m([]), [R, Q] = m(!1), [Y, oe] = m({
381
+ bass: z.bass || 0,
382
+ mid: z.mid || 0,
383
+ treble: z.treble || 0
384
+ }), [ue, te] = m(1), [G, w] = m(0), p = b(null), L = b(null), K = b(null), fe = b(null), W = b(null), re = b(null), X = b(null), N = b(null), T = b(null), Z = b(null);
385
385
  $(() => {
386
386
  const t = Z.current;
387
387
  if (!t) return;
@@ -435,13 +435,13 @@ function ht({
435
435
  { freq: 8e3 },
436
436
  { freq: 1e4 },
437
437
  { freq: 12500 }
438
- ], d = h(r.map(() => 0)), g = h(r.map(() => 0)), S = h(r.map(() => 0)), _ = h(!1), J = h(typeof v == "string" ? v : "purple"), b = typeof v == "string" ? ge[v] || ge.purple : typeof v == "object" ? v : ge.purple, E = O === "dark", ke = typeof y == "object" && Object.keys(y).length === 0;
438
+ ], d = b(r.map(() => 0)), g = b(r.map(() => 0)), B = b(r.map(() => 0)), _ = b(!1), J = b(typeof v == "string" ? v : "purple"), h = typeof v == "string" ? ge[v] || ge.purple : typeof v == "object" ? v : ge.purple, A = O === "dark", ke = typeof y == "object" && Object.keys(y).length === 0;
439
439
  $(() => {
440
- typeof v == "string" ? J.current = v : J.current = "purple", he();
440
+ typeof v == "string" ? J.current = v : J.current = "purple", ve();
441
441
  }, [v]), $(() => {
442
442
  p.current || (p.current = new Audio());
443
443
  const t = p.current, a = () => {
444
- se || F(t.currentTime);
444
+ se || P(t.currentTime);
445
445
  }, o = () => D(t.duration), i = () => {
446
446
  V || (H(!1), N.current && cancelAnimationFrame(N.current));
447
447
  }, q = () => H(!0), U = () => H(!1);
@@ -449,10 +449,10 @@ function ht({
449
449
  t.removeEventListener("timeupdate", a), t.removeEventListener("loadedmetadata", o), t.removeEventListener("ended", i), t.removeEventListener("play", q), t.removeEventListener("pause", U);
450
450
  };
451
451
  }, [se, V]), $(() => () => {
452
- p.current && (p.current.pause(), p.current.src = "", p.current.load()), A.current && A.current.close().catch((t) => console.warn("AudioContext cleanup error:", t)), N.current && cancelAnimationFrame(N.current);
452
+ p.current && (p.current.pause(), p.current.src = "", p.current.load()), L.current && L.current.close().catch((t) => console.warn("AudioContext cleanup error:", t)), N.current && cancelAnimationFrame(N.current);
453
453
  }, []), $(() => {
454
454
  if (s) {
455
- const t = L, a = k, o = V;
455
+ const t = E, a = k, o = V;
456
456
  if (N.current && (cancelAnimationFrame(N.current), N.current = null), fe.current) {
457
457
  try {
458
458
  fe.current.disconnect();
@@ -488,18 +488,18 @@ function ht({
488
488
  }
489
489
  X.current = null;
490
490
  }
491
- A.current && (A.current.close().catch((ne) => console.warn("AudioContext close error:", ne)), A.current = null), p.current && (p.current.pause(), p.current.src = "", p.current.load()), p.current = new Audio();
491
+ L.current && (L.current.close().catch((ne) => console.warn("AudioContext close error:", ne)), L.current = null), p.current && (p.current.pause(), p.current.src = "", p.current.load()), p.current = new Audio();
492
492
  try {
493
493
  p.current.crossOrigin = "anonymous";
494
494
  } catch {
495
495
  }
496
496
  p.current.src = s, p.current.preload = "auto", p.current.muted = !1, p.current.volume = ae ? 0 : a / 100, p.current.loop = o, p.current.load();
497
497
  const i = p.current, q = () => {
498
- se || F(i.currentTime);
498
+ se || P(i.currentTime);
499
499
  }, U = () => D(i.duration), pe = () => {
500
500
  V || (H(!1), N.current && cancelAnimationFrame(N.current));
501
501
  }, ye = () => H(!0), $e = () => H(!1);
502
- i.addEventListener("timeupdate", q), i.addEventListener("loadedmetadata", U), i.addEventListener("ended", pe), i.addEventListener("play", ye), i.addEventListener("pause", $e), F(0), H(!1), d.current = r.map(() => 0), g.current = r.map(() => 0), S.current = r.map(() => 0), he(), t && p.current.play().catch((ne) => console.error("Play failed:", ne));
502
+ i.addEventListener("timeupdate", q), i.addEventListener("loadedmetadata", U), i.addEventListener("ended", pe), i.addEventListener("play", ye), i.addEventListener("pause", $e), P(0), H(!1), d.current = r.map(() => 0), g.current = r.map(() => 0), B.current = r.map(() => 0), ve(), t && p.current.play().catch((ne) => console.error("Play failed:", ne));
503
503
  }
504
504
  }, [s]), $(() => {
505
505
  p.current && (p.current.volume = ae ? 0 : k / 100);
@@ -508,17 +508,17 @@ function ht({
508
508
  }, [V]), $(() => {
509
509
  p.current && (p.current.playbackRate = ue);
510
510
  }, [ue]), $(() => {
511
- A.current && (W.current && (W.current.gain.value = Y.bass), re.current && (re.current.gain.value = Y.mid), X.current && (X.current.gain.value = Y.treble));
511
+ L.current && (W.current && (W.current.gain.value = Y.bass), re.current && (re.current.gain.value = Y.mid), X.current && (X.current.gain.value = Y.treble));
512
512
  }, [Y]), $(() => {
513
- _.current = L, N.current && (cancelAnimationFrame(N.current), N.current = null), L ? (A.current || Ce(), Ne()) : ve();
514
- }, [L]);
513
+ _.current = E, N.current && (cancelAnimationFrame(N.current), N.current = null), E ? (L.current || Ce(), Ne()) : he();
514
+ }, [E]);
515
515
  const Ce = () => {
516
- if (!A.current && p.current)
516
+ if (!L.current && p.current)
517
517
  try {
518
518
  const t = window.AudioContext || window.webkitAudioContext;
519
519
  if (t) {
520
520
  const a = new t();
521
- A.current = a;
521
+ L.current = a;
522
522
  const o = a.createBiquadFilter();
523
523
  o.type = "lowshelf", o.frequency.value = 320, o.gain.value = Y.bass;
524
524
  const i = a.createBiquadFilter();
@@ -534,17 +534,17 @@ function ht({
534
534
  console.error("Failed to setup audio context:", t);
535
535
  }
536
536
  }, we = (t) => {
537
- const a = A.current, o = K.current;
537
+ const a = L.current, o = K.current;
538
538
  if (!a || !o) return 0;
539
539
  const i = a.sampleRate / 2, q = Math.round(t / i * o.frequencyBinCount);
540
540
  return Math.min(q, o.frequencyBinCount - 1);
541
- }, ve = () => {
541
+ }, he = () => {
542
542
  if (_.current) return;
543
543
  d.current = d.current.map((i) => i * 0.7);
544
544
  const t = Date.now();
545
- g.current = g.current.map((i, q) => t - S.current[q] > 1500 ? i * 0.95 : i), he();
545
+ g.current = g.current.map((i, q) => t - B.current[q] > 1500 ? i * 0.95 : i), ve();
546
546
  const a = Math.max(...d.current), o = Math.max(...g.current);
547
- a > 0.01 || o > 0.01 ? N.current = requestAnimationFrame(ve) : (_.current || (d.current = r.map(() => 0), g.current = r.map(() => 0), S.current = r.map(() => 0), he()), N.current && cancelAnimationFrame(N.current), N.current = null);
547
+ a > 0.01 || o > 0.01 ? N.current = requestAnimationFrame(he) : (_.current || (d.current = r.map(() => 0), g.current = r.map(() => 0), B.current = r.map(() => 0), ve()), N.current && cancelAnimationFrame(N.current), N.current = null);
548
548
  }, Ne = () => {
549
549
  if (!K.current || !_.current) return;
550
550
  const t = K.current.frequencyBinCount, a = new Uint8Array(t);
@@ -556,9 +556,9 @@ function ht({
556
556
  let $e = ye > 0 ? pe / ye / 255 : 0;
557
557
  $e = Math.pow($e, 0.6), d.current[i] = d.current[i] * 0.8 + $e * 0.2;
558
558
  const ne = Date.now();
559
- d.current[i] > g.current[i] ? (g.current[i] = d.current[i], S.current[i] = ne) : ne - S.current[i] > 1500 && (g.current[i] *= 0.95);
560
- }), he(), N.current = requestAnimationFrame(Ne);
561
- }, he = () => {
559
+ d.current[i] > g.current[i] ? (g.current[i] = d.current[i], B.current[i] = ne) : ne - B.current[i] > 1500 && (g.current[i] *= 0.95);
560
+ }), ve(), N.current = requestAnimationFrame(Ne);
561
+ }, ve = () => {
562
562
  if (!T.current) return;
563
563
  const t = ge[J.current] || ge.rainbow;
564
564
  let a = "";
@@ -573,20 +573,20 @@ function ht({
573
573
  `;
574
574
  }), T.current.innerHTML = a;
575
575
  }, xe = () => {
576
- !p.current || !s || (L ? p.current.pause() : (A.current && A.current.state === "suspended" && A.current.resume(), p.current.play().catch((t) => console.error("Play failed:", t))));
576
+ !p.current || !s || (E ? p.current.pause() : (L.current && L.current.state === "suspended" && L.current.resume(), p.current.play().catch((t) => console.error("Play failed:", t))));
577
577
  }, Ee = () => {
578
- p.current && (p.current.pause(), p.current.currentTime = 0, H(!1), F(0), d.current = r.map(() => 0), g.current = r.map(() => 0), S.current = r.map(() => 0), he());
578
+ p.current && (p.current.pause(), p.current.currentTime = 0, H(!1), P(0), d.current = r.map(() => 0), g.current = r.map(() => 0), B.current = r.map(() => 0), ve());
579
579
  }, Le = (t) => {
580
- const o = parseFloat(t.target.value) / 100 * P;
581
- F(o), p.current && !se && (p.current.currentTime = o);
580
+ const o = parseFloat(t.target.value) / 100 * M;
581
+ P(o), p.current && !se && (p.current.currentTime = o);
582
582
  }, Ae = () => ie(!0), Re = () => {
583
- p.current && (p.current.currentTime = B), ie(!1);
583
+ p.current && (p.current.currentTime = j), ie(!1);
584
584
  }, ze = (t) => {
585
585
  const a = parseInt(t.target.value);
586
- z(a), me(a === 0);
586
+ S(a), me(a === 0);
587
587
  }, Se = () => me(!ae), Be = (t) => te(parseFloat(t.target.value)), je = () => ee(!V), Te = (t, a) => oe((o) => ({ ...o, [t]: a })), be = () => oe({ bass: 0, mid: 0, treble: 0 });
588
588
  $(() => {
589
- ((typeof y == "object" && Object.keys(y).length === 0 || !y) && !L || I) && xe();
589
+ ((typeof y == "object" && Object.keys(y).length === 0 || !y) && !E || I) && xe();
590
590
  }, [y]);
591
591
  const qe = (t) => {
592
592
  if (isNaN(t)) return "0:00";
@@ -602,22 +602,22 @@ function ht({
602
602
  " ",
603
603
  t[1]
604
604
  ] }, a)) });
605
- const Ue = ke || j ? void 0 : E ? "#6060606a" : "#ffffffab", Oe = ke || j ? void 0 : b.bg;
605
+ const Ue = ke || F ? void 0 : A ? "#6060606a" : "#ffffffab", Oe = ke || F ? void 0 : h.bg;
606
606
  return /* @__PURE__ */ e("div", { ref: Z, className: "ecp-vp-wrapper", style: { backgroundColor: Ue }, children: /* @__PURE__ */ c("div", { className: "ecp-vp-bg", style: { background: Oe }, children: [
607
607
  /* @__PURE__ */ c("div", { className: "ecp-vp-vu-outer", children: [
608
- /* @__PURE__ */ e("div", { className: `ecp-vp-vu-bg${E ? " ecp-vp-vu-bg--dark" : " ecp-vp-vu-bg--light"}${R && j ? " ecp-vp-vu-bg--dimmed" : ""}${ke ? " ecp-vp-vu-bg--no-margin" : ""}`, children: /* @__PURE__ */ e("div", { className: "ecp-vp-vu-bars", ref: T }) }),
609
- R && /* @__PURE__ */ c("div", { className: `ecp-vp-eq-overlay${E ? " ecp-vp-eq-overlay--dark" : " ecp-vp-eq-overlay--light"}`, children: [
610
- /* @__PURE__ */ e("h3", { className: `ecp-vp-eq-title${E ? " ecp-vp-eq-title--dark" : " ecp-vp-eq-title--light"}`, children: "Equalizer" }),
608
+ /* @__PURE__ */ e("div", { className: `ecp-vp-vu-bg ${F ? " ecp-vp-vu-bg--transparent" : A ? " ecp-vp-vu-bg--dark" : " ecp-vp-vu-bg--light"}${R && F ? " ecp-vp-vu-bg--dimmed" : ""}${ke ? " ecp-vp-vu-bg--no-margin" : ""}`, children: /* @__PURE__ */ e("div", { className: "ecp-vp-vu-bars", ref: T }) }),
609
+ R && /* @__PURE__ */ c("div", { className: `ecp-vp-eq-overlay${A ? " ecp-vp-eq-overlay--dark" : " ecp-vp-eq-overlay--light"}`, children: [
610
+ /* @__PURE__ */ e("h3", { className: `ecp-vp-eq-title${A ? " ecp-vp-eq-title--dark" : " ecp-vp-eq-title--light"}`, children: "Equalizer" }),
611
611
  /* @__PURE__ */ e("div", { className: "ecp-vp-eq-bands", children: ["bass", "mid", "treble"].map((t) => /* @__PURE__ */ c("div", { className: "ecp-vp-eq-band", children: [
612
612
  /* @__PURE__ */ c("div", { className: "ecp-vp-eq-band-header", children: [
613
- /* @__PURE__ */ e("span", { className: `ecp-vp-eq-band-label${E ? " ecp-vp-eq-band-label--dark" : " ecp-vp-eq-band-label--light"}`, children: t.charAt(0).toUpperCase() + t.slice(1) }),
614
- /* @__PURE__ */ c("span", { className: `ecp-vp-eq-band-label${E ? " ecp-vp-eq-band-label--dark" : " ecp-vp-eq-band-label--light"}`, children: [
613
+ /* @__PURE__ */ e("span", { className: `ecp-vp-eq-band-label${A ? " ecp-vp-eq-band-label--dark" : " ecp-vp-eq-band-label--light"}`, children: t.charAt(0).toUpperCase() + t.slice(1) }),
614
+ /* @__PURE__ */ c("span", { className: `ecp-vp-eq-band-label${A ? " ecp-vp-eq-band-label--dark" : " ecp-vp-eq-band-label--light"}`, children: [
615
615
  Y[t],
616
616
  " dB"
617
617
  ] })
618
618
  ] }),
619
619
  /* @__PURE__ */ c("div", { className: "ecp-vp-eq-band-range", children: [
620
- /* @__PURE__ */ e("span", { className: `ecp-vp-eq-range-bound${E ? " ecp-vp-eq-range-bound--dark" : " ecp-vp-eq-range-bound--light"}`, children: "-20" }),
620
+ /* @__PURE__ */ e("span", { className: `ecp-vp-eq-range-bound${A ? " ecp-vp-eq-range-bound--dark" : " ecp-vp-eq-range-bound--light"}`, children: "-20" }),
621
621
  /* @__PURE__ */ e(
622
622
  "input",
623
623
  {
@@ -627,31 +627,34 @@ function ht({
627
627
  value: Y[t],
628
628
  onChange: (a) => Te(t, parseInt(a.target.value)),
629
629
  className: "ecp-vp-eq-slider",
630
- style: { background: `linear-gradient(to right, ${b.slider} ${(Y[t] + 20) / 40 * 100}%, ${b.slider + "30"} ${(Y[t] + 20) / 40 * 100}%)` }
630
+ style: {
631
+ background: `linear-gradient(to right, ${h.slider} ${(Y[t] + 20) / 40 * 100}%, ${h.slider + "30"} ${(Y[t] + 20) / 40 * 100}%)`,
632
+ "--thumb-color": h.slider
633
+ }
631
634
  }
632
635
  ),
633
- /* @__PURE__ */ e("span", { className: `ecp-vp-eq-range-bound${E ? " ecp-vp-eq-range-bound--dark" : " ecp-vp-eq-range-bound--light"}`, children: "+20" })
636
+ /* @__PURE__ */ e("span", { className: `ecp-vp-eq-range-bound${A ? " ecp-vp-eq-range-bound--dark" : " ecp-vp-eq-range-bound--light"}`, children: "+20" })
634
637
  ] })
635
638
  ] }, t)) }),
636
- /* @__PURE__ */ e("div", { className: "ecp-vp-eq-footer", children: /* @__PURE__ */ e("button", { onClick: be, className: `ecp-vp-eq-reset${E ? " ecp-vp-eq-reset--dark" : " ecp-vp-eq-reset--light"}`, children: "Reset" }) })
639
+ /* @__PURE__ */ e("div", { className: "ecp-vp-eq-footer", children: /* @__PURE__ */ e("button", { onClick: be, className: `ecp-vp-eq-reset${A ? " ecp-vp-eq-reset--dark" : " ecp-vp-eq-reset--light"}`, children: "Reset" }) })
637
640
  ] })
638
641
  ] }),
639
642
  y.trackName && /* @__PURE__ */ c("div", { className: "ecp-vp-track", children: [
640
- f && /* @__PURE__ */ e("div", { className: "ecp-vp-thumbnail-wrap", children: /* @__PURE__ */ e("img", { src: f, alt: "", className: `ecp-vp-thumbnail${L ? " ecp-animation-spin" : ""}` }) }),
643
+ f && /* @__PURE__ */ e("div", { className: "ecp-vp-thumbnail-wrap", children: /* @__PURE__ */ e("img", { src: f, alt: "", className: `ecp-vp-thumbnail${E ? " ecp-animation-spin" : ""}` }) }),
641
644
  /* @__PURE__ */ c("div", { className: "ecp-vp-track-info", children: [
642
- /* @__PURE__ */ e("div", { className: `ecp-vp-track-name${E ? " ecp-vp-track-name--dark" : " ecp-vp-track-name--light"}`, children: l }),
643
- u && typeof u == "string" && /* @__PURE__ */ e("div", { className: `ecp-vp-track-author${E ? " ecp-vp-track-author--dark" : " ecp-vp-track-author--light"}`, children: u })
645
+ /* @__PURE__ */ e("div", { className: `ecp-vp-track-name${A ? " ecp-vp-track-name--dark" : " ecp-vp-track-name--light"}`, children: l }),
646
+ u && typeof u == "string" && /* @__PURE__ */ e("div", { className: `ecp-vp-track-author${A ? " ecp-vp-track-author--dark" : " ecp-vp-track-author--light"}`, children: u })
644
647
  ] })
645
648
  ] }),
646
649
  y.seekbar && /* @__PURE__ */ e("div", { className: "ecp-vp-seekbar", children: /* @__PURE__ */ c("div", { className: "ecp-vp-seekbar-row", children: [
647
- /* @__PURE__ */ e("span", { className: `ecp-vp-time${E ? " ecp-vp-time--dark" : " ecp-vp-time--light"}`, children: qe(B) }),
650
+ /* @__PURE__ */ e("span", { className: `ecp-vp-time${A ? " ecp-vp-time--dark" : " ecp-vp-time--light"}`, children: qe(j) }),
648
651
  /* @__PURE__ */ e(
649
652
  "input",
650
653
  {
651
654
  type: "range",
652
655
  min: "0",
653
656
  max: "100",
654
- value: P > 0 ? B / P * 100 : 0,
657
+ value: M > 0 ? j / M * 100 : 0,
655
658
  onChange: Le,
656
659
  onMouseDown: Ae,
657
660
  onMouseUp: Re,
@@ -660,12 +663,12 @@ function ht({
660
663
  disabled: !s,
661
664
  className: "ecp-vp-seek-input",
662
665
  style: {
663
- background: s && P > 0 ? `linear-gradient(to right, ${b.slider} ${B / P * 100}%, ${b.slider + "30"} ${B / P * 100}%)` : b.slider + "30",
664
- "--thumb-color": b.slider
666
+ background: s && M > 0 ? `linear-gradient(to right, ${h.slider} ${j / M * 100}%, ${h.slider + "30"} ${j / M * 100}%)` : h.slider + "30",
667
+ "--thumb-color": h.slider
665
668
  }
666
669
  }
667
670
  ),
668
- /* @__PURE__ */ e("span", { className: `ecp-vp-time ecp-vp-time--right${E ? " ecp-vp-time--dark" : " ecp-vp-time--light"}`, children: qe(P) })
671
+ /* @__PURE__ */ e("span", { className: `ecp-vp-time ecp-vp-time--right${A ? " ecp-vp-time--dark" : " ecp-vp-time--light"}`, children: qe(M) })
669
672
  ] }) }),
670
673
  /* @__PURE__ */ c("div", { className: `ecp-vp-controls${G < 330 ? " ecp-vp-controls--sm" : ""}`, children: [
671
674
  y.play && /* @__PURE__ */ c(
@@ -674,13 +677,13 @@ function ht({
674
677
  onClick: xe,
675
678
  disabled: !s,
676
679
  className: `ecp-vp-play-btn${G < 350 ? " ecp-vp-play-btn--compact" : ""}`,
677
- style: { backgroundColor: b.button },
680
+ style: { backgroundColor: h.button },
678
681
  children: [
679
682
  /* @__PURE__ */ c("div", { className: "ecp-vp-play-icon-wrap", children: [
680
- /* @__PURE__ */ e(Pe, { size: 16, style: { position: "absolute", transform: L ? void 0 : "scale(0) translateY(2.5rem)", transition: "all 150ms" } }),
681
- /* @__PURE__ */ e(Me, { size: 16, style: { position: "absolute", transform: L ? "scale(0) translateY(-2.5rem)" : void 0, transition: "all 150ms" } })
683
+ /* @__PURE__ */ e(Pe, { size: 16, style: { position: "absolute", transform: E ? void 0 : "scale(0) translateY(2.5rem)", transition: "all 150ms" } }),
684
+ /* @__PURE__ */ e(Me, { size: 16, style: { position: "absolute", transform: E ? "scale(0) translateY(-2.5rem)" : void 0, transition: "all 150ms" } })
682
685
  ] }),
683
- /* @__PURE__ */ e("span", { style: { display: G < 350 ? "none" : "block" }, children: L ? "Pause" : "Play" })
686
+ /* @__PURE__ */ e("span", { style: { display: G < 350 ? "none" : "block" }, children: E ? "Pause" : "Play" })
684
687
  ]
685
688
  }
686
689
  ),
@@ -689,7 +692,7 @@ function ht({
689
692
  {
690
693
  onClick: Ee,
691
694
  disabled: !s,
692
- className: `ecp-vp-stop-btn${E ? " ecp-vp-stop-btn--dark" : " ecp-vp-stop-btn--light"}${G >= 600 ? " ecp-vp-stop-btn--wide" : ""}`,
695
+ className: `ecp-vp-stop-btn${A ? " ecp-vp-stop-btn--dark" : " ecp-vp-stop-btn--light"}${G >= 600 ? " ecp-vp-stop-btn--wide" : ""}`,
693
696
  children: [
694
697
  /* @__PURE__ */ e(Ge, { size: 16 }),
695
698
  /* @__PURE__ */ e("span", { style: { display: G < 600 ? "none" : "block" }, children: "Stop" })
@@ -702,7 +705,7 @@ function ht({
702
705
  onClick: () => Q(!R),
703
706
  disabled: !s,
704
707
  className: `ecp-vp-eq-btn${R ? " ecp-vp-eq-btn--on" : " ecp-vp-eq-btn--off"}${G >= 600 ? " ecp-vp-eq-btn--wide" : ""}`,
705
- style: R ? { backgroundColor: b.button } : {},
708
+ style: R ? { backgroundColor: h.button } : {},
706
709
  children: [
707
710
  /* @__PURE__ */ e(Fe, { size: 16 }),
708
711
  /* @__PURE__ */ e("span", { style: { display: G < 600 ? "none" : "block" }, children: "EQ" })
@@ -715,19 +718,19 @@ function ht({
715
718
  onClick: je,
716
719
  disabled: !s,
717
720
  className: `ecp-vp-loop-btn${V ? " ecp-vp-loop-btn--on" : " ecp-vp-loop-btn--off"}${G >= 700 ? " ecp-vp-loop-btn--wide" : ""}`,
718
- style: V ? { backgroundColor: b.button } : {},
721
+ style: V ? { backgroundColor: h.button } : {},
719
722
  children: [
720
723
  /* @__PURE__ */ e(ot, { size: 16, className: V ? "ecp-vp-loop-icon--active" : "" }),
721
724
  /* @__PURE__ */ e("span", { style: { display: G < 700 ? "none" : "block" }, children: "Loop" })
722
725
  ]
723
726
  }
724
727
  ),
725
- y.speed && /* @__PURE__ */ e("div", { className: "ecp-vp-speed-wrap", children: /* @__PURE__ */ e("select", { value: ue, onChange: Be, className: `ecp-vp-speed-select${E ? " ecp-vp-speed-select--dark" : " ecp-vp-speed-select--light"}`, children: ["0.5", "0.75", "1", "1.25", "1.5", "2"].map((t) => /* @__PURE__ */ c("option", { value: t, className: E ? "ecp-vp-speed-option--dark" : "ecp-vp-speed-option--light", children: [
728
+ y.speed && /* @__PURE__ */ e("div", { className: "ecp-vp-speed-wrap", children: /* @__PURE__ */ e("select", { value: ue, onChange: Be, className: `ecp-vp-speed-select${A ? " ecp-vp-speed-select--dark" : " ecp-vp-speed-select--light"}`, children: ["0.5", "0.75", "1", "1.25", "1.5", "2"].map((t) => /* @__PURE__ */ c("option", { value: t, className: A ? "ecp-vp-speed-option--dark" : "ecp-vp-speed-option--light", children: [
726
729
  t,
727
730
  "x"
728
731
  ] }, t)) }) }),
729
732
  y.volume && /* @__PURE__ */ c("div", { className: "ecp-vp-volume", children: [
730
- /* @__PURE__ */ e("button", { onClick: Se, className: "ecp-vp-mute-btn", children: ae || k === 0 ? /* @__PURE__ */ e(_e, { size: 20, className: E ? "ecp-vp-mute-icon--dark" : "ecp-vp-mute-icon--light" }) : /* @__PURE__ */ e(De, { size: 20, className: E ? "ecp-vp-mute-icon--dark" : "ecp-vp-mute-icon--light" }) }),
733
+ /* @__PURE__ */ e("button", { onClick: Se, className: "ecp-vp-mute-btn", children: ae || k === 0 ? /* @__PURE__ */ e(_e, { size: 20, className: A ? "ecp-vp-mute-icon--dark" : "ecp-vp-mute-icon--light" }) : /* @__PURE__ */ e(De, { size: 20, className: A ? "ecp-vp-mute-icon--dark" : "ecp-vp-mute-icon--light" }) }),
731
734
  /* @__PURE__ */ e(
732
735
  "input",
733
736
  {
@@ -738,7 +741,8 @@ function ht({
738
741
  onChange: ze,
739
742
  className: "ecp-vp-volume-slider",
740
743
  style: {
741
- background: `linear-gradient(to right, ${b.slider} ${k}%, ${b.slider + "30"} ${k}%)`,
744
+ background: `linear-gradient(to right, ${h.slider} ${k}%, ${h.slider + "30"} ${k}%)`,
745
+ "--thumb-color": h.slider,
742
746
  display: G < 460 ? "none" : "block"
743
747
  }
744
748
  }
@@ -746,7 +750,7 @@ function ht({
746
750
  /* @__PURE__ */ c(
747
751
  "span",
748
752
  {
749
- className: `ecp-vp-volume-pct${E ? " ecp-vp-volume-pct--dark" : " ecp-vp-volume-pct--light"}`,
753
+ className: `ecp-vp-volume-pct${A ? " ecp-vp-volume-pct--dark" : " ecp-vp-volume-pct--light"}`,
750
754
  style: { display: G < 800 ? "none" : "block" },
751
755
  children: [
752
756
  k,
@@ -768,7 +772,7 @@ function bt({
768
772
  equalizer: y = { bass: 0, mid: 0, treble: 0 },
769
773
  mode: O = "light"
770
774
  }) {
771
- const [x, j] = m(!1), [I, M] = m(0), [L, H] = m(0), [B, F] = m(!1), [P, D] = m(80), [k, z] = m(1), [ae, me] = m([]), [V, ee] = m(null), [se, ie] = m(!1), [ce, de] = m({ bass: y.bass || 0, mid: y.mid || 0, treble: y.treble || 0 }), R = h(null), Q = h(null), Y = h(null), oe = h(null), ue = h(null), te = h(null), G = () => {
775
+ const [x, F] = m(!1), [I, z] = m(0), [E, H] = m(0), [j, P] = m(!1), [M, D] = m(80), [k, S] = m(1), [ae, me] = m([]), [V, ee] = m(null), [se, ie] = m(!1), [ce, de] = m({ bass: y.bass || 0, mid: y.mid || 0, treble: y.treble || 0 }), R = b(null), Q = b(null), Y = b(null), oe = b(null), ue = b(null), te = b(null), G = () => {
772
776
  const r = [];
773
777
  for (let d = 0; d < 100; d++) r.push(20 + Math.random() * 60);
774
778
  return r;
@@ -781,19 +785,19 @@ function bt({
781
785
  }
782
786
  const r = R.current;
783
787
  if (!r) return;
784
- const d = () => M(r.currentTime), g = () => {
788
+ const d = () => z(r.currentTime), g = () => {
785
789
  H(r.duration), me(G());
786
- }, S = () => j(!1), _ = (J) => {
787
- var b, E;
788
- return ee(`Audio error: ${((E = (b = J.target) == null ? void 0 : b.error) == null ? void 0 : E.message) || "Failed to load audio"}`);
790
+ }, B = () => F(!1), _ = (J) => {
791
+ var h, A;
792
+ return ee(`Audio error: ${((A = (h = J.target) == null ? void 0 : h.error) == null ? void 0 : A.message) || "Failed to load audio"}`);
789
793
  };
790
- return r.addEventListener("timeupdate", d), r.addEventListener("loadedmetadata", g), r.addEventListener("ended", S), r.addEventListener("error", _), () => {
791
- r.removeEventListener("timeupdate", d), r.removeEventListener("loadedmetadata", g), r.removeEventListener("ended", S), r.removeEventListener("error", _);
794
+ return r.addEventListener("timeupdate", d), r.addEventListener("loadedmetadata", g), r.addEventListener("ended", B), r.addEventListener("error", _), () => {
795
+ r.removeEventListener("timeupdate", d), r.removeEventListener("loadedmetadata", g), r.removeEventListener("ended", B), r.removeEventListener("error", _);
792
796
  };
793
797
  }, [s, l, O]), $(() => {
794
798
  s && R.current && v && (R.current.play().catch((r) => {
795
- console.error("Play failed:", r), j(!1);
796
- }), j(!0));
799
+ console.error("Play failed:", r), F(!1);
800
+ }), F(!0));
797
801
  }, [s]), $(() => {
798
802
  if (R.current && !Q.current && R.current) {
799
803
  const r = window.AudioContext || window.webkitAudioContext;
@@ -802,26 +806,26 @@ function bt({
802
806
  Q.current = d;
803
807
  const g = d.createMediaElementSource(R.current);
804
808
  Y.current = g;
805
- const S = d.createBiquadFilter();
806
- S.type = "lowshelf", S.frequency.value = 200, oe.current = S;
809
+ const B = d.createBiquadFilter();
810
+ B.type = "lowshelf", B.frequency.value = 200, oe.current = B;
807
811
  const _ = d.createBiquadFilter();
808
812
  _.type = "peaking", _.frequency.value = 1e3, _.Q.value = 1, ue.current = _;
809
813
  const J = d.createBiquadFilter();
810
- J.type = "highshelf", J.frequency.value = 3e3, te.current = J, g.connect(S).connect(_).connect(J).connect(d.destination);
814
+ J.type = "highshelf", J.frequency.value = 3e3, te.current = J, g.connect(B).connect(_).connect(J).connect(d.destination);
811
815
  }
812
816
  }
813
817
  }, [s]), $(() => {
814
- R.current && (R.current.volume = B ? 0 : P / 100);
815
- }, [P, B]), $(() => {
818
+ R.current && (R.current.volume = j ? 0 : M / 100);
819
+ }, [M, j]), $(() => {
816
820
  R.current && (R.current.playbackRate = k);
817
821
  }, [k]);
818
822
  const w = () => {
819
- R.current && (x ? R.current.pause() : R.current.play().catch((r) => ee(`Playback failed: ${r instanceof Error ? r.message : String(r)}`)), j(!x));
820
- }, p = () => F(!B), A = (r) => {
821
- D(parseInt(r.target.value)), B && parseInt(r.target.value) > 0 && F(!1);
822
- }, K = (r) => z(parseFloat(r.target.value)), fe = (r) => {
823
- const d = r.currentTarget.getBoundingClientRect(), S = (r.clientX - d.left) / d.width * L;
824
- R.current && (R.current.currentTime = S, M(S));
823
+ R.current && (x ? R.current.pause() : R.current.play().catch((r) => ee(`Playback failed: ${r instanceof Error ? r.message : String(r)}`)), F(!x));
824
+ }, p = () => P(!j), L = (r) => {
825
+ D(parseInt(r.target.value)), j && parseInt(r.target.value) > 0 && P(!1);
826
+ }, K = (r) => S(parseFloat(r.target.value)), fe = (r) => {
827
+ const d = r.currentTarget.getBoundingClientRect(), B = (r.clientX - d.left) / d.width * E;
828
+ R.current && (R.current.currentTime = B, z(B));
825
829
  }, W = (r, d) => {
826
830
  de((g) => ({ ...g, [r]: d })), r === "bass" && oe.current && (oe.current.gain.value = d), r === "mid" && ue.current && (ue.current.gain.value = d), r === "treble" && te.current && (te.current.gain.value = d);
827
831
  }, re = () => {
@@ -830,7 +834,7 @@ function bt({
830
834
  if (isNaN(r)) return "0:00";
831
835
  const d = Math.floor(r / 60), g = Math.floor(r % 60);
832
836
  return `${d}:${g.toString().padStart(2, "0")}`;
833
- }, N = L > 0 ? I / L * 100 : 0, T = O === "dark";
837
+ }, N = E > 0 ? I / E * 100 : 0, T = O === "dark";
834
838
  if (V)
835
839
  return /* @__PURE__ */ c("div", { className: "ecp-wave-error", style: { background: u }, children: [
836
840
  /* @__PURE__ */ e("p", { className: `ecp-wave-error-title${T ? " ecp-wave-error--dark" : " ecp-wave-error--light"}`, children: "Error" }),
@@ -862,7 +866,7 @@ function bt({
862
866
  ] }),
863
867
  /* @__PURE__ */ c("div", { className: "ecp-wave-times", style: { color: Z }, children: [
864
868
  /* @__PURE__ */ e("span", { children: X(I) }),
865
- /* @__PURE__ */ e("span", { children: X(L) })
869
+ /* @__PURE__ */ e("span", { children: X(E) })
866
870
  ] }),
867
871
  /* @__PURE__ */ c("div", { className: "ecp-wave-controls", children: [
868
872
  /* @__PURE__ */ c("div", { className: "ecp-wave-left-controls", children: [
@@ -872,7 +876,7 @@ function bt({
872
876
  onClick: p,
873
877
  className: "ecp-wave-vol-btn",
874
878
  style: { background: `linear-gradient(135deg, ${l[0]}, ${l[1]})` },
875
- children: B || P === 0 ? /* @__PURE__ */ e(_e, { style: { width: "1rem", height: "1rem", color: "white" } }) : /* @__PURE__ */ e(De, { style: { width: "1rem", height: "1rem", color: "white" } })
879
+ children: j || M === 0 ? /* @__PURE__ */ e(_e, { style: { width: "1rem", height: "1rem", color: "white" } }) : /* @__PURE__ */ e(De, { style: { width: "1rem", height: "1rem", color: "white" } })
876
880
  }
877
881
  ),
878
882
  /* @__PURE__ */ e(
@@ -881,11 +885,12 @@ function bt({
881
885
  type: "range",
882
886
  min: "0",
883
887
  max: "100",
884
- value: P,
885
- onChange: A,
888
+ value: M,
889
+ onChange: L,
886
890
  className: "ecp-wave-vol-slider",
887
891
  style: {
888
- background: `linear-gradient(to right, ${l[0]} ${P}%, ${T ? "#374151" : "#d1d5db"} ${P}%)`,
892
+ background: `linear-gradient(to right, ${l[0]} ${M}%, ${T ? "#374151" : "#d1d5db"} ${M}%)`,
893
+ "--thumb-color": l[0],
889
894
  display: f && f < 400 ? "none" : void 0
890
895
  }
891
896
  }
@@ -956,7 +961,10 @@ function bt({
956
961
  value: ce[r],
957
962
  onChange: (d) => W(r, parseInt(d.target.value)),
958
963
  className: "ecp-wave-eq-slider",
959
- style: { background: `linear-gradient(to right, ${l[0]} ${(ce[r] + 20) / 40 * 100}%, ${l[1] + "30"} ${(ce[r] + 20) / 40 * 100}%)` }
964
+ style: {
965
+ background: `linear-gradient(to right, ${l[0]} ${(ce[r] + 20) / 40 * 100}%, ${l[1] + "30"} ${(ce[r] + 20) / 40 * 100}%)`,
966
+ "--thumb-color": l[0]
967
+ }
960
968
  }
961
969
  ),
962
970
  /* @__PURE__ */ e("span", { className: T ? "ecp-wave-eq-bound--dark" : "ecp-wave-eq-bound--light", children: "+20" })
@@ -970,20 +978,20 @@ function bt({
970
978
  ] });
971
979
  }
972
980
  function gt({ audio: s, thumbnail: l, gradient: u = ["#cd7eff", "#fe59f6"], background: v = "#1f273a", autoPlay: C = !1 }) {
973
- const [f, y] = m(!1), [, O] = m(0), x = h(null), [j, I] = m(0), [M, L] = m(0), [H, B] = m(0);
981
+ const [f, y] = m(!1), [, O] = m(0), x = b(null), [F, I] = m(0), [z, E] = m(0), [H, j] = m(0);
974
982
  $(() => {
975
983
  const k = x.current;
976
984
  if (!k) return;
977
- const z = () => O(k.currentTime);
978
- return k.addEventListener("timeupdate", z), () => k.removeEventListener("timeupdate", z);
985
+ const S = () => O(k.currentTime);
986
+ return k.addEventListener("timeupdate", S), () => k.removeEventListener("timeupdate", S);
979
987
  }, []), $(() => {
980
988
  const k = setInterval(() => {
981
- f && I((z) => z + 0.1);
989
+ f && I((S) => S + 0.1);
982
990
  }, 100);
983
991
  return () => clearInterval(k);
984
992
  }, [f]), $(() => {
985
993
  const k = setInterval(() => {
986
- f && B((z) => z + 0.1);
994
+ f && j((S) => S + 0.1);
987
995
  }, 100);
988
996
  return () => clearInterval(k);
989
997
  }, [f]), $(() => {
@@ -991,14 +999,14 @@ function gt({ audio: s, thumbnail: l, gradient: u = ["#cd7eff", "#fe59f6"], back
991
999
  }, [s]), $(() => {
992
1000
  const k = x.current;
993
1001
  if (!k) return;
994
- const z = () => L(k.duration);
995
- return B(0), k.addEventListener("loadedmetadata", z), () => k.removeEventListener("loadedmetadata", z);
1002
+ const S = () => E(k.duration);
1003
+ return j(0), k.addEventListener("loadedmetadata", S), () => k.removeEventListener("loadedmetadata", S);
996
1004
  }, [s]);
997
- const F = () => {
1005
+ const P = () => {
998
1006
  x.current && (f ? x.current.pause() : x.current.play().catch((k) => console.error("NanoPlayer play failed:", k)), y(!f));
999
1007
  };
1000
1008
  if (!s) return null;
1001
- const P = `linear-gradient(135deg, ${u[0]}, ${u[1]})`, D = `${(M > 0 ? H / M : 0) * 100}%`;
1009
+ const M = `linear-gradient(135deg, ${u[0]}, ${u[1]})`, D = `${(z > 0 ? H / z : 0) * 100}%`;
1002
1010
  return /* @__PURE__ */ c(
1003
1011
  "div",
1004
1012
  {
@@ -1011,26 +1019,26 @@ function gt({ audio: s, thumbnail: l, gradient: u = ["#cd7eff", "#fe59f6"], back
1011
1019
  ref: x,
1012
1020
  src: s,
1013
1021
  onEnded: () => {
1014
- y(!1), B(0);
1022
+ y(!1), j(0);
1015
1023
  }
1016
1024
  }
1017
1025
  ),
1018
- /* @__PURE__ */ e("div", { className: "ecp-nano-progress-bg", style: { width: D, backgroundImage: P } }),
1026
+ /* @__PURE__ */ e("div", { className: "ecp-nano-progress-bg", style: { width: D, backgroundImage: M } }),
1019
1027
  /* @__PURE__ */ c("div", { className: "ecp-nano-content", children: [
1020
1028
  l && /* @__PURE__ */ e("div", { className: "ecp-nano-thumbnail-wrap", children: /* @__PURE__ */ e("img", { src: l, alt: "", className: "ecp-nano-thumbnail" }) }),
1021
1029
  /* @__PURE__ */ c("div", { className: "ecp-nano-row", children: [
1022
- /* @__PURE__ */ e("button", { onClick: F, className: "ecp-nano-play-btn", style: { background: P }, children: f ? /* @__PURE__ */ e(Pe, { fill: v, style: { width: "0.75rem", height: "0.75rem", color: "transparent" } }) : /* @__PURE__ */ e(Me, { fill: v, style: { width: "0.75rem", height: "0.75rem", color: "transparent" } }) }),
1023
- /* @__PURE__ */ e("div", { className: "ecp-nano-waveform", children: [...Array(12)].map((k, z) => /* @__PURE__ */ e(
1030
+ /* @__PURE__ */ e("button", { onClick: P, className: "ecp-nano-play-btn", style: { background: M }, children: f ? /* @__PURE__ */ e(Pe, { fill: v, style: { width: "0.75rem", height: "0.75rem", color: "transparent" } }) : /* @__PURE__ */ e(Me, { fill: v, style: { width: "0.75rem", height: "0.75rem", color: "transparent" } }) }),
1031
+ /* @__PURE__ */ e("div", { className: "ecp-nano-waveform", children: [...Array(12)].map((k, S) => /* @__PURE__ */ e(
1024
1032
  "div",
1025
1033
  {
1026
1034
  className: "ecp-nano-wave-bar",
1027
1035
  style: {
1028
1036
  background: `linear-gradient(to top, ${u[0]}, ${u[1]})`,
1029
- height: f ? `${8 + Math.sin((j * 8 + z) * 0.6) * 10}px` : "8px",
1037
+ height: f ? `${8 + Math.sin((F * 8 + S) * 0.6) * 10}px` : "8px",
1030
1038
  opacity: f ? 0.8 : 0.4
1031
1039
  }
1032
1040
  },
1033
- z
1041
+ S
1034
1042
  )) })
1035
1043
  ] })
1036
1044
  ] })
@@ -1058,10 +1066,10 @@ function wt({
1058
1066
  mode: y = "light",
1059
1067
  transparent: O = !1,
1060
1068
  autoPlay: x = !1,
1061
- color: j = "#3b82f6",
1069
+ color: F = "#3b82f6",
1062
1070
  equalizer: I = { bass: 0, mid: 0, treble: 0 }
1063
1071
  }) {
1064
- const [M, L] = m(!1), [H, B] = m(0), [F, P] = m(0), [D, k] = m(v || 100), [z, ae] = m(!1), [me, V] = m(!1), [ee, se] = m(!1), [ie, ce] = m([]), [de, R] = m(!1), [Q, Y] = m({ bass: I.bass || 0, mid: I.mid || 0, treble: I.treble || 0 }), [oe, ue] = m(1), [te, G] = m(0), w = h(null), p = h(null), A = h(null), K = h(null), fe = h(null), W = h(null), re = h(null), X = h(null), N = h(null), T = h(null), Z = h(0), r = h(0), d = h(0), g = h(0), S = h(0), _ = h(0), J = h(!1), b = y === "dark" || ee, E = typeof f == "object" && Object.keys(f).length === 0;
1072
+ const [z, E] = m(!1), [H, j] = m(0), [P, M] = m(0), [D, k] = m(v || 100), [S, ae] = m(!1), [me, V] = m(!1), [ee, se] = m(!1), [ie, ce] = m([]), [de, R] = m(!1), [Q, Y] = m({ bass: I.bass || 0, mid: I.mid || 0, treble: I.treble || 0 }), [oe, ue] = m(1), [te, G] = m(0), w = b(null), p = b(null), L = b(null), K = b(null), fe = b(null), W = b(null), re = b(null), X = b(null), N = b(null), T = b(null), Z = b(0), r = b(0), d = b(0), g = b(0), B = b(0), _ = b(0), J = b(!1), h = y === "dark" || ee, A = typeof f == "object" && Object.keys(f).length === 0;
1065
1073
  $(() => {
1066
1074
  const n = p.current;
1067
1075
  if (!n) return;
@@ -1075,46 +1083,46 @@ function wt({
1075
1083
  }, [s, l, v, u, f, y]), $(() => {
1076
1084
  if (!w.current) return;
1077
1085
  const n = w.current, t = () => {
1078
- me || B(n.currentTime);
1079
- }, a = () => P(n.duration), o = () => {
1080
- L(!1), N.current && cancelAnimationFrame(N.current);
1081
- }, i = () => L(!0), q = () => L(!1);
1086
+ me || j(n.currentTime);
1087
+ }, a = () => M(n.duration), o = () => {
1088
+ E(!1), N.current && cancelAnimationFrame(N.current);
1089
+ }, i = () => E(!0), q = () => E(!1);
1082
1090
  return n.addEventListener("timeupdate", t), n.addEventListener("loadedmetadata", a), n.addEventListener("ended", o), n.addEventListener("play", i), n.addEventListener("pause", q), () => {
1083
1091
  n.removeEventListener("timeupdate", t), n.removeEventListener("loadedmetadata", a), n.removeEventListener("ended", o), n.removeEventListener("play", i), n.removeEventListener("pause", q);
1084
1092
  };
1085
1093
  }, [me]), $(() => {
1086
1094
  if (s) {
1087
- const n = M, t = D;
1095
+ const n = z, t = D;
1088
1096
  if (w.current) {
1089
- w.current.pause(), w.current.src = s, w.current.volume = z ? 0 : t / 100;
1097
+ w.current.pause(), w.current.src = s, w.current.volume = S ? 0 : t / 100;
1090
1098
  const a = () => {
1091
1099
  n && w.current && w.current.play().catch((o) => console.error("Play failed:", o)), w.current && w.current.removeEventListener("canplay", a);
1092
1100
  };
1093
1101
  w.current.addEventListener("canplay", a), w.current.load();
1094
1102
  }
1095
- B(0), L(!1), Z.current = 0, r.current = 0, d.current = 0, g.current = 0, S.current = 0, _.current = 0, ve();
1103
+ j(0), E(!1), Z.current = 0, r.current = 0, d.current = 0, g.current = 0, B.current = 0, _.current = 0, he();
1096
1104
  }
1097
1105
  }, [s]), $(() => {
1098
- w.current && (w.current.volume = z ? 0 : D / 100);
1099
- }, [D, z]), $(() => {
1106
+ w.current && (w.current.volume = S ? 0 : D / 100);
1107
+ }, [D, S]), $(() => {
1100
1108
  w.current && (w.current.playbackRate = oe);
1101
1109
  }, [oe]), $(() => {
1102
- A.current && (W.current && (W.current.gain.value = Q.bass), re.current && (re.current.gain.value = Q.mid), X.current && (X.current.gain.value = Q.treble));
1110
+ L.current && (W.current && (W.current.gain.value = Q.bass), re.current && (re.current.gain.value = Q.mid), X.current && (X.current.gain.value = Q.treble));
1103
1111
  }, [Q]), $(() => {
1104
- J.current = M, N.current && (cancelAnimationFrame(N.current), N.current = null), M && u ? (A.current || ke(), we()) : !M && u && Ce();
1105
- }, [M, u]), $(() => {
1112
+ J.current = z, N.current && (cancelAnimationFrame(N.current), N.current = null), z && u ? (L.current || ke(), we()) : !z && u && Ce();
1113
+ }, [z, u]), $(() => {
1106
1114
  const n = () => se(!!document.fullscreenElement);
1107
1115
  return document.addEventListener("fullscreenchange", n), () => document.removeEventListener("fullscreenchange", n);
1108
1116
  }, []), $(() => () => {
1109
- N.current && cancelAnimationFrame(N.current), A.current && A.current.close().catch((n) => console.warn("AudioContext cleanup error:", n));
1117
+ N.current && cancelAnimationFrame(N.current), L.current && L.current.close().catch((n) => console.warn("AudioContext cleanup error:", n));
1110
1118
  }, []);
1111
1119
  const ke = () => {
1112
- if (!A.current && w.current)
1120
+ if (!L.current && w.current)
1113
1121
  try {
1114
1122
  const n = window.AudioContext || window.webkitAudioContext;
1115
1123
  if (n) {
1116
1124
  const t = new n();
1117
- A.current = t;
1125
+ L.current = t;
1118
1126
  const a = t.createBiquadFilter();
1119
1127
  a.type = "lowshelf", a.frequency.value = 320, a.gain.value = Q.bass;
1120
1128
  const o = t.createBiquadFilter();
@@ -1133,9 +1141,9 @@ function wt({
1133
1141
  if (J.current) return;
1134
1142
  Z.current *= 0.7, r.current *= 0.7;
1135
1143
  const n = Date.now();
1136
- n - S.current > 1500 && (d.current *= 0.95), n - _.current > 1500 && (g.current *= 0.95), ve();
1144
+ n - B.current > 1500 && (d.current *= 0.95), n - _.current > 1500 && (g.current *= 0.95), he();
1137
1145
  const t = Math.max(Z.current, r.current), a = Math.max(d.current, g.current);
1138
- t > 0.01 || a > 0.01 ? N.current = requestAnimationFrame(Ce) : (J.current || (Z.current = 0, r.current = 0, d.current = 0, g.current = 0, ve()), N.current && cancelAnimationFrame(N.current), N.current = null);
1146
+ t > 0.01 || a > 0.01 ? N.current = requestAnimationFrame(Ce) : (J.current || (Z.current = 0, r.current = 0, d.current = 0, g.current = 0, he()), N.current && cancelAnimationFrame(N.current), N.current = null);
1139
1147
  }, we = () => {
1140
1148
  if (!K.current || !J.current) return;
1141
1149
  const n = K.current.frequencyBinCount, t = new Uint8Array(n);
@@ -1145,14 +1153,14 @@ function wt({
1145
1153
  let o = Math.pow(a / n / 255, 0.5);
1146
1154
  Z.current = Z.current * 0.7 + o * 0.3, r.current = r.current * 0.7 + o * 0.3;
1147
1155
  const i = Date.now();
1148
- Z.current > d.current ? (d.current = Z.current, S.current = i) : i - S.current > 1500 && (d.current *= 0.95), r.current > g.current ? (g.current = r.current, _.current = i) : i - _.current > 1500 && (g.current *= 0.95), ve(), N.current = requestAnimationFrame(we);
1149
- }, ve = () => {
1156
+ Z.current > d.current ? (d.current = Z.current, B.current = i) : i - B.current > 1500 && (d.current *= 0.95), r.current > g.current ? (g.current = r.current, _.current = i) : i - _.current > 1500 && (g.current *= 0.95), he(), N.current = requestAnimationFrame(we);
1157
+ }, he = () => {
1150
1158
  if (!T.current || !u) return;
1151
1159
  const n = u.color || "#00ff00", t = u.peak || "#ff0000", a = Z.current * 100, o = r.current * 100, i = 100 - d.current * 100, q = 100 - g.current * 100;
1152
1160
  u.side === "top" || u.side === "bottom" ? T.current.innerHTML = `
1153
1161
  <div style="display:flex;flex-direction:column;gap:0.25rem;height:100%;justify-content:center;">
1154
1162
  <div style="display:flex;align-items:center;justify-content:center;gap:0.5rem;">
1155
- <div style="font-size:0.75rem;opacity:0.8;width:1rem;text-align:center;color:${b ? "#f3f4f6" : "#111827"}">L</div>
1163
+ <div style="font-size:0.75rem;opacity:0.8;width:1rem;text-align:center;color:${h ? "#f3f4f6" : "#111827"}">L</div>
1156
1164
  <div style="position:relative;flex:1;height:0.75rem;background:rgba(0,0,0,0.4);border-radius:9999px;overflow:hidden;display:flex;justify-content:flex-end;">
1157
1165
  <div style="height:100%;border-radius:9999px 0 0 9999px;transition:width 75ms;width:${a}%;background:${n};"></div>
1158
1166
  ${d.current > 0.1 ? `<div style="position:absolute;top:0;width:0.25rem;height:100%;transition:right 100ms;right:${d.current * 100}%;background:${t};"></div>` : ""}
@@ -1162,7 +1170,7 @@ function wt({
1162
1170
  <div style="height:100%;border-radius:0 9999px 9999px 0;transition:width 75ms;width:${o}%;background:${n};"></div>
1163
1171
  ${g.current > 0.1 ? `<div style="position:absolute;top:0;width:0.25rem;height:100%;transition:left 100ms;left:${g.current * 100}%;background:${t};"></div>` : ""}
1164
1172
  </div>
1165
- <div style="font-size:0.75rem;opacity:0.8;width:1rem;text-align:center;color:${b ? "#f3f4f6" : "#111827"}">R</div>
1173
+ <div style="font-size:0.75rem;opacity:0.8;width:1rem;text-align:center;color:${h ? "#f3f4f6" : "#111827"}">R</div>
1166
1174
  </div>
1167
1175
  </div>
1168
1176
  ` : T.current.innerHTML = `
@@ -1186,28 +1194,28 @@ function wt({
1186
1194
  </div>
1187
1195
  `;
1188
1196
  }, Ne = () => {
1189
- !w.current || !s || (M ? w.current.pause() : (A.current && A.current.state === "suspended" && A.current.resume(), w.current.play().catch((n) => console.error("Play failed:", n))));
1190
- }, he = () => {
1191
- w.current && (w.current.pause(), w.current.currentTime = 0, L(!1), B(0), Z.current = 0, r.current = 0, d.current = 0, g.current = 0, ve());
1197
+ !w.current || !s || (z ? w.current.pause() : (L.current && L.current.state === "suspended" && L.current.resume(), w.current.play().catch((n) => console.error("Play failed:", n))));
1198
+ }, ve = () => {
1199
+ w.current && (w.current.pause(), w.current.currentTime = 0, E(!1), j(0), Z.current = 0, r.current = 0, d.current = 0, g.current = 0, he());
1192
1200
  }, xe = (n) => {
1193
- const a = parseFloat(n.target.value) / 100 * F;
1194
- B(a), w.current && !me && (w.current.currentTime = a);
1201
+ const a = parseFloat(n.target.value) / 100 * P;
1202
+ j(a), w.current && !me && (w.current.currentTime = a);
1195
1203
  }, Ee = () => V(!0), Le = () => {
1196
1204
  w.current && (w.current.currentTime = H), V(!1);
1197
1205
  }, Ae = (n) => {
1198
1206
  const t = parseInt(n.target.value);
1199
1207
  k(t), ae(t === 0);
1200
- }, Re = (n) => ue(parseFloat(n.target.value)), ze = () => ae(!z), Se = () => {
1208
+ }, Re = (n) => ue(parseFloat(n.target.value)), ze = () => ae(!S), Se = () => {
1201
1209
  p.current && (document.fullscreenElement ? document.exitFullscreen() : p.current.requestFullscreen().catch((n) => console.error("Fullscreen failed:", n)));
1202
1210
  }, Be = (n, t) => {
1203
- Y((a) => ({ ...a, [n]: t })), A.current && (n === "bass" && W.current && (W.current.gain.value = t), n === "mid" && re.current && (re.current.gain.value = t), n === "treble" && X.current && (X.current.gain.value = t));
1211
+ Y((a) => ({ ...a, [n]: t })), L.current && (n === "bass" && W.current && (W.current.gain.value = t), n === "mid" && re.current && (re.current.gain.value = t), n === "treble" && X.current && (X.current.gain.value = t));
1204
1212
  }, je = () => Y({ bass: 0, mid: 0, treble: 0 }), Te = (n) => {
1205
1213
  if (isNaN(n)) return "0:00";
1206
1214
  const t = Math.floor(n / 60), a = Math.floor(n % 60);
1207
1215
  return `${t}:${a.toString().padStart(2, "0")}`;
1208
1216
  };
1209
1217
  if ($(() => {
1210
- (E && !M || x) && Ne();
1218
+ (A && !z || x) && Ne();
1211
1219
  }, [f]), ie && ie.length > 0)
1212
1220
  return /* @__PURE__ */ e(Ve, { children: ie.map((n, t) => /* @__PURE__ */ c("div", { className: "ecp-video-error", children: [
1213
1221
  /* @__PURE__ */ c("strong", { children: [
@@ -1223,35 +1231,35 @@ function wt({
1223
1231
  {
1224
1232
  ref: p,
1225
1233
  className: `ecp-video-wrapper${ee ? " ecp-video-wrapper--fullscreen" : ""}`,
1226
- style: { backgroundColor: E || O ? void 0 : b ? "#49494937" : "white" },
1234
+ style: { backgroundColor: A || O ? void 0 : h ? "#49494937" : "white" },
1227
1235
  children: /* @__PURE__ */ c(
1228
1236
  "div",
1229
1237
  {
1230
- className: `ecp-video-inner${ee ? " ecp-video-inner--fullscreen" : ""}${E || O ? "" : " ecp-video-inner--padded"}`,
1231
- style: { background: E || O ? void 0 : b ? "#1a1a1ab0" : "#f5f5f5" },
1238
+ className: `ecp-video-inner${ee ? " ecp-video-inner--fullscreen" : ""}${O ? "" : " ecp-video-inner--padded"}`,
1239
+ style: { background: A || O ? void 0 : h ? "#1a1a1ab0" : "#f5f5f5" },
1232
1240
  children: [
1233
- f.videoName && !ee && /* @__PURE__ */ e("div", { className: `ecp-video-name${b ? " ecp-video-name--dark" : " ecp-video-name--light"}`, children: l }),
1241
+ f.videoName && !ee && /* @__PURE__ */ e("div", { className: `ecp-video-name${h ? " ecp-video-name--dark" : " ecp-video-name--light"}`, children: l }),
1234
1242
  /* @__PURE__ */ c("div", { className: `ecp-video-layout${qe ? " ecp-video-layout--col" : " ecp-video-layout--row"}${ee ? " ecp-video-layout--fullscreen" : ""}`, children: [
1235
1243
  u && be === "top" && /* @__PURE__ */ e("div", { className: "ecp-video-vu-top", ref: T }),
1236
1244
  /* @__PURE__ */ c("div", { style: { display: "flex", flex: qe ? void 0 : 1, gap: "0.75rem" }, children: [
1237
1245
  u && be === "left" && /* @__PURE__ */ e("div", { className: "ecp-video-vu-side", ref: T }),
1238
- /* @__PURE__ */ c("div", { className: `ecp-video-el-wrap${b ? " ecp-video-el-wrap--dark" : " ecp-video-el-wrap--light"}`, children: [
1246
+ /* @__PURE__ */ c("div", { className: `ecp-video-el-wrap${h ? " ecp-video-el-wrap--dark" : " ecp-video-el-wrap--light"}`, children: [
1239
1247
  /* @__PURE__ */ c("video", { ref: w, className: "ecp-video-el", poster: C || void 0, children: [
1240
1248
  s && /* @__PURE__ */ e("source", { src: s }),
1241
1249
  "Your browser does not support the video tag."
1242
1250
  ] }),
1243
- de && /* @__PURE__ */ e("div", { className: "ecp-video-eq-overlay", children: /* @__PURE__ */ c("div", { className: `ecp-video-eq-panel${b ? " ecp-video-eq-panel--dark" : " ecp-video-eq-panel--light"}`, children: [
1244
- /* @__PURE__ */ e("h3", { className: `ecp-video-eq-title${b ? " ecp-video-eq-title--dark" : " ecp-video-eq-title--light"}`, children: "Equalizer" }),
1251
+ de && /* @__PURE__ */ e("div", { className: "ecp-video-eq-overlay", children: /* @__PURE__ */ c("div", { className: `ecp-video-eq-panel${h ? " ecp-video-eq-panel--dark" : " ecp-video-eq-panel--light"}`, children: [
1252
+ /* @__PURE__ */ e("h3", { className: `ecp-video-eq-title${h ? " ecp-video-eq-title--dark" : " ecp-video-eq-title--light"}`, children: "Equalizer" }),
1245
1253
  /* @__PURE__ */ e("div", { className: "ecp-video-eq-bands", children: ["bass", "mid", "treble"].map((n) => /* @__PURE__ */ c("div", { children: [
1246
1254
  /* @__PURE__ */ c("div", { className: "ecp-video-eq-band-header", children: [
1247
- /* @__PURE__ */ e("span", { className: b ? "ecp-video-eq-label--dark" : "ecp-video-eq-label--light", children: n.charAt(0).toUpperCase() + n.slice(1) }),
1248
- /* @__PURE__ */ c("span", { className: b ? "ecp-video-eq-label--dark" : "ecp-video-eq-label--light", children: [
1255
+ /* @__PURE__ */ e("span", { className: h ? "ecp-video-eq-label--dark" : "ecp-video-eq-label--light", children: n.charAt(0).toUpperCase() + n.slice(1) }),
1256
+ /* @__PURE__ */ c("span", { className: h ? "ecp-video-eq-label--dark" : "ecp-video-eq-label--light", children: [
1249
1257
  Q[n],
1250
1258
  " dB"
1251
1259
  ] })
1252
1260
  ] }),
1253
1261
  /* @__PURE__ */ c("div", { className: "ecp-video-eq-range-row", children: [
1254
- /* @__PURE__ */ e("span", { className: b ? "ecp-video-eq-bound--dark" : "ecp-video-eq-bound--light", children: "-20" }),
1262
+ /* @__PURE__ */ e("span", { className: h ? "ecp-video-eq-bound--dark" : "ecp-video-eq-bound--light", children: "-20" }),
1255
1263
  /* @__PURE__ */ e(
1256
1264
  "input",
1257
1265
  {
@@ -1261,15 +1269,18 @@ function wt({
1261
1269
  value: Q[n],
1262
1270
  onChange: (t) => Be(n, parseInt(t.target.value)),
1263
1271
  className: "ecp-video-eq-slider",
1264
- style: { background: `linear-gradient(to right, ${j} ${(Q[n] + 20) / 40 * 100}%, #e5e7eb ${(Q[n] + 20) / 40 * 100}%)` }
1272
+ style: {
1273
+ background: `linear-gradient(to right, ${F} ${(Q[n] + 20) / 40 * 100}%, #e5e7eb ${(Q[n] + 20) / 40 * 100}%)`,
1274
+ "--thumb-color": F
1275
+ }
1265
1276
  }
1266
1277
  ),
1267
- /* @__PURE__ */ e("span", { className: b ? "ecp-video-eq-bound--dark" : "ecp-video-eq-bound--light", children: "+20" })
1278
+ /* @__PURE__ */ e("span", { className: h ? "ecp-video-eq-bound--dark" : "ecp-video-eq-bound--light", children: "+20" })
1268
1279
  ] })
1269
1280
  ] }, n)) }),
1270
1281
  /* @__PURE__ */ c("div", { className: "ecp-video-eq-footer", children: [
1271
- /* @__PURE__ */ e("button", { onClick: je, className: `ecp-video-eq-footer-btn${b ? " ecp-video-eq-footer-btn--dark" : " ecp-video-eq-footer-btn--light"}`, children: "Reset" }),
1272
- /* @__PURE__ */ e("button", { onClick: () => R(!1), className: `ecp-video-eq-footer-btn${b ? " ecp-video-eq-footer-btn--dark" : " ecp-video-eq-footer-btn--light"}`, style: { marginLeft: "0.5rem" }, children: "Close" })
1282
+ /* @__PURE__ */ e("button", { onClick: je, className: `ecp-video-eq-footer-btn${h ? " ecp-video-eq-footer-btn--dark" : " ecp-video-eq-footer-btn--light"}`, children: "Reset" }),
1283
+ /* @__PURE__ */ e("button", { onClick: () => R(!1), className: `ecp-video-eq-footer-btn${h ? " ecp-video-eq-footer-btn--dark" : " ecp-video-eq-footer-btn--light"}`, style: { marginLeft: "0.5rem" }, children: "Close" })
1273
1284
  ] })
1274
1285
  ] }) })
1275
1286
  ] }),
@@ -1278,14 +1289,14 @@ function wt({
1278
1289
  u && be === "bottom" && /* @__PURE__ */ e("div", { className: "ecp-video-vu-bottom", ref: T })
1279
1290
  ] }),
1280
1291
  f.seekbar && /* @__PURE__ */ e("div", { className: `ecp-video-seekbar${ee ? " ecp-video-seekbar--fullscreen" : ""}`, children: /* @__PURE__ */ c("div", { className: "ecp-video-seekbar-row", children: [
1281
- /* @__PURE__ */ e("span", { className: `ecp-video-time${b ? " ecp-video-time--dark" : " ecp-video-time--light"}`, children: Te(H) }),
1292
+ /* @__PURE__ */ e("span", { className: `ecp-video-time${h ? " ecp-video-time--dark" : " ecp-video-time--light"}`, children: Te(H) }),
1282
1293
  /* @__PURE__ */ e(
1283
1294
  "input",
1284
1295
  {
1285
1296
  type: "range",
1286
1297
  min: "0",
1287
1298
  max: "100",
1288
- value: F > 0 ? H / F * 100 : 0,
1299
+ value: P > 0 ? H / P * 100 : 0,
1289
1300
  onChange: xe,
1290
1301
  onMouseDown: Ee,
1291
1302
  onMouseUp: Le,
@@ -1294,11 +1305,12 @@ function wt({
1294
1305
  disabled: !s,
1295
1306
  className: "ecp-video-seek-input",
1296
1307
  style: {
1297
- background: s && F > 0 ? `linear-gradient(to right, ${j} ${H / F * 100}%, #e5e7eb ${H / F * 100}%)` : "#e5e7eb"
1308
+ background: s && P > 0 ? `linear-gradient(to right, ${F} ${H / P * 100}%, #e5e7eb ${H / P * 100}%)` : "#e5e7eb",
1309
+ "--thumb-color": F
1298
1310
  }
1299
1311
  }
1300
1312
  ),
1301
- /* @__PURE__ */ e("span", { className: `ecp-video-time ecp-video-time--right${b ? " ecp-video-time--dark" : " ecp-video-time--light"}`, children: Te(F) })
1313
+ /* @__PURE__ */ e("span", { className: `ecp-video-time ecp-video-time--right${h ? " ecp-video-time--dark" : " ecp-video-time--light"}`, children: Te(P) })
1302
1314
  ] }) }),
1303
1315
  /* @__PURE__ */ c("div", { className: "ecp-video-controls", children: [
1304
1316
  f.play && /* @__PURE__ */ c(
@@ -1307,22 +1319,22 @@ function wt({
1307
1319
  onClick: Ne,
1308
1320
  disabled: !s,
1309
1321
  className: `ecp-video-play-btn${te <= 400 ? " ecp-video-play-btn--compact" : ""}`,
1310
- style: { backgroundColor: j },
1322
+ style: { backgroundColor: F },
1311
1323
  children: [
1312
1324
  /* @__PURE__ */ c("div", { className: "ecp-video-play-icon-wrap", children: [
1313
- /* @__PURE__ */ e(Pe, { size: 16, style: { position: "absolute", transform: M ? void 0 : "scale(0) translateY(2.5rem)", transition: "all 150ms" } }),
1314
- /* @__PURE__ */ e(Me, { size: 16, style: { position: "absolute", transform: M ? "scale(0) translateY(-2.5rem)" : void 0, transition: "all 150ms" } })
1325
+ /* @__PURE__ */ e(Pe, { size: 16, style: { position: "absolute", transform: z ? void 0 : "scale(0) translateY(2.5rem)", transition: "all 150ms" } }),
1326
+ /* @__PURE__ */ e(Me, { size: 16, style: { position: "absolute", transform: z ? "scale(0) translateY(-2.5rem)" : void 0, transition: "all 150ms" } })
1315
1327
  ] }),
1316
- te > 400 && (M ? "Pause" : "Play")
1328
+ te > 400 && (z ? "Pause" : "Play")
1317
1329
  ]
1318
1330
  }
1319
1331
  ),
1320
- f.stop && /* @__PURE__ */ e("button", { onClick: he, disabled: !s, className: `ecp-video-stop-btn${b ? " ecp-video-stop-btn--dark" : " ecp-video-stop-btn--light"}`, children: /* @__PURE__ */ e(Ge, { size: 16 }) }),
1332
+ f.stop && /* @__PURE__ */ e("button", { onClick: ve, disabled: !s, className: `ecp-video-stop-btn${h ? " ecp-video-stop-btn--dark" : " ecp-video-stop-btn--light"}`, children: /* @__PURE__ */ e(Ge, { size: 16 }) }),
1321
1333
  f.fullscreen && /* @__PURE__ */ c(
1322
1334
  "button",
1323
1335
  {
1324
1336
  onClick: Se,
1325
- className: `ecp-video-fullscreen-btn${b ? " ecp-video-fullscreen-btn--dark" : " ecp-video-fullscreen-btn--light"}${te >= 800 ? " ecp-video-fullscreen-btn--wide" : ""}`,
1337
+ className: `ecp-video-fullscreen-btn${h ? " ecp-video-fullscreen-btn--dark" : " ecp-video-fullscreen-btn--light"}${te >= 800 ? " ecp-video-fullscreen-btn--wide" : ""}`,
1326
1338
  children: [
1327
1339
  ee ? /* @__PURE__ */ e(at, { size: 16 }) : /* @__PURE__ */ e(rt, { size: 16 }),
1328
1340
  /* @__PURE__ */ e("span", { style: { display: te < 800 ? "none" : "block" }, children: ee ? "Exit" : "Full" })
@@ -1335,19 +1347,19 @@ function wt({
1335
1347
  onClick: () => R(!de),
1336
1348
  disabled: !s,
1337
1349
  className: `ecp-video-eq-toggle-btn${de ? " ecp-video-eq-toggle-btn--on" : " ecp-video-eq-toggle-btn--off"}${te >= 700 ? " ecp-video-eq-toggle-btn--wide" : ""}`,
1338
- style: de ? { backgroundColor: j } : {},
1350
+ style: de ? { backgroundColor: F } : {},
1339
1351
  children: [
1340
1352
  /* @__PURE__ */ e(Fe, { size: 16 }),
1341
1353
  /* @__PURE__ */ e("span", { style: { display: te < 700 ? "none" : "block" }, children: "EQ" })
1342
1354
  ]
1343
1355
  }
1344
1356
  ),
1345
- f.speed && /* @__PURE__ */ e("div", { className: "ecp-video-speed-wrap", children: /* @__PURE__ */ e("select", { value: oe, onChange: Re, className: `ecp-video-speed-select${b ? " ecp-video-speed-select--dark" : " ecp-video-speed-select--light"}`, children: ["0.5", "0.75", "1", "1.25", "1.5", "2"].map((n) => /* @__PURE__ */ c("option", { value: n, className: b ? "ecp-video-speed-option--dark" : "ecp-video-speed-option--light", children: [
1357
+ f.speed && /* @__PURE__ */ e("div", { className: "ecp-video-speed-wrap", children: /* @__PURE__ */ e("select", { value: oe, onChange: Re, className: `ecp-video-speed-select${h ? " ecp-video-speed-select--dark" : " ecp-video-speed-select--light"}`, children: ["0.5", "0.75", "1", "1.25", "1.5", "2"].map((n) => /* @__PURE__ */ c("option", { value: n, className: h ? "ecp-video-speed-option--dark" : "ecp-video-speed-option--light", children: [
1346
1358
  n,
1347
1359
  "x"
1348
1360
  ] }, n)) }) }),
1349
1361
  f.volume && /* @__PURE__ */ c("div", { className: "ecp-video-volume", children: [
1350
- /* @__PURE__ */ e("button", { onClick: ze, className: "ecp-video-mute-btn", children: z || D === 0 ? /* @__PURE__ */ e(_e, { size: 20, className: b ? "ecp-video-mute-icon--dark" : "ecp-video-mute-icon--light" }) : /* @__PURE__ */ e(De, { size: 20, className: b ? "ecp-video-mute-icon--dark" : "ecp-video-mute-icon--light" }) }),
1362
+ /* @__PURE__ */ e("button", { onClick: ze, className: "ecp-video-mute-btn", children: S || D === 0 ? /* @__PURE__ */ e(_e, { size: 20, className: h ? "ecp-video-mute-icon--dark" : "ecp-video-mute-icon--light" }) : /* @__PURE__ */ e(De, { size: 20, className: h ? "ecp-video-mute-icon--dark" : "ecp-video-mute-icon--light" }) }),
1351
1363
  /* @__PURE__ */ e(
1352
1364
  "input",
1353
1365
  {
@@ -1358,7 +1370,8 @@ function wt({
1358
1370
  onChange: Ae,
1359
1371
  className: "ecp-video-vol-slider",
1360
1372
  style: {
1361
- background: `linear-gradient(to right, ${j} ${D}%, #e5e7eb ${D}%)`,
1373
+ background: `linear-gradient(to right, ${F} ${D}%, #e5e7eb ${D}%)`,
1374
+ "--thumb-color": F,
1362
1375
  display: te < 460 ? "none" : "block"
1363
1376
  }
1364
1377
  }
@@ -1366,7 +1379,7 @@ function wt({
1366
1379
  /* @__PURE__ */ c(
1367
1380
  "span",
1368
1381
  {
1369
- className: `ecp-video-vol-pct${b ? " ecp-video-vol-pct--dark" : " ecp-video-vol-pct--light"}`,
1382
+ className: `ecp-video-vol-pct${h ? " ecp-video-vol-pct--dark" : " ecp-video-vol-pct--light"}`,
1370
1383
  style: { display: te < 800 ? "none" : "block" },
1371
1384
  children: [
1372
1385
  D,
@@ -1383,9 +1396,9 @@ function wt({
1383
1396
  );
1384
1397
  }
1385
1398
  function Nt() {
1386
- const [s, l] = m(null), [u, v] = m("No track loaded"), [C, f] = m("purple"), [y, O] = m(!1), [x, j] = m(!1), [I, M] = m("light"), L = h(null);
1399
+ const [s, l] = m(null), [u, v] = m("No track loaded"), [C, f] = m("purple"), [y, O] = m(!1), [x, F] = m(!1), [I, z] = m("light"), E = b(null);
1387
1400
  return /* @__PURE__ */ e("div", { className: "ecp-page-wrapper", style: { backgroundColor: I === "dark" ? "#222" : "white" }, children: /* @__PURE__ */ c("div", { className: "ecp-demo-container", children: [
1388
- y && /* @__PURE__ */ e(vt, { theme: C, setTheme: f, close: () => O(!1) }),
1401
+ y && /* @__PURE__ */ e(ht, { theme: C, setTheme: f, close: () => O(!1) }),
1389
1402
  /* @__PURE__ */ c("div", { className: "ecp-container-glass", children: [
1390
1403
  /* @__PURE__ */ c("div", { className: "ecp-demo-header", children: [
1391
1404
  /* @__PURE__ */ c("div", { children: [
@@ -1398,7 +1411,7 @@ function Nt() {
1398
1411
  ] })
1399
1412
  ] }),
1400
1413
  /* @__PURE__ */ e(
1401
- ht,
1414
+ vt,
1402
1415
  {
1403
1416
  audio: s || void 0,
1404
1417
  name: u || void 0,
@@ -1442,23 +1455,23 @@ function Nt() {
1442
1455
  }
1443
1456
  ),
1444
1457
  /* @__PURE__ */ c("div", { className: "ecp-demo-actions", children: [
1445
- /* @__PURE__ */ e("input", { type: "file", ref: L, onChange: (F) => {
1458
+ /* @__PURE__ */ e("input", { type: "file", ref: E, onChange: (P) => {
1446
1459
  var D;
1447
- const P = (D = F.target.files) == null ? void 0 : D[0];
1448
- if (P) {
1449
- const k = URL.createObjectURL(P);
1450
- l(k), v(P.name);
1460
+ const M = (D = P.target.files) == null ? void 0 : D[0];
1461
+ if (M) {
1462
+ const k = URL.createObjectURL(M);
1463
+ l(k), v(M.name);
1451
1464
  }
1452
1465
  }, accept: "audio/*", className: "ecp-file-input-hidden" }),
1453
1466
  /* @__PURE__ */ c("button", { onClick: () => {
1454
- var F;
1455
- return (F = L.current) == null ? void 0 : F.click();
1467
+ var P;
1468
+ return (P = E.current) == null ? void 0 : P.click();
1456
1469
  }, className: "ecp-action-btn", children: [
1457
1470
  /* @__PURE__ */ e(pt, { size: 16 }),
1458
1471
  "Load Audio"
1459
1472
  ] }),
1460
- /* @__PURE__ */ e("button", { onClick: () => M(I === "dark" ? "light" : "dark"), className: "ecp-action-btn", children: I === "dark" ? "Light" : "Dark" }),
1461
- /* @__PURE__ */ c("button", { onClick: () => j(!x), className: "ecp-action-btn", children: [
1473
+ /* @__PURE__ */ e("button", { onClick: () => z(I === "dark" ? "light" : "dark"), className: "ecp-action-btn", children: I === "dark" ? "Light" : "Dark" }),
1474
+ /* @__PURE__ */ c("button", { onClick: () => F(!x), className: "ecp-action-btn", children: [
1462
1475
  "Transparent: ",
1463
1476
  String(x)
1464
1477
  ] })
@@ -1469,9 +1482,9 @@ function Nt() {
1469
1482
  export {
1470
1483
  Nt as DemoVisualizePlayer,
1471
1484
  gt as NanoAudioPlayer,
1472
- vt as ThemeSelector,
1485
+ ht as ThemeSelector,
1473
1486
  wt as VideoPlayer,
1474
- ht as VisualizePlayer,
1487
+ vt as VisualizePlayer,
1475
1488
  bt as WaveAudioPlayer,
1476
1489
  ge as themes
1477
1490
  };