.bpp{--accent:#35e06f;--equalizer:#35e06f;position:relative;width:100%;max-width:1500px;margin:24px auto;color:#f7f8f8;background:radial-gradient(circle at 18% 10%,color-mix(in srgb,var(--accent) 11%,transparent),transparent 35%),linear-gradient(145deg,#080a0b,#111416 60%,#080a0b);border:1px solid #ffffff16;border-radius:28px;overflow:hidden;box-shadow:0 30px 90px #000b;font-family:Inter,Arial,sans-serif}.bpp *{box-sizing:border-box}.bpp-top{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 26px;border-bottom:1px solid #ffffff12;background:#090b0ce8}.bpp-station,.bpp-brand{display:flex;align-items:center;gap:12px;min-width:0}.bpp-station strong,.bpp-brand strong{font-size:16px;letter-spacing:.04em;white-space:nowrap}.bpp-station small,.bpp-brand small{color:#a7adb1;font-size:11px;letter-spacing:.12em}.bpp-brand{flex-direction:column;align-items:flex-end;gap:3px}.bpp-brand strong{font-size:20px}.bpp-brand small{color:var(--accent);font-weight:800}.bpp-live{font-size:11px;font-weight:900;color:#9ea4a7}.bpp.is-live .bpp-live{color:var(--accent);text-shadow:0 0 12px color-mix(in srgb,var(--accent) 70%,transparent)}
.bpp-main{display:grid;grid-template-columns:minmax(190px,270px) minmax(0,1fr) minmax(220px,300px);gap:30px;align-items:center;padding:34px}.bpp-coverbox{position:relative;min-width:0;width:100%;aspect-ratio:1;border-radius:24px;overflow:hidden;background:#15191b;border:1px solid #ffffff17;box-shadow:0 18px 45px #0008}.bpp-cover{width:100%;height:100%;display:block;object-fit:cover;transition:opacity .35s ease,transform .5s ease}.bpp-cover.changing{opacity:.22;transform:scale(.97)}.bpp-info{min-width:0}.bpp-kicker{display:inline-block;margin-bottom:14px;padding:7px 11px;border-radius:999px;background:color-mix(in srgb,var(--accent) 12%,transparent);border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);color:var(--accent);font-size:11px;font-weight:900;letter-spacing:.18em}.bpp-song-fixed{position:relative;overflow:hidden;min-height:2.35em}.bpp-song{display:-webkit-box;max-width:100%;margin:0;font-size:clamp(21px,1.85vw,31px);line-height:1.16;letter-spacing:-.018em;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;text-overflow:ellipsis;overflow-wrap:anywhere}.bpp-marquee{position:relative;overflow:hidden;white-space:nowrap;padding-inline:1px}.bpp-artist{display:inline-block;width:max-content;min-width:max-content;margin:9px 0 0;color:var(--accent);font-size:clamp(15px,1.25vw,19px);font-weight:650;letter-spacing:.01em;will-change:transform;transform:translate3d(0,0,0)}.bpp-artist-marquee.is-moving .bpp-artist{animation:bppMarquee var(--marquee-duration,10s) ease-in-out infinite;animation-delay:.65s}.bpp-station-meta{margin-top:16px;padding:11px 13px;border-left:3px solid var(--accent);border-radius:0 12px 12px 0;background:#ffffff07}.bpp-station-meta strong,.bpp-station-meta small{display:block}.bpp-station-meta strong{font-size:15px;color:#fff}.bpp-station-meta small{margin-top:3px;color:#9ca4a8;font-size:12px}.bpp-status{margin:9px 0 0;color:#8f989d;font-size:12px}.bpp-controls{display:grid;grid-template-columns:auto auto minmax(120px,1fr) auto;gap:14px;align-items:center;margin-top:24px;max-width:620px}.bpp-play{width:74px;height:74px;border:0;border-radius:50%;cursor:pointer;background:var(--accent);color:#071009;font-size:27px;font-weight:900;box-shadow:0 0 0 7px color-mix(in srgb,var(--accent) 12%,transparent),0 15px 35px color-mix(in srgb,var(--accent) 30%,transparent);transition:transform .2s ease}.bpp-play:hover{transform:scale(1.045)}.bpp-speaker{opacity:.8}.bpp-volume{width:100%;accent-color:var(--accent)}.bpp-share{border:1px solid #ffffff18;border-radius:13px;background:#ffffff0a;color:#fff;padding:12px 15px;cursor:pointer}.bpp-share:hover{border-color:color-mix(in srgb,var(--accent) 45%,transparent)}
.bpp-connect{align-self:stretch;padding:22px;border-radius:22px;border:1px solid #ffffff14;background:linear-gradient(160deg,#ffffff0d,#ffffff05);display:flex;flex-direction:column;justify-content:center}.bpp-connect-head span{display:block;color:var(--accent);font-size:11px;font-weight:900;letter-spacing:.16em}.bpp-connect-head strong{display:block;margin-top:6px;font-size:19px}.bpp-apps{display:grid;gap:10px;margin-top:18px}.bpp-store{display:flex;align-items:center;gap:11px;padding:11px 12px;border:1px solid #ffffff13;border-radius:14px;background:#07090a;color:#fff;text-decoration:none}.bpp-store:hover{border-color:color-mix(in srgb,var(--accent) 45%,transparent)}.bpp-store .bpp-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--accent);color:#061009;font-weight:900}.bpp-store small,.bpp-store strong{display:block}.bpp-store small{color:#8e969a;font-size:10px}.bpp-store strong{font-size:13px}.bpp-socials{display:flex;flex-wrap:wrap;gap:9px;margin-top:18px}.bpp-socials a{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;border:1px solid #ffffff16;background:#ffffff09;color:#fff;text-decoration:none;font-weight:900;transition:transform .2s ease,border-color .2s ease,background .2s ease}.bpp-socials a:hover{transform:translateY(-2px);border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,#ffffff09)}.bpp-socials a .bpp-icon{display:grid;place-items:center;width:20px;height:20px}.bpp-socials a svg{width:20px;height:20px;display:block;fill:currentColor}.bpp-socials a span:last-child{display:none}.bpp-empty{margin-top:18px;color:#8f989d;font-size:13px}
.bpp-eq-wrap{padding:12px 24px 19px;border-top:1px solid #ffffff0d;background:#050607}.bpp-eq-label{display:flex;justify-content:space-between;color:#8f989d;font-size:10px;letter-spacing:.14em}.bpp-eq{display:flex;align-items:end;gap:3px;height:126px;margin-top:9px}.bpp-eq i{flex:1;min-width:2px;height:100%;transform-origin:bottom;transform:scaleY(.12);border-radius:5px 5px 2px 2px;background:linear-gradient(to top,#ff4338 0 9%,#ffb300 27%,var(--equalizer) 70%,#eaffef 100%);opacity:.45;transition:transform .055s linear,opacity .055s linear}
.bpp-theme-ocean{--accent:#28a9ff}.bpp-theme-fire{--accent:#ff4d46}.bpp-theme-royal{--accent:#9a6cff}.bpp-theme-romantic{--accent:#ff5ea8}.bpp-theme-golden{--accent:#ffc54a}.bpp-theme-silver{--accent:#c7d0d8}
@keyframes bppMarquee{0%,18%{transform:translate3d(0,0,0)}82%,100%{transform:translate3d(var(--marquee-distance,-180px),0,0)}}
@media(max-width:1050px){.bpp-main{grid-template-columns:240px 1fr}.bpp-connect{grid-column:1/-1;display:grid;grid-template-columns:1fr 1.4fr;gap:20px}.bpp-apps{grid-template-columns:repeat(3,1fr);margin-top:0}}
@media(max-width:720px){.bpp{border-radius:20px}.bpp-top{padding:15px 16px;align-items:flex-start}.bpp-station small{display:none}.bpp-brand strong{font-size:14px}.bpp-brand small{font-size:9px}.bpp-main{grid-template-columns:1fr;padding:22px 16px;gap:22px}.bpp-coverbox{width:min(82vw,310px);margin:auto}.bpp-song{font-size:26px}.bpp-controls{grid-template-columns:auto auto 1fr}.bpp-share{grid-column:1/-1}.bpp-connect{grid-column:auto;display:block}.bpp-apps{grid-template-columns:1fr}.bpp-eq{height:92px}.bpp-eq-wrap{padding-inline:14px}}
@media(prefers-reduced-motion:reduce){.bpp *{transition:none!important}.bpp-eq i{animation:none!important}}

/* Enterprise Beta 3: portada visible y titulo fijo */
.bpp-song-fixed{width:100%;max-width:100%;overflow:hidden}
.bpp-song{width:100%;max-width:100%;white-space:normal;overflow:hidden;text-overflow:ellipsis}
.bpp-credit{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 22px;padding:13px 18px 15px;border-top:1px solid #ffffff0d;background:#030504;color:#aeb8b2;font-size:12px;text-align:center}.bpp-credit strong{color:#fff}.bpp-credit small{width:100%;color:var(--accent);letter-spacing:.08em;text-transform:uppercase}
@media(max-width:1200px){.bpp-main{grid-template-columns:minmax(190px,250px) minmax(0,1fr)}.bpp-connect{grid-column:1/-1;display:grid;grid-template-columns:minmax(180px,.8fr) minmax(0,1.2fr);gap:20px}.bpp-apps{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:0}}
@media(max-width:760px){.bpp-main{grid-template-columns:minmax(0,1fr)}.bpp-coverbox{width:min(82vw,320px);margin-inline:auto}.bpp-connect{grid-column:auto;display:block}.bpp-apps{grid-template-columns:1fr}.bpp-song{white-space:normal}}

/* Enterprise Beta 4: estabilidad visual, carátula precargada y ecualizador ultra wide */
.bpp-song,.bpp-artist{transition:opacity .22s ease}
.bpp-coverbox::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 1px #ffffff12}
.bpp-eq-wrap{width:100%}
.bpp-eq{width:100%;overflow:hidden}
.bpp-eq i{min-width:1px}
.bpp-cover-medium .bpp-main{grid-template-columns:minmax(170px,220px) minmax(0,1fr) minmax(220px,300px)}
.bpp-cover-xl .bpp-main{grid-template-columns:minmax(230px,310px) minmax(0,1fr) minmax(220px,300px)}
@media(max-width:1200px){.bpp-cover-medium .bpp-main,.bpp-cover-xl .bpp-main{grid-template-columns:minmax(190px,250px) minmax(0,1fr)}}
@media(max-width:760px){.bpp-cover-medium .bpp-main,.bpp-cover-xl .bpp-main{grid-template-columns:minmax(0,1fr)}.bpp-eq{gap:2px}}

/* Enterprise Beta 5: acabado premium, brillo dinámico y transiciones suaves */
.bpp{isolation:isolate;background:radial-gradient(circle at 14% 12%,color-mix(in srgb,var(--accent) 15%,transparent),transparent 34%),radial-gradient(circle at 78% 82%,color-mix(in srgb,var(--accent) 7%,transparent),transparent 38%),linear-gradient(145deg,#07090a,#111517 58%,#07090a)}
.bpp::before{content:"";position:absolute;inset:-35%;z-index:-1;pointer-events:none;background:conic-gradient(from 180deg,transparent,color-mix(in srgb,var(--accent) 8%,transparent),transparent 32%);filter:blur(45px);opacity:.55;animation:bppAmbient 14s linear infinite}
.bpp-coverbox{overflow:visible;transition:transform .4s ease,box-shadow .4s ease}
.bpp-coverbox::before{content:"";position:absolute;inset:-7px;z-index:-1;border-radius:29px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 75%,#fff 8%),transparent 42%,color-mix(in srgb,var(--accent) 38%,transparent));filter:blur(13px);opacity:.18;transform:scale(.98);transition:opacity .35s ease,transform .35s ease}
.bpp.playing .bpp-coverbox::before{opacity:.68;transform:scale(1.015);animation:bppCoverPulse 2.8s ease-in-out infinite}
.bpp.playing .bpp-coverbox{box-shadow:0 22px 58px #000b,0 0 35px color-mix(in srgb,var(--accent) 17%,transparent)}
.bpp-cover{border-radius:inherit;filter:saturate(1.04) contrast(1.02)}
.bpp-cover.changing{opacity:.08;transform:scale(.945);filter:blur(5px) saturate(.8)}
.bpp-song{font-weight:850;text-wrap:balance;text-shadow:0 2px 18px #0008}
.bpp-artist{font-weight:800;text-shadow:0 0 18px color-mix(in srgb,var(--accent) 28%,transparent)}
.bpp-kicker::before{content:"●";margin-right:7px;font-size:9px;vertical-align:1px}.bpp.is-live .bpp-kicker{box-shadow:0 0 22px color-mix(in srgb,var(--accent) 20%,transparent)}
.bpp-play{position:relative;overflow:visible}.bpp-play::after{content:"";position:absolute;inset:-10px;border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);border-radius:50%;opacity:0;transform:scale(.85)}
.bpp.playing .bpp-play::after{animation:bppPlayRing 2.25s ease-out infinite}
.bpp-play:hover{transform:translateY(-2px) scale(1.055);box-shadow:0 0 0 8px color-mix(in srgb,var(--accent) 14%,transparent),0 18px 42px color-mix(in srgb,var(--accent) 38%,transparent)}
.bpp-share,.bpp-store,.bpp-socials a{transition:transform .22s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease}
.bpp-share:hover,.bpp-store:hover{transform:translateY(-2px);box-shadow:0 12px 26px #0007}
.bpp-connect{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:inset 0 1px 0 #ffffff0b,0 18px 45px #0004}
.bpp-eq{filter:drop-shadow(0 0 8px color-mix(in srgb,var(--equalizer) 20%,transparent))}
.bpp-eq i{transition:transform .07s cubic-bezier(.2,.8,.2,1),opacity .07s linear;will-change:transform}
@keyframes bppAmbient{to{transform:rotate(360deg)}}
@keyframes bppCoverPulse{0%,100%{filter:blur(13px);opacity:.46}50%{filter:blur(17px);opacity:.78}}
@keyframes bppPlayRing{0%{opacity:.75;transform:scale(.82)}80%,100%{opacity:0;transform:scale(1.32)}}
@media(max-width:760px){.bpp::before{display:none}.bpp-coverbox{overflow:visible}.bpp-song{font-size:clamp(24px,8vw,30px)}.bpp-artist{font-size:clamp(16px,5vw,20px)}.bpp-controls{gap:11px}.bpp-play{width:68px;height:68px}.bpp-eq{height:105px}}
@media(prefers-reduced-motion:reduce){.bpp::before,.bpp-coverbox::before,.bpp-play::after{animation:none!important}}


/* Enterprise RC1: artista completo, desplazamiento seguro y acabado estable */
.bpp-artist-marquee{width:100%;max-width:100%;min-height:2.15em;display:flex;align-items:flex-start;overflow:hidden}
.bpp-artist{max-width:none;line-height:1.35;padding:1px 12px 4px 0;transform:translate3d(0,0,0);backface-visibility:hidden}
.bpp-artist-marquee:not(.is-moving) .bpp-artist{width:auto;min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bpp-song-fixed{min-height:2.45em}
.bpp-eq i{transform-origin:50% 100%}
@media(max-width:760px){.bpp-artist-marquee{min-height:2.3em}.bpp-artist{padding-right:10px}}

/* Enterprise RC2: ecualizador de barras finas */
.bpp-eq{
  justify-content:space-between;
  gap:0;
}
.bpp-eq i{
  flex:0 0 2px;
  width:2px;
  min-width:2px;
  max-width:2px;
  border-radius:2px 2px 1px 1px;
}
@media(max-width:760px){
  .bpp-eq i{flex-basis:1.5px;width:1.5px;min-width:1.5px;max-width:1.5px}
}


/* Enterprise 1.0 Final: artista sin recortes e indicador LIVE HD */
.bpp-artist-marquee.is-moving .bpp-artist{animation:none!important}
.bpp-status{display:flex;align-items:center;gap:8px;font-weight:800;letter-spacing:.045em}
.bpp.is-live .bpp-status{color:var(--accent);text-shadow:0 0 12px color-mix(in srgb,var(--accent) 40%,transparent)}
.bpp.is-live .bpp-status::before{content:"";width:8px;height:8px;flex:0 0 8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 55%,transparent);animation:bppLivePulse 1.55s ease-out infinite}
@keyframes bppLivePulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 55%,transparent)}70%{box-shadow:0 0 0 9px transparent}100%{box-shadow:0 0 0 0 transparent}}
@media(prefers-reduced-motion:reduce){.bpp.is-live .bpp-status::before{animation:none!important}}


/* Enterprise 1.0.1: botones de tiendas con estilo oficial y mayor presencia */
.bpp-connect-head span{letter-spacing:.14em}
.bpp-apps{gap:12px}
.bpp-store-badge{
  min-height:58px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:9px 14px;
  border:1px solid #ffffff38;
  border-radius:11px;
  background:linear-gradient(180deg,#111,#030303);
  color:#fff;
  text-decoration:none;
  box-shadow:inset 0 1px 0 #ffffff14,0 9px 22px #0006;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,filter .22s ease;
}
.bpp-store-badge:hover{
  transform:translateY(-2px) scale(1.015);
  border-color:color-mix(in srgb,var(--accent) 65%,#fff 20%);
  box-shadow:inset 0 1px 0 #ffffff20,0 14px 30px #0009,0 0 22px color-mix(in srgb,var(--accent) 18%,transparent);
  filter:brightness(1.08);
}
.bpp-store-badge-icon{width:34px;height:34px;display:grid;place-items:center;flex:0 0 34px}
.bpp-store-badge-icon svg{display:block;width:100%;height:100%}
.bpp-apple-badge .bpp-store-badge-icon{width:31px;height:31px;flex-basis:31px}
.bpp-store-badge-copy{display:block;line-height:1;min-width:0}
.bpp-store-badge-copy small{display:block;margin-bottom:3px;color:#fff;font-size:9px;font-weight:600;letter-spacing:.06em;white-space:nowrap}
.bpp-store-badge-copy strong{display:block;color:#fff;font-size:20px;font-weight:650;letter-spacing:-.035em;white-space:nowrap}
.bpp-apple-badge .bpp-store-badge-copy strong{font-size:21px}
.bpp-apps .bpp-store{min-height:58px}
@media(max-width:1200px){.bpp-store-badge-copy strong{font-size:18px}.bpp-apple-badge .bpp-store-badge-copy strong{font-size:19px}}
@media(max-width:760px){.bpp-store-badge{min-height:62px;padding:10px 16px}.bpp-store-badge-copy strong{font-size:21px}.bpp-apple-badge .bpp-store-badge-copy strong{font-size:22px}}


/* Enterprise 1.0.2: encabezados animados, audífonos y tarjeta Alexa */
.bpp-connect{overflow:hidden;position:relative}
.bpp-connect::before{content:"";position:absolute;inset:-45% auto -45% -40%;width:34%;background:linear-gradient(90deg,transparent,#ffffff12,transparent);transform:skewX(-18deg);animation:bppPanelShine 8s ease-in-out infinite;pointer-events:none}
.bpp-connect-head{position:relative;z-index:1;text-align:center}
.bpp-connect-head span{position:relative;display:inline-block;background:linear-gradient(90deg,var(--accent) 0%,#fff 45%,var(--accent) 70%);background-size:230% auto;color:transparent;-webkit-background-clip:text;background-clip:text;animation:bppTextShine 4.8s linear infinite;text-shadow:0 0 18px color-mix(in srgb,var(--accent) 28%,transparent)}
.bpp-connect-head strong{animation:bppListenFloat 3.4s ease-in-out infinite;text-shadow:0 0 14px #ffffff12}
.bpp-headphones{position:relative;z-index:1;height:84px;margin:10px auto 4px;display:flex;align-items:center;justify-content:center;gap:6px;color:var(--accent)}
.bpp-headphones svg{width:84px;height:84px;overflow:visible;filter:drop-shadow(0 0 10px color-mix(in srgb,var(--accent) 34%,transparent));animation:bppHeadphoneBreathe 2.8s ease-in-out infinite;transform-origin:center}
.bpp-hp-band,.bpp-hp-detail{fill:none;stroke:currentColor;stroke-width:7;stroke-linecap:round;stroke-linejoin:round}
.bpp-hp-detail{stroke-width:5;opacity:.8}
.bpp-hp-cup{fill:color-mix(in srgb,var(--accent) 22%,#080a09);stroke:currentColor;stroke-width:5}
.bpp-wave{width:24px;height:54px;display:flex;align-items:center;justify-content:center;gap:3px;opacity:.55}
.bpp-wave i{display:block;width:3px;border-radius:999px;background:currentColor;box-shadow:0 0 8px currentColor;animation:bppWave 1.15s ease-in-out infinite;animation-play-state:paused}
.bpp-wave i:nth-child(1){height:13px}.bpp-wave i:nth-child(2){height:27px;animation-delay:.12s}.bpp-wave i:nth-child(3){height:40px;animation-delay:.24s}
.bpp-wave-left{transform:scaleX(-1)}
.bpp.playing .bpp-wave i{animation-play-state:running}.bpp:not(.playing) .bpp-wave{opacity:.23}
.bpp-alexa-card{min-height:58px;display:flex;align-items:center;gap:12px;padding:9px 14px;border:1px solid #55d9ff55;border-radius:11px;background:linear-gradient(135deg,#07141c,#090711);color:#fff;text-decoration:none;box-shadow:inset 0 1px 0 #ffffff12,0 9px 22px #0006;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,filter .22s ease}
.bpp-alexa-card:hover{transform:translateY(-2px) scale(1.015);border-color:#65e7ff;box-shadow:0 14px 30px #0009,0 0 24px #55d9ff30;filter:brightness(1.08)}
.bpp-alexa-icon{width:36px;height:36px;display:grid;place-items:center;flex:0 0 36px;animation:bppAlexaPulse 2.8s ease-in-out infinite}
.bpp-alexa-icon svg{display:block;width:100%;height:100%}.bpp-alexa-card small{display:block;color:#aab7c1;font-size:8px;font-weight:700;letter-spacing:.08em}.bpp-alexa-card strong{display:block;margin-top:2px;font-size:20px;line-height:1}
@keyframes bppTextShine{to{background-position:-230% center}}
@keyframes bppListenFloat{0%,100%{transform:translateY(0);opacity:.88}50%{transform:translateY(-2px);opacity:1}}
@keyframes bppHeadphoneBreathe{0%,100%{transform:scale(.96)}50%{transform:scale(1.04)}}
@keyframes bppWave{0%,100%{transform:scaleY(.45);opacity:.45}50%{transform:scaleY(1.05);opacity:1}}
@keyframes bppAlexaPulse{0%,100%{transform:scale(.96);filter:drop-shadow(0 0 3px #55d9ff55)}50%{transform:scale(1.05);filter:drop-shadow(0 0 10px #55d9ffaa)}}
@keyframes bppPanelShine{0%,68%{left:-40%;opacity:0}76%{opacity:1}92%,100%{left:125%;opacity:0}}
@media(max-width:1200px){.bpp-headphones{height:72px;margin:4px auto}.bpp-headphones svg{width:72px;height:72px}}
@media(max-width:760px){.bpp-headphones{height:82px;margin:9px auto}.bpp-headphones svg{width:82px;height:82px}.bpp-alexa-card{min-height:62px;padding:10px 16px}}
@media(prefers-reduced-motion:reduce){.bpp-connect::before,.bpp-connect-head span,.bpp-connect-head strong,.bpp-headphones svg,.bpp-wave i,.bpp-alexa-icon{animation:none!important}}

/* Enterprise 1.0.3 Compacto: menor altura sin reducir la carátula */
.bpp{margin:16px auto;border-radius:24px}
.bpp-top{padding:12px 22px}
@media (max-width:768px){

    .bpp-brand{
        display:none !important;
    }

    .bpp-top{
        grid-template-columns:1fr !important;
    }

}
.bpp-main{gap:24px;padding:24px 28px}
.bpp-kicker{margin-bottom:9px;padding:6px 10px}
.bpp-song-fixed{min-height:2.2em}
.bpp-artist-marquee{min-height:1.8em}
.bpp-artist{margin-top:5px;line-height:1.25;padding-bottom:2px}
.bpp-station-meta{margin-top:10px;padding:8px 11px}
.bpp-status{margin-top:6px}
.bpp-controls{margin-top:16px}
.bpp-play{width:66px;height:66px;font-size:24px}
.bpp-connect{padding:15px 18px;border-radius:19px}
.bpp-connect-head strong{margin-top:3px;font-size:17px}
.bpp-headphones{height:62px;margin:4px auto 1px}
.bpp-headphones svg{width:62px;height:62px}
.bpp-wave{height:42px}
.bpp-apps{gap:8px;margin-top:9px}
.bpp-store-badge,.bpp-alexa-card{min-height:50px;padding:7px 11px}
.bpp-store-badge-icon{width:29px;height:29px;flex-basis:29px}
.bpp-apple-badge .bpp-store-badge-icon{width:27px;height:27px;flex-basis:27px}
.bpp-store-badge-copy strong,.bpp-apple-badge .bpp-store-badge-copy strong{font-size:17px}
.bpp-alexa-icon{width:30px;height:30px;flex-basis:30px}
.bpp-alexa-card strong{font-size:17px}
.bpp-socials{margin-top:10px}
.bpp-socials a{width:36px;height:36px}
.bpp-eq-wrap{padding:8px 22px 12px}
.bpp-eq{height:82px;margin-top:6px}
.bpp-credit{padding:8px 14px 10px;font-size:11px}

@media(max-width:1200px){
  .bpp-main{padding:22px 24px}
  .bpp-connect{padding:14px 16px}
  .bpp-headphones{height:58px}
  .bpp-headphones svg{width:58px;height:58px}
}
@media(max-width:760px){
  .bpp-top{padding:12px 14px}
  .bpp-main{padding:18px 14px;gap:18px}
  .bpp-coverbox{width:min(78vw,290px)}
  .bpp-controls{margin-top:14px}
  .bpp-play{width:62px;height:62px}
  .bpp-connect{padding:14px}
  .bpp-headphones{height:66px;margin:5px auto}
  .bpp-headphones svg{width:66px;height:66px}
  .bpp-eq{height:72px}
  .bpp-credit{gap:5px 14px}
}

/* Enterprise 2.0: ecualizador integrado y distribución realmente compacta */
@media(min-width:1201px){
  .bpp{max-width:1500px;margin:12px auto}
  .bpp-top{min-height:72px;padding:10px 24px}
  .bpp-brand{gap:1px}
  .bpp-brand strong{font-size:18px}
  .bpp-brand small{font-size:10px}
  .bpp-main{grid-template-columns:minmax(230px,310px) minmax(0,1fr) minmax(260px,330px);gap:28px;align-items:center;padding:24px 30px 22px}
  .bpp-coverbox{width:100%;max-width:310px;justify-self:center}
  .bpp-info{display:flex;flex-direction:column;justify-content:center;align-self:stretch;padding-block:2px}
  .bpp-kicker{margin-bottom:8px}
  .bpp-song-fixed{min-height:auto}
  .bpp-song{font-size:clamp(23px,1.7vw,30px);-webkit-line-clamp:1;line-clamp:1;white-space:nowrap}
  .bpp-artist-marquee{min-height:27px}
  .bpp-station-meta{margin-top:8px;padding:8px 11px}
  .bpp-status{margin-top:5px}
  .bpp-controls{margin-top:12px;gap:12px}
  .bpp-play{width:62px;height:62px;font-size:22px}
  .bpp-share{padding:10px 13px}
  .bpp-connect{align-self:stretch;justify-content:center;padding:14px 18px}
  .bpp-connect-head strong{font-size:17px}
  .bpp-headphones{height:52px;margin:2px auto 0}
  .bpp-headphones svg{width:52px;height:52px}
  .bpp-wave{height:36px}
  .bpp-apps{gap:7px;margin-top:6px}
  .bpp-store-badge,.bpp-alexa-card{min-height:46px;padding:6px 10px}
  .bpp-store-badge-icon{width:27px;height:27px;flex-basis:27px}
  .bpp-apple-badge .bpp-store-badge-icon{width:25px;height:25px;flex-basis:25px}
  .bpp-store-badge-copy strong,.bpp-apple-badge .bpp-store-badge-copy strong,.bpp-alexa-card strong{font-size:16px}
  .bpp-alexa-icon{width:28px;height:28px;flex-basis:28px}
  .bpp-socials{margin-top:8px}
  .bpp-socials a{width:34px;height:34px}
  .bpp-credit{min-height:38px;padding:6px 14px 7px;gap:4px 20px;font-size:10px}
  .bpp-credit small{width:auto}
}
.bpp-eq-integrated{width:100%;margin-top:12px;padding:7px 0 0;border-top:1px solid #ffffff12;background:transparent}
.bpp-eq-integrated .bpp-eq-label{font-size:9px}
.bpp-eq-integrated .bpp-eq{height:52px;margin-top:5px;gap:2px}
.bpp-eq-integrated .bpp-eq i{min-width:1px}
@media(max-width:1200px){
  .bpp-eq-integrated{grid-column:auto;margin-top:13px}
  .bpp-eq-integrated .bpp-eq{height:60px}
}
@media(max-width:760px){
  .bpp-eq-integrated{padding-inline:0}
  .bpp-eq-integrated .bpp-eq{height:58px}
}
/* ====== Créditos ocultos en móviles ====== */
@media (max-width:768px){

    .bpp-credit{
        display:none !important;
    }

}
/* ====== Encabezado móvil ====== */
@media (max-width:768px){

    .bpp-brand{
        display:none !important;
    }

}

/* Enterprise 2.2: flujo de canciones. No modifica el diseño existente del player. */
.bpp-trackflow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:0 30px 18px}
.bpp-flow-card{min-width:0;border:1px solid #ffffff20;border-radius:15px;padding:11px 13px;background:#05090dd9;box-shadow:inset 0 1px 0 #ffffff0d}
.bpp-flow-current{border-color:color-mix(in srgb,var(--accent) 62%,#ffffff22)}
.bpp-flow-next{border-color:color-mix(in srgb,var(--accent) 42%,#ffffff22)}
.bpp-flow-label{display:block;margin-bottom:7px;font-size:10px;font-weight:800;letter-spacing:.08em;color:#aab9c8}
.bpp-flow-current .bpp-flow-label{color:var(--accent)}
.bpp-flow-body{display:flex;align-items:center;gap:10px;min-width:0}
.bpp-flow-body img{width:46px;height:46px;flex:0 0 46px;object-fit:cover;border-radius:10px;border:1px solid #ffffff25;background:#090b0d}
.bpp-flow-body span{display:block;min-width:0}
.bpp-flow-body strong,.bpp-flow-body small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bpp-flow-body strong{font-size:14px;line-height:1.25;color:#fff}
.bpp-flow-body small{margin-top:4px;font-size:11px;color:#9eb2c7}
@media(max-width:1200px){.bpp-trackflow{padding:0 24px 16px}}
@media(max-width:760px){.bpp-trackflow{grid-template-columns:1fr 1fr;padding:0 14px 14px;gap:10px}.bpp-flow-current{grid-column:1/-1;grid-row:1}.bpp-flow-next{grid-column:1;grid-row:2}.bpp-flow-prev{grid-column:2;grid-row:2}.bpp-flow-card{padding:10px}.bpp-flow-body img{width:42px;height:42px;flex-basis:42px}.bpp-flow-body strong{font-size:13px}.bpp-flow-body small{font-size:10px}}

/* Enterprise 2.2.1 PRUEBA COMPACTA
   Solo reduce dimensiones. No cambia colores, estructura ni funciones. */
.bpp{max-width:1240px;margin:10px auto;border-radius:21px}
.bpp-top{min-height:58px;padding:8px 18px}
.bpp-station strong{font-size:14px}.bpp-brand strong{font-size:16px}.bpp-brand small{font-size:9px}

@media(min-width:1201px){
  .bpp-main{grid-template-columns:minmax(160px,205px) minmax(0,1fr) minmax(205px,255px);gap:20px;padding:17px 22px 15px}
  .bpp-coverbox{max-width:205px;border-radius:18px}
  .bpp-coverbox::before{border-radius:23px}
  .bpp-kicker{margin-bottom:6px;padding:5px 9px;font-size:9px}
  .bpp-song{font-size:clamp(19px,1.45vw,25px)}
  .bpp-artist{font-size:clamp(13px,1vw,16px);margin-top:4px}
  .bpp-station-meta{margin-top:6px;padding:6px 9px}.bpp-station-meta strong{font-size:13px}.bpp-station-meta small{font-size:10px}
  .bpp-status{font-size:10px;margin-top:4px}
  .bpp-controls{margin-top:9px;gap:9px;max-width:520px}
  .bpp-play{width:52px;height:52px;font-size:19px;box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 12%,transparent),0 10px 24px color-mix(in srgb,var(--accent) 25%,transparent)}
  .bpp-share{padding:8px 10px;font-size:12px}
  .bpp-connect{padding:10px 12px;border-radius:16px}
  .bpp-connect-head span{font-size:9px}.bpp-connect-head strong{font-size:14px}
  .bpp-headphones{height:42px;margin:0 auto}.bpp-headphones svg{width:42px;height:42px}.bpp-wave{height:30px;width:18px}
  .bpp-apps{gap:5px;margin-top:4px}
  .bpp-store-badge,.bpp-alexa-card{min-height:39px;padding:5px 8px;border-radius:9px}
  .bpp-store-badge-icon{width:22px;height:22px;flex-basis:22px}.bpp-apple-badge .bpp-store-badge-icon{width:21px;height:21px;flex-basis:21px}
  .bpp-store-badge-copy small,.bpp-alexa-card small{font-size:7px}.bpp-store-badge-copy strong,.bpp-apple-badge .bpp-store-badge-copy strong,.bpp-alexa-card strong{font-size:13px}
  .bpp-alexa-icon{width:23px;height:23px;flex-basis:23px}
  .bpp-socials{gap:6px;margin-top:6px}.bpp-socials a{width:29px;height:29px;border-radius:9px}.bpp-socials a svg{width:16px;height:16px}
  .bpp-eq-integrated{margin-top:8px;padding-top:5px}.bpp-eq-integrated .bpp-eq-label{font-size:8px}.bpp-eq-integrated .bpp-eq{height:37px;margin-top:3px}
  .bpp-credit{min-height:30px;padding:4px 10px 5px;font-size:9px}
}

/* Las tres tarjetas también más pequeñas */
.bpp-trackflow{gap:8px;padding:0 22px 12px}
.bpp-flow-card{border-radius:11px;padding:7px 9px}
.bpp-flow-label{margin-bottom:5px;font-size:8px;letter-spacing:.07em}
.bpp-flow-body{gap:7px}
.bpp-flow-body img{width:34px;height:34px;flex-basis:34px;border-radius:7px}
.bpp-flow-body strong{font-size:11px}.bpp-flow-body small{margin-top:2px;font-size:9px}

@media(max-width:1200px){
  .bpp{max-width:980px}
  .bpp-main{grid-template-columns:minmax(150px,190px) minmax(0,1fr);gap:16px;padding:15px 18px}
  .bpp-coverbox{max-width:190px}
  .bpp-connect{padding:10px 12px}
  .bpp-eq-integrated .bpp-eq{height:42px}
  .bpp-trackflow{padding:0 18px 11px}
}

@media(max-width:760px){
  .bpp{margin:7px auto;border-radius:16px}
  .bpp-top{padding:8px 11px;min-height:48px}
  .bpp-main{padding:12px 11px;gap:12px}
  .bpp-coverbox{width:min(62vw,220px);max-width:220px;border-radius:16px}
  .bpp-kicker{font-size:9px;margin-bottom:5px;padding:5px 8px}
  .bpp-song{font-size:20px;line-height:1.12}
  .bpp-artist{font-size:13px;margin-top:4px}
  .bpp-station-meta{margin-top:6px;padding:6px 8px}.bpp-station-meta strong{font-size:12px}.bpp-station-meta small{font-size:10px}
  .bpp-controls{margin-top:9px;gap:8px}.bpp-play{width:50px;height:50px;font-size:18px}.bpp-share{padding:8px 10px}
  .bpp-connect{padding:10px;border-radius:14px}.bpp-headphones{height:48px;margin:2px auto}.bpp-headphones svg{width:48px;height:48px}
  .bpp-store-badge,.bpp-alexa-card{min-height:44px;padding:6px 9px}.bpp-store-badge-copy strong,.bpp-apple-badge .bpp-store-badge-copy strong,.bpp-alexa-card strong{font-size:14px}
  .bpp-socials a{width:31px;height:31px}
  .bpp-eq-integrated{margin-top:7px}.bpp-eq-integrated .bpp-eq{height:38px}
  .bpp-trackflow{grid-template-columns:1fr 1fr;padding:0 10px 10px;gap:7px}
  .bpp-flow-card{padding:7px}
  .bpp-flow-body img{width:30px;height:30px;flex-basis:30px}
  .bpp-flow-body strong{font-size:10px}.bpp-flow-body small{font-size:8px}
  .bpp-credit{padding:5px 9px 6px;font-size:9px}
}


/* Enterprise 2.3 PRUEBA CONFIGURABLE
   Medidas por cliente: ancho, carátula, tarjetas y densidad. */
.bpp{max-width:var(--bpp-width,1240px)!important}
.bpp-flow-card{min-height:var(--bpp-card-h,68px);display:flex;flex-direction:column;justify-content:center}

@media(min-width:1201px){
  .bpp-main{grid-template-columns:minmax(120px,var(--bpp-cover,205px)) minmax(0,1fr) minmax(190px,255px)!important}
  .bpp-coverbox{width:var(--bpp-cover,205px)!important;max-width:var(--bpp-cover,205px)!important}
}

/* Densidad general. Conserva la estética, cambia solo respiración/tamaño. */
.bpp-size-normal .bpp-main{padding-top:20px;padding-bottom:18px;gap:23px}
.bpp-size-normal .bpp-play{width:58px;height:58px}
.bpp-size-normal .bpp-eq-integrated .bpp-eq{height:44px}
.bpp-size-normal .bpp-flow-card{padding:9px 11px}

.bpp-size-large .bpp-main{padding-top:24px;padding-bottom:22px;gap:28px}
.bpp-size-large .bpp-play{width:64px;height:64px}
.bpp-size-large .bpp-eq-integrated .bpp-eq{height:52px}
.bpp-size-large .bpp-flow-card{padding:11px 13px}

@media(max-width:1200px){
  .bpp{width:min(100%,var(--bpp-width,1240px))}
  .bpp-coverbox{width:min(52vw,var(--bpp-cover,205px))!important;max-width:var(--bpp-cover,205px)!important}
}
@media(max-width:760px){
  .bpp{max-width:100%!important}
  .bpp-coverbox{width:min(58vw,var(--bpp-cover,205px))!important;max-width:min(58vw,var(--bpp-cover,205px))!important}
  .bpp-flow-card{min-height:min(var(--bpp-card-h,68px),76px)}
}


/* Cucho Player Pro · Boston Style · colores editables */
.bpp.cpp-boston-style{
  color:var(--cpp-text,#f7f8f8)!important;
  background:
    radial-gradient(circle at 18% 10%,color-mix(in srgb,var(--accent) 11%,transparent),transparent 35%),
    linear-gradient(145deg,var(--cpp-bg,#080a0b),var(--cpp-panel,#111416) 60%,var(--cpp-bg,#080a0b))!important;
}
.bpp.cpp-boston-style .bpp-top{background:color-mix(in srgb,var(--cpp-bg,#080a0b) 94%,transparent)!important}
.bpp.cpp-boston-style .bpp-connect,
.bpp.cpp-boston-style .bpp-flow-card,
.bpp.cpp-boston-style .bpp-station-meta{background:color-mix(in srgb,var(--cpp-panel,#111416) 82%,transparent)!important}
.bpp.cpp-boston-style .bpp-station small,
.bpp.cpp-boston-style .bpp-brand small,
.bpp.cpp-boston-style .bpp-station-meta small,
.bpp.cpp-boston-style .bpp-status,
.bpp.cpp-boston-style .bpp-eq-label,
.bpp.cpp-boston-style .bpp-store small,
.bpp.cpp-boston-style .bpp-empty,
.bpp.cpp-boston-style .bpp-flow-body small{color:var(--cpp-muted,#9ca4a8)!important}
.bpp.cpp-boston-style .bpp-station strong,
.bpp.cpp-boston-style .bpp-connect-head strong,
.bpp.cpp-boston-style .bpp-song,
.bpp.cpp-boston-style .bpp-flow-body strong,
.bpp.cpp-boston-style .bpp-credit strong{color:var(--cpp-text,#f7f8f8)!important}
.bpp.cpp-boston-style .bpp-coverbox{
  box-shadow:0 18px 45px #0008,0 0 0 1px color-mix(in srgb,var(--cpp-secondary,#d300c5) 28%,transparent)!important
}
.bpp.cpp-boston-style .bpp-credit{background:color-mix(in srgb,var(--cpp-bg,#080a0b) 96%,#000)!important}


/* Beta 9: defensive SVG sizing for Elementor/theme compatibility */
.bpp .bpp-store-badge-icon{overflow:hidden!important;flex-grow:0!important;flex-shrink:0!important}
.bpp .bpp-store-badge-icon>svg{display:block!important;width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;max-width:100%!important;max-height:100%!important}
.bpp .bpp-socials a{overflow:hidden!important}
.bpp .bpp-socials a>svg,.bpp .bpp-socials a .bpp-icon>svg{display:block!important;width:20px!important;height:20px!important;min-width:0!important;min-height:0!important;max-width:20px!important;max-height:20px!important}
@media(max-width:760px){.bpp .bpp-socials a>svg,.bpp .bpp-socials a .bpp-icon>svg{width:16px!important;height:16px!important;max-width:16px!important;max-height:16px!important}}


/* ==========================================================
   Beta 11 · Mobile responsive hardening
   Uses JS-applied classes based on the REAL player width.
   Prevents Elementor/theme/layout viewport from keeping desktop columns.
   ========================================================== */
.bpp.bpp-mobile{
  width:100%!important;
  max-width:100%!important;
  margin:6px auto!important;
  border-radius:16px!important;
  overflow:hidden!important;
}
.bpp.bpp-mobile .bpp-top{
  min-height:auto!important;
  padding:10px 12px!important;
  display:block!important;
}
.bpp.bpp-mobile .bpp-station{
  width:100%!important;
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:5px 9px!important;
}
.bpp.bpp-mobile .bpp-station strong{
  font-size:15px!important;
  white-space:normal!important;
}
.bpp.bpp-mobile .bpp-station small,
.bpp.bpp-mobile .bpp-brand{
  display:none!important;
}
.bpp.bpp-mobile .bpp-main{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  grid-auto-flow:row!important;
  gap:14px!important;
  align-items:stretch!important;
  padding:14px 12px!important;
}
.bpp.bpp-mobile .bpp-coverbox{
  grid-column:1!important;
  width:min(62vw,210px)!important;
  max-width:210px!important;
  min-width:0!important;
  margin:2px auto 4px!important;
  justify-self:center!important;
  aspect-ratio:1/1!important;
  border-radius:16px!important;
}
.bpp.bpp-mobile .bpp-info{
  grid-column:1!important;
  width:100%!important;
  min-width:0!important;
  padding:0!important;
}
.bpp.bpp-mobile .bpp-kicker{
  margin-bottom:7px!important;
  font-size:9px!important;
}
.bpp.bpp-mobile .bpp-song-fixed{
  min-height:0!important;
}
.bpp.bpp-mobile .bpp-song{
  width:100%!important;
  max-width:100%!important;
  margin:0!important;
  font-size:clamp(20px,6.4vw,27px)!important;
  line-height:1.12!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  -webkit-line-clamp:2!important;
  line-clamp:2!important;
}
.bpp.bpp-mobile .bpp-artist{
  max-width:100%!important;
  font-size:14px!important;
}
.bpp.bpp-mobile .bpp-station-meta{
  margin-top:9px!important;
  padding:8px 10px!important;
}
.bpp.bpp-mobile .bpp-status{
  margin-top:7px!important;
  font-size:11px!important;
}
.bpp.bpp-mobile .bpp-controls{
  width:100%!important;
  max-width:none!important;
  display:grid!important;
  grid-template-columns:52px 22px minmax(0,1fr)!important;
  gap:9px!important;
  align-items:center!important;
  margin-top:12px!important;
}
.bpp.bpp-mobile .bpp-play{
  width:52px!important;
  height:52px!important;
  font-size:18px!important;
}
.bpp.bpp-mobile .bpp-speaker{
  font-size:16px!important;
}
.bpp.bpp-mobile .bpp-volume{
  min-width:0!important;
  width:100%!important;
}
.bpp.bpp-mobile .bpp-share{
  grid-column:1/-1!important;
  width:100%!important;
  margin:0!important;
  padding:9px 12px!important;
}
.bpp.bpp-mobile .bpp-eq-integrated{
  width:100%!important;
  margin-top:10px!important;
  padding-top:7px!important;
}
.bpp.bpp-mobile .bpp-eq-integrated .bpp-eq{
  width:100%!important;
  height:42px!important;
  gap:1px!important;
}
.bpp.bpp-mobile .bpp-eq-label{
  gap:8px!important;
  font-size:8px!important;
}
.bpp.bpp-mobile .bpp-connect{
  grid-column:1!important;
  width:100%!important;
  max-width:none!important;
  align-self:stretch!important;
  display:block!important;
  margin:0!important;
  padding:13px 12px!important;
  border-radius:14px!important;
}
.bpp.bpp-mobile .bpp-connect-head strong{
  font-size:18px!important;
}
.bpp.bpp-mobile .bpp-headphones{
  height:54px!important;
  margin:4px auto!important;
}
.bpp.bpp-mobile .bpp-headphones svg{
  width:54px!important;
  height:54px!important;
}
.bpp.bpp-mobile .bpp-apps{
  width:100%!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:8px!important;
  margin-top:8px!important;
}
.bpp.bpp-mobile .bpp-store-badge,
.bpp.bpp-mobile .bpp-alexa-card{
  width:100%!important;
  max-width:none!important;
  min-height:48px!important;
  padding:7px 10px!important;
}
.bpp.bpp-mobile .bpp-store-badge-copy{
  min-width:0!important;
}
.bpp.bpp-mobile .bpp-store-badge-copy strong,
.bpp.bpp-mobile .bpp-apple-badge .bpp-store-badge-copy strong,
.bpp.bpp-mobile .bpp-alexa-card strong{
  font-size:16px!important;
  white-space:normal!important;
}
.bpp.bpp-mobile .bpp-socials{
  width:100%!important;
  justify-content:center!important;
  gap:8px!important;
  margin-top:10px!important;
}
.bpp.bpp-mobile .bpp-socials a{
  width:34px!important;
  height:34px!important;
}
.bpp.bpp-mobile .bpp-trackflow{
  width:100%!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:8px!important;
  padding:0 10px 11px!important;
}
.bpp.bpp-mobile .bpp-flow-current{
  grid-column:1/-1!important;
  grid-row:auto!important;
}
.bpp.bpp-mobile .bpp-flow-next,
.bpp.bpp-mobile .bpp-flow-prev{
  grid-row:auto!important;
}
.bpp.bpp-mobile .bpp-flow-card{
  min-width:0!important;
  min-height:0!important;
  padding:8px!important;
}
.bpp.bpp-mobile .bpp-flow-body{
  min-width:0!important;
}
.bpp.bpp-mobile .bpp-flow-body img{
  width:36px!important;
  height:36px!important;
  flex-basis:36px!important;
}
.bpp.bpp-mobile .bpp-flow-body strong{
  font-size:11px!important;
}
.bpp.bpp-mobile .bpp-flow-body small{
  font-size:9px!important;
}
.bpp.bpp-mobile .bpp-credit{
  display:none!important;
}

/* Very narrow phones: stack history cards too. */
.bpp.bpp-mobile.bpp-narrow .bpp-trackflow{
  grid-template-columns:minmax(0,1fr)!important;
}
.bpp.bpp-mobile.bpp-narrow .bpp-flow-current,
.bpp.bpp-mobile.bpp-narrow .bpp-flow-next,
.bpp.bpp-mobile.bpp-narrow .bpp-flow-prev{
  grid-column:1!important;
  grid-row:auto!important;
}

/* Tablet/container fallback: never let the app panel become a skinny side column. */
.bpp.bpp-tablet .bpp-main{
  grid-template-columns:minmax(160px,220px) minmax(0,1fr)!important;
}
.bpp.bpp-tablet .bpp-connect{
  grid-column:1/-1!important;
  width:100%!important;
}

/* Beta 12: icono visual STOP en lugar de pausa, sin cambiar la lógica de audio. */
.bpp-play{display:grid!important;place-items:center!important;padding:0!important;line-height:1!important}
.bpp-play .bpp-play-icon{display:block!important;width:0!important;height:0!important;border-top:9px solid transparent!important;border-bottom:9px solid transparent!important;border-left:15px solid currentColor!important;transform:translateX(2px)!important}
.bpp-play .bpp-stop-icon{display:block!important;width:16px!important;height:16px!important;background:currentColor!important;border-radius:1px!important;transform:none!important}


/* Beta 14: control de volumen de alto contraste y nivel visible. */
.bpp-volume{
  --bpp-volume-pct:85%;
  -webkit-appearance:none!important;
  appearance:none!important;
  width:100%!important;
  height:22px!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  cursor:pointer!important;
  accent-color:var(--accent)!important;
}
.bpp-volume::-webkit-slider-runnable-track{
  height:6px!important;
  border-radius:999px!important;
  background:linear-gradient(to right,
    var(--accent) 0%,
    var(--accent) var(--bpp-volume-pct),
    #667177 var(--bpp-volume-pct),
    #667177 100%)!important;
  box-shadow:inset 0 0 0 1px #ffffff24!important;
}
.bpp-volume::-webkit-slider-thumb{
  -webkit-appearance:none!important;
  appearance:none!important;
  width:18px!important;
  height:18px!important;
  margin-top:-6px!important;
  border:3px solid var(--accent)!important;
  border-radius:50%!important;
  background:#fff!important;
  box-shadow:0 0 0 3px #0006,0 0 12px color-mix(in srgb,var(--accent) 50%,transparent)!important;
}
.bpp-volume::-moz-range-track{
  height:6px!important;
  border:0!important;
  border-radius:999px!important;
  background:#667177!important;
  box-shadow:inset 0 0 0 1px #ffffff24!important;
}
.bpp-volume::-moz-range-progress{
  height:6px!important;
  border-radius:999px!important;
  background:var(--accent)!important;
}
.bpp-volume::-moz-range-thumb{
  width:18px!important;
  height:18px!important;
  border:3px solid var(--accent)!important;
  border-radius:50%!important;
  background:#fff!important;
  box-shadow:0 0 0 3px #0006,0 0 12px color-mix(in srgb,var(--accent) 50%,transparent)!important;
}
.bpp-speaker{
  min-width:24px!important;
  opacity:1!important;
  filter:drop-shadow(0 1px 2px #000)!important;
}
.bpp.bpp-volume-low .bpp-volume::-webkit-slider-runnable-track{
  box-shadow:inset 0 0 0 1px #ffffff40,0 0 8px #ffffff12!important;
}
.bpp.bpp-volume-muted .bpp-volume::-webkit-slider-thumb{
  border-color:#ffbf47!important;
}


/* Beta 15: iOS/iPadOS no permiten controlar de forma fiable el volumen del media
   desde JavaScript. En esos equipos ocultamos el slider y mostramos una indicación
   honesta para usar los botones físicos / Centro de control. */
.bpp-ios-volume-note{
  display:none;
  min-width:0;
  color:#d7dee2;
  font-size:11px;
  line-height:1.25;
  font-weight:700;
  letter-spacing:.01em;
}
.bpp.bpp-ios-volume .bpp-volume{display:none!important}
.bpp.bpp-ios-volume .bpp-ios-volume-note[hidden]{display:none!important}
.bpp.bpp-ios-volume .bpp-ios-volume-note:not([hidden]){display:block!important}
.bpp.bpp-ios-volume .bpp-controls{
  grid-template-columns:auto auto minmax(150px,1fr) auto;
}
@media(max-width:760px){
  .bpp.bpp-ios-volume .bpp-controls{
    grid-template-columns:52px 22px minmax(0,1fr)!important;
  }
  .bpp.bpp-ios-volume .bpp-ios-volume-note{
    display:block!important;
    font-size:10px!important;
    color:#dce3e6!important;
  }
  .bpp.bpp-ios-volume .bpp-share{
    grid-column:1/-1!important;
  }
}