/* La queue rejoint le même bord inférieur : aucune translation ni séparation. */
#histoire #debut .message-bubble{border:0;border-radius:19px 19px 19px 0;background:#0865da}
#histoire #debut .message-bubble::before{content:'';position:absolute;left:-7px;bottom:0;top:auto;width:10px;height:9px;background:#0865da;border:0;border-radius:0;transform:none;clip-path:polygon(100% 0,100% 100%,0 100%)}
:root{--header-clearance:106px;--rail-clearance:86px;--phone-width:180px}
/* Treize repères discrets, avec le même trait blanc de 1 px. */
.rail-context{min-width:166px}.rail-timeline{width:310px}.rail-stop{width:24px}.rail-mark{width:3px;height:3px}.rail-stop[aria-current] .rail-mark{transform:scale(1.65)}
.chapter-rail[hidden]{display:none!important}
/* Les cadres finaux commencent sous la hauteur réelle de l'en-tête. */
#histoire :is(#application,#telecharger){padding:var(--header-clearance) var(--page-pad) var(--rail-clearance);min-height:100svh}
.is-enhanced #histoire #application{height:125svh;min-height:125svh;padding:0;pointer-events:none}
.is-enhanced #histoire #telecharger{height:calc(100svh + 2px);min-height:calc(100svh + 2px);padding:0;pointer-events:none}
/* ★ 08/10 (iPad : « la dernière section rebondit, impossible de rester dessus »). Quand on
   descend, Safari replie sa barre d'adresse : la fenêtre grandit, mais 100svh reste la PETITE
   hauteur (barre dépliée). Le bas de la page tombait alors avant le début du dernier chapitre :
   on ne le voyait que pendant l'élastique du bas, puis il disparaissait. 100lvh = la GRANDE
   hauteur (barre repliée) : le dernier chapitre est atteint dans les deux cas. */
