/* ==========================================================================
   COACH AD v5 — style « Immersif », au-dessus du style Épure de la v4
   Aucune donnée ni fonction ne change : uniquement du mouvement et de la profondeur.
   Tout est actif seulement quand immersif.js a mis la classe .mo sur <html>.
   ========================================================================== */
/* En-tête en verre fumé */
html.mo .topbar { background: rgba(7,7,7,.55) !important; -webkit-backdrop-filter: blur(18px) saturate(140%); backdrop-filter: blur(18px) saturate(140%); transition: padding .3s ease; }
html.mo .app.mo-new .topbar h1 { animation: moTitle .7s cubic-bezier(.2,.8,.2,1) both; }
@keyframes moTitle { from { opacity: 0; transform: translateX(-18px); letter-spacing: .04em; } to { opacity: 1; transform: none; } }

/* Entrée de chaque écran : les blocs montent l'un après l'autre */
html.mo main.view > .mo-r { opacity: 0; }
html.mo main.view > .mo-r.mo-v { animation: moUp .7s cubic-bezier(.16,.84,.24,1) both; animation-delay: calc(var(--i, 0) * 70ms); }
@keyframes moUp { from { opacity: 0; transform: translateY(26px) scale(.98); filter: blur(4px); } to { opacity: 1; transform: none; filter: none; } }

/* Barres qui se remplissent */
html.mo .mo-new .chal-bar i, html.mo .mo-new .hm-bar i, html.mo .mo-new .bh-bar i { transform-origin: 0 50%; animation: moGrowX 1.3s cubic-bezier(.2,.8,.2,1) both .45s; }
html.mo .mo-new .bar i { transform-origin: 50% 100%; animation: moGrowY 1.1s cubic-bezier(.2,.8,.2,1) both; animation-delay: .4s; }
@keyframes moGrowX { from { transform: scaleX(0); } }
@keyframes moGrowY { from { transform: scaleY(0); } }
html.mo .chal-bar i, html.mo .hm-bar i { position: relative; overflow: hidden; }
html.mo .chal-bar i::after, html.mo .hm-bar i::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent); transform: translateX(-100%); animation: moRun 2.6s ease-in-out 1.8s infinite; }
@keyframes moRun { to { transform: translateX(100%); } }

/* Cartes or : reflet qui passe + légère inclinaison au doigt */
html.mo .hm-next, html.mo .bill-hero { position: relative; overflow: hidden; transform-style: preserve-3d; transition: transform .25s ease, box-shadow .3s ease; box-shadow: 0 20px 50px -18px rgba(201,168,76,.55) !important; }
html.mo .hm-next::after, html.mo .bill-hero::after { content: ""; position: absolute; inset: -20% -40%; pointer-events: none; background: linear-gradient(115deg, transparent 38%, rgba(255,255,255,.38) 48%, transparent 58%); transform: translateX(-70%); animation: moSheen 7s ease-in-out 1.4s infinite; }
@keyframes moSheen { 0% { transform: translateX(-70%); } 22%, 100% { transform: translateX(70%); } }
html.mo .sign-call { animation: moBreath 3.2s ease-in-out infinite; }
@keyframes moBreath { 50% { box-shadow: 0 0 0 6px rgba(255,255,255,.06), 0 18px 40px -16px rgba(255,255,255,.25); } }

/* Boutons : effet de pression */
html.mo .btn, html.mo .chip, html.mo .icon-btn, html.mo .fab, html.mo main.view .row, html.mo .tabbar button { transition: transform .16s cubic-bezier(.2,.8,.2,1), background-color .2s, border-color .2s, color .2s; }
html.mo .btn:active, html.mo .chip:active, html.mo .icon-btn:active, html.mo .fab:active, html.mo main.view .row:active { transform: scale(.965); }
html.mo .fab { box-shadow: 0 14px 34px -10px rgba(201,168,76,.6) !important; }

/* Barre d'onglets : indicateur qui glisse, icône qui rebondit */
html.mo .tabbar { background: rgba(7,7,7,.72) !important; -webkit-backdrop-filter: blur(20px) saturate(150%); backdrop-filter: blur(20px) saturate(150%); }
html.mo .tabbar .inner { position: relative; }
html.mo .tabbar button[aria-current="page"]::before { display: none !important; }
.mo-ind { position: absolute; top: -1px; height: 2px; border-radius: 2px; background: var(--gold); box-shadow: 0 0 14px 2px rgba(201,168,76,.65); pointer-events: none; transition: left .5s cubic-bezier(.2,.9,.25,1.15), width .5s cubic-bezier(.2,.9,.25,1.15); }
.mo-ind::after { content: ""; position: absolute; left: 50%; top: 0; width: 70px; height: 46px; margin-left: -35px; background: radial-gradient(60% 70% at 50% 0%, rgba(201,168,76,.22), transparent 70%); }
html.mo .tabbar button[aria-current="page"] svg { animation: moPop .55s cubic-bezier(.2,.9,.3,1.6) both; }
@keyframes moPop { 0% { transform: scale(.6); } 60% { transform: scale(1.18); } 100% { transform: none; } }

