:root{
  /* Charte Groupe Connectt : rouge #E2493C, gris #7A7E7E, blanc. Thème clair unique. */
  color-scheme:light;
  --bg:#F5F5F4; --surface:#FFFFFF; --sunk:#ECEDED; --ink:#202425; --muted:#5F6567; --line:#DCDFDF;
  --accent:#E2493C; --accent-strong:#D63E31; --accent-ink:#C3372A; --accent-soft:#FDECE9; --on-accent:#FFFFFF; --brandgrey:#7A7E7E;
  --ok:#13805A; --ok-soft:#DFF3EA; --ko:#B4530B; --ko-soft:#FCEBD9;
  --map-land:#FFFFFF; --shadow:0 1px 2px rgba(32,36,37,.06),0 8px 24px rgba(32,36,37,.07);
  --display:"Bricolage Grotesque","Avenir Next","Segoe UI",system-ui,sans-serif;
  --body:"Figtree","Segoe UI",system-ui,-apple-system,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html,body{min-height:100%}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.5;padding-inline:16px;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
button,input,select{font:inherit;color:inherit}
button{touch-action:manipulation}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:8px}

/* ---------- Barre haute ---------- */
.bar{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:color-mix(in srgb,var(--bg) 92%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);margin-inline:-16px;padding:10px 16px;border-bottom:1px solid var(--line)}
.bar-in{max-width:760px;margin:0 auto;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px}
.brand{font-family:var(--display);font-weight:800;font-size:16px;letter-spacing:-.01em;white-space:nowrap}
.brand b{color:var(--accent)}
.pips{display:grid;grid-template-columns:repeat(20,1fr);gap:3px;min-width:0}
.pip{height:5px;border-radius:3px;background:var(--sunk);transition:background .25s}
.pip.done{background:var(--ink)}
.pip.now{background:var(--accent)}
.chrono{font-family:var(--mono);font-weight:700;font-variant-numeric:tabular-nums;font-size:15px;padding:4px 10px;border-radius:999px;background:var(--surface);border:1px solid var(--line);min-width:86px;text-align:center}
.chrono.run{border-color:var(--accent)}
@media (max-width:560px){ .bar{padding-block:8px} .bar-in{grid-template-columns:1fr auto;row-gap:8px} .pips{grid-column:1/-1;grid-row:2} }

/* ---------- Scène ---------- */
main{max-width:760px;margin:0 auto;padding-block:20px 0}
.qview{display:flex;flex-direction:column;min-height:calc(100svh - 70px)}
.qbody{flex:1;padding-bottom:24px;animation:qin .22s ease-out}
@keyframes qin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.qhead{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.qnum{font-family:var(--mono);font-weight:700;font-size:13px;color:var(--accent-ink);letter-spacing:.04em}
.tag{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);background:var(--sunk);border-radius:999px;padding:3px 10px}
h1.q{font-family:var(--display);font-weight:800;font-size:clamp(24px,6.2vw,38px);line-height:1.1;letter-spacing:-.02em;margin:0 0 6px;text-wrap:balance}
.hint{color:var(--muted);margin:0 0 14px;max-width:60ch;font-size:15px}
.zone{margin-top:16px}
.testnote{margin-top:16px;font-size:14px;padding:10px 12px;border-radius:10px;background:var(--ok-soft);color:var(--ok);font-weight:600}