@supports(height:100lvh){.is-enhanced #histoire #telecharger{height:calc(100lvh + 2px);min-height:calc(100lvh + 2px)}}
.final-screen{position:relative;min-width:0;max-width:100%}
.is-enhanced .final-screen{position:fixed;top:var(--header-clearance);bottom:var(--rail-clearance);left:var(--page-pad);right:var(--page-pad);width:auto;max-width:none;min-height:0;visibility:hidden;opacity:0;pointer-events:none;overflow:hidden}
.is-enhanced .final-screen.is-active{visibility:visible;opacity:1;pointer-events:auto}
#histoire :is(#application,#telecharger) .final-screen .copy{position:relative!important;top:auto!important;bottom:auto!important;left:auto!important;right:auto!important;width:100%!important;max-width:100%!important;min-width:0;transform:none!important}
#histoire :is(#application,#telecharger) .eyebrow{display:flex!important;font:500 12px/1.5 Poppins,sans-serif;margin:0 0 16px}
#histoire :is(#application,#telecharger) h2{font-weight:600;letter-spacing:-.04em;margin:0 0 20px;font-size:clamp(40px,5.1vw,76px)}
#histoire :is(#application,#telecharger) .lead{font-size:18px;line-height:1.6;margin:0;max-width:460px}
.final-app{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);column-gap:40px;align-items:center}
#histoire #application .app-showcase{position:relative!important;inset:auto!important;width:100%!important;height:100%!important;min-height:0;max-height:none;margin:0!important;transform:none!important}
#application .devices{position:absolute;inset:18px 0 125px}
#application .device{width:var(--phone-width)!important;max-width:none!important}
#application .app-identities{bottom:40px;left:0;right:0;min-height:72px;padding:0 20px}
#application .app-identity h3{font-size:clamp(30px,3.2vw,48px);letter-spacing:-.04em}
#application .app-touch-hint{bottom:8px;font-size:12px;line-height:1.5;margin:0}
/* L'inscription dispose de tout le dernier écran. Le rail y est masqué. */
.scene--download::after{content:'';position:absolute;inset:0;background:#04101977;pointer-events:none}
#histoire #telecharger{background-blend-mode:normal}
.is-enhanced .final-download{bottom:max(20px,env(safe-area-inset-bottom));overflow:auto;overscroll-behavior-y:auto;scrollbar-width:thin;scrollbar-color:#7b99918a transparent;padding:16px 4px 24px;outline-offset:-2px}
.final-download{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,500px);grid-template-rows:repeat(4,auto);column-gap:clamp(35px,6vw,100px);row-gap:24px;align-content:center}
#histoire #telecharger .copy{grid-column:1;grid-row:1;align-self:end}
#histoire #telecharger h2{font-size:clamp(38px,4.3vw,64px);line-height:1.07}
#histoire #telecharger .app-acquisition,#telecharger .acquisition-content{display:contents;position:static!important;width:auto;max-width:none;margin:0!important}
#telecharger .store-release{grid-column:1;grid-row:2;margin:0}
#telecharger .release-eyebrow{display:none}
#telecharger .store-badges{display:flex;gap:12px;flex-wrap:wrap}
#telecharger .store-badge{min-height:56px;flex:none;min-width:160px}
#telecharger .play-qr{grid-column:1;grid-row:3;margin:0;align-self:start}
#telecharger .waitlist-form{grid-column:2;grid-row:1/5;align-self:center;width:100%;margin:0}
#telecharger .back-top{position:relative;inset:auto;grid-column:1;grid-row:4;justify-self:start;padding:8px 0;margin:0;font-size:12px}
#telecharger .waitlist-input-row{flex-direction:row;flex-wrap:nowrap;gap:16px}
#telecharger .waitlist-input-row input{flex:1 1 0;min-width:0;width:100%;height:52px}
#telecharger .waitlist-submit{flex:none;width:auto;height:52px}
@media(max-width:1100px) and (min-width:701px){
 .final-download{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);column-gap:24px}
 #telecharger .waitlist-input-row{flex-direction:column}#telecharger .waitlist-input-row input,#telecharger .waitlist-submit{width:100%;flex:none}
 #telecharger .store-badge{min-width:150px}
}
@media(max-width:700px){
 .rail-context{min-width:0}.rail-timeline{width:100%}.rail-stop{width:24px}.rail-mark{width:3px;height:3px}
 #histoire :is(#application,#telecharger) .eyebrow{font-size:11px;margin-bottom:10px;line-height:1.5}
 #histoire :is(#application,#telecharger) h2{font-size:clamp(30px,8.7vw,36px);line-height:1.12;margin:0}
 #histoire #telecharger h2{font-size:32px;max-width:100%;margin-bottom:16px}
 #histoire #telecharger .lead{font-size:14px;line-height:1.55}
 .final-app{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);row-gap:10px;align-items:stretch}
 #application .devices{inset:18px 0 96px}
 #application .app-identities{bottom:31px;min-height:57px;padding:0 20px}
 #application .app-identity h3{font-size:29px;line-height:1.1}
 #application .app-identity::before{height:32px;bottom:3px;left:-14px}
 #application .app-kicker{font-size:9px;line-height:1.5;margin-bottom:8px}
 #application .app-touch-hint{font-size:11px;bottom:3px}
 .final-download{display:flex;flex-direction:column;gap:24px;align-items:stretch;justify-content:flex-start}
 .is-enhanced .final-download{padding:2px 0 24px;scroll-padding-top:8px}
 #telecharger .store-badges{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
 #telecharger .store-badge{min-width:0;min-height:54px;padding:10px 9px;justify-content:center;gap:8px}
 #telecharger .store-badge strong{font-size:13px}#telecharger .store-badge small{font-size:9px}#telecharger .store-badge svg{width:20px;height:24px}
 #telecharger .play-qr{display:none}
 #telecharger .waitlist-input-row{flex-direction:column;gap:16px}
 #telecharger .waitlist-input-row input,#telecharger .waitlist-submit{flex:none;width:100%;height:52px}
 #telecharger .back-top{align-self:flex-start;flex:none;font-size:12px;margin-top:0}
}
@media(prefers-reduced-motion:reduce){
 #histoire :is(#application,#telecharger) .final-screen .copy{opacity:1!important;visibility:visible!important}
 #histoire #application .app-showcase{height:65svh!important;min-height:350px}
 #histoire #telecharger .final-download{overflow:visible;min-height:0}
}