/* zenvy-chrome.css — habillage commun des pages secondaires de zenvy.social (25/09/2026).
   Même fond vivant que l'accueil (zenvy-bg.js), même barre du haut fixe, même base de page.
   Chaque page définit --zv-max (largeur de son contenu, marges comprises) pour que la barre s'aligne dessus. */
/* Variables de thème : les MÊMES valeurs que l'accueil (accents, Z, dégradé de titre, lueur, teinte de fond).
   Le thème choisi sur l'accueil est mémorisé (localStorage) et posé sur <body data-theme> par zenvy-theme.js. */
:root{--violet:#7C3AED;--orange:#F97316;--peach:#FDBA74;
  --a1:#9D6BFF;--a2:#5F18D0;--glow:rgba(95,24,208,0.35);--z1:#D4A0FF;--z2:#7C3AED;
  --g1:var(--violet);--g2:var(--orange);--g3:var(--peach);--tint:rgba(124,58,237,0.12);--line:rgba(157,107,255,0.30);--bar:#1A1035}
body[data-theme="orage"]{--bar:#0B1D3A;--a1:#5FB0FF;--a2:#1B5FC4;--z1:#9FD2FF;--z2:#1B5FC4;--glow:rgba(27,95,196,0.4);--g1:#1B5FC4;--g2:#5FB0FF;--g3:#9FD2FF;--tint:rgba(95,176,255,0.12);--line:rgba(95,176,255,0.30)}
body[data-theme="fuego"]{--bar:#2A0E06;--a1:#FF6B1F;--a2:#8E1202;--z1:#FFB36B;--z2:#B32505;--glow:rgba(255,107,31,0.35);--g1:#B32505;--g2:#FF6B1F;--g3:#FFB36B;--tint:rgba(255,107,31,0.12);--line:rgba(255,107,31,0.30)}
body[data-theme="aurore"]{--bar:#0A2A27;--a1:#5AE9C8;--a2:#17A98E;--z1:#9CF7E0;--z2:#0F8FA8;--glow:rgba(23,169,142,0.4);--g1:#17A98E;--g2:#5AE9C8;--g3:#9CF7E0;--tint:rgba(90,233,200,0.12);--line:rgba(90,233,200,0.30)}
body[data-theme="rubis"]{--bar:#22101A;--a1:#FF2D6B;--a2:#7A0A2E;--z1:#FF8FB0;--z2:#A3123A;--glow:rgba(255,45,107,0.35);--g1:#A3123A;--g2:#FF2D6B;--g3:#FF8FB0;--tint:rgba(255,45,107,0.12);--line:rgba(255,45,107,0.30)}
.z{background:linear-gradient(180deg,var(--z1) 0%,var(--z1) 40%,var(--z2) 85%)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent}
/* Mot ou titre en dégradé animé : exactement « c'est maintenant » de l'accueil */
@keyframes zvFlow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.zv-grad-text{background:linear-gradient(135deg,var(--g1) 0%,var(--g2) 35%,var(--g3) 70%,var(--g1) 100%);background-size:200% 200%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:zvFlow 8s ease-in-out infinite}
/* Fond de page OPAQUE par thème sur html ET body : Safari (Mac) teinte sa barre d'outils avec le fond du <body>
   (pas avec theme-color, mesuré le 25/09/2026) ; un bord non couvert n'est jamais noir. Le canevas passe donc
   au-dessus du fond du body (z-index 0) et le contenu de la page au-dessus du canevas (z-index 1). */
html{background:var(--bar) !important;overscroll-behavior-y:none}
body{background:var(--bar) !important;overscroll-behavior-y:none}
body > *:not(#bg):not(script):not(.zv-nav){position:relative;z-index:1}
html.no-webgl body{background:linear-gradient(180deg,#1A1035 0%,#221548 40%,#0D0818 100%) !important}
#bg{position:fixed;top:-300px;left:0;width:100%;height:calc(100% + 600px);height:calc(100lvh + 600px);z-index:0;pointer-events:none} /* déborde de 300 px en haut et en bas : couvre les barres du téléphone ET le rebond de fin de page, qui entraîne les éléments fixes avec lui sur iPhone (Walid 25/09/2026, page légale) */
.ambient{display:none !important}
.zv-nav{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;justify-content:space-between;
  padding:14px max(24px,calc((100% - var(--zv-max,1040px)) / 2 + 24px));background:rgba(10,10,15,0.55);border-bottom:1px solid rgba(255,255,255,0.05);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);font-family:'Inter',-apple-system,sans-serif}
.zv-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#F8FAFC;font-weight:900;letter-spacing:-0.03em;font-size:20px}
.zv-brand img{height:34px;width:auto}
.zv-brand .z{background:none!important;-webkit-text-fill-color:currentColor!important;margin-right:0.06em} /* Z blanc dans l'en-tête, comme l'accueil (Walid 03/10/2026) */
.zv-back{color:#FFF;text-decoration:none;font-size:14px;font-weight:700;opacity:.9}
.zv-back:hover{opacity:1}