:root{--r:#f01824;--bg:#050505;--line:#292929}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#050505;color:#fff;font-family:Arial,Helvetica,sans-serif}
.site{display:grid;grid-template-columns:240px minmax(0,1fr);min-height:100vh}
.side{position:fixed;inset:0 auto 0 0;width:240px;background:linear-gradient(180deg,#080808,#050505);border-right:1px solid #242424;z-index:20;padding:26px 28px;display:flex;flex-direction:column}
.brand{display:block;width:184px;margin:0 auto 34px}.brand img{width:100%;display:block}
nav{display:flex;flex-direction:column}nav a{height:58px;display:flex;align-items:center;gap:18px;text-decoration:none;color:#ddd;border-bottom:1px solid #181818;font-size:13px;font-weight:900;letter-spacing:1.7px;position:relative}
nav a:before{content:"";position:absolute;left:-28px;top:0;bottom:0;width:2px;background:transparent}nav a i{font-style:normal;width:26px;text-align:center;font-size:19px;color:#aaa}
nav a.active,nav a:hover{color:var(--r)}nav a.active:before,nav a:hover:before{background:var(--r)}
.follow{margin-top:auto;border-top:1px solid #292929;padding-top:28px;text-align:center}.follow>b{font-size:10px;letter-spacing:2px;color:var(--r)}.follow>div{display:flex;justify-content:center;gap:16px;margin-top:17px}.follow a{width:48px;height:48px;border:1px solid #777;border-radius:50%;display:grid;place-items:center;text-decoration:none;color:#fff;font-size:25px;font-weight:900}
main{grid-column:2;min-width:0}
.hero{height:805px;position:relative;overflow:hidden;background:url("stage-bg.jpg") center/cover no-repeat;border-bottom:1px solid #292929}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,2,2,.88) 0%,rgba(2,2,2,.47) 28%,rgba(2,2,2,.12) 65%,rgba(2,2,2,.10) 100%),linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.28))}
.bg-cover{position:absolute;left:5%;top:28%;width:72%;height:34%;background:radial-gradient(ellipse at center,rgba(7,7,7,.93) 0%,rgba(7,7,7,.74) 43%,rgba(7,7,7,0) 76%);filter:blur(18px);z-index:1}
.mega-rb{position:absolute;right:-30px;top:-35px;font-family:Impact,Arial Black,sans-serif;font-size:530px;line-height:.75;letter-spacing:-80px;color:rgba(255,255,255,.075);z-index:2;user-select:none}
.content{position:absolute;z-index:5;left:5.2%;top:76px;width:min(1120px,74vw)}
.label{display:inline-flex;align-items:center;gap:18px;border:1px solid #626262;background:rgba(4,4,4,.62);padding:11px 16px;font-size:11px;font-weight:900;letter-spacing:3px}.label span{width:48px;height:18px;background:repeating-linear-gradient(90deg,var(--r) 0 2px,transparent 2px 6px);mask:linear-gradient(to bottom,transparent 0 20%,#000 20% 80%,transparent 80%)}
.rb-title{margin-top:55px;display:flex;align-items:flex-end;white-space:nowrap;transform:skewX(-7deg);filter:drop-shadow(0 9px 0 rgba(0,0,0,.65)) drop-shadow(0 0 12px rgba(255,0,0,.22))}
.rb-title .radio,.rb-title .beats{position:relative;font-family:Impact,"Arial Black",sans-serif;font-style:italic;font-size:clamp(112px,11.7vw,205px);line-height:.69;letter-spacing:-8px;-webkit-text-stroke:1px rgba(255,255,255,.35)}
.rb-title .radio{background:linear-gradient(#fff 0%,#f6f6f6 28%,#c6c6c8 59%,#7f8083 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.rb-title .beats{background:linear-gradient(#ff4047 0%,#f30b17 38%,#c4000a 70%,#730007 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:4px 4px 0 rgba(70,0,0,.38)}
.rb-title small{font-family:Impact,"Arial Black",sans-serif;font-style:italic;font-size:clamp(36px,4vw,66px);margin-left:9px;margin-bottom:-2px;text-shadow:0 5px 0 #111}
.content h2{margin:55px 0 0;width:90%;text-align:center;font-size:clamp(17px,1.65vw,27px);letter-spacing:9px}
.divider{width:62%;height:1px;margin:30px auto 24px;background:linear-gradient(90deg,transparent,#8a2025,var(--r),#8a2025,transparent);position:relative}.divider i{position:absolute;left:50%;top:50%;width:12px;height:12px;border:1px solid var(--r);background:#111;transform:translate(-50%,-50%) rotate(45deg);box-shadow:0 0 12px var(--r)}
.party{width:90%;display:flex;justify-content:center;gap:28px;align-items:center;font-size:29px;font-weight:900;letter-spacing:5px}.party em{font-style:normal}.party strong{font-size:24px;color:var(--r)}
.onair{width:68%;margin:46px auto 0;display:grid;grid-template-columns:62px 1fr auto;gap:20px;align-items:center}.bars{height:70px;display:flex;align-items:end;gap:5px;border-left:4px solid #6b1015;padding-left:8px}.bars i{width:6px;background:linear-gradient(#ff747b,var(--r));animation:eq .7s ease-in-out infinite alternate}.bars i:nth-child(1){height:48%}.bars i:nth-child(2){height:91%;animation-delay:-.3s}.bars i:nth-child(3){height:65%;animation-delay:-.55s}.bars i:nth-child(4){height:42%;animation-delay:-.2s}.bars i:nth-child(5){height:76%;animation-delay:-.65s}@keyframes eq{to{transform:scaleY(.45);opacity:.55}}
.onair small{display:block;color:var(--r);font-size:10px;font-weight:900;margin-bottom:8px}.onair b{display:block;font-size:19px}.onair p{margin:7px 0 0;color:#aaa;font-size:13px}.live{border:1px solid #bd151d;padding:13px 20px;color:var(--r);font-size:19px;letter-spacing:2px}.live i{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--r);margin-left:9px}
.return{position:absolute;z-index:6;right:2.7vw;bottom:34px;width:330px;padding:30px 32px;background:rgba(5,5,5,.89);border:1px solid #9c151b}.return:after{content:"+";position:absolute;right:-8px;top:-17px;color:var(--r);font-size:26px}.return small{display:block;color:var(--r);font-size:10px;font-weight:900;letter-spacing:3px}.return strong{display:block;margin:15px 0;font-size:28px;line-height:1.05;letter-spacing:5px}.return span{font-size:11px;color:#aaa;letter-spacing:3px}.eq{width:175px;height:28px;margin-top:24px;background:repeating-linear-gradient(90deg,var(--r) 0 3px,transparent 3px 7px);clip-path:polygon(0 80%,4% 30%,8% 76%,12% 15%,16% 78%,20% 38%,24% 69%,28% 26%,32% 81%,36% 45%,40% 73%,44% 20%,48% 80%,52% 38%,56% 72%,60% 28%,64% 79%,68% 47%,72% 75%,76% 22%,80% 78%,84% 43%,88% 72%,92% 35%,96% 77%,100% 55%,100% 100%,0 100%)}
.player{background:#080808;padding:0;border-bottom:1px solid #252525}#radio-widget-radiobeats{min-height:110px}
footer{min-height:60px;background:#050505;display:flex;align-items:center;justify-content:space-between;padding:15px 35px;color:#85858a;font-size:11px;letter-spacing:1px}footer b{color:#eee}footer span:last-child b{color:var(--r)}
@media(max-width:1050px){.site{display:block}.side{position:relative;width:100%;height:auto;flex-direction:row;align-items:center;padding:12px 18px}.brand{width:105px;margin:0 20px 0 0}nav{flex-direction:row;overflow:auto;flex:1}nav a{min-width:max-content;border:0;padding:0 10px}nav a:before,nav a i{display:none}.follow{display:none}main{grid-column:auto}.hero{height:780px}.content{left:4%;width:94%}.mega-rb{font-size:390px;right:-90px}}
@media(max-width:700px){nav a:nth-child(n+4){display:none}.hero{height:850px}.content{top:55px}.rb-title{margin-top:42px}.rb-title .radio,.rb-title .beats{font-size:clamp(62px,16vw,108px);letter-spacing:-5px}.rb-title small{font-size:clamp(23px,7vw,43px)}.content h2{width:100%;font-size:12px;letter-spacing:5px;line-height:1.6}.party{width:100%;gap:12px;font-size:20px;letter-spacing:2px}.party strong{font-size:16px}.onair{width:100%;grid-template-columns:48px 1fr auto}.onair p{display:none}.return{left:20px;right:20px;bottom:20px;width:auto}footer{flex-direction:column;text-align:center;gap:10px;padding:20px}}


/* v2 correction: the background already carries the large RadioBeats title.
   No second foreground wordmark is rendered. */
.content{
  top:82px;
}
.label{
  margin-bottom:320px;
}
.content h2{
  margin-top:0;
}

/* Hide any legacy title block if browser cache still has old markup. */
.rb-title{display:none!important}


/* === v3 ALIGNEMENT HERO ===
   Objectif: mieux fusionner les éléments avec le décor et garder
   EN ONDES + LIVE ensemble dans la zone noire de gauche.
*/
.content{
  top:72px;
}

/* Le titre est déjà dans le background : on place les éléments
   exactement autour de lui au lieu de les faire flotter. */
.label{
  margin-bottom:308px;
}

.content h2{
  width:82%;
  margin-left:55px;
  text-align:center;
}

.divider{
  width:56%;
  margin-left:175px;
  margin-right:0;
}

.party{
  width:78%;
  justify-content:center;
  margin-left:42px;
}

/* EN ONDES déplacé franchement vers la gauche */
.onair{
  width:610px;
  margin:44px 0 0 92px;
  grid-template-columns:62px 290px 118px;
  gap:18px;
}

/* LIVE collé à EN ONDES dans la zone sombre */
.live{
  justify-self:start;
  align-self:center;
  padding:12px 18px;
  margin-left:0;
}

/* Petit ajustement du bloc septembre pour mieux respirer */
.return{
  right:1.4vw;
  bottom:34px;
}

@media(max-width:1200px){
  .content h2{margin-left:25px;width:88%}
  .divider{margin-left:130px;width:60%}
  .party{margin-left:15px;width:88%}
  .onair{margin-left:45px;width:590px;grid-template-columns:58px 280px 112px}
}

@media(max-width:700px){
  .label{margin-bottom:250px}
  .content h2{margin-left:0;width:100%}
  .divider{margin-left:auto;margin-right:auto;width:78%}
  .party{margin-left:0;width:100%}
  .onair{margin-left:0;width:100%;grid-template-columns:48px 1fr auto}
}


/* === v4: ESPACEMENT / POSITIONNEMENT ===
   Tagline au-dessus du logo central du background.
   LE SON DE MONTRÉAL + 24H regroupés à gauche avec plus d'espace.
*/
.content{
  top:0;
  left:0;
  width:100%;
  height:100%;
  position:absolute;
}

/* Votre Club : en haut-centre, au-dessus du logo central du fond */
.content h2{
  position:absolute;
  top:38px;
  left:50%;
  transform:translateX(-50%);
  width:auto;
  margin:0;
  white-space:nowrap;
  text-align:center;
  font-size:clamp(16px,1.5vw,25px);
  letter-spacing:8px;
  text-shadow:0 3px 10px #000;
}

/* Bloc de gauche : descend sous la zone du gros logo */
.lower-left{
  position:absolute;
  left:5.2%;
  top:475px;
  width:570px;
}

.label{
  margin:0 0 28px 0;
}

.party{
  width:auto;
  margin:0;
  justify-content:flex-start;
  gap:24px;
  padding-left:6px;
}

/* EN ONDES sous le nouveau bloc gauche */
.onair{
  position:absolute;
  left:5.2%;
  top:610px;
  width:610px;
  margin:0;
}

/* Ancienne ligne supprimée visuellement : elle causait l'embarquement */
.divider{display:none!important}

@media(max-width:1200px){
  .content h2{left:52%}
  .lower-left{left:4%;top:465px}
  .onair{left:4%;top:600px}
}


/* === v5: descendre le bloc gauche + éclaircir légèrement le décor === */

/* Plus d'espace sous le haut de page */
.lower-left{
  top:525px;
}

/* EN ONDES suit le déplacement et reste sous 24H */
.onair{
  top:665px;
}

/* Le voile noir est un peu moins fort pour mieux révéler le RadioBeats
   déjà intégré au background. */
.hero:before{
  background:
    linear-gradient(90deg,rgba(2,2,2,.78) 0%,rgba(2,2,2,.36) 28%,rgba(2,2,2,.07) 65%,rgba(2,2,2,.07) 100%),
    linear-gradient(180deg,rgba(0,0,0,.03),rgba(0,0,0,.20));
}

/* Réduit aussi légèrement le masque posé sur la zone centrale. */
.bg-cover{
  opacity:.72;
}

@media(max-width:1200px){
  .lower-left{top:510px}
  .onair{top:650px}
}


/* ==========================================================
   SEULE CORRECTION:
   descendre LE SON DE MONTRÉAL et 24H / PARTY NON STOP.
   Aucun autre élément du design n'est modifié.
   ========================================================== */
@media (min-width:1201px){

  .content > .label{
    position:absolute !important;
    left:5.2% !important;
    top:500px !important;
    margin:0 !important;
  }

  .content > .party{
    position:absolute !important;
    left:5.2% !important;
    top:565px !important;
    width:auto !important;
    margin:0 !important;
    justify-content:flex-start !important;
  }
}


/* ==========================================================
   v9 — POSITION EXACTE DEMANDÉE
   Déplacer uniquement:
   - LE SON DE MONTRÉAL
   - 24H / PARTY NON STOP
   vers la zone vide EN HAUT À GAUCHE du décor.
   ========================================================== */
@media (min-width:1201px){
  .content > .label{
    position:absolute !important;
    left:5.2% !important;
    top:145px !important;
    margin:0 !important;
  }

  .content > .party{
    position:absolute !important;
    left:5.2% !important;
    top:215px !important;
    width:auto !important;
    margin:0 !important;
    justify-content:flex-start !important;
  }
}


/* ==========================================================
   CoolServ Shield Intelligence v4
   Toast visuel en bas à droite + protection interactions.
   ========================================================== */
.coolserv-shield-toast{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:999999;
  width:min(360px, calc(100vw - 32px));
  display:flex;
  align-items:center;
  gap:12px;
  padding:13px 15px;
  border:1px solid rgba(36,168,255,.52);
  border-radius:13px;
  background:linear-gradient(180deg,rgba(4,29,48,.97),rgba(5,22,38,.97));
  box-shadow:0 14px 45px rgba(0,0,0,.46),0 0 22px rgba(0,142,255,.08);
  color:#dff5ff;
  opacity:0;
  visibility:hidden;
  transform:translateY(14px) scale(.985);
  transition:opacity .18s ease,transform .18s ease,visibility .18s;
  pointer-events:none;
  font-family:Arial,Helvetica,sans-serif;
}
.coolserv-shield-toast.show{
  opacity:1;
  visibility:visible;
  transform:translateY(0) scale(1);
}
.shield-icon{
  width:44px;height:44px;
  flex:0 0 44px;
  display:grid;
  place-items:center;
  border:1px solid rgba(71,190,255,.42);
  border-radius:11px;
  background:linear-gradient(180deg,rgba(14,75,112,.62),rgba(8,43,70,.62));
  color:#61d0ff;
  font-size:22px;
  text-shadow:0 0 12px rgba(73,205,255,.5);
}
.shield-copy strong{
  display:block;
  color:#67d7ff;
  font-size:12px;
  line-height:1.3;
  margin-bottom:3px;
}
.shield-copy small{
  display:block;
  color:#c5d3dc;
  font-size:11px;
  line-height:1.35;
}

/* Empêche la sélection accidentelle sur l'interface sans casser le player */
body{
  -webkit-user-select:none;
  user-select:none;
}
input,textarea,select,button,[contenteditable="true"],
#radio-widget-radiobeats,
#radio-widget-radiobeats *{
  -webkit-user-select:auto;
  user-select:auto;
}


/* ===== RadioBeats PARTY LEVEL v1.3 ===== */
.party-level{
  position:absolute;
  left:5.4%;
  top:610px;
  width:500px;
  z-index:8;
  font-family:Arial,Helvetica,sans-serif;
}
.party-level-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:8px;
  font-size:9px;
  line-height:1;
  font-weight:900;
  letter-spacing:2px;
}
.party-level-title span{color:#f01824}
.party-level-title b{color:#f2f2f2}
.party-level-meter{display:flex;align-items:center;gap:12px}
.party-level-track{
  flex:1;
  height:9px;
  overflow:hidden;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.16);
}
.party-level-fill{
  width:63%;
  height:100%;
  background:linear-gradient(90deg,#740006,#f01824);
  box-shadow:0 0 13px rgba(240,24,36,.55);
  will-change:width;
}
.party-level-meter strong{
  width:44px;
  color:#fff;
  font-size:12px;
  letter-spacing:1px;
}

/* Laisse PARTY LEVEL respirer juste au-dessus de EN ONDES */
@media (min-width:1201px){
  .onair{top:665px !important;}
}

/* Mobile: Party Level compact au-dessus de EN ONDES */
@media (max-width:700px){
  .party-level{
    left:17px;
    top:525px;
    width:calc(100% - 34px);
  }
  .party-level-title{
    font-size:8px;
    letter-spacing:1.4px;
  }
  .party-level-track{height:8px}
  .party-level-meter strong{font-size:11px;width:40px}
  .onair{top:575px !important;}
}


/* ==========================================================
   RADIOBEATS v1.4 — MOBILE FINAL
   Desktop untouched. Mobile rebuilt for phones.
   ========================================================== */
@media (max-width:700px){

  html,body{
    width:100%;
    max-width:100%;
    overflow-x:hidden;
  }

  .site{
    display:block !important;
    width:100% !important;
  }

  /* Header mobile: logo left + horizontally scrollable menu */
  .side{
    position:relative !important;
    inset:auto !important;
    width:100% !important;
    height:78px !important;
    min-height:78px !important;
    padding:7px 10px !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    gap:8px !important;
    border-right:0 !important;
    border-bottom:1px solid #242424 !important;
    background:#070707 !important;
  }

  .brand{
    width:86px !important;
    min-width:86px !important;
    margin:0 8px 0 0 !important;
  }

  .brand img{
    width:100% !important;
    height:auto !important;
  }

  nav{
    display:flex !important;
    flex:1 1 auto !important;
    flex-direction:row !important;
    align-items:center !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    gap:0 !important;
    scrollbar-width:none !important;
    -webkit-overflow-scrolling:touch;
  }

  nav::-webkit-scrollbar{display:none !important}

  nav a{
    display:flex !important;
    min-width:max-content !important;
    height:56px !important;
    padding:0 11px !important;
    font-size:10px !important;
    letter-spacing:.8px !important;
    border:0 !important;
    white-space:nowrap !important;
  }

  nav a:before,
  nav a i{
    display:none !important;
  }

  .follow{
    display:none !important;
  }

  main{
    grid-column:auto !important;
    width:100% !important;
    min-width:0 !important;
    overflow:hidden !important;
  }

  /* Hero specifically recropped for phone */
  .hero{
    position:relative !important;
    width:100% !important;
    height:760px !important;
    min-height:760px !important;
    padding:0 !important;
    background-position:50% center !important;
    background-size:auto 760px !important;
    overflow:hidden !important;
  }

  .hero:before{
    background:
      linear-gradient(180deg,
        rgba(0,0,0,.30) 0%,
        rgba(0,0,0,.06) 22%,
        rgba(0,0,0,.02) 58%,
        rgba(0,0,0,.30) 100%) !important;
  }

  .mega-rb,
  .bg-cover{
    display:none !important;
  }

  .content{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    z-index:5 !important;
  }

  /* "Votre club" cleanly centered at the top */
  .content h2{
    position:absolute !important;
    top:14px !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    width:92% !important;
    margin:0 !important;
    padding:0 !important;
    text-align:center !important;
    white-space:normal !important;
    font-size:11px !important;
    line-height:1.45 !important;
    letter-spacing:2.8px !important;
    text-shadow:0 2px 7px #000 !important;
  }

  /* LE SON + 24H moved into the upper-left free zone */
  .lower-left{
    position:absolute !important;
    left:14px !important;
    top:82px !important;
    width:calc(100% - 28px) !important;
    margin:0 !important;
    transform:none !important;
  }

  .lower-left .label{
    position:static !important;
    display:inline-flex !important;
    align-items:center !important;
    max-width:100% !important;
    margin:0 0 18px 0 !important;
    padding:8px 10px !important;
    font-size:8px !important;
    line-height:1 !important;
    letter-spacing:1.6px !important;
    white-space:nowrap !important;
  }

  .lower-left .label span{
    width:32px !important;
    height:14px !important;
  }

  .lower-left .party{
    position:static !important;
    display:flex !important;
    justify-content:flex-start !important;
    align-items:center !important;
    width:auto !important;
    max-width:100% !important;
    margin:0 !important;
    padding:0 0 0 3px !important;
    gap:10px !important;
    font-size:17px !important;
    letter-spacing:1.5px !important;
    white-space:nowrap !important;
  }

  .lower-left .party strong{
    font-size:14px !important;
    letter-spacing:1.5px !important;
  }

  /* Party Level above EN ONDES */
  .party-level{
    position:absolute !important;
    left:16px !important;
    top:505px !important;
    width:calc(100% - 32px) !important;
    margin:0 !important;
    z-index:8 !important;
  }

  .party-level-title{
    font-size:7.5px !important;
    letter-spacing:1.2px !important;
    margin-bottom:7px !important;
  }

  .party-level-meter{
    gap:9px !important;
  }

  .party-level-track{
    height:7px !important;
  }

  .party-level-meter strong{
    width:36px !important;
    font-size:10px !important;
  }

  /* EN ONDES + LIVE, one compact row */
  .onair{
    position:absolute !important;
    left:16px !important;
    top:548px !important;
    width:calc(100% - 32px) !important;
    margin:0 !important;
    display:grid !important;
    grid-template-columns:40px minmax(0,1fr) auto !important;
    gap:8px !important;
    align-items:center !important;
  }

  .bars{
    width:40px !important;
    height:48px !important;
    gap:3px !important;
    padding-left:4px !important;
  }

  .bars i{
    width:4px !important;
  }

  .onair small{
    font-size:8px !important;
    margin-bottom:4px !important;
  }

  .onair b{
    font-size:13px !important;
  }

  .onair p{
    display:none !important;
  }

  .live{
    padding:8px 9px !important;
    font-size:12px !important;
    letter-spacing:1.2px !important;
  }

  .live i{
    width:7px !important;
    height:7px !important;
    margin-left:5px !important;
  }

  /* September card reduced and anchored at bottom */
  .return{
    position:absolute !important;
    left:16px !important;
    right:16px !important;
    bottom:14px !important;
    width:auto !important;
    min-height:0 !important;
    padding:15px 17px !important;
  }

  .return small{
    font-size:8px !important;
    letter-spacing:2px !important;
  }

  .return strong{
    margin:9px 0 !important;
    font-size:19px !important;
    line-height:1.05 !important;
    letter-spacing:3px !important;
  }

  .return span{
    font-size:8px !important;
    letter-spacing:2px !important;
  }

  .return .eq{
    width:130px !important;
    height:20px !important;
    margin-top:11px !important;
  }

  /* Real TawebRadio stays full width below hero */
  .player{
    width:100% !important;
    overflow:hidden !important;
    padding:0 !important;
  }

  #radio-widget-radiobeats{
    min-height:96px !important;
    width:100% !important;
  }

  footer{
    min-height:auto !important;
    padding:15px 10px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:center !important;
    gap:6px !important;
    text-align:center !important;
    font-size:8px !important;
    line-height:1.5 !important;
    letter-spacing:.6px !important;
  }

  .coolserv-shield-toast{
    right:10px !important;
    bottom:10px !important;
    width:calc(100vw - 20px) !important;
    max-width:none !important;
  }
}

/* Extra-small phones */
@media (max-width:390px){
  .brand{
    width:76px !important;
    min-width:76px !important;
  }

  nav a{
    padding:0 9px !important;
    font-size:9px !important;
  }

  .hero{
    height:735px !important;
    min-height:735px !important;
    background-size:auto 735px !important;
  }

  .lower-left .party{
    font-size:15px !important;
  }

  .lower-left .party strong{
    font-size:12px !important;
  }

  .party-level{
    top:488px !important;
  }

  .onair{
    top:530px !important;
  }

  .return{
    bottom:12px !important;
  }
}


/* ==========================================================
   RADIOBEATS v1.5 — MOBILE FIX
   Correction basée sur la capture réelle du téléphone.
   Desktop non touché.
   ========================================================== */
@media (max-width:700px){

  html, body{
    width:100% !important;
    max-width:100% !important;
    overflow-x:hidden !important;
  }

  .site{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
  }

  /* ---------- MOBILE HEADER ---------- */
  .side{
    position:relative !important;
    width:100% !important;
    height:76px !important;
    min-height:76px !important;
    padding:6px 8px !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    gap:6px !important;
    background:#070707 !important;
    border-right:0 !important;
    border-bottom:1px solid #242424 !important;
  }

  .brand{
    width:80px !important;
    min-width:80px !important;
    margin:0 6px 0 0 !important;
  }

  .brand img{
    width:100% !important;
    height:auto !important;
    display:block !important;
  }

  nav{
    display:flex !important;
    flex:1 1 auto !important;
    flex-direction:row !important;
    align-items:center !important;
    gap:0 !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    scrollbar-width:none !important;
    -webkit-overflow-scrolling:touch !important;
    white-space:nowrap !important;
  }

  nav::-webkit-scrollbar{
    display:none !important;
  }

  nav a{
    display:flex !important;
    min-width:max-content !important;
    height:52px !important;
    padding:0 9px !important;
    font-size:9px !important;
    letter-spacing:.65px !important;
    border:0 !important;
    white-space:nowrap !important;
  }

  nav a:before,
  nav a i{
    display:none !important;
  }

  .follow{
    display:none !important;
  }

  main{
    width:100% !important;
    min-width:0 !important;
    overflow:hidden !important;
  }

  /* ---------- HERO MOBILE ---------- */
  .hero{
    position:relative !important;
    width:100% !important;
    height:760px !important;
    min-height:760px !important;
    padding:0 !important;
    overflow:hidden !important;
    background-position:50% center !important;
    background-size:auto 760px !important;
  }

  .hero:before{
    background:
      linear-gradient(
        180deg,
        rgba(0,0,0,.32) 0%,
        rgba(0,0,0,.10) 18%,
        rgba(0,0,0,.03) 58%,
        rgba(0,0,0,.26) 100%
      ) !important;
  }

  .mega-rb,
  .bg-cover{
    display:none !important;
  }

  .content{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    z-index:5 !important;
  }

  /* Votre Club: seul en haut */
  .content h2{
    position:absolute !important;
    top:14px !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    width:94% !important;
    margin:0 !important;
    padding:0 !important;
    text-align:center !important;
    white-space:normal !important;
    font-size:10px !important;
    line-height:1.4 !important;
    letter-spacing:2.4px !important;
    text-shadow:0 2px 7px rgba(0,0,0,.95) !important;
  }

  /* LE SON DE MONTRÉAL + 24H sous le slogan, sans chevauchement */
  .lower-left{
    position:absolute !important;
    left:14px !important;
    top:74px !important;
    width:calc(100% - 28px) !important;
    margin:0 !important;
    transform:none !important;
  }

  .lower-left .label{
    position:static !important;
    display:inline-flex !important;
    align-items:center !important;
    max-width:100% !important;
    margin:0 0 20px 0 !important;
    padding:8px 10px !important;
    font-size:8px !important;
    line-height:1 !important;
    letter-spacing:1.45px !important;
    white-space:nowrap !important;
  }

  .lower-left .label span{
    width:31px !important;
    height:13px !important;
  }

  .lower-left .party{
    position:static !important;
    display:flex !important;
    justify-content:flex-start !important;
    align-items:center !important;
    width:auto !important;
    max-width:100% !important;
    margin:0 !important;
    padding:0 0 0 2px !important;
    gap:10px !important;
    font-size:16px !important;
    letter-spacing:1.2px !important;
    white-space:nowrap !important;
  }

  .lower-left .party strong{
    font-size:13px !important;
    letter-spacing:1.2px !important;
  }

  /* Party Level compact, placé plus bas */
  .party-level{
    position:absolute !important;
    left:16px !important;
    top:510px !important;
    width:calc(100% - 32px) !important;
    margin:0 !important;
    z-index:8 !important;
  }

  .party-level-title{
    display:flex !important;
    justify-content:space-between !important;
    align-items:center !important;
    margin-bottom:6px !important;
    font-size:7px !important;
    line-height:1 !important;
    letter-spacing:1px !important;
  }

  .party-level-meter{
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
  }

  .party-level-track{
    height:7px !important;
  }

  .party-level-meter strong{
    width:34px !important;
    font-size:10px !important;
  }

  /* EN ONDES et LIVE bien alignés sur une seule ligne */
  .onair{
    position:absolute !important;
    left:16px !important;
    top:552px !important;
    width:calc(100% - 32px) !important;
    margin:0 !important;
    display:grid !important;
    grid-template-columns:38px minmax(0,1fr) auto !important;
    gap:8px !important;
    align-items:center !important;
  }

  .bars{
    width:38px !important;
    height:46px !important;
    gap:3px !important;
    padding-left:3px !important;
    border-left-width:3px !important;
  }

  .bars i{
    width:4px !important;
  }

  .onair small{
    font-size:7px !important;
    margin-bottom:4px !important;
  }

  .onair b{
    font-size:13px !important;
  }

  .onair p{
    display:none !important;
  }

  .live{
    padding:8px 9px !important;
    font-size:11px !important;
    letter-spacing:1px !important;
  }

  .live i{
    width:7px !important;
    height:7px !important;
    margin-left:5px !important;
  }

  /* Bloc septembre réduit pour ne plus envahir le bas */
  .return{
    position:absolute !important;
    left:16px !important;
    right:16px !important;
    bottom:14px !important;
    width:auto !important;
    min-height:0 !important;
    padding:14px 16px !important;
  }

  .return small{
    font-size:7px !important;
    letter-spacing:1.8px !important;
  }

  .return strong{
    margin:8px 0 !important;
    font-size:18px !important;
    line-height:1.05 !important;
    letter-spacing:2.5px !important;
  }

  .return span{
    font-size:7px !important;
    letter-spacing:1.7px !important;
  }

  .return .eq{
    width:120px !important;
    height:18px !important;
    margin-top:10px !important;
  }

  /* Player et footer */
  .player{
    width:100% !important;
    overflow:hidden !important;
    padding:0 !important;
  }

  #radio-widget-radiobeats{
    width:100% !important;
    min-height:96px !important;
  }

  footer{
    min-height:auto !important;
    padding:14px 10px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:center !important;
    gap:5px !important;
    text-align:center !important;
    font-size:8px !important;
    line-height:1.5 !important;
    letter-spacing:.5px !important;
  }

  .coolserv-shield-toast{
    right:10px !important;
    bottom:10px !important;
    width:calc(100vw - 20px) !important;
    max-width:none !important;
  }
}

/* Galaxy/Samsung narrower widths */
@media (max-width:430px){
  .side{
    height:72px !important;
    min-height:72px !important;
  }

  .brand{
    width:74px !important;
    min-width:74px !important;
  }

  nav a{
    height:50px !important;
    padding:0 8px !important;
    font-size:8.5px !important;
  }

  .hero{
    height:742px !important;
    min-height:742px !important;
    background-size:auto 742px !important;
  }

  .content h2{
    top:13px !important;
    font-size:9px !important;
    letter-spacing:2px !important;
  }

  .lower-left{
    top:70px !important;
  }

  .lower-left .party{
    font-size:15px !important;
  }

  .lower-left .party strong{
    font-size:12px !important;
  }

  .party-level{
    top:495px !important;
  }

  .onair{
    top:536px !important;
  }

  .return{
    bottom:12px !important;
  }
}


/* ==========================================================
   RADIOBEATS v1.6 — MOBILE FINAL, basé sur le HTML réel
   IMPORTANT: .label et .party sont des enfants directs de .content.
   ========================================================== */
@media (max-width:700px){

  /* Header */
  .side{
    height:72px!important;
    min-height:72px!important;
    padding:5px 7px!important;
  }
  .brand{
    width:72px!important;
    min-width:72px!important;
    margin:0 5px 0 0!important;
  }
  nav{
    overflow-x:auto!important;
    white-space:nowrap!important;
    scrollbar-width:none!important;
  }
  nav::-webkit-scrollbar{display:none!important}
  nav a{
    display:flex!important;
    height:48px!important;
    min-width:max-content!important;
    padding:0 8px!important;
    font-size:8.3px!important;
    letter-spacing:.55px!important;
  }
  nav a i{display:none!important}

  /* Hero */
  .hero{
    height:760px!important;
    min-height:760px!important;
    background-size:auto 760px!important;
    background-position:50% center!important;
  }
  .mega-rb,.bg-cover,.rb-title,.divider{display:none!important}

  .content{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
  }

  /* VOTRE CLUB : seul, centré en haut */
  .content > h2{
    position:absolute!important;
    top:14px!important;
    left:50%!important;
    transform:translateX(-50%)!important;
    width:92%!important;
    margin:0!important;
    padding:0!important;
    text-align:center!important;
    white-space:nowrap!important;
    font-size:9px!important;
    line-height:1.2!important;
    letter-spacing:2.3px!important;
    z-index:10!important;
  }

  /* LE SON DE MONTRÉAL : ligne séparée, sous le slogan */
  .content > .label{
    position:absolute!important;
    left:14px!important;
    top:64px!important;
    width:auto!important;
    max-width:calc(100% - 28px)!important;
    margin:0!important;
    padding:8px 10px!important;
    display:inline-flex!important;
    align-items:center!important;
    gap:10px!important;
    white-space:nowrap!important;
    font-size:8px!important;
    letter-spacing:1.4px!important;
    z-index:10!important;
  }
  .content > .label span{
    width:31px!important;
    height:13px!important;
  }

  /* 24H / PARTY NON STOP : séparé sous LE SON */
  .content > .party{
    position:absolute!important;
    left:14px!important;
    top:116px!important;
    width:auto!important;
    max-width:calc(100% - 28px)!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    justify-content:flex-start!important;
    align-items:center!important;
    gap:10px!important;
    white-space:nowrap!important;
    font-size:16px!important;
    letter-spacing:1.4px!important;
    z-index:10!important;
  }
  .content > .party strong{
    font-size:13px!important;
    letter-spacing:1.3px!important;
  }

  /* Party Level */
  .party-level{
    left:16px!important;
    top:505px!important;
    width:calc(100% - 32px)!important;
  }
  .party-level-title{
    font-size:7px!important;
    letter-spacing:1px!important;
    margin-bottom:6px!important;
  }
  .party-level-track{height:7px!important}
  .party-level-meter strong{
    width:34px!important;
    font-size:10px!important;
  }

  /* EN ONDES + LIVE */
  .onair{
    left:16px!important;
    top:548px!important;
    width:calc(100% - 32px)!important;
    margin:0!important;
    grid-template-columns:38px minmax(0,1fr) auto!important;
    gap:8px!important;
  }
  .bars{
    width:38px!important;
    height:45px!important;
    padding-left:3px!important;
    gap:3px!important;
  }
  .onair small{font-size:7px!important}
  .onair b{font-size:13px!important}
  .onair p{display:none!important}
  .live{
    padding:8px 9px!important;
    font-size:11px!important;
    letter-spacing:1px!important;
  }

  /* Septembre */
  .return{
    left:16px!important;
    right:16px!important;
    bottom:14px!important;
    width:auto!important;
    padding:14px 16px!important;
  }
  .return small{font-size:7px!important}
  .return strong{
    margin:8px 0!important;
    font-size:18px!important;
    letter-spacing:2.5px!important;
  }
  .return span{font-size:7px!important}
  .return .eq{
    width:120px!important;
    height:18px!important;
    margin-top:10px!important;
  }

  footer{
    padding:14px 10px!important;
    flex-direction:column!important;
    gap:5px!important;
    text-align:center!important;
    font-size:8px!important;
  }
}

@media (max-width:430px){
  .side{height:68px!important;min-height:68px!important}
  .brand{width:68px!important;min-width:68px!important}
  nav a{height:46px!important;padding:0 7px!important;font-size:8px!important}

  .hero{
    height:742px!important;
    min-height:742px!important;
    background-size:auto 742px!important;
  }

  .content > h2{
    top:12px!important;
    font-size:8.5px!important;
    letter-spacing:1.8px!important;
  }
  .content > .label{top:58px!important}
  .content > .party{
    top:108px!important;
    font-size:15px!important;
  }
  .content > .party strong{font-size:12px!important}

  .party-level{top:490px!important}
  .onair{top:532px!important}
  .return{bottom:12px!important}
}


/* ==========================================================
   RADIOBEATS v1.7
   MOBILE PORTRAIT + MOBILE LANDSCAPE TRAITÉS SÉPARÉMENT
   Desktop intact.
   ========================================================== */

/* ---------- PORTRAIT PHONE ---------- */
@media (max-width:700px) and (orientation:portrait){

  .side{
    height:72px!important;
    min-height:72px!important;
    padding:5px 7px!important;
  }

  .brand{
    width:70px!important;
    min-width:70px!important;
    margin:0 4px 0 0!important;
  }

  nav{
    overflow-x:auto!important;
    scrollbar-width:none!important;
  }

  nav::-webkit-scrollbar{display:none!important}

  nav a{
    display:flex!important;
    min-width:max-content!important;
    height:48px!important;
    padding:0 7px!important;
    font-size:8px!important;
    letter-spacing:.45px!important;
  }

  nav a i{display:none!important}

  .hero{
    height:735px!important;
    min-height:735px!important;
    background-size:auto 735px!important;
    background-position:50% center!important;
  }

  .mega-rb,.bg-cover,.rb-title,.divider{
    display:none!important;
  }

  .content{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
  }

  /* Slogan au-dessus, bien séparé */
  .content > h2{
    position:absolute!important;
    top:12px!important;
    left:50%!important;
    transform:translateX(-50%)!important;
    width:92%!important;
    margin:0!important;
    white-space:nowrap!important;
    text-align:center!important;
    font-size:8.5px!important;
    line-height:1.2!important;
    letter-spacing:1.7px!important;
  }

  /* LE SON */
  .content > .label{
    position:absolute!important;
    left:13px!important;
    top:58px!important;
    margin:0!important;
    padding:8px 10px!important;
    font-size:7.8px!important;
    letter-spacing:1.25px!important;
    white-space:nowrap!important;
  }

  .content > .label span{
    width:30px!important;
    height:12px!important;
  }

  /* 24H */
  .content > .party{
    position:absolute!important;
    left:13px!important;
    top:108px!important;
    width:auto!important;
    margin:0!important;
    padding:0!important;
    justify-content:flex-start!important;
    gap:10px!important;
    font-size:15px!important;
    letter-spacing:1.1px!important;
    white-space:nowrap!important;
  }

  .content > .party strong{
    font-size:12px!important;
    letter-spacing:1.05px!important;
  }

  /* Party Level */
  .party-level{
    left:15px!important;
    top:484px!important;
    width:calc(100% - 30px)!important;
  }

  .party-level-title{
    font-size:6.8px!important;
    letter-spacing:.9px!important;
    margin-bottom:5px!important;
  }

  .party-level-track{height:6px!important}

  .party-level-meter strong{
    width:32px!important;
    font-size:9px!important;
  }

  /* EN ONDES + LIVE */
  .onair{
    left:15px!important;
    top:524px!important;
    width:calc(100% - 30px)!important;
    margin:0!important;
    grid-template-columns:36px minmax(0,1fr) auto!important;
    gap:7px!important;
  }

  .bars{
    width:36px!important;
    height:43px!important;
    padding-left:3px!important;
    gap:3px!important;
  }

  .onair small{font-size:6.8px!important}
  .onair b{font-size:12px!important}
  .onair p{display:none!important}

  .live{
    padding:7px 8px!important;
    font-size:10px!important;
    letter-spacing:.8px!important;
  }

  /* Septembre plus petit et moins haut */
  .return{
    left:15px!important;
    right:15px!important;
    bottom:12px!important;
    width:auto!important;
    padding:13px 15px!important;
  }

  .return small{
    font-size:6.8px!important;
    letter-spacing:1.5px!important;
  }

  .return strong{
    margin:7px 0!important;
    font-size:17px!important;
    letter-spacing:2.2px!important;
  }

  .return span{
    font-size:6.8px!important;
    letter-spacing:1.5px!important;
  }

  .return .eq{
    width:110px!important;
    height:16px!important;
    margin-top:9px!important;
  }

  footer{
    padding:13px 9px!important;
    font-size:7.7px!important;
  }
}

/* ---------- LANDSCAPE PHONE ---------- */
@media (orientation:landscape) and (max-height:700px) and (max-width:1200px){

  html,body{
    width:100%!important;
    max-width:100%!important;
    overflow-x:hidden!important;
  }

  .site{
    display:block!important;
    width:100%!important;
  }

  .side{
    position:relative!important;
    width:100%!important;
    height:58px!important;
    min-height:58px!important;
    padding:4px 8px!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    gap:6px!important;
    border-right:0!important;
    border-bottom:1px solid #222!important;
  }

  .brand{
    width:66px!important;
    min-width:66px!important;
    margin:0 5px 0 0!important;
  }

  nav{
    display:flex!important;
    flex:1!important;
    flex-direction:row!important;
    overflow-x:auto!important;
    scrollbar-width:none!important;
  }

  nav::-webkit-scrollbar{display:none!important}

  nav a{
    display:flex!important;
    min-width:max-content!important;
    height:42px!important;
    padding:0 8px!important;
    font-size:8px!important;
    letter-spacing:.45px!important;
    border:0!important;
  }

  nav a i{display:none!important}
  .follow{display:none!important}

  main{
    width:100%!important;
    overflow:hidden!important;
  }

  .hero{
    height:500px!important;
    min-height:500px!important;
    background-size:cover!important;
    background-position:50% 52%!important;
  }

  .mega-rb,.bg-cover,.rb-title,.divider{
    display:none!important;
  }

  .content{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
  }

  .content > h2{
    position:absolute!important;
    top:12px!important;
    left:50%!important;
    transform:translateX(-50%)!important;
    width:auto!important;
    margin:0!important;
    white-space:nowrap!important;
    font-size:11px!important;
    letter-spacing:3px!important;
  }

  .content > .label{
    position:absolute!important;
    left:18px!important;
    top:44px!important;
    margin:0!important;
    padding:7px 10px!important;
    font-size:8px!important;
    letter-spacing:1.3px!important;
    white-space:nowrap!important;
  }

  .content > .label span{
    width:30px!important;
    height:12px!important;
  }

  .content > .party{
    position:absolute!important;
    left:18px!important;
    top:92px!important;
    width:auto!important;
    margin:0!important;
    padding:0!important;
    justify-content:flex-start!important;
    gap:10px!important;
    font-size:15px!important;
    letter-spacing:1.2px!important;
    white-space:nowrap!important;
  }

  .content > .party strong{
    font-size:12px!important;
    letter-spacing:1.1px!important;
  }

  .party-level{
    left:18px!important;
    top:350px!important;
    width:360px!important;
  }

  .party-level-title{
    font-size:7px!important;
    letter-spacing:1px!important;
    margin-bottom:5px!important;
  }

  .party-level-track{height:6px!important}
  .party-level-meter strong{font-size:9px!important;width:32px!important}

  .onair{
    left:18px!important;
    top:390px!important;
    width:430px!important;
    margin:0!important;
    grid-template-columns:36px 220px auto!important;
    gap:8px!important;
  }

  .bars{
    width:36px!important;
    height:42px!important;
    padding-left:3px!important;
    gap:3px!important;
  }

  .onair small{font-size:7px!important}
  .onair b{font-size:12px!important}
  .onair p{display:none!important}

  .live{
    padding:7px 8px!important;
    font-size:10px!important;
    letter-spacing:.8px!important;
  }

  .return{
    left:auto!important;
    right:16px!important;
    bottom:16px!important;
    width:270px!important;
    padding:14px 16px!important;
  }

  .return small{font-size:7px!important}
  .return strong{
    margin:8px 0!important;
    font-size:18px!important;
    letter-spacing:2.3px!important;
  }
  .return span{font-size:7px!important}
  .return .eq{
    width:115px!important;
    height:16px!important;
    margin-top:9px!important;
  }

  .player{
    width:100%!important;
  }

  footer{
    padding:10px 14px!important;
    flex-direction:row!important;
    justify-content:space-between!important;
    gap:10px!important;
    font-size:7.5px!important;
  }
}


/* ==========================================================
   RADIOBEATS v1.8 — PORTRAIT ONLY
   Landscape from v1.7 remains untouched.
   This block is last and deliberately stronger.
   ========================================================== */
@media screen and (orientation:portrait) and (max-width:900px){

  .side{
    height:74px!important;
    min-height:74px!important;
    padding:6px 8px!important;
  }

  .brand{
    width:74px!important;
    min-width:74px!important;
    margin:0 6px 0 0!important;
  }

  nav{
    display:flex!important;
    flex:1 1 auto!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    white-space:nowrap!important;
    scrollbar-width:none!important;
  }

  nav::-webkit-scrollbar{display:none!important}

  nav a{
    display:flex!important;
    min-width:max-content!important;
    height:50px!important;
    padding:0 8px!important;
    font-size:8.2px!important;
    letter-spacing:.45px!important;
  }

  nav a i,
  nav a:before{display:none!important}

  .follow{display:none!important}

  .hero{
    height:748px!important;
    min-height:748px!important;
    padding:0!important;
    background-size:auto 748px!important;
    background-position:50% center!important;
    overflow:hidden!important;
  }

  .mega-rb,
  .bg-cover,
  .rb-title,
  .divider{
    display:none!important;
  }

  .content{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    margin:0!important;
    padding:0!important;
  }

  /* 1. slogan tout seul, aucun chevauchement */
  .content > h2{
    position:absolute!important;
    top:18px!important;
    left:50%!important;
    transform:translateX(-50%)!important;
    width:94%!important;
    margin:0!important;
    padding:0!important;
    text-align:center!important;
    white-space:nowrap!important;
    font-size:8.6px!important;
    line-height:1.2!important;
    letter-spacing:1.7px!important;
    z-index:20!important;
  }

  /* 2. LE SON DE MONTRÉAL */
  .content > .label{
    position:absolute!important;
    left:15px!important;
    top:68px!important;
    width:auto!important;
    max-width:calc(100% - 30px)!important;
    margin:0!important;
    padding:8px 10px!important;
    display:inline-flex!important;
    align-items:center!important;
    gap:9px!important;
    white-space:nowrap!important;
    font-size:7.8px!important;
    letter-spacing:1.2px!important;
    z-index:20!important;
  }

  .content > .label span{
    width:30px!important;
    height:12px!important;
  }

  /* 3. 24H / PARTY NON STOP */
  .content > .party{
    position:absolute!important;
    left:15px!important;
    top:120px!important;
    width:auto!important;
    max-width:calc(100% - 30px)!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:10px!important;
    white-space:nowrap!important;
    font-size:15px!important;
    letter-spacing:1.1px!important;
    z-index:20!important;
  }

  .content > .party strong{
    font-size:12px!important;
    letter-spacing:1.05px!important;
  }

  /* 4. PARTY LEVEL */
  .content > .party-level{
    position:absolute!important;
    left:16px!important;
    top:492px!important;
    width:calc(100% - 32px)!important;
    margin:0!important;
    z-index:20!important;
  }

  .party-level-title{
    font-size:6.8px!important;
    letter-spacing:.9px!important;
    margin-bottom:5px!important;
  }

  .party-level-track{
    height:6px!important;
  }

  .party-level-meter strong{
    width:32px!important;
    font-size:9px!important;
  }

  /* 5. EN ONDES + LIVE */
  .content > .onair{
    position:absolute!important;
    left:16px!important;
    top:534px!important;
    width:calc(100% - 32px)!important;
    margin:0!important;
    display:grid!important;
    grid-template-columns:36px minmax(0,1fr) auto!important;
    gap:7px!important;
    align-items:center!important;
    z-index:20!important;
  }

  .bars{
    width:36px!important;
    height:43px!important;
    padding-left:3px!important;
    gap:3px!important;
  }

  .bars i{width:4px!important}
  .onair small{font-size:6.8px!important}
  .onair b{font-size:12px!important}
  .onair p{display:none!important}

  .live{
    padding:7px 8px!important;
    font-size:10px!important;
    letter-spacing:.8px!important;
  }

  /* 6. SEPTEMBRE */
  .return{
    position:absolute!important;
    left:16px!important;
    right:16px!important;
    bottom:14px!important;
    width:auto!important;
    min-height:0!important;
    padding:13px 15px!important;
    z-index:20!important;
  }

  .return small{
    font-size:6.8px!important;
    letter-spacing:1.5px!important;
  }

  .return strong{
    margin:7px 0!important;
    font-size:17px!important;
    line-height:1.05!important;
    letter-spacing:2.2px!important;
  }

  .return span{
    font-size:6.8px!important;
    letter-spacing:1.5px!important;
  }

  .return .eq{
    width:110px!important;
    height:16px!important;
    margin-top:9px!important;
  }

  .player{
    width:100%!important;
    overflow:hidden!important;
  }

  #radio-widget-radiobeats{
    width:100%!important;
    min-height:96px!important;
  }

  footer{
    padding:13px 9px!important;
    flex-direction:column!important;
    gap:5px!important;
    text-align:center!important;
    font-size:7.7px!important;
  }
}