/* RÉTRO FLASH ACTU — CSS canonique Audiences TV.

   Socle commun chargé avant. Cascade héritée préservée.

   1 Responsive tablette  2 Podium et analyse  3 Anti-chevauchement.

   Toutes les futures corrections audiences vont ICI. */

/* 1 · Responsive */

/* Tablette : conserver la hiérarchie validée, éviter les tableaux comprimés. */
body.audiences-page,body.audiences-page .sky{max-width:100%}
body.audiences-page .container{width:100%;max-width:1260px;margin-inline:auto}
body.audiences-page .shell{max-width:1260px}
@media (min-width:641px) and (max-width:1120px){
 body.audiences-page .container{padding-inline:20px}
 body.audiences-page .header-content{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:13px;height:auto;padding-block:14px;align-items:center}
 body.audiences-page .brand{min-width:0;grid-column:1;grid-row:1;gap:9px}
 body.audiences-page .brand-name>span{font-size:clamp(22px,3vw,29px)}
 body.audiences-page #community-header{grid-column:2;grid-row:1;margin:0}
 body.audiences-page #theme-toggle{grid-column:3;grid-row:1}
 body.audiences-page .search{grid-column:1/-1;grid-row:2;width:100%;min-width:0;margin:0}
 body.audiences-page .navigation{display:block;overflow-x:auto;scrollbar-width:thin}
 body.audiences-page .navigation .nav-inner{display:flex!important;align-items:center;gap:19px;min-width:max-content;width:max-content;height:48px}
 body.audiences-page .menu-toggle{display:none!important}
 body.audiences-page .nav-link{font-size:12px}
 body.audiences-page .shell{width:calc(100% - 36px)}
 body.audiences-page .aud-hero{height:auto;min-height:166px;gap:12px;flex-wrap:wrap;padding-block:18px}
 body.audiences-page .hero-filters{margin:0;width:100%;max-width:850px;display:flex;flex-wrap:wrap;gap:9px}
 body.audiences-page .filter{flex:1 1 160px;min-width:145px}
 body.audiences-page .topthree{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
 body.audiences-page .topthree .third{grid-column:auto}
 body.audiences-page .topcard{height:126px;min-width:0}
 body.audiences-page .medal-side{width:56px;min-width:56px}
 body.audiences-page .medal-icon strong{width:44px;height:52px;font-size:30px}
 body.audiences-page .medal-icon:before{bottom:28px;font-size:17px}
 body.audiences-page .top-details{padding:10px 8px}
 body.audiences-page .brand-badge{font-size:11px;padding:4px 6px}
 body.audiences-page .top-title{font-size:14px;max-width:100%;padding-right:50px;overflow-wrap:anywhere}
 body.audiences-page .top-number{font-size:20px}
 body.audiences-page .rank-panels{grid-template-columns:1fr;gap:12px}
 body.audiences-page .rank-table .rankchan{width:16%;white-space:normal;overflow-wrap:anywhere}
 body.audiences-page .rank-table .rankshow{width:49%}
 body.audiences-page .rank-table .rankshow strong{white-space:normal;overflow:visible;overflow-wrap:anywhere}
 body.audiences-page .rank-table .rankshow-inner{min-width:0}
 body.audiences-page .analysis-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
 body.audiences-page .container{padding-inline:15px}
 body.audiences-page .header-content{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;height:auto;padding-block:12px}
 body.audiences-page .brand{min-width:0;grid-row:1;grid-column:1}
 body.audiences-page .brand-name>span{font-size:clamp(18px,5.2vw,25px)}
 body.audiences-page #theme-toggle{grid-row:1;grid-column:2}
 body.audiences-page #menu-toggle{grid-row:1;grid-column:3}
 body.audiences-page .search{grid-row:2;grid-column:1/-1;width:100%;min-width:0}
 body.audiences-page #community-header{grid-row:3;grid-column:1/-1;justify-content:flex-start;margin:0;gap:10px}
 body.audiences-page .shell{width:calc(100% - 24px)}
 body.audiences-page .topthree{grid-template-columns:minmax(0,1fr)}
 body.audiences-page .topthree .third{grid-column:auto}
 body.audiences-page .topcard{width:100%}
 body.audiences-page .rank-panels{grid-template-columns:minmax(0,1fr)}
 body.audiences-page .rank-panels .panel{min-width:0;overflow-x:auto}
 body.audiences-page .rank-table{min-width:520px}
 body.audiences-page .rank-heading{gap:8px;flex-wrap:wrap}
 body.audiences-page .rank-find{max-width:100%;width:100%}
 body.audiences-page .analysis-grid{grid-template-columns:minmax(0,1fr)}
 body.audiences-page .hero-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 body.audiences-page .filter{min-width:0;width:100%}
 body.audiences-page .topline-inner{gap:10px}
 body.audiences-page .topline-inner>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}

/* 2 · Cartes, tableaux, analyses */

/* Corrige le chevauchement des podiums et panneaux Audiences TV.
   Les nombres ne flottent plus au-dessus des noms d'émission sur tablette. */
body.audiences-page .editorial .section-heading,
body.audiences-page .editorial h2{color:#f5f6ff!important}
body.audiences-page .premium-item{isolation:isolate}
body.audiences-page .premium-item .lock{top:auto;bottom:6px;transform:translateX(-50%);opacity:.38;font-size:23px;pointer-events:none}
body.audiences-page .premium-item strong,body.audiences-page .premium-item p{position:relative;z-index:2}
body.audiences-page .premium-item:after{z-index:0}
@media (max-width:1120px){
 body.audiences-page #topthree.topthree{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important;overflow:visible!important}
 body.audiences-page #topthree .topcard,
 body.audiences-page #topthree .topcard.third{
  display:grid!important;grid-template-columns:54px minmax(0,1fr)!important;
  grid-template-rows:minmax(79px,auto) auto!important;
  grid-column:auto!important;
  align-content:stretch!important;
  height:auto!important;min-height:220px!important;min-width:0!important;
  padding:0!important;overflow:hidden!important;
 }
 body.audiences-page #topthree .topcard .medal-side{
  display:grid!important;grid-column:1;grid-row:1 / span 2;min-width:54px!important;
  width:54px!important;height:100%;align-self:stretch
 }
 body.audiences-page #topthree .topcard .medal-icon strong{
  height:52px!important;width:44px!important;font-size:30px!important;
 }
 body.audiences-page #topthree .topcard .top-details{
  position:relative;grid-column:2;grid-row:1;
  display:flex!important;flex-direction:column!important;
  gap:4px;justify-content:flex-start!important;
  min-width:0!important;max-width:100%;padding:10px 10px 0!important;
  z-index:1
 }
 body.audiences-page #topthree .topcard .brand-badge{
  align-self:flex-start;margin:0 0 4px!important;font-size:11px!important;
  max-width:100%;overflow-wrap:break-word
 }
 body.audiences-page #topthree .topcard .top-title{
  position:static!important;max-width:100%!important;
  padding:0!important;margin:0!important;overflow-wrap:anywhere!important;
  font-size:clamp(13px,1.58vw,16px)!important;
  line-height:1.23!important;
  text-align:left!important
 }
 body.audiences-page #topthree .topcard .top-desc{
  position:static!important;max-width:100%!important;padding:0!important;
  font-size:10px!important;line-height:1.3!important;margin:3px 0 0!important
 }
 body.audiences-page #topthree .topcard .top-number{
  position:static!important;grid-column:2;grid-row:2;align-self:end!important;
  display:block!important;min-width:0;max-width:100%;z-index:2;
  text-align:left!important;padding:6px 10px 10px!important;
  font-size:clamp(22px,2.4vw,27px)!important;line-height:1.08!important;
  white-space:normal!important;overflow-wrap:normal
 }
 body.audiences-page #topthree .topcard .top-number small{
  display:block!important;font-size:10px!important;line-height:1.25!important;
  font-weight:500!important;color:#e5ecff!important;margin-top:2px!important
 }
 body.audiences-page #topthree .topcard .top-percent{
  display:block!important;position:static!important;font-size:clamp(17px,2vw,21px)!important;
  line-height:1.15!important;margin:8px 0 0!important
 }
 body.audiences-page .analysis-grid .panel{min-width:0;height:auto;min-height:235px}
 body.audiences-page .analysis-grid .section-heading{overflow-wrap:break-word}
}
@media (max-width:720px){
 body.audiences-page #topthree.topthree{grid-template-columns:1fr!important}
 body.audiences-page #topthree .topcard{min-height:175px!important;
  grid-template-columns:78px minmax(0,1fr)!important;grid-template-rows:auto auto!important}
 body.audiences-page #topthree .topcard .medal-side{width:78px!important;min-width:78px!important}
 body.audiences-page #topthree .topcard .top-title{font-size:17px!important}
 body.audiences-page #topthree .topcard .top-number{font-size:26px!important}
 body.audiences-page .analysis-grid{grid-template-columns:minmax(0,1fr)!important}
 body.audiences-page .analysis-grid .panel{width:100%;min-height:0}
 body.audiences-page .donut-wrap{grid-template-columns:minmax(0,1fr);justify-items:center;gap:16px}
 body.audiences-page .premium-item .lock{bottom:2px}
}
@media (min-width:721px) and (max-width:820px){
 body.audiences-page #topthree.topthree{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 body.audiences-page #topthree .topcard{min-height:208px!important}
}
@media (prefers-reduced-motion:reduce){
 body.audiences-page .topcard{transition:none!important}
}

