/* ========================================================================== */
/* ETHNOS R554 — Univers des créateurs : bandeau réel + flux 20 + cartes     */
/* Base active : R553. Périmètre strict : vue houses uniquement.              */
/* ========================================================================== */

/* 1. Le bandeau R554 est l'unique surface haute : aucune photo panoramique   */
/* héritée ne doit exister derrière lui.                                       */
html body .bodyView-houses.r554UniverseHub{
  padding-top:0 !important;
  background:#061822 !important;
  background-image:none !important;
}
html body .bodyView-houses.r554UniverseHub .bodyViewHeader.r554UniverseHero{
  margin:0 !important;
  background:#061822 !important;
  background-image:linear-gradient(180deg,#071f2d 0%,#061822 100%) !important;
}
html body .bodyView-houses.r554UniverseHub .bodyViewHeader.r554UniverseHero::before,
html body .bodyView-houses.r554UniverseHub .bodyViewHeader.r554UniverseHero::after{
  display:none !important;
  content:none !important;
}

/* 2. La première photographie est volontairement très étroite : recadrage   */
/* CSS non destructif, le fichier source reste intact.                         */
.r554UniversePhotoMosaic{
  grid-template-columns:clamp(132px,8vw,175px) repeat(3,minmax(0,1fr)) !important;
}
.r554UniversePhotoMosaic .isOrigin{
  background-position:58% center !important;
}

/* 3. Une seule liste est affichée à la fois.                                  */
.r554UniverseFeed [data-r554-universe-section][hidden]{
  display:none !important;
}
.r554UniverseRailNav a.isActive{
  border-color:rgba(64,208,207,.42) !important;
  background:rgba(64,208,207,.11) !important;
  color:#fff !important;
  box-shadow:inset 3px 0 0 #40d0cf !important;
}
.r554UniverseRailNav a.isActive b{color:#ff9b61 !important}

/* 4. Filtres compacts : Thème → Pays → Ville, sans étirement sur la ligne.    */
html body .r554UniverseFeed .r554UniverseFilters{
  grid-template-columns:minmax(220px,280px) minmax(165px,190px) minmax(180px,220px) !important;
  justify-content:start !important;
  width:max-content !important;
  max-width:100% !important;
  gap:10px !important;
}
html body .r554UniverseFeed .r554UniverseFilters label{
  min-width:0 !important;
  width:100% !important;
}
html body .r554UniverseFeed .r554UniverseFilters select{
  width:100% !important;
}

/* 5. Cartes : identité ramenée en haut, catégories plus lisibles, pied fixe.  */
html body .r554UniverseFeed .r554UniverseCard .r551UniverseCardBody{
  padding:8px 10px 9px !important;
}
html body .r554UniverseFeed .r554UniverseCard .r551UniverseCardBody header{
  align-items:start !important;
  gap:8px !important;
}
html body .r554UniverseFeed .r554UniverseCard .r551UniverseCardBody header small{
  margin-top:1px !important;
  font-size:8px !important;
  line-height:1.12 !important;
}
.r554UniverseNameLine{
  display:flex !important;
  align-items:center !important;
  gap:5px !important;
  min-width:0 !important;
  margin-top:1px !important;
}
html body .r554UniverseFeed .r554UniverseNameLine h3{
  flex:0 1 auto !important;
  min-width:0 !important;
  margin:0 !important;
}
.r554UniverseOfficialBadge{
  position:relative !important;
  display:inline-grid !important;
  place-items:center !important;
  flex:0 0 auto !important;
  width:19px !important;
  height:19px !important;
  border-radius:50% !important;
  outline:none !important;
  vertical-align:middle !important;
}
.r554UniverseOfficialBadge img{
  display:block !important;
  width:19px !important;
  height:19px !important;
  object-fit:contain !important;
}
.r554UniverseOfficialBadge::after{
  content:attr(data-r554-tooltip) !important;
  position:absolute !important;
  z-index:20 !important;
  left:50% !important;
  top:calc(100% + 6px) !important;
  transform:translateX(-50%) translateY(-2px) !important;
  padding:5px 7px !important;
  border-radius:5px !important;
  background:#101820 !important;
  color:#fff !important;
  font:600 10px/1.1 Inter,"Segoe UI",Arial,sans-serif !important;
  white-space:nowrap !important;
  opacity:0 !important;
  pointer-events:none !important;
  transition:opacity .12s ease,transform .12s ease !important;
}
@media (hover:hover) and (pointer:fine){
  .r554UniverseOfficialBadge:hover::after{
    opacity:1 !important;
    transform:translateX(-50%) translateY(0) !important;
  }
}
.r554UniverseOfficialBadge:focus-visible::after{
  opacity:1 !important;
  transform:translateX(-50%) translateY(0) !important;
}
html body .r554UniverseFeed .r554UniverseCard .r492UniverseDescription{
  margin:5px 0 5px !important;
  line-height:1.28 !important;
}
html body .r554UniverseFeed .r554UniverseCard .r492UniverseThemes{
  gap:4px !important;
  max-height:44px !important;
}
html body .r554UniverseFeed .r554UniverseCard .r492UniverseThemes span{
  padding:3px 7px !important;
  font-size:8.5px !important;
  line-height:1.15 !important;
}
html body .r554UniverseFeed .r554UniverseCard .r551UniverseCardBody footer{
  margin-top:auto !important;
  padding-top:6px !important;
  border-top:0 !important;
}
html body .r554UniverseFeed .r554UniverseCard .r551UniverseCardBody footer > span{
  font-size:8px !important;
}
html body .r554UniverseFeed .r554UniverseCard .r551UniverseCardBody footer > span b{
  font-weight:700 !important;
}

@media (min-width:1500px){
  html body .r554UniverseFeed .r554UniverseCard .r492UniverseThemes span{
    padding:3px 7px !important;
    font-size:9px !important;
  }
}
@media (max-width:1100px){
  html body .r554UniverseFeed .r554UniverseFilters{
    grid-template-columns:minmax(205px,260px) minmax(160px,180px) minmax(170px,205px) !important;
  }
}
@media (max-width:900px){
  .r554UniversePhotoMosaic{
    grid-template-columns:clamp(116px,24vw,150px) repeat(3,minmax(0,1fr)) !important;
  }
  html body .r554UniverseFeed .r554UniverseFilters{
    grid-template-columns:1fr !important;
    width:100% !important;
  }
}
