/* 16/10 (patron : « plus impressionnant ») — PRÉSENTATION SIGHT v2, façon bande-annonce (≈ 22 s + écran final), calée sur la musique
   static/motion-musique.js (120 BPM : 1 temps = 0,5 s). Impacts à 4 s (l'œil s'ouvre) et 18 s (révélation du logo).
   Profondeur 3D (perspective), parallaxe, balayages de lumière, reflets, particules d'or (canvas piloté par le temps), typographie cinétique,
   coupes nettes sur les temps. Chaque animation a un délai ABSOLU → rejouable image par image (SightIntro.seek) pour l'export MP4.
   Charte Sight : or · noir · gris, l'œil officiel (SightOeil). Version 1 : motion-intro.css.bak-v1trailer. */
.mi-root{position:fixed;inset:0;z-index:2147482000;background:#000;color:#e9edf5;overflow:hidden;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;opacity:1;transition:opacity .7s ease}
.mi-root.mi-off{opacity:0;pointer-events:none}
.mi-root *{box-sizing:border-box}
.mi-cv{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:4}
.mi-stage{position:absolute;inset:0;perspective:1400px}
.mi-shk{animation:miShake .5s linear both}
/* scène = calque plein écran, coupe nette */
.mi-sc{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transform-style:preserve-3d;animation-name:miCut;animation-fill-mode:both;animation-timing-function:linear}
@keyframes miCut{0%{opacity:0;visibility:visible;transform:scale(1.08);filter:blur(8px)}4%{opacity:1;transform:none;filter:none}95%{opacity:1;transform:scale(1.02);filter:none}99.9%{opacity:0;visibility:visible;transform:scale(1.05);filter:blur(6px)}100%{opacity:0;visibility:hidden}}
.mi-sc.mi-reste{animation-name:miCutReste}
@keyframes miCutReste{0%{opacity:0;visibility:visible;transform:scale(1.08)}6%{opacity:1;visibility:visible;transform:none}100%{opacity:1;visibility:visible;transform:none}}
@keyframes miShake{0%,100%{transform:none}10%{transform:translate(-9px,5px)}20%{transform:translate(8px,-6px)}30%{transform:translate(-6px,-4px)}45%{transform:translate(5px,4px)}60%{transform:translate(-3px,2px)}80%{transform:translate(2px,-1px)}}
/* éclairs aux impacts */
.mi-flash{position:absolute;inset:0;z-index:6;pointer-events:none;opacity:0;background:radial-gradient(circle at 50% 50%,#fff 0,#fff3c4 22%,rgba(247,201,72,.55) 45%,rgba(0,0,0,0) 75%);animation:miFlash .9s ease-out both}
@keyframes miFlash{0%{opacity:0}4%{opacity:1}100%{opacity:0}}
.mi-streak{position:absolute;left:-10%;right:-10%;top:50%;height:3px;margin-top:-1.5px;z-index:6;pointer-events:none;opacity:0;
  background:linear-gradient(90deg,transparent,rgba(255,231,163,0) 10%,#ffe7a3 50%,rgba(255,231,163,0) 90%,transparent);filter:blur(1px);box-shadow:0 0 22px 6px rgba(247,201,72,.55);animation:miStreak 1.3s ease-out both}
@keyframes miStreak{0%{opacity:0;transform:scaleX(.1)}8%{opacity:1;transform:scaleX(1)}100%{opacity:0;transform:scaleX(1.25)}}
.mi-onde{position:absolute;left:50%;top:50%;width:300px;height:150px;margin:-75px 0 0 -150px;border-radius:50%;border:2px solid rgba(255,231,163,.9);z-index:5;pointer-events:none;opacity:0;animation:miOnde 1.2s cubic-bezier(.1,.7,.3,1) both}
@keyframes miOnde{0%{opacity:0;transform:scale(.3)}6%{opacity:1}100%{opacity:0;transform:scale(7)}}
/* balayage de lumière (reflet) */
.mi-sweep{position:absolute;inset:-30%;z-index:5;pointer-events:none;opacity:0;mix-blend-mode:screen;background:linear-gradient(105deg,transparent 42%,rgba(255,231,163,.08) 46%,rgba(255,240,200,.42) 50%,rgba(255,231,163,.08) 54%,transparent 58%);animation:miSweep 1.1s cubic-bezier(.4,0,.2,1) both}
@keyframes miSweep{0%{opacity:0;transform:translateX(-45%)}12%{opacity:1}88%{opacity:1}100%{opacity:0;transform:translateX(45%)}}
.mi-vig{position:absolute;inset:0;z-index:5;pointer-events:none;background:radial-gradient(ellipse 75% 70% at 50% 50%,transparent 55%,rgba(0,0,0,.85) 100%)}
.mi-halo{position:absolute;width:70vmax;height:70vmax;left:50%;top:50%;margin:-35vmax 0 0 -35vmax;border-radius:50%;background:radial-gradient(circle,rgba(247,201,72,.2),rgba(247,201,72,.05) 40%,transparent 65%);opacity:0;animation:miHalo 4s ease-out both}
@keyframes miHalo{0%{opacity:0;transform:scale(.6)}15%{opacity:1}100%{opacity:.5;transform:scale(1.15)}}

/* typographie cinétique */
.mi-mot{position:absolute;left:0;right:0;top:50%;margin-top:-.5em;text-align:center;font:900 clamp(34px,7vw,118px)/1 system-ui,"Segoe UI",sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#fff;
  opacity:0;animation:miMot .9s cubic-bezier(.15,.8,.2,1) both;text-shadow:0 0 40px rgba(247,201,72,.35);white-space:nowrap}
.mi-mot.or{background:linear-gradient(100deg,#fff 0%,#ffe7a3 35%,#f7c948 55%,#fff 85%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;filter:drop-shadow(0 0 26px rgba(247,201,72,.35))}
.mi-mot.petit{font-size:clamp(22px,3.6vw,60px);letter-spacing:.14em}
@keyframes miMot{0%{opacity:0;transform:scale(2.2);letter-spacing:.5em;filter:blur(14px)}22%{opacity:1;filter:none}72%{opacity:1;transform:scale(1);letter-spacing:.06em}100%{opacity:0;transform:scale(.9);filter:blur(4px)}}
.mi-kick{position:absolute;left:0;right:0;top:9%;text-align:center;font:800 clamp(11px,1.15vw,15px)/1 system-ui;letter-spacing:.42em;text-transform:uppercase;color:#c9a14a;opacity:0;animation:miUp .6s cubic-bezier(.2,.8,.2,1) both;z-index:3}
.mi-titre{position:absolute;left:0;right:0;top:13%;text-align:center;font:900 clamp(26px,3.8vw,58px)/1.05 system-ui;letter-spacing:-.01em;color:#fff;opacity:0;animation:miSlam .5s cubic-bezier(.2,.9,.2,1) both;z-index:3}
.mi-titre em{font-style:normal;background:linear-gradient(100deg,#ffe7a3,#f7c948);-webkit-background-clip:text;background-clip:text;color:transparent}
@keyframes miUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.mi-lettres{position:absolute;left:0;right:0;top:50%;margin-top:-.6em;text-align:center;font:900 clamp(26px,4.6vw,78px)/1.2 system-ui;letter-spacing:.08em;color:#fff;white-space:nowrap}
.mi-lettres b{color:#f7c948}
.mi-lettres span{display:inline-block;opacity:0;animation:miLettre .45s cubic-bezier(.2,.8,.2,1) both}
@keyframes miLettre{from{opacity:0;transform:translateY(.4em) scale(1.7);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
.mi-lettres.zoom{animation:miZoomLent 2s linear both}
@keyframes miZoomLent{from{transform:scale(1)}to{transform:scale(1.12)}}
.mi-pop{opacity:0;animation:miPop .45s cubic-bezier(.3,1.6,.5,1) both}
@keyframes miPop{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:none}}
.mi-slam{opacity:0;animation:miSlam .42s cubic-bezier(.2,.9,.2,1) both}
@keyframes miSlam{0%{opacity:0;transform:scale(1.9) translateY(-10px);filter:blur(6px)}100%{opacity:1;transform:none;filter:none}}

/* l'œil */
.mi-eye{position:relative;width:min(560px,70vw);filter:drop-shadow(0 30px 80px rgba(212,166,58,.42))}
.mi-eye svg{display:block;width:100%;height:auto}
.mi-eye .oe-ph,.mi-eye .oe-pb{animation:none}
.mi-eye1{opacity:0;animation:miEyeIn 6s linear both}
@keyframes miEyeIn{0%{opacity:0;transform:scale(.82)}20%{opacity:.5}64%{opacity:.75;transform:scale(.96)}67%{opacity:1;transform:scale(1.1)}74%{transform:scale(1)}90%{opacity:1;transform:scale(2.4)}100%{opacity:0;transform:scale(9)}}
.mi-root .mi-eye1 .oe-ph{animation:miLidH1 6s linear both}.mi-root .mi-eye1 .oe-pb{animation:miLidB1 6s linear both}
@keyframes miLidH1{0%,66.4%{transform:translateY(54px)}68.5%{transform:translateY(-6px)}71%,100%{transform:translateY(0)}}
@keyframes miLidB1{0%,66.4%{transform:translateY(-54px)}68.5%{transform:translateY(6px)}71%,100%{transform:translateY(0)}}
.mi-eye1 .mk-iris-g{animation:miIris1 6s ease-in-out both}
@keyframes miIris1{0%,72%{transform:none}78%{transform:translateX(-22px)}84%{transform:translateX(22px)}90%,100%{transform:none}}
.mi-eyeF{width:min(440px,56vw);opacity:0;animation:miEyeF 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes miEyeF{0%{opacity:0;transform:scale(3.4);filter:blur(10px)}8%{opacity:1;transform:scale(1);filter:none}100%{opacity:1;transform:scale(.94)}}
.mi-root .mi-eyeF .oe-ph{animation:miLidH2 3.5s ease-in-out infinite}.mi-root .mi-eyeF .oe-pb{animation:miLidB2 3.5s ease-in-out infinite}
@keyframes miLidH2{0%,42%,54%,100%{transform:none}48%{transform:translateY(54px)}}
@keyframes miLidB2{0%,42%,54%,100%{transform:none}48%{transform:translateY(-54px)}}
.mi-eyeF .mk-iris-g{animation:miIrisF 4s ease-in-out infinite}
@keyframes miIrisF{0%,100%{transform:none}25%{transform:translateX(-20px)}60%{transform:translateX(18px)}}

/* logo final */
.mi-final{flex-direction:column;gap:clamp(10px,2vh,22px)}
.mi-word{position:relative;width:min(540px,64vw);aspect-ratio:647/217;background:var(--mi-logo,url(/static/logo-splash.png?v=1)) no-repeat 50% 100%/100% auto;opacity:0;animation:miWord 8s cubic-bezier(.2,.8,.2,1) both}
@keyframes miWord{0%{opacity:0;transform:scale(1.6);filter:blur(12px) brightness(2.2)}7%{opacity:1;transform:scale(1);filter:none}100%{opacity:1;transform:scale(.97)}}
.mi-gloss{position:absolute;inset:0;overflow:hidden;pointer-events:none;-webkit-mask:var(--mi-logo,url(/static/logo-splash.png?v=1)) no-repeat 50% 100%/100% auto;mask:var(--mi-logo,url(/static/logo-splash.png?v=1)) no-repeat 50% 100%/100% auto}
.mi-gloss:after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.95) 50%,transparent 65%);transform:translateX(-120%);animation:miGloss 1.3s ease-in-out both;animation-delay:inherit}
@keyframes miGloss{0%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
.mi-tagline{margin:0;text-align:center;letter-spacing:.22em;font:600 clamp(12px,1.25vw,17px)/1.6 system-ui;color:#dfe5f0;opacity:0;animation:miUp .7s cubic-bezier(.2,.8,.2,1) both}.mi-tagline b{color:#d4a63a}
.mi-btt{margin:6px 0 0;font:800 clamp(18px,2.1vw,32px)/1.1 system-ui;letter-spacing:.16em;background:linear-gradient(100deg,#ffe7a3,#f7c948 50%,#d4a63a);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 18px rgba(247,201,72,.3));opacity:0;animation:miUp .8s cubic-bezier(.2,.8,.2,1) both}
/* ouverture COURTE (après la période de lancement) : l'œil qui cligne + SIGHT + « Better Traders Together. » (~2 s) */
.mi-courte .mi-eyeF{animation-duration:3s}.mi-courte .mi-word{animation-duration:3s}.mi-root.mi-courte .mi-eyeF .oe-ph{animation:miLidH2 1.6s ease-in-out .5s infinite}.mi-root.mi-courte .mi-eyeF .oe-pb{animation:miLidB2 1.6s ease-in-out .5s infinite}
.mi-cta{margin-top:8px;display:inline-flex;align-items:center;gap:10px;padding:15px 34px;border-radius:999px;border:0;cursor:pointer;font:900 16px system-ui;color:#111;
  background:linear-gradient(135deg,#ffe7a3,#f7c948 45%,#c9a14a);box-shadow:0 12px 44px rgba(247,201,72,.4);opacity:0;animation:miPop .5s cubic-bezier(.3,1.6,.5,1) both}
.mi-cta:hover{filter:brightness(1.08)}

/* panneaux « verre fumé » en amande */
.mi-glass{background:linear-gradient(160deg,rgba(26,24,18,.9),rgba(8,8,10,.92));border:1px solid rgba(201,161,74,.4);border-radius:34px/28px;box-shadow:0 40px 100px rgba(0,0,0,.75),inset 0 1px 0 rgba(255,231,163,.1)}

/* graphique 3D (plan incliné, mouvement de grue) */
.mi-plan{position:relative;width:min(1180px,90vw);transform-style:preserve-3d;animation:miGrue 4s cubic-bezier(.3,.6,.2,1) both;margin-top:6vh}
@keyframes miGrue{0%{transform:rotateX(64deg) rotateZ(-9deg) translateY(170px) scale(.86)}45%{transform:rotateX(26deg) rotateZ(-2deg) translateY(16px) scale(1)}100%{transform:rotateX(12deg) rotateZ(0) translateY(-4px) scale(1.05)}}
.mi-plan>.mi-glass{padding:16px 18px 10px}
.mi-plan svg{display:block;width:100%;height:auto;overflow:visible}
.mi-grille line{stroke:rgba(201,161,74,.1);stroke-width:1}
.mi-plan .cd{opacity:0;transform-box:fill-box;transform-origin:50% 100%;animation:miCandle .22s cubic-bezier(.2,.8,.2,1) both}
@keyframes miCandle{from{opacity:0;transform:scaleY(.05)}to{opacity:1;transform:none}}
.mi-plan .geo{fill:none;stroke:#f7c948;stroke-width:3.2;stroke-linejoin:round;stroke-linecap:round;filter:drop-shadow(0 0 8px rgba(247,201,72,.9));stroke-dasharray:var(--l);stroke-dashoffset:var(--l);animation:miDraw .9s cubic-bezier(.5,0,.2,1) both}
@keyframes miDraw{to{stroke-dashoffset:0}}
.mi-plan .lv{opacity:0;animation:miLv .35s cubic-bezier(.2,.9,.2,1) both}
@keyframes miLv{from{opacity:0;transform:translateX(70px)}to{opacity:1;transform:none}}
.mi-plan .lv line{stroke-width:2.2}.mi-plan .lv text{font:900 14px system-ui;letter-spacing:.05em}
.mi-fond-mot{position:absolute;left:0;right:0;top:50%;margin-top:-.5em;text-align:center;font:900 clamp(80px,16vw,300px)/1 system-ui;letter-spacing:.04em;color:transparent;-webkit-text-stroke:1.5px rgba(247,201,72,.18);opacity:0;animation:miFondMot 4s linear both;white-space:nowrap}
@keyframes miFondMot{0%{opacity:0;transform:translateX(14%)}8%{opacity:1}92%{opacity:1}100%{opacity:0;transform:translateX(-14%)}}
.mi-finder{position:absolute;right:3%;top:-10%;min-width:310px;padding:18px 22px;border-radius:28px/24px;background:linear-gradient(160deg,#1b170b,#0b0a06);border:1px solid #c9a14a;
  box-shadow:0 30px 70px rgba(0,0,0,.8),0 0 0 6px rgba(247,201,72,.08),0 0 60px rgba(247,201,72,.2);opacity:0;animation:miFlip .6s cubic-bezier(.2,.9,.2,1) both}
@keyframes miFlip{0%{opacity:0;transform:perspective(900px) rotateY(80deg) translateZ(140px)}100%{opacity:1;transform:perspective(900px) rotateY(-8deg) translateZ(60px)}}
.mi-finder .t{display:flex;align-items:center;gap:8px;font:900 12px system-ui;letter-spacing:.22em;color:#f7c948}
.mi-finder .t i{width:9px;height:9px;border-radius:50%;background:#2be3a9;box-shadow:0 0 12px #2be3a9}
.mi-finder .s{margin-top:9px;font:800 16px system-ui;color:#fff}.mi-finder .s b{color:#2be3a9}
.mi-finder .g{display:flex;gap:18px;margin-top:12px}.mi-finder .g div{display:flex;flex-direction:column;gap:3px}
.mi-finder .g small{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:#8a95a8}.mi-finder .g b{font:800 16px ui-monospace,Consolas,monospace}
.mi-bar{height:7px;border-radius:7px;background:#22201a;margin-top:12px;overflow:hidden}
.mi-bar i{display:block;height:100%;width:0;border-radius:7px;background:linear-gradient(90deg,#b0820f,#f7c948,#ffe7a3);animation:miFill 1s cubic-bezier(.2,.8,.2,1) both}
@keyframes miFill{to{width:var(--w)}}

/* communauté : carrousel 3D */
.mi-scene3d{position:relative;width:380px;height:280px;transform-style:preserve-3d;margin-top:8vh}
.mi-carrousel{position:absolute;inset:0;transform-style:preserve-3d;animation:miTourne 2s cubic-bezier(.45,0,.2,1) both}
@keyframes miTourne{0%{transform:translateZ(-330px) rotateY(55deg)}100%{transform:translateZ(-330px) rotateY(-95deg)}}
.mi-post{position:absolute;inset:0;padding:18px 20px;display:flex;flex-direction:column;gap:10px}
.mi-post .u{display:flex;align-items:center;gap:10px}.mi-post .av{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font:900 17px system-ui;color:#111;background:linear-gradient(135deg,#ffe7a3,#c9a14a)}
.mi-post .u b{font-size:15px}.mi-post .u small{display:block;color:#8a95a8;font-size:12px}
.mi-post p{margin:0;font-size:14.5px;line-height:1.4;color:#d7dce6}.mi-post p em{font-style:normal;color:#f7c948;font-weight:800}
.mi-post svg.mi-sp{width:100%;height:42px}
.mi-post .x{display:flex;gap:14px;font:800 13px system-ui;color:#c9a14a;margin-top:auto}.mi-post .x span{display:flex;align-items:center;gap:6px}.mi-post .x .mi-ico{width:16px;height:16px}
.mi-iris{display:inline-block;width:22px;height:12px;border-radius:50%;border:1.5px solid #c9a14a;position:relative}.mi-iris:after{content:"";position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:#f7c948}

/* Éclaireurs : visages en profondeur (parallaxe) */
.mi-faces{position:relative;width:min(1000px,90vw);height:min(440px,52vh);transform-style:preserve-3d;margin-top:8vh}
.mi-face{position:absolute;top:50%;left:50%;border-radius:50%;background:#111 center/cover no-repeat;border:2px solid rgba(247,201,72,.75);box-shadow:0 30px 80px rgba(0,0,0,.8),0 0 0 8px rgba(247,201,72,.08);opacity:0;animation:miFace 2s cubic-bezier(.2,.8,.2,1) both}
@keyframes miFace{0%{opacity:0;transform:translate(var(--x0),-50%) translateZ(-900px)}25%{opacity:1}100%{opacity:1;transform:translate(var(--x1),-50%) translateZ(var(--z))}}
.mi-badge{position:absolute;left:50%;bottom:0;translate:-50% 0;display:inline-flex;align-items:center;gap:8px;padding:7px 18px;border-radius:999px;font:900 13px system-ui;letter-spacing:.16em;background:#f7c948;color:#111;white-space:nowrap}
.mi-live{position:absolute;left:50%;top:0;translate:-50% 0;display:flex;gap:10px;align-items:center;z-index:3}
.mi-live b{padding:6px 14px;border-radius:999px;background:#ff3b5c;color:#fff;font:900 13px system-ui;letter-spacing:.16em;box-shadow:0 0 30px rgba(255,59,92,.5)}
.mi-live b:before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#fff;margin-right:7px;vertical-align:1px}
.mi-live span{padding:6px 14px;border-radius:999px;background:rgba(0,0,0,.65);border:1px solid rgba(255,255,255,.12);font:800 13px ui-monospace,Consolas,monospace;color:#fff;display:flex;gap:7px;align-items:center}
.mi-live .mi-iris{width:16px;height:9px;border-color:#fff}.mi-live .mi-iris:after{width:4px;height:4px;margin:-2px 0 0 -2px;background:#fff}
.mi-bulle{position:absolute;max-width:300px;padding:10px 15px;border-radius:20px 20px 20px 6px;background:rgba(22,19,11,.94);border:1px solid rgba(201,161,74,.45);font-size:14px;line-height:1.35;box-shadow:0 14px 40px rgba(0,0,0,.6);z-index:3}
.mi-bulle b{color:#f7c948;margin-right:6px}

/* formation + marketplace : cascade en profondeur */
.mi-casc{position:relative;width:min(1100px,92vw);height:min(420px,50vh);transform-style:preserve-3d;margin-top:8vh}
.mi-ringp{position:absolute;left:3%;top:50%;margin-top:-95px;width:190px;height:190px;opacity:0;animation:miSlam .45s cubic-bezier(.2,.9,.2,1) both}
.mi-ringp svg{width:100%;height:100%;transform:rotate(-90deg)}
.mi-ringp circle{fill:none;stroke-width:12}.mi-ringp .bgc{stroke:#1d1b15}.mi-ringp .fg{stroke:url(#miGold);stroke-linecap:round;stroke-dasharray:302;stroke-dashoffset:302;animation:miRingF 1.6s cubic-bezier(.3,.7,.2,1) both;filter:drop-shadow(0 0 8px rgba(247,201,72,.7))}
@keyframes miRingF{to{stroke-dashoffset:36}}
.mi-ringp b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:2px;font:900 36px system-ui;color:#fff}
.mi-prod{position:absolute;top:50%;width:min(230px,19vw);padding:14px;display:flex;flex-direction:column;gap:9px;opacity:0;animation:miProd .5s cubic-bezier(.2,.9,.2,1) both}
@keyframes miProd{0%{opacity:0;transform:translateY(-50%) translateZ(700px) rotateX(-35deg)}100%{opacity:1;transform:translateY(-50%) translateZ(var(--z,0px)) rotateY(var(--ry,0deg))}}
.mi-prod .im{aspect-ratio:4/3;border-radius:20px/16px;background:linear-gradient(135deg,#2e2510,#0d0c08);position:relative;overflow:hidden;display:grid;place-items:center}
.mi-prod .im svg{width:46%;height:46%}
.mi-prod b{font-size:14px}.mi-prod small{color:#f7c948;font:800 13px system-ui}

/* commandes : passer, son, ne plus afficher, chapitres */
.mi-skip{position:absolute;top:calc(18px + env(safe-area-inset-top));right:20px;z-index:8;display:inline-flex;align-items:center;gap:8px;padding:9px 18px;border-radius:999px;
  border:1px solid rgba(201,161,74,.55);background:rgba(10,10,12,.7);color:#f2e3b5;font:800 13.5px system-ui;cursor:pointer;backdrop-filter:blur(6px);transition:background .2s,color .2s}
.mi-skip:hover{background:#f7c948;color:#111}
.mi-son{position:absolute;top:calc(18px + env(safe-area-inset-top));right:132px;z-index:8;display:inline-flex;align-items:center;gap:9px;padding:8px 16px 8px 12px;border-radius:999px;
  border:1px solid rgba(201,161,74,.4);background:rgba(10,10,12,.7);color:#c9a14a;font:800 13px system-ui;cursor:pointer;backdrop-filter:blur(6px);transition:background .2s,color .2s,border-color .2s}
.mi-son[hidden]{display:none}
.mi-son svg{width:30px;height:16px;overflow:visible}.mi-son .o,.mi-son .i{opacity:0;transition:opacity .25s}.mi-son .f{transition:opacity .25s}
.mi-son.on{color:#f7c948;border-color:#c9a14a}.mi-son.on .o,.mi-son.on .i{opacity:1}.mi-son.on .f{opacity:0}
.mi-son.on .i{animation:miSonIris 1s ease-in-out infinite}
@keyframes miSonIris{0%,100%{transform:translateX(-2px)}50%{transform:translateX(2px)}}
.mi-son:not(.on){animation:miSonAppel 2s ease-in-out infinite}
@keyframes miSonAppel{0%,100%{box-shadow:0 0 0 0 rgba(247,201,72,0)}50%{box-shadow:0 0 0 7px rgba(247,201,72,.16)}}
.mi-son:hover{background:#f7c948;color:#111}
.mi-never{position:absolute;left:20px;bottom:calc(22px + env(safe-area-inset-bottom));z-index:8;display:flex;align-items:center;gap:8px;font-size:12.5px;color:#8a95a8;cursor:pointer}
.mi-never input{accent-color:#f7c948;width:15px;height:15px}
.mi-chap{position:absolute;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));translate:-50% 0;z-index:8;display:flex;gap:10px}
.mi-chap i{width:34px;height:4px;border-radius:4px;background:rgba(255,255,255,.14);overflow:hidden;position:relative}
.mi-chap i b{position:absolute;inset:0;width:0;background:#f7c948;animation:miChap linear both}
@keyframes miChap{to{width:100%}}
.mi-render .mi-skip,.mi-render .mi-son,.mi-render .mi-never,.mi-render .mi-chap{display:none}
/* Paramètres : réglages de la présentation */
.mi-opt{display:flex;align-items:center;gap:10px;margin:8px 0;cursor:pointer}.mi-opt input{accent-color:var(--gold2);width:17px;height:17px}
@media (max-width:760px){
  .mi-finder{right:2%;top:-14%;min-width:0;scale:.78}.mi-prod{width:28vw}.mi-ringp{scale:.6}.mi-chap{display:none}.mi-son{right:110px}.mi-mot{font-size:9vw}.mi-lettres{font-size:5vw}
}