
:root{--bg:#08090d;--surface:#101218;--surface2:#171a22;--text:#f7f8fb;--muted:#959cac;--line:rgba(255,255,255,.09);--accent:#ff4f78;--accent2:#8b6dff;--yellow:#ffc85c}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 10% 0,rgba(139,109,255,.12),transparent 30rem),var(--bg);color:var(--text);font-family:Inter,sans-serif}button,input,textarea{font:inherit}button{cursor:pointer}.topbar{height:74px;padding:0 4vw;display:flex;align-items:center;gap:24px;position:sticky;top:0;z-index:30;background:rgba(8,9,13,.84);backdrop-filter:blur(22px);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:8px;background:none;border:0;color:var(--text)}.brand span{width:36px;height:36px;display:grid;place-items:center;border-radius:11px;background:linear-gradient(135deg,var(--accent),var(--accent2));font-weight:800}.brand b{font:800 1.05rem Manrope}.brand em{color:var(--accent);font-style:normal;font-size:.72rem}.search{width:min(430px,35vw);height:42px;display:flex;align-items:center;gap:9px;padding:0 13px;background:var(--surface);border:1px solid var(--line);border-radius:13px}.search input{width:100%;border:0;outline:0;background:transparent;color:var(--text)}nav{display:flex;gap:7px;margin-left:auto}nav button,.tabs button,.authTabs button{border:0;background:transparent;color:var(--muted);padding:10px 12px;border-radius:10px}nav button.active,.tabs button.active,.authTabs button.active{color:var(--text);background:var(--surface2)}#authArea{min-width:max-content}.avatarBtn{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--surface);color:var(--text);padding:5px 10px 5px 5px;border-radius:999px}.avatar{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2));font-weight:800}.loginBtn,.primary,.secondary,.loadMore{border:0;border-radius:13px;padding:12px 17px;font-weight:700}.primary{color:white;background:linear-gradient(135deg,var(--accent),#ff7258)}.secondary,.loadMore{color:var(--text);background:var(--surface2);border:1px solid var(--line)}main{width:min(1450px,92%);margin:auto}.page{display:none;padding:26px 0 60px}.page.active{display:block}.hero{min-height:550px;border-radius:28px;overflow:hidden;position:relative;background:url('https://image.tmdb.org/t/p/original/rAiYTfKGqDCRIIqo664sY9XZIvQ.jpg') center/cover;border:1px solid var(--line)}.heroShade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,6,10,.96),rgba(5,6,10,.38)),linear-gradient(0deg,rgba(5,6,10,.9),transparent 50%)}.heroContent{position:absolute;left:6%;bottom:12%;max-width:650px}.eyebrow{color:var(--accent);font-size:.7rem;font-weight:800;letter-spacing:.14em}.hero h1,.pageTitle h1{font:800 clamp(3rem,7vw,6.5rem)/.94 Manrope;margin:10px 0;letter-spacing:-.06em}.hero p{color:#c9cdd7;line-height:1.7;font-size:1.05rem}.row{display:flex;gap:10px;flex-wrap:wrap}.sectionHead{display:flex;justify-content:space-between;align-items:end;margin:56px 0 20px}.sectionHead h2{font:800 2rem Manrope;margin:6px 0 0}.movieGrid{display:grid;grid-template-columns:repeat(6,1fr);gap:18px}.movieGrid.large{grid-template-columns:repeat(5,1fr)}.movieCard{min-width:0;cursor:pointer}.poster{aspect-ratio:2/3;border-radius:18px;overflow:hidden;position:relative;background:var(--surface2)}.poster img{width:100%;height:100%;object-fit:cover;transition:.35s}.movieCard:hover img{transform:scale(1.05);filter:brightness(.8)}.score{position:absolute;top:10px;right:10px;background:rgba(7,8,12,.75);padding:7px 9px;border-radius:10px;font-size:.75rem}.score span{color:var(--yellow)}.movieCard h3{margin:12px 2px 4px;font:700 .95rem Manrope;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.movieCard p{margin:0;color:var(--muted);font-size:.8rem}.pageTitle{padding:30px 0}.pageTitle p{color:var(--muted)}.feedGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.feedColumn{display:grid;gap:16px;max-width:820px}.reviewCard{padding:20px;background:var(--surface);border:1px solid var(--line);border-radius:20px}.reviewHead{display:flex;justify-content:space-between;gap:12px}.person{display:flex;align-items:center;gap:10px}.person button{border:0;background:none;color:var(--text);font-weight:700}.stars{color:var(--yellow)}.reviewMovie{display:grid;grid-template-columns:60px 1fr;gap:12px;margin:16px 0}.reviewMovie img{width:60px;height:86px;object-fit:cover;border-radius:10px}.reviewMovie p{color:var(--muted);line-height:1.55}.reviewActions{display:flex;gap:8px}.reviewActions button{border:1px solid var(--line);background:var(--surface2);color:var(--muted);padding:8px 10px;border-radius:10px}.reviewActions button.liked{color:var(--accent)}.tabs{display:flex;gap:6px;margin-bottom:22px}.loadMore{display:block;margin:28px auto}.modal{position:fixed;inset:0;z-index:60;background:rgba(2,3,6,.8);backdrop-filter:blur(12px);display:none;padding:24px;overflow:auto}.modal.open{display:block}.modalCard{width:min(1000px,100%);margin:auto;background:var(--surface);border:1px solid var(--line);border-radius:26px;position:relative;overflow:hidden}.close{position:absolute;right:16px;top:16px;z-index:5;width:42px;height:42px;border:1px solid rgba(255,255,255,.16);border-radius:50%;background:rgba(0,0,0,.5);color:white;font-size:1.3rem}.detailBackdrop{height:330px;background-size:cover;background-position:center;position:relative}.detailBackdrop:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--surface),transparent)}.detailBody{display:grid;grid-template-columns:220px 1fr;gap:30px;padding:0 38px 40px;margin-top:-95px;position:relative}.detailPoster{width:100%;border-radius:18px}.detailInfo{padding-top:100px}.detailInfo h2{font:800 3rem/1 Manrope;margin:8px 0}.detailInfo p{color:var(--muted);line-height:1.65}.detailActions{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.reviewComposer{margin-top:24px;padding:18px;border-radius:16px;background:var(--surface2)}.reviewComposer textarea{width:100%;min-height:110px;margin:12px 0;padding:12px;background:var(--surface);border:1px solid var(--line);border-radius:12px;color:var(--text)}.starPicker button{background:none;border:0;color:var(--yellow);font-size:1.3rem}.authCard{width:min(460px,100%);padding:28px}.authCard form{display:grid;gap:12px}.authCard input,.commentsCard input{padding:13px;border:1px solid var(--line);border-radius:12px;background:var(--surface2);color:var(--text)}.authCard h2{margin-bottom:0}.authCard p{color:var(--muted)}.authTabs{display:flex;margin-bottom:16px}.hidden{display:none!important}.formMessage{color:var(--accent);margin-top:12px}.demoBox{margin-top:16px;padding:12px;border-radius:12px;background:var(--surface2);color:var(--muted);font-size:.85rem}.commentsCard{width:min(600px,100%);padding:26px}.commentsCard h2{margin-top:0}.comment{padding:13px 0;border-bottom:1px solid var(--line)}.comment p{margin:6px 0;color:var(--muted)}#commentForm{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:18px}.profileHero{padding:35px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(135deg,rgba(255,79,120,.12),rgba(139,109,255,.1)),var(--surface)}.profileTop{display:flex;align-items:center;gap:20px}.profileAvatar{width:96px;height:96px;display:grid;place-items:center;border-radius:28px;background:linear-gradient(135deg,var(--accent),var(--accent2));font:800 2rem Manrope}.profileTop h1{margin:0}.profileTop p{color:var(--muted)}.stats{display:flex;gap:25px;margin-top:20px}.stats strong{display:block;font-size:1.4rem}.stats span{color:var(--muted);font-size:.8rem}.toast{position:fixed;right:22px;bottom:22px;padding:13px 16px;background:var(--surface2);border:1px solid var(--line);border-radius:12px;opacity:0;transform:translateY(10px);transition:.2s;z-index:100}.toast.show{opacity:1;transform:none}
@media(max-width:1100px){nav{display:none}.movieGrid,.movieGrid.large{grid-template-columns:repeat(4,1fr)}.feedGrid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.topbar{padding:0 12px}.brand b,.brand em{display:none}.search{width:auto;flex:1}.movieGrid,.movieGrid.large{grid-template-columns:repeat(2,1fr);gap:12px}.feedGrid{grid-template-columns:1fr}.hero{min-height:570px}.heroContent{left:24px;right:24px}.detailBody{grid-template-columns:100px 1fr;padding:0 16px 28px;gap:14px}.detailInfo{padding-top:55px}.detailInfo h2{font-size:2rem}.detailInfo>p,.detailActions,.reviewComposer{grid-column:1/-1}.modal{padding:0}.modalCard{border-radius:0;min-height:100vh}.profileTop{align-items:flex-start}.stats{flex-wrap:wrap}}


/* V4 UNIVERSE */
.sidebar{position:fixed;inset:0 auto 0 0;width:235px;padding:24px 16px;background:rgba(10,12,17,.94);border-right:1px solid var(--line);z-index:40;display:flex;flex-direction:column}.sidebar .brand{width:100%;margin-bottom:24px}.sidebar nav{display:grid;margin:0;gap:5px}.sidebar nav button{display:flex;align-items:center;gap:12px;text-align:left;position:relative}.sidebar nav button i{margin-left:auto;min-width:8px;height:8px;border-radius:99px;background:var(--accent)}.sidebarFooter{margin-top:auto}.app{margin-left:235px}.topbar{left:235px}.statsStrip{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:22px}.statBox{padding:18px;border:1px solid var(--line);background:var(--surface);border-radius:17px}.statBox strong{display:block;font:800 1.8rem Manrope}.statBox span{color:var(--muted);font-size:.78rem}.filterRow{display:flex;justify-content:flex-end;margin-bottom:20px}.filterRow select,.settingsCard input,.settingsCard textarea,.bigInput,.authCard textarea{padding:13px;border:1px solid var(--line);border-radius:12px;background:var(--surface2);color:var(--text)}.leaderboard{display:grid;gap:10px}.leaderRow{display:grid;grid-template-columns:50px 1fr repeat(4,90px);align-items:center;gap:12px;padding:16px;border:1px solid var(--line);background:var(--surface);border-radius:16px}.leaderRank{font:800 1.4rem Manrope;color:var(--accent)}.leaderPerson{display:flex;align-items:center;gap:10px}.leaderMetric strong,.leaderMetric span{display:block}.leaderMetric span{font-size:.7rem;color:var(--muted)}.messaging{display:grid;grid-template-columns:300px 1fr;min-height:580px;border:1px solid var(--line);border-radius:20px;overflow:hidden}.conversations{border-right:1px solid var(--line);background:var(--surface)}.conversation{width:100%;display:flex;align-items:center;gap:10px;padding:14px;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--text);text-align:left}.conversation small{display:block;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}.chat{display:flex;flex-direction:column;background:var(--surface)}.chatHead{padding:16px;border-bottom:1px solid var(--line);font-weight:700}.chatMessages{flex:1;padding:18px;overflow:auto;display:flex;flex-direction:column;gap:9px}.bubble{max-width:70%;padding:10px 12px;border-radius:14px;background:var(--surface2)}.bubble.me{align-self:flex-end;background:linear-gradient(135deg,var(--accent),#ff7258);color:white}.chatForm{display:grid;grid-template-columns:1fr auto;gap:8px;padding:14px;border-top:1px solid var(--line)}.chatForm input{padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--surface2);color:var(--text)}.notifications{display:grid;gap:10px;max-width:800px}.notification{display:flex;gap:12px;padding:16px;border:1px solid var(--line);background:var(--surface);border-radius:15px}.notification.unread{border-left:3px solid var(--accent)}.notification small{display:block;color:var(--muted);margin-top:4px}.settingsCard{max-width:700px;display:grid;gap:12px;padding:22px;border:1px solid var(--line);background:var(--surface);border-radius:20px}.settingsCard textarea{min-height:130px}.peopleGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:20px}.personCard{padding:18px;border:1px solid var(--line);background:var(--surface);border-radius:18px}.personCard p{color:var(--muted);font-size:.84rem}.profileBanner{height:230px;border-radius:24px 24px 0 0;background:linear-gradient(135deg,rgba(255,79,120,.3),rgba(139,109,255,.35));background-size:cover;background-position:center}.profilePanel{padding:0 28px 28px;border:1px solid var(--line);border-top:0;background:var(--surface);border-radius:0 0 24px 24px}.profileIdentity{display:flex;align-items:end;gap:18px;transform:translateY(-42px);margin-bottom:-30px}.profileAvatarBig{width:105px;height:105px;display:grid;place-items:center;border-radius:28px;border:5px solid var(--surface);background:linear-gradient(135deg,var(--accent),var(--accent2));font:800 2rem Manrope}.badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}.badge{padding:8px 11px;border:1px solid var(--line);background:var(--surface2);border-radius:999px;font-size:.78rem}.customLists{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.customListCard{padding:18px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(135deg,rgba(255,79,120,.09),rgba(139,109,255,.08)),var(--surface)}.spoiler{filter:blur(7px);cursor:pointer}.adminStats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.reportCard{padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--surface);margin-top:10px}.emptyPanel{display:grid;place-items:center;color:var(--muted)}
@media(max-width:1000px){.sidebar{width:76px}.sidebar .brand b,.sidebar .brand em,.sidebar nav span{display:none}.app{margin-left:76px}.topbar{left:76px}.leaderRow{grid-template-columns:40px 1fr 70px}.leaderMetric:nth-last-child(-n+3){display:none}.peopleGrid,.customLists{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.sidebar{inset:auto 0 0 0;width:auto;height:66px;display:block;padding:8px;overflow-x:auto}.sidebar .brand,.sidebarFooter{display:none}.sidebar nav{display:flex}.sidebar nav button{min-width:54px;justify-content:center}.app{margin-left:0;padding-bottom:70px}.topbar{left:0}.statsStrip{grid-template-columns:1fr 1fr}.messaging{grid-template-columns:1fr}.conversations{display:none}.peopleGrid,.customLists{grid-template-columns:1fr}.leaderRow{grid-template-columns:40px 1fr 70px}.adminStats{grid-template-columns:1fr 1fr}}


/* V5 STUDIO — product polish */
:root{
  --radius-xs:10px;--radius-sm:14px;--radius-md:20px;--radius-lg:28px;
  --glass:rgba(15,18,25,.72);--focus:0 0 0 3px rgba(255,79,120,.18)
}
body{background:
  radial-gradient(circle at 14% -6%,rgba(139,109,255,.15),transparent 30rem),
  radial-gradient(circle at 92% 22%,rgba(255,79,120,.10),transparent 30rem),
  var(--bg);overflow-x:hidden}
button,input,textarea,select{transition:border-color .18s ease,background .18s ease,transform .18s ease,box-shadow .18s ease}
button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:none;box-shadow:var(--focus);border-color:rgba(255,79,120,.55)}
.primary:hover,.secondary:hover,.iconBtn:hover,.loginBtn:hover{transform:translateY(-1px)}
.primary:active,.secondary:active,.iconBtn:active{transform:translateY(0) scale(.98)}
.sidebar{box-shadow:24px 0 70px rgba(0,0,0,.12)}
.sidebar nav button{min-height:44px;border-radius:12px}
.sidebar nav button.active{background:linear-gradient(90deg,rgba(255,79,120,.12),rgba(139,109,255,.07));color:var(--text);box-shadow:inset 3px 0 0 var(--accent)}
.topbar{background:rgba(8,9,13,.72);box-shadow:0 10px 40px rgba(0,0,0,.08)}
.search{max-width:680px;background:rgba(16,18,24,.88)}
.hero{min-height:610px;box-shadow:0 35px 100px rgba(0,0,0,.34)}
.hero:after{content:"";position:absolute;inset:0;border:1px solid rgba(255,255,255,.08);border-radius:inherit;pointer-events:none}
.heroContent{max-width:720px}
.hero h1{max-width:850px;font-size:clamp(3.2rem,6.5vw,7rem)}
.sectionHead h2,.pageTitle h1{letter-spacing:-.05em}
.movieCard{position:relative}
.poster{box-shadow:0 18px 46px rgba(0,0,0,.23)}
.movieCard:hover .poster{box-shadow:0 26px 64px rgba(0,0,0,.32)}
.movieCard h3{font-size:.98rem}
.reviewCard{box-shadow:0 12px 32px rgba(0,0,0,.08)}
.modal{animation:fadeIn .2s ease}
.modalCard{box-shadow:0 50px 140px rgba(0,0,0,.55)}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

.onboarding{
  position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:24px;
  background:radial-gradient(circle at 30% 20%,rgba(139,109,255,.25),transparent 28rem),
             radial-gradient(circle at 70% 80%,rgba(255,79,120,.22),transparent 30rem),
             rgba(4,5,8,.95);backdrop-filter:blur(24px)
}
.onboardingCard{
  width:min(620px,100%);padding:44px;border:1px solid var(--line);border-radius:32px;
  background:linear-gradient(145deg,rgba(24,27,37,.98),rgba(12,14,20,.98));
  box-shadow:0 60px 160px rgba(0,0,0,.55);text-align:center
}
.onboardingMark{
  width:76px;height:76px;margin:0 auto 22px;display:grid;place-items:center;border-radius:24px;
  background:linear-gradient(135deg,var(--accent),var(--accent2));font:800 2rem Manrope;
  box-shadow:0 18px 50px rgba(255,79,120,.28)
}
.onboardingCard h2{font:800 clamp(2.3rem,6vw,4.4rem)/.95 Manrope;letter-spacing:-.06em;margin:12px 0}
.onboardingCard p{color:var(--muted);line-height:1.7;max-width:500px;margin:0 auto}
.onboardingSteps{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:28px 0}
.onboardingSteps div{padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--surface2)}
.onboardingSteps b,.onboardingSteps span{display:block}
.onboardingSteps b{color:var(--accent);font:800 .8rem Manrope}.onboardingSteps span{margin-top:6px;font-weight:700}

.pageLoader{position:fixed;inset:0;z-index:250;display:flex;align-items:center;justify-content:center;gap:7px;background:var(--bg);transition:opacity .35s ease}
.pageLoader.hidden{opacity:0;pointer-events:none}
.pageLoader span{width:9px;height:9px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2));animation:pulse 1s infinite ease-in-out}
.pageLoader span:nth-child(2){animation-delay:.12s}.pageLoader span:nth-child(3){animation-delay:.24s}
@keyframes pulse{0%,80%,100%{transform:scale(.65);opacity:.4}40%{transform:scale(1.25);opacity:1}}

.skeleton{position:relative;overflow:hidden;background:var(--surface2)}
.skeleton:after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent);animation:shimmer 1.35s infinite}
@keyframes shimmer{100%{transform:translateX(100%)}}

