.tour-page{background:#edf3f7}.tour-page .top{padding:.45rem 1rem;min-height:64px}.tour-page .top h1{font-size:1.25rem}.tour-page .top .eyebrow{font-size:.7rem}.tour-page main{max-width:none;padding:.6rem .8rem 1rem}.tour-toolbar{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.6rem}.tour-mode{display:grid;gap:.15rem}.tour-mode strong{color:#174b65;font-size:.95rem}.tour-mode span{font-size:.8rem;color:#385b70}.tour-controls{display:flex;gap:.55rem;align-items:center}.tour-controls>label{display:flex;align-items:center;gap:.45rem;font-size:.8rem}.tour-controls select{font:inherit;border:1px solid #a9bfce;background:#fff;color:#142d45;padding:.5rem;border-radius:.5rem;min-height:44px}.tour-controls button{font-size:.85rem;white-space:nowrap;min-height:44px}.tour-stage{background:#fff;border:1px solid #c3d2dc;border-radius:.65rem;overflow:hidden}.tour-capture{background:#192a39;padding:0;display:grid;place-items:center}.tour-page #capture{display:block;width:100%;height:max(440px,calc(100dvh - 330px));aspect-ratio:auto}.tour-capture rect{fill:#ffc54120;stroke:#ffca43;stroke-width:4;vector-effect:non-scaling-stroke}.tour-capture .zone-marker circle{fill:#e6edf4;stroke:#18344a;stroke-width:1.5}.tour-capture .zone-marker[aria-current=step] circle{fill:#ffd04b;stroke:white;stroke-width:3}.tour-capture .zone-marker text{font-size:28px}.tour-timer{height:4px;background:#dbe6ef;overflow:hidden}.tour-timer span{display:block;height:100%;width:100%;background:#d69915;transform:scaleX(0);transform-origin:left}.tour-annotation{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr) minmax(0,.9fr);gap:1rem;padding:1rem 1.15rem;align-items:start;border-top:1px solid #cbd8e1}.annotation-title{display:flex;gap:.7rem}.annotation-title>span{background:#ffca43;border-radius:.6rem;min-width:2.5rem;height:2.5rem;display:grid;place-items:center;font-size:1.25rem;font-weight:850}.annotation-title h2{font-size:1.3rem;line-height:1.2;margin:.25rem 0 .4rem}.annotation-title #step-status{font-size:.75rem;color:#365d72;font-weight:750}.annotation-title #zone-location{font-size:.9rem;line-height:1.4;color:#456077}.annotation-copy{border-left:3px solid #dfaa2a;padding-left:1rem}.annotation-copy #zone-observe{font-size:1.05rem;font-weight:650;line-height:1.4}.annotation-copy #zone-detail{margin-top:.45rem;color:#3a566b;font-size:.9rem;line-height:1.45}.annotation-media{display:grid;gap:.5rem}.annotation-media .zone-videos{margin:0;gap:.4rem}.annotation-media button{font-size:.8rem;padding:.45rem .65rem;min-height:42px}.annotation-media .video-launch{gap:.15rem}.annotation-media small{font-size:.75rem}.annotation-media .capture-note{margin:0;font-size:.75rem}.tour-bottom-controls{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.7rem;margin-top:.65rem}.tour-bottom-controls>button{font-size:.85rem}.tour-bottom-controls .step-nav{justify-content:center;margin:0;gap:.35rem}.tour-bottom-controls .step-nav button{font-size:.8rem;min-height:42px;min-width:2.1rem;padding:.35rem}.tour-tools{display:flex;align-items:center;gap:.6rem;margin:.6rem 0}.tour-tools p{margin-right:auto;font-size:.8rem;color:#3c5c71}.tour-tools button{font-size:.75rem;padding:.4rem .6rem;min-height:40px}.tour-end{padding:.8rem 1rem;background:#e0f2e8;border-left:4px solid #126451;line-height:1.5;font-size:.9rem}.tour-end strong{display:block}.test-separate{display:flex;gap:1rem;align-items:center;justify-content:space-between;padding:1rem;margin-top:.6rem;border:1px solid #c6d6e3;border-radius:.65rem;background:#fff}.test-separate p{font-size:.85rem}.test-separate a{font-size:.85rem;padding:.6rem;border:1px solid #91adbf;font-weight:700;white-space:nowrap}.tour-page #tour-main:fullscreen{overflow:auto;background:#edf3f7;padding:.6rem}.tour-page #tour-main:fullscreen #capture{height:max(440px,calc(100dvh - 245px))}.tour-page #tour-main:fullscreen .tour-tools,.tour-page #tour-main:fullscreen .continue-path,.tour-page #tour-main:fullscreen .test-separate,.tour-page #tour-main:fullscreen .local-note{display:none}
@media(min-width:1800px){.tour-page #capture{height:calc(100dvh - 350px)}.tour-annotation{padding:1rem 1.6rem}.annotation-copy #zone-observe{font-size:1.1rem}}
@media(max-width:1100px){.tour-toolbar{flex-wrap:wrap}.tour-controls{margin-left:auto}.tour-annotation{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr)}.annotation-media{grid-column:1/-1;display:flex;flex-wrap:wrap}.annotation-media .zone-videos{display:flex;flex-wrap:wrap}.tour-tools{flex-wrap:wrap}.tour-tools p{width:100%}.tour-page #capture{height:auto;aspect-ratio:2048/1118}.tour-bottom-controls{grid-template-columns:1fr 1fr}.tour-bottom-controls .step-nav{grid-row:1;grid-column:1/-1}.tour-bottom-controls>button:last-child{justify-self:end}}
@media(max-width:620px){.tour-page .top{flex-direction:row;align-items:center}.tour-page .top h1{font-size:1rem}.tour-page main{padding:.5rem}.tour-toolbar{gap:.5rem}.tour-mode span{font-size:.8rem}.tour-controls{margin:0;flex-wrap:wrap}.tour-controls>label{font-size:.75rem}.tour-controls button{font-size:.8rem}.tour-annotation{display:block;padding:.8rem}.annotation-title h2{font-size:1.2rem}.annotation-copy{margin:.7rem 0}.annotation-media{display:grid}.annotation-media .zone-videos{display:grid}.tour-tools{gap:.4rem}.test-separate{flex-direction:column;align-items:stretch}.test-separate a{white-space:normal}.tour-page #tour-main:fullscreen #capture{height:auto;aspect-ratio:2048/1118}}
.tour-page .top{background:linear-gradient(90deg,#061326 0%,#0b2949 72%,#0d3556 100%);border-bottom:1px solid #b07c16;padding:.65rem 1.2rem}.tour-page .brand{display:flex;align-items:center;gap:.8rem;min-width:0}.tour-page .logo{width:2.8rem;height:2.8rem;flex-shrink:0;display:grid;place-items:center;border-radius:.65rem;background:#ffb600;color:#101c29;font-size:1.55rem;font-weight:850}.tour-page .brand h1{font-size:1.4rem;color:#f2f7fc;margin:0;line-height:1.15}.tour-page .brand .small{font-size:.85rem;color:#bdd4e7;margin-top:.25rem}.tour-page .top .home{font-size:.8rem}.tour-page .zone-marker:focus circle{stroke:white;stroke-width:4}.tour-page:has(:root:fullscreen) #capture{height:max(440px,calc(100dvh - 290px))}html:fullscreen .tour-page #capture{height:max(440px,calc(100dvh - 290px))}
@media(max-width:620px){.tour-page .top{padding:.65rem;flex-wrap:wrap}.tour-page .brand h1{font-size:1.05rem}.tour-page .brand .small{font-size:.75rem}.tour-page .top .home{margin-left:3.6rem}html:fullscreen .tour-page #capture{height:auto}}
/* La capture remplit réellement la largeur, sans bandes latérales ajoutées. */
.tour-page #capture{height:auto;aspect-ratio:2048/1118}.tour-page .tour-capture{background:#101418}.tour-page .tour-annotation{padding:.75rem 1rem}.tour-page .top .logo{width:48px;height:48px}.tour-page .top .brand h1{font-size:clamp(22px,1.5vw,30px)}.tour-page .top .brand .small{font-size:clamp(14px,1vw,18px)}
html:fullscreen .tour-page .top{display:none}html:fullscreen .tour-page #capture{height:max(400px,calc(100dvh - 270px));aspect-ratio:auto}
@media(max-width:1100px){html:fullscreen .tour-page #capture{height:auto;aspect-ratio:2048/1118}}
html:fullscreen .tour-page #capture{height:max(360px,calc(100dvh - 335px))}
@media(max-width:1100px){html:fullscreen .tour-page #capture{height:auto;aspect-ratio:2048/1118}}
@media(prefers-reduced-motion:reduce){.tour-timer span{transition:none!important}}
.tour-page .tour-mode strong{font-size:clamp(20px,1.1vw,30px)}
.tour-page .tour-mode span{font-size:clamp(18px,.95vw,26px);line-height:1.4;max-width:60ch}
.tour-page .annotation-title h2{font-size:clamp(26px,1.4vw,38px)}
.tour-page .annotation-title :is(#zone-location,#step-status){font-size:18px}
.tour-page .annotation-copy #zone-observe{font-size:clamp(22px,1.2vw,32px)}
.tour-page .annotation-copy #zone-detail{font-size:clamp(18px,1vw,28px)}
.tour-page .annotation-media button,.tour-page .annotation-media small,.tour-page .tour-controls button{font-size:18px}
.tour-page .annotation-media .capture-note{font-size:16px;line-height:1.4}
.tour-page .tour-bottom-controls>button{font-size:18px}
.tour-page .tour-tools :is(p,button){font-size:16px}
@media(min-width:1000px){.tour-page.tour-fit #capture{height:var(--tour-fit-height,400px);min-height:0;aspect-ratio:auto}.tour-page .tour-toolbar{align-items:start}.tour-page .tour-controls{flex-wrap:wrap;justify-content:flex-end}}
@media(max-width:650px){.tour-page .annotation-copy #zone-observe{font-size:21px}.tour-page .tour-controls button{font-size:16px}.tour-page .tour-bottom-controls>button{font-size:16px}}