/* 3 · Contrôle et repli anti-chevauchement */

/* Disposition de secours activée si le navigateur constate un chevauchement réel. */
body.audiences-page #topthree .topcard.rfa-topcard-reflow{
 display:grid!important;grid-template-columns:72px minmax(0,1fr)!important;
 grid-template-rows:auto auto!important;height:auto!important;
 min-height:205px!important;align-content:stretch!important;
}
body.audiences-page #topthree .topcard.rfa-topcard-reflow .medal-side{
 grid-column:1;grid-row:1 / span 2;min-width:72px!important;width:72px!important;
 height:100%;align-self:stretch
}
body.audiences-page #topthree .topcard.rfa-topcard-reflow .top-details{
 grid-column:2;grid-row:1;display:flex!important;min-width:0;
 padding:10px!important;justify-content:flex-start!important;
 flex-direction:column!important;gap:7px!important;
}
body.audiences-page #topthree .topcard.rfa-topcard-reflow .top-title{
 max-width:100%!important;padding:0!important;margin:0!important;
 position:static!important;overflow-wrap:anywhere!important;font-size:15px!important;
 line-height:1.24!important
}
body.audiences-page #topthree .topcard.rfa-topcard-reflow .top-desc{font-size:10px!important}
body.audiences-page #topthree .topcard.rfa-topcard-reflow .top-number{
 grid-column:2;grid-row:2;position:static!important;
 display:block!important;align-self:end!important;text-align:left!important;
 padding:5px 10px 10px!important;font-size:24px!important;
}
body.audiences-page #topthree .topcard.rfa-topcard-reflow .top-percent{
 position:static!important;margin:7px 0 0!important;font-size:19px!important;
}
body.audiences-page #topthree .topcard.rfa-topcard-reflow .top-number small{
 display:block!important;font-size:10px!important;line-height:1.25!important;
}
@media(max-width:480px){
 body.audiences-page #topthree .topcard.rfa-topcard-reflow{
   grid-template-columns:64px minmax(0,1fr)!important
 }
 body.audiences-page #topthree .topcard.rfa-topcard-reflow .medal-side{
   min-width:64px!important;width:64px!important
 }
}

