horeg-audio 1.0.2 → 1.1.1

package/dist/horeg-audio.cjs

@@ -1,33 +1,36 @@
-"use strict";var R=Object.defineProperty;var V=(h,e,t)=>e in h?R(h,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):h[e]=t;var o=(h,e,t)=>V(h,typeof e!="symbol"?e+"":e,t);Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});function B(h){const e=h.replace("#","");if(e.length===3){const t=parseInt(e[0]+e[0],16),r=parseInt(e[1]+e[1],16),i=parseInt(e[2]+e[2],16);return`${t}, ${r}, ${i}`}if(e.length===6){const t=parseInt(e.substring(0,2),16),r=parseInt(e.substring(2,4),16),i=parseInt(e.substring(4,6),16);return`${t}, ${r}, ${i}`}return"245, 158, 11"}function O(h){if(!h)return!1;const e=h.replace("#","");let t=0,r=0,i=0;if(e.length===3)t=parseInt(e[0]+e[0],16),r=parseInt(e[1]+e[1],16),i=parseInt(e[2]+e[2],16);else if(e.length===6)t=parseInt(e.substring(0,2),16),r=parseInt(e.substring(2,4),16),i=parseInt(e.substring(4,6),16);else return!1;return(t*299+r*587+i*114)/1e3>155}const v={"horeg-classic":{variant:"horeg-classic",primaryGlowColor:"#f59e0b",accentColor:"#ef4444",cardBackground:"#121214",textColor:"#f4f4f5",sliderProgressColor:"#f59e0b",borderRadius:"14px",isLight:!1},"horeg-nightclub":{variant:"horeg-nightclub",primaryGlowColor:"#06b6d4",accentColor:"#ec4899",cardBackground:"#0b0c10",textColor:"#f8fafc",sliderProgressColor:"#06b6d4",borderRadius:"14px",isLight:!1},"horeg-stealth":{variant:"horeg-stealth",primaryGlowColor:"#94a3b8",accentColor:"#e2e8f0",cardBackground:"#0f1115",textColor:"#e2e8f0",sliderProgressColor:"#94a3b8",borderRadius:"8px",isLight:!1},"horeg-light":{variant:"horeg-light",primaryGlowColor:"#d97706",accentColor:"#dc2626",cardBackground:"#ffffff",textColor:"#0f172a",sliderProgressColor:"#d97706",borderRadius:"14px",surfaceColor:"#f8fafc",surfaceHoverColor:"#f1f5f9",borderColor:"#e2e8f0",mutedTextColor:"#64748b",isLight:!0},"horeg-light-clean":{variant:"horeg-light-clean",primaryGlowColor:"#0284c7",accentColor:"#db2777",cardBackground:"#ffffff",textColor:"#0f172a",sliderProgressColor:"#0284c7",borderRadius:"14px",surfaceColor:"#f8fafc",surfaceHoverColor:"#f1f5f9",borderColor:"#e2e8f0",mutedTextColor:"#64748b",isLight:!0},"horeg-light-minimal":{variant:"horeg-light-minimal",primaryGlowColor:"#475569",accentColor:"#2563eb",cardBackground:"#f8fafc",textColor:"#1e293b",sliderProgressColor:"#2563eb",borderRadius:"8px",surfaceColor:"#f1f5f9",surfaceHoverColor:"#e2e8f0",borderColor:"#e2e8f0",mutedTextColor:"#64748b",isLight:!0}};function L(h={}){const e=h.variant||"horeg-classic",t=v[e]||v["horeg-classic"],r=h.isLight??t.isLight??(e.includes("light")||O(h.cardBackground||t.cardBackground)),i=h.primaryGlowColor||t.primaryGlowColor||(r?"#d97706":"#f59e0b"),n=h.accentColor||t.accentColor||(r?"#dc2626":"#ef4444"),a=h.cardBackground||t.cardBackground||(r?"#ffffff":"#121214"),l=h.textColor||t.textColor||(r?"#0f172a":"#f4f4f5"),d=h.sliderProgressColor||t.sliderProgressColor||i,p=h.borderRadius||t.borderRadius||"14px",g=h.surfaceColor||t.surfaceColor||(r?"#f8fafc":"#18181b"),f=h.surfaceHoverColor||t.surfaceHoverColor||(r?"#f1f5f9":"#222226"),b=h.borderColor||t.borderColor||(r?"#e2e8f0":"#27272a"),x=h.mutedTextColor||t.mutedTextColor||(r?"#64748b":"#a1a1aa"),w=r?g:"#141416",y=r?"#e2e8f0":"#27272a",k=r?"#cbd5e1":"#3f3f46",E=r?"#ffffff":"#1f1f23",C=r?"#ffffff":"#09090b",P=r?"#94a3b8":"#3f3f46",M=r?"#cbd5e1":"#18181b",I=r?"#cbd5e1":"#2c2d33",z=r?"0.35":"0.3",S=r?"#f8fafc":"#141416",A=r?"#ffffff":"#121214",H=r?"#f1f5f9":"#202024",N=r?"#ffffff":"#27272a",$=r?`linear-gradient(90deg, rgba(${B(i)}, 0.12) 0%, rgba(${B(i)}, 0.02) 100%)`:"linear-gradient(90deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.02) 100%)",U=r?"rgba(0, 0, 0, 0.06)":"rgba(255, 255, 255, 0.06)",F=r?"0 14px 36px -8px rgba(15, 23, 42, 0.12), 0 2px 10px -2px rgba(15, 23, 42, 0.06), 0 0 16px -4px var(--horeg-glow)":"0 16px 40px -10px rgba(0, 0, 0, 0.9), 0 0 20px -5px var(--horeg-glow)",D=r?"0 18px 44px -8px rgba(15, 23, 42, 0.18), 0 0 24px -2px var(--horeg-glow)":"0 20px 48px -10px rgba(0, 0, 0, 0.95), 0 0 30px -2px var(--horeg-glow), 0 0 10px var(--horeg-glow)";return`
+"use strict";var q=Object.defineProperty;var j=(d,e,r)=>e in d?q(d,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):d[e]=r;var i=(d,e,r)=>j(d,typeof e!="symbol"?e+"":e,r);Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});function B(d){const e=d.replace("#","");if(e.length===3){const r=parseInt(e[0]+e[0],16),t=parseInt(e[1]+e[1],16),s=parseInt(e[2]+e[2],16);return`${r}, ${t}, ${s}`}if(e.length===6){const r=parseInt(e.substring(0,2),16),t=parseInt(e.substring(2,4),16),s=parseInt(e.substring(4,6),16);return`${r}, ${t}, ${s}`}return"245, 158, 11"}function W(d){if(!d)return!1;const e=d.replace("#","");let r=0,t=0,s=0;if(e.length===3)r=parseInt(e[0]+e[0],16),t=parseInt(e[1]+e[1],16),s=parseInt(e[2]+e[2],16);else if(e.length===6)r=parseInt(e.substring(0,2),16),t=parseInt(e.substring(2,4),16),s=parseInt(e.substring(4,6),16);else return!1;return(r*299+t*587+s*114)/1e3>155}const E={"horeg-classic":{variant:"horeg-classic",primaryGlowColor:"#f59e0b",accentColor:"#ef4444",cardBackground:"#121214",textColor:"#f4f4f5",sliderProgressColor:"#f59e0b",borderRadius:"14px",isLight:!1},"horeg-nightclub":{variant:"horeg-nightclub",primaryGlowColor:"#06b6d4",accentColor:"#ec4899",cardBackground:"#0b0c10",textColor:"#f8fafc",sliderProgressColor:"#06b6d4",borderRadius:"14px",isLight:!1},"horeg-stealth":{variant:"horeg-stealth",primaryGlowColor:"#94a3b8",accentColor:"#e2e8f0",cardBackground:"#0f1115",textColor:"#e2e8f0",sliderProgressColor:"#94a3b8",borderRadius:"8px",isLight:!1},"horeg-light":{variant:"horeg-light",primaryGlowColor:"#d97706",accentColor:"#dc2626",cardBackground:"#ffffff",textColor:"#0f172a",sliderProgressColor:"#d97706",borderRadius:"14px",surfaceColor:"#f8fafc",surfaceHoverColor:"#f1f5f9",borderColor:"#e2e8f0",mutedTextColor:"#64748b",isLight:!0},"horeg-light-clean":{variant:"horeg-light-clean",primaryGlowColor:"#0284c7",accentColor:"#db2777",cardBackground:"#ffffff",textColor:"#0f172a",sliderProgressColor:"#0284c7",borderRadius:"14px",surfaceColor:"#f8fafc",surfaceHoverColor:"#f1f5f9",borderColor:"#e2e8f0",mutedTextColor:"#64748b",isLight:!0},"horeg-light-minimal":{variant:"horeg-light-minimal",primaryGlowColor:"#475569",accentColor:"#2563eb",cardBackground:"#f8fafc",textColor:"#1e293b",sliderProgressColor:"#2563eb",borderRadius:"8px",surfaceColor:"#f1f5f9",surfaceHoverColor:"#e2e8f0",borderColor:"#e2e8f0",mutedTextColor:"#64748b",isLight:!0}};function L(d={},e){const r=d.variant||"horeg-classic",t=E[r]||E["horeg-classic"];let s="none";typeof e=="number"?s=`${e}px`:typeof e=="string"&&e.trim()!==""&&e.trim().toLowerCase()!=="fluid"&&(s=e.trim());const o=d.isLight??t.isLight??(r.includes("light")||W(d.cardBackground||t.cardBackground)),a=d.primaryGlowColor||t.primaryGlowColor||(o?"#d97706":"#f59e0b"),l=d.accentColor||t.accentColor||(o?"#dc2626":"#ef4444"),h=d.cardBackground||t.cardBackground||(o?"#ffffff":"#121214"),p=d.textColor||t.textColor||(o?"#0f172a":"#f4f4f5"),g=d.sliderProgressColor||t.sliderProgressColor||a,b=d.borderRadius||t.borderRadius||"14px",u=d.surfaceColor||t.surfaceColor||(o?"#f8fafc":"#18181b"),f=d.surfaceHoverColor||t.surfaceHoverColor||(o?"#f1f5f9":"#222226"),m=d.borderColor||t.borderColor||(o?"#e2e8f0":"#27272a"),y=d.mutedTextColor||t.mutedTextColor||(o?"#64748b":"#a1a1aa"),w=o?u:"#141416",k=o?"#e2e8f0":"#27272a",x=o?"#cbd5e1":"#3f3f46",A=o?"#ffffff":"#1f1f23",S=o?"#ffffff":"#09090b",M=o?"#94a3b8":"#3f3f46",P=o?"#cbd5e1":"#18181b",z=o?"#cbd5e1":"#2c2d33",I=o?"0.35":"0.3",N=o?"#f8fafc":"#141416",H=o?"#ffffff":"#121214",D=o?"#f1f5f9":"#202024",$=o?"#ffffff":"#27272a",R=o?`linear-gradient(90deg, rgba(${B(a)}, 0.12) 0%, rgba(${B(a)}, 0.02) 100%)`:"linear-gradient(90deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.02) 100%)",F=o?"rgba(0, 0, 0, 0.06)":"rgba(255, 255, 255, 0.06)",U=o?"0 14px 36px -8px rgba(15, 23, 42, 0.12), 0 2px 10px -2px rgba(15, 23, 42, 0.06), 0 0 16px -4px var(--horeg-glow)":"0 16px 40px -10px rgba(0, 0, 0, 0.9), 0 0 20px -5px var(--horeg-glow)",V=o?"0 18px 44px -8px rgba(15, 23, 42, 0.18), 0 0 24px -2px var(--horeg-glow)":"0 20px 48px -10px rgba(0, 0, 0, 0.95), 0 0 30px -2px var(--horeg-glow), 0 0 10px var(--horeg-glow)";return`
     :host {
-      --horeg-bg: ${a};
-      --horeg-surface: ${g};
+      display: block;
+      width: 100%;
+      --horeg-max-width: ${s};
+      --horeg-bg: ${h};
+      --horeg-surface: ${u};
       --horeg-surface-hover: ${f};
-      --horeg-border: ${b};
-      --horeg-glow: ${i};
-      --horeg-glow-rgb: ${B(i)};
-      --horeg-accent: ${n};
-      --horeg-progress: ${d};
-      --horeg-text-main: ${l};
-      --horeg-text-muted: ${x};
-      --horeg-radius: ${p};
+      --horeg-border: ${m};
+      --horeg-glow: ${a};
+      --horeg-glow-rgb: ${B(a)};
+      --horeg-accent: ${l};
+      --horeg-progress: ${g};
+      --horeg-text-main: ${p};
+      --horeg-text-muted: ${y};
+      --horeg-radius: ${b};
       --horeg-drawer-bg: ${w};
-      --horeg-slider-bg: ${y};
-      --horeg-slider-buffer: ${k};
-      --horeg-btn-play-bg: ${E};
-      --horeg-btn-play-text: ${C};
-      --horeg-bolt-bg: ${P};
-      --horeg-bolt-border: ${M};
-      --horeg-grill-color: ${I};
-      --horeg-grill-opacity: ${z};
-      --horeg-dropzone-bg: ${S};
-      --horeg-input-bg: ${A};
-      --horeg-tab-bg: ${H};
-      --horeg-tab-active-bg: ${N};
-      --horeg-item-active-bg: ${$};
-      --horeg-btn-active-bg: ${U};
-      --horeg-box-shadow: ${F};
-      --horeg-focus-shadow: ${D};
+      --horeg-slider-bg: ${k};
+      --horeg-slider-buffer: ${x};
+      --horeg-btn-play-bg: ${A};
+      --horeg-btn-play-text: ${S};
+      --horeg-bolt-bg: ${M};
+      --horeg-bolt-border: ${P};
+      --horeg-grill-color: ${z};
+      --horeg-grill-opacity: ${I};
+      --horeg-dropzone-bg: ${N};
+      --horeg-input-bg: ${H};
+      --horeg-tab-bg: ${D};
+      --horeg-tab-active-bg: ${$};
+      --horeg-item-active-bg: ${R};
+      --horeg-btn-active-bg: ${F};
+      --horeg-box-shadow: ${U};
+      --horeg-focus-shadow: ${V};
       display: block;
       font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
       box-sizing: border-box;
@@ -43,6 +46,8 @@
     }
 
     .horeg-player-box {
+      container-type: inline-size;
+      container-name: horeg-box;
       background: var(--horeg-bg);
       border: 2px solid var(--horeg-border);
       border-radius: var(--horeg-radius);
@@ -50,8 +55,8 @@
       color: var(--horeg-text-main);
       position: relative;
       overflow: hidden;
-      max-width: 520px;
       width: 100%;
+      max-width: var(--horeg-max-width, none);
       margin: 0 auto;
       transition: box-shadow 0.3s ease, border-color 0.3s ease;
     }
@@ -151,54 +156,429 @@
     }
 
     /* Track Display & Visualizer Section */
-    .horeg-track-row {
+    /* 3-Soundbox Stage Visualizer */
+    .horeg-soundbox-stage {
+      position: relative;
+      width: 100%;
+      box-sizing: border-box;
       display: flex;
       align-items: center;
-      gap: 14px;
+      justify-content: center;
+      gap: 12px;
+      padding: 14px 24px;
+      background: ${o?"rgba(0, 0, 0, 0.04)":"rgba(0, 0, 0, 0.45)"};
+      border: 1px solid var(--horeg-border);
+      border-radius: 12px;
+      box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.35);
+      overflow: visible;
     }
 