.emptyStatePro{padding:64px 28px;text-align:center;border:1px dashed var(--line);border-radius:24px;background:linear-gradient(135deg,rgba(255,79,120,.04),rgba(139,109,255,.04))}
.emptyStatePro strong{display:block;font:800 1.4rem Manrope;margin-bottom:8px}.emptyStatePro span{color:var(--muted)}
.verified{display:inline-grid;place-items:center;width:16px;height:16px;border-radius:50%;background:#5f86ff;color:white;font-size:10px}
@media(max-width:700px){
  .onboardingCard{padding:30px 20px;border-radius:24px}.onboardingSteps{grid-template-columns:1fr}
  .hero{min-height:620px}.heroContent{bottom:9%}.hero h1{font-size:3.5rem}
}


/* V6 GLOBAL */
.startupError{margin:20px 0;padding:20px;border:1px solid rgba(255,79,120,.35);border-radius:18px;background:rgba(255,79,120,.08);display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.startupError strong{font:800 1rem Manrope}.startupError span{color:var(--muted);flex:1}
.timeline{display:grid;gap:12px;margin-top:24px}.timelineItem{display:grid;grid-template-columns:150px 70px 1fr;gap:16px;align-items:center;padding:14px;border:1px solid var(--line);background:var(--surface);border-radius:18px;cursor:pointer}
.timelineItem img{width:70px;height:100px;object-fit:cover;border-radius:11px}.timelineDate{color:var(--muted);font-size:.8rem}.timelineItem h3{margin:4px 0}.timelineItem p,.timelineItem small{color:var(--muted)}
.clubsGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:22px}.clubCard{padding:18px;border:1px solid var(--line);background:var(--surface);border-radius:22px;cursor:pointer}.clubCover{height:120px;margin:-18px -18px 16px;border-radius:22px 22px 0 0;background:linear-gradient(135deg,rgba(255,79,120,.55),rgba(139,109,255,.65))}.clubCard p{color:var(--muted);min-height:44px}.clubHero{padding:36px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(135deg,rgba(255,79,120,.14),rgba(139,109,255,.14)),var(--surface)}.clubHero h2{font:800 clamp(2.4rem,6vw,5rem)/.95 Manrope;letter-spacing:-.06em;margin:8px 0}.clubHero p{color:var(--muted);max-width:700px}.clubComposer{margin:18px 0;display:grid;gap:10px;padding:16px;border:1px solid var(--line);background:var(--surface);border-radius:18px}.clubComposer textarea{min-height:100px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--surface2);color:var(--text)}
.partiesGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.partyCard{display:grid;grid-template-columns:130px 1fr;gap:16px;padding:16px;border:1px solid var(--line);border-radius:20px;background:var(--surface)}.partyCard img{width:130px;height:190px;object-fit:cover;border-radius:13px}.partyCard p,.partyCard small{display:block;color:var(--muted);margin-bottom:12px}
.settingsDivider{width:100%;border:0;border-top:1px solid var(--line);margin:8px 0}.toggleLine{display:flex;align-items:center;gap:10px;color:var(--muted)}
[data-theme="light"]{--bg:#f3f5f8;--surface:#fff;--surface2:#f1f3f7;--text:#121620;--muted:#677083;--line:rgba(15,23,42,.1);--glass:rgba(255,255,255,.75)}
[data-theme="light"] body{background:radial-gradient(circle at 14% -6%,rgba(139,109,255,.12),transparent 30rem),#f3f5f8}
[data-theme="light"] .sidebar{background:rgba(255,255,255,.92)}
[data-theme="light"] .topbar{background:rgba(243,245,248,.78)}
@media(max-width:900px){.clubsGrid{grid-template-columns:1fr 1fr}.partiesGrid{grid-template-columns:1fr}.timelineItem{grid-template-columns:100px 60px 1fr}}
@media(max-width:650px){.clubsGrid{grid-template-columns:1fr}.timelineItem{grid-template-columns:1fr 70px 1fr}.timelineDate{grid-column:1/-1}.partyCard{grid-template-columns:90px 1fr}.partyCard img{width:90px;height:135px}}


/* =========================================================
   CINETRACK GLOBAL V7 — PREMIUM DESKTOP + MOBILE
   ========================================================= */

:root{
  --radius-xl:30px;
  --radius-lg:22px;
  --radius-md:16px;
  --shadow-soft:0 18px 60px rgba(0,0,0,.28);
  --shadow-card:0 14px 36px rgba(0,0,0,.2);
  --accent-grad:linear-gradient(135deg,#ff4f78 0%,#a56cff 52%,#5f7cff 100%);
}

html{scroll-behavior:smooth}
body{
  min-height:100vh;
  background:
    radial-gradient(circle at 12% 8%,rgba(165,108,255,.14),transparent 34rem),
    radial-gradient(circle at 88% 16%,rgba(255,79,120,.10),transparent 34rem),
    var(--bg);
}
button,input,select,textarea{font:inherit}
button{transition:transform .2s ease,background .2s ease,border-color .2s ease,opacity .2s ease}
button:active{transform:scale(.97)}

.sidebar{
  width:260px;
  padding:20px 14px;
  border-right:1px solid var(--line);
  backdrop-filter:blur(22px);
}
.brand{
  width:100%;
  display:grid;
  grid-template-columns:44px 1fr;
  grid-template-rows:auto auto;
  align-items:center;
  text-align:left;
  gap:0 10px;
  padding:8px 10px 22px;
}
.brand>span{
  grid-row:1/3;
  display:grid;
  place-items:center;
  width:44px;height:44px;
  border-radius:15px;
  background:var(--accent-grad);
  color:#fff;
  font:800 1.15rem Manrope;
  box-shadow:0 10px 28px rgba(165,108,255,.32);
}
.brand b{font:800 1.05rem Manrope;letter-spacing:-.02em}
.brand em{font-style:normal;color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.14em}

.sidebar nav{display:grid;gap:5px}
.sidebar nav button{
  min-height:48px;
  padding:0 14px;
  border-radius:14px;
  border:1px solid transparent;
  color:var(--muted);
  background:transparent;
  justify-content:flex-start;
  gap:12px;
}
.sidebar nav button:hover{
  color:var(--text);
  background:var(--surface2);
}
.sidebar nav button.active{
  color:#fff;
  background:linear-gradient(135deg,rgba(255,79,120,.22),rgba(165,108,255,.25));
  border-color:rgba(165,108,255,.24);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}

.app{margin-left:260px;min-width:0}
.topbar{
  min-height:76px;
  padding:14px clamp(18px,3vw,38px);
  backdrop-filter:blur(24px);
  border-bottom:1px solid var(--line);
}
.search{
  max-width:680px;
  height:48px;
  border-radius:16px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.035);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.search:focus-within{
  border-color:rgba(165,108,255,.5);
  box-shadow:0 0 0 4px rgba(165,108,255,.08);
}
.iconBtn{
  width:46px;height:46px;
  border-radius:15px;
  border:1px solid var(--line);
  background:var(--surface);
}

main{width:min(1540px,100%);margin:0 auto;padding:28px clamp(18px,3vw,42px) 70px}
.page{animation:pageIn .35s ease}
@keyframes pageIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.hero{
  min-height:520px;
  border-radius:var(--radius-xl);
  overflow:hidden;
  box-shadow:var(--shadow-soft);
  border:1px solid rgba(255,255,255,.06);
}
.heroContent{
  max-width:780px;
  padding:clamp(34px,7vw,88px);
}
.heroContent h1{
  max-width:850px;
  font-size:clamp(3rem,6.5vw,7.3rem);
  line-height:.91;
  letter-spacing:-.075em;
  text-wrap:balance;
}
.heroContent p{
  max-width:650px;
  font-size:clamp(1rem,1.4vw,1.22rem);
  line-height:1.75;
}
.primary,.secondary{
  min-height:46px;
  padding:0 18px;
  border-radius:14px;
  font-weight:700;
}
.primary{
  background:var(--accent-grad);
  border:0;
  color:#fff;
  box-shadow:0 10px 30px rgba(165,108,255,.24);
}
.primary:hover{transform:translateY(-1px);filter:brightness(1.06)}
.secondary{
  border:1px solid var(--line);
  background:rgba(255,255,255,.045);
  color:var(--text);
}

.statsStrip{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin:18px 0 10px;
}
.statBox{
  min-height:104px;
  border-radius:20px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.015));
  box-shadow:var(--shadow-card);
}
.statBox strong{font:800 clamp(1.7rem,3vw,2.5rem) Manrope;letter-spacing:-.05em}
.statBox span{text-transform:uppercase;letter-spacing:.08em;font-size:.7rem}

.sectionHead{margin-top:44px;margin-bottom:16px}
.sectionHead h2,.pageTitle h1{letter-spacing:-.055em}
.pageTitle{
  padding:20px 0 26px;
  max-width:920px;
}
.pageTitle h1{font-size:clamp(2.7rem,6vw,6rem);line-height:.95;text-wrap:balance}
.pageTitle p{max-width:660px;line-height:1.7}

.movieGrid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  gap:18px;
}
.movieCard{
  border-radius:22px;
  overflow:hidden;
  border:1px solid var(--line);
  background:var(--surface);
  box-shadow:var(--shadow-card);
}
.movieCard:hover{
  transform:translateY(-7px);
  border-color:rgba(165,108,255,.35);
  box-shadow:0 22px 55px rgba(0,0,0,.34);
}
.movieCard img{aspect-ratio:2/3;object-fit:cover}
.movieCard .movieInfo{padding:14px}
.movieCard h3{font-size:.98rem;line-height:1.3}
.movieCard p{font-size:.78rem}

.reviewCard,.reportCard,.timelineItem,.clubCard,.partyCard{
  border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018));
  box-shadow:var(--shadow-card);
}
.reviewCard{border-radius:22px;padding:18px}
.reviewMovie{gap:16px}
.reviewMovie img{width:86px;border-radius:14px}
.reviewActions{display:flex;gap:8px;flex-wrap:wrap}
.reviewActions button{
  min-height:38px;
  padding:0 12px;
  border-radius:12px;
  background:var(--surface2);
  border:1px solid var(--line);
}

.modal{
  padding:24px;
  backdrop-filter:blur(14px);
}
.modalCard{
  border-radius:28px;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 30px 90px rgba(0,0,0,.55);
}
.detailBody{gap:28px}
.detailPoster{
  border-radius:22px;
  box-shadow:0 24px 60px rgba(0,0,0,.4);
}
.detailInfo h2{
  font:800 clamp(2.2rem,5vw,5.4rem)/.95 Manrope;
  letter-spacing:-.06em;
}

input,select,textarea{
  min-height:48px;
  border-radius:14px;
  border:1px solid var(--line);
  background:var(--surface2);
  color:var(--text);
}
textarea{padding:14px}
input,select{padding:0 14px}
input:focus,select:focus,textarea:focus{
  outline:none;
  border-color:rgba(165,108,255,.55);
  box-shadow:0 0 0 4px rgba(165,108,255,.08);
}

.mobileNav{display:none}

/* TABLET */
@media(max-width:1100px){
  .sidebar{width:220px}
  .app{margin-left:220px}
  .movieGrid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
  .clubsGrid{grid-template-columns:repeat(2,1fr)}
  .hero{min-height:450px}
}

/* MOBILE APP */
@media(max-width:760px){
  body{overflow-x:hidden}
  .sidebar{display:none}
  .app{margin-left:0;padding-bottom:84px}
  .topbar{
    position:sticky;
    top:0;
    z-index:80;
    min-height:66px;
    padding:10px 12px;
    gap:8px;
    background:rgba(8,9,13,.88);
  }
  .search{
    height:44px;
    border-radius:14px;
    flex:1;
    min-width:0;
  }
  .search input{font-size:16px}
  .topbar .iconBtn{
    width:44px;height:44px;
    flex:0 0 44px;
  }
  #installAppBtn,#peopleSearch{display:none}

  main{
    padding:14px 12px 26px;
    overflow:hidden;
  }

  .hero{
    min-height:520px;
    border-radius:24px;
    display:flex;
    align-items:flex-end;
  }
  .heroContent{
    width:100%;
    padding:28px 22px 30px;
  }
  .heroContent h1{
    font-size:clamp(3.2rem,15vw,5.4rem);
    line-height:.89;
    letter-spacing:-.08em;
  }
  .heroContent p{
    font-size:.98rem;
    line-height:1.6;
    margin-bottom:18px;
  }
  .heroContent .row{display:grid;grid-template-columns:1fr;gap:10px}
  .heroContent .primary,.heroContent .secondary{width:100%;min-height:50px}

  .statsStrip{
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin-top:12px;
  }
  .statBox{
    min-height:90px;
    border-radius:18px;
  }

  .sectionHead{margin-top:34px;margin-bottom:13px}
  .sectionHead h2{font-size:1.7rem}
  .pageTitle{padding:12px 2px 20px}
  .pageTitle h1{font-size:clamp(3rem,15vw,5.2rem)}
  .pageTitle p{font-size:.95rem}

  .movieGrid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }
  .movieCard{
    border-radius:18px;
    box-shadow:0 10px 28px rgba(0,0,0,.22);
  }
  .movieCard:hover{transform:none}
  .movieCard .movieInfo{padding:11px}
  .movieCard h3{
    font-size:.9rem;
    min-height:2.4em;
  }
  .movieCard p{font-size:.72rem}

  .feedGrid,.feedColumn{display:grid;grid-template-columns:1fr;gap:12px}
  .reviewCard{
    padding:14px;
    border-radius:18px;
  }
  .reviewHead{align-items:flex-start;gap:10px}
  .reviewHead .stars{font-size:.74rem}
  .reviewMovie{
    grid-template-columns:64px 1fr;
    gap:12px;
  }
  .reviewMovie img{
    width:64px;
    height:96px;
    object-fit:cover;
  }
  .reviewActions{
    overflow-x:auto;
    flex-wrap:nowrap;
    scrollbar-width:none;
    padding-bottom:2px;
  }
  .reviewActions::-webkit-scrollbar{display:none}
  .reviewActions button{white-space:nowrap}

  .filterRow{display:grid;grid-template-columns:1fr}
  .filterRow select{width:100%}

  .clubsGrid,.partiesGrid{grid-template-columns:1fr}
  .clubCard,.partyCard{border-radius:20px}
  .partyCard{grid-template-columns:92px 1fr;padding:12px;gap:12px}
  .partyCard img{width:92px;height:138px}

  .timelineItem{
    grid-template-columns:72px 1fr;
    padding:12px;
    border-radius:18px;
  }
  .timelineDate{
    grid-column:1/-1;
    font-size:.72rem;
  }
  .timelineItem img{width:72px;height:108px}

  .modal{
    padding:0;
    align-items:flex-end;
  }
  .modalCard{
    width:100%;
    max-width:none;
    max-height:94dvh;
    border-radius:26px 26px 0 0;
    overflow:auto;
    padding:22px 16px calc(24px + env(safe-area-inset-bottom));
  }
  #movieModal .modalCard{
    height:96dvh;
    max-height:96dvh;
  }
  .detailBackdrop{height:220px}
  .detailBody{
    display:block;
    padding:0 16px 30px;
  }
  .detailPoster{
    width:120px;
    margin-top:-58px;
    position:relative;
    z-index:2;
    border-radius:16px;
  }
  .detailInfo{padding-top:16px}
  .detailInfo h2{font-size:2.7rem}
  .detailActions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:9px;
  }
  .detailActions button{min-height:48px}
  .reviewComposer{margin-top:18px}

  .authCard{width:100%}
  .row{flex-wrap:wrap}
  .row>*{max-width:100%}

  .mobileNav{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    position:fixed;
    left:8px;
    right:8px;
    bottom:calc(8px + env(safe-area-inset-bottom));
    z-index:200;
    min-height:68px;
    padding:7px 6px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:22px;
    background:rgba(15,16,23,.91);
    box-shadow:0 18px 60px rgba(0,0,0,.55);
    backdrop-filter:blur(24px);
  }
  .mobileNav button{
    display:grid;
    place-items:center;
    gap:2px;
    padding:6px 2px;
    border:0;
    border-radius:15px;
    background:transparent;
    color:var(--muted);
  }
  .mobileNav button>span{
    display:grid;
    place-items:center;
    width:30px;height:30px;
    border-radius:10px;
    font-size:1.05rem;
  }
  .mobileNav button small{
    font-size:.62rem;
    font-weight:700;
    letter-spacing:.01em;
  }
  .mobileNav button.active{color:#fff}
  .mobileNav button.active>span{
    background:var(--accent-grad);
    box-shadow:0 8px 20px rgba(165,108,255,.28);
  }

  .startupError{
    display:grid;
    gap:10px;
    border-radius:18px;
  }
}

/* VERY SMALL PHONES */
@media(max-width:390px){
  main{padding-left:9px;padding-right:9px}
  .heroContent{padding:24px 18px 26px}
  .heroContent h1{font-size:3.25rem}
  .movieGrid{gap:9px}
  .mobileNav{left:5px;right:5px;bottom:5px}
  .mobileNav button small{font-size:.58rem}
}

/* LIGHT THEME MOBILE */
@media(max-width:760px){
  [data-theme="light"] .topbar{background:rgba(243,245,248,.9)}
  [data-theme="light"] .mobileNav{
    background:rgba(255,255,255,.93);
    border-color:rgba(15,23,42,.08);
  }
}


/* =========================================================
   CINETRACK V8 — REWARDS, DEALS & PARTNERS
   ========================================================= */
