.buba-clean-player{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid #ddd;border-radius:12px;max-width:680px}.buba-clean-play{width:48px;height:48px;border-radius:50%;border:0;font-size:20px;cursor:pointer}.buba-clean-meta{display:flex;flex-direction:column;min-width:0;flex:1}.buba-clean-title,.buba-clean-artist,.buba-clean-status{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.buba-clean-status{opacity:.7}.buba-clean-vol{width:120px}
.buba-clean-native-audio{
 position:absolute!important;
 width:1px!important;
 height:1px!important;
 opacity:.001!important;
 pointer-events:none!important;
 overflow:hidden!important;
 left:-2px!important;
 bottom:-2px!important;
}
.buba-clean-player{position:relative}



/* =========================================================
 * Buba Player Clean 0.3.1 v004 — Hero / Radio Buba refined
 * ========================================================= */

.buba-clean-layout-hero{
  position:relative;
  width:100%;
  min-height:430px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:42px 44px 38px;
  border:1px solid rgba(255,117,49,.28);
  border-radius:26px;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 38%,rgba(255,120,24,.16),transparent 17%),
    radial-gradient(circle at 50% 50%,rgba(162,28,13,.14),transparent 48%),
    repeating-radial-gradient(circle at 50% 48%,
      transparent 0 73px,
      rgba(255,123,28,.14) 74px 75px,
      transparent 76px 149px);
  color:#fff;
  box-sizing:border-box;
}

.buba-clean-layout-hero .buba-clean-live{
  position:absolute;
  top:28px;
  right:28px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 13px;
  border:1px solid rgba(255,83,57,.45);
  border-radius:999px;
  color:#ff8069;
  background:rgba(15,10,12,.58);
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
}

.buba-clean-layout-hero .buba-clean-live i{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#ff4938;
  box-shadow:0 0 12px rgba(255,73,56,.8);
}