-    .horeg-cover-container {
+    /* Base Soundbox Cabinet */
+    .horeg-soundbox {
       position: relative;
-      width: 64px;
-      height: 64px;
-      min-width: 64px;
-      border-radius: 8px;
-      overflow: hidden;
       background: var(--horeg-surface);
       border: 1px solid var(--horeg-border);
+      box-sizing: border-box;
+      flex-shrink: 0;
+      user-select: none;
+    }
+
+    /* Miniature Box Bolts */
+    .horeg-box-bolt {
+      position: absolute;
+      width: 5px;
+      height: 5px;
+      background: ${M};
+      border: 1px solid ${P};
+      border-radius: 50%;
+      z-index: 5;
+    }
+
+    .horeg-box-bolt.top-left { top: 4px; left: 4px; }
+    .horeg-box-bolt.top-right { top: 4px; right: 4px; }
+    .horeg-box-bolt.bottom-left { bottom: 4px; left: 4px; }
+    .horeg-box-bolt.bottom-right { bottom: 4px; right: 4px; }
+
+    /* Left & Right Satellite Speakers */
+    .horeg-soundbox.is-satellite {
+      width: 58px;
+      height: 106px;
+      border-radius: 6px;
+      padding: 6px 4px;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.06);
+      z-index: 2;
+      position: relative;
+    }
+
+    .horeg-soundbox.is-satellite.is-left {
+      margin-right: -6px;
+    }
+
+    .horeg-soundbox.is-satellite.is-right {
+      margin-left: -6px;
+    }
+
+    .horeg-box-header, .horeg-box-footer {
+      position: relative;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      height: 10px;
+    }
+
+    .horeg-tweeter-slot {
+      width: 14px;
+      height: 3px;
+      background: var(--horeg-glow);
+      border-radius: 2px;
+      opacity: 0.75;
+      box-shadow: 0 0 4px var(--horeg-glow);
+    }
+
+    .horeg-port-slot {
+      width: 16px;
+      height: 3px;
+      background: #090a0d;
+      border: 1px solid var(--horeg-border);
+      border-radius: 2px;
+    }
+
+    .horeg-satellite-baffle {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      gap: 6px;
+      flex: 1;
+    }
+
+    .horeg-satellite-driver {
+      position: relative;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+    /* Water-like Ripple Rings around the 4 Satellite Circles */
+    .horeg-driver-ripple {
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      width: 38px;
+      height: 38px;
+      margin-top: -19px;
+      margin-left: -19px;
+      border-radius: 50%;
+      border: 1.5px solid rgba(var(--horeg-glow-rgb), 0.5);
+      box-shadow: 0 0 12px rgba(var(--horeg-glow-rgb), 0.25), inset 0 0 8px rgba(var(--horeg-glow-rgb), 0.125);
+      opacity: 0;
+      pointer-events: none;
+      transform-origin: center center;
+      transition: transform 0.06s ease-out, opacity 0.06s ease-out;
+      z-index: 1;
+    }
+
+    .horeg-driver-ripple.ripple-2 {
+      border-width: 1px;
+    }
+
+    .horeg-driver-surround {
+      position: relative;
+      z-index: 2;
+      width: 38px;
+      height: 38px;
+      border-radius: 50%;
+      background: #0c0d12;
+      border: 1px solid var(--horeg-border);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.8);
+    }
+
+    .horeg-driver-cone {
+      width: 30px;
+      height: 30px;
+      border-radius: 50%;
+      background: radial-gradient(circle, #2a2b33 0%, #15161c 65%, #09090b 100%);
+      border: 1px solid rgba(255, 255, 255, 0.08);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      transform-origin: center center;
+      transition: transform 0.05s ease-out;
+      box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
+    }
+
+    .horeg-driver-cap {
+      width: 10px;
+      height: 10px;
+      border-radius: 50%;
+      background: radial-gradient(circle, var(--horeg-glow) 0%, #181920 80%);
+      opacity: 0.85;
+      box-shadow: 0 0 4px var(--horeg-glow);
+    }
+
+    /* Center Monster Subwoofer - Higher z-index in front of left and right */
+    .horeg-soundbox.is-subwoofer {
+      width: 126px;
+      height: 126px;
+      border-radius: 12px;
+      border: 1.5px solid var(--horeg-border);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.08);
+      z-index: 10 !important;
+      position: relative;
+      transition: transform 0.04s ease-out, box-shadow 0.08s ease-out;
+    }
+
+    /* Concentric Bass Shockwaves */
+    .horeg-shockwaves-wrap {
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      width: 0;
+      height: 0;
+      pointer-events: none;
+      z-index: 6;
+    }
+
+    .horeg-shockwave {
+      position: absolute;
+      top: -50px;
+      left: -50px;
+      width: 100px;
+      height: 100px;
+      border-radius: 50%;
+      border: 2px solid var(--horeg-glow);
+      box-shadow: 0 0 16px var(--horeg-glow), inset 0 0 8px var(--horeg-glow);
+      opacity: 0;
+      transform-origin: center center;
+      pointer-events: none;
+      transition: transform 0.05s ease-out, opacity 0.08s ease-out;
+    }
+
+    .horeg-shockwave.wave-1 {
+      border-width: 2.5px;
+    }
+
+    .horeg-shockwave.wave-2 {
+      border-width: 1.5px;
+      border-style: dashed;
+    }
+
+    /* Subwoofer Frame Details */
+    .horeg-sub-frame {
+      position: absolute;
+      inset: 0;
+      pointer-events: none;
+      z-index: 3;
+    }
+
+    .horeg-sub-badge {
+      position: absolute;
+      top: 2px;
+      left: 50%;
+      transform: translateX(-50%);
+      font-size: 8px;
+      font-weight: 800;
+      letter-spacing: 1.2px;
+      color: var(--horeg-glow);
+      background: rgba(0, 0, 0, 0.2);
+      padding: 1px 6px;
+      border-radius: 3px;
+      border: 1px solid rgba(255, 255, 255, 0.05);
+      text-shadow: 0 0 6px var(--horeg-glow);
+    }
+
+    .horeg-sub-ports {
+      position: absolute;
+      bottom: 6px;
+      left: 0;
+      right: 0;
+      display: flex;
+      justify-content: space-between;
+      padding: 0 12px;
+    }
+
+    .horeg-sub-port {
+      width: 10px;
+      height: 10px;
+      background: #08080a;
+      border-radius: 50%;
+      border: 1px solid var(--horeg-border);
+      box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.9);
+    }
+
+    /* Subwoofer Baffle, Surround & Cone */
+    .horeg-sub-baffle {
+      position: relative;
+      z-index: 2;
+      width: 96px;
+      height: 96px;
+      border-radius: 50%;
+      background: #0a0b0e;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      border: 1.5px solid var(--horeg-border);
+      box-shadow: inset 0 0 12px rgba(0, 0, 0, 0.9);
+    }
+
+    .horeg-sub-surround {
+      width: 86px;
+      height: 86px;
+      border-radius: 50%;
+      background: radial-gradient(circle, #1a1b22 60%, #0d0e13 100%);
+      border: 2px solid rgba(0, 0, 0, 0.6);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.7);
+    }
+
+    .horeg-sub-cone {
+      width: 72px;
+      height: 72px;
+      border-radius: 50%;
+      background: radial-gradient(circle, #2a2b34 0%, #15161d 65%, #0a0a0d 100%);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      transform-origin: center center;
+      transition: transform 0.05s ease-out;
+      box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
+    }
+
+    /* Circular Cover Art inside Subwoofer */
+    .horeg-sub-cover-wrap {
+      position: relative;
+      width: 54px;
+      height: 54px;
+      min-width: 54px;
+      border-radius: 50%;
+      overflow: hidden;
+      background: #0f1015;
+      border: 2px solid var(--horeg-glow);
       display: flex;
       align-items: center;
       justify-content: center;
-      box-shadow: inset 0 0 10px rgba(0,0,0,0.1), 0 2px 6px rgba(0,0,0,0.08);
+      box-shadow: 0 0 12px var(--horeg-glow), inset 0 0 8px rgba(0, 0, 0, 0.6);
     }
 
     .horeg-cover-img {
       width: 100%;
       height: 100%;
       object-fit: cover;
+      display: block;
     }
 
     .horeg-cover-fallback {
       color: var(--horeg-glow);
-      opacity: 0.7;
+      opacity: 0.8;
+      display: flex;
+      align-items: center;
+      justify-content: center;
     }
 
-    .horeg-track-info {
-      flex: 1;
-      min-width: 0;
+    /* Centered Metadata & Title Marquee Section */
+    .horeg-track-meta {
       display: flex;
       flex-direction: column;
-      gap: 2px;
+      align-items: center;
+      justify-content: center;
+      gap: 3px;
+      margin: 4px 0 2px 0;
+      text-align: center;
+      width: 100%;
+    }
+
+    .horeg-title-wrap {
+      width: 100%;
+      max-width: 380px;
+      overflow: hidden;
+      position: relative;
+      margin: 0 auto;
+      text-align: center;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+    .horeg-title-wrap.is-overflowing {
+      justify-content: flex-start;
+      -webkit-mask-image: linear-gradient(to right, #000 0%, #000 calc(100% - 24px), transparent 100%);
+      mask-image: linear-gradient(to right, #000 0%, #000 calc(100% - 24px), transparent 100%);
+      animation: horegTitleMask var(--marquee-duration, 8s) ease-in-out infinite;
+    }
+
+    /* Mask Fading:
+       - 0% - 18%: Teks di ujung kiri (awal) -> fade kiri hilang (teks jelas), fade kanan aktif
+       - 26% - 70%: Teks berjalan -> fade kiri & kanan sama-sama aktif
+       - 78% - 86%: Teks di ujung kanan (akhir) -> fade kanan hilang (teks jelas), fade kiri aktif
+       - 92% - 100%: Teks reset ke awal -> fade kiri hilang kembali, fade kanan aktif
+    */
+    @keyframes horegTitleMask {
+      0%, 18% {
+        -webkit-mask-image: linear-gradient(to right, #000 0%, #000 calc(100% - 24px), transparent 100%);
+        mask-image: linear-gradient(to right, #000 0%, #000 calc(100% - 24px), transparent 100%);
+      }
+      26%, 70% {
+        -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 24px, #000 calc(100% - 24px), transparent 100%);
+        mask-image: linear-gradient(to right, transparent 0%, #000 24px, #000 calc(100% - 24px), transparent 100%);
+      }
+      78%, 86% {
+        -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 24px, #000 100%);
+        mask-image: linear-gradient(to right, transparent 0%, #000 24px, #000 100%);
+      }
+      92%, 100% {
+        -webkit-mask-image: linear-gradient(to right, #000 0%, #000 calc(100% - 24px), transparent 100%);
+        mask-image: linear-gradient(to right, #000 0%, #000 calc(100% - 24px), transparent 100%);
+      }
     }
 
     .horeg-track-title {
       font-size: 15px;
       font-weight: 700;
       white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
+      display: inline-block;
       color: var(--horeg-text-main);
       letter-spacing: 0.2px;
+      text-align: center;
+      will-change: transform, opacity;
+    }
+
+    /* Marquee: Reset ke posisi awal (BUKAN rewind bolak-balik) */
+    .horeg-track-title.is-marquee {
+      animation: horegMarquee var(--marquee-duration, 8s) ease-in-out infinite;
+    }
+
+    @keyframes horegMarquee {
+      0%, 18% {
+        transform: translateX(0);
+        opacity: 1;
+      }
+      76%, 86% {
+        transform: translateX(var(--marquee-dist, -40px));
+        opacity: 1;
+      }
+      90% {
+        transform: translateX(var(--marquee-dist, -40px));
+        opacity: 0;
+      }
+      93% {
+        transform: translateX(0);
+        opacity: 0;
+      }
+      100% {
+        transform: translateX(0);
+        opacity: 1;
+      }
     }
 
     .horeg-track-artist {
@@ -208,33 +588,19 @@
       white-space: nowrap;
       overflow: hidden;
       text-overflow: ellipsis;
+      max-width: 360px;
+      text-align: center;
     }
 
     .horeg-track-album {
       font-size: 10px;
       color: var(--horeg-text-muted);
-      opacity: 0.85;
+      opacity: 0.8;
       white-space: nowrap;
       overflow: hidden;
       text-overflow: ellipsis;
-    }
-
-    /* Mini EQ Visualizer */
-    .horeg-eq-wrapper {
-      display: flex;
-      align-items: flex-end;
-      gap: 2px;
-      height: 24px;
-      padding: 0 4px;
-    }
-
-    .horeg-eq-bar {
-      width: 3px;
-      height: 4px;
-      background: var(--horeg-glow);
-      border-radius: 1px;
-      transition: height 0.1s ease;
-      box-shadow: 0 0 4px var(--horeg-glow);
+      max-width: 360px;
+      text-align: center;
     }
 
     /* Scrubbing / Fader Progress Bar */
@@ -258,26 +624,12 @@
       height: 7px;
       background: var(--horeg-slider-bg);
       border-radius: 4px;
-      cursor: grab;
+      cursor: pointer;
       overflow: hidden;
       box-shadow: inset 0 1px 3px rgba(0,0,0,0.2);
       touch-action: none;
     }
 
-    .horeg-slider-track:hover {
-      cursor: grab;
-    }
-
-    .horeg-slider-track:active,
-    .horeg-slider-track.scrubbing {
-      cursor: grabbing;
-    }
-
-    .horeg-player-box.scrubbing,
-    .horeg-player-box.scrubbing * {
-      cursor: grabbing !important;
-    }
-
     .horeg-buffer-bar {
       position: absolute;
       top: 0;
@@ -339,6 +691,7 @@
       justify-content: center;
       transition: all 0.15s ease;
       touch-action: manipulation;
+      position: relative;
     }
 
     .horeg-btn:hover {
@@ -363,6 +716,100 @@
       box-shadow: inset 0 0 8px rgba(255, 255, 255, 0.05);
     }
 
+    /* Tooltip Bubble */
+    .horeg-btn[data-tooltip]::before {
+      content: attr(data-tooltip);
+      position: absolute;
+      bottom: calc(100% + 7px);
+      left: 50%;
+      transform: translateX(-50%) translateY(4px);
+      background: ${o?"rgba(15, 23, 42, 0.94)":"rgba(20, 20, 24, 0.96)"};
+      color: ${o?"#f8fafc":"var(--horeg-text-main)"};
+      border: 1px solid var(--horeg-border);
+      box-shadow: 0 4px 14px rgba(0, 0, 0, 0.5), 0 0 8px rgba(var(--horeg-glow-rgb), 0.3);
+      padding: 3px 8px;
+      font-size: 11px;
+      font-weight: 600;
+      border-radius: 5px;
+      white-space: nowrap;
+      pointer-events: none;
+      opacity: 0;
+      visibility: hidden;
+      transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s ease;
+      z-index: 35;
+      letter-spacing: 0.2px;
+      font-family: inherit;
+    }
+
+    /* Tooltip Arrow */
+    .horeg-btn[data-tooltip]::after {
+      content: '';
+      position: absolute;
+      bottom: calc(100% + 2px);
+      left: 50%;
+      transform: translateX(-50%) translateY(4px);
+      border-width: 5px 5px 0 5px;
+      border-style: solid;
+      border-color: ${o?"rgba(15, 23, 42, 0.94)":"rgba(20, 20, 24, 0.96)"} transparent transparent transparent;
+      pointer-events: none;
+      opacity: 0;
+      visibility: hidden;
+      transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s ease;
+      z-index: 35;
+    }
+
+    .horeg-btn[data-tooltip]:hover::before,
+    .horeg-btn[data-tooltip]:focus-visible::before,
+    .horeg-btn[data-tooltip]:hover::after,
+    .horeg-btn[data-tooltip]:focus-visible::after {
+      opacity: 1;
+      visibility: visible;
+      transform: translateX(-50%) translateY(0);
+    }
+
+    /* Edge alignment so tooltips near container margins don't clip */
+    .horeg-side-controls:first-child .horeg-btn:first-child[data-tooltip]::before {
+      left: 0;
+      transform: translateY(4px);
+    }
+    .horeg-side-controls:first-child .horeg-btn:first-child[data-tooltip]::after {
+      left: 12px;
+      transform: translateY(4px);
+    }
+    .horeg-side-controls:first-child .horeg-btn:first-child[data-tooltip]:hover::before,
+    .horeg-side-controls:first-child .horeg-btn:first-child[data-tooltip]:focus-visible::before,
+    .horeg-side-controls:first-child .horeg-btn:first-child[data-tooltip]:hover::after,
+    .horeg-side-controls:first-child .horeg-btn:first-child[data-tooltip]:focus-visible::after {
+      transform: translateY(0);
+    }
+
+    .horeg-side-controls:last-child .horeg-btn:last-child[data-tooltip]::before {
+      left: auto;
+      right: 0;
+      transform: translateY(4px);
+    }
+    .horeg-side-controls:last-child .horeg-btn:last-child[data-tooltip]::after {
+      left: auto;
+      right: 12px;
+      transform: translateY(4px);
+    }
+    .horeg-side-controls:last-child .horeg-btn:last-child[data-tooltip]:hover::before,
+    .horeg-side-controls:last-child .horeg-btn:last-child[data-tooltip]:focus-visible::before,
+    .horeg-side-controls:last-child .horeg-btn:last-child[data-tooltip]:hover::after,
+    .horeg-side-controls:last-child .horeg-btn:last-child[data-tooltip]:focus-visible::after {
+      transform: translateY(0);
+    }
+
+    /* Suppress volume button tooltip when dropup is active */
+    .horeg-volume-wrap:hover .horeg-btn[data-tooltip]::before,
+    .horeg-volume-wrap:hover .horeg-btn[data-tooltip]::after,
+    .horeg-volume-wrap:focus-within .horeg-btn[data-tooltip]::before,
+    .horeg-volume-wrap:focus-within .horeg-btn[data-tooltip]::after,
+    .horeg-volume-wrap.open .horeg-btn[data-tooltip]::before,
+    .horeg-volume-wrap.open .horeg-btn[data-tooltip]::after {
+      display: none;
+    }
+
     /* Primary Play / Pause Button with Neon Glow Pulse */
     .horeg-btn-play {
       width: 44px;
@@ -401,61 +848,118 @@
       }
     }
 
-    /* Volume Slider Rel Mixer */
+    /* Vertical Volume Dropup Mixer */
     .horeg-volume-wrap {
+      position: relative;
       display: flex;
       align-items: center;
+      justify-content: center;
+    }
+
+    .horeg-volume-dropup {
+      position: absolute;
+      bottom: calc(100% + 8px);
+      left: 50%;
+      transform: translateX(-50%) translateY(8px);
+      background: ${o?"#ffffff":"var(--horeg-surface)"};
+      border: 1px solid var(--horeg-border);
+      border-radius: 10px;
+      padding: 8px 6px 8px 6px;
+      box-shadow: 0 10px 24px -4px rgba(0, 0, 0, 0.6), 0 0 10px -2px var(--horeg-glow);
+      display: flex;
+      flex-direction: column;
+      align-items: center;
       gap: 6px;
+      width: 36px;
+      opacity: 0;
+      visibility: hidden;
+      pointer-events: none;
+      transition: opacity 0.18s cubic-bezier(0.4, 0, 0.2, 1), transform 0.18s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.18s ease;
+      z-index: 40;
     }
 
-    .horeg-volume-slider {
-      -webkit-appearance: none;
-      appearance: none;
-      width: 70px;
-      height: 5px;
-      background: var(--horeg-slider-bg);
-      border-radius: 3px;
-      outline: none;
-      cursor: grab;
+    /* Dropup hover bridge */
+    .horeg-volume-dropup::before {
+      content: '';
+      position: absolute;
+      top: 100%;
+      left: -8px;
+      right: -8px;
+      height: 12px;
+      background: transparent;
+    }
+
+    /* Dropup arrow pointer */
+    .horeg-volume-dropup::after {
+      content: '';
+      position: absolute;
+      top: 100%;
+      left: 50%;
+      transform: translateX(-50%);
+      border-width: 5px 5px 0 5px;
+      border-style: solid;
+      border-color: ${o?"#ffffff":"var(--horeg-surface)"} transparent transparent transparent;
     }
 
-    .horeg-volume-slider:active {
-      cursor: grabbing;
+    .horeg-volume-wrap:hover .horeg-volume-dropup,
+    .horeg-volume-wrap:focus-within .horeg-volume-dropup,
+    .horeg-volume-wrap.open .horeg-volume-dropup {
+      opacity: 1;
+      visibility: visible;
+      pointer-events: auto;
+      transform: translateX(-50%) translateY(0);
+    }
+
+    .horeg-volume-percent {
+      font-size: 10px;
+      font-weight: 700;
+      color: var(--horeg-glow);
+      font-family: ui-monospace, monospace;
+      letter-spacing: 0.5px;
+      user-select: none;
+      text-align: center;
+      line-height: 1;
     }
 
-    .horeg-volume-slider::-webkit-slider-thumb {
+    .horeg-volume-slider-vertical {
+      -webkit-appearance: slider-vertical;
+      appearance: slider-vertical;
+      writing-mode: vertical-lr;
+      direction: rtl;
+      width: 8px;
+      height: 84px;
+      background: var(--horeg-slider-bg);
+      border-radius: 4px;
+      outline: none;
+      cursor: pointer;
+      margin: 0 auto;
+    }
+
+    .horeg-volume-slider-vertical::-webkit-slider-thumb {
       -webkit-appearance: none;
       appearance: none;
-      width: 12px;
-      height: 12px;
+      width: 14px;
+      height: 14px;
       border-radius: 50%;
       background: var(--horeg-glow);
-      border: 1px solid var(--horeg-border);
+      border: 2px solid ${o?"#ffffff":"#18181b"};
       box-shadow: 0 0 6px var(--horeg-glow);
-      cursor: grab;
+      cursor: pointer;
       transition: transform 0.1s ease;
     }
 
-    .horeg-volume-slider::-webkit-slider-thumb:hover {
+    .horeg-volume-slider-vertical::-webkit-slider-thumb:hover {
       transform: scale(1.2);
     }
 
-    .horeg-volume-slider:active::-webkit-slider-thumb {
-      cursor: grabbing;
-    }
-
-    .horeg-volume-slider::-moz-range-thumb {
-      width: 12px;
-      height: 12px;
+    .horeg-volume-slider-vertical::-moz-range-thumb {
+      width: 14px;
+      height: 14px;
       border-radius: 50%;
       background: var(--horeg-glow);
-      border: 1px solid var(--horeg-border);
+      border: 2px solid ${o?"#ffffff":"#18181b"};
       box-shadow: 0 0 6px var(--horeg-glow);
-      cursor: grab;
-    }
-
-    .horeg-volume-slider:active::-moz-range-thumb {
-      cursor: grabbing;
+      cursor: pointer;
     }
 
     /* Drag Over Highlight on main player */
@@ -870,9 +1374,157 @@
       font-size: 12px;
       font-style: italic;
     }
-  `}function T(h){if(isNaN(h)||!isFinite(h)||h<0)return"00:00";const e=Math.floor(h),t=Math.floor(e/3600),r=Math.floor(e%3600/60),i=e%60,n=a=>a.toString().padStart(2,"0");return t>0?`${t}:${n(r)}:${n(i)}`:`${n(r)}:${n(i)}`}function u(h,e,t){return Math.min(Math.max(h,e),t)}class j{constructor(e,t={}){o(this,"audio");o(this,"playlist",[]);o(this,"currentIndex",0);o(this,"loopMode","all");o(this,"shuffleMode",!1);o(this,"volumeLevel",.8);o(this,"previousVolume",.8);o(this,"callbacks",{});o(this,"handlePlay",()=>{const e=this.getCurrentTrack();e&&this.callbacks.onPlay&&this.callbacks.onPlay(e)});o(this,"handlePause",()=>{this.callbacks.onPause&&this.callbacks.onPause()});o(this,"handleTimeUpdate",()=>{if(this.audio.seeking)return;const e=this.audio.currentTime||0,t=this.getDuration();this.callbacks.onTimeUpdate&&this.callbacks.onTimeUpdate(e,t)});o(this,"handleSeeked",()=>{const e=this.audio.currentTime||0,t=this.getDuration();this.callbacks.onTimeUpdate&&this.callbacks.onTimeUpdate(e,t)});o(this,"handleProgress",()=>{if(this.audio.buffered.length>0&&this.audio.duration>0){const e=this.audio.buffered.end(this.audio.buffered.length-1),t=u(e/this.audio.duration*100,0,100);this.callbacks.onBufferUpdate&&this.callbacks.onBufferUpdate(t)}});o(this,"handleLoadedMetadata",()=>{const e=this.audio.currentTime||0,t=this.getDuration();this.callbacks.onTimeUpdate&&this.callbacks.onTimeUpdate(e,t),this.handleProgress()});o(this,"handleWaiting",()=>{this.callbacks.onLoadingChange&&this.callbacks.onLoadingChange(!0)});o(this,"handlePlaying",()=>{this.callbacks.onLoadingChange&&this.callbacks.onLoadingChange(!1)});o(this,"handleEnded",()=>{const e=this.getCurrentTrack();e&&this.callbacks.onEnded&&this.callbacks.onEnded(e),this.loopMode==="one"?(this.audio.currentTime=0,this.play()):this.next(!0)});o(this,"handleError",()=>{const e=this.audio.error||new Error("Unknown audio playback error");this.callbacks.onError&&this.callbacks.onError(e)});this.audio=new Audio,this.playlist=[...e.playlist||[]],this.currentIndex=e.initialIndex!==void 0?u(e.initialIndex,0,Math.max(0,this.playlist.length-1)):0,this.loopMode=e.loop||"all",this.shuffleMode=!!e.shuffle,this.volumeLevel=e.volume!==void 0?u(e.volume,0,1):.8,this.callbacks=t||{onPlay:e.onPlay,onPause:e.onPause,onTrackChange:e.onTrackChange,onPlaylistChange:e.onPlaylistChange,onTimeUpdate:e.onTimeUpdate,onEnded:e.onEnded,onError:e.onError},this.audio.volume=this.volumeLevel,this.attachEvents(),this.playlist.length>0&&this.loadTrack(this.currentIndex,!!e.autoplay)}attachEvents(){this.audio.addEventListener("play",this.handlePlay),this.audio.addEventListener("pause",this.handlePause),this.audio.addEventListener("timeupdate",this.handleTimeUpdate),this.audio.addEventListener("progress",this.handleProgress),this.audio.addEventListener("ended",this.handleEnded),this.audio.addEventListener("error",this.handleError),this.audio.addEventListener("waiting",this.handleWaiting),this.audio.addEventListener("playing",this.handlePlaying),this.audio.addEventListener("loadedmetadata",this.handleLoadedMetadata),this.audio.addEventListener("seeked",this.handleSeeked)}detachEvents(){this.audio.removeEventListener("play",this.handlePlay),this.audio.removeEventListener("pause",this.handlePause),this.audio.removeEventListener("timeupdate",this.handleTimeUpdate),this.audio.removeEventListener("progress",this.handleProgress),this.audio.removeEventListener("ended",this.handleEnded),this.audio.removeEventListener("error",this.handleError),this.audio.removeEventListener("waiting",this.handleWaiting),this.audio.removeEventListener("playing",this.handlePlaying),this.audio.removeEventListener("loadedmetadata",this.handleLoadedMetadata),this.audio.removeEventListener("seeked",this.handleSeeked)}getCurrentTrack(){return this.playlist[this.currentIndex]}getCurrentIndex(){return this.currentIndex}getPlaylist(){return this.playlist}setPlaylist(e,t=0){this.playlist=[...e],this.currentIndex=u(t,0,Math.max(0,this.playlist.length-1)),this.loadTrack(this.currentIndex,!1),this.callbacks.onPlaylistChange&&this.callbacks.onPlaylistChange([...this.playlist],this.currentIndex),this.playlist.length>0?this.loadTrack(this.currentIndex,!1):(this.audio.pause(),this.audio.src="",this.callbacks.onTrackChange&&this.callbacks.onTrackChange({title:"No Track Loaded",src:""},0))}addTrack(e,t=!1){const r=this.playlist.length===0;this.playlist.push(e);const i=this.playlist.length-1;return this.callbacks.onPlaylistChange&&this.callbacks.onPlaylistChange([...this.playlist],this.currentIndex),r?this.loadTrack(0,t):t&&this.loadTrack(i,!0),i}addTracks(e,t=!1){if(!e||e.length===0)return;const r=this.playlist.length===0,i=this.playlist.length;this.playlist.push(...e),this.callbacks.onPlaylistChange&&this.callbacks.onPlaylistChange([...this.playlist],this.currentIndex),r?this.loadTrack(0,t):t&&this.loadTrack(i,!0)}removeTrack(e){if(e<0||e>=this.playlist.length)return;const t=e===this.currentIndex;if(this.playlist.splice(e,1),this.playlist.length===0)this.currentIndex=0,this.audio.pause(),this.audio.src="",this.callbacks.onTrackChange&&this.callbacks.onTrackChange({title:"No Track Loaded",src:""},0);else if(t){const r=u(e,0,this.playlist.length-1);this.loadTrack(r,!1)}else e<this.currentIndex&&this.currentIndex--;this.callbacks.onPlaylistChange&&this.callbacks.onPlaylistChange([...this.playlist],this.currentIndex)}getDuration(){const e=this.audio.duration;if(e&&!isNaN(e)&&isFinite(e))return e;const t=this.getCurrentTrack();return(t==null?void 0:t.duration)||0}getCurrentTime(){return this.audio.currentTime||0}isPlaying(){return!this.audio.paused&&!this.audio.ended}isMuted(){return this.audio.muted||this.audio.volume===0}getVolume(){return this.audio.volume}getLoop(){return this.loopMode}isShuffle(){return this.shuffleMode}loadTrack(e,t=!1){let r;typeof e=="number"?r=u(e,0,Math.max(0,this.playlist.length-1)):(r=this.playlist.findIndex(n=>n.src===e.src),r===-1&&(this.playlist.push(e),r=this.playlist.length-1)),this.currentIndex=r;const i=this.playlist[this.currentIndex];i&&(this.audio.src=i.src,this.callbacks.onTrackChange&&this.callbacks.onTrackChange(i,this.currentIndex),t&&this.play())}async play(){try{await this.audio.play()}catch(e){console.warn("[HoregAudio] Autoplay / Audio play was prevented by browser policy:",e)}}pause(){this.audio.pause()}toggle(){this.audio.paused?this.play():this.pause()}seek(e){const t=this.getDuration(),r=u(e,0,t>0?t:1/0);this.audio.currentTime=r}setVolume(e){const t=u(e,0,1);this.volumeLevel=t,this.audio.volume=t,t>0&&(this.audio.muted=!1,this.previousVolume=t)}toggleMute(){return this.isMuted()?(this.audio.muted=!1,this.setVolume(this.previousVolume>0?this.previousVolume:.5),!1):(this.previousVolume=this.audio.volume,this.audio.muted=!0,!0)}next(e=!1){if(this.playlist.length===0)return;if(this.shuffleMode&&this.playlist.length>1){let r;do r=Math.floor(Math.random()*this.playlist.length);while(r===this.currentIndex);this.loadTrack(r,!0);return}const t=this.currentIndex+1;t<this.playlist.length?this.loadTrack(t,!0):this.loopMode==="all"?this.loadTrack(0,!0):e?this.pause():this.loadTrack(0,!0)}prev(){if(this.playlist.length===0)return;if(this.audio.currentTime>2){this.seek(0);return}if(this.shuffleMode&&this.playlist.length>1){let t;do t=Math.floor(Math.random()*this.playlist.length);while(t===this.currentIndex);this.loadTrack(t,!0);return}const e=this.currentIndex-1;e>=0?this.loadTrack(e,!0):this.loopMode==="all"?this.loadTrack(this.playlist.length-1,!0):this.seek(0)}setLoop(e){this.loopMode=e}setShuffle(e){this.shuffleMode=e}setCallbacks(e){this.callbacks={...this.callbacks,...e}}destroy(){this.detachEvents(),this.audio.pause(),this.audio.src="",this.audio.load()}}const c={play:'<svg viewBox="0 0 24 24" fill="currentColor" width="20" height="20"><path d="M8 5v14l11-7z"/></svg>',pause:'<svg viewBox="0 0 24 24" fill="currentColor" width="20" height="20"><path d="M6 19h4V5H6v14zm8-14v14h4V5h-4z"/></svg>',prev:'<svg viewBox="0 0 24 24" fill="currentColor" width="18" height="18"><path d="M6 6h2v12H6zm3.5 6l8.5 6V6z"/></svg>',next:'<svg viewBox="0 0 24 24" fill="currentColor" width="18" height="18"><path d="M6 18l8.5-6L6 6v12zM16 6v12h2V6h-2z"/></svg>',volumeHigh:'<svg viewBox="0 0 24 24" fill="currentColor" width="18" height="18"><path d="M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77s-2.99-7.86-7-8.77z"/></svg>',volumeMute:'<svg viewBox="0 0 24 24" fill="currentColor" width="18" height="18"><path d="M16.5 12c0-1.77-1.02-3.29-2.5-4.03v2.21l2.45 2.45c.03-.2.05-.41.05-.63zm2.5 0c0 .94-.2 1.82-.54 2.64l1.51 1.51C20.63 14.91 21 13.5 21 12c0-4.28-2.99-7.86-7-8.77v2.06c2.89.86 5 3.54 5 6.71zM4.27 3L3 4.27l4.73 4.73H3v6h4l5 5v-6.73l4.25 4.25c-.67.52-1.42.93-2.25 1.18v2.06c1.38-.31 2.63-.95 3.69-1.81L19.73 21 21 19.73l-9-9L4.27 3zM12 4L9.91 6.09 12 8.18V4z"/></svg>',shuffle:'<svg viewBox="0 0 24 24" fill="currentColor" width="16" height="16"><path d="M10.59 9.17L5.41 4 4 5.41l5.17 5.17 1.42-1.41zM14.5 4l2.04 2.04L4 18.59 5.41 20 17.96 7.46 20 9.5V4h-5.5zm.33 9.41l-1.41 1.41 3.13 3.13L14.5 20H20v-5.5l-2.04 2.04-3.13-3.13z"/></svg>',repeat:'<svg viewBox="0 0 24 24" fill="currentColor" width="16" height="16"><path d="M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4z"/></svg>',repeatOne:'<svg viewBox="0 0 24 24" fill="currentColor" width="16" height="16"><path d="M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4zm-4-2V9h-1l-2 1v1h1.5v4H13z"/></svg>',playlist:'<svg viewBox="0 0 24 24" fill="currentColor" width="18" height="18"><path d="M3 10h11v2H3zm0-4h11v2H3zm0 8h7v2H3zm13-1v8l6-4-6-4z"/></svg>',speaker:'<svg viewBox="0 0 24 24" fill="currentColor" width="14" height="14"><path d="M17 2H7c-1.1 0-2 .9-2 2v16c0 1.1.9 1.99 2 1.99L17 22c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-5 2c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2zm0 16c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z"/></svg>',plus:'<svg viewBox="0 0 24 24" fill="currentColor" width="14" height="14"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>',trash:'<svg viewBox="0 0 24 24" fill="currentColor" width="14" height="14"><path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"/></svg>',upload:'<svg viewBox="0 0 24 24" fill="currentColor" width="14" height="14"><path d="M9 16h6v-6h4l-7-7-7 7h4zm-4 2h14v2H5z"/></svg>',link:'<svg viewBox="0 0 24 24" fill="currentColor" width="14" height="14"><path d="M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z"/></svg>'};function s(h,e){const t=document.createElement(h);if(e!=null&&e.className&&(t.className=e.className),e!=null&&e.attributes)for(const[r,i]of Object.entries(e.attributes))t.setAttribute(r,i);return e!=null&&e.innerHTML?t.innerHTML=e.innerHTML:e!=null&&e.textContent&&(t.textContent=e.textContent),t}class q{constructor(e){o(this,"root");o(this,"eqContainer");o(this,"playBtn");o(this,"prevBtn");o(this,"nextBtn");o(this,"shuffleBtn");o(this,"loopBtn");o(this,"muteBtn");o(this,"drawerBtn");o(this,"titleEl");o(this,"artistEl");o(this,"albumEl");o(this,"coverImgEl",null);o(this,"coverContainer");o(this,"currentTimeEl");o(this,"durationEl");o(this,"sliderTrack");o(this,"fillBar");o(this,"bufferBar");o(this,"volumeSlider");o(this,"drawerEl");o(this,"drawerCountEl");o(this,"addTrackBtn");o(this,"addPanelEl");o(this,"fileInputEl");o(this,"tabBtnFile");o(this,"tabBtnUrl");o(this,"tabPaneFile");o(this,"tabPaneUrl");o(this,"urlInput");o(this,"titleInput");o(this,"artistInput");o(this,"submitUrlBtn");o(this,"cancelAddBtn");o(this,"dropzoneEl");o(this,"drawerInner");o(this,"isScrubbing",!1);o(this,"currentDuration",0);o(this,"events");o(this,"startScrubbing",e=>{e.preventDefault(),this.isScrubbing=!0,document.body.style.userSelect="none",this.handleScrubbingMove(e);const t=i=>{this.isScrubbing&&this.handleScrubbingMove(i)},r=i=>{this.isScrubbing&&(this.finishScrubbing(i),window.removeEventListener("mousemove",t),window.removeEventListener("mouseup",r),window.removeEventListener("touchmove",t),window.removeEventListener("touchend",r))};window.addEventListener("mousemove",t),window.addEventListener("mouseup",r),window.addEventListener("touchmove",t,{passive:!1}),window.addEventListener("touchend",r)});this.events=e,this.root=s("div",{className:"horeg-player-box"});const t=s("div",{className:"horeg-speaker-grill"});this.root.appendChild(t),["top-left","top-right","bottom-left","bottom-right"].forEach(P=>{this.root.appendChild(s("div",{className:`horeg-bolt ${P}`}))});const r=s("div",{className:"horeg-content-wrap"});this.root.appendChild(r);const i=s("div",{className:"horeg-header"}),n=s("div",{className:"horeg-rig-badge",innerHTML:'<span class="horeg-badge-led"></span> HOREG RIG • HIGH VOLTAGE'});i.appendChild(n),r.appendChild(i);const a=s("div",{className:"horeg-track-row"});this.coverContainer=s("div",{className:"horeg-cover-container"}),this.coverContainer.innerHTML=`<span class="horeg-cover-fallback">${c.speaker}</span>`,a.appendChild(this.coverContainer);const l=s("div",{className:"horeg-track-info"});this.titleEl=s("div",{className:"horeg-track-title",textContent:"No Track Loaded"}),this.artistEl=s("div",{className:"horeg-track-artist",textContent:"Unknown Artist"}),this.albumEl=s("div",{className:"horeg-track-album",textContent:""}),l.appendChild(this.titleEl),l.appendChild(this.artistEl),l.appendChild(this.albumEl),a.appendChild(l),this.eqContainer=s("div",{className:"horeg-eq-wrapper"}),a.appendChild(this.eqContainer),r.appendChild(a);const d=s("div",{className:"horeg-progress-container"}),p=s("div",{className:"horeg-time-row"});this.currentTimeEl=s("span",{textContent:"00:00"}),this.durationEl=s("span",{textContent:"00:00"}),p.appendChild(this.currentTimeEl),p.appendChild(this.durationEl),d.appendChild(p),this.sliderTrack=s("div",{className:"horeg-slider-track",attributes:{role:"slider","aria-label":"Seek progress","aria-valuemin":"0","aria-valuemax":"100","aria-valuenow":"0",tabindex:"0"}}),this.bufferBar=s("div",{className:"horeg-buffer-bar"}),this.fillBar=s("div",{className:"horeg-fill-bar"}),this.sliderTrack.appendChild(this.bufferBar),this.sliderTrack.appendChild(this.fillBar),d.appendChild(this.sliderTrack),r.appendChild(d);const g=s("div",{className:"horeg-controls-row"}),f=s("div",{className:"horeg-side-controls"});this.shuffleBtn=s("button",{className:"horeg-btn",attributes:{"aria-label":"Toggle shuffle",type:"button"},innerHTML:c.shuffle}),this.loopBtn=s("button",{className:"horeg-btn active",attributes:{"aria-label":"Toggle loop mode",type:"button"},innerHTML:c.repeat}),f.appendChild(this.shuffleBtn),f.appendChild(this.loopBtn),g.appendChild(f);const b=s("div",{className:"horeg-center-controls"});this.prevBtn=s("button",{className:"horeg-btn",attributes:{"aria-label":"Previous track",type:"button"},innerHTML:c.prev}),this.playBtn=s("button",{className:"horeg-btn horeg-btn-play",attributes:{"aria-label":"Play track",type:"button"},innerHTML:c.play}),this.nextBtn=s("button",{className:"horeg-btn",attributes:{"aria-label":"Next track",type:"button"},innerHTML:c.next}),b.appendChild(this.prevBtn),b.appendChild(this.playBtn),b.appendChild(this.nextBtn),g.appendChild(b);const x=s("div",{className:"horeg-side-controls"}),w=s("div",{className:"horeg-volume-wrap"});this.muteBtn=s("button",{className:"horeg-btn",attributes:{"aria-label":"Toggle mute",type:"button"},innerHTML:c.volumeHigh}),this.volumeSlider=s("input",{className:"horeg-volume-slider",attributes:{type:"range",min:"0",max:"1",step:"0.01",value:"0.8","aria-label":"Volume control"}}),w.appendChild(this.muteBtn),w.appendChild(this.volumeSlider),x.appendChild(w),this.drawerBtn=s("button",{className:"horeg-btn",attributes:{"aria-label":"Toggle playlist drawer",type:"button"},innerHTML:c.playlist}),x.appendChild(this.drawerBtn),g.appendChild(x),r.appendChild(g),this.drawerEl=s("div",{className:"horeg-drawer"});const y=s("div",{className:"horeg-drawer-header"}),k=s("div",{className:"horeg-drawer-heading"});k.innerHTML="<span>PLAYLIST</span>",this.drawerCountEl=s("span",{className:"horeg-drawer-count",textContent:"0"}),k.appendChild(this.drawerCountEl),y.appendChild(k),this.addTrackBtn=s("button",{className:"horeg-btn-add-track",attributes:{type:"button","aria-label":"Add track to playlist"},innerHTML:`${c.plus} <span>Add Track</span>`}),y.appendChild(this.addTrackBtn),this.drawerEl.appendChild(y),this.addPanelEl=s("div",{className:"horeg-add-panel"});const E=s("div",{className:"horeg-add-tabs"});this.tabBtnFile=s("button",{className:"horeg-tab-btn active",attributes:{type:"button"},innerHTML:`${c.upload} <span>File Lokal</span>`}),this.tabBtnUrl=s("button",{className:"horeg-tab-btn",attributes:{type:"button"},innerHTML:`${c.link} <span>Audio URL</span>`}),E.appendChild(this.tabBtnFile),E.appendChild(this.tabBtnUrl),this.addPanelEl.appendChild(E),this.tabPaneFile=s("div",{className:"horeg-tab-pane active"}),this.fileInputEl=s("input",{attributes:{type:"file",accept:"audio/*",multiple:"true",style:"display: none;"}}),this.dropzoneEl=s("div",{className:"horeg-dropzone"}),this.dropzoneEl.innerHTML=`
+
+    /* Responsive Layout (<= 360px): Single Center Soundbox & Wrapped Controls */
+    @container horeg-box (max-width: 360px) {
+      .horeg-content-wrap {
+        padding: 14px 14px 12px 14px;
+        gap: 10px;
+      }
+
+      /* 1. Visualizer: Hide Satellite Soundboxes, Center Subwoofer Dominates */
+      .horeg-soundbox.is-satellite {
+        display: none !important;
+      }
+
+      .horeg-soundbox-stage {
+        padding: 10px 12px;
+        gap: 0;
+      }
+
+      /* 2. Controls Row: Wrap into 2 Rows */
+      .horeg-controls-row {
+        flex-wrap: wrap;
+        gap: 10px 0;
+        justify-content: space-between;
+      }
+
+      /* Row 1: Center Controls (Prev, Play, Next) centered on top */
+      .horeg-center-controls {
+        order: 1;
+        width: 100%;
+        justify-content: center;
+        gap: 16px;
+        margin-bottom: 2px;
+      }
+
+      /* Row 2: Left Tools (Shuffle, Loop) & Right Tools (Volume, Playlist) with space-between */
+      .horeg-side-controls:first-child {
+        order: 2;
+      }
+
+      .horeg-side-controls:last-child {
+        order: 3;
+      }
+    }
+
+    /* Viewport Media Query fallback */
+    @media (max-width: 360px) {
+      .horeg-soundbox.is-satellite {
+        display: none !important;
+      }
+      .horeg-soundbox-stage {
+        padding: 10px 12px;
+        gap: 0;
+      }
+      .horeg-controls-row {
+        flex-wrap: wrap;
+        gap: 10px 0;
+        justify-content: space-between;
+      }
+      .horeg-center-controls {
+        order: 1;
+        width: 100%;
+        justify-content: center;
+        gap: 16px;
+        margin-bottom: 2px;
+      }
+      .horeg-side-controls:first-child {
+        order: 2;
+      }
+      .horeg-side-controls:last-child {
+        order: 3;
+      }
+    }
+  `}function T(d){if(isNaN(d)||!isFinite(d)||d<0)return"00:00";const e=Math.floor(d),r=Math.floor(e/3600),t=Math.floor(e%3600/60),s=e%60,o=a=>a.toString().padStart(2,"0");return r>0?`${r}:${o(t)}:${o(s)}`:`${o(t)}:${o(s)}`}function v(d,e,r){return Math.min(Math.max(d,e),r)}class O{constructor(e,r={}){i(this,"audio");i(this,"playlist",[]);i(this,"currentIndex",0);i(this,"loopMode","all");i(this,"shuffleMode",!1);i(this,"volumeLevel",.8);i(this,"previousVolume",.8);i(this,"callbacks",{});i(this,"audioContext",null);i(this,"analyser",null);i(this,"sourceNode",null);i(this,"freqData",null);i(this,"webAudioInitialized",!1);i(this,"bassRollingAvg",.2);i(this,"bassPulseEnvelope",0);i(this,"handlePlay",()=>{const e=this.getCurrentTrack();e&&this.callbacks.onPlay&&this.callbacks.onPlay(e)});i(this,"handlePause",()=>{this.callbacks.onPause&&this.callbacks.onPause()});i(this,"handleTimeUpdate",()=>{if(this.audio.seeking)return;const e=this.audio.currentTime||0,r=this.getDuration();this.callbacks.onTimeUpdate&&this.callbacks.onTimeUpdate(e,r)});i(this,"handleSeeked",()=>{const e=this.audio.currentTime||0,r=this.getDuration();this.callbacks.onTimeUpdate&&this.callbacks.onTimeUpdate(e,r)});i(this,"handleProgress",()=>{if(this.audio.buffered.length>0&&this.audio.duration>0){const e=this.audio.buffered.end(this.audio.buffered.length-1),r=this.audio.duration,t=v(e/r*100,0,100);this.callbacks.onBufferUpdate&&this.callbacks.onBufferUpdate(t)}});i(this,"handleWaiting",()=>{this.callbacks.onLoadingChange&&this.callbacks.onLoadingChange(!0)});i(this,"handlePlaying",()=>{this.callbacks.onLoadingChange&&this.callbacks.onLoadingChange(!1)});i(this,"handleLoadedMetadata",()=>{const e=this.getDuration();this.callbacks.onTimeUpdate&&this.callbacks.onTimeUpdate(this.audio.currentTime||0,e)});i(this,"handleEnded",()=>{const e=this.getCurrentTrack();e&&this.callbacks.onEnded&&this.callbacks.onEnded(e),this.loopMode==="one"?(this.audio.currentTime=0,this.play()):this.next(!0)});i(this,"handleError",()=>{const e=this.audio.error||new Error("Unknown audio playback error");this.callbacks.onError&&this.callbacks.onError(e)});this.audio=new Audio,this.audio.crossOrigin="anonymous",this.playlist=[...e.playlist||[]],this.currentIndex=e.initialIndex!==void 0?v(e.initialIndex,0,Math.max(0,this.playlist.length-1)):0,this.loopMode=e.loop||"all",this.shuffleMode=!!e.shuffle,this.volumeLevel=e.volume!==void 0?v(e.volume,0,1):.8,this.callbacks=r||{onPlay:e.onPlay,onPause:e.onPause,onTrackChange:e.onTrackChange,onPlaylistChange:e.onPlaylistChange,onTimeUpdate:e.onTimeUpdate,onEnded:e.onEnded,onError:e.onError},this.audio.volume=this.volumeLevel,this.attachEvents(),this.playlist.length>0&&this.loadTrack(this.currentIndex,!!e.autoplay)}attachEvents(){this.audio.addEventListener("play",this.handlePlay),this.audio.addEventListener("pause",this.handlePause),this.audio.addEventListener("timeupdate",this.handleTimeUpdate),this.audio.addEventListener("progress",this.handleProgress),this.audio.addEventListener("ended",this.handleEnded),this.audio.addEventListener("error",this.handleError),this.audio.addEventListener("waiting",this.handleWaiting),this.audio.addEventListener("playing",this.handlePlaying),this.audio.addEventListener("loadedmetadata",this.handleLoadedMetadata),this.audio.addEventListener("seeked",this.handleSeeked)}detachEvents(){this.audio.removeEventListener("play",this.handlePlay),this.audio.removeEventListener("pause",this.handlePause),this.audio.removeEventListener("timeupdate",this.handleTimeUpdate),this.audio.removeEventListener("progress",this.handleProgress),this.audio.removeEventListener("ended",this.handleEnded),this.audio.removeEventListener("error",this.handleError),this.audio.removeEventListener("waiting",this.handleWaiting),this.audio.removeEventListener("playing",this.handlePlaying),this.audio.removeEventListener("loadedmetadata",this.handleLoadedMetadata),this.audio.removeEventListener("seeked",this.handleSeeked)}getCurrentTrack(){return this.playlist[this.currentIndex]}getCurrentIndex(){return this.currentIndex}getPlaylist(){return this.playlist}setPlaylist(e,r=0){this.playlist=[...e],this.currentIndex=v(r,0,Math.max(0,this.playlist.length-1)),this.loadTrack(this.currentIndex,!1),this.callbacks.onPlaylistChange&&this.callbacks.onPlaylistChange([...this.playlist],this.currentIndex),this.playlist.length>0?this.loadTrack(this.currentIndex,!1):(this.audio.pause(),this.audio.src="",this.callbacks.onTrackChange&&this.callbacks.onTrackChange({title:"No Track Loaded",src:""},0))}addTrack(e,r=!1){const t=this.playlist.length===0;this.playlist.push(e);const s=this.playlist.length-1;return this.callbacks.onPlaylistChange&&this.callbacks.onPlaylistChange([...this.playlist],this.currentIndex),t?this.loadTrack(0,r):r&&this.loadTrack(s,!0),s}addTracks(e,r=!1){if(!e||e.length===0)return;const t=this.playlist.length===0,s=this.playlist.length;this.playlist.push(...e),this.callbacks.onPlaylistChange&&this.callbacks.onPlaylistChange([...this.playlist],this.currentIndex),t?this.loadTrack(0,r):r&&this.loadTrack(s,!0)}removeTrack(e){if(e<0||e>=this.playlist.length)return;const r=e===this.currentIndex;if(this.playlist.splice(e,1),this.playlist.length===0)this.currentIndex=0,this.audio.pause(),this.audio.src="",this.callbacks.onTrackChange&&this.callbacks.onTrackChange({title:"No Track Loaded",src:""},0);else if(r){const t=v(e,0,this.playlist.length-1);this.loadTrack(t,!1)}else e<this.currentIndex&&this.currentIndex--;this.callbacks.onPlaylistChange&&this.callbacks.onPlaylistChange([...this.playlist],this.currentIndex)}getDuration(){const e=this.audio.duration;if(e&&!isNaN(e)&&isFinite(e))return e;const r=this.getCurrentTrack();return(r==null?void 0:r.duration)||0}getCurrentTime(){return this.audio.currentTime||0}isPlaying(){return!this.audio.paused&&!this.audio.ended}isMuted(){return this.audio.muted||this.audio.volume===0}getVolume(){return this.audio.volume}getLoop(){return this.loopMode}isShuffle(){return this.shuffleMode}loadTrack(e,r=!1){let t;typeof e=="number"?t=v(e,0,Math.max(0,this.playlist.length-1)):(t=this.playlist.findIndex(o=>o.src===e.src),t===-1&&(this.playlist.push(e),t=this.playlist.length-1)),this.currentIndex=t;const s=this.playlist[this.currentIndex];s&&(this.audio.src=s.src,this.callbacks.onTrackChange&&this.callbacks.onTrackChange(s,this.currentIndex),r&&this.play())}async play(){this.initWebAudio();try{await this.audio.play()}catch(e){console.warn("[HoregAudio] Autoplay / Audio play was prevented by browser policy:",e)}}initWebAudio(){if(this.webAudioInitialized){this.audioContext&&this.audioContext.state==="suspended"&&this.audioContext.resume().catch(()=>{});return}try{const e=window.AudioContext||window.webkitAudioContext;if(!e)return;this.audioContext=new e,this.analyser=this.audioContext.createAnalyser(),this.analyser.fftSize=128,this.analyser.smoothingTimeConstant=.65,this.sourceNode=this.audioContext.createMediaElementSource(this.audio),this.sourceNode.connect(this.analyser),this.analyser.connect(this.audioContext.destination),this.freqData=new Uint8Array(this.analyser.frequencyBinCount),this.webAudioInitialized=!0}catch{this.webAudioInitialized=!0}}getAudioEnergy(){if(!this.isPlaying())return{bass:0,midHigh:0,left:0,right:0};const e=this.isMuted()?0:Math.max(.35,Math.sqrt(this.volumeLevel));if(this.analyser&&this.freqData&&this.audioContext&&this.audioContext.state==="running")try{this.analyser.getByteFrequencyData(this.freqData);let r=0;const t=Math.min(4,this.freqData.length);for(let x=0;x<t;x++)r+=this.freqData[x];let s=0;const o=Math.min(16,this.freqData.length);for(let x=t;x<o;x++)s+=this.freqData[x];const a=r/(t*255),l=s/((o-t)*255);if(a<.025&&l<.025)return this.bassPulseEnvelope*=.5,this.bassPulseEnvelope<.01&&(this.bassPulseEnvelope=0),{bass:0,midHigh:0,left:0,right:0};const h=Math.max(a,l*.7),p=a*.75;this.bassRollingAvg=this.bassRollingAvg*.92+a*.08;const g=Math.max(0,a-this.bassRollingAvg),b=g>.006?Math.min(1,g*4.5+.3+a*.35):0,u=this.audio.currentTime>0?this.audio.currentTime:Date.now()/1e3,f=(Math.sin(u*13)*.5+.5)*.08*Math.min(1,h*2.5),m=.09*Math.min(1,h*3)+f,y=Math.max(b,p,m);this.bassPulseEnvelope=Math.max(y,this.bassPulseEnvelope*.82);const w=Math.min(1,this.bassPulseEnvelope)*e,k=Math.min(1,l*1.3)*e;return{bass:w,midHigh:k,left:k*.9,right:k*.95}}catch{}if(!this.analyser||!this.audioContext||this.audioContext.state!=="running"){const r=this.audio.currentTime>0?this.audio.currentTime:Date.now()/1e3,s=60/130,o=r%s/s,a=Math.pow(Math.max(0,1-o*2.2),3.2),l=v(Math.max(.12,a),0,1)*e,h=v(Math.sin(r*8)*.25+.35+a*.25,0,1)*e;return{bass:l,midHigh:h,left:h*.85,right:h*.9}}return{bass:0,midHigh:0,left:0,right:0}}pause(){this.audio.pause()}toggle(){this.audio.paused?this.play():this.pause()}seek(e){const r=this.getDuration();this.audio.currentTime=v(e,0,r||0)}setVolume(e){this.volumeLevel=v(e,0,1),this.audio.volume=this.volumeLevel,this.volumeLevel>0&&(this.audio.muted=!1)}toggleMute(){return this.isMuted()?(this.audio.muted=!1,this.audio.volume=this.previousVolume||.8,this.volumeLevel=this.previousVolume||.8,!1):(this.previousVolume=this.volumeLevel,this.audio.muted=!0,!0)}next(e=!1){if(this.playlist.length===0)return;if(this.loopMode==="one"){this.seek(0),this.play();return}if(this.shuffleMode&&this.playlist.length>1){let t;do t=Math.floor(Math.random()*this.playlist.length);while(t===this.currentIndex);this.loadTrack(t,!0);return}const r=this.currentIndex+1;r<this.playlist.length?this.loadTrack(r,!0):this.loopMode==="all"?this.loadTrack(0,!0):e?this.pause():this.loadTrack(0,!0)}prev(){if(this.playlist.length===0)return;if(this.audio.currentTime>3){this.seek(0);return}if(this.loopMode==="one"){this.seek(0),this.play();return}if(this.shuffleMode&&this.playlist.length>1){let r;do r=Math.floor(Math.random()*this.playlist.length);while(r===this.currentIndex);this.loadTrack(r,!0);return}const e=this.currentIndex-1;e>=0?this.loadTrack(e,!0):this.loopMode==="all"?this.loadTrack(this.playlist.length-1,!0):this.seek(0)}setLoop(e){this.loopMode=e}setShuffle(e){this.shuffleMode=e}setCallbacks(e){this.callbacks={...this.callbacks,...e}}destroy(){this.detachEvents(),this.audio.pause(),this.audio.src="",this.audio.load(),this.audioContext&&this.audioContext.state!=="closed"&&this.audioContext.close().catch(()=>{})}}const c={play:'<svg viewBox="0 0 24 24" fill="currentColor" width="20" height="20"><path d="M8 5v14l11-7z"/></svg>',pause:'<svg viewBox="0 0 24 24" fill="currentColor" width="20" height="20"><path d="M6 19h4V5H6v14zm8-14v14h4V5h-4z"/></svg>',prev:'<svg viewBox="0 0 24 24" fill="currentColor" width="18" height="18"><path d="M6 6h2v12H6zm3.5 6l8.5 6V6z"/></svg>',next:'<svg viewBox="0 0 24 24" fill="currentColor" width="18" height="18"><path d="M6 18l8.5-6L6 6v12zM16 6v12h2V6h-2z"/></svg>',volumeHigh:'<svg viewBox="0 0 24 24" fill="currentColor" width="18" height="18"><path d="M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77s-2.99-7.86-7-8.77z"/></svg>',volumeMedium:'<svg viewBox="0 0 24 24" fill="currentColor" width="18" height="18"><path d="M18.5 12c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM5 9v6h4l5 5V4L9 9H5z"/></svg>',volumeLow:'<svg viewBox="0 0 24 24" fill="currentColor" width="18" height="18"><path d="M7 9v6h4l5 5V4L11 9H7z"/></svg>',volumeMute:'<svg viewBox="0 0 24 24" fill="currentColor" width="18" height="18"><path d="M16.5 12c0-1.77-1.02-3.29-2.5-4.03v2.21l2.45 2.45c.03-.2.05-.41.05-.63zm2.5 0c0 .94-.2 1.82-.54 2.64l1.51 1.51C20.63 14.91 21 13.5 21 12c0-4.28-2.99-7.86-7-8.77v2.06c2.89.86 5 3.54 5 6.71zM4.27 3L3 4.27l4.73 4.73H3v6h4l5 5v-6.73l4.25 4.25c-.67.52-1.42.93-2.25 1.18v2.06c1.38-.31 2.63-.95 3.69-1.81L19.73 21 21 19.73l-9-9L4.27 3zM12 4L9.91 6.09 12 8.18V4z"/></svg>',shuffle:'<svg viewBox="0 0 24 24" fill="currentColor" width="16" height="16"><path d="M10.59 9.17L5.41 4 4 5.41l5.17 5.17 1.42-1.41zM14.5 4l2.04 2.04L4 18.59 5.41 20 17.96 7.46 20 9.5V4h-5.5zm.33 9.41l-1.41 1.41 3.13 3.13L14.5 20H20v-5.5l-2.04 2.04-3.13-3.13z"/></svg>',repeat:'<svg viewBox="0 0 24 24" fill="currentColor" width="16" height="16"><path d="M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4z"/></svg>',repeatOne:'<svg viewBox="0 0 24 24" fill="currentColor" width="16" height="16"><path d="M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4zm-4-2V9h-1l-2 1v1h1.5v4H13z"/></svg>',playlist:'<svg viewBox="0 0 24 24" fill="currentColor" width="18" height="18"><path d="M3 10h11v2H3zm0-4h11v2H3zm0 8h7v2H3zm13-1v8l6-4-6-4z"/></svg>',speaker:'<svg viewBox="0 0 24 24" fill="currentColor" width="32" height="32"><path d="M17 2H7c-1.1 0-2 .9-2 2v16c0 1.1.9 1.99 2 1.99L17 22c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-5 2c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2zm0 16c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z"/></svg>',plus:'<svg viewBox="0 0 24 24" fill="currentColor" width="14" height="14"><path d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>',trash:'<svg viewBox="0 0 24 24" fill="currentColor" width="14" height="14"><path d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"/></svg>',upload:'<svg viewBox="0 0 24 24" fill="currentColor" width="14" height="14"><path d="M9 16h6v-6h4l-7-7-7 7h4zm-4 2h14v2H5z"/></svg>',link:'<svg viewBox="0 0 24 24" fill="currentColor" width="14" height="14"><path d="M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z"/></svg>'};function n(d,e){const r=document.createElement(d);if(e!=null&&e.className&&(r.className=e.className),e!=null&&e.attributes)for(const[t,s]of Object.entries(e.attributes))r.setAttribute(t,s);return e!=null&&e.innerHTML?r.innerHTML=e.innerHTML:e!=null&&e.textContent&&(r.textContent=e.textContent),r}class X{constructor(e){i(this,"root");i(this,"stageContainer");i(this,"eqContainer");i(this,"coverContainer");i(this,"titleWrap");i(this,"playBtn");i(this,"prevBtn");i(this,"nextBtn");i(this,"shuffleBtn");i(this,"loopBtn");i(this,"muteBtn");i(this,"drawerBtn");i(this,"titleEl");i(this,"artistEl");i(this,"albumEl");i(this,"coverImgEl",null);i(this,"currentTimeEl");i(this,"durationEl");i(this,"sliderTrack");i(this,"fillBar");i(this,"bufferBar");i(this,"volumeSlider");i(this,"volumeWrap");i(this,"volumeDropup");i(this,"volumePercentEl");i(this,"drawerEl");i(this,"drawerCountEl");i(this,"addTrackBtn");i(this,"addPanelEl");i(this,"fileInputEl");i(this,"tabBtnFile");i(this,"tabBtnUrl");i(this,"tabPaneFile");i(this,"tabPaneUrl");i(this,"urlInput");i(this,"titleInput");i(this,"artistInput");i(this,"submitUrlBtn");i(this,"cancelAddBtn");i(this,"dropzoneEl");i(this,"drawerInner");i(this,"isScrubbing",!1);i(this,"currentDuration",0);i(this,"events");i(this,"startScrubbing",e=>{e.preventDefault(),this.isScrubbing=!0,document.body.style.userSelect="none",this.handleScrubbingMove(e);const r=s=>{this.isScrubbing&&this.handleScrubbingMove(s)},t=s=>{this.isScrubbing&&(this.finishScrubbing(s),window.removeEventListener("mousemove",r),window.removeEventListener("mouseup",t),window.removeEventListener("touchmove",r),window.removeEventListener("touchend",t))};window.addEventListener("mousemove",r),window.addEventListener("mouseup",t),window.addEventListener("touchmove",r,{passive:!1}),window.addEventListener("touchend",t)});this.events=e,this.root=n("div",{className:"horeg-player-box"});const r=n("div",{className:"horeg-speaker-grill"});this.root.appendChild(r),["top-left","top-right","bottom-left","bottom-right"].forEach(k=>{this.root.appendChild(n("div",{className:`horeg-bolt ${k}`}))});const t=n("div",{className:"horeg-content-wrap"});this.root.appendChild(t);const s=n("div",{className:"horeg-header"}),o=n("div",{className:"horeg-rig-badge",innerHTML:'<span class="horeg-badge-led"></span> SOUND HOREG • HIGH VOLTAGE'});s.appendChild(o),t.appendChild(s),this.stageContainer=n("div",{className:"horeg-soundbox-stage"}),this.eqContainer=this.stageContainer,this.coverContainer=n("div",{className:"horeg-sub-cover-wrap"}),this.coverContainer.innerHTML=`<span class="horeg-cover-fallback">${c.speaker}</span>`;const a=n("div",{className:"horeg-track-meta"});this.titleWrap=n("div",{className:"horeg-title-wrap"}),this.titleEl=n("div",{className:"horeg-track-title",textContent:"No Track Loaded"}),this.titleWrap.appendChild(this.titleEl),this.artistEl=n("div",{className:"horeg-track-artist",textContent:"Unknown Artist"}),this.albumEl=n("div",{className:"horeg-track-album",textContent:""}),a.appendChild(this.titleWrap),a.appendChild(this.artistEl),a.appendChild(this.albumEl),t.appendChild(this.stageContainer),t.appendChild(a);const l=n("div",{className:"horeg-progress-container"}),h=n("div",{className:"horeg-time-row"});this.currentTimeEl=n("span",{textContent:"00:00"}),this.durationEl=n("span",{textContent:"00:00"}),h.appendChild(this.currentTimeEl),h.appendChild(this.durationEl),l.appendChild(h),this.sliderTrack=n("div",{className:"horeg-slider-track",attributes:{role:"slider","aria-label":"Seek progress","aria-valuemin":"0","aria-valuemax":"100","aria-valuenow":"0",tabindex:"0"}}),this.bufferBar=n("div",{className:"horeg-buffer-bar"}),this.fillBar=n("div",{className:"horeg-fill-bar"}),this.sliderTrack.appendChild(this.bufferBar),this.sliderTrack.appendChild(this.fillBar),l.appendChild(this.sliderTrack),t.appendChild(l);const p=n("div",{className:"horeg-controls-row"}),g=n("div",{className:"horeg-side-controls"});this.shuffleBtn=n("button",{className:"horeg-btn",attributes:{"aria-label":"Toggle shuffle","data-tooltip":"Shuffle (S)",type:"button"},innerHTML:c.shuffle}),this.loopBtn=n("button",{className:"horeg-btn active",attributes:{"aria-label":"Toggle loop mode","data-tooltip":"Repeat All (L)",type:"button"},innerHTML:c.repeat}),g.appendChild(this.shuffleBtn),g.appendChild(this.loopBtn),p.appendChild(g);const b=n("div",{className:"horeg-center-controls"});this.prevBtn=n("button",{className:"horeg-btn",attributes:{"aria-label":"Previous track","data-tooltip":"Previous (K)",type:"button"},innerHTML:c.prev}),this.playBtn=n("button",{className:"horeg-btn horeg-btn-play",attributes:{"aria-label":"Play track","data-tooltip":"Play (Space)",type:"button"},innerHTML:c.play}),this.nextBtn=n("button",{className:"horeg-btn",attributes:{"aria-label":"Next track","data-tooltip":"Next (J)",type:"button"},innerHTML:c.next}),b.appendChild(this.prevBtn),b.appendChild(this.playBtn),b.appendChild(this.nextBtn),p.appendChild(b);const u=n("div",{className:"horeg-side-controls"});this.volumeWrap=n("div",{className:"horeg-volume-wrap"}),this.muteBtn=n("button",{className:"horeg-btn",attributes:{"aria-label":"Toggle mute","data-tooltip":"Volume 80% (M)",type:"button"},innerHTML:c.volumeHigh}),this.volumeDropup=n("div",{className:"horeg-volume-dropup"}),this.volumePercentEl=n("span",{className:"horeg-volume-percent",textContent:"80%"}),this.volumeSlider=n("input",{className:"horeg-volume-slider-vertical",attributes:{type:"range",min:"0",max:"1",step:"0.01",value:"0.8",orient:"vertical","aria-label":"Volume control"}}),this.volumeDropup.appendChild(this.volumePercentEl),this.volumeDropup.appendChild(this.volumeSlider),this.volumeWrap.appendChild(this.muteBtn),this.volumeWrap.appendChild(this.volumeDropup),u.appendChild(this.volumeWrap),this.drawerBtn=n("button",{className:"horeg-btn",attributes:{"aria-label":"Toggle playlist drawer","data-tooltip":"Playlist",type:"button"},innerHTML:c.playlist}),u.appendChild(this.drawerBtn),p.appendChild(u),t.appendChild(p),this.drawerEl=n("div",{className:"horeg-drawer"});const f=n("div",{className:"horeg-drawer-header"}),m=n("div",{className:"horeg-drawer-heading"});m.innerHTML="<span>PLAYLIST</span>",this.drawerCountEl=n("span",{className:"horeg-drawer-count",textContent:"0"}),m.appendChild(this.drawerCountEl),f.appendChild(m),this.addTrackBtn=n("button",{className:"horeg-btn-add-track",attributes:{type:"button","aria-label":"Add track to playlist","data-tooltip":"Add Track"},innerHTML:`${c.plus} <span>Add Track</span>`}),f.appendChild(this.addTrackBtn),this.drawerEl.appendChild(f),this.addPanelEl=n("div",{className:"horeg-add-panel"});const y=n("div",{className:"horeg-add-tabs"});this.tabBtnFile=n("button",{className:"horeg-tab-btn active",attributes:{type:"button"},innerHTML:`${c.upload} <span>Local File</span>`}),this.tabBtnUrl=n("button",{className:"horeg-tab-btn",attributes:{type:"button"},innerHTML:`${c.link} <span>Audio URL</span>`}),y.appendChild(this.tabBtnFile),y.appendChild(this.tabBtnUrl),this.addPanelEl.appendChild(y),this.tabPaneFile=n("div",{className:"horeg-tab-pane active"}),this.fileInputEl=n("input",{attributes:{type:"file",accept:"audio/*",multiple:"true",style:"display: none;"}}),this.dropzoneEl=n("div",{className:"horeg-dropzone"}),this.dropzoneEl.innerHTML=`
       <div class="horeg-dropzone-icon">${c.upload}</div>
-      <div class="horeg-dropzone-text">Pilih File Audio Komputer</div>
-      <div class="horeg-dropzone-hint">Klik di sini atau drag & drop file (.mp3, .wav, .flac, .ogg, .m4a)</div>
-    `,this.tabPaneFile.appendChild(this.fileInputEl),this.tabPaneFile.appendChild(this.dropzoneEl),this.addPanelEl.appendChild(this.tabPaneFile),this.tabPaneUrl=s("div",{className:"horeg-tab-pane"}),this.urlInput=s("input",{className:"horeg-input-field",attributes:{type:"url",placeholder:"Audio URL (https://...mp3/wav)",required:"true"}}),this.titleInput=s("input",{className:"horeg-input-field",attributes:{type:"text",placeholder:"Judul Lagu (Opsional)"}}),this.artistInput=s("input",{className:"horeg-input-field",attributes:{type:"text",placeholder:"Nama Artis (Opsional)"}});const C=s("div",{className:"horeg-form-actions"});this.cancelAddBtn=s("button",{className:"horeg-btn-cancel",attributes:{type:"button"},textContent:"Batal"}),this.submitUrlBtn=s("button",{className:"horeg-btn-submit",attributes:{type:"button"},innerHTML:`${c.plus} Tambah`}),C.appendChild(this.cancelAddBtn),C.appendChild(this.submitUrlBtn),this.tabPaneUrl.appendChild(this.urlInput),this.tabPaneUrl.appendChild(this.titleInput),this.tabPaneUrl.appendChild(this.artistInput),this.tabPaneUrl.appendChild(C),this.addPanelEl.appendChild(this.tabPaneUrl),this.drawerEl.appendChild(this.addPanelEl),this.drawerInner=s("div",{className:"horeg-drawer-inner"}),this.drawerEl.appendChild(this.drawerInner),this.root.appendChild(this.drawerEl),this.bindDOMEvents()}bindDOMEvents(){this.playBtn.addEventListener("click",()=>this.events.onPlayPauseClick()),this.prevBtn.addEventListener("click",()=>this.events.onPrevClick()),this.nextBtn.addEventListener("click",()=>this.events.onNextClick()),this.shuffleBtn.addEventListener("click",()=>this.events.onShuffleToggle()),this.loopBtn.addEventListener("click",()=>this.events.onLoopToggle()),this.muteBtn.addEventListener("click",()=>this.events.onMuteToggle()),this.volumeSlider.addEventListener("input",()=>{this.events.onVolumeChange(parseFloat(this.volumeSlider.value))}),this.drawerBtn.addEventListener("click",()=>{this.toggleDrawer()}),this.addTrackBtn.addEventListener("click",()=>{const r=this.addPanelEl.classList.toggle("open");this.addTrackBtn.classList.toggle("active",r),r&&this.toggleDrawer(!0)}),this.tabBtnFile.addEventListener("click",()=>{this.tabBtnFile.classList.add("active"),this.tabBtnUrl.classList.remove("active"),this.tabPaneFile.classList.add("active"),this.tabPaneUrl.classList.remove("active")}),this.tabBtnUrl.addEventListener("click",()=>{this.tabBtnUrl.classList.add("active"),this.tabBtnFile.classList.remove("active"),this.tabPaneUrl.classList.add("active"),this.tabPaneFile.classList.remove("active"),this.urlInput.focus()}),this.dropzoneEl.addEventListener("click",()=>{this.fileInputEl.click()}),this.fileInputEl.addEventListener("change",()=>{if(this.fileInputEl.files&&this.fileInputEl.files.length>0){const r=Array.from(this.fileInputEl.files);this.events.onAddTrackFiles&&this.events.onAddTrackFiles(r),this.fileInputEl.value="",this.closeAddPanel()}}),this.dropzoneEl.addEventListener("dragover",r=>{r.preventDefault(),this.dropzoneEl.classList.add("drag-active")}),this.dropzoneEl.addEventListener("dragleave",()=>{this.dropzoneEl.classList.remove("drag-active")}),this.dropzoneEl.addEventListener("drop",r=>{var i;if(r.preventDefault(),this.dropzoneEl.classList.remove("drag-active"),(i=r.dataTransfer)!=null&&i.files&&r.dataTransfer.files.length>0){const n=Array.from(r.dataTransfer.files).filter(a=>a.type.startsWith("audio/")||/\.(mp3|wav|ogg|flac|m4a|aac)$/i.test(a.name));n.length>0&&this.events.onAddTrackFiles&&(this.events.onAddTrackFiles(n),this.closeAddPanel())}}),this.root.addEventListener("dragover",r=>{r.preventDefault(),this.root.classList.add("drag-over")}),this.root.addEventListener("dragleave",r=>{this.root.contains(r.relatedTarget)||this.root.classList.remove("drag-over")}),this.root.addEventListener("drop",r=>{var i;if(r.preventDefault(),this.root.classList.remove("drag-over"),(i=r.dataTransfer)!=null&&i.files&&r.dataTransfer.files.length>0){const n=Array.from(r.dataTransfer.files).filter(a=>a.type.startsWith("audio/")||/\.(mp3|wav|ogg|flac|m4a|aac)$/i.test(a.name));n.length>0&&this.events.onAddTrackFiles&&(this.events.onAddTrackFiles(n),this.closeAddPanel())}});const e=()=>{const r=this.urlInput.value.trim();if(!r){this.urlInput.focus();return}const i=this.titleInput.value.trim(),n=this.artistInput.value.trim();this.events.onAddTrackUrl&&this.events.onAddTrackUrl(r,i||void 0,n||void 0),this.urlInput.value="",this.titleInput.value="",this.artistInput.value="",this.closeAddPanel()};this.submitUrlBtn.addEventListener("click",e);const t=r=>{r.stopPropagation(),r.key==="Enter"&&(r.preventDefault(),e())};this.urlInput.addEventListener("keydown",t),this.titleInput.addEventListener("keydown",t),this.artistInput.addEventListener("keydown",t),this.cancelAddBtn.addEventListener("click",()=>{this.closeAddPanel()}),this.sliderTrack.addEventListener("mousedown",this.startScrubbing),this.sliderTrack.addEventListener("touchstart",this.startScrubbing,{passive:!1}),this.sliderTrack.addEventListener("keydown",r=>{if(this.currentDuration){if(r.key==="ArrowRight"||r.key==="ArrowUp"){r.preventDefault();const i=parseFloat(this.fillBar.style.width)/100*this.currentDuration;this.events.onSeek(Math.min(i+5,this.currentDuration))}else if(r.key==="ArrowLeft"||r.key==="ArrowDown"){r.preventDefault();const i=parseFloat(this.fillBar.style.width)/100*this.currentDuration;this.events.onSeek(Math.max(i-5,0))}}})}calculateProgressPercent(e){var n,a,l,d;const t=this.sliderTrack.getBoundingClientRect(),r="touches"in e?((a=(n=e.touches)==null?void 0:n[0])==null?void 0:a.clientX)??((d=(l=e.changedTouches)==null?void 0:l[0])==null?void 0:d.clientX)??0:e.clientX,i=u(r-t.left,0,t.width);return t.width>0?i/t.width*100:0}handleScrubbingMove(e){const t=this.calculateProgressPercent(e);if(this.fillBar.style.width=`${t}%`,this.sliderTrack.setAttribute("aria-valuenow",Math.round(t).toString()),this.currentDuration>0){const r=t/100*this.currentDuration;this.currentTimeEl.textContent=T(r)}}finishScrubbing(e){const t=this.calculateProgressPercent(e);if(this.fillBar.style.width=`${t}%`,this.sliderTrack.setAttribute("aria-valuenow",Math.round(t).toString()),this.currentDuration>0){const r=t/100*this.currentDuration;this.currentTimeEl.textContent=T(r),this.events.onSeek(r)}this.isScrubbing=!1,document.body.style.userSelect=""}updateTrackInfo(e){this.titleEl.textContent=e.title||"Untitled Track",this.artistEl.textContent=e.artist||"Unknown Artist",this.albumEl.textContent=e.album||"",e.coverArt?(this.coverContainer.innerHTML="",this.coverImgEl=s("img",{className:"horeg-cover-img",attributes:{src:e.coverArt,alt:`${e.title} cover`}}),this.coverImgEl.onerror=()=>{this.coverContainer.innerHTML=`<span class="horeg-cover-fallback">${c.speaker}</span>`},this.coverContainer.appendChild(this.coverImgEl)):this.coverContainer.innerHTML=`<span class="horeg-cover-fallback">${c.speaker}</span>`}updatePlayState(e){e?(this.playBtn.classList.add("playing"),this.playBtn.innerHTML=c.pause,this.playBtn.setAttribute("aria-label","Pause track")):(this.playBtn.classList.remove("playing"),this.playBtn.innerHTML=c.play,this.playBtn.setAttribute("aria-label","Play track"))}updateProgress(e,t){if(this.currentDuration=t,this.durationEl.textContent=T(t),!this.isScrubbing){this.currentTimeEl.textContent=T(e);const r=t>0?e/t*100:0;this.fillBar.style.width=`${u(r,0,100)}%`,this.sliderTrack.setAttribute("aria-valuenow",Math.round(r).toString())}}updateBuffer(e){this.bufferBar.style.width=`${u(e,0,100)}%`}updateVolume(e,t){this.volumeSlider.value=e.toString(),t||e===0?(this.muteBtn.innerHTML=c.volumeMute,this.muteBtn.setAttribute("aria-label","Unmute")):(this.muteBtn.innerHTML=c.volumeHigh,this.muteBtn.setAttribute("aria-label","Mute"))}updateLoopState(e){e==="none"?(this.loopBtn.classList.remove("active"),this.loopBtn.innerHTML=c.repeat):e==="all"?(this.loopBtn.classList.add("active"),this.loopBtn.innerHTML=c.repeat):e==="one"&&(this.loopBtn.classList.add("active"),this.loopBtn.innerHTML=c.repeatOne),this.loopBtn.setAttribute("aria-label",`Repeat mode: ${e}`)}updateShuffleState(e){e?this.shuffleBtn.classList.add("active"):this.shuffleBtn.classList.remove("active")}toggleDrawer(e){(e!==void 0?e:!this.drawerEl.classList.contains("open"))?(this.drawerEl.classList.add("open"),this.drawerBtn.classList.add("active")):(this.drawerEl.classList.remove("open"),this.drawerBtn.classList.remove("active"),this.closeAddPanel())}closeAddPanel(){this.addPanelEl.classList.remove("open"),this.addTrackBtn.classList.remove("active")}renderPlaylist(e,t){if(this.drawerCountEl.textContent=e.length.toString(),this.drawerInner.innerHTML="",e.length===0){const r=s("div",{className:"horeg-empty-playlist",textContent:'Playlist masih kosong. Klik "Add Track" untuk menambahkan lagu.'});this.drawerInner.appendChild(r);return}e.forEach((r,i)=>{const n=s("div",{className:`horeg-track-item ${i===t?"active":""}`}),a=s("div",{className:"horeg-track-num",textContent:(i+1).toString().padStart(2,"0")});n.appendChild(a);const l=s("div",{className:"horeg-track-details"}),d=s("div",{className:"horeg-item-title",textContent:r.title}),p=s("div",{className:"horeg-item-artist",textContent:r.artist||"Unknown Artist"});if(l.appendChild(d),l.appendChild(p),n.appendChild(l),r.duration){const b=s("div",{className:"horeg-item-duration",textContent:T(r.duration)});n.appendChild(b)}const g=s("div",{className:"horeg-track-actions"}),f=s("button",{className:"horeg-btn-remove",attributes:{type:"button","aria-label":"Hapus lagu dari playlist"},innerHTML:c.trash});f.addEventListener("click",b=>{b.stopPropagation(),this.events.onRemoveTrack&&this.events.onRemoveTrack(i)}),g.appendChild(f),n.appendChild(g),n.addEventListener("click",()=>{this.events.onTrackSelect(i)}),this.drawerInner.appendChild(n)})}destroy(){this.root.remove()}}class G{constructor(e){o(this,"container");o(this,"bars",[]);o(this,"isRunning",!1);o(this,"animFrameId",null);o(this,"isEnabled",!0);o(this,"baseHeights",[]);o(this,"loop",()=>{if(!this.isRunning)return;const e=Date.now()/150;for(let t=0;t<this.bars.length;t++){const r=Math.sin(e*1.8+t*1.2),i=Math.cos(e*2.5+t*.8),n=Math.abs(r*.6+i*.4),a=Math.floor(4+n*18);this.bars[t].style.height=`${a}px`}this.animFrameId=requestAnimationFrame(this.loop)});this.container=e.container,this.isEnabled=e.enableAnimation!==!1;const t=e.barCount||5;this.initBars(t)}initBars(e){this.container.innerHTML="",this.bars=[],this.baseHeights=[];for(let t=0;t<e;t++){const r=document.createElement("span");r.className="horeg-eq-bar",this.container.appendChild(r),this.bars.push(r),this.baseHeights.push(3+t%2*2),r.style.height=`${this.baseHeights[t]}px`}}setEnabled(e){this.isEnabled=e,e||this.stop()}start(){this.isRunning||!this.isEnabled||(this.isRunning=!0,this.loop())}stop(){this.isRunning=!1,this.animFrameId!==null&&(cancelAnimationFrame(this.animFrameId),this.animFrameId=null);for(let e=0;e<this.bars.length;e++)this.bars[e].style.height=`${this.baseHeights[e]||3}px`}destroy(){this.stop(),this.bars=[],this.container.innerHTML=""}}class m{constructor(e){o(this,"container");o(this,"shadow");o(this,"styleEl");o(this,"audioEngine");o(this,"ui");o(this,"visualizer");o(this,"theme");o(this,"boundKeyHandler");var n;if(typeof e.container=="string"){const a=document.querySelector(e.container);if(!a)throw new Error(`[HoregAudio] Container "${e.container}" not found in DOM.`);this.container=a}else if(e.container instanceof HTMLElement)this.container=e.container;else throw new Error("[HoregAudio] Invalid container option provided.");const t=((n=e.theme)==null?void 0:n.variant)||"horeg-classic",r=v[t]||v["horeg-classic"];this.theme={...r,...e.theme||{}},this.shadow=this.container.attachShadow({mode:"open"}),this.styleEl=document.createElement("style"),this.styleEl.textContent=L(this.theme),this.shadow.appendChild(this.styleEl),this.ui=new q({onPlayPauseClick:()=>this.toggle(),onPrevClick:()=>this.prev(),onNextClick:()=>this.next(),onSeek:a=>this.seek(a),onVolumeChange:a=>this.setVolume(a),onMuteToggle:()=>{const a=this.audioEngine.toggleMute();this.ui.updateVolume(this.audioEngine.getVolume(),a)},onShuffleToggle:()=>{const a=!this.audioEngine.isShuffle();this.audioEngine.setShuffle(a),this.ui.updateShuffleState(a)},onLoopToggle:()=>{const a=this.audioEngine.getLoop(),l=a==="all"?"one":a==="one"?"none":"all";this.audioEngine.setLoop(l),this.ui.updateLoopState(l)},onTrackSelect:a=>{this.loadTrack(a,!0)},onAddTrackFiles:a=>{this.addTrackFromFiles(a,!1)},onAddTrackUrl:(a,l,d)=>{this.addTrackFromUrl(a,{title:l,artist:d},!1)},onRemoveTrack:a=>{this.removeTrack(a)}}),this.shadow.appendChild(this.ui.root),this.visualizer=new G({container:this.ui.eqContainer,enableAnimation:this.theme.enableEqAnimation!==!1}),this.audioEngine=new j(e,{onPlay:a=>{this.ui.updatePlayState(!0),this.visualizer.start(),e.onPlay&&e.onPlay(a)},onPause:()=>{this.ui.updatePlayState(!1),this.visualizer.stop(),e.onPause&&e.onPause()},onTrackChange:(a,l)=>{this.ui.updateTrackInfo(a);const d=this.audioEngine?this.audioEngine.getPlaylist():e.playlist||[];this.ui.renderPlaylist(d,l),this.ui.updateProgress(0,a.duration||0),e.onTrackChange&&e.onTrackChange(a,l)},onPlaylistChange:(a,l)=>{this.ui.renderPlaylist(a,l),e.onPlaylistChange&&e.onPlaylistChange(a,l)},onTimeUpdate:(a,l)=>{this.ui.updateProgress(a,l),e.onTimeUpdate&&e.onTimeUpdate(a,l)},onBufferUpdate:a=>{this.ui.updateBuffer(a)},onEnded:a=>{this.visualizer.stop(),e.onEnded&&e.onEnded(a)},onError:a=>{this.ui.updatePlayState(!1),this.visualizer.stop(),e.onError&&e.onError(a)}}),this.ui.updateVolume(this.audioEngine.getVolume(),this.audioEngine.isMuted()),this.ui.updateLoopState(this.audioEngine.getLoop()),this.ui.updateShuffleState(this.audioEngine.isShuffle()),this.ui.renderPlaylist(this.audioEngine.getPlaylist(),this.audioEngine.getCurrentIndex());const i=this.audioEngine.getCurrentTrack();i&&(this.ui.updateTrackInfo(i),this.ui.renderPlaylist(this.audioEngine.getPlaylist(),this.audioEngine.getCurrentIndex())),this.boundKeyHandler=this.handleKeyDown.bind(this),this.container.tabIndex=this.container.tabIndex>=0?this.container.tabIndex:0,this.container.addEventListener("keydown",this.boundKeyHandler)}handleKeyDown(e){var a;const t=e.composedPath?e.composedPath():[],r=t.length>0?t[0]:e.target,i=((a=this.shadow)==null?void 0:a.activeElement)||document.activeElement,n=l=>{if(!l)return!1;const d=l.tagName;return d==="INPUT"||d==="TEXTAREA"||d==="SELECT"||l.isContentEditable};if(!(n(r)||n(i)))if(e.code==="Space"){if((r==null?void 0:r.tagName)==="BUTTON"||(i==null?void 0:i.tagName)==="BUTTON")return;e.preventDefault(),this.toggle()}else e.key==="ArrowRight"&&!e.shiftKey?(e.preventDefault(),this.seek(this.audioEngine.getCurrentTime()+5)):e.key==="ArrowLeft"&&!e.shiftKey?(e.preventDefault(),this.seek(this.audioEngine.getCurrentTime()-5)):e.key==="ArrowUp"?(e.preventDefault(),this.setVolume(this.audioEngine.getVolume()+.05)):e.key==="ArrowDown"&&(e.preventDefault(),this.setVolume(this.audioEngine.getVolume()-.05))}async play(){await this.audioEngine.play()}pause(){this.audioEngine.pause()}toggle(){this.audioEngine.toggle()}next(){this.audioEngine.next()}prev(){this.audioEngine.prev()}seek(e){this.audioEngine.seek(e)}setVolume(e){this.audioEngine.setVolume(e),this.ui.updateVolume(this.audioEngine.getVolume(),this.audioEngine.isMuted())}loadTrack(e,t=!1){this.audioEngine.loadTrack(e,t)}addTrack(e,t=!1){const r=this.audioEngine.addTrack(e,t);return this.ui.renderPlaylist(this.audioEngine.getPlaylist(),this.audioEngine.getCurrentIndex()),r}addTracks(e,t=!1){this.audioEngine.addTracks(e,t),this.ui.renderPlaylist(this.audioEngine.getPlaylist(),this.audioEngine.getCurrentIndex())}async addTrackFromFile(e,t=!1){const r=URL.createObjectURL(e),i=e.name.replace(/\.[^/.]+$/,""),n={id:`local-${Date.now()}-${Math.random().toString(36).substring(2,7)}`,title:i,artist:"File Audio Lokal",src:r};try{const a=await this.probeAudioDuration(r);a>0&&(n.duration=a)}catch{}return this.addTrack(n,t),n}async addTrackFromFiles(e,t=!1){const r=Array.from(e),i=[];for(let n=0;n<r.length;n++){const a=r[n],l=t&&n===0,d=await this.addTrackFromFile(a,l);i.push(d)}return i}async addTrackFromUrl(e,t={},r=!1){var a,l;let i="Online Track";try{const p=new URL(e).pathname,g=p.substring(p.lastIndexOf("/")+1);g&&(i=decodeURIComponent(g).replace(/\.[^/.]+$/,""))}catch{}const n={id:t.id||`url-${Date.now()}-${Math.random().toString(36).substring(2,7)}`,title:((a=t.title)==null?void 0:a.trim())||i,artist:((l=t.artist)==null?void 0:l.trim())||"Audio Stream",album:t.album,coverArt:t.coverArt,src:e,duration:t.duration};if(!n.duration)try{const d=await this.probeAudioDuration(e);d>0&&(n.duration=d)}catch{}return this.addTrack(n,r),n}removeTrack(e){this.audioEngine.removeTrack(e),this.ui.renderPlaylist(this.audioEngine.getPlaylist(),this.audioEngine.getCurrentIndex());const t=this.audioEngine.getCurrentTrack();t?this.ui.updateTrackInfo(t):this.ui.updateTrackInfo({title:"No Track Loaded",src:""})}getPlaylist(){return this.audioEngine.getPlaylist()}probeAudioDuration(e){return new Promise(t=>{const r=new Audio;let i=!1;const n=d=>{i||(i=!0,r.removeEventListener("loadedmetadata",a),r.removeEventListener("error",l),r.src="",t(d))},a=()=>{const d=r.duration;n(d&&!isNaN(d)&&isFinite(d)?d:0)},l=()=>n(0);r.addEventListener("loadedmetadata",a),r.addEventListener("error",l),r.src=e,setTimeout(()=>n(0),3e3)})}setTheme(e){if(e.variant){const t=v[e.variant]||v["horeg-classic"];this.theme={...t,...e}}else this.theme={...this.theme,...e};this.styleEl.textContent=L(this.theme),this.theme.enableEqAnimation!==void 0&&this.visualizer.setEnabled(this.theme.enableEqAnimation)}getTheme(){return{...this.theme}}getAudioEngine(){return this.audioEngine}destroy(){this.container.removeEventListener("keydown",this.boundKeyHandler),this.audioEngine.destroy(),this.visualizer.destroy(),this.ui.destroy(),this.shadow.innerHTML=""}}m.HoregAudio=m;m.default=m;m.THEME_PRESETS=v;m.generateStyles=L;exports.HoregAudio=m;exports.THEME_PRESETS=v;exports.default=m;exports.generateStyles=L;module.exports=Object.assign(exports.default||exports.HoregAudio,exports);
+      <div class="horeg-dropzone-text">Choose Local Audio File</div>
+      <div class="horeg-dropzone-hint">Click here or drag & drop audio files (.mp3, .wav, .flac, .ogg, .m4a)</div>
+    `,this.tabPaneFile.appendChild(this.fileInputEl),this.tabPaneFile.appendChild(this.dropzoneEl),this.addPanelEl.appendChild(this.tabPaneFile),this.tabPaneUrl=n("div",{className:"horeg-tab-pane"}),this.urlInput=n("input",{className:"horeg-input-field",attributes:{type:"url",placeholder:"Audio URL (https://...mp3/wav)",required:"true"}}),this.titleInput=n("input",{className:"horeg-input-field",attributes:{type:"text",placeholder:"Track Title (Optional)"}}),this.artistInput=n("input",{className:"horeg-input-field",attributes:{type:"text",placeholder:"Artist Name (Optional)"}});const w=n("div",{className:"horeg-form-actions"});this.cancelAddBtn=n("button",{className:"horeg-btn-cancel",attributes:{type:"button"},textContent:"Cancel"}),this.submitUrlBtn=n("button",{className:"horeg-btn-submit",attributes:{type:"button"},innerHTML:`${c.plus} Add Track`}),w.appendChild(this.cancelAddBtn),w.appendChild(this.submitUrlBtn),this.tabPaneUrl.appendChild(this.urlInput),this.tabPaneUrl.appendChild(this.titleInput),this.tabPaneUrl.appendChild(this.artistInput),this.tabPaneUrl.appendChild(w),this.addPanelEl.appendChild(this.tabPaneUrl),this.drawerEl.appendChild(this.addPanelEl),this.drawerInner=n("div",{className:"horeg-drawer-inner"}),this.drawerEl.appendChild(this.drawerInner),this.root.appendChild(this.drawerEl),this.bindDOMEvents()}bindDOMEvents(){this.playBtn.addEventListener("click",()=>this.events.onPlayPauseClick()),this.prevBtn.addEventListener("click",()=>this.events.onPrevClick()),this.nextBtn.addEventListener("click",()=>this.events.onNextClick()),this.shuffleBtn.addEventListener("click",()=>this.events.onShuffleToggle()),this.loopBtn.addEventListener("click",()=>this.events.onLoopToggle()),this.muteBtn.addEventListener("click",()=>this.events.onMuteToggle()),this.volumeSlider.addEventListener("input",()=>{const t=parseFloat(this.volumeSlider.value);this.events.onVolumeChange(t);const s=Math.round(t*100);this.volumePercentEl.textContent=t===0?"MUTE":`${s}%`}),this.drawerBtn.addEventListener("click",()=>{this.toggleDrawer()}),this.addTrackBtn.addEventListener("click",()=>{const t=this.addPanelEl.classList.toggle("open");this.addTrackBtn.classList.toggle("active",t),t&&this.toggleDrawer(!0)}),this.tabBtnFile.addEventListener("click",()=>{this.tabBtnFile.classList.add("active"),this.tabBtnUrl.classList.remove("active"),this.tabPaneFile.classList.add("active"),this.tabPaneUrl.classList.remove("active")}),this.tabBtnUrl.addEventListener("click",()=>{this.tabBtnUrl.classList.add("active"),this.tabBtnFile.classList.remove("active"),this.tabPaneUrl.classList.add("active"),this.tabPaneFile.classList.remove("active"),this.urlInput.focus()}),this.dropzoneEl.addEventListener("click",()=>{this.fileInputEl.click()}),this.fileInputEl.addEventListener("change",()=>{if(this.fileInputEl.files&&this.fileInputEl.files.length>0){const t=Array.from(this.fileInputEl.files);this.events.onAddTrackFiles&&this.events.onAddTrackFiles(t),this.fileInputEl.value="",this.closeAddPanel()}}),this.dropzoneEl.addEventListener("dragover",t=>{t.preventDefault(),this.dropzoneEl.classList.add("drag-active")}),this.dropzoneEl.addEventListener("dragleave",()=>{this.dropzoneEl.classList.remove("drag-active")}),this.dropzoneEl.addEventListener("drop",t=>{var s;if(t.preventDefault(),this.dropzoneEl.classList.remove("drag-active"),(s=t.dataTransfer)!=null&&s.files&&t.dataTransfer.files.length>0){const o=Array.from(t.dataTransfer.files).filter(a=>a.type.startsWith("audio/")||/\.(mp3|wav|ogg|flac|m4a|aac)$/i.test(a.name));o.length>0&&this.events.onAddTrackFiles&&(this.events.onAddTrackFiles(o),this.closeAddPanel())}}),this.root.addEventListener("dragover",t=>{t.preventDefault(),this.root.classList.add("drag-over")}),this.root.addEventListener("dragleave",t=>{this.root.contains(t.relatedTarget)||this.root.classList.remove("drag-over")}),this.root.addEventListener("drop",t=>{var s;if(t.preventDefault(),this.root.classList.remove("drag-over"),(s=t.dataTransfer)!=null&&s.files&&t.dataTransfer.files.length>0){const o=Array.from(t.dataTransfer.files).filter(a=>a.type.startsWith("audio/")||/\.(mp3|wav|ogg|flac|m4a|aac)$/i.test(a.name));o.length>0&&this.events.onAddTrackFiles&&(this.events.onAddTrackFiles(o),this.closeAddPanel())}});const e=()=>{const t=this.urlInput.value.trim();if(!t){this.urlInput.focus();return}const s=this.titleInput.value.trim(),o=this.artistInput.value.trim();this.events.onAddTrackUrl&&this.events.onAddTrackUrl(t,s||void 0,o||void 0),this.urlInput.value="",this.titleInput.value="",this.artistInput.value="",this.closeAddPanel()};this.submitUrlBtn.addEventListener("click",e);const r=t=>{t.stopPropagation(),t.key==="Enter"&&(t.preventDefault(),e())};this.urlInput.addEventListener("keydown",r),this.titleInput.addEventListener("keydown",r),this.artistInput.addEventListener("keydown",r),this.cancelAddBtn.addEventListener("click",()=>{this.closeAddPanel()}),this.sliderTrack.addEventListener("mousedown",this.startScrubbing),this.sliderTrack.addEventListener("touchstart",this.startScrubbing,{passive:!1}),this.sliderTrack.addEventListener("keydown",t=>{if(this.currentDuration){if(t.key==="ArrowRight"||t.key==="ArrowUp"){t.preventDefault();const s=parseFloat(this.fillBar.style.width)/100*this.currentDuration;this.events.onSeek(Math.min(s+5,this.currentDuration))}else if(t.key==="ArrowLeft"||t.key==="ArrowDown"){t.preventDefault();const s=parseFloat(this.fillBar.style.width)/100*this.currentDuration;this.events.onSeek(Math.max(s-5,0))}}})}calculateProgressPercent(e){var o,a,l,h;const r=this.sliderTrack.getBoundingClientRect(),t="touches"in e?((a=(o=e.touches)==null?void 0:o[0])==null?void 0:a.clientX)??((h=(l=e.changedTouches)==null?void 0:l[0])==null?void 0:h.clientX)??0:e.clientX,s=v(t-r.left,0,r.width);return r.width>0?s/r.width*100:0}handleScrubbingMove(e){const r=this.calculateProgressPercent(e);if(this.fillBar.style.width=`${r}%`,this.sliderTrack.setAttribute("aria-valuenow",Math.round(r).toString()),this.currentDuration>0){const t=r/100*this.currentDuration;this.currentTimeEl.textContent=T(t)}}finishScrubbing(e){const r=this.calculateProgressPercent(e);if(this.fillBar.style.width=`${r}%`,this.sliderTrack.setAttribute("aria-valuenow",Math.round(r).toString()),this.currentDuration>0){const t=r/100*this.currentDuration;this.currentTimeEl.textContent=T(t),this.events.onSeek(t)}this.isScrubbing=!1,document.body.style.userSelect=""}updateTrackInfo(e){this.titleEl.textContent=e.title||"Untitled Track",this.artistEl.textContent=e.artist||"Unknown Artist",this.albumEl.textContent=e.album||"",e.coverArt?(this.coverContainer.innerHTML="",this.coverImgEl=n("img",{className:"horeg-cover-img",attributes:{src:e.coverArt,alt:`${e.title} cover`}}),this.coverImgEl.onerror=()=>{this.coverContainer.innerHTML=`<span class="horeg-cover-fallback">${c.speaker}</span>`},this.coverContainer.appendChild(this.coverImgEl)):this.coverContainer.innerHTML=`<span class="horeg-cover-fallback">${c.speaker}</span>`,this.checkTitleMarquee()}checkTitleMarquee(){!this.titleEl||!this.titleWrap||(this.titleEl.classList.remove("is-marquee"),this.titleWrap.classList.remove("is-overflowing"),this.titleWrap.style.removeProperty("--marquee-dist"),this.titleWrap.style.removeProperty("--marquee-duration"),this.titleEl.style.removeProperty("--marquee-dist"),this.titleEl.style.removeProperty("--marquee-duration"),requestAnimationFrame(()=>{const e=this.titleEl.scrollWidth,r=this.titleWrap.clientWidth;if(e>r&&r>0){const t=e-r+20,s=Math.max(6,Math.round(t/18)+3),o=`-${t}px`,a=`${s}s`;this.titleWrap.style.setProperty("--marquee-dist",o),this.titleWrap.style.setProperty("--marquee-duration",a),this.titleEl.style.setProperty("--marquee-dist",o),this.titleEl.style.setProperty("--marquee-duration",a),this.titleWrap.classList.add("is-overflowing"),this.titleEl.classList.add("is-marquee")}}))}updatePlayState(e){e?(this.playBtn.classList.add("playing"),this.playBtn.innerHTML=c.pause,this.playBtn.setAttribute("aria-label","Pause track"),this.playBtn.setAttribute("data-tooltip","Pause (Space)")):(this.playBtn.classList.remove("playing"),this.playBtn.innerHTML=c.play,this.playBtn.setAttribute("aria-label","Play track"),this.playBtn.setAttribute("data-tooltip","Play (Space)"))}updateProgress(e,r){if(this.currentDuration=r,this.durationEl.textContent=T(r),!this.isScrubbing){this.currentTimeEl.textContent=T(e);const t=r>0?e/r*100:0;this.fillBar.style.width=`${v(t,0,100)}%`,this.sliderTrack.setAttribute("aria-valuenow",Math.round(t).toString())}}updateBuffer(e){this.bufferBar.style.width=`${v(e,0,100)}%`}updateVolume(e,r){this.volumeSlider.value=e.toString();const t=Math.round(e*100);r||e===0?(this.muteBtn.innerHTML=c.volumeMute,this.muteBtn.setAttribute("aria-label","Unmute"),this.muteBtn.setAttribute("data-tooltip","Unmute (M)"),this.volumePercentEl.textContent="MUTE"):(this.volumePercentEl.textContent=`${t}%`,this.muteBtn.setAttribute("data-tooltip",`Volume ${t}% (M)`),e<=.35?(this.muteBtn.innerHTML=c.volumeLow,this.muteBtn.setAttribute("aria-label","Volume low")):e<=.7?(this.muteBtn.innerHTML=c.volumeMedium,this.muteBtn.setAttribute("aria-label","Volume medium")):(this.muteBtn.innerHTML=c.volumeHigh,this.muteBtn.setAttribute("aria-label","Volume high")))}updateLoopState(e){e==="none"?(this.loopBtn.classList.remove("active"),this.loopBtn.innerHTML=c.repeat,this.loopBtn.setAttribute("data-tooltip","Repeat Off (L)")):e==="all"?(this.loopBtn.classList.add("active"),this.loopBtn.innerHTML=c.repeat,this.loopBtn.setAttribute("data-tooltip","Repeat All (L)")):e==="one"&&(this.loopBtn.classList.add("active"),this.loopBtn.innerHTML=c.repeatOne,this.loopBtn.setAttribute("data-tooltip","Repeat One (L)")),this.loopBtn.setAttribute("aria-label",`Repeat mode: ${e}`)}updateShuffleState(e){e?(this.shuffleBtn.classList.add("active"),this.shuffleBtn.setAttribute("data-tooltip","Shuffle Off (S)")):(this.shuffleBtn.classList.remove("active"),this.shuffleBtn.setAttribute("data-tooltip","Shuffle (S)"))}toggleDrawer(e){(e!==void 0?e:!this.drawerEl.classList.contains("open"))?(this.drawerEl.classList.add("open"),this.drawerBtn.classList.add("active")):(this.drawerEl.classList.remove("open"),this.drawerBtn.classList.remove("active"),this.closeAddPanel())}closeAddPanel(){this.addPanelEl.classList.remove("open"),this.addTrackBtn.classList.remove("active")}renderPlaylist(e,r){if(this.drawerCountEl.textContent=e.length.toString(),this.drawerInner.innerHTML="",e.length===0){const t=n("div",{className:"horeg-empty-playlist",textContent:'Playlist is empty. Click "Add Track" to add music.'});this.drawerInner.appendChild(t);return}e.forEach((t,s)=>{const o=n("div",{className:`horeg-track-item ${s===r?"active":""}`}),a=n("div",{className:"horeg-track-num",textContent:(s+1).toString().padStart(2,"0")});o.appendChild(a);const l=n("div",{className:"horeg-track-details"}),h=n("div",{className:"horeg-item-title",textContent:t.title}),p=n("div",{className:"horeg-item-artist",textContent:t.artist||"Unknown Artist"});if(l.appendChild(h),l.appendChild(p),o.appendChild(l),t.duration){const u=n("div",{className:"horeg-item-duration",textContent:T(t.duration)});o.appendChild(u)}const g=n("div",{className:"horeg-track-actions"}),b=n("button",{className:"horeg-btn-remove",attributes:{type:"button","aria-label":"Remove track from playlist","data-tooltip":"Remove"},innerHTML:c.trash});b.addEventListener("click",u=>{u.stopPropagation(),this.events.onRemoveTrack&&this.events.onRemoveTrack(s)}),g.appendChild(b),o.appendChild(g),o.addEventListener("click",()=>{this.events.onTrackSelect(s)}),this.drawerInner.appendChild(o)})}destroy(){this.root.remove()}}class K{constructor(e){i(this,"stageContainer");i(this,"coverContainer",null);i(this,"isEnabled",!0);i(this,"isRunning",!1);i(this,"animFrameId",null);i(this,"getAudioEnergy");i(this,"leftBoxEl");i(this,"leftTopDriverEl");i(this,"leftBottomDriverEl");i(this,"leftRipples",[]);i(this,"subBoxEl");i(this,"subConeEl");i(this,"shockwave1El");i(this,"shockwave2El");i(this,"rightBoxEl");i(this,"rightTopDriverEl");i(this,"rightBottomDriverEl");i(this,"rightRipples",[]);i(this,"smoothBass",0);i(this,"smoothLeft",0);i(this,"smoothRight",0);i(this,"loop",()=>{if(!this.isRunning)return;const e=this.getAudioEnergy?this.getAudioEnergy():{bass:0,left:0,right:0},r=e.bass<.01?0:e.bass,t=e.left<.01?0:e.left,s=e.right<.01?0:e.right;r>this.smoothBass?this.smoothBass+=(r-this.smoothBass)*.7:this.smoothBass+=(r-this.smoothBass)*.25,this.smoothBass<.01&&(this.smoothBass=0),this.smoothLeft+=(t-this.smoothLeft)*.4,this.smoothLeft<.01&&(this.smoothLeft=0),this.smoothRight+=(s-this.smoothRight)*.4,this.smoothRight<.01&&(this.smoothRight=0),this.applyExcursion(this.smoothBass,this.smoothLeft,this.smoothRight),this.animFrameId=requestAnimationFrame(this.loop)});this.stageContainer=e.stageContainer,this.coverContainer=e.coverContainer||null,this.isEnabled=e.enableAnimation!==!1,this.getAudioEnergy=e.getAudioEnergy,this.buildStage()}setAudioEnergyGetter(e){this.getAudioEnergy=e}buildStage(){this.stageContainer.innerHTML="",this.leftBoxEl=document.createElement("div"),this.leftBoxEl.className="horeg-soundbox is-satellite is-left",this.leftBoxEl.innerHTML=`
+      <div class="horeg-box-header">
+        <span class="horeg-box-bolt top-left"></span>
+        <span class="horeg-tweeter-slot"></span>
+        <span class="horeg-box-bolt top-right"></span>
+      </div>
+      <div class="horeg-satellite-baffle">
+        <!-- Lingkaran 1 Kiri: Top Driver -->
+        <div class="horeg-satellite-driver top">
+          <span class="horeg-driver-ripple ripple-1"></span>
+          <span class="horeg-driver-ripple ripple-2"></span>
+          <div class="horeg-driver-surround">
+            <div class="horeg-driver-cone">
+              <div class="horeg-driver-cap"></div>
+            </div>
+          </div>
+        </div>
+        <!-- Lingkaran 2 Kiri: Bottom Driver -->
+        <div class="horeg-satellite-driver bottom">
+          <span class="horeg-driver-ripple ripple-1"></span>
+          <span class="horeg-driver-ripple ripple-2"></span>
+          <div class="horeg-driver-surround">
+            <div class="horeg-driver-cone">
+              <div class="horeg-driver-cap"></div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="horeg-box-footer">
+        <span class="horeg-box-bolt bottom-left"></span>
+        <span class="horeg-port-slot"></span>
+        <span class="horeg-box-bolt bottom-right"></span>
+      </div>
+    `,this.leftTopDriverEl=this.leftBoxEl.querySelector(".top .horeg-driver-cone"),this.leftBottomDriverEl=this.leftBoxEl.querySelector(".bottom .horeg-driver-cone"),this.leftRipples=Array.from(this.leftBoxEl.querySelectorAll(".horeg-driver-ripple")),this.stageContainer.appendChild(this.leftBoxEl),this.subBoxEl=document.createElement("div"),this.subBoxEl.className="horeg-soundbox is-subwoofer";const e=document.createElement("div");e.className="horeg-shockwaves-wrap",this.shockwave1El=document.createElement("div"),this.shockwave1El.className="horeg-shockwave wave-1",this.shockwave2El=document.createElement("div"),this.shockwave2El.className="horeg-shockwave wave-2",e.appendChild(this.shockwave1El),e.appendChild(this.shockwave2El),this.subBoxEl.appendChild(e);const r=document.createElement("div");r.className="horeg-sub-frame",r.innerHTML=`
+      <span class="horeg-box-bolt top-left"></span>
+      <span class="horeg-box-bolt top-right"></span>
+      <span class="horeg-sub-badge">SUB 18"</span>
+      <span class="horeg-box-bolt bottom-left"></span>
+      <span class="horeg-box-bolt bottom-right"></span>
+      <div class="horeg-sub-ports">
+        <span class="horeg-sub-port left"></span>
+        <span class="horeg-sub-port right"></span>
+      </div>
+    `;const t=document.createElement("div");t.className="horeg-sub-baffle";const s=document.createElement("div");s.className="horeg-sub-surround",this.subConeEl=document.createElement("div"),this.subConeEl.className="horeg-sub-cone",this.coverContainer&&this.subConeEl.appendChild(this.coverContainer),s.appendChild(this.subConeEl),t.appendChild(s),this.subBoxEl.appendChild(r),this.subBoxEl.appendChild(t),this.stageContainer.appendChild(this.subBoxEl),this.rightBoxEl=document.createElement("div"),this.rightBoxEl.className="horeg-soundbox is-satellite is-right",this.rightBoxEl.innerHTML=`
+      <div class="horeg-box-header">
+        <span class="horeg-box-bolt top-left"></span>
+        <span class="horeg-tweeter-slot"></span>
+        <span class="horeg-box-bolt top-right"></span>
+      </div>
+      <div class="horeg-satellite-baffle">
+        <!-- Lingkaran 1 Kanan: Top Driver -->
+        <div class="horeg-satellite-driver top">
+          <span class="horeg-driver-ripple ripple-1"></span>
+          <span class="horeg-driver-ripple ripple-2"></span>
+          <div class="horeg-driver-surround">
+            <div class="horeg-driver-cone">
+              <div class="horeg-driver-cap"></div>
+            </div>
+          </div>
+        </div>
+        <!-- Lingkaran 2 Kanan: Bottom Driver -->
+        <div class="horeg-satellite-driver bottom">
+          <span class="horeg-driver-ripple ripple-1"></span>
+          <span class="horeg-driver-ripple ripple-2"></span>
+          <div class="horeg-driver-surround">
+            <div class="horeg-driver-cone">
+              <div class="horeg-driver-cap"></div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="horeg-box-footer">
+        <span class="horeg-box-bolt bottom-left"></span>
+        <span class="horeg-port-slot"></span>
+        <span class="horeg-box-bolt bottom-right"></span>
+      </div>
+    `,this.rightTopDriverEl=this.rightBoxEl.querySelector(".top .horeg-driver-cone"),this.rightBottomDriverEl=this.rightBoxEl.querySelector(".bottom .horeg-driver-cone"),this.rightRipples=Array.from(this.rightBoxEl.querySelectorAll(".horeg-driver-ripple")),this.stageContainer.appendChild(this.rightBoxEl)}setCoverContainer(e){this.coverContainer=e,this.subConeEl&&!this.subConeEl.contains(e)&&(this.subConeEl.innerHTML="",this.subConeEl.appendChild(e))}setEnabled(e){this.isEnabled=e,e||this.stop()}start(){this.isRunning||!this.isEnabled||(this.isRunning=!0,this.loop())}stop(){this.isRunning=!1,this.decayToIdle()}decayToIdle(){this.animFrameId!==null&&(cancelAnimationFrame(this.animFrameId),this.animFrameId=null);const e=()=>{this.smoothBass*=.8,this.smoothLeft*=.8,this.smoothRight*=.8,this.applyExcursion(this.smoothBass,this.smoothLeft,this.smoothRight),this.smoothBass>.005||this.smoothLeft>.005||this.smoothRight>.005?this.animFrameId=requestAnimationFrame(e):(this.smoothBass=0,this.smoothLeft=0,this.smoothRight=0,this.applyExcursion(0,0,0),this.animFrameId=null)};this.animFrameId=requestAnimationFrame(e)}applyExcursion(e,r,t){const s=1+e*.34;this.subConeEl.style.transform=`scale(${s.toFixed(3)})`;const o=1+e*.04;if(this.subBoxEl.style.transform=`scale(${o.toFixed(3)})`,e>.18){const p=(e-.18)/.82,g=1+p*.7,b=Math.min(.95,p*1.3);this.shockwave1El.style.transform=`scale(${g.toFixed(3)})`,this.shockwave1El.style.opacity=b.toFixed(2);const u=1+p*1.1,f=Math.max(0,(p-.2)*1.2);this.shockwave2El.style.transform=`scale(${u.toFixed(3)})`,this.shockwave2El.style.opacity=f.toFixed(2)}else this.shockwave1El.style.transform="scale(1)",this.shockwave1El.style.opacity="0",this.shockwave2El.style.transform="scale(1)",this.shockwave2El.style.opacity="0";const a=1+r*.1;this.leftTopDriverEl&&(this.leftTopDriverEl.style.transform=`scale(${a.toFixed(3)})`),this.leftBottomDriverEl&&(this.leftBottomDriverEl.style.transform=`scale(${a.toFixed(3)})`);const l=1+t*.1;this.rightTopDriverEl&&(this.rightTopDriverEl.style.transform=`scale(${l.toFixed(3)})`),this.rightBottomDriverEl&&(this.rightBottomDriverEl.style.transform=`scale(${l.toFixed(3)})`);const h=(p,g)=>{const b=g>.06;for(let u=0;u<p.length;u++){const f=p[u],m=f.classList.contains("ripple-2");if(!b){f.style.transform="scale(1)",f.style.opacity="0";continue}const w=1+g*(m?.42:.28),x=Math.max(0,Math.min(1,g*(m?.65:.85)-(m?.15:.05)));f.style.transform=`scale(${w.toFixed(3)})`,f.style.opacity=x.toFixed(2)}};h(this.leftRipples,r),h(this.rightRipples,t)}destroy(){this.stop(),this.stageContainer.innerHTML=""}}class C{constructor(e){i(this,"container");i(this,"shadow");i(this,"styleEl");i(this,"audioEngine");i(this,"ui");i(this,"visualizer");i(this,"theme");i(this,"boundKeyHandler");var o;if(typeof e.container=="string"){const a=document.querySelector(e.container);if(!a)throw new Error(`[HoregAudio] Container "${e.container}" not found in DOM.`);this.container=a}else if(e.container instanceof HTMLElement)this.container=e.container;else throw new Error("[HoregAudio] Invalid container option provided.");const r=((o=e.theme)==null?void 0:o.variant)||"horeg-classic",t=E[r]||E["horeg-classic"];this.theme={...t,...e.theme||{}},this.shadow=this.container.attachShadow({mode:"open"}),this.styleEl=document.createElement("style"),this.styleEl.textContent=L(this.theme,e.maxWidth),this.shadow.appendChild(this.styleEl),this.ui=new X({onPlayPauseClick:()=>this.toggle(),onPrevClick:()=>this.prev(),onNextClick:()=>this.next(),onSeek:a=>this.seek(a),onVolumeChange:a=>this.setVolume(a),onMuteToggle:()=>{const a=this.audioEngine.toggleMute();this.ui.updateVolume(this.audioEngine.getVolume(),a)},onShuffleToggle:()=>{const a=!this.audioEngine.isShuffle();this.audioEngine.setShuffle(a),this.ui.updateShuffleState(a)},onLoopToggle:()=>{const a=this.audioEngine.getLoop(),l=a==="all"?"one":a==="one"?"none":"all";this.audioEngine.setLoop(l),this.ui.updateLoopState(l)},onTrackSelect:a=>{this.loadTrack(a,!0)},onAddTrackFiles:a=>{this.addTrackFromFiles(a,!1)},onAddTrackUrl:(a,l,h)=>{this.addTrackFromUrl(a,{title:l,artist:h},!1)},onRemoveTrack:a=>{this.removeTrack(a)}}),this.shadow.appendChild(this.ui.root),this.visualizer=new K({stageContainer:this.ui.stageContainer,coverContainer:this.ui.coverContainer,enableAnimation:this.theme.enableEqAnimation!==!1}),this.audioEngine=new O(e,{onPlay:a=>{this.ui.updatePlayState(!0),this.visualizer.start(),e.onPlay&&e.onPlay(a)},onPause:()=>{this.ui.updatePlayState(!1),this.visualizer.stop(),e.onPause&&e.onPause()},onTrackChange:(a,l)=>{this.ui.updateTrackInfo(a);const h=this.audioEngine?this.audioEngine.getPlaylist():e.playlist||[];this.ui.renderPlaylist(h,l),this.ui.updateProgress(0,a.duration||0),e.onTrackChange&&e.onTrackChange(a,l)},onPlaylistChange:(a,l)=>{this.ui.renderPlaylist(a,l),e.onPlaylistChange&&e.onPlaylistChange(a,l)},onTimeUpdate:(a,l)=>{this.ui.updateProgress(a,l),e.onTimeUpdate&&e.onTimeUpdate(a,l)},onBufferUpdate:a=>{this.ui.updateBuffer(a)},onEnded:a=>{this.visualizer.stop(),e.onEnded&&e.onEnded(a)},onError:a=>{this.ui.updatePlayState(!1),this.visualizer.stop(),e.onError&&e.onError(a)}}),this.visualizer.setAudioEnergyGetter(()=>this.audioEngine.getAudioEnergy()),this.ui.updateVolume(this.audioEngine.getVolume(),this.audioEngine.isMuted()),this.ui.updateLoopState(this.audioEngine.getLoop()),this.ui.updateShuffleState(this.audioEngine.isShuffle()),this.ui.renderPlaylist(this.audioEngine.getPlaylist(),this.audioEngine.getCurrentIndex());const s=this.audioEngine.getCurrentTrack();s&&(this.ui.updateTrackInfo(s),this.ui.renderPlaylist(this.audioEngine.getPlaylist(),this.audioEngine.getCurrentIndex())),this.boundKeyHandler=this.handleKeyDown.bind(this),this.container.tabIndex=this.container.tabIndex>=0?this.container.tabIndex:0,this.container.addEventListener("keydown",this.boundKeyHandler)}handleKeyDown(e){var a;const r=e.composedPath?e.composedPath():[],t=r.length>0?r[0]:e.target,s=((a=this.shadow)==null?void 0:a.activeElement)||document.activeElement,o=l=>{if(!l)return!1;const h=l.tagName;return h==="INPUT"||h==="TEXTAREA"||h==="SELECT"||l.isContentEditable};if(!(o(t)||o(s)))if(e.code==="Space"){if((t==null?void 0:t.tagName)==="BUTTON"||(s==null?void 0:s.tagName)==="BUTTON")return;e.preventDefault(),this.toggle()}else e.key==="ArrowRight"&&!e.shiftKey?(e.preventDefault(),this.seek(this.audioEngine.getCurrentTime()+5)):e.key==="ArrowLeft"&&!e.shiftKey?(e.preventDefault(),this.seek(this.audioEngine.getCurrentTime()-5)):e.key==="ArrowUp"?(e.preventDefault(),this.setVolume(this.audioEngine.getVolume()+.05)):e.key==="ArrowDown"&&(e.preventDefault(),this.setVolume(this.audioEngine.getVolume()-.05))}async play(){await this.audioEngine.play()}pause(){this.audioEngine.pause()}toggle(){this.audioEngine.toggle()}next(){this.audioEngine.next()}prev(){this.audioEngine.prev()}seek(e){this.audioEngine.seek(e)}setVolume(e){this.audioEngine.setVolume(e),this.ui.updateVolume(this.audioEngine.getVolume(),this.audioEngine.isMuted())}loadTrack(e,r=!1){this.audioEngine.loadTrack(e,r)}addTrack(e,r=!1){const t=this.audioEngine.addTrack(e,r);return this.ui.renderPlaylist(this.audioEngine.getPlaylist(),this.audioEngine.getCurrentIndex()),t}addTracks(e,r=!1){this.audioEngine.addTracks(e,r),this.ui.renderPlaylist(this.audioEngine.getPlaylist(),this.audioEngine.getCurrentIndex())}async addTrackFromFile(e,r=!1){const t=URL.createObjectURL(e),s=e.name.replace(/\.[^/.]+$/,""),o={id:`local-${Date.now()}-${Math.random().toString(36).substring(2,7)}`,title:s,artist:"Local Audio File",src:t};try{const a=await this.probeAudioDuration(t);a>0&&(o.duration=a)}catch{}return this.addTrack(o,r),o}async addTrackFromFiles(e,r=!1){const t=Array.from(e),s=[];for(let o=0;o<t.length;o++){const a=t[o],l=r&&o===0,h=await this.addTrackFromFile(a,l);s.push(h)}return s}async addTrackFromUrl(e,r={},t=!1){var a,l;let s="Online Track";try{const p=new URL(e).pathname,g=p.substring(p.lastIndexOf("/")+1);g&&(s=decodeURIComponent(g).replace(/\.[^/.]+$/,""))}catch{}const o={id:r.id||`url-${Date.now()}-${Math.random().toString(36).substring(2,7)}`,title:((a=r.title)==null?void 0:a.trim())||s,artist:((l=r.artist)==null?void 0:l.trim())||"Audio Stream",album:r.album,coverArt:r.coverArt,src:e,duration:r.duration};if(!o.duration)try{const h=await this.probeAudioDuration(e);h>0&&(o.duration=h)}catch{}return this.addTrack(o,t),o}removeTrack(e){this.audioEngine.removeTrack(e),this.ui.renderPlaylist(this.audioEngine.getPlaylist(),this.audioEngine.getCurrentIndex());const r=this.audioEngine.getCurrentTrack();r?this.ui.updateTrackInfo(r):this.ui.updateTrackInfo({title:"No Track Loaded",src:""})}getPlaylist(){return this.audioEngine.getPlaylist()}probeAudioDuration(e){return new Promise(r=>{const t=new Audio;let s=!1;const o=h=>{s||(s=!0,t.removeEventListener("loadedmetadata",a),t.removeEventListener("error",l),t.src="",r(h))},a=()=>{const h=t.duration;o(h&&!isNaN(h)&&isFinite(h)?h:0)},l=()=>o(0);t.addEventListener("loadedmetadata",a),t.addEventListener("error",l),t.src=e,setTimeout(()=>o(0),3e3)})}setTheme(e){if(e.variant){const r=E[e.variant]||E["horeg-classic"];this.theme={...r,...e}}else this.theme={...this.theme,...e};this.styleEl.textContent=L(this.theme),this.theme.enableEqAnimation!==void 0&&this.visualizer.setEnabled(this.theme.enableEqAnimation)}getTheme(){return{...this.theme}}getAudioEngine(){return this.audioEngine}destroy(){this.container.removeEventListener("keydown",this.boundKeyHandler),this.audioEngine.destroy(),this.visualizer.destroy(),this.ui.destroy(),this.shadow.innerHTML=""}}C.HoregAudio=C;C.default=C;C.THEME_PRESETS=E;C.generateStyles=L;exports.HoregAudio=C;exports.THEME_PRESETS=E;exports.default=C;exports.generateStyles=L;module.exports=Object.assign(exports.default||exports.HoregAudio,exports);
 //# sourceMappingURL=horeg-audio.cjs.map