/* ─────────────────────────────────────────────────────────────
   Écran « deal » — Figma 788:4247 « Flow 14 · deal-detail-go »
   La créatrice reçoit l'offre : vidéo de la marque, speech, gain, « Hold to accept ».
   Coordonnées Figma (390 × 844). Animé par deal.js (rAF, transform / opacity).
   ───────────────────────────────────────────────────────────── */
.scr--deal{background:#050505}
.scr--deal p{margin:0}

/* fond : la vidéo de la marque (Figma : image 419 × 744 en 0,0) */
.scr--deal .dl-video{position:absolute;left:0;top:0;width:419px;height:744px;background:#050505 center/cover no-repeat}

/* voiles Figma */
.scr--deal .dl-vig{position:absolute;inset:0;
  background:radial-gradient(139.29px 301.43px at 195px 422px,rgba(0,0,0,0) 0,rgba(0,0,0,0) 70%,rgba(0,0,0,.32) 100%)}
.scr--deal .dl-gtop{position:absolute;left:0;top:0;width:390px;height:190px;background:linear-gradient(180deg,rgba(5,5,5,.92),rgba(5,5,5,0))}
.scr--deal .dl-gbot{position:absolute;left:0;top:340px;width:390px;height:504px;background:linear-gradient(180deg,rgba(5,5,5,0),rgba(5,5,5,.97))}

.scr--deal .dl-title{position:absolute;left:16px;top:409px;font-size:36px;font-weight:900;line-height:normal;letter-spacing:-1px;white-space:nowrap;color:#fff}

/* téléprompteur « YOUR SPEECH » */
.scr--deal .dl-tp{position:absolute;left:16px;top:471px;width:358px;height:176px;overflow:hidden;
  border:1px solid rgba(255,255,255,.14);border-radius:24px 24px 0 0;
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
.scr--deal .dl-tp-bar{position:absolute;left:15px;top:17px;width:4px;height:20px;border-radius:2px;background:#FE14F3}
.scr--deal .dl-tp-lbl{position:absolute;left:27px;top:19px;font-size:12px;font-weight:700;letter-spacing:1px;line-height:normal;white-space:nowrap}
.scr--deal .dl-tp-vp{position:absolute;left:15px;top:36px;width:330px;height:138px;overflow:hidden;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 15px,#000 100%);mask-image:linear-gradient(180deg,transparent 0,#000 15px,#000 100%)}
.scr--deal .dl-tp-txt{position:absolute;left:0;top:15px;width:326px;font-size:16px;font-weight:400;line-height:1.41;letter-spacing:.5px;
  text-shadow:0 12px 16px rgba(0,0,0,.45);will-change:transform}
.scr--deal .dl-tp-fade{position:absolute;left:-1px;top:166px;width:358px;height:54px;background:linear-gradient(180deg,rgba(8,6,12,0),rgba(8,6,12,.97))}
.scr--deal .dl-tp-track{position:absolute;left:354px;top:48px;width:3px;height:127px;border-radius:999px;background:rgba(255,255,255,.08)}
.scr--deal .dl-tp-thumb{position:absolute;left:354px;top:48px;width:3px;height:56px;border-radius:999px;background:rgba(255,255,255,.45);will-change:transform}

/* feuille du bas : gain + bouton */
.scr--deal .dl-sheet{position:absolute;left:0;top:647px;width:390px;height:197px;overflow:hidden;
  border:1px solid rgba(255,255,255,.08);border-radius:20px 20px 0 0;background:rgba(254,20,243,.06);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.scr--deal .dl-earn-lbl{position:absolute;left:0;top:11px;width:388px;height:16px;text-align:center;font-size:10px;font-weight:700;letter-spacing:1.5px;line-height:normal}
.scr--deal .dl-earn{position:absolute;left:0;top:37px;width:388px;height:42px;text-align:center;font-size:34px;font-weight:900;letter-spacing:-1px;line-height:normal;
  color:#FFDD55;text-shadow:0 0 18px rgba(255,211,77,.35);font-variant-numeric:tabular-nums;will-change:transform}
.scr--deal .dl-earn span{display:inline-block}

.scr--deal .dl-acc-wrap{position:absolute;left:15px;top:89px;width:358px;height:56px;will-change:transform}
.scr--deal .dl-acc-glow{position:absolute;inset:0;border-radius:999px;box-shadow:0 0 44px 4px rgba(254,20,243,.85);opacity:0;will-change:opacity}
.scr--deal .dl-acc{position:absolute;inset:0;overflow:hidden;border-radius:999px;border:3px solid transparent;
  background:linear-gradient(158.64deg,#FE14F3 0%,#C400E8 71.429%) padding-box,linear-gradient(90deg,#00D4FE,#FE14F3) border-box;
  box-shadow:0 0 28px 0 rgba(254,20,243,.5)}
.scr--deal .dl-acc-fillbox{position:absolute;left:-3px;top:-3px;width:358px;height:56px;overflow:hidden}
.scr--deal .dl-acc-fill{position:absolute;left:0;top:0;width:358px;height:56px;background:rgba(255,255,255,.32);transform:translateX(-100%);will-change:transform}
.scr--deal .dl-acc-flash{position:absolute;inset:0;background:#fff;opacity:0;will-change:opacity}
.scr--deal .dl-acc-check{position:absolute;left:85px;top:14px;width:22px;height:22px;will-change:transform}
.scr--deal .dl-acc-lbl{position:absolute;left:119px;top:15px;font-size:16px;font-weight:900;letter-spacing:.3px;line-height:normal;white-space:nowrap}
.scr--deal .dl-acc-chip{position:absolute;left:282px;top:4px;height:40px;padding:10px 14px;border-radius:20px;background:rgba(0,0,0,.22);
  font-size:15px;font-weight:700;line-height:normal;white-space:nowrap;font-variant-numeric:tabular-nums}

/* haut : progression de story, marque, catégorie, fermer */
.scr--deal .dl-prog{position:absolute;left:15px;top:37px;width:358px;height:3px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.22)}
.scr--deal .dl-prog-fill{position:absolute;left:0;top:0;width:358px;height:3px;border-radius:999px;background:#00D4FE;transform:translateX(-310px);will-change:transform}

.scr--deal .dl-brand{position:absolute;left:16px;top:56px;width:249px;height:44px;overflow:hidden;border-radius:15px;
  border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.scr--deal .dl-brand-av{position:absolute;left:5px;top:5px;width:32px;height:32px;border-radius:10px;overflow:hidden;background:#f6f3ef}
.scr--deal .dl-brand-av img{width:32px;height:32px}
.scr--deal .dl-brand-name{position:absolute;left:45px;top:6px;font-size:14px;font-weight:700;line-height:normal;white-space:nowrap}
.scr--deal .dl-brand-loc{position:absolute;left:45px;top:24px;font-size:11px;font-weight:400;line-height:normal;white-space:nowrap;color:rgba(255,255,255,.78)}
.scr--deal .dl-brand-loc b{font-weight:700;color:#00D4FE}

.scr--deal .dl-cat{position:absolute;left:177px;top:64px;width:78px;height:28px;overflow:hidden;border-radius:999px;
  border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.1);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.scr--deal .dl-cat svg{position:absolute;left:10px;top:9px;width:10px;height:10px}
.scr--deal .dl-cat span{position:absolute;left:11px;top:6px;width:64px;text-align:center;font-size:12px;font-weight:700;line-height:normal}

.scr--deal .dl-close{position:absolute;left:333px;top:58px;width:40px;height:40px;border-radius:999px;
  border:1px solid rgba(143,148,158,.18);background:rgba(143,148,158,.08);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.scr--deal .dl-close svg{position:absolute;left:11px;top:11px;width:16px;height:16px}

/* passage d'une offre à la suivante (fondu « story ») */
.scr--deal .dl-veil{position:absolute;inset:0;background:#050505;opacity:0;pointer-events:none;will-change:opacity}