/* The orange disc replaces the original B emblem exactly. */
.buba-clean-layout-hero .buba-clean-hero-play{
  position:relative;
  width:118px;
  height:118px;
  flex:0 0 118px;
  margin:0 0 16px;
  padding:0;
  border:1px solid rgba(255,188,75,.68);
  border-radius:50%;
  background:radial-gradient(circle at 37% 28%,#ffad2d,#ff741b 50%,#e73c20 92%);
  color:#fff;
  box-shadow:
    0 0 0 9px rgba(255,113,22,.055),
    0 14px 42px rgba(224,54,20,.27);
  cursor:pointer;
  overflow:hidden;
  transition:transform .18s ease,box-shadow .18s ease;
}

.buba-clean-layout-hero .buba-clean-hero-play:hover{
  transform:scale(1.035);
  box-shadow:
    0 0 0 9px rgba(255,113,22,.075),
    0 17px 48px rgba(224,54,20,.35);
}

/* Clear outlined play triangle, centered and recognisable as a button. */
.buba-clean-layout-hero .buba-clean-play-symbol{
  position:absolute;
  inset:0;
}

.buba-clean-layout-hero .buba-clean-play-symbol::before{
  content:"";
  position:absolute;
  left:43px;
  top:34px;
  width:0;
  height:0;
  border-top:24px solid transparent;
  border-bottom:24px solid transparent;
  border-left:36px solid #fff;
  filter:drop-shadow(0 1px 0 rgba(0,0,0,.22));
}

/* When playing, keep the orange disc but show a compact pause badge,
   not two oversized bars floating in the disc. */
.buba-clean-layout-hero .buba-clean-hero-play.is-playing .buba-clean-play-symbol::before{
  left:38px;
  top:35px;
  width:42px;
  height:48px;
  border:0;
  border-radius:12px;
  background:rgba(255,255,255,.96);
  box-shadow:0 2px 8px rgba(0,0,0,.18);
}

.buba-clean-layout-hero .buba-clean-hero-play.is-playing .buba-clean-play-symbol::after{
  content:"";
  position:absolute;
  left:48px;
  top:45px;
  width:7px;
  height:28px;
  border-radius:2px;
  background:#ee5c20;
  box-shadow:15px 0 0 #ee5c20;
}

.buba-clean-layout-hero .buba-clean-brand{
  margin:0 0 18px;
  color:#ff8a3d;
  text-transform:uppercase;
  font-size:12px;
  font-weight:950;
  letter-spacing:.19em;
}

.buba-clean-layout-hero .buba-clean-hero-meta{
  width:100%;
  max-width:660px;
  min-height:104px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  text-align:center;
  gap:0;
}

.buba-clean-layout-hero .buba-clean-title{
  display:block;
  color:#fff;
  font-size:clamp(34px,3.7vw,54px);
  line-height:1.03;
  font-weight:950;
  letter-spacing:-.045em;
}

.buba-clean-layout-hero .buba-clean-artist{
  display:block;
  margin-top:8px;
  color:#c9c9cf;
  font-size:18px;
  line-height:1.35;
  font-weight:650;
}

/* Hero is intentionally minimal: no volume, progress, sync or status copy. */
.buba-clean-layout-hero .buba-clean-vol,
.buba-clean-layout-hero .buba-clean-status{
  display:none!important;
}

@media(max-width:600px){
  .buba-clean-layout-hero{
    min-height:360px;
    padding:34px 18px 28px;
    border-radius:20px;
  }
  .buba-clean-layout-hero .buba-clean-live{
    top:18px;
    right:18px;
  }
  .buba-clean-layout-hero .buba-clean-hero-play{
    width:96px;
    height:96px;
    flex-basis:96px;
  }
  .buba-clean-layout-hero .buba-clean-play-symbol::before{
    left:35px;
    top:28px;
    border-top-width:20px;
    border-bottom-width:20px;
    border-left-width:30px;
  }
  .buba-clean-layout-hero .buba-clean-hero-play.is-playing .buba-clean-play-symbol::before{
    left:30px;
    top:28px;
    width:36px;
    height:40px;
    border-radius:10px;
  }
  .buba-clean-layout-hero .buba-clean-hero-play.is-playing .buba-clean-play-symbol::after{
    left:39px;
    top:37px;
    width:6px;
    height:22px;
    box-shadow:12px 0 0 #ee5c20;
  }
  .buba-clean-layout-hero .buba-clean-title{font-size:32px}
  .buba-clean-layout-hero .buba-clean-artist{font-size:15px}
}


/* =========================================================
 * Buba Player Clean 0.3.2 v005 — ON AIR state refinement
 * ========================================================= */

/* Default/off state: dark and quiet. */
.buba-clean-layout-hero .buba-clean-live{
  color:#85878d!important;
  background:rgba(8,9,12,.84)!important;
  border-color:#22252b!important;
  box-shadow:none!important;
}
.buba-clean-layout-hero .buba-clean-live i{
  background:#4a4d54!important;
  box-shadow:none!important;
}

/* Real playback active: white text + green live dot. */
.buba-clean-layout-hero.is-playing .buba-clean-live{
  color:#fff!important;
  background:rgba(8,10,10,.82)!important;
  border-color:#34383d!important;
}
.buba-clean-layout-hero.is-playing .buba-clean-live i{
  background:#49d46d!important;
  box-shadow:0 0 0 3px rgba(73,212,109,.10),0 0 12px rgba(73,212,109,.55)!important;
}

/* v006: Hero track metadata constrained to the card; cover is metadata-only. */
.buba-clean-layout-hero{box-sizing:border-box;min-width:0}
.buba-clean-layout-hero .buba-clean-track{
  display:flex;align-items:center;justify-content:center;gap:20px;
  width:100%;max-width:100%;min-width:0;margin:0 auto;
}
.buba-clean-layout-hero .buba-clean-cover{
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  flex:0 0 clamp(76px,10vw,112px);width:clamp(76px,10vw,112px);
  aspect-ratio:1/1;border-radius:14px;
  border:1px solid rgba(255,138,61,.3);
  background:linear-gradient(135deg,#23170f,#090b10 70%);
}
.buba-clean-layout-hero .buba-clean-cover-image{width:100%;height:100%;display:block;object-fit:cover}
.buba-clean-layout-hero .buba-clean-cover-image[hidden],
.buba-clean-layout-hero .buba-clean-cover-fallback[hidden]{display:none!important}
.buba-clean-layout-hero .buba-clean-cover-fallback{font-size:36px;font-weight:900;color:#ff8a3d}
.buba-clean-layout-hero .buba-clean-hero-meta{
  flex:1 1 0;width:auto;min-width:0;max-width:100%;min-height:0;
  align-items:flex-start;text-align:left;margin:0;
}
.buba-clean-layout-hero .buba-clean-title{
  display:-webkit-box;display:box;max-width:100%;min-width:0;
  white-space:normal!important;overflow:hidden!important;text-overflow:ellipsis;
  overflow-wrap:anywhere;word-break:normal;
  -webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;
  font-size:clamp(25px,3.4vw,45px);line-height:1.07;
}
.buba-clean-layout-hero .buba-clean-artist{
  display:-webkit-box;max-width:100%;min-width:0;
  white-space:normal!important;overflow:hidden!important;text-overflow:ellipsis;
  overflow-wrap:anywhere;-webkit-box-orient:vertical;-webkit-line-clamp:2;
  font-size:clamp(14px,1.6vw,18px);line-height:1.3;
}
@media(max-width:600px){
 .buba-clean-layout-hero .buba-clean-track{flex-direction:column;gap:12px}
 .buba-clean-layout-hero .buba-clean-cover{flex-basis:auto;width:78px;height:78px}
 .buba-clean-layout-hero .buba-clean-hero-meta{align-items:center;text-align:center;width:100%}
 .buba-clean-layout-hero .buba-clean-title{font-size:clamp(21px,6.5vw,32px);-webkit-line-clamp:3;line-clamp:3}
 .buba-clean-layout-hero .buba-clean-artist{font-size:15px}
}

/* v019: visibilita' metadati su smartphone, anche con temi WP esterni. */
@media(max-width:600px){
 .buba-clean-layout-hero .buba-clean-track{display:flex!important;flex-direction:column!important;align-items:center!important;height:auto!important;overflow:visible!important}
 .buba-clean-layout-hero .buba-clean-hero-meta{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;position:relative!important;visibility:visible!important;opacity:1!important;flex:0 1 auto!important;min-height:44px!important;overflow:visible!important}
 .buba-clean-layout-hero .buba-clean-title,.buba-clean-layout-hero .buba-clean-artist{visibility:visible!important;opacity:1!important;position:static!important;width:100%!important;max-width:100%!important;height:auto!important;color:#fff!important;text-align:center!important;white-space:normal!important;overflow-wrap:anywhere!important}
 .buba-clean-layout-hero .buba-clean-title{display:block!important;font-size:clamp(21px,6vw,30px)!important;line-height:1.15!important}
 .buba-clean-layout-hero .buba-clean-artist{display:block!important;font-size:15px!important;line-height:1.3!important;margin-top:5px!important}
}

/* Buba Clean 0.3.19 — browser stream error visibility */
.buba-clean-stream-help:not([hidden]){display:block;margin:.75rem 0;font-size:13px;line-height:1.45}.buba-clean-stream-open{display:inline-block;margin-left:.4em;text-decoration:underline}.buba-clean-layout-hero .buba-clean-status{display:block;text-align:center;font-size:12px;margin:.25rem auto}


/* 0.3.23 — Vinyl is an optional real turntable visualization; Hero remains unchanged. */
.buba-vinyl-disc{display:none}
.buba-clean-layout-vinyl.buba-clean-layout-hero { background:radial-gradient(circle at 50% 27%,rgba(255,125,20,.12),transparent 44%),#0b0b0d; }
.buba-clean-layout-vinyl .buba-clean-hero-play {
 width:172px;height:172px;flex:0 0 172px;margin:2px 0 24px;
 padding:0;border:0;background:transparent;box-shadow:none;overflow:visible;
 position:relative;isolation:isolate;transition:none;
}
.buba-clean-layout-vinyl .buba-clean-hero-play:hover{transform:none;box-shadow:none}
.buba-clean-layout-vinyl .buba-vinyl-disc{
 display:block;position:absolute;inset:0;border-radius:50%;
 border:5px solid #0b0b0b;
 background: repeating-radial-gradient(circle at center,#111 0 2px,#292929 3px 4px,#151515 5px 8px);
 box-shadow:0 0 0 3px #343434,0 0 0 7px rgba(255,119,15,.12),0 17px 37px rgba(0,0,0,.65);
}
.buba-clean-layout-vinyl .buba-vinyl-disc::after{
 content:"";position:absolute;inset:36%;border-radius:50%;
 background:radial-gradient(circle,#dfbb79 0 8%,#121212 10% 13%,#f99723 15% 68%,#9e4314 70%);
 border:1px solid #e69b47;
}
.buba-clean-layout-vinyl .buba-clean-play-symbol{z-index:2;position:absolute;inset:0;pointer-events:none}
.buba-clean-layout-vinyl .buba-clean-play-symbol::before{
 content:"";position:absolute;left:calc(50% - 7px);top:calc(50% - 11px);
 width:0;height:0;border-top:11px solid transparent;border-bottom:11px solid transparent;
 border-left:18px solid #fff;background:none;filter:drop-shadow(0 1px 2px #000)
}
.buba-clean-layout-vinyl .buba-clean-hero-play.is-playing .buba-vinyl-disc{animation:buba-vinyl-spin 2.6s linear infinite}
.buba-clean-layout-vinyl .buba-clean-hero-play.is-playing .buba-clean-play-symbol::before{
 content:"";position:absolute;left:calc(50% - 9px);top:calc(50% - 11px);width:6px;height:22px;
 background:#fff;border:0;border-radius:2px;box-shadow:12px 0 #fff;
}
.buba-clean-layout-vinyl .buba-clean-hero-play.is-playing .buba-clean-play-symbol::after{content:none}
.buba-clean-layout-vinyl .buba-clean-stream-help:not([hidden]){
 display:flex;flex-direction:column;align-items:center;gap:3px;
 font-size:11px;line-height:1.25;text-align:center;color:#acabb0;margin:5px auto 0;
}
.buba-clean-layout-vinyl .buba-clean-stream-open{margin:0;color:#ffa44d}
@keyframes buba-vinyl-spin{to{transform:rotate(360deg)}}
@media(max-width:600px){.buba-clean-layout-vinyl .buba-clean-hero-play{width:142px;height:142px;flex-basis:142px}}
@media(prefers-reduced-motion:reduce){.buba-clean-layout-vinyl .buba-clean-hero-play.is-playing .buba-vinyl-disc{animation:none}}

/* 0.3.25: Vinyl overrides inherited hero ring backgrounds and caches */
.buba-clean-layout-vinyl.buba-clean-layout-hero .buba-clean-hero-play{background:none!important;border:0!important;box-shadow:none!important;border-radius:50%!important}
.buba-clean-layout-vinyl .buba-vinyl-disc{display:block!important}
.buba-clean-layout-vinyl .buba-clean-stream-help{max-width:90%;font-size:11px}

/* 0.3.26: full turntable instead of a record-themed play button. */
.buba-clean-layout-vinyl.buba-clean-layout-hero{
 background:#0a0b0e!important;min-height:490px;justify-content:center;
}
.buba-clean-layout-vinyl .buba-clean-hero-play{
 width:min(340px,76vw)!important;height:230px!important;flex:0 0 230px!important;
 border-radius:17px!important;margin:0 0 16px!important;background:none!important;
 box-shadow:none!important;overflow:visible!important;
}
.buba-clean-layout-vinyl .buba-turntable-base{
 display:block;position:absolute;inset:4px 10px 4px 10px;
 border:1px solid #5e4840;border-radius:18px;
 background:linear-gradient(145deg,#303034,#15171a 65%,#29211d);
 box-shadow:inset 0 0 0 6px #141416,0 15px 28px #0009;
}
.buba-clean-layout-vinyl .buba-turntable-base:before{
 content:"";position:absolute;left:10px;top:10px;bottom:10px;
 aspect-ratio:1;border-radius:50%;border:5px solid #0a0b0d;
 background:radial-gradient(circle,#181818 0 8%,#343434 9%,#161616 11%,#222 70%,#111 72%);
 box-shadow:0 0 0 2px #484848;
}
.buba-clean-layout-vinyl .buba-vinyl-disc{
 display:block!important;position:absolute;inset:auto!important;
 width:186px;height:186px;left:17px;top:15px;border:2px solid #292929;
 box-sizing:border-box;border-radius:50%;
 background:repeating-radial-gradient(circle at center,#141414 0 3px,#282828 4px 5px,#101010 6px 9px);
 box-shadow:inset 0 0 14px #000,0 0 0 3px #080808;
}
.buba-clean-layout-vinyl .buba-vinyl-disc:after{
 content:"";position:absolute;inset:37%;border-radius:50%;
 background:radial-gradient(circle,#dbdacb 0 4%,#292929 5% 12%,#ee7b1d 13% 75%,#9f3c18 76%);
 border:1px solid #7d3a1a;
}
.buba-clean-layout-vinyl .buba-turntable-arm{
 display:block;position:absolute;right:30px;top:24px;width:88px;height:146px;
 transform-origin:76px 15px;transform:rotate(-13deg);pointer-events:none;
}
.buba-clean-layout-vinyl .buba-turntable-arm:before{
 content:"";position:absolute;right:3px;top:0;width:23px;height:23px;border-radius:50%;
 background:radial-gradient(circle,#b3b1ab 0 29%,#35383d 30% 75%,#0e1013 76%);
 box-shadow:0 0 0 3px #0d0e10;
}
.buba-clean-layout-vinyl .buba-turntable-arm:after{
 content:"";position:absolute;right:12px;top:16px;width:8px;height:118px;
 transform:rotate(34deg);transform-origin:top center;
 border-radius:5px;background:linear-gradient(90deg,#535860,#d7d6d1,#777c83);
 box-shadow:0 4px 8px #0008;
}
.buba-clean-layout-vinyl .buba-clean-play-symbol{position:absolute;left:92px;top:88px;width:42px;height:42px;inset:auto;z-index:3;background:#e8771f;border:2px solid #f6aa5e;border-radius:50%;box-shadow:0 2px 12px #0009;}
.buba-clean-layout-vinyl .buba-clean-play-symbol:before{left:16px!important;top:11px!important;border-top:8px solid transparent!important;border-bottom:8px solid transparent!important;border-left:12px solid #fff!important;width:0!important;height:0!important;background:none!important;box-shadow:none!important;}
.buba-clean-layout-vinyl .buba-clean-hero-play.is-playing .buba-clean-play-symbol:before{left:13px!important;top:11px!important;border:0!important;width:5px!important;height:16px!important;background:white!important;box-shadow:9px 0 white!important;}
.buba-clean-layout-vinyl .buba-clean-hero-play.is-playing .buba-vinyl-disc{animation:buba-vinyl-spin 2.8s linear infinite;}
.buba-clean-layout-vinyl .buba-clean-stream-help:not([hidden]){display:none!important}
.buba-clean-layout-vinyl .buba-clean-status{font-size:11px;opacity:.6}
@media(max-width:520px){.buba-clean-layout-vinyl .buba-clean-hero-play{transform:scale(.82);margin:-17px 0!important}.buba-clean-layout-vinyl .buba-clean-hero-play:hover{transform:scale(.82)}}
@media(prefers-reduced-motion:reduce){.buba-clean-layout-vinyl .buba-clean-hero-play.is-playing .buba-vinyl-disc{animation:none!important}}
