/* Webradio Player 2.3.3 — quadrato, z-index corretti, artwork 10% più piccolo, tint scuro */
.wrp-player{position:relative;overflow:hidden;color:#fff;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;width:min(92vw,100%);aspect-ratio:1/1;margin:0 auto;border-radius:16px;box-shadow:0 12px 40px rgba(0,0,0,.25);background:#000;display:grid;grid-template-rows:auto 1fr auto;align-items:stretch;--wrp-safe-top:clamp(48px,8vh,80px);--wrp-safe-bottom:clamp(100px,12vh,140px);--wrp-artwork-size:clamp(200px,46vw,420px);}
.wrp-player.wrp-mobile-18x9{--wrp-safe-top:clamp(32px,5vh,60px);--wrp-safe-bottom:clamp(72px,10vh,120px);--wrp-artwork-size:clamp(180px,52vw,360px);}
.wrp-player.wrp-mobile-18x9.wrp-mobile-landscape{aspect-ratio:18/9;}
.wrp-player.wrp-mobile-18x9.wrp-mobile-portrait{aspect-ratio:9/18;}
.wrp-bg-stack{position:absolute;inset:0;z-index:0;overflow:hidden;background:#000;pointer-events:none;}
.wrp-bg{position:absolute;inset:0;background:#000;background-size:cover;background-position:center;background-repeat:no-repeat;filter:blur(24px) brightness(.72);transform:scale(1.12);opacity:0;transition:opacity .6s ease;pointer-events:none;}
.wrp-bg.is-active{opacity:1;}
.wrp-bg::before{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 150px rgba(0,0,0,.75);}
.wrp-bg::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,rgba(0,0,0,0) 55%,rgba(0,0,0,0.34) 85%,rgba(0,0,0,0.6) 100%);}

.wrp-content{position:absolute;z-index:10;display:flex;align-items:center;justify-content:center;inset:var(--wrp-safe-top) 0 var(--wrp-safe-bottom);padding:0 28px;box-sizing:border-box;}
.wrp-stage{display:flex;flex-direction:column;align-items:center;gap:clamp(16px,2vh,28px);width:100%;max-width:520px;margin:0 auto;}
.wrp-player.wrp-mobile-18x9 .wrp-content{inset:var(--wrp-safe-top) clamp(10px,3vw,32px) var(--wrp-safe-bottom);} 
.wrp-player.wrp-mobile-18x9.wrp-mobile-portrait .wrp-content{inset:var(--wrp-safe-top) clamp(18px,4vw,42px) var(--wrp-safe-bottom);}
.wrp-player.wrp-mobile-18x9 .wrp-stage{flex-direction:row;align-items:center;justify-content:space-between;gap:clamp(16px,4vw,48px);max-width:none;}
.wrp-player.wrp-mobile-18x9.wrp-mobile-portrait .wrp-stage{flex-direction:column;gap:clamp(20px,4vh,56px);}

/* brand/logo sempre sopra */
.wrp-brand{position:absolute;top:12px;left:12px;z-index:25;display:flex;align-items:center;gap:8px;background:rgba(0,0,0,.25);padding:6px 10px;border-radius:9999px;}
.wrp-logo{width:32px;height:32px;object-fit:contain;border-radius:8px;}
.wrp-station{font-weight:600;text-shadow:0 1px 2px rgba(0,0,0,.5);}

/* artwork davanti allo sfondo */
.wrp-artwork-3d{position:relative;z-index:10;display:flex;justify-content:center;width:min(100%,var(--wrp-artwork-size));max-width:var(--wrp-artwork-size);height:var(--wrp-artwork-size);max-height:var(--wrp-artwork-size);margin:0 auto;perspective:1200px;}
.wrp-player.wrp-mobile-18x9 .wrp-artwork-3d{width:min(45vw,320px);max-width:none;height:auto;max-height:85%;}
.wrp-player.wrp-mobile-18x9.wrp-mobile-portrait .wrp-artwork-3d{width:65%;max-width:380px;}
.wrp-flip{position:relative;width:100%;height:100%;aspect-ratio:1/1;border-radius:16px;cursor:pointer;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.22,.61,.36,1);box-shadow:0 12px 40px rgba(0,0,0,.35);margin:0 auto;}
.wrp-flip-light-shadow{box-shadow:0 12px 38px rgba(255,255,255,.36);}
.wrp-flip.is-flipped{transform:rotateY(180deg);}
.wrp-flip-no-transition{transition:none!important;}
.wrp-face{position:absolute;inset:0;border-radius:inherit;z-index:10;object-fit:cover;width:100%;height:100%;opacity:0;transition:opacity .4s ease;background-color:rgba(0,0,0,0.25);backface-visibility:hidden;-webkit-backface-visibility:hidden;}
.wrp-face.fade-visible{opacity:1 !important;}
.wrp-front{transform:rotateY(0deg) translateZ(.01px);}
.wrp-back{transform:rotateY(180deg) translateZ(.01px);}