/* Les tablettes autour de 900–1100 px n'ont pas assez de largeur
   pour trois titres, médailles et compteurs côte à côte : podium 2 + 1. */
@media (min-width:821px) and (max-width:1120px){
 body.audiences-page #topthree.topthree{
   display:grid!important;
   grid-template-columns:repeat(2,minmax(0,1fr))!important;
   gap:14px!important
 }
 body.audiences-page #topthree .topcard.third{
   grid-column:1 / -1!important
 }
 body.audiences-page #topthree .topcard{
   height:auto!important;
   min-height:195px!important
 }
 body.audiences-page #topthree .topcard .top-details{
   padding:13px 14px 2px!important
 }
 body.audiences-page #topthree .topcard .top-title{
   max-width:100%!important;padding:0!important;
   font-size:17px!important
 }
 body.audiences-page #topthree .topcard .top-number{
   padding:5px 14px 13px!important;
   position:static!important;grid-row:2!important;grid-column:2!important
 }
}

/* Résultats partiels : légende détaillée sans débordement mobile. */
body.audiences-page #analysis .legend,
body.audiences-page #analysis .legend-row{min-width:0;max-width:100%}
body.audiences-page #analysis .legend-row span{
  min-width:0;overflow-wrap:anywhere;word-break:normal;line-height:1.35;
}
body.audiences-page #analysis .legend .simple-note{
  margin-top:12px;font-size:11px;line-height:1.55;overflow-wrap:break-word;
}
body.audiences-page #ranking-section .count{overflow-wrap:anywhere}
@media(max-width:640px){
  body.audiences-page #analysis .legend{width:100%}
}