/* ═══════════════════════════════════════════════════════════════
   StreamVox V3 — couche de design partagée
   Active par défaut. ?ui=v2 → interface V2, ?ui=old → V1, ?ui=v3 → V3 (mémorisé sur l'appareil)
   Tout est préfixé html.v3 : sans la classe, ce fichier ne change rien.
   ═══════════════════════════════════════════════════════════════ */

html.v3{
  --bg:#09090e;--bg2:#12121a;--bg3:#1a1a25;--bg4:#222230;
  --red:#ee1d45;--red2:#ff3d63;--red3:rgba(238,29,69,.16);
  --gray:#9a9ab0;--light:#d0d0e0;
  --radius:16px;--radius-sm:12px;
  --line:rgba(255,255,255,.08);
  --display:'Bricolage Grotesque','Inter',system-ui,sans-serif;
  --accent:linear-gradient(135deg,var(--red2),var(--red) 60%,color-mix(in srgb,var(--red) 78%,#000));
}
/* Thèmes saisonniers / couleurs (réglés dans l'admin) : doivent passer devant les valeurs V3 */
html.v3[data-theme="printemps"]{--red:#22c55e;--red2:#4ade80;--red3:rgba(34,197,94,.16);--gold:#f472b6}
html.v3[data-theme="ete"]{--red:#06b6d4;--red2:#22d3ee;--red3:rgba(6,182,212,.16);--gold:#fde047}
html.v3[data-theme="automne"]{--red:#f97316;--red2:#fb923c;--red3:rgba(249,115,22,.16);--gold:#a855f7}
html.v3[data-theme="hiver"]{--red:#dc2626;--red2:#ef4444;--red3:rgba(220,38,38,.16);--gold:#d4af37}
html.v3[data-theme="violet"]{--red:#8b5cf6;--red2:#a78bfa;--red3:rgba(139,92,246,.16);--gold:#22d3ee}
html.v3[data-theme="rose"]{--red:#ec4899;--red2:#f472b6;--red3:rgba(236,72,153,.16);--gold:#f5c518}
html.v3[data-theme="bleu"]{--red:#3b82f6;--red2:#60a5fa;--red3:rgba(59,130,246,.16);--gold:#f97316}
html.v3[data-theme="emeraude"]{--red:#10b981;--red2:#34d399;--red3:rgba(16,185,129,.16);--gold:#f5c518}
html.v3[data-theme="corail"]{--red:#fb7185;--red2:#fda4af;--red3:rgba(251,113,133,.16);--gold:#fbbf24}

html.v3 body{
  background:
    radial-gradient(1000px 520px at 88% -8%,color-mix(in srgb,var(--red) 12%,transparent),transparent 62%),
    radial-gradient(900px 520px at -6% 6%,rgba(110,80,255,.09),transparent 60%),
    #09090e fixed;
}
html.v3 ::selection{background:color-mix(in srgb,var(--red) 55%,transparent);color:#fff}

/* ── Typographie d'affichage ── */
html.v3 .nav-logo,
html.v3 .section-title,
html.v3 .catalogue-title,
html.v3 .profiles-title,
html.v3 .hero-title,
html.v3 .page-hero h1,
html.v3 .radio-header h1,
html.v3 .tv-header h1{font-family:var(--display);letter-spacing:-.035em}
html.v3 .nav-logo{font-weight:800}
html.v3 .nav-logo span{color:var(--red2)}

/* ── Barre de navigation : pastille flottante (bureau) ── */
@media(min-width:769px){
  html.v3 nav.v3-pill{
    top:14px;left:50%;right:auto;transform:translateX(-50%);
    width:min(1296px,calc(100% - 3rem));box-sizing:border-box;
    height:62px;padding:0 .7rem 0 1.5rem;gap:1.2rem;
    border-radius:999px;
    background:rgba(20,20,30,.66);
    border:1px solid rgba(255,255,255,.1);
    box-shadow:0 14px 40px rgba(0,0,0,.35);
    -webkit-backdrop-filter:saturate(1.5) blur(22px);backdrop-filter:saturate(1.5) blur(22px);
  }
  html.v3 nav.v3-pill.sv-sc{height:56px;top:10px;background:rgba(14,14,22,.86)}
  html.v3 nav.v3-pill .nav-links{gap:.2rem}
  html.v3 nav.v3-pill .nav-links a{padding:.55rem 1rem;font-size:.84rem;color:#b9b9cc}
  html.v3 nav.v3-pill .nav-links a.active{background:rgba(255,255,255,.12);color:#fff}
  html.v3 nav.v3-pill .nav-links a:hover{color:#fff;background:rgba(255,255,255,.07)}
}
html.v3 .nav-search{height:44px;min-width:230px;border-radius:999px;background:rgba(255,255,255,.07)}
html.v3 .btn-signup{background:var(--accent);border:0;box-shadow:0 8px 22px color-mix(in srgb,var(--red) 35%,transparent)}

/* ── Hero ── */
html.v3 .hero{min-height:640px}
html.v3 .hero-bg{
  background:
    linear-gradient(90deg,rgba(9,9,14,.95) 0%,rgba(9,9,14,.62) 40%,rgba(9,9,14,.05) 78%),
    linear-gradient(to top,#09090e 0%,rgba(9,9,14,.5) 22%,rgba(9,9,14,0) 55%);
}
html.v3 .hero-badge{
  background:var(--red);border:0;border-radius:999px;
  padding:.38rem .9rem;font-size:.68rem;letter-spacing:.1em;box-shadow:none;
}
html.v3 .hero-title{
  font-family:var(--display);font-weight:800;text-transform:none;
  font-size:clamp(2.8rem,7.4vw,6.2rem);line-height:.95;letter-spacing:-.045em;
}
html.v3 .hero-pill{background:rgba(255,255,255,.1);border-radius:999px}
html.v3 .hero-desc{font-size:1rem;line-height:1.6;color:rgba(255,255,255,.78)}
html.v3 .btn-play,html.v3 .btn-outline{height:52px;padding:0 1.7rem;border-radius:999px;font-size:.95rem}
html.v3 .btn-play{box-shadow:0 10px 30px rgba(255,255,255,.16)}

/* ── Titres de sections ── */
html.v3 .section-title{font-size:1.5rem;font-weight:800}
html.v3 .section-title-accent{display:none}
html.v3 .section-see-all,html.v3 .see-all{color:var(--gray);font-weight:600}
html.v3 .section-see-all:hover,html.v3 .see-all:hover{color:#fff}

/* ── Cartes affiches ── */
html.v3 .card{
  border-radius:var(--radius);border:1px solid var(--line);
  box-shadow:0 8px 22px rgba(0,0,0,.34);
}
html.v3 .card:hover{
  transform:translateY(-6px) scale(1.04);
  border-color:rgba(255,255,255,.22);
  box-shadow:0 24px 60px rgba(0,0,0,.7),0 0 40px color-mix(in srgb,var(--red) 12%,transparent);
}
html.v3 .card-play,html.v3 .top10-play{background:var(--accent)}

/* ── Top 10 : grand numéro à gauche de l'affiche ── */
html.v3 #top10-container{gap:0!important;padding-top:.3rem}
html.v3 .top10-card{flex:0 0 auto;display:flex;align-items:flex-end;margin-right:.6rem}
html.v3 .top10-num{
  position:static;order:0;flex:0 0 auto;align-self:flex-end;margin-right:-.7rem;margin-bottom:-.35rem;z-index:1;
  font-family:var(--display);font-weight:800;font-size:9.5rem;line-height:.8;letter-spacing:-.09em;
  background:linear-gradient(180deg,var(--red2),var(--red) 55%,color-mix(in srgb,var(--red) 40%,#000));
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:0;
  filter:drop-shadow(0 6px 14px rgba(0,0,0,.55));opacity:.95;
}
html.v3 .top10-num.double{font-size:7.4rem;left:auto;margin-right:-.6rem;letter-spacing:-.12em}
html.v3 .top10-poster{order:1;position:relative;z-index:2;width:150px;height:225px;border-radius:14px;border:1px solid var(--line);box-shadow:0 14px 34px rgba(0,0,0,.6)}
html.v3 .top10-card:hover .top10-num{filter:drop-shadow(0 0 18px var(--red3)) drop-shadow(0 6px 14px rgba(0,0,0,.55))}

/* ── Reprendre / Prochaines sorties ── */
html.v3 .resume-card{border-radius:18px;background:var(--bg2);border-color:var(--line)}
html.v3 .prog-card{border-radius:var(--radius)}

/* ── Onglets et puces de genre ── */
html.v3 .tabs{border-bottom:0;gap:.4rem}
html.v3 .tab-btn{
  border:1px solid rgba(255,255,255,.14);border-radius:999px;
  padding:0 1.2rem;height:42px;font-size:.85rem;color:var(--light);
}
html.v3 .tab-btn.active{background:var(--red);border-color:var(--red);color:#fff}
html.v3 .genre-chip{border-radius:999px;padding:.45rem 1rem}
html.v3 .genre-chip.active{background:var(--red);border-color:var(--red);box-shadow:none}

/* ── Catalogue ── */
html.v3 .catalogue-title{font-size:2.6rem;font-weight:800;line-height:1}
html.v3 .catalogue-grid{grid-template-columns:repeat(auto-fill,minmax(172px,1fr));gap:1.6rem 1rem}
html.v3 .select-pill,html.v3 .search-pill{height:44px;border-radius:999px;background:var(--bg2);border-color:rgba(255,255,255,.14);font-size:.85rem}
html.v3 .search-pill{width:230px}
html.v3 .cat-page-btn{border-radius:999px;background:var(--bg2)}
html.v3 .catalogue-count{color:var(--gray)}

/* ── Recherche plein écran ── */
html.v3 .search-overlay{background:rgba(9,9,14,.96)}
html.v3 .search-overlay-input-wrap{
  max-width:820px;height:64px;padding:0 1.5rem;border-radius:22px;
  background:var(--bg2);border-color:rgba(255,255,255,.14);
}
html.v3 .search-overlay-input-wrap input{font-size:1.1rem}

/* ── Fiche film, modales, toasts ── */
html.v3 .auth-box,html.v3 .support-box{border-radius:24px;border:1px solid var(--line)}
html.v3 .toast{border-radius:16px}

/* ── Profils ── */
html.v3 .profiles-title{font-size:clamp(2.2rem,5vw,3.6rem);font-weight:800}
html.v3 .btn-manage{border-radius:999px}

/* ── Pages secondaires : mêmes boutons de retour ── */
html.v3 .nav-back{border-radius:999px;height:42px;padding:0 1.1rem;display:inline-flex;align-items:center}

/* ── « Plus que du streaming » (accueil) ── */
html.v3 .sv-more{padding:2.5rem 3rem 0}
html.v3 .sv-more-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem}
html.v3 .sv-more-card{
  display:flex;flex-direction:column;justify-content:space-between;gap:2rem;
  min-height:180px;padding:1.5rem;border-radius:24px;
  border:1px solid var(--line);color:#fff;text-decoration:none;
  transition:transform .25s cubic-bezier(.2,.8,.2,1),border-color .25s;
}
html.v3 .sv-more-card:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.22)}
html.v3 .sv-more-card svg{width:30px;height:30px;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
html.v3 .sv-more-card b{display:block;font-family:var(--display);font-size:1.35rem;font-weight:700;letter-spacing:-.02em}
html.v3 .sv-more-card span{font-size:.88rem;color:#c9c9da}
html.v3 .sv-more-tv{background:linear-gradient(150deg,#3a1020,#1a0c18)}
html.v3 .sv-more-tv svg{stroke:#ff6a85}
html.v3 .sv-more-radio{background:linear-gradient(150deg,#1b1a40,#10101e)}
html.v3 .sv-more-radio svg{stroke:#a89bff}
html.v3 .sv-more-carnets{background:linear-gradient(150deg,#3a2c0c,#1a150a)}
html.v3 .sv-more-carnets svg{stroke:#f5c518}
html.v3 .sv-more-demande{background:linear-gradient(150deg,#0e3329,#0b1a17)}
html.v3 .sv-more-demande svg{stroke:#4fe0b0}
.sv-more{display:none}
html.v3 .sv-more{display:block}
@media(max-width:768px){
  html.v3 .sv-more{padding:2rem 1.2rem 0}
  html.v3 .sv-more-card{min-height:120px;padding:1.1rem;gap:1rem;border-radius:20px}
  html.v3 .sv-more-grid{grid-template-columns:1fr 1fr}
  html.v3 .sv-more-card b{font-size:1.05rem}
  html.v3 .sv-more-card span{display:none}
  html.v3 .hero-actions{flex-wrap:nowrap}
  html.v3 .btn-play,html.v3 .btn-outline{padding:0 1.1rem;height:48px;font-size:.88rem;white-space:nowrap;gap:.45rem}
  html.v3 #heroInfoBtn{font-size:0;gap:0;width:48px;padding:0;justify-content:center;flex:0 0 auto}
  html.v3 .hero-title{font-size:clamp(2.4rem,13vw,3.6rem)}
  html.v3 .section-title{font-size:1.3rem}
  html.v3 .top10-num{font-size:7rem}html.v3 .top10-num.double{font-size:5.4rem}html.v3 .top10-poster{width:128px;height:192px}
}

@media(prefers-reduced-motion:reduce){html.v3 *{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* ── Squelette du hero pendant le chargement (au lieu d'un texte « Chargement… ») ── */
@keyframes svShimV3{from{background-position:200% 0}to{background-position:-200% 0}}
html.v3 .hero-title:empty::before{
  content:'';display:block;width:min(460px,72vw);height:.85em;border-radius:14px;
  background:linear-gradient(100deg,rgba(255,255,255,.05) 30%,rgba(255,255,255,.13) 50%,rgba(255,255,255,.05) 70%) 0 0/200% 100%;
  animation:svShimV3 1.4s linear infinite;
}
html.v3 .hero-title.has-logo:empty::before{display:none}

/* ═══ MOBILE V3 ═══ */
html.v3 .sv-tabbar a svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:block}
html.v3 .sv-tabbar a span{display:flex}
@media(max-width:768px){
  /* Pas de flèche « haut de page » ni de bouton drapeau flottant : ils mangent la place du contenu */
  html.v3 .sv-top{display:none!important}
  /* Le drapeau reste, mais plus discret et collé au bord, juste au-dessus de la barre du bas */
  html.v3 .bug-fab{left:.7rem;bottom:calc(5.6rem + env(safe-area-inset-bottom,0px));width:36px;height:36px;border-radius:50%;opacity:.8}
  /* En-tête allégé : logo, recherche, connexion */
  html.v3 .support-nav-btn,html.v3 #mobileCatalogueBtn{display:none!important}
  html.v3 nav{padding:0 .9rem;gap:.6rem}
  /* Hero plus court : on voit déjà les rangées en dessous */
  html.v3 .hero{height:68svh;min-height:440px;padding:0 1.2rem 2.2rem}
  html.v3 .hero-desc{display:none}
  html.v3 .hero-pills{margin-bottom:.8rem}
  /* Onglets et genres : défilement horizontal propre, bords alignés */
  html.v3 .tabs{margin:0;padding:0 1.2rem;gap:.4rem}
  html.v3 .genres{flex-wrap:nowrap;overflow-x:auto;padding:0 1.2rem 1.2rem;scrollbar-width:none}
  html.v3 .genres::-webkit-scrollbar{display:none}
  html.v3 .genre-chip{flex:0 0 auto}
  html.v3 .section{padding:1.8rem 1.2rem 0}
  /* Pages secondaires : bouton retour compact (flèche seule) */
  html.v3 .nav-back{font-size:0;width:44px;height:44px;padding:0;justify-content:center;gap:0}
  html.v3 .nav-back::before{content:'←';font-size:1.2rem;line-height:1}
  /* Barre du bas : un peu plus basse, plus lisible */
  html.v3 .sv-tabbar a,html.v3 .mob-nav-btn{min-height:52px}
  html.v3.sv-tb body{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}
}
html.v3 .sv-bug-li{display:none}

/* ═══ PAGE « DEMANDER UN CONTENU » ═══ */
html.v3 .page-hero{padding:132px 1.5rem 2.2rem;background:radial-gradient(700px 300px at 50% 0,color-mix(in srgb,var(--red) 16%,transparent),transparent 70%)}
html.v3 .page-hero-icon{width:68px;height:68px;border-radius:22px;background:var(--red3);border:1px solid color-mix(in srgb,var(--red) 30%,transparent);display:inline-flex;align-items:center;justify-content:center;font-size:1.9rem;margin-bottom:1.1rem}
html.v3 .page-hero h1{font-family:var(--display);font-weight:800;text-transform:none;font-size:clamp(2.3rem,6vw,3.8rem);letter-spacing:-.045em;line-height:1}
html.v3 .page-hero h1 span{color:var(--red2)}
html.v3 .page-hero p{font-size:1.02rem;line-height:1.55}

html.v3 .form-wrap{max-width:680px}
html.v3 .form-box{border-radius:28px;padding:2rem;background:var(--bg2);border-color:var(--line);box-shadow:0 30px 80px rgba(0,0,0,.35)}
html.v3 .field input,html.v3 .field select{height:52px;border-radius:14px;padding:0 1.1rem;font-size:.95rem}
html.v3 .field textarea{border-radius:14px;padding:.9rem 1.1rem}
html.v3 .field input:focus,html.v3 .field select:focus,html.v3 .field textarea:focus{border-color:var(--red);box-shadow:0 0 0 4px color-mix(in srgb,var(--red) 14%,transparent)}
html.v3 .tmdb-search-box{background:var(--bg3);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:1.2rem}
html.v3 .tmdb-result-poster{border-radius:12px}
html.v3 .tmdb-result-item:hover .tmdb-result-poster{border-color:var(--red)}
html.v3 .type-btn{border-radius:16px;border-width:1px;padding:1rem .5rem}
html.v3 .type-btn.active,html.v3 .type-btn:hover{border-color:var(--red);background:var(--red3)}
html.v3 .urgence-opt{border-radius:999px;border-width:1px;padding:.7rem}
html.v3 .btn-submit{height:56px;border-radius:999px;background:var(--accent);box-shadow:0 12px 30px color-mix(in srgb,var(--red) 32%,transparent);font-size:1rem}
html.v3 .btn-submit:disabled{background:#2a2a38;box-shadow:none;color:#a8a8bc}
html.v3 .connected-as{border-radius:999px}
html.v3 .login-gate{border-radius:28px}
html.v3 .btn-gate{border-radius:999px;padding:.85rem 1.6rem}
html.v3 .btn-gate.primary{background:var(--accent)}

/* Détection de doublon */
html.v3 .ld-card{border-radius:18px;padding:.85rem 1rem}
html.v3 .ld-btn{height:40px;padding:0 1.1rem;display:inline-flex;align-items:center}
html.v3 .ld-card.vote .ld-btn{background:var(--red);color:#fff}
html.v3 .ld-card.vote .ld-btn:disabled{background:rgba(74,222,128,.15);color:#4ade80}

/* Listes de demandes */
html.v3 .recent-title{font-family:var(--display);font-size:1.35rem;font-weight:800;letter-spacing:-.02em}
html.v3 .vote-item{border-radius:18px;background:var(--bg2);border-color:var(--line);padding:.85rem 1rem}
html.v3 .vote-btn{border-radius:14px;min-width:54px;background:var(--red3);border-color:color-mix(in srgb,var(--red) 30%,transparent);color:var(--red2)}
html.v3 .demande-toast{border-radius:999px}
@media(max-width:768px){
  html.v3 .page-hero{padding:104px 1.2rem 1.6rem}
  html.v3 .form-box{padding:1.3rem;border-radius:24px}
  html.v3 .form-wrap{padding:0 1rem;margin-top:1rem}
  html.v3 .ld-card{flex-wrap:wrap}
  html.v3 .ld-btn{width:100%;justify-content:center}
  html.v3 .tmdb-search-box>div:first-of-type{flex-wrap:wrap}
  html.v3 .tmdb-search-box input[type="text"]{flex:1 1 100%}
  html.v3 .tmdb-search-box .btn-gate{flex:1 1 100%;justify-content:center}
}

/* ═══ CATALOGUE V3 : filtres latéraux / tiroir mobile ═══ */
.cat-v3-layout{display:block}
.cat-side,.cat-sheet-bg,.cat-toolbar{display:none}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
html.v3 .cat-v3-layout{display:grid;grid-template-columns:268px minmax(0,1fr);gap:2rem;align-items:start}
html.v3 .cat-main{min-width:0}
html.v3 .cat-toolbar{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:1rem;min-height:0}
html.v3 .cat-toolbar:empty{display:none}
html.v3 #catFilter,html.v3 #genreFilter,html.v3 #yearFilter,html.v3 #sortFilter{display:none}
html.v3 .cat-side{
  display:flex;flex-direction:column;gap:1.5rem;position:sticky;top:1rem;
  max-height:calc(100vh - 2rem);overflow-y:auto;scrollbar-width:thin;
  padding:1.3rem;border-radius:24px;background:var(--bg2);border:1px solid var(--line);
}
html.v3 .cat-side-head{display:none}
html.v3 .cat-group-t{font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--gray);margin-bottom:.7rem}
html.v3 .cat-chips{display:flex;flex-wrap:wrap;gap:.45rem}
html.v3 .cat-chip{
  height:36px;padding:0 .95rem;border-radius:999px;cursor:pointer;font-family:inherit;
  background:transparent;border:1px solid rgba(255,255,255,.16);color:var(--light);font-size:.8rem;font-weight:500;
  transition:background .15s,border-color .15s,color .15s;
}
html.v3 .cat-chip:hover{border-color:rgba(255,255,255,.36);color:#fff}
html.v3 .cat-chip.on{background:var(--red);border-color:var(--red);color:#fff;font-weight:600}
html.v3 .cat-side-foot{display:flex;flex-direction:column;gap:.6rem}
html.v3 .cat-reset{height:42px;border-radius:999px;background:none;border:1px solid rgba(255,255,255,.16);color:var(--light);font-weight:600;font-size:.82rem;cursor:pointer;font-family:inherit}
html.v3 .cat-reset:hover{color:#fff;border-color:rgba(255,255,255,.4)}
html.v3 .cat-apply{display:none}
html.v3 .cat-active{display:flex;gap:.45rem;flex-wrap:wrap}
html.v3 .cat-pill{
  display:inline-flex;align-items:center;gap:.45rem;height:34px;padding:0 .85rem;border-radius:999px;cursor:pointer;
  background:var(--red3);border:1px solid color-mix(in srgb,var(--red) 40%,transparent);color:#fff;font-size:.78rem;font-weight:600;font-family:inherit;
}
html.v3 .cat-pill:hover{background:color-mix(in srgb,var(--red) 30%,transparent)}
html.v3 .cat-filter-btn{display:none}
html.v3 .catalogue-count{margin-bottom:1.2rem}

@media(max-width:900px){
  html.v3 .cat-v3-layout{display:block}
  html.v3 .cat-filter-btn{
    display:inline-flex;align-items:center;gap:.5rem;height:42px;padding:0 1.1rem;border-radius:999px;cursor:pointer;
    background:var(--bg2);border:1px solid rgba(255,255,255,.16);color:#fff;font-weight:600;font-size:.85rem;font-family:inherit;
  }
  html.v3 .cat-badge{min-width:20px;height:20px;border-radius:10px;background:var(--red);align-items:center;justify-content:center;font-size:.72rem;font-weight:700;padding:0 5px}
  /* tiroir qui monte du bas */
  html.v3 .cat-side{
    position:fixed;left:0;right:0;bottom:0;top:auto;z-index:950;max-height:82vh;border-radius:26px 26px 0 0;
    padding:1.1rem 1.2rem calc(1.2rem + env(safe-area-inset-bottom,0px));
    transform:translateY(105%);transition:transform .3s cubic-bezier(.2,.8,.2,1);
    box-shadow:0 -20px 60px rgba(0,0,0,.6);
  }
  html.v3 .cat-side.open{transform:none}
  html.v3 .cat-side-head{display:flex;align-items:center;justify-content:space-between;font-family:var(--display);font-size:1.25rem}
  html.v3 .cat-x{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.08);border:0;color:#fff;cursor:pointer;font-size:1rem}
  html.v3 .cat-side-foot{position:sticky;bottom:-1px;background:var(--bg2);padding-top:.6rem;flex-direction:row}
  html.v3 .cat-reset{flex:0 0 auto;padding:0 1.1rem}
  html.v3 .cat-apply{display:block;flex:1;height:46px;border-radius:999px;border:0;background:var(--accent);color:#fff;font-weight:700;font-size:.9rem;cursor:pointer;font-family:inherit}
  html.v3 .cat-sheet-bg{display:block;position:fixed;inset:0;z-index:940;background:rgba(0,0,0,.6);opacity:0;pointer-events:none;transition:opacity .25s}
  html.v3 .cat-sheet-bg.open{opacity:1;pointer-events:auto}
}

html.v3 body:has(#catSide.open) .bug-fab{display:none!important}

/* ═══ FICHE FILM V3 ═══ */
html.v3 .film-page{background:var(--bg)}
html.v3 .film-page-hero{height:72vh;min-height:480px;max-height:760px}
html.v3 .film-page-bg{filter:none;transform:scale(1.02)}
html.v3 .film-page-grad{
  background:
    linear-gradient(90deg,rgba(9,9,14,.94) 0%,rgba(9,9,14,.55) 42%,rgba(9,9,14,.05) 80%),
    linear-gradient(to top,#09090e 0%,rgba(9,9,14,.65) 26%,rgba(9,9,14,0) 60%);
}
html.v3 .film-page-content{max-width:1296px;margin:0 auto;padding:5.5rem 2rem 2.4rem;gap:2.6rem;box-sizing:border-box}
html.v3 .film-page-poster{width:190px;border-radius:20px;box-shadow:0 30px 70px rgba(0,0,0,.75),0 0 0 1px rgba(255,255,255,.1)}
html.v3 .film-page-title{font-family:var(--display);font-weight:800;text-transform:none;letter-spacing:-.04em;font-size:clamp(2.4rem,5.4vw,4.6rem);line-height:.98;margin-bottom:.9rem}
html.v3 .film-page-meta{font-size:.9rem;color:var(--light);gap:.8rem;margin-bottom:1.4rem}
html.v3 .film-page-rating{background:rgba(245,197,24,.14);padding:.2rem .65rem;border-radius:999px}
html.v3 .fp-actions{gap:.6rem;margin-bottom:0;align-items:center}
html.v3 .btn-play-big{height:54px;padding:0 2.1rem;font-size:1rem;box-shadow:0 12px 34px rgba(255,255,255,.18)}
html.v3 .btn-wish-big{height:48px;padding:0 1.25rem;font-size:.86rem;background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.16);backdrop-filter:blur(12px)}
html.v3 .btn-wish-big.added{background:var(--red3);border-color:color-mix(in srgb,var(--red) 60%,transparent);color:#ff7d95}
html.v3 .reaction-pill{border-radius:999px;height:48px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(12px)}
html.v3 .film-page-back{top:18px;left:18px;width:46px;height:46px;background:rgba(20,20,30,.7);backdrop-filter:blur(14px)}

html.v3 .film-page-body{max-width:1296px;margin:0 auto;padding:2.2rem 2rem 5rem;box-sizing:border-box}
html.v3 .film-page-desc{font-size:1.05rem;line-height:1.75;color:rgba(255,255,255,.82);max-width:780px;margin-bottom:2rem}
html.v3 .detail-grid{max-width:none;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:.8rem;margin-bottom:2.8rem}
html.v3 .detail-item{border-radius:18px;padding:.95rem 1.1rem;background:var(--bg2);border-color:var(--line)}
html.v3 .detail-label{font-size:.66rem}
html.v3 .detail-val{font-size:.92rem}

/* Casting : portraits ronds */
html.v3 .casting-section{margin-bottom:3rem}
html.v3 .casting-grid{display:flex;gap:1.3rem;overflow-x:auto;padding-bottom:.6rem;scrollbar-width:none}
html.v3 .casting-grid::-webkit-scrollbar{display:none}
html.v3 .casting-card{flex:0 0 112px;width:112px;min-width:0;max-width:112px;text-align:center}
html.v3 .casting-photo-wrap{aspect-ratio:1/1;border-radius:50%;border:2px solid var(--line)}
html.v3 .casting-card:hover .casting-photo-wrap{border-color:var(--red)}
html.v3 .casting-name{font-size:.84rem;max-width:100%}
html.v3 .casting-role{max-width:100%}
html.v3 .casting-photo-wrap{width:112px;height:112px;aspect-ratio:auto;flex:0 0 auto;margin:0 auto}

/* Épisodes */
html.v3 .episodes-section{margin-top:0;margin-bottom:3rem}
html.v3 .seasons-tabs{flex-wrap:nowrap;overflow-x:auto;max-height:none;gap:.5rem;scrollbar-width:none;padding-bottom:.5rem}
html.v3 .seasons-tabs::-webkit-scrollbar{display:none}
html.v3 .season-tab{flex:0 0 auto;height:42px;padding:0 1.2rem;border-radius:999px;box-shadow:none}
html.v3 .season-tab.active{box-shadow:none}
html.v3 .episodes-grid{gap:.7rem}
html.v3 .episode-item{border-radius:18px;padding:1rem 1.2rem;background:var(--bg2);border-color:var(--line)}
html.v3 .ep-num{font-family:var(--display);font-size:1.15rem;min-width:36px}
html.v3 .ep-title{font-size:.95rem}
html.v3 .ep-play{width:42px;height:42px;background:var(--accent);box-shadow:0 8px 20px color-mix(in srgb,var(--red) 30%,transparent)}

/* Commentaires */
html.v3 .comments-title{font-family:var(--display);font-size:1.5rem;font-weight:800;letter-spacing:-.02em}
html.v3 .comment-form{border-radius:22px;padding:1.3rem;border-color:var(--line)}
html.v3 .comment-form textarea{border-radius:14px}
html.v3 .btn-submit-comment{border-radius:999px;height:42px;padding:0 1.4rem}
html.v3 .comment-avatar{background:linear-gradient(135deg,#ff6a85,#8a5cff)}

@media(max-width:768px){
  html.v3 .film-page-hero{height:auto;min-height:0;max-height:none}
  html.v3 .film-page-bg{height:54vh;bottom:auto}
  html.v3 .film-page-grad{background:linear-gradient(to top,#09090e 0%,rgba(9,9,14,.7) 40%,rgba(9,9,14,.1) 100%)}
  html.v3 .film-page-content{flex-direction:column;align-items:flex-start;height:auto;padding:30vh 1.2rem 1.4rem;gap:1.1rem}
  html.v3 .film-page-poster{width:112px;border-radius:16px}
  html.v3 .film-page-title{font-size:clamp(2.1rem,10vw,2.9rem)}
  html.v3 .film-page-info{width:100%}
  html.v3 .btn-play-big{flex:1 1 100%;justify-content:center;height:52px}
  html.v3 .btn-wish-big{height:46px;padding:0 1rem;font-size:.82rem;flex:1 1 auto;justify-content:center}
  html.v3 .film-page-body{padding:1rem 1.2rem 4rem}
  html.v3 .film-page-desc{font-size:.98rem}
  html.v3 .detail-grid{grid-template-columns:1fr 1fr}
  html.v3 .casting-card{flex-basis:96px;width:96px;max-width:96px}
  html.v3 .casting-photo-wrap{width:96px;height:96px}
}

html.v3 body:has(.film-page.open) .bug-fab{display:none!important}

/* ═══ PROFIL V3 ═══ */
.sv-stats{display:none}
html.v3 .profiles-screen{padding-top:7.5rem}
html.v3 .profiles-grid{gap:2rem;margin-bottom:2.2rem}
html.v3 .profile-card{gap:1rem;padding:.7rem;border-radius:26px;transition:transform .25s cubic-bezier(.2,.8,.2,1),background .2s}
html.v3 .profile-card:hover{transform:translateY(-6px);background:rgba(255,255,255,.05)}
html.v3 .profile-avatar{width:116px;height:116px;border-radius:50%;border-width:3px;box-shadow:0 16px 40px rgba(0,0,0,.5)}
html.v3 .profile-card:hover .profile-avatar,html.v3 .profile-card.active .profile-avatar{border-color:#fff}
html.v3 .profile-avatar-placeholder{font-family:var(--display);font-size:2.8rem;font-weight:800}
html.v3 .profile-edit-btn{width:32px;height:32px;bottom:0;right:0}
html.v3 .profile-name{font-size:.98rem;font-weight:700;color:#fff}
html.v3 .add-profile-card .profile-avatar{border-width:2px}
html.v3 .btn-manage{height:46px;padding:0 1.5rem;background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.16)}
html.v3 .profile-manage-item{border-radius:22px;padding:1.1rem 1.3rem;border-color:var(--line)}
html.v3 .btn-add-profile{border-radius:999px}
html.v3 .section-card{border-radius:26px;border-color:var(--line);background:var(--bg2)}
html.v3 .section-card-title{font-family:var(--display);font-size:1.15rem;font-weight:800;letter-spacing:-.02em}
html.v3 .field-input{height:50px;border-radius:14px}
html.v3 .wish-card{border-radius:16px}
html.v3 .history-item{border-radius:18px}
html.v3 .sv-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-bottom:1.2rem}
html.v3 .sv-stat{padding:1.2rem 1.3rem;border-radius:22px;background:var(--bg2);border:1px solid var(--line)}
html.v3 .sv-stat:first-child{background:linear-gradient(150deg,#3a1020,#15101a)}
html.v3 .sv-stat-n{font-family:var(--display);font-weight:800;font-size:2.4rem;letter-spacing:-.04em;line-height:1}
html.v3 .sv-stat-l{font-size:.78rem;color:#c9c9da;margin-top:.5rem}
@media(max-width:768px){
  html.v3 .profiles-screen{padding-top:6rem}
  html.v3 .profile-avatar{width:92px;height:92px}
  html.v3 .profiles-grid{gap:.8rem}
  html.v3 .sv-stat{padding:1rem}
  html.v3 .sv-stat-n{font-size:1.8rem}
  html.v3 .sv-stat-l{font-size:.7rem}
}
html.v3 .manage-screen,html.v3 .profile-detail-screen{padding-top:6.5rem}
html.v3 .btn-primary{background:var(--accent);color:#fff;height:46px;padding:0 1.8rem;box-shadow:0 10px 26px color-mix(in srgb,var(--red) 30%,transparent)}
html.v3 .btn-primary:hover{background:var(--accent);filter:brightness(1.08)}
html.v3 .avatar-preview-big{border-radius:50%;width:96px;height:96px}
html.v3 .section-card-title{text-transform:none;color:#fff}
@media(max-width:768px){html.v3 .manage-screen,html.v3 .profile-detail-screen{padding-top:5.5rem}}

/* Époque : toujours 2 puces par ligne, un peu plus compactes */
html.v3 .cat-chips.cat-grid2{display:grid;grid-template-columns:1fr 1fr;gap:.45rem}
html.v3 .cat-grid2 .cat-chip{width:100%;height:34px;padding:0 .3rem;font-size:.76rem;white-space:nowrap;text-align:center}

/* Mobile : toujours au moins 2 affiches par ligne dans les grilles du catalogue */
@media(max-width:640px){
  html.v3 .catalogue-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.1rem .7rem}
  html.v3 .catalogue-grid .film-card,html.v3 .catalogue-grid .card{width:100%;min-width:0}
}

/* ── Fiche : saisons & épisodes (V3) ── */
html.v3 .season-tab{display:inline-flex;align-items:center;gap:.5rem;background:var(--bg2);border:1px solid var(--line);color:var(--light);font-size:.84rem}
html.v3 .season-tab .st-count{font-size:.68rem;font-weight:700;padding:.08rem .45rem;border-radius:999px;background:rgba(255,255,255,.08);color:var(--gray)}
html.v3 .season-tab.active{background:var(--accent);border-color:transparent;color:#fff}
html.v3 .season-tab.active .st-count{background:rgba(0,0,0,.25);color:#fff}
html.v3 .episode-item{position:relative;gap:1.1rem;transition:transform .2s,background .2s,border-color .2s}
html.v3 .episode-item:hover{transform:translateX(4px);background:var(--bg3);border-color:color-mix(in srgb,var(--red) 45%,transparent)}
html.v3 .ep-num{display:flex;align-items:center;justify-content:center;width:44px;height:44px;min-width:44px;border-radius:14px;background:var(--bg3);border:1px solid var(--line);color:var(--light)}
html.v3 .episode-item:hover .ep-num{background:var(--red3);color:#fff;border-color:transparent}
html.v3 .ep-desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.45;font-size:.78rem;margin-top:.1rem}
html.v3 .ep-play{opacity:.85}
html.v3 .episode-item:hover .ep-play{opacity:1;transform:scale(1.1)}

/* ── Lecteur plein écran (V3) ── */
html.v3 .player-fs{background:radial-gradient(900px 500px at 50% 0,color-mix(in srgb,var(--red) 14%,#05050a),#05050a 70%)}
html.v3 .player-fs-wrap{border-radius:22px;box-shadow:0 40px 120px rgba(0,0,0,.85),0 0 0 1px rgba(255,255,255,.08),0 0 90px color-mix(in srgb,var(--red) 18%,transparent)}
html.v3 .player-fs-ambient{background:radial-gradient(ellipse 80% 60% at 25% 15%,color-mix(in srgb,var(--red) 24%,transparent),transparent 60%),radial-gradient(ellipse 70% 50% at 85% 85%,rgba(110,80,255,.16),transparent 60%)}
html.v3 .player-fs-vignette{box-shadow:inset 0 0 60px 10px rgba(0,0,0,.35)}
html.v3 .player-fs-topbar{padding:.35rem .4rem .35rem .45rem;border-radius:999px;background:rgba(20,20,30,.72);border:1px solid var(--line);backdrop-filter:blur(14px);width:min(92vw,1300px);box-sizing:border-box;margin-bottom:.9rem}
html.v3 .player-fs-back-btn{height:38px;border-radius:999px;background:rgba(255,255,255,.07);border-color:transparent}
html.v3 .player-fs-title{color:#fff;opacity:.9;font-family:var(--display);font-size:.95rem;font-weight:700;letter-spacing:-.01em}
html.v3 .player-fs-x-btn{width:38px;height:38px;border-color:transparent}
html.v3 .player-fs-next-ep-btn{height:38px;padding:0 1.1rem;background:var(--accent);border-color:transparent}
html.v3 .autoplay-card{border-radius:20px;background:rgba(18,18,26,.94);backdrop-filter:blur(16px)}
html.v3 .autoplay-play{background:var(--accent);border-radius:999px;height:38px}
html.v3 .autoplay-cancel{border-radius:999px;height:38px}
@media(max-width:640px){
  html.v3 .player-fs-topbar{width:calc(100vw - 1rem);gap:.35rem}
  html.v3 .player-fs-wrap{border-radius:0}
  html.v3 .player-fs-back-btn{padding:0 .8rem;font-size:.76rem}
  html.v3 .player-fs-next-ep-btn .next-ep-label{display:none}
  html.v3 .player-fs-next-ep-btn{width:38px;padding:0;display:flex;align-items:center;justify-content:center}
  html.v3 .ep-num{width:38px;height:38px;min-width:38px;border-radius:12px}
  html.v3 .episode-item{padding:.8rem .9rem;gap:.8rem}
}

/* ── Mobile : zones tactiles plus confortables ── */
@media(max-width:768px){
  html.v3 .footer-col ul li a{display:inline-block;padding:.45rem 0;font-size:.82rem}
  html.v3 .btn-nav-outline,html.v3 .btn-signup{min-height:38px;padding-top:0;padding-bottom:0;display:inline-flex;align-items:center}
  html.v3 .mobile-quick-btn{width:38px;height:38px}
  html.v3 .install-banner-close{width:36px;height:36px}
}
/* Perf : le pied de page n'est calculé que quand on s'en approche */
html.v3 footer{content-visibility:auto;contain-intrinsic-size:auto 420px}

/* Top 10 : plus de petit va-et-vient vertical (le survol ne déplace plus la carte) */
html.v3 #top10-container{overflow-y:hidden!important;padding-top:.9rem!important;padding-bottom:1.2rem!important}
html.v3 .top10-card:hover{transform:none}
html.v3 .top10-poster{transition:box-shadow .3s,border-color .3s}
html.v3 .top10-card:hover .top10-poster{border-color:color-mix(in srgb,var(--red) 55%,transparent);box-shadow:0 14px 34px rgba(0,0,0,.6),0 0 26px var(--red3)}

/* Glisser à la souris */
@media(hover:hover) and (pointer:fine){
  html.v3 .carousel,html.v3 #top10-container,html.v3 .saga-container,html.v3 .prog-container,html.v3 .resume-row{cursor:grab}
}
.sv-dragging{cursor:grabbing!important;scroll-snap-type:none!important;scroll-behavior:auto!important;user-select:none}
.sv-dragging *{pointer-events:none}

/* ── Pop-up « Nous soutenir » (V3) ── */
html.v3 .support-modal{background:rgba(5,5,10,.78);backdrop-filter:blur(16px)}
html.v3 .support-box{position:relative;max-width:440px;padding:2.6rem 1.6rem 1.8rem;border-radius:30px;border:1px solid var(--line);overflow:hidden;
  background:radial-gradient(420px 220px at 50% -40px,color-mix(in srgb,var(--red) 28%,transparent),transparent 70%),var(--bg2);
  box-shadow:0 50px 120px rgba(0,0,0,.8);animation:svSupIn .35s cubic-bezier(.2,.9,.3,1.2) both}
@keyframes svSupIn{from{opacity:0;transform:translateY(24px) scale(.95)}to{opacity:1;transform:none}}
html.v3 .support-box .auth-close{position:absolute;top:14px;right:14px}
html.v3 .support-icon{width:76px;height:76px;border-radius:50%;margin:0 auto 1.1rem;background:var(--accent);border:0;color:#fff;
  box-shadow:0 14px 40px color-mix(in srgb,var(--red) 50%,transparent),inset 0 1px 0 rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center}
html.v3 .sv-heart{display:flex;animation:svBeat 1.8s ease-in-out infinite}
@keyframes svBeat{0%,60%,100%{transform:scale(1)}15%{transform:scale(1.18)}30%{transform:scale(.97)}45%{transform:scale(1.1)}}
html.v3 .support-title{font-family:var(--display);font-size:1.7rem;font-weight:800;letter-spacing:-.03em;text-align:center}
html.v3 .support-sub{text-align:center;color:var(--light);font-size:.92rem;margin-bottom:1.6rem}
html.v3 .support-links{gap:.6rem}
html.v3 .support-link-btn{display:flex;align-items:center;gap:.9rem;padding:.8rem .9rem;border-radius:20px;background:var(--bg3);border:1px solid var(--line);color:#fff;text-decoration:none;transition:transform .2s,border-color .2s,background .2s}
html.v3 .support-link-btn:hover{transform:translateY(-2px)}
html.v3 .support-link-icon{width:46px;height:46px;border-radius:15px;font-size:0}
html.v3 .support-link-txt{display:flex;flex-direction:column;gap:.1rem;min-width:0;text-align:left}
html.v3 .support-link-txt b{font-size:.98rem;font-weight:700}
html.v3 .support-link-txt small{font-size:.76rem;color:var(--gray)}
html.v3 .support-link-btn.tiktok{background:rgba(255,255,255,.05)}
html.v3 .support-link-btn.tiktok .support-link-icon{background:linear-gradient(135deg,#25f4ee,#fe2c55);color:#fff}
html.v3 .support-link-btn.tiktok:hover{border-color:rgba(254,44,85,.6)}
html.v3 .support-link-btn.discord{background:rgba(88,101,242,.1);border-color:rgba(88,101,242,.3)}
html.v3 .support-link-btn.discord .support-link-icon{background:#5865f2;color:#fff}
html.v3 .support-link-btn.discord:hover{border-color:#5865f2}
html.v3 .support-link-btn.paypal{background:rgba(255,196,57,.08);border-color:rgba(255,196,57,.28)}
html.v3 .support-link-btn.paypal .support-link-icon{background:linear-gradient(135deg,#ffc439,#f59e0b);color:#3b2a00}
html.v3 .support-link-btn.paypal:hover{border-color:#ffc439}
html.v3 .support-note{text-align:center;margin-top:1.3rem;font-size:.78rem}
@media(max-width:640px){
  html.v3 .support-modal{align-items:flex-end;padding:0}
  html.v3 .support-box{width:100%;max-width:none;border-radius:28px 28px 0 0;padding-bottom:calc(1.6rem + env(safe-area-inset-bottom,0px));animation:svSupUp .3s ease-out both}
  @keyframes svSupUp{from{transform:translateY(100%)}to{transform:none}}
}
@media(prefers-reduced-motion:reduce){html.v3 .sv-heart{animation:none}}

/* ═══════════════════════════════════════════════════════════════
   PAGES SECONDAIRES (TV, Radio, Carnets, Journal, Secret…)
   ═══════════════════════════════════════════════════════════════ */

/* Barre du haut : pilule flottante en verre, comme l'accueil */
html.v3 body>nav:has(.nav-back):not(.v3-pill){
  position:sticky;top:14px;z-index:200;
  width:min(1296px,calc(100% - 2rem));margin:14px auto 0;box-sizing:border-box;
  padding:.5rem .55rem .5rem 1.4rem;border-radius:999px;
  background:rgba(18,18,26,.78);border:1px solid var(--line);
  -webkit-backdrop-filter:saturate(1.6) blur(18px);backdrop-filter:saturate(1.6) blur(18px);
  box-shadow:0 12px 40px rgba(0,0,0,.45);
}
html.v3 body>nav:has(.nav-back):not(.v3-pill) .nav-logo{font-family:var(--display);font-weight:800;font-size:1.35rem;letter-spacing:-.04em}
html.v3 body>nav:has(.nav-back):not(.v3-pill) .nav-back{height:40px;padding:0 1.1rem;border-radius:999px;background:rgba(255,255,255,.07);border-color:transparent;font-weight:600}
html.v3 body>nav:has(.nav-back):not(.v3-pill) .nav-back:hover{background:rgba(255,255,255,.14)}
html.v3 body>nav:has(.nav-back):not(.v3-pill)>div:not(.nav-logo){display:flex;gap:.5rem;align-items:center}

/* En-têtes de page */
html.v3 .tv-header,html.v3 .radio-header{padding:3rem 1.5rem 1.6rem;
  background:radial-gradient(640px 260px at 50% 0,color-mix(in srgb,var(--red) 18%,transparent),transparent 72%)}
html.v3 .tv-header h1,html.v3 .radio-header h1{font-family:var(--display);font-weight:800;font-size:clamp(2.4rem,6vw,3.8rem);letter-spacing:-.045em;line-height:1}
html.v3 .tv-header h1 span,html.v3 .radio-header h1 span{background:var(--accent);-webkit-background-clip:text;background-clip:text;color:transparent}
html.v3 .tv-header p,html.v3 .radio-header p{color:var(--light);font-size:.98rem;margin-top:.7rem}
html.v3 .page-hero h1 span{background:var(--accent);-webkit-background-clip:text;background-clip:text;color:transparent}

/* Sélecteur de mode : contrôle segmenté */
html.v3 .mode-switch{display:flex;width:max-content;max-width:calc(100% - 2rem);margin:0 auto 2rem;padding:5px;gap:4px;border-radius:999px;background:var(--bg2);border:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
html.v3 .mode-switch::-webkit-scrollbar{display:none}
html.v3 .mode-btn{height:42px;padding:0 1.3rem;border-radius:999px;border:0;background:transparent;color:var(--light);white-space:nowrap;font-size:.86rem}
html.v3 .mode-btn.active{background:var(--accent);color:#fff;box-shadow:0 8px 22px color-mix(in srgb,var(--red) 35%,transparent)}
html.v3 .mode-btn:not(.active):hover{background:rgba(255,255,255,.07);border-color:transparent}
html.v3 .bt-submode-switch{gap:.4rem}
html.v3 .bt-submode-btn{height:36px;padding:0 1.1rem;border-radius:999px;background:var(--bg2);border-color:var(--line)}
html.v3 .bt-submode-btn.active{background:var(--red3);border-color:color-mix(in srgb,var(--red) 55%,transparent)}

/* Grilles de chaînes / stations */
html.v3 .channel-grid,html.v3 .station-grid{max-width:1100px;gap:1.1rem;grid-template-columns:repeat(auto-fill,minmax(176px,1fr))}
html.v3 .channel-card,html.v3 .station-card,html.v3 .bt-theme-card,html.v3 .cq-choice-card,html.v3 .mp-choice-card{
  border-radius:24px;background:linear-gradient(160deg,var(--bg3),var(--bg2));border:1px solid var(--line);
  transition:transform .25s,border-color .25s,box-shadow .25s}
html.v3 .channel-card,html.v3 .station-card{padding:1.6rem 1rem 1.3rem}
html.v3 .channel-card:hover,html.v3 .station-card:hover,html.v3 .bt-theme-card:hover,html.v3 .cq-choice-card:hover,html.v3 .mp-choice-card:hover{
  transform:translateY(-5px);border-color:color-mix(in srgb,var(--red) 50%,transparent);box-shadow:0 18px 40px rgba(0,0,0,.5),0 0 30px var(--red3)}
html.v3 .channel-card.active,html.v3 .station-card.active{border-color:var(--red);background:linear-gradient(160deg,var(--red3),var(--bg2));box-shadow:0 0 0 1px var(--red),0 14px 36px var(--red3)}
html.v3 .channel-logo,html.v3 .station-logo{width:68px;height:68px;box-shadow:0 8px 22px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,255,255,.15)}
html.v3 .channel-nom,html.v3 .station-nom{font-size:.92rem}
html.v3 .tv-player-box{border-radius:22px;box-shadow:0 30px 80px rgba(0,0,0,.7),0 0 0 1px var(--line)}

/* Lecteur radio : barre flottante */
html.v3 .player-bar{left:50%;right:auto;bottom:16px;transform:translate(-50%,140%);width:min(720px,calc(100% - 1.5rem));box-sizing:border-box;border:1px solid var(--line);border-radius:999px;padding:.6rem .7rem .6rem .6rem;background:rgba(18,18,26,.86);box-shadow:0 20px 60px rgba(0,0,0,.6)}
html.v3 .player-bar.visible{transform:translate(-50%,0)}
html.v3 .player-btn{background:var(--accent);color:#fff;width:48px;height:48px;box-shadow:0 8px 22px color-mix(in srgb,var(--red) 40%,transparent)}
html.v3 .player-bar-logo{width:48px;height:48px}

/* Jeux (Ciné Quiz, Blindtest) */
html.v3 .cq-game-box,html.v3 .bt-game-box,html.v3 .mp-box{max-width:480px}
html.v3 .cq-guess-input,html.v3 .bt-guess-input{height:52px;border-radius:999px;background:var(--bg2);border-color:var(--line)}
html.v3 .cq-guess-input:focus,html.v3 .bt-guess-input:focus{box-shadow:0 0 0 4px var(--red3)}
html.v3 .cq-qcm-btn,html.v3 .bt-qcm-btn{border-radius:18px;padding:.9rem 1.1rem;background:var(--bg2);border-color:var(--line)}
html.v3 .cq-valider-btn,html.v3 .bt-valider-btn{background:var(--accent);border-radius:999px}
html.v3 .cq-passer-btn,html.v3 .bt-passer-btn{border-radius:999px}
html.v3 .cq-timer-bar-wrap,html.v3 .bt-timer-bar-wrap{border-radius:999px;overflow:hidden}
html.v3 .cq-timer-bar,html.v3 .bt-timer-bar{background:var(--accent)}
html.v3 .cq-result-box,html.v3 .cq-quote-box{border-radius:24px}
html.v3 .empty-state{color:var(--gray);border:1px dashed var(--line);border-radius:24px;max-width:520px;margin:1rem auto;background:rgba(255,255,255,.02)}

/* Carnets / Journal */
html.v3 .wrap,html.v3 .journal-wrap{max-width:1120px}
html.v3 .search-row{max-width:480px}
html.v3 .search-row input{height:52px;border-radius:999px;background:var(--bg2);border-color:var(--line)}
html.v3 .search-row input:focus{box-shadow:0 0 0 4px var(--red3)}
html.v3 .carnets-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1.1rem}
html.v3 .carnet-card{border-radius:24px;padding:1.2rem;background:linear-gradient(160deg,var(--bg3),var(--bg2));border-color:var(--line)}
html.v3 .carnet-card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--red) 50%,transparent);box-shadow:0 18px 40px rgba(0,0,0,.5),0 0 30px var(--red3);background:linear-gradient(160deg,var(--bg3),var(--bg2))}
html.v3 .carnet-avatar{width:58px;height:58px;background:var(--accent);box-shadow:0 8px 20px color-mix(in srgb,var(--red) 35%,transparent)}
html.v3 .stats-bar{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.8rem;margin-bottom:2.2rem}
html.v3 .stat-chip{border-radius:22px;padding:1.2rem 1rem;background:linear-gradient(160deg,var(--bg3),var(--bg2));border-color:var(--line)}
html.v3 .stat-chip .num{font-family:var(--display);font-size:2.1rem;font-weight:800;letter-spacing:-.03em;background:var(--accent);-webkit-background-clip:text;background-clip:text;color:transparent}
html.v3 .public-banner,html.v3 .share-box,html.v3 .add-box{border-radius:24px;border-color:var(--line)}
html.v3 .journal-search-input{height:50px;border-radius:999px;padding:0 1.3rem}
html.v3 .journal-search-input:focus{box-shadow:0 0 0 4px var(--red3)}
html.v3 .jsr-item img,html.v3 .jsr-item .jsr-noimg,html.v3 .entry-poster-wrap{border-radius:16px}
html.v3 .entry-poster-wrap{border:1px solid var(--line);transition:transform .25s,box-shadow .25s}
html.v3 .entry-card:hover .entry-poster-wrap{transform:translateY(-4px);box-shadow:0 18px 40px rgba(0,0,0,.55),0 0 26px var(--red3)}
html.v3 .entry-rating-badge{border-radius:999px;padding:.25rem .6rem}
html.v3 .entry-title{font-size:.88rem}
html.v3 .entry-like-btn{border-radius:999px}
html.v3 .rate-box{border-radius:30px;border-color:var(--line);box-shadow:0 50px 120px rgba(0,0,0,.8);background:radial-gradient(360px 180px at 50% -30px,var(--red3),transparent 70%),var(--bg2)}
html.v3 .rate-box textarea{border-radius:16px}
html.v3 .rate-save{border-radius:999px;background:var(--accent)}
html.v3 .login-gate{border:1px solid var(--line);border-radius:30px;background:linear-gradient(160deg,var(--bg3),var(--bg2));padding:2.6rem 1.6rem}
html.v3 .login-gate-icon{width:72px;height:72px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;margin:0 auto 1.1rem;font-size:1.8rem}
html.v3 .btn-auth,html.v3 .public-banner a.btn-mine{border-radius:999px;background:var(--accent)}

@media(max-width:640px){
  html.v3 body>nav:has(.nav-back):not(.v3-pill){top:8px;margin-top:8px;padding:.4rem .45rem .4rem 1.1rem;width:calc(100% - 1rem)}
  html.v3 .tv-header,html.v3 .radio-header{padding:2rem 1.2rem 1.2rem}
  html.v3 .channel-grid,html.v3 .station-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}
  html.v3 .channel-card,html.v3 .station-card{padding:1.2rem .7rem 1rem;border-radius:20px}
  html.v3 .channel-logo,html.v3 .station-logo{width:58px;height:58px}
  html.v3 .carnets-grid{grid-template-columns:1fr}
  html.v3 .stats-bar{grid-template-columns:repeat(2,1fr)}
  html.v3 .player-bar{bottom:calc(5.9rem + env(safe-area-inset-bottom,0px));width:calc(100% - 1rem)}
  html.v3 body{padding-bottom:7rem}
  html.v3 .mode-btn{padding:0 1rem;font-size:.8rem}
  html.v3 body>nav .nav-back{font-size:.74rem;width:auto;min-width:0;height:38px;padding:0 .75rem;white-space:nowrap;border-radius:999px}
  html.v3 body>nav .nav-back::before{content:none}
  html.v3 body>nav>div:not(.nav-logo){gap:.3rem}
  html.v3 body>nav .nav-logo{font-size:1.15rem}
}

/* Accès VIP */
html.v3 .gate-box{padding:2.6rem 1.8rem 2rem;border-radius:32px;border:1px solid var(--line);max-width:420px;
  background:radial-gradient(380px 200px at 50% -30px,var(--red3),transparent 70%),linear-gradient(160deg,var(--bg3),var(--bg2));box-shadow:0 40px 100px rgba(0,0,0,.6)}
html.v3 .gate-icon{width:78px;height:78px;border-radius:50%;background:var(--accent);margin:0 auto 1.2rem;display:flex;align-items:center;justify-content:center;font-size:2rem;filter:none;box-shadow:0 14px 40px color-mix(in srgb,var(--red) 45%,transparent)}
html.v3 .gate-box h1{font-family:var(--display);font-weight:800;font-size:2rem;letter-spacing:-.04em}
html.v3 .gate-box p{color:var(--light)}
html.v3 .gate-input{height:54px;border-radius:999px;background:var(--bg);border-color:var(--line);letter-spacing:.25em}
html.v3 .gate-input:focus{box-shadow:0 0 0 4px var(--red3)}
html.v3 .gate-btn{height:52px;border-radius:999px;background:var(--accent);box-shadow:0 12px 30px color-mix(in srgb,var(--red) 32%,transparent)}

/* ── Finitions globales : accessibilité, tactile, impression ── */
html.v3 :focus-visible{outline:2px solid var(--red2);outline-offset:3px;border-radius:8px}
html.v3 button,html.v3 a,html.v3 [role=button],html.v3 select,html.v3 input{touch-action:manipulation}
html.v3{-webkit-tap-highlight-color:transparent;text-size-adjust:100%;-webkit-text-size-adjust:100%}
html.v3 img{-webkit-user-drag:none}
@media(prefers-reduced-motion:reduce){
  html.v3{scroll-behavior:auto}
  html.v3 *,html.v3 *::before,html.v3 *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}
@media(prefers-contrast:more){
  html.v3{--gray:#c4c4d6;--line:rgba(255,255,255,.22)}
}

/* ═══ Studio d'apparence (premium) ═══ */
html.v3[data-ambiance="aurora"] body{background:radial-gradient(1100px 600px at 85% -10%,rgba(16,185,129,.22),transparent 62%),radial-gradient(900px 560px at -5% 8%,rgba(59,130,246,.2),transparent 60%),#07100f fixed}
html.v3[data-ambiance="nebula"] body{background:radial-gradient(1100px 600px at 85% -10%,rgba(168,85,247,.26),transparent 62%),radial-gradient(900px 560px at -5% 12%,rgba(236,72,153,.2),transparent 60%),#0c0814 fixed}
html.v3[data-ambiance="sunset"] body{background:radial-gradient(1100px 600px at 85% -10%,rgba(249,115,22,.26),transparent 62%),radial-gradient(900px 560px at -5% 10%,rgba(236,72,153,.18),transparent 60%),#140a0a fixed}
html.v3[data-ambiance="ocean"] body{background:radial-gradient(1100px 600px at 85% -10%,rgba(6,182,212,.26),transparent 62%),radial-gradient(900px 560px at -5% 10%,rgba(59,130,246,.2),transparent 60%),#060d14 fixed}
html.v3[data-ambiance="noir"] body{background:#000}
html[data-ambiance="aurora"] body,html[data-ambiance="nebula"] body,html[data-ambiance="sunset"] body,html[data-ambiance="ocean"] body{background-attachment:fixed}

/* Arrondis choisis par le membre */
html[data-radius="sharp"] .card,html[data-radius="sharp"] .top10-poster,html[data-radius="sharp"] .episode-item,html[data-radius="sharp"] .section-card,
html[data-radius="sharp"] .detail-item,html[data-radius="sharp"] .carnet-card,html[data-radius="sharp"] .channel-card,html[data-radius="sharp"] .station-card,
html[data-radius="sharp"] .film-page-poster,html[data-radius="sharp"] .support-box,html[data-radius="sharp"] .resume-card,html[data-radius="sharp"] .stat-chip{border-radius:6px!important}
html[data-radius="sharp"] .btn-play,html[data-radius="sharp"] .btn-outline,html[data-radius="sharp"] .season-tab,html[data-radius="sharp"] .btn-primary,html[data-radius="sharp"] .btn-submit{border-radius:6px!important}
html[data-radius="round"] .card,html[data-radius="round"] .top10-poster,html[data-radius="round"] .episode-item,html[data-radius="round"] .section-card,
html[data-radius="round"] .detail-item,html[data-radius="round"] .carnet-card,html[data-radius="round"] .channel-card,html[data-radius="round"] .station-card,
html[data-radius="round"] .film-page-poster,html[data-radius="round"] .resume-card,html[data-radius="round"] .stat-chip{border-radius:30px!important}

/* Cadres d'avatar premium au choix */
.avatar-premium-frame[data-frame="neon"]{box-shadow:0 0 0 2px #fff,0 0 16px 3px var(--red),0 0 34px 6px var(--red3)!important;border-color:#fff!important;background:none!important}
.avatar-premium-frame[data-frame="aurora"]{padding:2px;background:conic-gradient(from 0deg,#22d3ee,#a855f7,#ec4899,#f59e0b,#22d3ee)!important;animation:svFrameSpin 4s linear infinite;border:0!important}
@keyframes svFrameSpin{to{filter:hue-rotate(360deg)}}
.avatar-premium-frame[data-frame="royal"]{box-shadow:0 0 0 2px #1a1205,0 0 0 4px #f5c518,0 0 0 6px #a67c00,0 0 18px 4px rgba(245,197,24,.5)!important}
@media(prefers-reduced-motion:reduce){.avatar-premium-frame[data-frame="aurora"]{animation:none}}

/* Pseudo premium dans les commentaires */
.comment-author .premium-badge{filter:drop-shadow(0 0 6px rgba(245,197,24,.7))}
.comment-item.is-premium,.comment.is-premium{border-color:rgba(245,197,24,.35)!important;box-shadow:0 0 0 1px rgba(245,197,24,.12),0 10px 30px rgba(245,197,24,.06)}

/* Flèches des rangées : toujours au-dessus des affiches agrandies, zone de clic large */
html.v3 .carousel-btn{z-index:60;width:44px;height:44px;font-size:1.2rem;background:rgba(10,10,18,.92);backdrop-filter:blur(8px);box-shadow:0 8px 24px rgba(0,0,0,.6)}
html.v3 .carousel-btn::before{content:"";position:absolute;inset:-18px -14px}
html.v3 .carousel-btn.prev{left:6px}
html.v3 .carousel-btn.next{right:6px}
html.v3 .carousel-wrap:hover .carousel-btn,html.v3 .carousel-btn:focus-visible{opacity:1;pointer-events:all}
html.v3 .carousel-btn:hover{transform:translateY(-50%) scale(1.08)}
@media(hover:none){html.v3 .carousel-btn{display:none}}

html.v3 .gate-vip{margin-top:1.2rem;padding:.8rem 1rem;border-radius:16px;font-size:.78rem;color:#ffe27a;background:rgba(245,197,24,.08);border:1px solid rgba(245,197,24,.22)}
.avatar-premium-frame[data-frame="gold"]{box-shadow:0 0 0 2px #f5c518,0 0 14px rgba(245,197,24,.45)}
html.v3 nav.v3-pill:has(.nav-back){justify-content:space-between}

/* Reprendre : croix pour retirer */
.resume-card{position:relative}
.resume-x{position:absolute;top:6px;right:6px;z-index:3;width:26px;height:26px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.6);color:#fff;font-size:.72rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;opacity:.85;transition:background .15s,opacity .15s}
.resume-x:hover,.resume-x:focus-visible{background:var(--red,#e50914);opacity:1}
@media(hover:hover){.resume-x{opacity:0}.resume-card:hover .resume-x,.resume-x:focus-visible{opacity:1}}
@media(max-width:700px){.resume-x{width:30px;height:30px;opacity:.9}}