/* preferiti rettangolare in overlay */
.wrp-fav-float{position:absolute;top:0px;right:0px;z-index:25;width:44px;height:28px !important;border-radius:0 16px 0 16px !important;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.45);border:none;color:#fff;box-shadow:0 8px 20px rgba(0,0,0,.35);transition:opacity .3s ease, background .3s ease;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform:translateZ(4px);}
.wrp-fav-float.wrp-fav-glow-dark{box-shadow:0 0 16px rgba(0,0,0,.55),0 10px 24px rgba(0,0,0,.5);}
.wrp-fav-float.wrp-fav-glow-dark.active{box-shadow:0 0 20px rgba(0,0,0,.65),0 12px 28px rgba(0,0,0,.6);}
.wrp-fav-float.wrp-fav-glow-dark .wrp-icon{filter:drop-shadow(0 0 2px rgba(0,0,0,.7));}
.wrp-fav-float.wrp-fav-glow-dark .wrp-icon path{stroke:rgba(0,0,0,.65);stroke-width:1.4;paint-order:stroke;stroke-linejoin:round;}
.wrp-fav-float.active{background:rgba(233,30,99,0.85);color:#fff;border:none;}
.wrp-fav-float.active:hover{background:rgba(233,30,99,1.00);color:#fff;border:none;}
.wrp-flip.is-flipped .wrp-fav-float{opacity:0;pointer-events:none;}
.wrp-icon{display:block;width:1.2em;height:1.2em;color:currentColor;fill:currentColor;pointer-events:none;}
.wrp-icon[hidden]{display:none!important;}
@keyframes wrp-spin{to{transform:rotate(360deg);} }
.wrp-spinner{animation:wrp-spin 1s linear infinite;}

/* TESTI: sopra lo sfondo, non sovrapposti alla toolbar */
.wrp-meta{position:relative;z-index:12;text-align:center;user-select:none;-webkit-tap-highlight-color:transparent;display:flex;flex-direction:column;align-items:center;gap:8px;}
.wrp-player.wrp-mobile-18x9 .wrp-meta{align-items:flex-start;text-align:left;max-width:55%;}
.wrp-player.wrp-mobile-18x9.wrp-mobile-portrait .wrp-meta{align-items:center;text-align:center;max-width:90%;}
.wrp-title,.wrp-artist{display:block;text-decoration:none;color:#fff;max-width:min(74vw,480px);}
.wrp-title{font-size:1.2rem;font-weight:700;text-shadow:0 2px 8px rgba(0,0,0,.55);}
.wrp-artist{color:#e5e5e5;margin-top:0;font-size:1rem;text-shadow:0 2px 6px rgba(0,0,0,.45);}
.wrp-player:fullscreen .wrp-title,
.wrp-player:-webkit-full-screen .wrp-title{font-size:1.6rem;}
.wrp-player:fullscreen .wrp-artist,
.wrp-player:-webkit-full-screen .wrp-artist{font-size:1.25rem;}
.wrp-player:not(:fullscreen) .wrp-title,
.wrp-player:not(:-webkit-full-screen) .wrp-title{font-size:1.2rem;}
.wrp-player:not(:fullscreen) .wrp-artist,
.wrp-player:not(:-webkit-full-screen) .wrp-artist{font-size:1rem;}

/* controlli + volume overlay */
.wrp-toolbar{position:absolute;left:0;right:0;bottom:0;z-index:15;display:flex;justify-content:center;align-items:center;gap:10px;padding:0 16px 20px 16px;}
.wrp-player.wrp-mobile-18x9 .wrp-toolbar{padding:0 16px 14px 16px;}
.wrp-player.wrp-mobile-18x9.wrp-mobile-portrait .wrp-toolbar{padding:0 14px 14px 14px;}
.wrp-btn{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.15);border:none;color:#fff;display:grid;place-items:center;cursor:pointer;font-family:inherit;line-height:1;transition:background .25s ease, transform .1s ease;}
.wrp-btn:hover{background:rgba(255,255,255,.25);transform:scale(1.05);}
.wrp-btn:focus,.wrp-btn:active{outline:none!important;box-shadow:none!important;}
.wrp-btn-primary{background:#fff;color:#111;border:none;}
.wrp-btn-active,.wrp-btn.wrp-muted{background:#fff;color:#111;border:none;}
.wrp-btn-active:hover{background:#fff;}
.wrp-fs-float{position:absolute;top:12px;right:12px;z-index:20;width:42px;height:42px;border-radius:50%;background:rgba(0,0,0,.6);border:none;color:#fff;}
@media (pointer:coarse){
  #wrp-fs{display:none!important;}
}
.wrp-panel { position: absolute; left: 8px; right: 8px; bottom: 70px; z-index: 18; max-height: none; min-height: 35%; background: rgba(0, 0, 0, .35); border: none; padding: 12px; border-radius: 12px;}
#wrp-history-list_container,
#wrp-favorites-list_container{overflow:scroll;height:-webkit-fill-available;border-radius:12px;}
#wrp-history-list,
#wrp-favorites-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
#wrp-history-list .wrp-history-item,
#wrp-favorites-list .wrp-history-item{display:flex;align-items:center;gap:12px;padding:6px 8px;border-radius:10px;background:rgba(0,0,0,.2);}
#wrp-history-list .wrp-history-item-first,
#wrp-favorites-list .wrp-history-item-first{padding-top:6px;}
#wrp-history-list .wrp-history-item-last,
#wrp-favorites-list .wrp-history-item-last{margin-bottom:0;}
#wrp-history-list .wrp-history-thumb,
#wrp-favorites-list .wrp-history-thumb{width:52px;height:52px;border-radius:12px;object-fit:cover;box-shadow:0 6px 18px rgba(0,0,0,.35);background:rgba(255,255,255,.06);flex-shrink:0;}
#wrp-history-list .wrp-history-text,
#wrp-favorites-list .wrp-history-text{display:flex;flex-direction:column;gap:2px;min-width:0;}
#wrp-history-list .wrp-history-title,
#wrp-favorites-list .wrp-history-title{font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#wrp-history-list .wrp-history-artist,
#wrp-favorites-list .wrp-history-artist{color:#e5e5e5;font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#wrp-history-list .wrp-history-time,
#wrp-favorites-list .wrp-history-time{font-size:.75rem;color:rgba(229,229,229,.7);}
#wrp-history-list .wrp-history-empty,
#wrp-favorites-list .wrp-history-empty{padding:6px 8px;text-align:center;color:#e5e5e5;background:rgba(0,0,0,.15);border-radius:10px;}
#wrp-history-list .wrp-history-loading,
#wrp-favorites-list .wrp-history-loading{display:flex;align-items:center;justify-content:center;gap:10px;padding:6px 8px;color:#e5e5e5;background:rgba(0,0,0,.15);border-radius:10px;min-height:calc(var(--wrp-history-row-height,64px) - 12px);}
#wrp-history-list .wrp-spinner,
#wrp-favorites-list .wrp-spinner{width:22px;height:22px;border-radius:50%;border:3px solid rgba(255,255,255,.25);border-top-color:#fff;animation:wrp-spinner .8s linear infinite;}
#wrp-history-list .wrp-history-loading-text,
#wrp-favorites-list .wrp-history-loading-text{font-size:.85rem;letter-spacing:.02em;display:flex;align-items:center;height:calc(var(--wrp-history-row-height,64px) - 12px);}
#wrp-history-list .wrp-history-item.wrp-history-enter,
#wrp-favorites-list .wrp-history-item.wrp-history-enter{animation:wrp-history-slide-up .35s cubic-bezier(.22,.61,.36,1) forwards;}
#wrp-history-list .wrp-history-item.wrp-history-enter-down,
#wrp-favorites-list .wrp-history-item.wrp-history-enter-down{animation:wrp-history-slide-down-in .4s cubic-bezier(.22,.61,.36,1) forwards;}
#wrp-history-list.wrp-history-out,
#wrp-favorites-list.wrp-history-out{animation:wrp-history-slide-down .32s cubic-bezier(.55,.055,.675,.19) forwards;}
#wrp-favorites-list .wrp-favorite-remove{margin-left:auto;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;border:none;display:flex;align-items:center;justify-content:center;opacity:.85;transition:background .2s ease, opacity .2s ease, transform .2s ease;cursor:pointer;position:relative;}
#wrp-favorites-list .wrp-favorite-remove:hover{background:rgba(255,255,255,.2);opacity:1;transform:scale(1.05);}
#wrp-favorites-list .wrp-favorite-remove:disabled{opacity:.4;transform:none;cursor:default;}
#wrp-favorites-list .wrp-favorite-remove::before{content:"";width:18px;height:18px;display:block;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 352 512'%3E%3Cpath fill='currentColor' d='M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z'/%3E%3C/svg%3E") no-repeat center/contain;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 352 512'%3E%3Cpath fill='currentColor' d='M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z'/%3E%3C/svg%3E") no-repeat center/contain;}
#wrp-favorites-list .wrp-history-item.wrp-favorite-removing{opacity:.6;}
@keyframes wrp-history-slide-up{
  from{opacity:0;transform:translateY(14px);}
  to{opacity:1;transform:translateY(0);}
}
@keyframes wrp-history-slide-down-in{
  0%{opacity:0;transform:translateY(-22px);}
  60%{opacity:1;transform:translateY(6px);}
  100%{opacity:1;transform:translateY(0);}
}
@keyframes wrp-history-slide-down{
  from{opacity:1;transform:translateY(0);}
  to{opacity:0;transform:translateY(18px);}
}
@keyframes wrp-spinner{
  from{transform:rotate(0deg);}
  50%{transform:rotate(180deg);}
  to{transform:rotate(360deg);}
}
@keyframes wrp-loading-pulse{
  0%,100%{transform:translateY(0);opacity:.85;}
  50%{transform:translateY(-3px);opacity:1;}
}

/* volume inline */
/* .wrp-vol{display:flex;align-items:center;gap:0;background:rgba(255,255,255,.15);border-radius:999px;overflow:hidden;transition:padding .25s ease, gap .25s ease;} */
.wrp-vol{display:flex;align-items:center;gap:0;background:rgba(255,255,255,.15);border-radius:999px;overflow:hidden;transition:all .25s ease;}
.wrp-vol .wrp-btn{width:44px;height:44px;border:none;background:transparent;color:#fff;padding:0;display:flex;align-items:center;justify-content:center;}
.wrp-vol:hover {background:rgba(255, 255, 255, .25);transform:scale(1.05);transition:all ease-in-out .25s;}
.wrp-vol-shell{position:relative;flex:0;min-width:0;opacity:0;visibility:hidden;max-width:0;width:0;margin-right:0;transition:opacity .2s ease,max-width .3s ease,width .3s ease,margin-right .3s ease;}
.wrp-vol.wrp-vol-expanded .wrp-vol-shell{flex:1;max-width:220px;opacity:1;visibility:visible;width:75px;margin-right:18px;}
.wrp-vol.wrp-vol-collapsing .wrp-vol-shell{flex:1;visibility:visible;opacity:0;}
.wrp-vol-track{position:absolute;top:50%;left:0;right:0;height:4px;border-radius:999px;background:rgba(255,255,255,.28);transform:translateY(-50%);overflow:hidden;pointer-events:none;}
.wrp-vol-fill{position:absolute;top:0;bottom:0;left:0;width:100%;max-width:100%;border-radius:inherit;background:#fff;transition:width .2s ease;height:100%;}
#wrp-vol-range{position:absolute;inset:-6px;appearance:none;-webkit-appearance:none;background:transparent;outline:none;margin:0;width:calc(100% + 12px);height:calc(100% + 12px);}
#wrp-vol-range::-webkit-slider-runnable-track{background:transparent;border:none;}
#wrp-vol-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.3);margin:0;position:relative;z-index:2;}
#wrp-vol-range::-moz-range-track{background:transparent;border:none;}
#wrp-vol-range::-moz-range-progress{background:transparent;border:none;}
#wrp-vol-range::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.3);border:none;position:relative;z-index:2;}
#wrp-vol-range::-ms-track{background:transparent;border:none;color:transparent;}
#wrp-vol-range::-ms-fill-lower,#wrp-vol-range::-ms-fill-upper{background:transparent;border:none;}
#wrp-vol-range::-ms-thumb{width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.3);border:none;position:relative;z-index:2;}

.wrp-player.wrp-coarse .wrp-vol{background:rgba(255,255,255,.15);box-shadow:none;padding:0;gap:0;}
.wrp-player.wrp-coarse .wrp-btn:hover{background:rgba(255,255,255,.25);transform:scale(1.05);}
.wrp-player.wrp-coarse .wrp-vol.wrp-vol-expanded{padding:0;}
.wrp-player.wrp-coarse .wrp-vol-shell{display:none;}

/* modale in primo piano */
.wrp-modal{position:fixed;inset:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:9999;}
.wrp-modal[aria-hidden="true"]{display:none;}
.wrp-modal-dialog{position:relative;background:#111;color:#fff;padding:16px;border-radius:12px;min-width:300px;max-width:480px;}
.wrp-close{position:absolute;right:8px;top:8px;z-index:10000;background:rgba(0,0,0,.6);border:none;color:#fff;}