/* ---------- Barre d'action collée en bas + chrono de question ---------- */
.dock{position:sticky;bottom:0;z-index:15;margin-inline:-16px;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));background:color-mix(in srgb,var(--bg) 90%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--line)}
.dock-in{max-width:760px;margin:0 auto;display:flex;align-items:center;gap:10px}
.qtrack{position:absolute;left:0;right:0;top:-1px;height:4px;background:transparent;overflow:hidden}
.qfill{height:100%;width:100%;background:var(--ok);transform-origin:left center;transition:background .3s}
.timer{flex:none;display:flex;align-items:baseline;justify-content:center;padding-top:13px;width:52px;height:52px;border-radius:50%;font-family:var(--mono);font-weight:700;font-size:17px;font-variant-numeric:tabular-nums;background:var(--surface);border:3px solid var(--ok);color:var(--ink);transition:border-color .3s,color .3s}
.timer small{font-size:10px;font-weight:600;margin-left:1px}
.dock.warn .qfill{background:#E2A21B}.dock.warn .timer{border-color:#E2A21B}
.dock.alert .qfill{background:var(--accent)}.dock.alert .timer{border-color:var(--accent);color:var(--accent);animation:beat 1s ease-in-out infinite}
@keyframes beat{50%{transform:scale(1.08)}}
.btn{border:0;border-radius:14px;min-height:52px;padding:12px 22px;font-weight:700;font-size:17px;cursor:pointer;transition:transform .08s,opacity .2s,background .2s;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.btn:active{transform:scale(.98)}
.btn-main{background:var(--accent-strong);color:var(--on-accent)}
.btn-main:disabled{opacity:.35;cursor:not-allowed;transform:none}
.btn-soft{background:var(--surface);color:var(--muted);border:1px solid var(--line);font-size:15px;padding-inline:16px}
.btn-dark{background:var(--ink);color:var(--bg)}
.btn-ghost{background:transparent;color:var(--muted);padding:10px 4px;min-height:0;font-weight:600;font-size:15px;text-decoration:underline;text-underline-offset:3px}
.dock .btn-main{flex:1}
.timeup{position:fixed;left:50%;top:42%;transform:translate(-50%,-50%);z-index:40;background:var(--ink);color:var(--bg);font-family:var(--display);font-weight:800;font-size:clamp(22px,6vw,30px);padding:16px 26px;border-radius:18px;box-shadow:var(--shadow);animation:popc .25s ease-out;text-align:center}
.timeup small{display:block;font-family:var(--body);font-weight:600;font-size:14px;opacity:.75}
.locked .zone{pointer-events:none;opacity:.6}

/* ---------- Choix (QCM) ---------- */
.choices{display:grid;gap:10px}
.choices.row{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.choice{display:flex;align-items:center;gap:14px;text-align:left;background:var(--surface);border:2px solid var(--line);border-radius:16px;padding:14px 16px;min-height:60px;font-size:17px;font-weight:600;line-height:1.3;cursor:pointer;transition:border-color .15s,background .15s,transform .08s}
.choice:active{transform:scale(.99)}
@media (hover:hover){.choice:hover{border-color:var(--muted)}}
.choice .key{flex:none;width:32px;height:32px;border-radius:10px;display:grid;place-items:center;font-family:var(--mono);font-size:14px;background:var(--sunk);color:var(--muted)}
.choice[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft)}
.choice[aria-pressed="true"] .key{background:var(--accent);color:var(--on-accent)}
@media (max-width:520px){.choices.row{grid-template-columns:1fr}}

/* ---------- Médias ---------- */
.media{display:flex;justify-content:center;margin-bottom:6px}
.media img{max-height:min(300px,32svh);width:auto;border-radius:14px;background:#fff;padding:8px}
.ph{display:grid;place-items:center;text-align:center;gap:6px;background:repeating-linear-gradient(135deg,var(--sunk) 0 10px,var(--surface) 10px 20px);border:2px dashed var(--line);color:var(--muted);font-weight:600;font-size:14px;padding:16px}
.ph svg{width:32px;height:32px;opacity:.7}
.media img.photo{padding:0;background:none;object-fit:cover;border-radius:16px;box-shadow:var(--shadow)}
.media img.photo.portrait{max-height:min(320px,34svh)}
.media img.photo.wide{width:auto;max-width:100%;max-height:min(380px,38svh)}
.herologo{width:56px;height:56px;border-radius:14px;display:block}
.ph.round{width:min(200px,46vw);aspect-ratio:1;border-radius:50%}
.ph.portrait{width:min(200px,46vw);aspect-ratio:5/6.4;border-radius:14px}

/* ---------- Texte libre ---------- */
.field{display:flex;flex-direction:column;gap:6px;max-width:520px}
.field label{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.inp{width:100%;background:var(--surface);border:2px solid var(--line);border-radius:14px;padding:14px 16px;font-size:18px;font-weight:600;outline:none;transition:border-color .15s,box-shadow .15s;min-height:56px}
.inp:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}
.inp::placeholder{color:var(--muted);opacity:.7;font-weight:500}
.multi{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}

/* ---------- Frise ---------- */
.frise{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:66px 22px 18px;position:relative}
.frise .yearbubble{position:absolute;top:12px;transform:translateX(-50%);background:var(--accent);color:var(--on-accent);font-family:var(--mono);font-weight:700;font-size:22px;padding:6px 14px;border-radius:12px;pointer-events:none;white-space:nowrap}
.frise .yearbubble::after{content:"";position:absolute;left:50%;bottom:-6px;margin-left:-6px;border:6px solid transparent;border-bottom:0;border-top-color:var(--accent)}
.frise .yearbubble.idle{background:var(--sunk);color:var(--muted)}
.frise .yearbubble.idle::after{border-top-color:var(--sunk)}
.range{-webkit-appearance:none;appearance:none;width:100%;height:44px;background:transparent;cursor:pointer;margin:0;touch-action:pan-y}
.range::-webkit-slider-runnable-track{height:6px;background:var(--ink);border-radius:3px}
.range::-moz-range-track{height:6px;background:var(--ink);border-radius:3px}
.range::-webkit-slider-thumb{-webkit-appearance:none;width:34px;height:34px;border-radius:50%;background:var(--accent);border:5px solid var(--surface);box-shadow:0 0 0 2px var(--accent),0 2px 8px rgba(0,0,0,.2);margin-top:-14px}
.range::-moz-range-thumb{width:26px;height:26px;border-radius:50%;background:var(--accent);border:5px solid var(--surface);box-shadow:0 0 0 2px var(--accent)}
.ticks{display:flex;justify-content:space-between;font-family:var(--mono);font-size:11px;color:var(--muted);margin-top:4px;font-variant-numeric:tabular-nums}
.nudge{display:flex;gap:10px;justify-content:center;margin-top:14px}
.nudge button{border:1px solid var(--line);background:var(--bg);border-radius:12px;min-height:44px;padding:8px 18px;font-weight:700;cursor:pointer}
@media (max-width:420px){.ticks span:nth-child(even){visibility:hidden}}

/* ---------- Carte ---------- */
.mapwrap{display:grid;place-items:center;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:12px}
.map{width:100%;max-width:480px;max-height:56svh;height:auto;touch-action:manipulation;cursor:crosshair;display:block}
.map .land{fill:var(--map-land);stroke:var(--ink);stroke-width:2.2;stroke-linejoin:round}
.map .pin path{fill:var(--accent)}
.map .pin circle{fill:var(--surface)}
.map .zonetest{fill:var(--ok);fill-opacity:.18;stroke:var(--ok);stroke-width:2;stroke-dasharray:6 5}
.mapcap{font-size:14px;color:var(--muted);margin:8px 0 0;text-align:center}

/* ---------- Trouver Xavier ---------- */
.findwrap{position:relative}
.crowdscroll{overflow:auto;-webkit-overflow-scrolling:touch;border-radius:16px;background:#fff;border:1px solid var(--line);overscroll-behavior:contain;max-height:min(640px,62svh)}
.crowd{position:relative;width:100%;cursor:crosshair;user-select:none;-webkit-user-select:none}
.crowd img{display:block;width:100%;height:auto;pointer-events:none}
.crowd .mk{position:absolute;width:34px;height:44px;transform:translate(-50%,-100%);pointer-events:none}
.crowd .boxtest{position:absolute;border:2px dashed var(--ok);background:rgba(22,130,90,.12);pointer-events:none}
.swipehint{display:none;font-size:13px;color:var(--muted);text-align:center;margin:8px 0 0}
.zoomctl{position:absolute;right:10px;top:10px;display:flex;flex-direction:column;gap:8px;z-index:3}
.zoomctl button{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-size:24px;font-weight:700;line-height:1;cursor:pointer;box-shadow:var(--shadow)}
.zoomctl button:disabled{opacity:.35;cursor:default}
@media (max-width:700px){ .swipehint{display:block} }

/* ---------- Chômage : reconstitution ---------- */
.builder{display:grid;grid-template-columns:minmax(200px,280px) 1fr;gap:24px;align-items:start}
.stagebox{background:#FBFAF8;border:1px solid var(--line);border-radius:18px;padding:10px;display:grid;place-items:center}
.chm{position:relative;width:100%;max-width:260px;aspect-ratio:360/677}
.chm img,.chm svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.chm .ghost{opacity:.16;filter:grayscale(1)}
.chm.grey img{filter:grayscale(1) contrast(.9)}
.opts{display:flex;flex-direction:column;gap:16px;min-width:0}
.optrow h3{margin:0 0 8px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.optbtns{display:flex;gap:10px;flex-wrap:wrap}
.opt{display:flex;flex-direction:column;align-items:center;gap:4px;background:var(--surface);border:2px solid var(--line);border-radius:14px;padding:6px 6px 6px;cursor:pointer;font-size:13px;font-weight:600;min-width:92px;flex:none}
.opt[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft)}
.opt .crop{width:84px;height:76px;overflow:hidden;position:relative;border-radius:10px;background:#FBFAF8}
.opt .crop .chm{position:absolute;width:104px;max-width:none;left:-10px;top:-2px}
.swatch{width:44px;height:44px;border-radius:50%;border:2px solid rgba(0,0,0,.12);margin:16px 20px}
@media (max-width:640px){
  .builder{grid-template-columns:1fr;gap:14px}
  .stagebox{padding:6px}
  .stagebox .chm{max-width:none;width:auto;height:min(34svh,280px)}
  .optbtns{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scroll-snap-type:x mandatory}
  .opt{scroll-snap-align:start;min-width:88px}
  .opt .crop{width:76px;height:68px}.opt .crop .chm{width:94px;left:-9px}
  .swatch{margin:12px 16px}
}

/* ---------- Puzzle ---------- */
.puzzle{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;width:min(100%,420px,52svh);aspect-ratio:1;margin:0 auto;background:var(--line);padding:4px;border-radius:16px}
.tile{border:0;border-radius:8px;cursor:pointer;background-size:300% 300%;transition:transform .12s,box-shadow .12s;padding:0}
.tile.sel{transform:scale(.92);box-shadow:0 0 0 4px var(--accent)}
.puzzle.solved{background:var(--ok)}
.pzcap{text-align:center;color:var(--muted);font-size:14px;margin-top:10px}

/* ---------- Tape-Chômage ---------- */
.whack{position:relative;background:linear-gradient(#9CCB6E,#6FA24B);border-radius:20px;padding:56px 12px 16px;user-select:none;-webkit-user-select:none;touch-action:manipulation;overflow:hidden;cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 44 44'%3E%3Crect x='19' y='14' width='6' height='28' rx='3' fill='%235F5D68'/%3E%3Crect x='6' y='3' width='32' height='15' rx='4' fill='%2317161C'/%3E%3C/svg%3E") 22 10,pointer}
.whud{position:absolute;left:14px;right:14px;top:12px;display:flex;justify-content:space-between;align-items:center;gap:10px;color:#1D3510;font-weight:700;font-size:14px}
.wscore{white-space:nowrap;font-family:var(--mono);font-size:18px;background:#17161C;color:#fff;padding:4px 12px;border-radius:999px;font-variant-numeric:tabular-nums}
.holes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px 12px;max-width:560px;margin:0 auto}
.hole{position:relative;aspect-ratio:1/.92;overflow:hidden}
.hole .pit{position:absolute;left:8%;right:8%;bottom:6%;height:26%;border-radius:50%;background:radial-gradient(ellipse at 50% 40%,#2A1A0E 0 55%,#4A2F18 70%)}
.hole .mole{position:absolute;left:10%;right:10%;bottom:14%;transform:translateY(105%);transition:transform .09s ease-out;cursor:inherit}
.hole .mole img{display:block;width:100%;height:auto;pointer-events:none}
.hole.up .mole{transform:translateY(0)}
.hole.peek .mole{transform:translateY(64%)}
.hole.hit .mole{animation:bonked .38s ease-in forwards}
@keyframes bonked{0%{transform:translateY(0)}30%{transform:translateY(6%) scale(1.08,.76)}100%{transform:translateY(110%) scale(1)}}
.hole .lip{position:absolute;left:0;right:0;bottom:0;height:20%;background:linear-gradient(#7B5230,#5E3D22);border-radius:50% 50% 12px 12px/40% 40% 12px 12px;pointer-events:none}
.bonkfx{position:absolute;pointer-events:none;font-family:var(--display);font-weight:800;font-size:22px;color:#fff;text-shadow:0 2px 0 #17161C;transform:translate(-50%,-50%);animation:pop .5s ease-out forwards;z-index:4}
@keyframes pop{0%{opacity:1;transform:translate(-50%,-50%) scale(.6)}60%{opacity:1;transform:translate(-50%,-90%) scale(1.15)}100%{opacity:0;transform:translate(-50%,-120%) scale(1)}}
.whack.done .holes{opacity:.35}
.wdone{position:absolute;inset:0;display:grid;place-items:center;text-align:center;font-family:var(--display);font-weight:800;font-size:clamp(28px,7vw,44px);color:#fff;text-shadow:0 3px 0 #17161C}
@media (max-width:520px){ .holes{gap:2px 8px} .whack{padding-inline:8px} }

/* ---------- Messages, reprise ---------- */
.notice{padding:12px 16px;border-radius:12px;background:var(--ko-soft);color:var(--ko);font-weight:600;max-width:62ch;margin:0}
.notice.info{background:var(--sunk);color:var(--ink)}
.resume{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:14px 16px;border:2px solid var(--accent);border-radius:16px;background:var(--accent-soft)}
.resume p{margin:0;flex:1 1 220px;font-weight:600}
.resume .btn{flex:1 1 200px}
.spin{display:inline-block;width:18px;height:18px;border:3px solid currentColor;border-right-color:transparent;border-radius:50%;animation:rot .8s linear infinite;vertical-align:-3px}
@keyframes rot{to{transform:rotate(360deg)}}
@keyframes popc{0%{transform:translate(-50%,-50%) scale(.9);opacity:0}100%{transform:translate(-50%,-50%) scale(1);opacity:1}}

/* ---------- Formulaire ---------- */
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-ink)}
.lead{font-size:17px;max-width:52ch;margin:0;color:var(--ink)}
.startform{display:grid;gap:12px}
.startform .field{max-width:none}
.startform .btn{width:100%}
.finehint{color:var(--muted);font-size:13px;margin:0}

/* ---------- Accueil : Le grand concours des 20 ans ---------- */
body.landing .bar{display:none}
body.landing main{padding-top:0;max-width:none}
.land{display:grid;gap:22px;padding-block:8px 48px}
.hero{position:relative;isolation:isolate;margin-inline:-16px;padding:28px 16px 34px;overflow:hidden;background:
  radial-gradient(120% 80% at 100% 0%,#FDEBE8 0%,rgba(253,235,232,0) 60%),
  radial-gradient(90% 70% at 0% 100%,#EEF0F0 0%,rgba(238,240,240,0) 65%),#FFFFFF;border-bottom:1px solid var(--line)}
.hero-in{max-width:1040px;margin:0 auto;display:grid;grid-template-columns:1.1fr .9fr;grid-template-areas:'head head' 'lead card' 'cta card';column-gap:40px;row-gap:0;align-items:center}
.htext{grid-area:head}.hlead{grid-area:lead;align-self:end}.voucherwrap{grid-area:card}.ctarow{grid-area:cta;align-self:start}
.hero20{position:absolute;z-index:-1;right:-3%;top:-8%;font-family:var(--display);font-weight:800;font-size:clamp(300px,52vw,620px);line-height:.8;letter-spacing:-.06em;color:transparent;-webkit-text-stroke:2px rgba(226,73,60,.16);user-select:none;pointer-events:none}
.conf{position:absolute;z-index:-1;border-radius:2px;opacity:.7;animation:drift 7s ease-in-out infinite alternate}
@keyframes drift{from{transform:translateY(0) rotate(var(--r,0deg))}to{transform:translateY(-14px) rotate(calc(var(--r,0deg) + 25deg))}}
.brandrow{display:flex;align-items:center;gap:12px}
.brandrow img{width:46px;height:46px;border-radius:12px;box-shadow:0 4px 14px rgba(122,126,126,.35)}
.brandrow span{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--brandgrey)}
.brandrow b{color:var(--accent-ink)}
.hero h1{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:clamp(38px,8.2vw,86px);line-height:.92;letter-spacing:-.03em;margin:18px 0 0;color:var(--ink);text-wrap:balance}
.hero h1 .l2{display:block}
.hero h1 em{font-style:normal;color:var(--accent);position:relative;white-space:nowrap}
.hero h1 em::after{content:"";position:absolute;left:2%;right:2%;bottom:.04em;height:.12em;background:var(--accent);opacity:.18;border-radius:6px}
.hero .lead{font-size:clamp(17px,2.3vw,20px);line-height:1.45;margin:18px 0 0;max-width:34ch;color:var(--ink)}
.hero .lead strong{color:var(--accent-ink)}
.ctarow{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:24px}
.btn-cta{background:var(--accent-strong);color:#fff;font-size:19px;padding:16px 30px;min-height:60px;border-radius:16px;box-shadow:0 10px 24px rgba(214,62,49,.32);gap:10px}
.btn-cta:hover{background:#C9362A}
.btn-cta svg{width:20px;height:20px;transition:transform .2s}
.btn-cta:hover svg{transform:translateX(3px)}
.ctameta{font-size:14px;color:var(--muted);font-weight:600}
/* Bon d'achat */
.voucherwrap{display:grid;place-items:center;perspective:900px}
.voucher{position:relative;width:min(100%,360px);min-height:210px;gap:12px;border-radius:22px;padding:20px 24px;color:#fff;background:linear-gradient(135deg,#EC5A4C 0%,#E2493C 45%,#C5372A 100%);box-shadow:0 24px 50px rgba(197,55,42,.35),inset 0 1px 0 rgba(255,255,255,.25);transform:rotate(-5deg);animation:float 5s ease-in-out infinite;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between}
@keyframes float{50%{transform:rotate(-3deg) translateY(-8px)}}
.voucher::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.28) 45%,transparent 60%);transform:translateX(-120%);animation:shine 4.5s ease-in-out infinite 1s}
@keyframes shine{0%,60%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
.v-top{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.v-top img{width:34px;height:34px;border-radius:9px}
.v-amount{font-family:var(--display);font-weight:800;font-size:clamp(68px,15vw,92px);line-height:.85;letter-spacing:-.04em;text-shadow:0 3px 0 rgba(0,0,0,.12)}
.v-amount span{font-size:.5em;margin-left:4px;vertical-align:.55em}
.v-sub{font-size:14px;font-weight:600;opacity:.95;border-top:2px dashed rgba(255,255,255,.45);padding-top:10px}
.v-notch{position:absolute;top:58%;width:26px;height:26px;border-radius:50%;background:#FFFFFF}
.v-notch.l{left:-13px}.v-notch.r{right:-13px}
.v-badge{position:absolute;right:-6px;top:-10px;transform:rotate(10deg);background:#fff;color:var(--accent-ink);font-weight:800;font-size:13px;padding:8px 12px;border-radius:999px;box-shadow:var(--shadow);z-index:2}
.voucherbox{position:relative}
@media (max-width:760px){
  .hero{padding-top:20px}
  .hero-in{grid-template-columns:1fr;grid-template-areas:'head' 'lead' 'card' 'cta';row-gap:20px}
  .voucher{width:min(86%,320px);min-height:180px}
}
/* Sections */
.sec{max-width:980px;margin:0 auto;width:100%;display:grid;gap:14px}
.sec h2{font-family:var(--display);font-weight:800;font-size:clamp(24px,4.5vw,32px);letter-spacing:-.02em;margin:0}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;counter-reset:st}
.steps li{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:16px;display:grid;gap:6px;align-content:start;counter-increment:st}
.steps li::before{content:counter(st);width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent-ink);font-family:var(--display);font-weight:800;font-size:17px}
.steps b{font-size:16px}
.steps span{color:var(--muted);font-size:14px;line-height:1.4}
@media (max-width:760px){.steps{grid-template-columns:1fr 1fr}}
@media (max-width:400px){.steps{grid-template-columns:1fr}}
.conds{margin:0;padding:16px 18px 16px 34px;background:var(--surface);border:1px solid var(--line);border-radius:18px;display:grid;gap:8px;font-size:15px;color:var(--ink)}
.conds li::marker{color:var(--accent)}
/* Inscription */
.reg{max-width:560px;width:100%;margin:0 auto;background:var(--surface);border:2px solid var(--accent);border-radius:22px;padding:20px;display:grid;gap:14px;box-shadow:0 18px 40px rgba(226,73,60,.14);scroll-margin-top:16px;animation:qin .3s ease-out}
.reg h2{margin:0;font-family:var(--display);font-size:24px;letter-spacing:-.01em}
.reg .sub{margin:0;color:var(--muted);font-size:14px}
.landfoot{text-align:center;color:var(--muted);font-size:13px;margin:0}
.stickycta{display:none}
@media (max-width:760px){.conf.tb{display:none}}
.stickycta:not(.show){visibility:hidden;pointer-events:none}
@media (max-width:760px){
  .stickycta{display:block;position:sticky;bottom:0;z-index:15;margin-inline:-16px;padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--line)}
  .stickycta .btn{width:100%}
}

/* ---------- Fin ---------- */
.result{display:grid;gap:18px;padding-block:12px 40px;animation:qin .3s ease-out}
.scorecard{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:20px;display:grid;gap:14px;box-shadow:var(--shadow)}
.score{font-family:var(--display);font-weight:800;font-size:clamp(72px,22vw,140px);line-height:.85;letter-spacing:-.04em}
.score small{font-size:.32em;color:var(--muted);letter-spacing:0}
.verdict{font-size:16px;font-weight:600;padding:12px 14px;border-radius:12px}
.verdict.ok{background:var(--ok-soft);color:var(--ok)}
.verdict.ko{background:var(--ko-soft);color:var(--ko)}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;font-family:var(--mono);font-variant-numeric:tabular-nums}
.stats div{background:var(--bg);border-radius:12px;padding:10px 12px}
.stats div span{display:block;font-family:var(--body);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.stats div b{font-size:20px}
.recap{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:6px;margin:0;padding:0;list-style:none}
.recap li{display:flex;gap:10px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px;font-size:14px}
.recap .mark{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:13px}
.recap .y{background:var(--ok-soft);color:var(--ok)}
.recap .n{background:var(--ko-soft);color:var(--ko)}
.recap .n.skip{background:var(--sunk);color:var(--muted)}
.recap em{display:block;font-style:normal;color:var(--muted);font-size:12px}
.testbanner{background:var(--ok);color:#fff;font-weight:700;font-size:13px;text-align:center;padding:6px;margin-inline:-16px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- Backoffice ---------- */
.btn-link{background:none;border:0;padding:0;color:var(--accent);font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:3px;font-size:inherit}
.btn-link.danger{color:var(--ko)}
.ad-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.ad-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.ad-tools .btn{padding:10px 18px;font-size:15px}
.ad-stats{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));margin-bottom:22px}
.ad-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:18px;margin-bottom:18px}
@media (max-width:760px){.ad-grid{grid-template-columns:1fr}}
.ad-card{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px 20px}
.ad-card h2{font-family:var(--display);font-weight:800;font-size:22px;margin:0 0 12px;letter-spacing:-.01em}
.ad-card h2 small{font-family:var(--body);font-weight:600;font-size:13px;color:var(--muted);margin-left:6px;letter-spacing:0}
.ad-card h3{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:18px 0 8px}
.pool{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.pool li{display:grid;grid-template-columns:32px 1fr auto auto;gap:12px;align-items:center;padding:10px 12px;border-radius:10px;background:var(--bg);border:2px solid transparent;transition:background .1s,border-color .1s}
.pool .rk{font-family:var(--mono);font-weight:700;color:var(--muted)}
.pool .nm{font-weight:700;min-width:0;overflow-wrap:anywhere}
.pool .nm em{display:block;font-style:normal;font-weight:500;font-size:12px;color:var(--muted)}
.pool .tm,.pool .sc{font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:14px}
.pool li.hl{background:var(--accent-soft);border-color:var(--accent)}
.pool li.win{background:var(--ok-soft);border-color:var(--ok)}
.drawctl{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin:6px 0 14px}
.drawctl label{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);width:100%}
.inp.sel{width:auto;padding:10px 16px;font-size:16px;border-radius:12px}
.winner{display:grid;gap:2px;padding:16px;border-radius:14px;background:var(--ok-soft);color:var(--ok)}
.winner strong{font-family:var(--display);font-size:28px;line-height:1.1;color:var(--ink);margin-top:6px}
.winner em{font-style:normal;font-size:13px;color:var(--muted)}
.winner.fresh{animation:pop2 .45s ease-out}
@keyframes pop2{0%{transform:scale(.94);opacity:0}100%{transform:scale(1);opacity:1}}
.hist{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:14px}
.hist em{font-style:normal;color:var(--muted)}
.ad-tablehead{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.ad-tablehead h2{margin:0}
.inp.search{max-width:320px;padding:10px 16px;font-size:15px}
.tablewrap{overflow-x:auto}
.ad-table{width:100%;border-collapse:collapse;font-size:14px;min-width:760px}
.ad-table th{text-align:left;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:8px 10px;border-bottom:1px solid var(--line)}
.ad-table td{padding:10px;border-bottom:1px solid var(--line);vertical-align:middle}
.ad-table .num{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums}
.ad-table .mail{color:var(--muted);overflow-wrap:anywhere}
.ad-table tr.top td{background:var(--accent-soft)}
.ad-table .empty{text-align:center;color:var(--muted);padding:28px}
.chip{display:inline-block;font-size:12px;font-weight:700;padding:3px 9px;border-radius:999px;background:var(--sunk);color:var(--muted);white-space:nowrap}
.chip.ok{background:var(--ok-soft);color:var(--ok)}
.chip.wait{background:var(--ko-soft);color:var(--ko)}

/* ---------- Choix illustrés : secteurs et logos d'entités ---------- */
.choice .ico{flex:none;width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent-ink)}
.choice .ico svg{width:30px;height:30px}
.choice .ico img{width:40px;height:40px;object-fit:contain}
.choices.cards{grid-template-columns:repeat(3,1fr)}
.choices.cards .choice{flex-direction:column;justify-content:center;text-align:center;padding:18px 12px;min-height:150px}
.choice[aria-pressed="true"] .ico{background:var(--accent);color:#fff}
.choices.logos{grid-template-columns:repeat(2,minmax(0,1fr))}
.choices.logos .choice{flex-direction:column;align-items:stretch;padding:10px;gap:8px;text-align:center}
.choice .logo{display:grid;place-items:center;height:96px;border-radius:12px;background:#fff;border:1px solid var(--line);overflow:hidden;padding:10px}
.choice .logo img{max-width:100%;max-height:100%;object-fit:contain}
.choices.logos .lbl{font-size:14px;color:var(--muted)}
.wordmark{font-family:var(--display);font-size:clamp(15px,4.4vw,24px);font-weight:600;letter-spacing:-.02em;color:var(--brandgrey);white-space:nowrap}
.wordmark b{font-weight:800;color:var(--accent)}
.wm-bref b{color:#202425}
@media (max-width:520px){
  .choices.cards{grid-template-columns:1fr}
  .choices.cards .choice{flex-direction:row;justify-content:flex-start;text-align:left;min-height:64px;padding:12px 14px}
  .choice .logo{height:78px;padding:8px 6px}
  .choices.logos .choice{padding:8px}
}

/* ---------- v7 : 8 secteurs en grille, 6 logos, sélection marquée ---------- */
.choices.sectors{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.choices.sectors .choice{flex-direction:column;justify-content:flex-start;align-items:center;text-align:center;gap:10px;padding:14px 8px 12px;min-height:0}
.choices.sectors .ico{width:64px;height:64px;border-radius:16px;background:none;padding:0}
.choices.sectors .ico img{width:64px;height:64px}
.choices.sectors .choice[aria-pressed="true"] .ico{background:none}
.choices.sectors .lbl{font-size:14px;line-height:1.25;font-weight:600}
.choices.logos{grid-template-columns:repeat(3,minmax(0,1fr))}
.choices.sectors .choice,.choices.logos .choice{position:relative;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease}
.choices.sectors .choice[aria-pressed="true"],.choices.logos .choice[aria-pressed="true"]{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent),0 10px 24px -12px rgba(214,62,49,.55);transform:translateY(-2px)}
.choices.sectors .choice[aria-pressed="true"]::after,.choices.logos .choice[aria-pressed="true"]::after{content:"✓";position:absolute;top:-9px;right:-9px;width:26px;height:26px;border-radius:50%;background:var(--accent-strong);color:#fff;font-weight:800;font-size:15px;display:grid;place-items:center;box-shadow:0 2px 6px rgba(0,0,0,.18)}
.choices.sectors .choice[aria-pressed="false"]:has(~ .choice[aria-pressed="true"]),.choices.sectors .choice[aria-pressed="true"] ~ .choice{opacity:.7}
.choices.logos .choice[aria-pressed="false"]:has(~ .choice[aria-pressed="true"]),.choices.logos .choice[aria-pressed="true"] ~ .choice{opacity:.7}
@media (max-width:720px){
  .choices.sectors{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .choices.sectors .choice{flex-direction:row;justify-content:flex-start;text-align:left;padding:10px;gap:10px}
  .choices.sectors .ico,.choices.sectors .ico img{width:40px;height:40px}
  .choices.sectors .lbl{min-width:0;overflow-wrap:anywhere}
  .choices.sectors .lbl{font-size:13.5px}
  .choices.logos{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ---------- v8 : estimation au curseur ---------- */
.estim{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 0 4px;user-select:none;-webkit-user-select:none}
.bignum{font-family:var(--display);font-weight:800;font-size:clamp(84px,26vw,168px);line-height:1;letter-spacing:-.04em;font-variant-numeric:tabular-nums;color:var(--line-strong,#C9C6C1);transition:color .2s}
.estim.on .bignum{color:var(--accent-ink)}
.bignum.up{animation:bumpUp .22s ease-out}.bignum.down{animation:bumpDown .22s ease-out}
@keyframes bumpUp{0%{transform:translateY(8px) scale(.96)}100%{transform:none}}
@keyframes bumpDown{0%{transform:translateY(-8px) scale(.96)}100%{transform:none}}
.bnlab{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:14px}
.estctl{display:flex;align-items:center;gap:8px;width:100%;max-width:640px}
.stp{flex:none;min-width:52px;height:52px;padding:0 10px;border-radius:14px;border:2px solid var(--line);background:var(--surface);font-family:var(--mono);font-weight:700;font-size:16px;color:var(--ink);cursor:pointer;touch-action:manipulation;transition:border-color .15s,transform .08s}
.stp:hover{border-color:var(--accent)}.stp:active{transform:scale(.94);background:var(--accent-soft)}
.estctl input[type=range]{flex:1;min-width:0;-webkit-appearance:none;appearance:none;height:14px;border-radius:999px;background:linear-gradient(90deg,var(--accent) var(--p,50%),var(--sunk) var(--p,50%));outline:none;cursor:pointer;margin:0 4px}
.estctl input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:34px;height:34px;border-radius:50%;background:#fff;border:4px solid var(--accent-strong);box-shadow:0 3px 10px rgba(0,0,0,.2);cursor:grab}
.estctl input[type=range]::-moz-range-thumb{width:28px;height:28px;border-radius:50%;background:#fff;border:4px solid var(--accent-strong);box-shadow:0 3px 10px rgba(0,0,0,.2);cursor:grab}
.estctl input[type=range]:focus-visible{box-shadow:0 0 0 4px var(--accent-soft)}
.scale{display:flex;justify-content:space-between;width:100%;max-width:470px;font-family:var(--mono);font-size:12px;color:var(--muted)}
.estcap{font-size:14px;color:var(--muted);margin:8px 0 0}
@media (max-width:520px){ .stp{min-width:44px;height:48px;font-size:14px;padding:0 6px} .estctl{gap:5px} .scale{max-width:62%} }

/* ---------- v8 : fondateurs en photo ---------- */
.choices.people{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.choices.people .choice{flex-direction:column;align-items:center;text-align:center;gap:10px;padding:16px 8px 14px;position:relative}
.choice .face{width:112px;height:112px;border-radius:50%;overflow:hidden;background:var(--accent-soft);display:grid;place-items:center;border:3px solid #fff;box-shadow:0 4px 14px rgba(0,0,0,.12)}
.choice .face img{width:100%;height:100%;object-fit:cover}
.choice .face .initials{font-family:var(--display);font-weight:800;font-size:36px;color:var(--accent-ink)}
.choices.people .lbl{font-size:15px;line-height:1.25}
.choices.people .choice[aria-pressed="true"]{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent),0 10px 24px -12px rgba(214,62,49,.55);transform:translateY(-2px)}
.choices.people .choice[aria-pressed="true"] .face{border-color:var(--accent)}
.choices.people .choice[aria-pressed="true"]::after{content:"✓";position:absolute;top:-9px;right:-9px;width:26px;height:26px;border-radius:50%;background:var(--accent-strong);color:#fff;font-weight:800;font-size:15px;display:grid;place-items:center}
@media (max-width:520px){ .choices.people{gap:8px} .choice .face{width:76px;height:76px} .choice .face .initials{font-size:26px} .choices.people .lbl{font-size:13px} .choices.people .choice{padding:12px 4px} }
/* v8 : vignettes cheveux plus hautes pour voir la longueur */
.opt[data-g="hair"] .crop .chm{width:66px;left:9px;top:0}
@media (max-width:520px){ .opt[data-g="hair"] .crop .chm{width:60px;left:8px} }

/* ---------- v9 : année en grand chiffre ---------- */
.estim.year .bignum{letter-spacing:-.03em}

/* ---------- v9 : recouvrement, étapes à remettre dans l'ordre ---------- */
.media .ph.banner,.media img.photo.banner{width:100%;height:clamp(96px,18svh,150px);aspect-ratio:auto;border-radius:16px;object-fit:cover}
.order{display:grid;gap:18px}
.otrack{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;position:relative;counter-reset:s}
.otrack::before{content:"";position:absolute;left:12%;right:12%;top:17px;height:4px;border-radius:4px;background:repeating-linear-gradient(90deg,var(--line) 0 10px,transparent 10px 18px)}
.order.full .otrack::before{background:linear-gradient(90deg,#F29A2E,#2F86C9,#D63E31,#3F4448)}
.oslot{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;min-width:0}
.onum{position:relative;z-index:1;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-family:var(--mono);font-weight:700;font-size:16px;background:var(--surface);border:2px dashed var(--line);color:var(--muted);transition:all .2s}
.oslot.on .onum{border:2px solid var(--ink);background:var(--ink);color:#fff}
.ohold{width:100%;min-height:150px;border-radius:18px;border:2px dashed var(--line);background:color-mix(in srgb,var(--surface) 60%,transparent);display:grid;place-items:stretch}
.oslot.on .ohold{border-color:transparent;background:none}
.oempty{align-self:center;justify-self:center;font-size:13px;font-weight:600;color:var(--muted);opacity:.8}
.opool{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;min-height:150px}
.ocard{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;gap:10px;width:100%;padding:16px 10px 14px;border-radius:18px;border:2px solid color-mix(in srgb,var(--c) 30%,var(--line));background:var(--surface);color:var(--ink);cursor:pointer;box-shadow:0 6px 18px -12px color-mix(in srgb,var(--c) 70%,transparent);transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease;touch-action:manipulation}
.ocard:hover{transform:translateY(-2px);border-color:var(--c)}
.ocard:active{transform:scale(.97)}
.oico{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;background:var(--c);color:#fff;box-shadow:inset 0 -3px 0 rgba(0,0,0,.12)}
.oico svg{width:30px;height:30px}
.otxt{display:flex;flex-direction:column;gap:3px;min-width:0}
.otxt b{font-size:15px;line-height:1.2}
.otxt small{font-size:12.5px;color:var(--muted);line-height:1.25}
.ocard.placed{border-color:var(--c);background:color-mix(in srgb,var(--c) 8%,var(--surface));box-shadow:0 10px 24px -14px var(--c)}
.ocard .ox{position:absolute;top:6px;right:8px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:15px;line-height:1;color:var(--muted);background:var(--sunk)}
.ocard.fresh{animation:odrop .28s cubic-bezier(.2,1.4,.4,1)}
@keyframes odrop{0%{transform:translateY(24px) scale(.9);opacity:.3}100%{transform:none;opacity:1}}
.odone{grid-column:1/-1;align-self:center;text-align:center;font-size:14px;color:var(--muted);margin:0}
.order.full .opool{min-height:0}
@media (max-width:720px){
  .order{gap:14px}
  .otrack{grid-template-columns:1fr;gap:8px}
  .otrack::before{left:18px;right:auto;top:20px;bottom:20px;width:4px;height:auto;background:repeating-linear-gradient(180deg,var(--line) 0 10px,transparent 10px 18px)}
  .order.full .otrack::before{background:linear-gradient(180deg,#F29A2E,#2F86C9,#D63E31,#3F4448)}
  .oslot{flex-direction:row;align-items:center;gap:10px}
  .onum{flex:none}
  .ohold{min-height:62px}
  .ocard{flex-direction:row;text-align:left;padding:9px 12px;gap:12px}
  .oico{flex:none;width:42px;height:42px;border-radius:12px}.oico svg{width:24px;height:24px}
  .otxt b{font-size:14.5px}.otxt small{font-size:12px}
  .opool{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;min-height:0}
  .opool .ocard{flex-direction:column;text-align:center;padding:12px 8px;gap:8px}
  .ocard .ox{top:50%;transform:translateY(-50%)}
}
/* v9 : recouvrement plus compact sur téléphone (tout tient sans défiler ou presque) */
@media (max-width:720px){
  .media .ph.banner,.media img.photo.banner{height:76px;padding:8px;font-size:12.5px;gap:2px}
  .media .ph.banner svg{width:20px;height:20px}
  .otrack{gap:6px}
  .onum{width:32px;height:32px;font-size:14px}
  .ohold{min-height:50px;border-radius:14px}
  .ocard{border-radius:14px}
  .ocard.placed{padding:6px 10px;gap:10px}
  .ocard.placed .oico{width:34px;height:34px;border-radius:10px}.ocard.placed .oico svg{width:20px;height:20px}
  .ocard.placed .otxt small{display:none}
  .opool .ocard{flex-direction:row;text-align:left;padding:8px 10px;gap:8px;min-height:56px}
  .opool .oico{width:34px;height:34px;border-radius:10px}.opool .oico svg{width:20px;height:20px}
  .opool .otxt b{font-size:13.5px}.opool .otxt small{display:none}
  .otrack::before{left:14px;top:16px;bottom:16px}
}

/* ---------- v10 : code de vérification ---------- */
.codeinp{font-family:var(--mono);font-size:26px;letter-spacing:.5em;text-align:center;max-width:260px}
.codehint{font-size:14px;color:var(--muted);margin:4px 0 0}
#chg{margin-top:4px;align-self:flex-start}