.dealsHero{
  min-height:430px;
  padding:clamp(28px,6vw,72px);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:30px;
  border:1px solid var(--line);
  border-radius:32px;
  background:
    radial-gradient(circle at 80% 30%,rgba(255,193,7,.22),transparent 28rem),
    radial-gradient(circle at 15% 10%,rgba(165,108,255,.25),transparent 32rem),
    linear-gradient(135deg,#131622,#0b0c12);
  box-shadow:var(--shadow-soft);
  overflow:hidden;
}
.dealsHero h1{
  max-width:900px;
  margin:.14em 0;
  font:800 clamp(3rem,7vw,7rem)/.9 Manrope;
  letter-spacing:-.075em;
}
.dealsHero p{max-width:650px;color:var(--muted);font-size:1.08rem;line-height:1.7}
.pointsOrb{
  width:190px;height:190px;
  display:grid;place-items:center;
  align-content:center;
  border-radius:50%;
  background:radial-gradient(circle at 35% 25%,#ffe178,#ff9e2a 48%,#ff4f78 100%);
  color:#15100a;
  box-shadow:0 25px 80px rgba(255,158,42,.25),inset 0 2px 0 rgba(255,255,255,.6);
  transform:rotate(4deg);
}
.pointsOrb span{font:900 3.5rem/1 Manrope;letter-spacing:-.07em}
.pointsOrb small{font-weight:900;letter-spacing:.14em;font-size:.68rem}

.dealTabs{
  display:flex;
  gap:8px;
  margin:22px 0 14px;
  overflow-x:auto;
  scrollbar-width:none;
}
.dealTabs::-webkit-scrollbar{display:none}
.dealTabs button{
  flex:0 0 auto;
  min-height:42px;
  padding:0 15px;
  border-radius:999px;
  border:1px solid var(--line);
  color:var(--muted);
  background:var(--surface);
}
.dealTabs button.active{color:#fff;background:var(--accent-grad);border-color:transparent}

.demoNotice{
  padding:13px 15px;
  border:1px solid rgba(255,193,7,.22);
  border-radius:15px;
  color:#d9c588;
  background:rgba(255,193,7,.07);
  font-size:.82rem;
  line-height:1.5;
}

.dealsGrid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  margin-top:16px;
}
.dealCard{
  min-height:340px;
  padding:19px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:18px;
  border:1px solid var(--line);
  border-radius:24px;
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.018));
  box-shadow:var(--shadow-card);
}
.dealCard.premiumDeal{
  background:linear-gradient(150deg,rgba(255,193,7,.10),rgba(165,108,255,.12)),var(--surface);
  border-color:rgba(255,193,7,.24);
}
.dealTop{display:flex;justify-content:space-between;gap:8px;align-items:center}
.dealBadge{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 11px;
  border-radius:11px;
  background:linear-gradient(135deg,#ffd56a,#ff9f43);
  color:#1d1405;
  font-weight:900;
  font-size:.8rem;
}
.partnerBadge{
  padding:6px 9px;border-radius:999px;
  color:var(--muted);background:var(--surface2);font-size:.68rem;font-weight:700
}
.partnerBadge.verified{color:#77e5b4;background:rgba(54,211,153,.12)}
.dealCard h3{margin:7px 0;font:800 1.45rem/1.05 Manrope;letter-spacing:-.04em}
.dealCard p{color:var(--muted);line-height:1.55}
.dealMeta{display:flex;flex-wrap:wrap;gap:8px;color:var(--muted);font-size:.76rem}
.dealMeta span{padding:6px 8px;border-radius:9px;background:var(--surface2)}

.rewardsGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.rewardCard{
  padding:20px;
  border:1px solid var(--line);
  border-radius:22px;
  background:var(--surface);
}
.rewardIcon{
  width:58px;height:58px;
  display:grid;place-items:center;
  margin-bottom:18px;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(255,79,120,.18),rgba(165,108,255,.24));
  font-size:1.7rem;
}
.rewardCard h3{font:800 1.3rem Manrope;margin:.35rem 0}
.rewardCard p{min-height:52px;color:var(--muted);line-height:1.5}

.contestsGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.contestCard{
  padding:24px;
  display:grid;
  gap:10px;
  border:1px solid rgba(165,108,255,.25);
  border-radius:24px;
  background:linear-gradient(135deg,rgba(165,108,255,.14),rgba(255,79,120,.08)),var(--surface);
}
.contestCard h3{font:800 1.55rem Manrope;margin:0}
.contestCard p,.contestCard small{color:var(--muted)}
.contestCard button{justify-self:start}

.premiumPanel{
  margin-top:44px;
  padding:clamp(24px,5vw,52px);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  border-radius:28px;
  border:1px solid rgba(255,193,7,.22);
  background:radial-gradient(circle at 90% 20%,rgba(255,193,7,.2),transparent 25rem),linear-gradient(135deg,#1b1720,#10111a);
}
.premiumPanel h2{margin:.25rem 0;font:800 clamp(2rem,4vw,4rem)/.95 Manrope;letter-spacing:-.055em}
.premiumPanel p{color:var(--muted)}

.walletSummary{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.walletBalance,.membershipCard{
  min-height:220px;
  padding:28px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  border:1px solid var(--line);
  border-radius:26px;
  background:var(--surface);
  box-shadow:var(--shadow-card);
}
.walletBalance{background:radial-gradient(circle at 80% 10%,rgba(255,193,7,.25),transparent 20rem),var(--surface)}
.walletBalance strong{font:900 clamp(4rem,9vw,8rem)/.9 Manrope;letter-spacing:-.08em}
.walletBalance small{font-weight:900;letter-spacing:.16em;color:var(--muted)}
.membershipCard strong{margin:10px 0;font:800 2.4rem Manrope}
.membershipCard.premium{border-color:rgba(255,193,7,.3);background:linear-gradient(145deg,rgba(255,193,7,.1),rgba(165,108,255,.08)),var(--surface)}

.referralCard{
  margin-top:16px;
  padding:24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  border:1px solid var(--line);
  border-radius:24px;
  background:var(--surface);
}
.referralCard h2{margin:5px 0}
.referralCard p{color:var(--muted)}
.referralCode{display:flex;align-items:center;gap:8px}
.referralCode code,.bigCode{
  padding:13px 16px;
  border:1px dashed rgba(165,108,255,.45);
  border-radius:13px;
  background:rgba(165,108,255,.08);
  font-weight:900;
  letter-spacing:.12em;
}

.walletCodes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.walletCodeCard{
  padding:15px;
  display:grid;
  grid-template-columns:110px 1fr;
  gap:16px;
  align-items:center;
  border:1px solid var(--line);
  border-radius:22px;
  background:var(--surface);
}
.walletCodeCard img{width:110px;height:110px;border-radius:14px;background:#fff;padding:6px}
.walletCodeCard code{display:inline-block;margin:8px 0;font-weight:900;letter-spacing:.1em}
.walletCodeCard p{color:var(--muted)}

.pointsHistory{display:grid;gap:8px}
.pointsRow{
  min-height:64px;
  padding:12px 15px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  border:1px solid var(--line);
  border-radius:15px;
  background:var(--surface);
}
.pointsRow div{display:grid;gap:3px}
.pointsRow small{color:var(--muted)}
.pointsRow b{font:800 1.15rem Manrope}
.pointsRow .plus{color:#66dba7}.pointsRow .minus{color:#ff7f9c}

.rewardModalCard{text-align:center;max-width:520px}
.qrFrame{
  width:min(320px,80vw);
  margin:20px auto;
  padding:14px;
  border-radius:24px;
  background:#fff;
  box-shadow:0 20px 55px rgba(0,0,0,.35);
}
.qrFrame img{width:100%;display:block}
.bigCode{display:inline-block;font-size:1.25rem;margin:4px auto 16px}

@media(max-width:1100px){
  .dealsGrid,.rewardsGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .dealsHero{
    min-height:auto;
    padding:28px 20px;
    grid-template-columns:1fr;
    border-radius:24px;
  }
  .dealsHero h1{font-size:clamp(3.3rem,15vw,5.6rem)}
  .pointsOrb{width:140px;height:140px;justify-self:end}
  .pointsOrb span{font-size:2.8rem}
  .dealsGrid,.rewardsGrid,.contestsGrid{grid-template-columns:1fr}
  .dealCard{min-height:310px;border-radius:20px}
  .premiumPanel{display:grid;border-radius:22px}
  .premiumPanel button{width:100%}
  .walletSummary{grid-template-columns:1fr}
  .walletBalance,.membershipCard{min-height:180px}
  .referralCard{display:grid}
  .referralCode{display:grid;grid-template-columns:1fr auto}
  .referralCode code{overflow:hidden;text-overflow:ellipsis}
  .walletCodes{grid-template-columns:1fr}
  .walletCodeCard{grid-template-columns:90px 1fr}
  .walletCodeCard img{width:90px;height:90px}
}


/* =========================================================
   CINETRACK V9 — CINEBOT + LIGHT / DARK THEME
   ========================================================= */

#themeToggleBtn{
  font-size:1.1rem;
  position:relative;
  overflow:hidden;
}
#themeToggleBtn::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:radial-gradient(circle,rgba(255,255,255,.12),transparent 62%);
  opacity:0;
  transition:opacity .2s ease;
}
#themeToggleBtn:hover::after{opacity:1}

.chatbotLauncher{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:240;
  width:62px;height:62px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.12);
  border-radius:21px;
  color:#fff;
  background:var(--accent-grad);
  box-shadow:0 18px 50px rgba(112,78,255,.38),0 6px 20px rgba(0,0,0,.32);
}
.chatbotLauncher.hidden{display:none}
.chatbotLauncher:hover{transform:translateY(-3px)}
.botIcon{font-size:1.5rem;position:relative;z-index:2}
.botPulse{
  position:absolute;
  inset:-5px;
  border-radius:25px;
  border:1px solid rgba(165,108,255,.45);
  animation:botPulse 2s infinite;
}
@keyframes botPulse{
  0%{transform:scale(.9);opacity:.8}
  70%,100%{transform:scale(1.25);opacity:0}
}

.chatbotPanel{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:250;
  width:min(410px,calc(100vw - 28px));
  height:min(660px,calc(100dvh - 44px));
  display:grid;
  grid-template-rows:auto 1fr auto auto;
  border:1px solid rgba(255,255,255,.1);
  border-radius:28px;
  overflow:hidden;
  background:rgba(15,16,23,.94);
  box-shadow:0 30px 90px rgba(0,0,0,.55);
  backdrop-filter:blur(26px);
  transform:translateY(24px) scale(.96);
  opacity:0;
  pointer-events:none;
  transition:opacity .22s ease,transform .22s ease;
}
.chatbotPanel.open{
  transform:none;
  opacity:1;
  pointer-events:auto;
}

.chatbotHeader{
  min-height:76px;
  padding:13px 15px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(135deg,rgba(255,79,120,.11),rgba(165,108,255,.13));
}
.chatbotIdentity{
  display:flex;
  align-items:center;
  gap:11px;
}
.chatbotAvatar{
  width:44px;height:44px;
  display:grid;
  place-items:center;
  border-radius:15px;
  background:var(--accent-grad);
  color:#fff;
  box-shadow:0 10px 26px rgba(165,108,255,.3);
}
.chatbotIdentity strong{
  display:block;
  font:800 1rem Manrope;
}
.chatbotIdentity small{
  display:flex;
  align-items:center;
  gap:6px;
  margin-top:3px;
  color:var(--muted);
  font-size:.72rem;
}
.chatbotIdentity small i{
  width:7px;height:7px;
  border-radius:50%;
  background:#59d99b;
  box-shadow:0 0 0 4px rgba(89,217,155,.1);
}
.chatbotHeaderActions{display:flex;gap:6px}
.chatbotHeaderActions button{
  width:36px;height:36px;
  border:1px solid var(--line);
  border-radius:11px;
  color:var(--muted);
  background:var(--surface2);
}

.chatbotMessages{
  min-height:0;
  overflow-y:auto;
  padding:18px 14px;
  display:flex;
  flex-direction:column;
  gap:12px;
  scroll-behavior:smooth;
}
.chatbotMessages::-webkit-scrollbar{width:6px}
.chatbotMessages::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,.12);
  border-radius:999px;
}
.botMessage{
  display:flex;
  max-width:88%;
}
.botMessage.user{align-self:flex-end}
.botMessage.assistant{align-self:flex-start}
.botBubble{
  padding:11px 13px;
  border-radius:17px;
  line-height:1.55;
  font-size:.9rem;
}
.botMessage.assistant .botBubble{
  color:var(--text);
  border:1px solid var(--line);
  border-bottom-left-radius:6px;
  background:var(--surface2);
}
.botMessage.user .botBubble{
  color:#fff;
  border-bottom-right-radius:6px;
  background:var(--accent-grad);
  box-shadow:0 8px 22px rgba(165,108,255,.18);
}
.botMessage.typing .botBubble{
  display:flex;
  align-items:center;
  gap:4px;
  min-width:54px;
}
.botMessage.typing span{
  width:7px;height:7px;
  border-radius:50%;
  background:var(--muted);
  animation:botTyping 1.2s infinite ease-in-out;
}
.botMessage.typing span:nth-child(2){animation-delay:.15s}
.botMessage.typing span:nth-child(3){animation-delay:.3s}
@keyframes botTyping{
  0%,60%,100%{transform:translateY(0);opacity:.5}
  30%{transform:translateY(-4px);opacity:1}
}

.chatbotSuggestions{
  display:flex;
  gap:7px;
  padding:0 12px 10px;
  overflow-x:auto;
  scrollbar-width:none;
}
.chatbotSuggestions::-webkit-scrollbar{display:none}
.chatbotSuggestions button{
  flex:0 0 auto;
  min-height:35px;
  padding:0 11px;
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--muted);
  background:var(--surface2);
  font-size:.76rem;
}
.chatbotSuggestions button:hover{
  color:var(--text);
  border-color:rgba(165,108,255,.35);
}

.chatbotComposer{
  min-height:68px;
  padding:10px 11px;
  display:grid;
  grid-template-columns:1fr 44px;
  gap:8px;
  border-top:1px solid var(--line);
  background:rgba(255,255,255,.02);
}
.chatbotComposer input{
  width:100%;
  min-width:0;
  height:46px;
  padding:0 13px;
}
.chatbotComposer button{
  width:44px;height:44px;
  border:0;
  border-radius:14px;
  color:#fff;
  background:var(--accent-grad);
}