/* Fenêtres : arrivée à ressort, fond flouté, contenu en cascade */
html.mo .sheet { transition: transform .55s cubic-bezier(.2,1.2,.3,1), opacity .25s !important; transform: translateY(70px) scale(.98); }
html.mo .sheet-wrap.open .sheet { transform: none; }
html.mo .sheet-backdrop { -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
html.mo .sheet-wrap.open .sheet-body > * { animation: moUp .55s cubic-bezier(.16,.84,.24,1) both; }
html.mo .sheet-wrap.open .sheet-body > *:nth-child(2) { animation-delay: .06s; } html.mo .sheet-wrap.open .sheet-body > *:nth-child(3) { animation-delay: .12s; }
html.mo .sheet-wrap.open .sheet-body > *:nth-child(4) { animation-delay: .18s; } html.mo .sheet-wrap.open .sheet-body > *:nth-child(n+5) { animation-delay: .24s; }

/* Blocs dépliables et grilles de badges */
html.mo .fold-body:not([hidden]) > *, html.mo .badges4:not([hidden]) .bdg { animation: moUp .5s cubic-bezier(.16,.84,.24,1) both; }
html.mo .badges4 .bdg:nth-child(2) { animation-delay: .04s; } html.mo .badges4 .bdg:nth-child(3) { animation-delay: .08s; } html.mo .badges4 .bdg:nth-child(4) { animation-delay: .12s; }
html.mo .badges4 .bdg:nth-child(5) { animation-delay: .16s; } html.mo .badges4 .bdg:nth-child(6) { animation-delay: .2s; } html.mo .badges4 .bdg:nth-child(n+7) { animation-delay: .24s; }
html.mo .bdg.ok.tier-legende .hexm { animation: moGlow 2.8s ease-in-out infinite; }
@keyframes moGlow { 50% { filter: drop-shadow(0 0 18px rgba(227,197,111,.75)); } }

/* Petits détails vivants */
html.mo .streak .fl { animation: moFlame 1.8s ease-in-out infinite; box-shadow: 0 0 24px rgba(201,168,76,.5); }
@keyframes moFlame { 0%, 100% { transform: scale(1) rotate(0); } 30% { transform: scale(1.06) rotate(-3deg); } 60% { transform: scale(.98) rotate(2deg); } }
/* Petites gouttes noires de tailles variées qui s'échappent du haut de la flamme, sans sortir du rond doré */
.streak .fl { position: relative; overflow: hidden; }
.streak .fl > svg { position: relative; z-index: 1; }
.fl-em { display: none; }
html.mo .fl-em { display: block; position: absolute; left: 26px; top: 14px; width: 0; height: 0; pointer-events: none; }
html.mo .fl-em i { position: absolute; left: calc(var(--w) / -2); top: calc(var(--w) * -.7); width: var(--w); height: calc(var(--w) * 1.38); border-radius: 50% 50% 50% 50% / 65% 65% 35% 35%; background: var(--on-gold, #111); opacity: 0; animation: moEmber var(--t) ease-out var(--d) infinite; }
@keyframes moEmber { 0% { opacity: 0; transform: translate(0, 0) scale(1); } 10% { opacity: 1; } 60% { opacity: 0; transform: translate(var(--dx), -11px) scale(.35); } 100% { opacity: 0; transform: translate(var(--dx), -11px) scale(.35); } }
@media (prefers-reduced-motion: reduce) { html.mo .fl-em { display: none; } }
html.mo .daystrip button.today { box-shadow: 0 0 0 0 rgba(201,168,76,.6); animation: moRing 2.4s ease-out infinite; }
@keyframes moRing { 0% { box-shadow: 0 0 0 0 rgba(201,168,76,.55); } 100% { box-shadow: 0 0 0 12px rgba(201,168,76,0); } }
html.mo .avatar { transition: box-shadow .3s; box-shadow: 0 0 0 1px rgba(201,168,76,.25), 0 0 18px -4px rgba(201,168,76,.35); }

@media (prefers-reduced-motion: reduce) {
  html.mo *, html.mo *::before, html.mo *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  html.mo main.view > .mo-r { opacity: 1; }
}

/* Boutons dorés : légère brillance dorée, fixe (sans mouvement) */
html.mo .btn-gold:not([disabled]), html.mo .wl-go, html.mo .hm-play, html.mo .rank li:first-child .pos { box-shadow: 0 0 14px 1px rgba(227,197,111,.42); }
html.mo .fab { box-shadow: 0 14px 34px -10px rgba(201,168,76,.6), 0 0 16px 2px rgba(227,197,111,.45) !important; }