/* Vitrine : squelette d'un profil MYM. Bandeau, portrait, liens, mur.
   Alba ivoire. Nera nuit. Maquette Opus 5.5, 10/10. */
html:has(.v-book){background:#120c10}
html:has(.v-alba):not(:has(.v-nera)){background:#f4f0ec}
html:has(.v-book) body{background:transparent;color:inherit}
.v-vitrine [hidden]{display:none !important}

.v-vitrine{
  position:relative;max-width:none;margin:0 auto;
  font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
}
.v-barre{
  position:absolute;top:0;left:0;right:0;z-index:6;
  display:flex;align-items:center;justify-content:space-between;
  box-sizing:content-box;height:48px;padding:env(safe-area-inset-top) 16px 0;
  color:#fff;pointer-events:none;
}
.v-barre a,.v-barre button{pointer-events:auto}
.v-marque{
  display:inline-flex;align-items:center;min-height:32px;padding:0 12px;
  background:#f4f0ec;color:#1a1614;border-radius:16px;
  font-size:13px;font-weight:650;line-height:1;letter-spacing:.16em;text-transform:uppercase;
  text-shadow:none;
}

.v-book{position:relative;padding-bottom:2px}
.v-alba{background:#f4f0ec;color:#1a1614}
.v-nera{background:#120c10;color:#fff6f8}

/* Un seul cadre : 210px de haut sur 390 de large, à toutes les tailles, et .mise de l'admin pareil.
   Cadrage (couv_z/x/y) en style inline studio_hestia_couv_style : la même zone partout. */
.v-couv{display:block;aspect-ratio:390/210;margin:0;overflow:hidden}
.v-couv img{display:block;width:100%;height:100%;object-fit:cover}
.v-alba .v-couv{background:#e7e0d8}
.v-nera .v-couv{background:#1e161b}
.v-nera .v-couv img{filter:contrast(1.05) saturate(.9)}

.v-entete{
  position:relative;z-index:2;margin:0;padding:0 20px 4px;
  display:grid;grid-template-columns:1fr;row-gap:0;
}
.v-id{display:contents}
.v-avatar{
  grid-column:1;justify-self:start;
  position:relative;display:block;box-sizing:border-box;
  width:96px;height:96px;margin-top:-48px;margin-bottom:18px;
  border:3px solid;border-radius:50%;overflow:hidden;
}
.v-alba .v-avatar{border-color:#f4f0ec;background:#e7e0d8}
button.v-avatar{-webkit-appearance:none;appearance:none;padding:0;overflow:hidden;cursor:zoom-in;font:inherit;color:inherit}
/* Cadrage du profil (madi_inf_hestia_fiche.profil_z/x/y) en style inline, en % du rond :
   la même zone sur le rond de 96 et celui de 148. Même règle que les ronds de .mise (characters.php). */
.v-avatar img{position:absolute;left:0;top:0;display:block;width:100%;height:100%;max-width:none;object-fit:cover}
.v-nera .v-avatar{border-color:#120c10;background:#1e161b}

.v-nom,.v-mot,.v-bio{margin:0;font-weight:400}
.v-nom{grid-column:1;margin:0;font-size:34px;line-height:1.05;font-weight:650;letter-spacing:.01em}
.v-mot{grid-column:1;margin-top:10px;font-size:18px;line-height:1.35}
.v-bio{grid-column:1;margin-top:8px;font-size:16px;line-height:1.4}
.v-bio.libre{font-style:normal;letter-spacing:0;text-transform:none;white-space:pre-line;font-size:15px;font-weight:450}

.v-alba .v-nom{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-size:36px;letter-spacing:.02em}
.v-alba .v-bio{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-style:italic;font-size:16px;line-height:1.45;color:rgba(26,22,20,.78);white-space:pre-line}
.v-nera .v-nom{font-weight:600;font-size:26px;letter-spacing:-.02em}
.v-nera .v-mot{font-weight:300;color:#fff6f8}
.v-nera .v-bio{margin-top:8px;font-size:11px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:rgba(255,246,248,.55)}
.v-nera .v-bio.libre{font-size:15px;font-weight:450;letter-spacing:0;text-transform:none;color:rgba(255,246,248,.82)}

.v-actions{grid-column:1;display:flex;flex-direction:column;align-items:stretch;gap:8px;margin-top:18px}
/* Fanvue plein, en premier : c'est l'abonnement. Instagram en contour, ensuite. */
.v-reseau{
  display:flex;align-items:center;justify-content:center;gap:10px;
  box-sizing:border-box;width:100%;min-height:52px;padding:0 18px;
  border:1.5px solid currentColor;border-radius:999px;background:transparent;text-decoration:none;
  font-size:16px;font-weight:650;line-height:1;letter-spacing:.01em;white-space:nowrap;
  transition:opacity .15s,background .15s,filter .15s;
}
.v-alba .v-reseau{color:#1a1614}
.v-nera .v-reseau{color:#fff6f8}
.v-alba .v-reseau.v-principal{background:#1a1614;border-color:#1a1614;color:#f4f0ec}
.v-nera .v-reseau.v-principal{background:#fff6f8;border-color:#fff6f8;color:#120c10}
.v-reseau:active{opacity:.72}
.v-note{
  margin:16px 20px 22px;text-align:center;
  font-size:12px;line-height:1.35;letter-spacing:.04em;font-weight:500;opacity:.5;
}
.v-reseau .fa-brands,.v-reseau .v-fv{flex:none;display:block;width:auto;height:1em;font-size:20px;line-height:1}
.v-reseau .v-fv{width:.875em;fill:currentColor}
.v-reseau:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.v-alba .v-reseau.v-principal:focus-visible{outline-color:#1a1614}

.v-voix,.v-suite{
  display:flex;align-items:center;min-height:44px;padding:0 8px;
  border:0;background:none;color:inherit;font-size:14px;opacity:.75;cursor:pointer;
  text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;
}
.v-voix{align-self:center;justify-content:center}
.v-voix:hover,.v-suite:hover{opacity:1}
.v-alba .v-voix{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-style:italic;font-size:16px}
.v-nera .v-voix{font-size:11px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;text-decoration:none}
.v-suite{justify-content:flex-end;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;text-decoration:none}

.v-vision{position:static;margin-top:14px;padding:0}
.v-scene{display:none}
.galerie{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin:0;padding:0}
.v-piece{
  position:relative;display:block;width:100%;aspect-ratio:1/1;
  margin:0;padding:0;border:0;border-radius:0;overflow:hidden;
  color:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent;
}
.v-alba .v-piece{background:#e7e0d8}
.v-nera .v-piece{background:#1e161b}
.v-piece img{
  position:absolute;inset:0;display:block;width:100%;height:100%;
  object-fit:cover;object-position:center 22%;
}
.v-piece:focus-visible{outline:2px solid #fff;outline-offset:-2px}
.v-piece.on::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;box-shadow:inset 0 0 0 2px}
.v-alba .v-piece.on::after{color:#f4f0ec}
.v-nera .v-piece.on::after{color:#fff6f8}

.v-play{
  position:absolute;top:6px;right:7px;z-index:2;
  font-size:10px;line-height:1;color:#fff;
  text-shadow:0 0 6px rgba(0,0,0,.7);pointer-events:none;
}
/* Flou léger : pose, silhouette et lumière se devinent, pas le visage. */
.v-piece:has(.v-voile) img{filter:blur(8px)}
.v-voile{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:rgba(18,12,16,.08);
}
.v-alba .v-voile{background:rgba(244,240,236,.08)}
a.v-piece{text-decoration:none}
span.v-piece{cursor:default}
.v-cadenas{
  position:absolute;top:50%;left:50%;z-index:2;transform:translate(-50%,-50%);
  display:flex;align-items:center;justify-content:center;
  width:36px;height:36px;margin:0;border-radius:50%;
  background:rgba(18,12,16,.55);color:#fff6f8;font-size:13px;line-height:1;pointer-events:none;
}
.v-alba .v-cadenas{background:rgba(26,22,20,.55);color:#f4f0ec}
.v-cadenas:empty::before{
  content:"";position:absolute;top:8px;left:50%;width:6px;height:6px;margin-left:-4.5px;
  border:1.5px solid currentColor;border-bottom:0;border-radius:4px 4px 0 0;
}
.v-cadenas:empty::after{
  content:"";position:absolute;top:14px;left:50%;width:12px;height:9px;margin-left:-6px;
  border-radius:1.5px;background:currentColor;
}
/* Floue liée : cadenas au-dessus, « Fanvue » dessous, le groupe centré dans la tuile. */
.v-fv-tuile{
  position:absolute;top:50%;left:50%;z-index:2;transform:translateX(-50%);margin-top:10px;
  display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border-radius:12px;
  background:rgba(18,12,16,.55);color:#fff6f8;font-size:12px;font-weight:650;line-height:1;white-space:nowrap;pointer-events:none;
}
.v-alba .v-fv-tuile{background:rgba(26,22,20,.55);color:#f4f0ec}
.v-fv-tuile .v-fv{flex:none;display:block;width:.875em;height:1em;fill:currentColor}
a.v-piece:hover .v-fv-tuile{background:rgba(18,12,16,.75)}
.v-alba a.v-piece:hover .v-fv-tuile{background:rgba(26,22,20,.75)}

.v-lightbox{
  position:fixed;inset:0;z-index:40;
  display:flex;align-items:center;justify-content:center;
  padding:16px;background:rgba(10,7,9,.96);color:#fff6f8;
}
.v-lightbox img,.v-lightbox video{max-width:100%;max-height:calc(100dvh - 96px);object-fit:contain}
.v-lightbox.flou img,.v-lightbox.flou video{filter:blur(46px);transform:scale(1.25)}
.v-lightbox-x{
  position:absolute;top:calc(8px + env(safe-area-inset-top));right:8px;z-index:2;
  width:44px;height:44px;padding:0;border:0;background:none;
  color:inherit;font-size:20px;line-height:44px;cursor:pointer;
}
.v-fleche{
  position:absolute;top:50%;z-index:2;width:44px;height:64px;margin-top:-32px;
  padding:0;border:0;background:none;color:inherit;
  font-size:34px;line-height:64px;opacity:.75;cursor:pointer;
}
.v-fleche:hover{opacity:1}
.v-prec{left:4px}
.v-suiv{right:4px}
.v-compteur{
  position:absolute;left:0;right:0;bottom:calc(16px + env(safe-area-inset-bottom));
  text-align:center;font-size:11px;letter-spacing:.2em;font-variant-numeric:tabular-nums;opacity:.6;
}
.v-lightbox.seule .v-fleche,.v-lightbox.seule .v-compteur{display:none}

@media(min-width:960px){
  .v-vitrine{max-width:980px;margin:28px auto 48px}
  .v-entete{
    grid-template-columns:148px minmax(0,1fr) auto;
    column-gap:28px;row-gap:0;align-items:start;padding:4px 32px 16px;
  }
  .v-avatar{width:148px;height:148px;margin:-74px 0 0;grid-column:1;grid-row:1 / span 3;align-self:start}
  .v-alba .v-nom,.v-nera .v-nom{grid-column:2;grid-row:1;margin:6px 0 0;align-self:center;font-size:40px}
  .v-mot{grid-column:2;grid-row:2;margin-top:12px}
  .v-bio{grid-column:2 / -1;grid-row:3;margin-top:10px}
  .v-actions{
    grid-column:3;grid-row:1;align-self:center;
    flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:flex-end;
    width:max-content;max-width:none;margin:6px 0 0;gap:10px;
  }
  .v-reseau{width:auto;flex:0 0 auto;min-width:164px;max-width:none;padding:0 22px}
  .v-note{margin:18px 32px 22px}
  .v-vision{margin-top:22px}
  .galerie{gap:4px}
}
.v-book + .v-book{margin-top:28px}
@media(hover:hover){
  .v-alba .v-reseau.v-principal:hover{filter:brightness(1.18)}
  .v-nera .v-reseau.v-principal:hover{filter:brightness(.96)}
  .v-alba .v-reseau:not(.v-principal):hover{background:rgba(26,22,20,.05)}
  .v-nera .v-reseau:not(.v-principal):hover{background:rgba(255,246,248,.08)}
}
@media(prefers-reduced-motion:reduce){
  .v-reseau{transition:none}
}
.cookie-banner{position:fixed;bottom:0;left:0;right:0;z-index:10000;background:#1a1614;color:#f4f0ec;
  transform:translateY(100%);transition:transform .35s ease}
.cookie-banner.visible{transform:translateY(0)}
.cookie-banner-inner{max-width:880px;margin:0 auto;padding:16px 18px;display:flex;align-items:center;gap:16px}
.cookie-banner-icon{display:none}
.cookie-banner-text{flex:1;font-size:13px;line-height:1.45}
.cookie-banner-text a{color:#f4f0ec}
.cookie-banner-actions{display:flex;gap:8px;flex-shrink:0}
.cookie-btn{font:600 13px/1 inherit;padding:10px 16px;border-radius:10px;cursor:pointer;border:0}
.cookie-btn-accept{background:#f4f0ec;color:#1a1614}
.cookie-btn-refuse{background:transparent;color:#f4f0ec;border:1px solid rgba(244,240,236,.35)}
@media(max-width:768px){
  .cookie-banner-inner{flex-direction:column;align-items:stretch}
  .cookie-banner-actions{display:flex}
  .cookie-btn{flex:1}
}