/* Thème clair renforcé */
[data-theme="light"]{
  color-scheme:light;
  --bg:#f5f6fa;
  --surface:#ffffff;
  --surface2:#eef1f6;
  --text:#12141b;
  --muted:#687083;
  --line:rgba(17,24,39,.1);
  --glass:rgba(255,255,255,.82);
}
[data-theme="light"] body{
  background:
    radial-gradient(circle at 12% 8%,rgba(165,108,255,.12),transparent 34rem),
    radial-gradient(circle at 88% 14%,rgba(255,79,120,.08),transparent 34rem),
    #f5f6fa;
}
[data-theme="light"] .sidebar{
  background:rgba(255,255,255,.9);
  box-shadow:8px 0 30px rgba(17,24,39,.035);
}
[data-theme="light"] .topbar{
  background:rgba(245,246,250,.85);
}
[data-theme="light"] .chatbotPanel{
  background:rgba(255,255,255,.96);
  border-color:rgba(17,24,39,.1);
  box-shadow:0 30px 90px rgba(17,24,39,.18);
}
[data-theme="light"] .chatbotHeader{
  background:linear-gradient(135deg,rgba(255,79,120,.08),rgba(165,108,255,.09));
}
[data-theme="light"] .dealCard,
[data-theme="light"] .reviewCard,
[data-theme="light"] .movieCard,
[data-theme="light"] .clubCard,
[data-theme="light"] .partyCard{
  box-shadow:0 16px 40px rgba(17,24,39,.08);
}
[data-theme="light"] .dealsHero{
  background:
    radial-gradient(circle at 80% 30%,rgba(255,193,7,.18),transparent 28rem),
    radial-gradient(circle at 15% 10%,rgba(165,108,255,.16),transparent 32rem),
    linear-gradient(135deg,#ffffff,#f4f1ff);
}
[data-theme="light"] .premiumPanel{
  background:radial-gradient(circle at 90% 20%,rgba(255,193,7,.18),transparent 25rem),linear-gradient(135deg,#fffaf0,#f7f2ff);
}
[data-theme="light"] .demoNotice{color:#856b17}
[data-theme="light"] .mobileNav{
  background:rgba(255,255,255,.94);
  box-shadow:0 18px 45px rgba(17,24,39,.14);
}
[data-theme="light"] .botMessage.user .botBubble{color:#fff}

@media(max-width:760px){
  #themeToggleBtn{display:grid}
  .chatbotLauncher{
    right:14px;
    bottom:calc(88px + env(safe-area-inset-bottom));
    width:56px;height:56px;
    border-radius:19px;
  }
  .chatbotPanel{
    left:8px;
    right:8px;
    bottom:calc(84px + env(safe-area-inset-bottom));
    width:auto;
    height:min(650px,calc(100dvh - 104px - env(safe-area-inset-bottom)));
    border-radius:24px;
  }
  .chatbotHeader{min-height:68px}
  .chatbotMessages{padding:14px 11px}
  .botMessage{max-width:92%}
  .chatbotSuggestions{padding-left:10px;padding-right:10px}
}

@media(max-width:390px){
  .chatbotPanel{
    left:5px;
    right:5px;
    bottom:calc(79px + env(safe-area-inset-bottom));
    height:calc(100dvh - 92px - env(safe-area-inset-bottom));
    border-radius:20px;
  }
}


/* =========================================================
   CINETRACK V10 — ULTIMATE VISUAL SYSTEM
   ========================================================= */

:root{
  --cinema-red:#ff4f78;
  --cinema-violet:#8b6dff;
  --cinema-blue:#5f7cff;
  --cinema-gold:#ffc857;
  --ultimate-glow:0 0 0 1px rgba(255,255,255,.05),0 28px 90px rgba(0,0,0,.34);
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-2;
  background:
    radial-gradient(circle at 18% 8%,rgba(139,109,255,.16),transparent 28rem),
    radial-gradient(circle at 82% 10%,rgba(255,79,120,.12),transparent 30rem),
    radial-gradient(circle at 50% 100%,rgba(95,124,255,.08),transparent 34rem);
}

body::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:.13;
  background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(to bottom,black,transparent 82%);
}

.themeSwitcher{
  display:flex;
  align-items:center;
  gap:4px;
  min-height:46px;
  padding:4px;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--surface);
  box-shadow:0 10px 30px rgba(0,0,0,.12);
}
.themeSwitcher button{
  min-height:36px;
  padding:0 10px;
  display:flex;
  align-items:center;
  gap:6px;
  border:0;
  border-radius:11px;
  color:var(--muted);
  background:transparent;
  font-size:.78rem;
  font-weight:800;
}
.themeSwitcher button:hover{color:var(--text);background:var(--surface2)}
.themeSwitcher button.active{
  color:#fff;
  background:var(--accent-grad);
  box-shadow:0 8px 22px rgba(139,109,255,.25);
}
.themeSwitcher button span{white-space:nowrap}

.mobileThemeBar{display:none}

.hero{
  position:relative;
  isolation:isolate;
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    linear-gradient(110deg,rgba(5,6,10,.96) 0%,rgba(5,6,10,.76) 45%,rgba(5,6,10,.18) 100%),
    radial-gradient(circle at 78% 22%,rgba(255,79,120,.28),transparent 24rem),
    radial-gradient(circle at 66% 78%,rgba(139,109,255,.24),transparent 26rem);
}
.hero::after{
  content:"";
  position:absolute;
  right:5%;
  top:11%;
  width:min(34vw,430px);
  aspect-ratio:2/3;
  border-radius:28px;
  opacity:.28;
  transform:rotate(7deg);
  background:linear-gradient(145deg,rgba(255,255,255,.18),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 50px 110px rgba(0,0,0,.45);
}

.heroContent{position:relative;z-index:2}
.heroContent .eyebrow{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 12px;
  border-radius:999px;
  color:#fff;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.1);
  backdrop-filter:blur(12px);
}
.heroContent h1{
  background:linear-gradient(180deg,#fff 0%,#d9dbea 76%,#8d93ad 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:drop-shadow(0 10px 35px rgba(0,0,0,.22));
}

.pageTitle h1,.sectionHead h2{
  text-wrap:balance;
}

.movieCard,.reviewCard,.dealCard,.rewardCard,.clubCard,.partyCard,.contestCard,.walletBalance,.membershipCard{
  position:relative;
  overflow:hidden;
}
.movieCard::before,.reviewCard::before,.dealCard::before,.rewardCard::before,.clubCard::before,.partyCard::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(135deg,rgba(255,255,255,.07),transparent 36%);
  opacity:.45;
}
.movieCard{
  backdrop-filter:blur(8px);
}
.movieCard img{
  transition:transform .45s ease,filter .45s ease;
}
.movieCard:hover img{
  transform:scale(1.045);
  filter:saturate(1.08) contrast(1.03);
}
.movieCard::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:34%;
  pointer-events:none;
  background:linear-gradient(to top,rgba(0,0,0,.34),transparent);
  opacity:.45;
}

.primary{
  position:relative;
  overflow:hidden;
}
.primary::after{
  content:"";
  position:absolute;
  top:-120%;
  left:-30%;
  width:28%;
  height:320%;
  transform:rotate(22deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.34),transparent);
  transition:left .7s ease;
}
.primary:hover::after{left:120%}

.topbar{
  box-shadow:0 10px 35px rgba(0,0,0,.07);
}
.search{
  transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
.search:focus-within{transform:translateY(-1px)}

.sidebar{
  box-shadow:14px 0 55px rgba(0,0,0,.07);
}
.sidebar nav button.active{
  position:relative;
}
.sidebar nav button.active::before{
  content:"";
  position:absolute;
  left:-7px;
  top:50%;
  width:3px;
  height:24px;
  border-radius:999px;
  transform:translateY(-50%);
  background:linear-gradient(#ff4f78,#8b6dff);
  box-shadow:0 0 18px rgba(139,109,255,.6);
}

.chatbotLauncher{
  width:68px;
  height:68px;
  border-radius:24px;
}
.chatbotLauncher::after{
  content:"CineBot";
  position:absolute;
  right:78px;
  padding:8px 11px;
  border-radius:11px;
  color:var(--text);
  background:var(--surface);
  border:1px solid var(--line);
  box-shadow:0 12px 30px rgba(0,0,0,.18);
  font-weight:800;
  font-size:.74rem;
  opacity:0;
  transform:translateX(8px);
  pointer-events:none;
  transition:.2s ease;
}
.chatbotLauncher:hover::after{
  opacity:1;
  transform:none;
}

[data-theme="dark"]{
  --bg:#07080d;
  --surface:#11131b;
  --surface2:#181b25;
  --text:#f7f8fb;
  --muted:#9aa1b5;
  --line:rgba(255,255,255,.075);
  color-scheme:dark;
}
[data-theme="dark"] body{
  background:#07080d;
}
[data-theme="dark"] .topbar{
  background:rgba(7,8,13,.78);
}
[data-theme="dark"] .sidebar{
  background:linear-gradient(180deg,rgba(15,16,24,.96),rgba(8,9,14,.98));
}
[data-theme="dark"] .movieCard,
[data-theme="dark"] .reviewCard,
[data-theme="dark"] .dealCard,
[data-theme="dark"] .rewardCard{
  background:linear-gradient(180deg,rgba(26,29,40,.95),rgba(14,16,23,.98));
}

[data-theme="light"]{
  --bg:#f4f6fb;
  --surface:#ffffff;
  --surface2:#eef1f7;
  --text:#11131a;
  --muted:#687084;
  --line:rgba(22,30,50,.09);
  color-scheme:light;
}
[data-theme="light"] body{
  background:
    radial-gradient(circle at 16% 7%,rgba(139,109,255,.12),transparent 28rem),
    radial-gradient(circle at 84% 10%,rgba(255,79,120,.08),transparent 28rem),
    #f4f6fb;
}
[data-theme="light"] body::after{opacity:.05}
[data-theme="light"] .hero::before{
  background:
    linear-gradient(110deg,rgba(18,20,31,.94) 0%,rgba(18,20,31,.72) 48%,rgba(18,20,31,.12) 100%),
    radial-gradient(circle at 78% 22%,rgba(255,79,120,.3),transparent 24rem),
    radial-gradient(circle at 66% 78%,rgba(139,109,255,.26),transparent 26rem);
}
[data-theme="light"] .sidebar{
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,249,252,.98));
}
[data-theme="light"] .topbar{
  background:rgba(244,246,251,.78);
}
[data-theme="light"] .themeSwitcher{
  box-shadow:0 10px 28px rgba(34,43,68,.08);
}
[data-theme="light"] .movieCard,
[data-theme="light"] .reviewCard,
[data-theme="light"] .dealCard,
[data-theme="light"] .rewardCard,
[data-theme="light"] .clubCard,
[data-theme="light"] .partyCard{
  background:linear-gradient(180deg,#ffffff,#fafbfe);
  box-shadow:0 18px 45px rgba(31,38,61,.08);
}
[data-theme="light"] .statBox{
  background:linear-gradient(180deg,#ffffff,#f8f9fc);
  box-shadow:0 16px 40px rgba(31,38,61,.07);
}
[data-theme="light"] .chatbotPanel{
  background:rgba(255,255,255,.97);
}

@media(max-width:1180px){
  .themeSwitcher button span{display:none}
  .themeSwitcher button{width:36px;justify-content:center;padding:0}
}

@media(max-width:760px){
  .themeSwitcher{display:none}
  .mobileThemeBar{
    display:grid;
    grid-template-columns:repeat(3,42px);
    gap:5px;
    position:fixed;
    right:10px;
    top:76px;
    z-index:180;
    padding:5px;
    border:1px solid var(--line);
    border-radius:16px;
    background:rgba(15,16,23,.86);
    box-shadow:0 14px 38px rgba(0,0,0,.28);
    backdrop-filter:blur(22px);
  }
  .mobileThemeBar button{
    width:42px;height:38px;
    display:grid;place-items:center;
    border:0;
    border-radius:11px;
    color:var(--muted);
    background:transparent;
  }
  .mobileThemeBar button.active{
    color:#fff;
    background:var(--accent-grad);
    box-shadow:0 8px 20px rgba(139,109,255,.25);
  }
  [data-theme="light"] .mobileThemeBar{
    background:rgba(255,255,255,.92);
  }

  .hero::after{
    right:-10%;
    top:4%;
    width:56vw;
    opacity:.2;
  }
  .heroContent h1{
    font-size:clamp(3.3rem,15vw,5.8rem);
  }
  .chatbotLauncher::after{display:none}
}

@media(max-width:390px){
  .mobileThemeBar{
    top:70px;
    right:7px;
    grid-template-columns:repeat(3,38px);
  }
  .mobileThemeBar button{width:38px;height:36px}
}


/* =========================================================
   CINETRACK FINAL V11
   ========================================================= */
.insightsToolbar{display:flex;gap:10px;justify-content:flex-end;margin-bottom:16px}
.insightsGrid{display:grid;grid-template-columns:1.35fr 1fr;gap:16px;margin-top:16px}
.insightPanel{padding:22px;border:1px solid var(--line);border-radius:24px;background:var(--surface);box-shadow:var(--shadow-card)}
.insightPanel h2{margin:.35rem 0 1.2rem;font:800 1.5rem Manrope}
.miniBars{height:220px;display:grid;grid-template-columns:repeat(12,1fr);gap:7px;align-items:end}
.barItem{height:100%;display:grid;grid-template-rows:1fr auto;gap:8px;align-items:end;text-align:center}
.barTrack{height:100%;min-height:80px;display:flex;align-items:flex-end;padding:3px;border-radius:10px;background:var(--surface2)}
.barTrack span{display:block;width:100%;min-height:4px;border-radius:8px;background:linear-gradient(180deg,#ff4f78,#8b6dff);box-shadow:0 8px 22px rgba(139,109,255,.22)}
.barItem small{color:var(--muted);font-size:.68rem}
.moodsCloud{display:flex;flex-wrap:wrap;gap:10px}
.moodsCloud span{padding:10px 12px;border:1px solid var(--line);border-radius:999px;background:var(--surface2);font-weight:700}
.moodsCloud b{color:#b29cff}

.comparePicker{padding:20px;border:1px solid var(--line);border-radius:24px;background:var(--surface)}
.comparePicker>input{width:100%}
.compareSearchResults{display:grid;gap:6px;margin-top:8px}
.compareSearchResults button{display:grid;grid-template-columns:44px 1fr;gap:10px;align-items:center;padding:7px;border:1px solid var(--line);border-radius:12px;background:var(--surface2);color:var(--text);text-align:left}
.compareSearchResults img{width:44px;height:64px;object-fit:cover;border-radius:8px}
.compareSelected{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}
.compareSelected article{position:relative;width:120px;padding:8px;border:1px solid var(--line);border-radius:16px;background:var(--surface2)}
.compareSelected img{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:11px}
.compareSelected span{display:block;margin-top:7px;font-size:.78rem;font-weight:700}
.compareSelected button{position:absolute;top:3px;right:3px;width:28px;height:28px;border:0;border-radius:999px;background:#111;color:#fff}
.compareGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:18px}
.compareCard{padding:18px;border:1px solid var(--line);border-radius:24px;background:var(--surface);box-shadow:var(--shadow-card)}
.compareCard>img{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:18px}
.compareCard h3{font:800 1.5rem Manrope;letter-spacing:-.04em}
.compareCard p{color:var(--muted);line-height:1.6}
.compareFacts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}
.compareFacts span{padding:10px;border-radius:12px;background:var(--surface2);color:var(--muted);font-size:.72rem}
.compareFacts b{display:block;color:var(--text);font-size:1rem}

.helpGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.helpCard{padding:20px;border:1px solid var(--line);border-radius:22px;background:var(--surface)}
.helpCard>span{display:grid;place-items:center;width:48px;height:48px;margin-bottom:16px;border-radius:15px;background:var(--accent-grad);color:#fff;font-size:1.2rem;font-weight:900}
.helpCard h3{margin:0 0 8px}.helpCard p{color:var(--muted);line-height:1.55}
kbd{padding:2px 6px;border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;background:var(--surface2);font-size:.72rem}
.feedbackCard{margin-top:18px;padding:24px;display:grid;gap:12px;border:1px solid var(--line);border-radius:24px;background:var(--surface)}
.feedbackCard textarea{min-height:150px}

.accessibilityBtn{position:fixed;left:278px;bottom:22px;z-index:220;width:52px;height:52px;border:1px solid var(--line);border-radius:17px;background:var(--surface);color:var(--text);box-shadow:0 16px 45px rgba(0,0,0,.25);font-weight:900}
.accessibilityPanel{position:fixed;left:278px;bottom:84px;z-index:260;width:min(340px,calc(100vw - 28px));padding:16px;display:grid;gap:14px;border:1px solid var(--line);border-radius:22px;background:var(--surface);box-shadow:0 28px 80px rgba(0,0,0,.4);transform:translateY(15px);opacity:0;pointer-events:none;transition:.2s ease}
.accessibilityPanel.open{transform:none;opacity:1;pointer-events:auto}
.accessibilityPanel header{display:flex;justify-content:space-between;align-items:center}
.accessibilityPanel header button{width:34px;height:34px;border:1px solid var(--line);border-radius:10px;background:var(--surface2);color:var(--text)}
.accessibilityPanel label{display:grid;gap:8px;color:var(--muted)}
.accessibilityPanel input[type="range"]{width:100%}

.commandPalette{position:fixed;inset:0;z-index:500;display:grid;place-items:start center;padding-top:12vh;background:rgba(0,0,0,.48);backdrop-filter:blur(12px);opacity:0;pointer-events:none;transition:.18s}
.commandPalette.open{opacity:1;pointer-events:auto}
.commandBox{width:min(620px,calc(100vw - 24px));padding:10px;border:1px solid var(--line);border-radius:24px;background:var(--surface);box-shadow:0 32px 100px rgba(0,0,0,.5)}
.commandBox>input{width:100%;height:54px}
#commandResults{display:grid;gap:4px;max-height:420px;overflow:auto;margin:8px 0}
#commandResults button{display:grid;grid-template-columns:38px 1fr;align-items:center;gap:9px;padding:9px 10px;border:0;border-radius:12px;background:transparent;color:var(--text);text-align:left}
#commandResults button.active,#commandResults button:hover{background:var(--surface2)}
.commandBox>small{display:block;padding:6px;color:var(--muted);text-align:center}

.shareCardPreview{padding:24px;margin:14px 0;border-radius:24px;background:radial-gradient(circle at 80% 20%,rgba(255,200,87,.22),transparent 18rem),linear-gradient(135deg,#161826,#0a0b11);color:#fff}
.shareCardPreview h2{font:800 2.2rem Manrope}
.shareNumbers{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.shareNumbers strong{padding:14px;border:1px solid rgba(255,255,255,.1);border-radius:15px;background:rgba(255,255,255,.06);font-size:1.5rem}
.shareNumbers small{display:block;margin-top:4px;color:#abb0c0;font-size:.62rem;letter-spacing:.08em}

.feedbackAdminList{display:grid;gap:10px}
.feedbackAdminList article{display:grid;grid-template-columns:1fr 150px;gap:16px;align-items:center;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}
.feedbackAdminList p{margin:.35rem 0;color:var(--muted)}

.reduceMotion *, .reduceMotion *::before, .reduceMotion *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
.highContrast{--line:rgba(255,255,255,.22)}
[data-theme="light"].highContrast{--line:rgba(0,0,0,.24);--text:#000;--muted:#3e4657}
.spoilerShield [data-spoiler],.spoilerShield .spoiler{filter:blur(12px)!important;user-select:none}
.spoilerShield [data-spoiler]:hover,.spoilerShield .spoiler:hover{filter:blur(5px)!important}

@media(max-width:1100px){
  .helpGrid{grid-template-columns:1fr 1fr}
  .accessibilityBtn,.accessibilityPanel{left:236px}
}
@media(max-width:760px){
  .insightsGrid{grid-template-columns:1fr}
  .miniBars{height:180px;gap:4px}
  .compareGrid{grid-template-columns:1fr}
  .helpGrid{grid-template-columns:1fr}
  .accessibilityBtn{left:12px;bottom:calc(88px + env(safe-area-inset-bottom));width:48px;height:48px}
  .accessibilityPanel{left:8px;right:8px;bottom:calc(145px + env(safe-area-inset-bottom));width:auto}
  .feedbackAdminList article{grid-template-columns:1fr}
  .insightsToolbar{justify-content:stretch}.insightsToolbar>*{flex:1}
  .shareNumbers strong{font-size:1.2rem}
}


/* =========================================================
   CINETRACK WORLD V12
   ========================================================= */
.peopleWorldGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;margin-top:16px}
.personWorldCard{display:grid;grid-template-columns:90px 1fr;gap:14px;align-items:center;padding:14px;border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:var(--shadow-card)}
.personWorldCard img{width:90px;height:125px;object-fit:cover;border-radius:14px}
.personWorldCard h3{margin:0 0 6px;font:800 1.1rem Manrope}
.personWorldCard p{color:var(--muted);font-size:.8rem;line-height:1.5;min-height:38px}

.goalForm,.calendarForm{display:grid;grid-template-columns:2fr 1fr 120px 180px auto;gap:10px;padding:16px;border:1px solid var(--line);border-radius:22px;background:var(--surface)}
.goalsGrid,.challengesGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:18px}
.goalCard,.challengeCard{padding:20px;border:1px solid var(--line);border-radius:22px;background:var(--surface);box-shadow:var(--shadow-card)}
.goalCard.done{opacity:.68}
.goalTop,.goalMeta{display:flex;justify-content:space-between;align-items:center;gap:10px}
.goalTop button{width:30px;height:30px;border:1px solid var(--line);border-radius:10px;background:var(--surface2);color:var(--muted)}
.goalCard h3,.challengeCard h3{font:800 1.4rem/1.1 Manrope;letter-spacing:-.04em}
.goalProgress{height:10px;margin:16px 0;border-radius:999px;overflow:hidden;background:var(--surface2)}
.goalProgress span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ff4f78,#8b6dff,#5f7cff)}
.goalMeta small,.challengeCard small{color:var(--muted)}
.goalButtons{display:flex;gap:8px;margin-top:14px}
.challengeEmoji{width:62px;height:62px;display:grid;place-items:center;margin-bottom:16px;border-radius:19px;background:linear-gradient(135deg,rgba(255,200,87,.18),rgba(139,109,255,.18));font-size:2rem}
.challengeCard p{color:var(--muted);line-height:1.55;min-height:48px}
.challengeCard button{width:100%;margin-top:16px}

.calendarForm{grid-template-columns:1.4fr .9fr 1fr 1.5fr auto}
.calendarForm textarea{min-height:48px;height:48px;resize:vertical}
.calendarTimeline{display:grid;gap:10px;margin-top:18px}
.calendarItem{display:grid;grid-template-columns:72px 1fr 36px;gap:14px;align-items:center;padding:14px;border:1px solid var(--line);border-radius:18px;background:var(--surface)}
.calendarDate{width:64px;height:64px;display:grid;place-items:center;align-content:center;border-radius:16px;background:var(--accent-grad);color:#fff}
.calendarDate strong{font:900 1.4rem/1 Manrope}.calendarDate span{font-size:.66rem;font-weight:800;letter-spacing:.08em}
.calendarItem h3{margin:4px 0}.calendarItem p{margin:0;color:var(--muted)}
.calendarItem>button{width:34px;height:34px;border:1px solid var(--line);border-radius:10px;background:var(--surface2);color:var(--muted)}

#page-foryou .pageTitle{max-width:1000px}
#page-foryou .movieGrid:empty::before{content:"Chargement…";color:var(--muted)}

#page-privacy .settingsCard label:not(.toggleLine){display:grid;gap:8px;color:var(--muted)}
#page-privacy .settingsCard label select{width:100%}

@media(max-width:1200px){
  .goalForm{grid-template-columns:1fr 1fr}
  .goalForm button{grid-column:1/-1}
  .calendarForm{grid-template-columns:1fr 1fr}
  .calendarForm textarea{grid-column:1/-1}
  .calendarForm button{grid-column:1/-1}
}
@media(max-width:900px){
  .goalsGrid,.challengesGrid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .peopleWorldGrid{grid-template-columns:1fr}
  .personWorldCard{grid-template-columns:74px 1fr;padding:11px}
  .personWorldCard img{width:74px;height:106px}
  .goalForm,.calendarForm{grid-template-columns:1fr}
  .goalForm button,.calendarForm textarea,.calendarForm button{grid-column:auto}
  .goalsGrid,.challengesGrid{grid-template-columns:1fr}
  .calendarItem{grid-template-columns:58px 1fr 32px;padding:11px}
  .calendarDate{width:56px;height:56px}
}


/* =========================================================
   CINETRACK ARTISTS V13 — ACTEURS & RÉALISATEURS
   ========================================================= */
.artistsTitle{max-width:1050px}
.artistsToolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin:8px 0 24px;
}
.artistTabs{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.artistTabs button{
  min-height:42px;
  padding:0 14px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--surface);
  color:var(--muted);
  font-weight:800;
}
.artistTabs button.active{
  color:#fff;
  border-color:transparent;
  background:var(--accent-grad);
  box-shadow:0 10px 25px rgba(139,109,255,.22);
}
.artistSearch{
  width:min(430px,100%);
  min-height:48px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 14px;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--surface);
}
.artistSearch input{
  width:100%;
  min-width:0;
  border:0;
  padding:0;
  background:transparent;
  box-shadow:none;
}
.artistSearch input:focus{box-shadow:none}

.artistsGrid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(250px,1fr));
  gap:18px;
}
.artistVisualCard{
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:26px;
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.015)),var(--surface);
  box-shadow:var(--shadow-card);
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.artistVisualCard:hover{
  transform:translateY(-7px);
  border-color:rgba(139,109,255,.34);
  box-shadow:0 26px 65px rgba(0,0,0,.3);
}
.artistPortraitWrap{
  position:relative;
  overflow:hidden;
  aspect-ratio:4/5;
  background:var(--surface2);
}
.artistPortrait{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .45s ease,filter .45s ease;
}
.artistVisualCard:hover .artistPortrait{
  transform:scale(1.04);
  filter:saturate(1.06) contrast(1.03);
}
.artistPortraitWrap::after{
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:42%;
  background:linear-gradient(to top,rgba(5,6,10,.7),transparent);
  pointer-events:none;
}
.artistDepartment{
  position:absolute;
  left:13px;
  bottom:13px;
  z-index:2;
  min-height:31px;
  display:inline-flex;
  align-items:center;
  padding:0 10px;
  border:1px solid rgba(255,255,255,.15);
  border-radius:999px;
  color:#fff;
  background:rgba(8,9,14,.58);
  backdrop-filter:blur(12px);
  font-size:.7rem;
  font-weight:800;
}
.artistVisualInfo{
  padding:16px;
}
.artistVisualInfo h3{
  margin:0 0 7px;
  font:800 1.35rem/1.08 Manrope;
  letter-spacing:-.04em;
}
.artistVisualInfo p{
  min-height:42px;
  margin:0 0 13px;
  color:var(--muted);
  line-height:1.5;
  font-size:.82rem;
}
.artistWorks{
  display:flex;
  gap:7px;
  margin:0 0 14px;
}
.artistWorks img{
  width:42px;
  height:62px;
  object-fit:cover;
  border-radius:8px;
  border:1px solid var(--line);
}
.artistVisualInfo .secondary{width:100%}
.loadArtistsMore{
  display:block;
  margin:22px auto 0;
  min-width:220px;
}

[data-theme="light"] .artistVisualCard{
  background:linear-gradient(180deg,#fff,#fafbfe);
  box-shadow:0 18px 45px rgba(31,38,61,.08);
}

@media(max-width:900px){
  .artistsToolbar{align-items:stretch;flex-direction:column}
  .artistSearch{width:100%}
}
@media(max-width:760px){
  .artistsGrid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:11px;
  }
  .artistVisualCard{border-radius:18px}
  .artistVisualInfo{padding:11px}
  .artistVisualInfo h3{font-size:1rem}
  .artistVisualInfo p{font-size:.72rem;min-height:36px}
  .artistWorks img{width:34px;height:50px}
  .artistDepartment{left:8px;bottom:8px;font-size:.62rem;min-height:27px;padding:0 8px}
  .artistTabs{
    overflow-x:auto;
    flex-wrap:nowrap;
    scrollbar-width:none;
  }
  .artistTabs::-webkit-scrollbar{display:none}
  .artistTabs button{flex:0 0 auto}
}
@media(max-width:390px){
  .artistsGrid{gap:8px}
  .artistVisualInfo h3{font-size:.93rem}
  .artistWorks img:nth-child(3){display:none}
}


/* =========================================================
   CINETRACK UNIVERSE V14 — FINAL LAYOUT & POLISH
   ========================================================= */
body{overflow-x:hidden}
.sidebar{
  overflow-y:auto;
  scrollbar-width:thin;
  overscroll-behavior:contain;
}
.sidebar nav{padding-bottom:18px}
.brandLogo{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:74px;
}
.brandLogo img{
  width:48px;
  height:48px;
  object-fit:cover;
  border-radius:15px;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 10px 28px rgba(0,0,0,.28);
}
.brandWords{
  display:grid;
  gap:1px;
  text-align:left;
}
.brandWords b{font:800 1.02rem Manrope}
.brandWords em{font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:#d9ab48;font-style:normal}

.topbar{
  gap:10px;
  min-width:0;
}
.topbar .search{min-width:180px;flex:1}
.themeSwitcher{flex:0 0 auto}

.hero{
  min-height:430px;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
}
.heroContent{max-width:760px}
.heroContent h1{font-size:clamp(2.6rem,5.4vw,5.5rem);line-height:.94}
.heroContent p{max-width:650px}

.homeUniverse{
  display:grid;
  grid-template-columns:1.3fr 1fr 1fr;
  gap:14px;
  margin:18px 0 10px;
}
.homeUniverseCard{
  min-height:180px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:14px;
  padding:20px;
  border:1px solid var(--line);
  border-radius:24px;
  background:var(--surface);
  box-shadow:var(--shadow-card);
}
.homeUniverseCard h2,.homeUniverseCard h3{margin:0 0 8px}
.homeUniverseCard p{margin:0;color:var(--muted);line-height:1.5}
.cinemaTonight{
  color:#fff;
  background:
    radial-gradient(circle at 85% 15%,rgba(255,198,76,.24),transparent 18rem),
    linear-gradient(135deg,#14151e,#090a0f);
}
.homeUniverseIcon{
  width:52px;height:52px;
  display:grid;place-items:center;
  border-radius:16px;
  background:var(--surface2);
  font-size:1.6rem;
}

.universeHeroGrid{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:18px;
}
.universePanel{
  min-height:470px;
  padding:24px;
  border:1px solid var(--line);
  border-radius:28px;
  background:var(--surface);
  box-shadow:var(--shadow-card);
}
.universePanelIcon{
  width:64px;height:64px;
  display:grid;place-items:center;
  margin-bottom:18px;
  border-radius:20px;
  background:var(--accent-grad);
  font-size:2rem;
  box-shadow:0 15px 35px rgba(139,109,255,.22);
}
.universePanel h2{font:800 2rem Manrope;letter-spacing:-.04em}
.universePanel>p{color:var(--muted);line-height:1.6}
.universeControls{display:grid;gap:10px}
.moodPicker{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:18px 0}
.moodPicker button{
  min-height:48px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--surface2);
  color:var(--text);
  font-weight:800;
}
.moodPicker button.active{color:#fff;border-color:transparent;background:var(--accent-grad)}
.tonightPanel>select,.tonightPanel>.primary{width:100%;margin-top:10px}

.rouletteResult{margin-top:18px}
.universeEmpty,.universeLoading{
  min-height:130px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:10px;
  border:1px dashed var(--line);
  border-radius:18px;
  color:var(--muted);
}
.universeEmpty{font-size:2rem}.universeEmpty span{font-size:.9rem}
.universeLoading span{
  width:34px;height:34px;
  border:3px solid var(--line);
  border-top-color:#9d7cff;
  border-radius:50%;
  animation:spin 1s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}
.rouletteMovie{
  display:grid;
  grid-template-columns:150px 1fr;
  gap:18px;
  align-items:center;
  padding:14px;
  border:1px solid var(--line);
  border-radius:20px;
  background:var(--surface2);
  cursor:pointer;
}
.rouletteMovie img{width:150px;aspect-ratio:2/3;object-fit:cover;border-radius:14px}
.rouletteMovie h3{font:800 1.5rem Manrope;margin:.4rem 0}
.rouletteMovie p{color:var(--muted);line-height:1.5;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.rouletteMovie strong{display:block;margin:8px 0 12px;color:#ffd166}

.achievementSummary{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-bottom:18px;
}
.achievementSummary article{
  padding:18px;
  border:1px solid var(--line);
  border-radius:20px;
  background:var(--surface);
}
.achievementSummary strong{display:block;font:800 2rem Manrope}
.achievementSummary span{color:var(--muted)}
.achievementsGrid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.achievementCard{
  display:grid;
  grid-template-columns:64px 1fr;
  gap:14px;
  min-height:160px;
  padding:18px;
  border:1px solid var(--line);
  border-radius:22px;
  background:var(--surface);
}
.achievementCard.locked{opacity:.5;filter:saturate(.35)}
.achievementCard.unlocked{border-color:rgba(255,196,76,.28);box-shadow:0 16px 44px rgba(201,144,38,.08)}
.achievementEmoji{
  width:60px;height:60px;
  display:grid;place-items:center;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(255,196,76,.18),rgba(139,109,255,.18));
  font-size:2rem;
}
.achievementCard h3{margin:5px 0;font:800 1.12rem Manrope}
.achievementCard p{margin:0;color:var(--muted);line-height:1.45}
.achievementCard small{display:block;margin-top:8px;color:#d7a642}

.quickNoteForm{
  display:grid;
  grid-template-columns:1fr auto auto;
  gap:10px;
  align-items:end;
  padding:16px;
  border:1px solid var(--line);
  border-radius:22px;
  background:var(--surface);
}
.quickNoteForm textarea{min-height:84px}
.quickNotesGrid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin-top:18px;
}
.quickNoteCard{
  min-height:170px;
  padding:18px;
  border:1px solid var(--line);
  border-radius:22px;
  background:var(--surface);
}
.quickNoteCard.pinned{
  background:linear-gradient(180deg,rgba(255,198,76,.08),transparent),var(--surface);
  border-color:rgba(255,198,76,.25);
}
.quickNoteTop{display:flex;justify-content:space-between;align-items:center}
.quickNoteTop button{
  width:30px;height:30px;
  border:1px solid var(--line);
  border-radius:9px;
  background:var(--surface2);
  color:var(--muted);
}
.quickNoteCard p{white-space:pre-wrap;line-height:1.6}
.quickNoteCard small{color:var(--muted)}

.backupGrid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.backupCard{
  min-height:250px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:18px;
  padding:22px;
  border:1px solid var(--line);
  border-radius:24px;
  background:var(--surface);
}
.backupCard>span{font-size:2.3rem}
.backupCard h3{font:800 1.35rem Manrope}
.backupCard p{color:var(--muted);line-height:1.55}
.savedSearchesPanel{
  margin-top:18px;
  padding:18px;
  border:1px solid var(--line);
  border-radius:22px;
  background:var(--surface);
}
#savedSearchForm{display:grid;grid-template-columns:1fr 1.5fr auto;gap:10px}
#savedSearchesList{display:grid;gap:8px;margin-top:14px}
.savedSearchItem{
  display:grid;
  grid-template-columns:1fr 36px;
  gap:8px;
}
.savedSearchItem>button:first-child{
  display:grid;
  grid-template-columns:34px 1fr;
  gap:10px;
  align-items:center;
  padding:12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--surface2);
  color:var(--text);
  text-align:left;
}
.savedSearchItem small{display:block;color:var(--muted);margin-top:3px}
.savedSearchItem>button:last-child{
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface2);
  color:var(--muted);
}

.quickActions{position:fixed;right:24px;bottom:24px;z-index:230}
.quickActionsBtn{
  width:58px;height:58px;
  border:0;
  border-radius:19px;
  background:var(--accent-grad);
  color:#fff;
  font-size:1.9rem;
  box-shadow:0 18px 44px rgba(110,83,255,.34);
  transition:transform .2s ease;
}
.quickActionsMenu{
  position:absolute;
  right:0;
  bottom:68px;
  width:230px;
  display:grid;
  gap:6px;
  padding:8px;
  border:1px solid var(--line);
  border-radius:18px;
  background:var(--surface);
  box-shadow:0 24px 70px rgba(0,0,0,.35);
  opacity:0;
  transform:translateY(10px) scale(.96);
  pointer-events:none;
  transition:.18s ease;
}
.quickActionsMenu.open{opacity:1;transform:none;pointer-events:auto}
.quickActionsMenu button{
  display:flex;
  gap:10px;
  align-items:center;
  padding:12px;
  border:0;
  border-radius:12px;
  background:transparent;
  color:var(--text);
  text-align:left;
}
.quickActionsMenu button:hover{background:var(--surface2)}

@media(max-width:1180px){
  .homeUniverse{grid-template-columns:1fr 1fr}
  .cinemaTonight{grid-column:1/-1}
  .universeHeroGrid{grid-template-columns:1fr}
  .achievementsGrid,.quickNotesGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .backupGrid{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  .themeSwitcher span{display:none}
  .topbar{padding-inline:12px}
  .hero{min-height:380px}
}
@media(max-width:760px){
  .sidebar{display:none}
  .app{margin-left:0!important;width:100%!important}
  main{padding-left:12px!important;padding-right:12px!important;padding-bottom:120px!important}
  .topbar{left:0!important;width:100%!important}
  .topbar .search{min-width:0}
  .topbar .iconBtn{flex:0 0 42px}
  .themeSwitcher{display:none}
  .hero{min-height:410px;border-radius:22px}
  .heroContent{padding:22px}
  .heroContent h1{font-size:clamp(2.25rem,12vw,4rem)}
  .heroContent .row{flex-wrap:wrap}
  .homeUniverse{grid-template-columns:1fr}
  .cinemaTonight{grid-column:auto}
  .homeUniverseCard{min-height:150px}
  .universePanel{min-height:0;padding:18px;border-radius:22px}
  .rouletteMovie{grid-template-columns:105px 1fr;gap:12px;padding:10px}
  .rouletteMovie img{width:105px}
  .rouletteMovie h3{font-size:1.1rem}
  .rouletteMovie p{-webkit-line-clamp:3;font-size:.78rem}
  .achievementSummary{grid-template-columns:1fr}
  .achievementsGrid,.quickNotesGrid,.backupGrid{grid-template-columns:1fr}
  .achievementCard{grid-template-columns:54px 1fr}
  .achievementEmoji{width:50px;height:50px}
  .quickNoteForm{grid-template-columns:1fr}
  #savedSearchForm{grid-template-columns:1fr}
  .quickActions{right:14px;bottom:calc(92px + env(safe-area-inset-bottom))}
  .quickActionsBtn{width:52px;height:52px;border-radius:17px}
  .quickActionsMenu{bottom:62px}
}
@media(max-width:420px){
  .mobileNav button small{font-size:.58rem}
  .rouletteMovie{grid-template-columns:88px 1fr}
  .rouletteMovie img{width:88px}
  .moodPicker{grid-template-columns:1fr}
}


/* =========================================================
   CINETRACK OMNIVERSE V15
   ========================================================= */
.seriesToolbar{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:18px}
.seriesToolbar>input{width:min(420px,100%)}
.seriesTabs{display:flex;gap:7px;flex-wrap:wrap}
.seriesTabs button,.countryPicker button{
  min-height:40px;padding:0 13px;border:1px solid var(--line);border-radius:999px;
  background:var(--surface);color:var(--muted);font-weight:800
}
.seriesTabs button.active,.countryPicker button.active{color:#fff;border-color:transparent;background:var(--accent-grad)}
.seriesGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px}
.seriesCard{overflow:hidden;border:1px solid var(--line);border-radius:22px;background:var(--surface);box-shadow:var(--shadow-card);cursor:pointer;transition:.24s ease}
.seriesCard:hover{transform:translateY(-6px);border-color:rgba(139,109,255,.35)}
.seriesCard>img{width:100%;aspect-ratio:2/3;object-fit:cover}
.seriesCardInfo{padding:13px}
.seriesCardInfo h3{margin:0 0 5px;font:800 1.02rem Manrope}
.seriesCardInfo p{margin:0;color:var(--muted)}
.seriesCardInfo span{display:inline-block;margin-top:8px;color:#ffd166;font-weight:800}
.seriesDetailHero{min-height:460px;display:grid;grid-template-columns:220px 1fr;gap:22px;align-items:end;padding:34px;background-size:cover;background-position:center;border-radius:22px}
.seriesDetailHero>img{width:220px;border-radius:18px}
.seriesDetailHero h1{font:800 clamp(2.1rem,5vw,4.5rem)/.95 Manrope}
.seriesFacts,.seriesListButtons{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.seriesFacts span{padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.08)}
.trailerLink{display:inline-flex;margin-top:8px}
.seriesDetailBody{padding:22px}
.castMiniGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(95px,1fr));gap:10px}
.castMiniGrid article{display:grid;gap:5px}
.castMiniGrid img{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:12px}
.castMiniGrid small{color:var(--muted)}

.trailersGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.trailerCard{overflow:hidden;border:1px solid var(--line);border-radius:22px;background:var(--surface)}
.trailerFrame{aspect-ratio:16/9;background:#000}
.trailerFrame iframe{width:100%;height:100%;border:0}
.trailerCard>div:last-child{padding:15px}
.trailerCard h3{margin:0 0 8px;font:800 1.25rem Manrope}
.trailerCard span{color:#ffd166;margin-right:10px}

.collectionSearchResults{display:grid;gap:8px;margin:12px 0}
.collectionSearchResults button{display:grid;grid-template-columns:52px 1fr;gap:12px;align-items:center;padding:8px;border:1px solid var(--line);border-radius:14px;background:var(--surface);color:var(--text);text-align:left}
.collectionSearchResults img{width:52px;height:76px;object-fit:cover;border-radius:9px}
.collectionHero{min-height:360px;display:flex;align-items:flex-end;padding:28px;margin:16px 0;border-radius:26px;background-size:cover;background-position:center}
.collectionHero h2{font:800 clamp(2rem,5vw,4.2rem)/.95 Manrope}
.collectionHero p{max-width:760px;color:#d7dbea;line-height:1.6}

.countryPicker{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}

.pollForm{display:grid;grid-template-columns:2fr 1fr 1fr 1fr auto;gap:10px;padding:16px;border:1px solid var(--line);border-radius:22px;background:var(--surface)}
.pollsGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:18px}
.pollCard{padding:20px;border:1px solid var(--line);border-radius:22px;background:var(--surface)}
.pollCard h3{font:800 1.35rem Manrope}
.pollOptions{display:grid;gap:8px;margin:14px 0}
.pollOptions button{position:relative;overflow:hidden;display:flex;justify-content:space-between;gap:10px;padding:12px;border:1px solid var(--line);border-radius:13px;background:var(--surface2);color:var(--text);text-align:left}
.pollOptions button i{position:absolute;inset:0 auto 0 0;z-index:0;background:rgba(139,109,255,.14)}
.pollOptions button span,.pollOptions button b{position:relative;z-index:1}
.pollOptions button.selected{border-color:#9d7cff}

.compatibilityBox{display:grid;grid-template-columns:1fr auto;gap:10px;padding:18px;border:1px solid var(--line);border-radius:22px;background:var(--surface)}
.compatibilityResultCard{display:grid;grid-template-columns:180px 1fr;gap:22px;align-items:center;margin-top:18px;padding:24px;border:1px solid var(--line);border-radius:26px;background:radial-gradient(circle at 15% 15%,rgba(255,79,120,.16),transparent 20rem),var(--surface)}
.compatibilityScore{width:160px;height:160px;display:grid;place-items:center;border-radius:50%;background:conic-gradient(#ff4f78,#8b6dff,#5f7cff,#ff4f78);color:#fff;font:900 2.6rem Manrope;box-shadow:inset 0 0 0 12px rgba(0,0,0,.22)}
.compatibilityResultCard h2{font:800 2rem Manrope}

.advancedSearchForm{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;padding:16px;border:1px solid var(--line);border-radius:22px;background:var(--surface)}
.advancedSearchForm button{grid-column:1/-1}

.heatmapPanel{margin:16px 0}
.activityHeatmap{display:grid;grid-template-rows:repeat(7,12px);grid-auto-flow:column;grid-auto-columns:12px;gap:4px;overflow-x:auto;padding-bottom:8px}
.activityHeatmap span{width:12px;height:12px;border-radius:3px;background:var(--surface2)}
.activityHeatmap span[data-level="1"]{background:rgba(139,109,255,.28)}
.activityHeatmap span[data-level="2"]{background:rgba(139,109,255,.5)}
.activityHeatmap span[data-level="3"]{background:rgba(139,109,255,.72)}
.activityHeatmap span[data-level="4"]{background:#8b6dff}

.restoreLabel{display:flex;align-items:center;justify-content:center;cursor:pointer}
.restoreLabel input{display:none}

@media(max-width:1180px){
  .pollForm{grid-template-columns:1fr 1fr}
  .pollForm input:first-child{grid-column:1/-1}
  .pollForm button{grid-column:1/-1}
  .advancedSearchForm{grid-template-columns:1fr 1fr}
}
@media(max-width:860px){
  .seriesToolbar{align-items:stretch;flex-direction:column}
  .seriesTabs{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}
  .seriesTabs button{flex:0 0 auto}
  .trailersGrid,.pollsGrid{grid-template-columns:1fr}
  .seriesDetailHero{grid-template-columns:150px 1fr;padding:20px}
  .seriesDetailHero>img{width:150px}
  .compatibilityResultCard{grid-template-columns:1fr;text-align:center}
  .compatibilityScore{margin:auto}
}
@media(max-width:760px){
  .seriesGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .seriesCard{border-radius:16px}
  .seriesCardInfo{padding:10px}
  .seriesDetailHero{grid-template-columns:1fr;align-items:end;min-height:560px}
  .seriesDetailHero>img{width:130px}
  .pollForm,.advancedSearchForm{grid-template-columns:1fr}
  .pollForm input:first-child,.pollForm button,.advancedSearchForm button{grid-column:auto}
  .compatibilityBox{grid-template-columns:1fr}
  .countryPicker{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}
  .countryPicker button{flex:0 0 auto}
  .activityHeatmap{grid-auto-columns:10px;grid-template-rows:repeat(7,10px);gap:3px}
  .activityHeatmap span{width:10px;height:10px}
}


/* GLOBAL SECURE V16 */
.securityAdminPanel{margin-top:26px}
.securityConfig{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0 24px}
.securityConfig article{padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}
.securityConfig span{display:block;color:var(--muted);font-size:.76rem;margin-bottom:6px}
.securityConfig strong{word-break:break-word}
.securityEvents{display:grid;gap:8px}
.securityEvents article{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.securityEvents article.success{border-left:4px solid #35c97a}
.securityEvents article.failure{border-left:4px solid #ff5f78}
.securityEvents p{margin:4px 0 0;color:var(--muted)}
.securityEvents time,.securityEvents small{display:block;color:var(--muted);text-align:right}
@media(max-width:900px){.securityConfig{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.securityConfig{grid-template-columns:1fr}.securityEvents article{grid-template-columns:1fr}.securityEvents time,.securityEvents small{text-align:left}}


/* =========================================================
   CINETRACK CINETOK V17
   ========================================================= */
.cineTokPage{
  padding:0!important;
  max-width:none!important;
  overflow:hidden;
}
.cineTokTopbar{
  position:sticky;
  top:74px;
  z-index:45;
  min-height:58px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  padding:8px 18px;
  background:linear-gradient(to bottom,var(--bg) 70%,transparent);
  backdrop-filter:blur(14px);
}
.cineTokTabs{
  display:flex;
  gap:5px;
  padding:4px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(12,13,19,.72);
}
[data-theme="light"] .cineTokTabs{background:rgba(255,255,255,.78)}
.cineTokTabs button{
  min-height:38px;
  padding:0 16px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:var(--muted);
  font-weight:850;
}
.cineTokTabs button.active{
  color:var(--text);
  background:var(--surface2);
  box-shadow:0 7px 20px rgba(0,0,0,.12);
}
.cineTokFeed{
  height:calc(100vh - 132px);
  overflow-y:auto;
  overscroll-behavior-y:contain;
  scroll-snap-type:y mandatory;
  scrollbar-width:none;
  background:#000;
}
.cineTokFeed::-webkit-scrollbar{display:none}
.cineTokCard{
  position:relative;
  width:min(100%,760px);
  height:calc(100vh - 132px);
  min-height:600px;
  margin:0 auto;
  overflow:hidden;
  scroll-snap-align:start;
  scroll-snap-stop:always;
  background:#050506;
  isolation:isolate;
}
.cineTokVideo{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  background:#000;
}
.cineTokGradient{
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:
    linear-gradient(to top,rgba(0,0,0,.88) 0,rgba(0,0,0,.25) 34%,transparent 55%),
    linear-gradient(to bottom,rgba(0,0,0,.34),transparent 18%);
}
.cineTokMeta{
  position:absolute;
  z-index:5;
  left:20px;
  right:104px;
  bottom:24px;
  color:#fff;
  text-shadow:0 2px 12px rgba(0,0,0,.55);
}
.cineTokCreator{
  display:inline-flex;
  align-items:center;
  gap:9px;
  margin-bottom:10px;
  padding:0;
  border:0;
  background:transparent;
  color:#fff;
}
.cineTokAvatar{
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:2px solid rgba(255,255,255,.88);
  border-radius:50%;
  background:var(--accent-grad);
  font-weight:900;
}
.cineTokAvatar img{width:100%;height:100%;object-fit:cover}
.cineTokMeta h2{
  margin:0 0 8px;
  font:850 clamp(1.3rem,3vw,2rem)/1 Manrope;
  letter-spacing:-.04em;
}
.cineTokMeta p{
  margin:0 0 10px;
  line-height:1.5;
  color:#f2f3f6;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.cineTokMovieTag{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 10px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  background:rgba(10,11,16,.48);
  color:#fff;
  backdrop-filter:blur(10px);
}
.cineTokTags{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}
.cineTokTags span{color:#fff;font-size:.78rem;font-weight:800}
.cineTokActions{
  position:absolute;
  z-index:6;
  right:18px;
  bottom:22px;
  display:grid;
  gap:10px;
  justify-items:center;
}
.cineTokAction,.cineTokFollow{
  border:0;
  color:#fff;
  background:transparent;
}
.cineTokAction{
  width:62px;
  display:grid;
  place-items:center;
  gap:4px;
}
.cineTokAction>span{
  width:52px;
  height:52px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.15);
  border-radius:50%;
  background:rgba(15,16,22,.55);
  backdrop-filter:blur(14px);
  font-size:1.35rem;
  box-shadow:0 10px 28px rgba(0,0,0,.2);
}
.cineTokAction small{
  max-width:64px;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:.67rem;
  font-weight:800;
  text-shadow:0 2px 8px #000;
}
.cineTokAction.active>span{
  color:#fff;
  background:linear-gradient(135deg,#ff3f6c,#ff6b8d);
  border-color:transparent;
}
.cineTokFollow{
  width:44px;
  height:44px;
  border:2px solid #fff;
  border-radius:50%;
  background:linear-gradient(135deg,#ff3f6c,#8b6dff);
  font-size:1.3rem;
  font-weight:900;
}
.cineTokFollow.following{background:#1e2130}
.cineTokSound{
  position:absolute;
  z-index:7;
  top:18px;
  right:18px;
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:50%;
  background:rgba(10,11,16,.48);
  color:#fff;
  backdrop-filter:blur(12px);
}
.cineTokEmpty{
  min-height:70vh;
  display:grid;
  place-items:center;
  align-content:center;
  gap:8px;
  text-align:center;
}
.cineTokEmpty strong{font:850 1.5rem Manrope}
.cineTokEmpty span{color:var(--muted)}

.cineTokUploadCard{width:min(720px,calc(100vw - 24px))}
.cineTokUploadTabs{
  display:flex;
  gap:6px;
  margin:12px 0;
  padding:4px;
  border-radius:14px;
  background:var(--surface2);
}
.cineTokUploadTabs button{
  flex:1;
  min-height:40px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:var(--muted);
  font-weight:800;
}
.cineTokUploadTabs button.active{background:var(--surface);color:var(--text);box-shadow:0 5px 14px rgba(0,0,0,.1)}
#cineTokUploadForm{display:grid;gap:10px}
.videoDropZone{
  min-height:190px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:7px;
  padding:18px;
  border:2px dashed var(--line);
  border-radius:20px;
  background:var(--surface2);
  cursor:pointer;
  text-align:center;
}
.videoDropZone:hover{border-color:#8b6dff}
.videoDropZone input{display:none}
.videoDropZone>span{font-size:2.3rem}
.videoDropZone small{color:var(--muted)}
.cineTokFormGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.cineTokUploadProgress{
  height:8px;
  overflow:hidden;
  border-radius:999px;
  background:var(--surface2);
}
.cineTokUploadProgress span{
  display:block;
  width:0;
  height:100%;
  border-radius:inherit;
  background:var(--accent-grad);
  transition:width .2s;
}

.cineTokCommentsDrawer{
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  z-index:650;
  width:min(430px,100vw);
  display:grid;
  grid-template-rows:auto 1fr auto;
  border-left:1px solid var(--line);
  background:var(--surface);
  box-shadow:-25px 0 80px rgba(0,0,0,.38);
  transform:translateX(102%);
  transition:transform .24s ease;
}
.cineTokCommentsDrawer.open{transform:none}
.cineTokCommentsDrawer header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:18px;
  border-bottom:1px solid var(--line);
}
.cineTokCommentsDrawer header h3{margin:3px 0 0}
.cineTokCommentsDrawer header button{
  width:38px;
  height:38px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface2);
  color:var(--text);
}
.cineTokCommentsList{
  overflow-y:auto;
  padding:12px 16px;
}
.cineTokComment{
  display:grid;
  grid-template-columns:40px 1fr;
  gap:10px;
  padding:12px 0;
  border-bottom:1px solid var(--line);
}
.cineTokComment p{margin:4px 0 6px;line-height:1.5}
.cineTokComment small{color:var(--muted)}
#cineTokCommentForm{
  display:grid;
  grid-template-columns:1fr auto;
  gap:8px;
  padding:12px;
  border-top:1px solid var(--line);
  background:var(--surface);
}

@media(max-width:900px){
  .cineTokTopbar{top:66px}
  .cineTokFeed,.cineTokCard{height:calc(100vh - 124px)}
}
@media(max-width:760px){
  .cineTokPage{
    margin-left:-12px!important;
    margin-right:-12px!important;
    width:calc(100% + 24px)!important;
  }
  .cineTokTopbar{
    top:64px;
    min-height:54px;
    padding:6px 10px;
    justify-content:space-between;
  }
  .cineTokTopbar>.primary{padding-inline:12px;min-height:40px}
  .cineTokTabs{overflow-x:auto;scrollbar-width:none}
  .cineTokTabs button{padding-inline:12px;white-space:nowrap}
  .cineTokFeed,.cineTokCard{
    height:calc(100dvh - 184px);
    min-height:520px;
  }
  .cineTokCard{width:100%}
  .cineTokMeta{
    left:14px;
    right:86px;
    bottom:16px;
  }
  .cineTokActions{right:8px;bottom:14px;gap:7px}
  .cineTokAction{width:58px}
  .cineTokAction>span{width:46px;height:46px;font-size:1.15rem}
  .cineTokFollow{width:40px;height:40px}
  .cineTokSound{top:12px;right:10px;width:38px;height:38px}
  .cineTokMeta h2{font-size:1.18rem}
  .cineTokMeta p{font-size:.84rem;-webkit-line-clamp:2}
  .cineTokCreator{margin-bottom:7px}
  .cineTokAvatar{width:34px;height:34px}
  .cineTokFormGrid{grid-template-columns:1fr}
  .videoDropZone{min-height:150px}
}
@media(max-width:390px){
  .cineTokTabs button{padding-inline:9px;font-size:.78rem}
  .cineTokTopbar>.primary{font-size:.75rem}
  .cineTokMeta{right:76px}
  .cineTokAction{width:50px}
  .cineTokAction>span{width:42px;height:42px}
}

.cineTokAdminPanel{margin-top:28px}
.cineTokAdminList{display:grid;gap:8px}
.cineTokAdminList article{display:grid;grid-template-columns:1fr 170px;gap:14px;align-items:center;padding:13px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.cineTokAdminList p{margin:5px 0 0;color:var(--muted)}
@media(max-width:760px){.cineTokAdminList article{grid-template-columns:1fr}}

.syntheticBadge{
  display:inline-flex;
  align-items:center;
  min-height:20px;
  padding:0 7px;
  margin-left:5px;
  border-radius:999px;
  font-size:.62rem;
  font-weight:900;
  letter-spacing:.06em;
  vertical-align:middle;
}
.syntheticBadge.bot{
  color:#c9f3ff;
  background:rgba(42,165,220,.16);
  border:1px solid rgba(42,165,220,.34);
}
.syntheticBadge.tester{
  color:#efe1ff;
  background:rgba(151,91,255,.16);
  border:1px solid rgba(151,91,255,.34);
}


/* =========================================================
   V17.3 — CORRECTION MISE EN PAGE DES CRITIQUES
   ========================================================= */

/* Le poster faisait 86 px alors que la colonne restait à 60 px :
   cela faisait passer le titre et le texte sous l'image. */
.feedGrid{
  align-items:stretch;
}

.feedGrid .reviewCard{
  min-width:0;
  height:100%;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

.feedGrid .reviewHead{
  min-width:0;
  align-items:center;
}

.feedGrid .reviewHead .person{
  min-width:0;
  flex:1 1 auto;
}

.feedGrid .reviewHead .person button{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-align:left;
}

.feedGrid .reviewHead .stars{
  flex:0 0 auto;
  white-space:nowrap;
  letter-spacing:1px;
}

.feedGrid .reviewMovie{
  display:grid;
  grid-template-columns:86px minmax(0,1fr);
  align-items:start;
  gap:16px;
  width:100%;
  min-width:0;
  margin:18px 0;
}

.feedGrid .reviewMovie img{
  display:block;
  width:86px;
  height:124px;
  max-width:none;
  object-fit:cover;
  border-radius:14px;
  flex:none;
}

.feedGrid .reviewMovie > div{
  min-width:0;
  width:100%;
}

.feedGrid .reviewMovie b{
  display:block;
  margin:1px 0 10px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:1rem;
  line-height:1.3;
}

.feedGrid .reviewMovie p{
  margin:0;
  min-width:0;
  color:var(--muted);
  line-height:1.55;
  overflow-wrap:anywhere;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  overflow:hidden;
}

.feedGrid .reviewActions{
  margin-top:auto;
  padding-top:4px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.feedGrid .reviewActions button{
  flex:0 0 auto;
  min-width:42px;
  min-height:38px;
}

/* Tablettes : deux cartes larges au lieu de trois cartes tassées. */
@media (max-width:1250px){
  .feedGrid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* Petits écrans : une seule carte. */
@media (max-width:760px){
  .feedGrid{
    grid-template-columns:1fr;
  }

  .feedGrid .reviewMovie{
    grid-template-columns:72px minmax(0,1fr);
    gap:12px;
  }

  .feedGrid .reviewMovie img{
    width:72px;
    height:104px;
    border-radius:12px;
  }

  .feedGrid .reviewMovie p{
    -webkit-line-clamp:4;
  }

  .feedGrid .reviewHead{
    align-items:flex-start;
  }

  .feedGrid .reviewHead .stars{
    font-size:.72rem;
  }
}

@media (max-width:420px){
  .feedGrid .reviewCard{
    padding:13px;
  }

  .feedGrid .reviewMovie{
    grid-template-columns:64px minmax(0,1fr);
  }

  .feedGrid .reviewMovie img{
    width:64px;
    height:94px;
  }
}


/* =========================================================
   V17.4 — NOTIFICATION DE BIENVENUE
   ========================================================= */
.welcomeNotification{
  display:grid!important;
  grid-template-columns:64px minmax(0,1fr)!important;
  gap:18px!important;
  padding:24px!important;
  border:1px solid rgba(151,91,255,.28)!important;
  border-radius:24px!important;
  background:
    radial-gradient(circle at 8% 10%,rgba(151,91,255,.16),transparent 24rem),
    radial-gradient(circle at 90% 90%,rgba(255,79,120,.12),transparent 28rem),
    var(--surface)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.18);
}
.welcomeNotification.unread{
  border-color:rgba(151,91,255,.55)!important;
}
.welcomeNotifIcon{
  width:64px;
  height:64px;
  display:grid;
  place-items:center;
  border-radius:20px;
  background:linear-gradient(135deg,#8f63ff,#ff4f78);
  font-size:2rem;
  box-shadow:0 14px 32px rgba(139,109,255,.28);
}
.welcomeNotifBody{min-width:0}
.welcomeNotifBody h2{
  margin:5px 0 8px;
  font:850 clamp(1.45rem,3vw,2.15rem)/1 Manrope;
  letter-spacing:-.04em;
}
.welcomeNotifBody>p{
  margin:0 0 18px;
  color:var(--muted);
  line-height:1.6;
}
.welcomeNotifGrid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.welcomeNotifGrid button{
  min-width:0;
  min-height:110px;
  display:grid;
  align-content:center;
  justify-items:start;
  gap:5px;
  padding:14px;
  text-align:left;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--surface2);
  color:var(--text);
  transition:.2s ease;
}
.welcomeNotifGrid button:hover{
  transform:translateY(-3px);
  border-color:rgba(151,91,255,.5);
}
.welcomeNotifGrid button>span{font-size:1.45rem}
.welcomeNotifGrid button>b{font-size:.9rem}
.welcomeNotifGrid button>small{
  color:var(--muted);
  line-height:1.35;
}
.welcomeNotifTips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:16px 0;
  padding:14px;
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(255,255,255,.025);
}
.welcomeNotifTips strong{width:100%}
.welcomeNotifTips span{
  padding:7px 9px;
  border-radius:999px;
  background:var(--surface2);
  color:var(--muted);
  font-size:.78rem;
}
.welcomeNotifActions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:16px;
}
.welcomeNotifDate{
  display:block;
  margin-top:14px;
  color:var(--muted);
}

@media(max-width:820px){
  .welcomeNotifGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .welcomeNotification{
    grid-template-columns:1fr!important;
    padding:18px!important;
  }
  .welcomeNotifIcon{
    width:54px;
    height:54px;
    border-radius:17px;
  }
  .welcomeNotifGrid{grid-template-columns:1fr 1fr}
  .welcomeNotifGrid button{min-height:100px;padding:12px}
  .welcomeNotifActions{display:grid}
}
@media(max-width:420px){
  .welcomeNotifGrid{grid-template-columns:1fr}
}


/* =========================================================
   CINETRAK FINAL — AUTHENTIFICATION GOOGLE + COMPTE LOCAL
   ========================================================= */
.finalAuthCard{
  width:min(520px,100%);
  padding:30px;
}
.authWelcome{text-align:center;margin-bottom:18px}
.authWelcome h2{
  margin:6px 0 8px;
  font:850 clamp(1.7rem,4vw,2.4rem)/1 Manrope;
  letter-spacing:-.05em;
}
.authWelcome p{margin:0;color:var(--muted)}
.googleAuthArea{
  display:grid;
  justify-items:center;
  gap:8px;
  min-height:48px;
}
.googleAuthArea.googleDisabled{display:none}
#googleSignInButton{
  width:min(360px,100%);
  min-height:44px;
  display:flex;
  justify-content:center;
}
.googleAuthStatus{
  min-height:18px;
  color:var(--muted);
  font-size:.78rem;
  text-align:center;
}
.authDivider{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:12px;
  align-items:center;
  margin:16px 0;
  color:var(--muted);
  font-size:.75rem;
}
.authDivider:before,.authDivider:after{
  content:"";
  height:1px;
  background:var(--line);
}
.finalAuthCard .authTabs{margin-bottom:16px}
.finalAuthCard form h3{margin:4px 0 12px}
@media(max-width:560px){
  .finalAuthCard{padding:22px 16px}
}


/* =========================================================
   CINETRAK V19 — PAGE PUBLIQUE POUR CHAQUE UTILISATEUR
   URL : /@pseudo
   ========================================================= */
#page-profile{padding-top:0}
.publicProfileShell{max-width:1180px;margin:0 auto 60px}
.publicProfileCover{
  position:relative;
  min-height:270px;
  border-radius:0 0 32px 32px;
  background:
    radial-gradient(circle at 20% 30%,rgba(132,93,255,.55),transparent 34%),
    radial-gradient(circle at 80% 60%,rgba(255,72,124,.38),transparent 38%),
    linear-gradient(135deg,#151527,#090a11);
  background-size:cover;
  background-position:center;
  overflow:hidden;
}
.publicProfileCoverShade{
  position:absolute;inset:0;
  background:linear-gradient(to bottom,transparent 35%,rgba(8,9,15,.78));
}
.publicProfileHeader{
  position:relative;
  display:grid;
  grid-template-columns:150px minmax(0,1fr) auto;
  gap:24px;
  align-items:end;
  margin:-78px 28px 0;
}
.publicProfileAvatar{
  width:150px;height:150px;
  display:grid;place-items:center;
  overflow:hidden;
  border:5px solid var(--bg);
  border-radius:34px;
  background:linear-gradient(135deg,#8f63ff,#ff4f78);
  box-shadow:0 24px 60px rgba(0,0,0,.38);
  font-size:3.6rem;font-weight:900;
}
.publicProfileAvatar img{width:100%;height:100%;object-fit:cover}
.publicProfileIdentity{min-width:0;padding-bottom:4px}
.publicProfileNameLine{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.publicProfileNameLine h1{
  margin:0;
  font:900 clamp(2rem,5vw,3.7rem)/.94 Manrope;
  letter-spacing:-.06em;
}
.verifiedMark{
  width:25px;height:25px;display:grid;place-items:center;
  border-radius:50%;background:#3b82f6;color:white;font-weight:900
}
.publicProfileIdentity>strong{display:block;margin-top:7px;color:var(--muted)}
.publicProfileIdentity>p{max-width:720px;margin:12px 0 0;line-height:1.65}
.publicProfileMeta{display:flex;flex-wrap:wrap;gap:8px;margin-top:13px}
.publicProfileMeta span{
  padding:7px 10px;border:1px solid var(--line);
  border-radius:999px;background:var(--surface2);color:var(--muted);font-size:.78rem
}
.publicProfileActions{display:flex;gap:8px;align-items:center;justify-content:flex-end;padding-bottom:8px;flex-wrap:wrap}
.iconOnly{min-width:44px}
.publicProfileStats{
  display:grid;grid-template-columns:repeat(5,1fr);
  gap:10px;margin:26px 28px 0;
}
.publicProfileStats>div,.publicProfileStats>button{
  min-width:0;padding:18px 12px;
  border:1px solid var(--line);border-radius:18px;
  background:var(--surface);color:var(--text);text-align:center
}
.publicProfileStats>button{cursor:pointer}
.publicProfileStats>button:hover{border-color:rgba(143,99,255,.55);transform:translateY(-2px)}
.publicProfileStats strong{display:block;font-size:1.55rem}
.publicProfileStats span{display:block;margin-top:4px;color:var(--muted);font-size:.76rem}
.publicProfileBadges{display:flex;gap:8px;flex-wrap:wrap;margin:16px 28px 0}
.publicProfileBadge{padding:8px 11px;border:1px solid var(--line);border-radius:999px;background:var(--surface2);font-size:.8rem}
.publicProfileTabs{
  position:sticky;top:10px;z-index:8;
  display:flex;gap:8px;overflow:auto;
  margin:26px 28px 0;padding:8px;
  border:1px solid var(--line);border-radius:18px;
  background:color-mix(in srgb,var(--bg) 88%,transparent);
  backdrop-filter:blur(18px)
}
.publicProfileTabs button{
  flex:1;min-width:max-content;padding:11px 16px;border:0;border-radius:12px;
  background:transparent;color:var(--muted);font-weight:800
}
.publicProfileTabs button.active{background:var(--surface2);color:var(--text)}
.publicProfileTab{display:none;margin:28px}
.publicProfileTab.active{display:block}
.profileSectionTitle{display:flex;justify-content:space-between;align-items:end;margin-bottom:16px}
.profileSectionTitle h2{margin:4px 0 0}
.profilePosterGrid{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:12px}
.profilePoster{
  min-width:0;padding:0;border:0;background:transparent;color:var(--text);text-align:left
}
.profilePoster img{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:14px;background:var(--surface2)}
.profilePoster span{display:block;margin-top:7px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.78rem}
.profileVideoGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.profileVideoCard{overflow:hidden;border:1px solid var(--line);border-radius:18px;background:var(--surface)}
.profileVideoCard video{width:100%;aspect-ratio:9/14;object-fit:cover;background:#050507}
.profileVideoCard>div{display:grid;gap:4px;padding:12px}
.profileVideoCard small{color:var(--muted)}
.publicListsGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.publicListCard{
  display:flex;gap:14px;align-items:flex-start;padding:18px;
  border:1px solid var(--line);border-radius:18px;background:var(--surface)
}
.publicListCard>span{font-size:1.7rem}.publicListCard h3{margin:0 0 6px}.publicListCard p{margin:0;color:var(--muted)}
.profileEmpty{padding:28px;border:1px dashed var(--line);border-radius:18px;color:var(--muted);text-align:center}
.profileSocialList{margin:30px 28px;padding:22px;border:1px solid var(--line);border-radius:24px;background:var(--surface)}
.profileSocialHead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.profileSocialHead h2{margin:0}
.profileRouteError{max-width:650px;margin:80px auto;padding:35px;text-align:center;border:1px solid var(--line);border-radius:24px;background:var(--surface)}

@media(max-width:1100px){
  .publicProfileHeader{grid-template-columns:120px minmax(0,1fr)}
  .publicProfileAvatar{width:120px;height:120px;border-radius:28px}
  .publicProfileActions{grid-column:1/-1;justify-content:flex-start}
  .profilePosterGrid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .profileVideoGrid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
  .publicProfileCover{min-height:210px;border-radius:0 0 24px 24px}
  .publicProfileHeader{grid-template-columns:88px minmax(0,1fr);gap:14px;margin:-48px 16px 0}
  .publicProfileAvatar{width:88px;height:88px;border-width:4px;border-radius:24px;font-size:2.3rem}
  .publicProfileNameLine h1{font-size:clamp(1.65rem,8vw,2.4rem)}
  .publicProfileIdentity>p{grid-column:1/-1}
  .publicProfileActions{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .publicProfileStats{grid-template-columns:repeat(3,1fr);margin:22px 16px 0}
  .publicProfileBadges,.publicProfileTabs,.publicProfileTab,.profileSocialList{margin-left:16px;margin-right:16px}
  .profilePosterGrid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .profileVideoGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .publicListsGrid{grid-template-columns:1fr}
}
@media(max-width:440px){
  .publicProfileHeader{grid-template-columns:72px minmax(0,1fr)}
  .publicProfileAvatar{width:72px;height:72px;border-radius:20px}
  .publicProfileStats{grid-template-columns:repeat(2,1fr)}
  .profileVideoGrid{grid-template-columns:1fr 1fr}
}


/* =========================================================
   CINETRAK V19.1 — CORRECTION DES CARTES DE CRITIQUES
   Affiche à gauche, texte à droite, aucune superposition
   ========================================================= */
.feedColumn{
  width:100%;
  max-width:820px;
}

.feedColumn .reviewCard{
  width:100%;
  min-width:0;
  display:flex;
  flex-direction:column;
  padding:18px;
  overflow:hidden;
}

.feedColumn .reviewHead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  min-width:0;
}

.feedColumn .reviewHead .person{
  min-width:0;
  flex:1 1 auto;
}

.feedColumn .reviewHead .person button{
  min-width:0;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-align:left;
}

.feedColumn .reviewHead .stars{
  flex:0 0 auto;
  white-space:nowrap;
  letter-spacing:1px;
}

.feedColumn .reviewMovie{
  width:100%;
  min-width:0;
  display:grid;
  grid-template-columns:86px minmax(0,1fr);
  align-items:start;
  gap:16px;
  margin:18px 0;
}

.feedColumn .reviewMovie > img{
  display:block;
  width:86px;
  height:124px;
  min-width:86px;
  max-width:86px;
  object-fit:cover;
  border-radius:14px;
}

.feedColumn .reviewMovie > div{
  width:100%;
  min-width:0;
  padding:2px 0;
}

.feedColumn .reviewMovie b{
  display:block;
  max-width:100%;
  margin:0 0 10px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:1rem;
  line-height:1.35;
}

.feedColumn .reviewMovie p{
  width:100%;
  min-width:0;
  margin:0;
  color:var(--muted);
  line-height:1.6;
  overflow-wrap:anywhere;
  word-break:normal;
}

.feedColumn .reviewActions{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:auto;
}

.feedColumn .reviewActions button{
  flex:0 0 auto;
  min-width:43px;
  min-height:38px;
}

/* Profil public : les critiques utilisent aussi une colonne propre. */
#profileReviews.feedColumn{
  max-width:none;
}

@media(max-width:760px){
  .feedColumn .reviewCard{
    padding:14px;
  }

  .feedColumn .reviewHead{
    align-items:flex-start;
    gap:10px;
  }

  .feedColumn .reviewHead .stars{
    font-size:.75rem;
  }

  .feedColumn .reviewMovie{
    grid-template-columns:72px minmax(0,1fr);
    gap:12px;
    margin:14px 0;
  }

  .feedColumn .reviewMovie > img{
    width:72px;
    height:104px;
    min-width:72px;
    max-width:72px;
    border-radius:12px;
  }

  .feedColumn .reviewMovie p{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:4;
    overflow:hidden;
  }

  .feedColumn .reviewActions{
    flex-wrap:nowrap;
    overflow-x:auto;
    padding-bottom:2px;
    scrollbar-width:none;
  }

  .feedColumn .reviewActions::-webkit-scrollbar{
    display:none;
  }
}

@media(max-width:420px){
  .feedColumn .reviewMovie{
    grid-template-columns:64px minmax(0,1fr);
  }

  .feedColumn .reviewMovie > img{
    width:64px;
    height:94px;
    min-width:64px;
    max-width:64px;
  }
}


/* =========================================================
   CINETRAK V19.2 — COMPATIBILITÉ ORDINATEUR / ANDROID /
   IPHONE / IPAD / TABLETTES / PWA
   ========================================================= */

html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  scroll-behavior:smooth;
}

html,body{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
}

body{
  min-height:100dvh;
  min-height:-webkit-fill-available;
  padding-top:env(safe-area-inset-top);
  padding-left:env(safe-area-inset-left);
  padding-right:env(safe-area-inset-right);
  -webkit-tap-highlight-color:transparent;
  overscroll-behavior-y:none;
}

img,video,canvas,svg{
  max-width:100%;
}

img,video{
  height:auto;
}

button,input,select,textarea{
  font:inherit;
}

button,
a,
input[type="button"],
input[type="submit"]{
  touch-action:manipulation;
}

input,select,textarea{
  max-width:100%;
  font-size:16px;
}

/* Évite le zoom automatique des formulaires sur iPhone. */
@supports (-webkit-touch-callout:none){
  input,select,textarea{
    font-size:16px!important;
  }
}

/* Zones tactiles confortables. */
button,
.mobileNav button,
.sidebar nav button{
  min-height:44px;
}

.close{
  min-width:44px;
  min-height:44px;
}

/* Contenu principal toujours contenu dans la largeur de l'écran. */
.app,
main,
.page,
.hero,
.content,
.section,
.feedGrid,
.feedColumn,
.movieGrid,
.peopleGrid,
.profileVideoGrid,
.publicListsGrid{
  min-width:0;
  max-width:100%;
}

/* Safe areas iPhone avec encoche / Dynamic Island. */
.sidebar{
  padding-top:max(16px,env(safe-area-inset-top));
  padding-bottom:max(16px,env(safe-area-inset-bottom));
}

.mobileNav{
  padding-bottom:max(8px,env(safe-area-inset-bottom));
}

/* Les modales restent utilisables même avec petit écran ou clavier mobile. */
.modal{
  min-height:100dvh;
  padding:
    max(14px,env(safe-area-inset-top))
    max(14px,env(safe-area-inset-right))
    max(14px,env(safe-area-inset-bottom))
    max(14px,env(safe-area-inset-left));
}

.modalCard{
  max-height:calc(100dvh - 28px);
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}

/* CineTok : vraie hauteur de viewport mobile, même avec Safari iOS. */
.cineTokShell,
.cineTokFeed,
.cineTokSlide{
  min-height:100dvh;
}

.cineTokSlide{
  height:100dvh;
  max-height:100dvh;
}

.cineTokSlide video{
  width:100%;
  height:100%;
  object-fit:cover;
}

/* Tablettes larges. */
@media (max-width:1180px){
  main{
    padding-left:clamp(16px,3vw,28px);
    padding-right:clamp(16px,3vw,28px);
  }

  .movieGrid{
    grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
  }

  .peopleGrid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* Téléphones et petites tablettes. */
@media (max-width:760px){
  body{
    padding-bottom:calc(78px + env(safe-area-inset-bottom));
  }

  main{
    width:100%;
    padding-left:14px;
    padding-right:14px;
  }

  .page{
    width:100%;
  }

  .hero{
    min-height:auto;
    border-radius:22px;
  }

  .hero h1,
  .pageTitle h1{
    overflow-wrap:anywhere;
  }

  .movieGrid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }

  .movieCard{
    min-width:0;
  }

  .movieCard img{
    width:100%;
    aspect-ratio:2/3;
    object-fit:cover;
  }

  .peopleGrid{
    grid-template-columns:1fr;
  }

  .modal{
    padding:0;
  }

  .modalCard{
    width:100%;
    min-height:100dvh;
    max-height:100dvh;
    margin:0;
    border-radius:0;
    padding-bottom:env(safe-area-inset-bottom);
  }

  .authCard.finalAuthCard{
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:100dvh;
    padding:
      max(24px,env(safe-area-inset-top))
      18px
      max(24px,env(safe-area-inset-bottom));
  }

  .detailBody{
    grid-template-columns:1fr;
    padding:18px;
    margin-top:-48px;
  }

  .detailPoster{
    width:min(180px,52vw);
    margin:0 auto;
  }

  .detailInfo{
    padding-top:0;
  }

  .detailInfo h2{
    font-size:clamp(2rem,10vw,3rem);
  }

  .publicProfileShell{
    width:100%;
  }

  .publicProfileHeader{
    align-items:start;
  }

  .publicProfileIdentity{
    min-width:0;
  }

  .publicProfileIdentity p,
  .publicProfileMeta{
    grid-column:1/-1;
  }

  .publicProfileActions button{
    width:100%;
  }

  .publicProfileTabs{
    top:max(8px,env(safe-area-inset-top));
  }

  .profilePosterGrid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .profileVideoGrid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .reviewActions button{
    min-width:44px;
    min-height:44px;
  }

  .welcomeNotifGrid{
    grid-template-columns:1fr 1fr;
  }

  .welcomeNotifGrid button{
    min-height:112px;
  }
}

/* Très petits téléphones : iPhone SE et Android compacts. */
@media (max-width:390px){
  main{
    padding-left:10px;
    padding-right:10px;
  }

  .movieGrid{
    gap:9px;
  }

  .movieCard h3,
  .movieCard b{
    font-size:.86rem;
  }

  .publicProfileStats{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .profilePosterGrid{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
  }

  .welcomeNotifGrid{
    grid-template-columns:1fr;
  }

  .authWelcome h2{
    font-size:1.8rem;
  }
}

/* Paysage sur téléphone. */
@media (max-height:520px) and (orientation:landscape){
  .modalCard{
    min-height:100dvh;
  }

  .finalAuthCard{
    justify-content:flex-start!important;
  }

  .cineTokSlide{
    height:100dvh;
  }
}

/* iPad / tablettes tactiles : interface plus confortable sans hover. */
@media (hover:none) and (pointer:coarse){
  .movieCard:hover img,
  .reviewCard:hover,
  .personCard:hover{
    transform:none!important;
  }

  button,
  .movieCard,
  .profilePoster{
    cursor:default;
  }
}

/* Réduction des animations si l'utilisateur le demande. */
@media (prefers-reduced-motion:reduce){
  *,
  *::before,
  *::after{
    scroll-behavior:auto!important;
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
  }
}

/* Mode standalone PWA : espace supplémentaire pour les safe areas. */
@media (display-mode:standalone){
  body{
    padding-bottom:max(env(safe-area-inset-bottom),8px);
  }
}


/* =========================================================
   CINETRAK V21 — PROTECTION CONTRE LES INTERFACES BLOQUÉES
   ========================================================= */
.pageLoader.hidden{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

.pageLoader{
  transition:opacity .25s ease,visibility .25s ease;
}

.sidebar,
.topbar,
.mobileNav,
main{
  pointer-events:auto;
}

.page.active{
  pointer-events:auto;
}

button,[data-page],.movieCard,.profilePoster{
  pointer-events:auto;
}


/* =========================================================
   CINETRAK V22 — NAVIGATION TOUJOURS CLIQUABLE
   ========================================================= */

/* Le loader est purement visuel et ne peut jamais intercepter un clic. */
#pageLoader{
  pointer-events:none!important;
}

#pageLoader.hidden{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* Les contrôles de navigation restent au-dessus du contenu. */
.sidebar{
  pointer-events:auto!important;
  z-index:80!important;
}

.sidebar nav,
.sidebar [data-page],
.mobileNav,
.mobileNav [data-page]{
  pointer-events:auto!important;
  position:relative;
}

.sidebar [data-page],
.mobileNav [data-page]{
  cursor:pointer!important;
  user-select:none;
  -webkit-user-select:none;
  touch-action:manipulation;
}

/* État visible immédiat, même sans app.js. */
.sidebar [data-page].active,
.mobileNav [data-page].active{
  color:var(--text);
}

/* Aucun pseudo-élément décoratif ne doit voler les clics. */
.sidebar::before,
.sidebar::after,
.sidebar nav::before,
.sidebar nav::after{
  pointer-events:none!important;
}


/* =========================================================
   CINETRAK V23 — VRAIS LIENS HTML + NAVIGATION SANS JAVASCRIPT
   ========================================================= */

/* Tous les liens de navigation se comportent visuellement comme les anciens boutons. */
a[data-page]{
  font:inherit;
  cursor:pointer;
  text-decoration:none;
  border:0;
  background:transparent;
  color:var(--muted);
  padding:10px 12px;
  border-radius:10px;
  -webkit-tap-highlight-color:transparent;
}

.sidebar nav a[data-page]{
  display:flex;
  align-items:center;
  gap:12px;
  text-align:left;
  position:relative;
  min-height:44px;
  width:100%;
  cursor:pointer!important;
  pointer-events:auto!important;
}

.sidebar nav a[data-page] i{
  margin-left:auto;
  min-width:8px;
  height:8px;
  border-radius:99px;
  background:var(--accent);
}

.sidebar nav a[data-page]:hover{
  color:var(--text);
  background:rgba(255,255,255,.05);
}

.sidebar nav a[data-page].active,
.sidebar nav a[data-page]:target{
  background:linear-gradient(90deg,rgba(255,79,120,.12),rgba(139,109,255,.07));
  color:var(--text);
  box-shadow:inset 3px 0 0 var(--accent);
}

/* Navigation mobile réelle. */
.mobileNav a[data-page]{
  color:var(--muted);
  text-decoration:none;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-width:54px;
  min-height:48px;
  cursor:pointer!important;
  pointer-events:auto!important;
}

.mobileNav a[data-page].active{
  color:#fff;
}

/*
 * Secours absolu sans JavaScript :
 * le hash #page-xxx affiche directement la section visée.
 */
.page:target{
  display:block!important;
}

body:has(.page:target) .page.active:not(:target){
  display:none!important;
}

body:has(.page:target) .page:not(:target){
  display:none!important;
}

body:has(.page:target) .page:target{
  display:block!important;
}

/* Aucun écran plein format ne peut voler un clic au menu. */
#pageLoader{
  pointer-events:none!important;
}

.sidebar,
.sidebar nav,
.sidebar nav a[data-page],
.mobileNav,
.mobileNav a[data-page]{
  pointer-events:auto!important;
}

@media(max-width:700px){
  .sidebar nav a[data-page]{
    min-width:54px;
    width:auto;
    justify-content:center;
  }
}


/* =========================================================
   CINETRAK V24 — AUTH CINÉMA + PREMIUM
   ========================================================= */
.authExperienceCard{width:min(1120px,94vw);max-width:none;padding:0;display:grid;grid-template-columns:.95fr 1.05fr;overflow:hidden;border-radius:30px;background:#0b0d13;border:1px solid rgba(255,255,255,.12);box-shadow:0 40px 120px rgba(0,0,0,.65)}
.authVisualPane{position:relative;min-height:720px;padding:42px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;background:radial-gradient(circle at 20% 10%,rgba(255,79,120,.35),transparent 35%),radial-gradient(circle at 80% 70%,rgba(139,109,255,.28),transparent 40%),linear-gradient(160deg,#141827,#07090d)}
.authVisualPane:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(0,0,0,.25));pointer-events:none}
.authBrandLockup,.authVisualCopy,.authTrustRow{position:relative;z-index:2}
.authBrandLockup{display:flex;align-items:center;gap:14px}.authBrandMark{width:50px;height:50px;border-radius:17px;display:grid;place-items:center;font:900 1.5rem Manrope;background:linear-gradient(135deg,var(--accent),var(--accent2));box-shadow:0 15px 40px rgba(255,79,120,.25)}
.authBrandLockup strong{display:block;font:800 1.15rem Manrope}.authBrandLockup small{color:var(--muted)}
.authVisualCopy h2{font:900 clamp(3.2rem,5vw,6rem)/.88 Manrope;letter-spacing:-.07em;margin:14px 0 20px}.authVisualCopy p{max-width:520px;color:#c8ccd8;line-height:1.75}
.authTrustRow{display:flex;gap:10px;flex-wrap:wrap}.authTrustRow span{font-size:.72rem;padding:9px 12px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(255,255,255,.05);backdrop-filter:blur(12px)}
.authFormPane{padding:46px 48px 40px;display:flex;flex-direction:column;justify-content:center}.premiumAuthTabs{background:#11141c;padding:5px;border-radius:16px;display:grid;grid-template-columns:1fr 1fr}.premiumAuthTabs button{border:0;border-radius:12px;padding:12px;background:transparent;color:var(--muted);font-weight:800}.premiumAuthTabs button.active{background:#fff;color:#090b10}
.premiumAuthWelcome{margin:30px 0 18px}.premiumAuthWelcome h2{font:900 2.5rem/1 Manrope;letter-spacing:-.05em;margin:8px 0}.premiumAuthWelcome p{color:var(--muted);line-height:1.6}
.cinemaAuthForm{display:grid;gap:16px}.floatingAuthField>span{display:block;font-size:.76rem;font-weight:800;margin:0 0 7px 3px}.authInputShell{display:flex;align-items:center;gap:10px;border:1px solid rgba(255,255,255,.11);background:#10131a;border-radius:16px;padding:0 14px;transition:.2s}.authInputShell:focus-within{border-color:rgba(255,79,120,.7);box-shadow:0 0 0 4px rgba(255,79,120,.09);transform:translateY(-1px)}.authInputShell i{font-style:normal;color:var(--accent);min-width:18px}.authInputShell input{width:100%;border:0!important;background:transparent!important;box-shadow:none!important;padding:15px 0!important;color:#fff;font-size:1rem}.passwordPeekBtn{border:0;background:transparent;color:#9ca3b4;cursor:pointer;font-size:1.05rem}
.authTwoCols{display:grid;grid-template-columns:1fr 1fr;gap:12px}.authMetaRow{display:flex;justify-content:space-between;color:var(--muted);font-size:.72rem}.authSubmitBtn{border:0;border-radius:16px;padding:16px 18px;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;font:800 1rem Manrope;cursor:pointer;box-shadow:0 18px 45px rgba(255,79,120,.22);transition:.2s}.authSubmitBtn:hover{transform:translateY(-2px);box-shadow:0 24px 55px rgba(255,79,120,.3)}.authSubmitBtn b{font-size:1.4rem}
.passwordStrength>div{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.passwordStrength>div span{height:5px;border-radius:999px;background:#272b35}.passwordStrength[data-score="1"] span:nth-child(-n+1),.passwordStrength[data-score="2"] span:nth-child(-n+2),.passwordStrength[data-score="3"] span:nth-child(-n+3),.passwordStrength[data-score="4"] span:nth-child(-n+4){background:linear-gradient(90deg,var(--accent),var(--accent2))}.passwordStrength small,.authSecurityNote{display:block;color:var(--muted);font-size:.7rem;line-height:1.5;margin-top:7px}.authConsent{display:flex;gap:10px;align-items:flex-start;color:#c9cdd7;font-size:.78rem;line-height:1.45}.authConsent input{margin-top:3px}.premiumFormMessage{min-height:22px;margin-top:12px}.authSecurityNote{text-align:center}
.premiumPage{padding-bottom:80px}.premiumHero{position:relative;overflow:hidden;min-height:430px;border:1px solid var(--line);border-radius:30px;display:grid;place-items:center;background:linear-gradient(160deg,#17121d,#090b10)}.premiumHeroContent{position:relative;z-index:2;text-align:center;max-width:780px;padding:60px 24px}.premiumCrown{font-size:4rem;display:block;filter:drop-shadow(0 15px 30px rgba(255,199,78,.25))}.premiumHero h1{font:900 clamp(3rem,7vw,6rem)/.9 Manrope;letter-spacing:-.07em;margin:14px 0}.premiumHero p{color:#c9cdd7;font-size:1.05rem;line-height:1.7}.premiumCurrentStatus{margin:24px auto 0;display:inline-flex;gap:10px;flex-direction:column;padding:14px 18px;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:rgba(255,255,255,.05)}
.pricingGrid{display:grid;grid-template-columns:1fr 1.08fr;gap:22px;max-width:980px;margin:42px auto}.pricingCard{position:relative;padding:34px;border-radius:26px;border:1px solid var(--line);background:var(--surface)}.premiumPlan{border-color:rgba(255,199,78,.35);background:radial-gradient(circle at top right,rgba(255,199,78,.13),transparent 35%),var(--surface)}.popularRibbon{position:absolute;top:18px;right:18px;padding:7px 10px;border-radius:999px;background:#ffc74e;color:#241800;font-size:.65rem;font-weight:900}.pricingLabel{font-size:.67rem;font-weight:900;letter-spacing:.15em;color:var(--accent)}.pricingCard h2{font:900 2rem Manrope}.pricingPrice strong{font:900 3.1rem Manrope}.pricingPrice span{color:var(--muted);margin-left:8px}.pricingCard ul{list-style:none;padding:0;display:grid;gap:12px;margin:28px 0;color:#d8dbe4}.premiumSubscribeBtn{width:100%;border:0;border-radius:15px;padding:15px;background:linear-gradient(135deg,#ffc74e,#ff8a3d);color:#241500;font-weight:900;cursor:pointer}.premiumFeatureGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.premiumFeatureGrid article{padding:24px;border:1px solid var(--line);border-radius:20px;background:var(--surface)}.premiumFeatureGrid article>span{font-size:2rem}.premiumFeatureGrid p{color:var(--muted);line-height:1.6}.premiumNavLink{background:linear-gradient(90deg,rgba(255,199,78,.12),transparent)!important;color:#ffd36b!important}.profilePremiumBadge{display:inline-flex;padding:6px 10px;border-radius:999px;background:linear-gradient(135deg,#ffc74e,#ff8a3d);color:#241500;font-size:.72rem;font-weight:900}.profilePremiumCard{display:inline-flex;align-items:center;gap:10px;padding:10px 13px;border:1px solid rgba(255,199,78,.25);border-radius:15px;background:rgba(255,199,78,.08);margin:10px 0}.profilePremiumCard span{font-size:1.5rem}.profilePremiumCard strong,.profilePremiumCard small{display:block}.profilePremiumCard small{color:var(--muted)}
@media(max-width:900px){.authExperienceCard{grid-template-columns:1fr}.authVisualPane{display:none}.authFormPane{padding:32px 24px}.pricingGrid{grid-template-columns:1fr}.premiumFeatureGrid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.authTwoCols{grid-template-columns:1fr}.premiumFeatureGrid{grid-template-columns:1fr}.authExperienceCard{width:96vw;border-radius:24px}.authFormPane{padding:28px 18px}.premiumAuthWelcome h2{font-size:2rem}}


/* =========================================================
   CINETRAK V25 — CENTRE DU COMPTE & FINITION PRODUIT
   ========================================================= */
.accountCenter{margin-top:52px}
.accountOverviewGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.accountOverviewCard{padding:24px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(160deg,var(--surface),rgba(255,255,255,.02))}
.accountOverviewCard strong{display:block;font:900 2rem Manrope;margin:8px 0}
.accountOverviewCard p{color:var(--muted);line-height:1.55}
.completionTrack{height:8px;border-radius:999px;background:#232731;overflow:hidden;margin:12px 0}
.completionTrack i{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,var(--accent),var(--accent2));transition:width .5s ease}
.accountSecurityGrid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}
.securityChangeCard p,.accountDataCard p{color:var(--muted);line-height:1.65}
.securityEventList{display:grid;gap:10px;margin-top:14px;max-height:420px;overflow:auto}
.securityEventRow{display:flex;align-items:center;gap:12px;padding:13px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.025)}
.securityEventRow>span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-weight:900}
.securityEventRow.ok>span{background:rgba(70,211,143,.12);color:#6ce0a4}
.securityEventRow.fail>span{background:rgba(255,90,110,.12);color:#ff7187}
.securityEventRow strong,.securityEventRow small{display:block}
.securityEventRow small{color:var(--muted);margin-top:3px}
.accountDataCard{margin-top:18px}
.inlineLinkButton{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
@media(max-width:900px){
  .accountOverviewGrid,.accountSecurityGrid{grid-template-columns:1fr}
}


/* ============================================================
   CINETRAK V26 — EXPÉRIENCE MOBILE PREMIUM
   ============================================================ */
.mobileTopbar,.mobileMenuBackdrop,.mobileMenuDrawer{display:none}

@media(max-width:760px){
  :root{--mobile-nav-h:72px;--mobile-top-h:66px}
  body{padding-top:var(--mobile-top-h);padding-bottom:calc(var(--mobile-nav-h) + env(safe-area-inset-bottom));overflow-x:hidden}
  .sidebar,.topbar{display:none!important}
  .app{margin-left:0!important;padding-bottom:0!important}
  main{padding-top:14px!important}

  .mobileTopbar{
    display:flex;position:fixed;inset:0 0 auto 0;height:calc(var(--mobile-top-h) + env(safe-area-inset-top));
    padding:max(10px,env(safe-area-inset-top)) 14px 10px;align-items:center;justify-content:space-between;z-index:220;
    background:linear-gradient(180deg,rgba(8,9,13,.97),rgba(8,9,13,.88));backdrop-filter:blur(24px) saturate(150%);
    -webkit-backdrop-filter:blur(24px) saturate(150%);border-bottom:1px solid rgba(255,255,255,.08)
  }
  .mobileTopBrand{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;min-width:0}
  .mobileTopBrand img{width:40px;height:40px;border-radius:13px;object-fit:cover;box-shadow:0 8px 26px rgba(255,79,120,.28)}
  .mobileTopBrand span{display:grid;line-height:1.08}.mobileTopBrand b{font:800 1.05rem Manrope}.mobileTopBrand small{margin-top:4px;color:var(--muted);font-size:.67rem}
  .mobileTopActions{display:flex;align-items:center;gap:8px}.mobileTopAction,.mobileMenuTrigger{width:44px;height:44px;min-height:44px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.1);border-radius:14px;background:rgba(255,255,255,.055);color:var(--text);text-decoration:none}
  .mobileMenuTrigger{gap:4px;padding:11px}.mobileMenuTrigger span{display:block;width:20px;height:2px;border-radius:99px;background:currentColor;transition:.25s ease}
  .mobileMenuTrigger[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
  .mobileMenuTrigger[aria-expanded="true"] span:nth-child(2){opacity:0}
  .mobileMenuTrigger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

  .mobileMenuBackdrop{display:block;position:fixed;inset:0;z-index:300;background:rgba(2,3,7,.68);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:opacity .28s ease}
  .mobileMenuBackdrop.is-open{opacity:1;pointer-events:auto}
  .mobileMenuDrawer{display:flex;position:fixed;z-index:310;inset:0 0 0 auto;width:min(92vw,420px);flex-direction:column;background:linear-gradient(180deg,#11131a 0%,#090a0f 100%);border-left:1px solid rgba(255,255,255,.09);box-shadow:-30px 0 90px rgba(0,0,0,.55);transform:translateX(105%);transition:transform .32s cubic-bezier(.22,1,.36,1);padding-top:env(safe-area-inset-top)}
  .mobileMenuDrawer.is-open{transform:translateX(0)}
  body.mobile-menu-open{overflow:hidden;touch-action:none}
  .mobileMenuHead{display:flex;align-items:center;justify-content:space-between;padding:18px 18px 12px}
  .mobileMenuIdentity{display:flex;align-items:center;gap:12px}.mobileMenuIdentity img{width:48px;height:48px;border-radius:15px;box-shadow:0 12px 30px rgba(255,79,120,.24)}
  .mobileMenuIdentity div{display:grid}.mobileMenuIdentity b{font:800 1.15rem Manrope}.mobileMenuIdentity small{margin-top:3px;color:var(--muted)}
  #mobileMenuClose{width:44px;height:44px;min-height:44px;border:1px solid var(--line);border-radius:14px;background:var(--surface2);color:var(--text);font-size:1.75rem;line-height:1}
  .mobileMenuSearch{margin:4px 18px 12px;height:48px;display:flex;align-items:center;gap:10px;padding:0 14px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.055)}
  .mobileMenuSearch input{width:100%;border:0;outline:0;background:transparent;color:var(--text)}
  .mobileMenuScroll{overflow-y:auto;overscroll-behavior:contain;padding:0 14px calc(28px + env(safe-area-inset-bottom));-webkit-overflow-scrolling:touch}
  .mobileMenuSection{margin:16px 0 22px}.mobileMenuSection h3{margin:0 4px 10px;color:var(--muted);font-size:.69rem;letter-spacing:.13em;text-transform:uppercase}
  .mobileMenuGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.mobileMenuGrid a{min-height:88px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;padding:14px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.025));color:var(--text);text-decoration:none}
  .mobileMenuGrid a span{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:linear-gradient(135deg,rgba(255,79,120,.18),rgba(139,109,255,.18));font-size:1.15rem}.mobileMenuGrid a b{font-size:.82rem}
  .mobileMenuList{display:grid;gap:7px}.mobileMenuList a{min-height:52px;display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:10px;padding:7px 10px;border:1px solid transparent;border-radius:15px;color:var(--text);text-decoration:none;background:rgba(255,255,255,.025)}
  .mobileMenuList a span{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:rgba(255,255,255,.055)}.mobileMenuList a b{font-size:.86rem}.mobileMenuList a i{color:var(--muted);font-style:normal;font-size:1.4rem}
  .mobileMenuList a.active,.mobileMenuGrid a.active{border-color:rgba(255,79,120,.35);background:linear-gradient(135deg,rgba(255,79,120,.13),rgba(139,109,255,.09))}
  .mobilePremiumLink{background:linear-gradient(135deg,rgba(255,190,70,.12),rgba(139,109,255,.08))!important;border-color:rgba(255,190,70,.18)!important}
  .mobileMenuSection.is-filtered-out,.mobileMenuList a.is-filtered-out,.mobileMenuGrid a.is-filtered-out{display:none!important}

  .mobileNav{
    display:grid!important;grid-template-columns:repeat(5,1fr);position:fixed;inset:auto 8px calc(8px + env(safe-area-inset-bottom)) 8px;
    height:64px;padding:5px;z-index:230;border:1px solid rgba(255,255,255,.11);border-radius:22px;background:rgba(15,17,24,.93);
    backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);box-shadow:0 16px 50px rgba(0,0,0,.45);overflow:visible
  }
  .mobileNav a,.mobileNav button{min-width:0;min-height:54px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:0;border-radius:16px;background:transparent;color:var(--muted);text-decoration:none;transition:.22s ease}
  .mobileNav a span,.mobileNav button span{font-size:1.18rem;line-height:1}.mobileNav small{font-size:.62rem;font-weight:700}
  .mobileNav a.active{color:#fff;background:linear-gradient(135deg,rgba(255,79,120,.18),rgba(139,109,255,.15))}
  .mobileNavMenuButton{position:relative;transform:translateY(-14px);width:58px!important;height:58px!important;min-height:58px!important;justify-self:center;border:1px solid rgba(255,255,255,.18)!important;border-radius:19px!important;background:linear-gradient(135deg,var(--accent),var(--accent2))!important;color:white!important;box-shadow:0 12px 30px rgba(255,79,120,.32)}
  .mobileNavMenuButton span{font-size:1.4rem!important}.mobileNavMenuButton small{font-size:.58rem}

  .hero{min-height:420px!important}.heroContent{padding:26px 18px!important}.heroContent h1{font-size:clamp(2rem,11vw,3.4rem)!important;line-height:.98}
  .statsStrip{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .homeUniverse{grid-template-columns:1fr!important}
  .row{gap:9px}.row>.primary,.row>.secondary{flex:1;justify-content:center;text-align:center}
  .movieCard{border-radius:16px}.movieCard img{border-radius:14px 14px 0 0}
}

@media(max-width:390px){
  .mobileTopBrand small{display:none}.mobileTopBrand img{width:38px;height:38px}.mobileTopbar{padding-inline:10px}
  .mobileMenuDrawer{width:96vw}.mobileMenuGrid a{min-height:82px}.mobileNav{inset-inline:5px}
  .mobileNav small{font-size:.57rem}
}

@media(min-width:761px){.mobileNav{display:none!important}}

[data-theme="light"] .mobileTopbar{background:rgba(255,255,255,.92);border-bottom-color:rgba(17,19,26,.08)}
[data-theme="light"] .mobileMenuDrawer{background:linear-gradient(180deg,#fff,#f5f6fb);border-left-color:rgba(17,19,26,.08)}
[data-theme="light"] .mobileMenuBackdrop{background:rgba(35,38,50,.35)}
[data-theme="light"] .mobileNav{background:rgba(255,255,255,.94);border-color:rgba(17,19,26,.09);box-shadow:0 16px 50px rgba(30,35,60,.18)}

/* FIX MOBILE AUTH PASSWORD FIELDS */
@media (max-width: 900px) {
  #authModal {
    align-items: flex-start !important;
    overflow-y: auto !important;
    padding: 12px 0 !important;
  }

  #authModal .authExperienceCard {
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
    margin: 10px auto 40px !important;
  }

  #authModal .authFormPane {
    overflow: visible !important;
  }

  #authModal .cinemaAuthForm,
  #authModal .authTwoCols,
  #authModal .floatingAuthField,
  #authModal .authInputShell {
    position: relative !important;
    z-index: 5 !important;
  }

  #authModal input[type="password"],
  #authModal input[type="text"],
  #authModal input[type="email"] {
    pointer-events: auto !important;
    user-select: text !important;
    -webkit-user-select: text !important;
    touch-action: manipulation !important;
    position: relative !important;
    z-index: 10 !important;
    min-height: 48px !important;
  }

  #authModal .passwordPeekBtn {
    position: relative !important;
    z-index: 11 !important;
    flex: 0 0 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
  }
}


/* FIX AUTH V26 — bouton toujours accessible + vrai scroll */
#authModal {
  overflow-y: auto !important;
  align-items: flex-start !important;
  padding: 20px !important;
}

#authModal .authExperienceCard {
  max-height: calc(100dvh - 40px) !important;
  overflow: hidden !important;
  margin: 0 auto !important;
}

#authModal .authFormPane {
  min-height: 0 !important;
  max-height: calc(100dvh - 40px) !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  justify-content: flex-start !important;
  padding-bottom: 40px !important;
}

#authModal .registerSubmit {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 30 !important;
  margin-top: 10px !important;
  box-shadow: 0 -12px 30px rgba(11,13,19,.92) !important;
}

@media (max-width: 900px) {
  #authModal {
    padding: 8px !important;
  }

  #authModal .authExperienceCard {
    width: 100% !important;
    max-height: calc(100dvh - 16px) !important;
  }

  #authModal .authFormPane {
    max-height: calc(100dvh - 16px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding-bottom: 90px !important;
  }
}


/* =========================================================
   CINETRAK — CENTRE DE CONSENTEMENT LÉGAL
   ========================================================= */

.legalConsentBox {
  border: 1px solid rgba(255,255,255,.1);
  background: linear-gradient(145deg, rgba(255,255,255,.035), rgba(255,255,255,.015));
  border-radius: 16px;
  padding: 14px 16px;
  transition: .25s ease;
}

.legalConsentBox.accepted {
  border-color: rgba(60,220,140,.5);
  background: rgba(60,220,140,.07);
}

.legalConsentSummary input {
  pointer-events: none;
}

.legalOpenBtn {
  display: inline;
  border: 0;
  padding: 0;
  background: transparent;
  color: #7c8cff;
  text-decoration: underline;
  text-underline-offset: 3px;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.legalConsentHint {
  display: block;
  margin: 8px 0 0 28px;
  color: var(--muted);
  line-height: 1.45;
}

.legalModal {
  z-index: 99999 !important;
  padding: 18px !important;
  overflow: hidden !important;
}

.legalModalCard {
  width: min(900px, 96vw) !important;
  height: min(900px, 94dvh) !important;
  max-height: 94dvh !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  background: #0b0e15 !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-radius: 28px !important;
}

.legalModalHeader {
  padding: 30px 34px 18px;
}

.legalEyebrow {
  color: #4d8cff;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .17em;
}

.legalModalHeader h2 {
  margin: 8px 0;
  font-size: clamp(1.8rem, 4vw, 3rem);
}

.legalModalHeader p {
  color: var(--muted);
  line-height: 1.6;
  margin: 0;
}

.legalTabs {
  display: flex;
  gap: 8px;
  padding: 0 34px 18px;
  overflow-x: auto;
}

.legalTabs button {
  flex: 1;
  min-width: max-content;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 999px;
  background: #11151f;
  color: #aeb5c7;
  padding: 11px 15px;
  font-weight: 800;
  cursor: pointer;
}

.legalTabs button.active {
  background: linear-gradient(135deg, #386cff, #9c5cff);
  color: #fff;
  border-color: transparent;
}

.legalScrollArea {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 6px 34px 34px;
  scroll-behavior: smooth;
  overscroll-behavior: contain;
}

.legalDocument {
  display: none;
}

.legalDocument.active {
  display: block;
}

.legalDocument h3 {
  font-size: 1.55rem;
  margin: 10px 0 22px;
}

.legalDocument h4 {
  margin: 28px 0 8px;
  color: #fff;
}

.legalDocument p {
  color: #b3bac9;
  line-height: 1.75;
}

.legalEndMarker {
  margin-top: 55px;
  padding: 28px;
  text-align: center;
  border: 1px dashed rgba(100,140,255,.55);
  border-radius: 20px;
  background: rgba(70,100,255,.07);
}

.legalEndMarker > span {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  margin: 0 auto 12px;
  border-radius: 18px;
  background: linear-gradient(135deg, #3478ff, #a64fff);
  font-size: 1.5rem;
}

.legalAcceptanceFooter {
  border-top: 1px solid rgba(255,255,255,.1);
  padding: 18px 34px 24px;
  background: rgba(9,11,17,.98);
}

.legalProgressRow {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  color: #aeb5c7;
  font-size: .8rem;
}

.legalProgressBar {
  height: 6px;
  margin: 10px 0 16px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
}

.legalProgressBar span {
  display: block;
  width: 0;
  height: 100%;
  background: linear-gradient(90deg, #3478ff, #a54cff);
  transition: width .2s ease;
}

.legalFinalCheck {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  color: #fff;
  line-height: 1.45;
  cursor: pointer;
}

.legalFinalCheck.disabled {
  opacity: .45;
  cursor: not-allowed;
}

.legalAcceptBtn {
  width: 100%;
  margin-top: 18px;
}

.legalAcceptBtn:disabled {
  opacity: .4;
  cursor: not-allowed;
  filter: grayscale(.6);
}

body.legalModalOpen {
  overflow: hidden;
}

@media (max-width: 600px) {
  .legalModal {
    padding: 0 !important;
  }

  .legalModalCard {
    width: 100vw !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    border-radius: 0 !important;
  }

  .legalModalHeader {
    padding: 22px 18px 14px;
  }

  .legalTabs {
    padding: 0 18px 14px;
  }

  .legalScrollArea {
    padding: 4px 18px 30px;
  }

  .legalAcceptanceFooter {
    padding: 14px 18px calc(18px + env(safe-area-inset-bottom));
  }

  .legalModalHeader h2 {
    font-size: 1.8rem;
  }
}


/* CineTrak — disponibilité du pseudo */

.usernameAvailability {
  display: block;
  min-height: 20px;
  margin: 7px 4px 0;
  font-size: .78rem;
  font-weight: 800;
  transition: .2s ease;
}

.usernameAvailability.checking {
  color: #aeb5c7;
}

.usernameAvailability.available {
  color: #55d99a;
}

.usernameAvailability.unavailable {
  color: #ff6485;
}

