/* v10 : pluie d'étoiles, étapes lisibles, caméra, paiement */
.sr{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:6}
.sr i{position:absolute;top:-30px;opacity:0;animation:srf linear forwards}
.sr i.st{clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);filter:drop-shadow(0 0 4px rgba(255,214,120,.9))}
.sr i.gl{border-radius:50%;width:5px!important;height:5px!important;box-shadow:0 0 6px #FFD36B}
.sr b{position:absolute;top:-10px;width:2.5px;height:2.5px;border-radius:50%;background:#FFE9A8;opacity:0;animation:srf linear forwards;box-shadow:0 0 5px #FFD36B}
@keyframes srf{0%{opacity:0;transform:translate(0,0) rotate(0)}10%{opacity:1}85%{opacity:.9}100%{opacity:0;transform:translate(var(--x,0),105vh) rotate(var(--r,0deg))}}
.loopg{animation:loopg 2.8s cubic-bezier(.45,.05,.45,1) .35s both}
@keyframes loopg{0%{transform:translate(0,0) rotate(0)}12.5%{transform:translate(39px,-16px) rotate(45deg)}25%{transform:translate(55px,-55px) rotate(90deg)}37.5%{transform:translate(39px,-94px) rotate(135deg)}50%{transform:translate(0,-110px) rotate(180deg)}62.5%{transform:translate(-39px,-94px) rotate(225deg)}75%{transform:translate(-55px,-55px) rotate(270deg)}87.5%{transform:translate(-39px,-16px) rotate(315deg)}100%{transform:translate(0,0) rotate(360deg)}}
.act .stx{background:#fff;color:#0E2B2A;border:3px solid var(--c);border-radius:22px;align-items:flex-start;gap:12px;padding:16px;backdrop-filter:none}
.act .stx.o1{--c:#F4A340}.act .stx.o2{--c:#A7D7C7}.act .stx.o3{--c:#7B61C9}
.stx .sn,.stx .num{position:static!important;width:42px;height:42px;border-radius:50%;background:var(--c)!important;color:#0E2B2A!important;border:0!important;font:inherit;font-size:19px;font-weight:800;display:grid;place-items:center;flex:none;cursor:pointer}
.stx .sn.done,.stx .num.done{background:#0E2B2A!important;color:#FBF4EA!important}
.stx .sb{flex:1;min-width:0}.stx .sb b{font-size:20px;line-height:1.25;display:block}.stx .sb>span{display:block;font-size:16px;color:#0E2B2A;opacity:.8;margin-top:4px;line-height:1.35}
.stx .kid{margin-top:10px;background:#FFF6E8;border-radius:14px;padding:8px 12px;font-size:15px;font-weight:700;line-height:1.35}.stx .kid em{font-style:normal;font-size:20px;margin-right:6px}
.stx .pz.mini{width:64px;border-width:4px;flex:none}.stx .pill{background:#fff;color:#0E2B2A;border:2px solid rgba(14,43,42,.14)}
.btn.svb{background:#fff;color:#0E2B2A;border:2px solid #0E2B2A;box-shadow:none}
.enc{font-size:22px;font-weight:800;line-height:1.3;max-width:320px;text-align:center;color:var(--ink)}
.cam{position:fixed;inset:0;z-index:80;background:#000;display:flex;flex-direction:column}.cam video{flex:1;width:100%;object-fit:cover;min-height:0}
.camb{display:flex;align-items:center;justify-content:space-between;padding:18px 20px calc(18px + env(safe-area-inset-bottom,0px));background:#000}.shut{width:74px;height:74px;border-radius:50%;border:5px solid #fff;background:#F4A340;cursor:pointer}
.ptg{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
button.pt{position:relative;font:inherit;color:var(--ink);background:var(--card);border:2px solid var(--edge);border-radius:22px;padding:14px 6px 10px;display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;min-height:118px;justify-content:center}
button.pt b{font-size:15px}button.pt small{font-size:11px;opacity:.75}button.pt.on{border-color:#F4A340;background:rgba(244,163,64,.18)}
button.pt.on::after{content:'✓';position:absolute;top:6px;right:8px;width:22px;height:22px;border-radius:50%;background:#F4A340;color:#0E2B2A;font-size:13px;font-weight:800;display:grid;place-items:center}
button.pt .rm{position:absolute;top:6px;left:8px;width:22px;height:22px;border-radius:50%;background:rgba(0,0,0,.35);color:#fff;font-size:11px;display:grid;place-items:center;text-decoration:none}
.addv{display:flex;gap:10px}.addv .fi{flex:1;min-width:0}.addv .btn{flex:none;min-height:50px;padding-inline:18px}
.qn{font:inherit;font-weight:700;font-size:14px;color:var(--ink);background:var(--card);border:1.5px solid var(--edge);border-radius:99px;padding:9px 14px;cursor:pointer}
.stk[hidden]{display:none!important}.stk{display:flex;flex-direction:column;gap:10px}
.pi{width:46px;height:32px;border-radius:8px;display:grid;place-items:center;font-weight:800;font-size:13px;color:#fff;background:#0E2B2A;flex:none}.pi0{background:#F3EEE3;font-size:20px}.pi1{background:#fff;color:#4285F4;border:1.5px solid #ddd}.pi2{background:#000}.pi3{background:#0070BA}
.pcd2 .pt b,.pcd2 .pm,.pcd2 .pt{color:#0E2B2A!important}

/* v11 : étapes, matériel, fiche */
.mtl{list-style:none;padding:0;margin:10px 0 0;display:flex;flex-direction:column;gap:10px}.mtl li{padding-left:20px;position:relative}.mtl li::before{content:'•';position:absolute;left:3px;color:#7B61C9;font-weight:900}.mtl b{display:block;font-size:17px}.mtl small{display:block;font-size:14px;color:#2c4a49;opacity:.9}
.act .stx{position:relative}.stx .pz.mini{position:absolute;top:14px;right:14px;width:54px}
.stx .sb b,.stx .sb>span{padding-right:62px}
.stx .acts{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:12px;flex-wrap:nowrap}
.stx .acts .pill{margin:0!important;padding:9px 12px;font-size:14px;white-space:nowrap;flex:none}.stx .acts .pill.rd{margin-left:auto!important}
.cl2{display:flex;flex-direction:column;gap:4px}
.fiche.big{font-size:20px}.fch{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.fch span{background:#FFF6E8;border:2px solid #F4A340;border-radius:99px;padding:6px 14px;font-weight:800;font-size:17px}
.fimg{text-align:center;margin:14px 0;background:#F3EEE3;border-radius:20px;padding:14px}.fimg p{font-weight:700;margin:6px 0 0;font-size:18px}
.fml{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}.fml li{display:flex;gap:12px;align-items:center}.fml .ei{font-size:34px;flex:none;width:44px;text-align:center}.fml b{display:block;font-size:21px;line-height:1.25}.fml small{display:block;font-size:17px;color:#2c4a49}
.fs2{display:flex;gap:12px;align-items:flex-start;margin:14px 0;padding:14px;border:3px solid #E9DFCB;border-radius:20px}.fn{flex:none;width:44px;height:44px;border-radius:50%;background:#F4A340;display:grid;place-items:center;font-weight:900;font-size:24px}
.ft2{flex:1;min-width:0}.ft2 b{display:block;font-size:24px;line-height:1.2}.ft2 span{display:block;font-size:20px;margin-top:4px}.fk2{margin-top:8px;background:#FFF6E8;border-radius:14px;padding:8px 12px;font-size:19px;font-weight:700}
.fz{flex:none}.flr{display:flex;align-items:center;gap:12px;justify-content:space-between}.flr p{font-size:21px;font-weight:700;margin:0}.flz{display:flex;gap:6px;flex:none}
.stx .sb,.stx .sb b,.stx .sb>span{text-align:left!important}
.stx .acts{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:nowrap;width:100%}
.stx .acts .pill{width:auto;height:auto;min-height:44px;display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:99px;flex:none;white-space:nowrap;margin:0}
.stx .acts .pill.bk{padding:6px 14px 6px 6px;margin-right:auto}
.stx .acts .pill.rd{margin-left:auto;padding:8px 14px}
.stx .acts .pill.rd svg{width:20px;height:20px;flex:none;display:block;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.stx .acts .pill.rd span{display:inline}


.phg{transform-box:fill-box;transform-origin:50% 55%;animation:phf 3.2s ease-in-out infinite alternate}
@keyframes phf{from{transform:translate(-4px,6px) rotate(-2deg) scale(1.02)}to{transform:translate(5px,-8px) rotate(2.2deg) scale(1.07)}}
.phg.loopg{animation:phl 2.6s linear .2s both}
@keyframes phl{0%{transform:translate(0,0) rotate(0) scale(1.04)}12.5%{transform:translate(32px,-13px) rotate(45deg) scale(1.03)}25%{transform:translate(46px,-46px) rotate(90deg) scale(1.0)}37.5%{transform:translate(32px,-78px) rotate(135deg) scale(.97)}50%{transform:translate(0,-92px) rotate(180deg) scale(.95)}62.5%{transform:translate(-32px,-78px) rotate(225deg) scale(.97)}75%{transform:translate(-46px,-46px) rotate(270deg) scale(1.0)}87.5%{transform:translate(-32px,-13px) rotate(315deg) scale(1.03)}100%{transform:translate(0,0) rotate(360deg) scale(1.04)}}
.wsp{animation:wsp linear infinite both}
@keyframes wsp{from{translate:420px 0}to{translate:-460px 0}}
line.stk{animation:stk 1.9s linear infinite both;opacity:0}
@keyframes stk{0%{translate:380px 0;opacity:0}15%{opacity:.7}85%{opacity:.7}100%{translate:-60px 0;opacity:0}}
.tws{transform-box:fill-box;transform-origin:center;animation:tws 1.9s ease-in-out infinite}
@keyframes tws{0%,100%{scale:.3;opacity:.2}50%{scale:1.3;opacity:1}}
.flyw .lt{opacity:0}.flyw .lt circle{stroke-dasharray:0 100}
.go .lt{animation:ltf 2.6s linear .2s both}.go .lt circle{animation:ltd 2.6s linear .2s both}
@keyframes ltf{0%{opacity:0}8%{opacity:1}80%{opacity:1}100%{opacity:0}}
@keyframes ltd{from{stroke-dasharray:0 100}to{stroke-dasharray:100 0}}
@media (prefers-reduced-motion:reduce){.flyw *{animation:none!important}.flyw .lt{display:none}}