:root{color-scheme:light dark;--bg:#f6f3ed;--paper:#fffdf9;--ink:#261f29;--muted:#635c67;--line:#d5ced7;--accent:#6640ba;--lav:#e3d8fa;--sun:#f4cf69;--dark:#24212b;--bright:#fff9eb}
@media(prefers-color-scheme:dark){:root{--bg:#18161d;--paper:#25222c;--ink:#faf6ee;--muted:#c5bdcc;--line:#514b5b;--accent:#c5affb;--lav:#383043;--dark:#29252f}}
*{box-sizing:border-box}body{margin:0 auto;width:min(100%,38rem);padding:1.3rem clamp(1rem,5vw,2rem) 3rem;color:var(--ink);background:var(--bg);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.45}header,.split{display:flex;align-items:center;justify-content:space-between;gap:1rem}header{padding-bottom:1.1rem;border-bottom:1px solid var(--line)}.brand{font-size:1.4rem;font-weight:800;letter-spacing:-.07em;color:var(--ink);text-decoration:none}.brand span{color:var(--accent)}.meta,small,#status{color:var(--muted)}.meta{margin-top:1.5rem;font-size:.9rem}h1{font-size:clamp(1.9rem,7vw,2.8rem);line-height:1.08;letter-spacing:-.04em;margin:.7rem 0 1.4rem}h2{font-size:1.15rem}button,input,textarea{font:inherit}button,a.link{display:inline-block;min-height:44px;cursor:pointer;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:.85rem;padding:.75rem 1rem;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.options{display:grid;gap:.55rem}.options label{display:flex;align-items:center;gap:.8rem;padding:.75rem .9rem;border:1px solid var(--line);border-radius:.85rem;background:var(--paper);cursor:pointer;min-height:48px}.options label:has(:checked){border-color:var(--accent);background:var(--lav)}input[type=radio]{accent-color:var(--accent);width:1.1rem;height:1.1rem}button.primary{font-weight:650;background:var(--sun);border-color:transparent;color:#211b24}button:disabled{opacity:.58;cursor:default}.actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.2rem}.result{background:var(--dark);color:var(--bright);border-radius:1.3rem;padding:1.1rem 1.3rem;margin:1rem 0}.number{font-size:clamp(2.9rem,13vw,5rem);font-weight:650;letter-spacing:-.07em;line-height:1}.result p{margin: .4rem 0 1.2rem}.bar{background:#4a4453;height:5px;border-radius:8px;margin:3px 0 9px;overflow:hidden}.bar i{display:block;height:100%;background:#c6b4ee;width:var(--share);border-radius:8px}.bar i.mine{background:var(--sun)}.insight{background:var(--lav);border-radius:1rem;padding:1rem}.insight p{margin:0}.list{padding:0;list-style:none}.list li{margin:.6rem 0}.list a{display:block;color:var(--ink)}#status{min-height:1.4em}.form{display:grid;gap:1rem}.form label{display:grid;gap:.3rem}input:not([type=radio]),textarea{min-width:0;width:100%;background:var(--paper);border:1px solid var(--line);border-radius:.5rem;padding:.6rem;color:var(--ink)}fieldset{border:0;margin:0;padding:0}legend{margin-bottom:.6rem}.admin-link{display:block;overflow-wrap:anywhere}.result strong{font-variant-numeric:tabular-nums}
@media(prefers-reduced-motion:no-preference){.result{animation:arrive .23s ease-out}@keyframes arrive{from{transform:translateY(.3rem);opacity:.7}to{transform:translateY(0);opacity:1}}}

footer{margin-top:2rem;padding-top:1rem;border-top:1px solid var(--line)}footer a,main a{color:var(--accent)}

.list a strong,.list a small{display:block}.list a small{margin-top:.15rem}

/* Private invitation and comparison on narrow screens. */
.duo-intro,.duo-comparison li{background:var(--paper);border:1px solid var(--line);border-radius:1.15rem;padding:1rem 1.1rem}
.duo-intro h2,.duo-comparison h2{margin:.15rem 0 .55rem}
.duo-intro p:last-child,.duo-comparison p:last-child{margin-bottom:.25rem}
.duo-comparison{list-style:none;padding:0;display:grid;gap:.65rem}
.duo-comparison small{color:var(--accent);font-weight:650}
.duo-comparison p{margin:.25rem 0}
.duo-comparison .duo-match{background:var(--lav)}
.duo-secondary{background:transparent}
.duo-page main>.duo-secondary{margin:.25rem 0 .25rem .5rem}

/* Personal result, question progression and end-of-series review. */
.quiz-progress{display:flex;gap:5px;margin:.6rem 0 1rem;height:5px}.quiz-progress i{flex:1;background:var(--line);border-radius:5px}.quiz-progress .done{background:var(--accent)}
.choice-result,.summary-card{color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:1.35rem;padding:clamp(1rem,4vw,1.55rem);overflow-wrap:anywhere}
dialog.choice-result{width:min(30rem,calc(100% - 2rem));max-height:calc(100dvh - 2rem);box-sizing:border-box;margin:auto;overflow-y:auto}
dialog.choice-result::backdrop{background:rgba(20,17,28,.55)}
.choice-result-label{color:var(--muted);margin:.1rem 0 .65rem}.result-personal{border-radius:1rem;background:var(--dark);color:var(--bright);padding:1rem}.result-personal p{margin:.45rem 0 0}.result-personal strong{font-size:clamp(2.8rem,12vw,4rem)}
.chosen-answer{font-weight:650;margin:.85rem 0 .4rem}.personal-insight{margin:0;line-height:1.45}.choice-result .actions{margin-top:.8rem}.quiet-button{background:transparent;color:var(--muted);border:0;text-decoration:underline}.vote-message:empty{display:none}.summary-card{position:relative}.summary-card h2{margin:.25rem 0}.summary-list small{color:var(--muted)}
@media(prefers-reduced-motion:no-preference){.quiz-progress .done{animation:grow-tick .22s ease-out;transform-origin:left}.options label:has(input:checked) input{animation:check-pulse .18s ease-out}dialog.choice-result{animation:arrive .2s ease-out}@keyframes grow-tick{from{transform:scaleX(.55)}to{transform:scaleX(1)}}@keyframes check-pulse{50%{transform:scale(1.14)}}}
.saved-controls{align-items:center}.options:disabled input{opacity:1}.options:disabled label{cursor:default}.options:disabled label:has(:checked){font-weight:650}

/* Guest screens occupy the visible viewport; long screens have real reading pages. */
body.guest-fit:not(.guest-summary):not(.guest-scroll){height:100vh;height:100dvh;display:flex;flex-direction:column;padding:clamp(.45rem,1.5dvh,1rem) clamp(.85rem,3.5vw,1.6rem) max(.25rem,env(safe-area-inset-bottom))}
body.guest-fit:not(.guest-summary):not(.guest-scroll) header,body.guest-fit:not(.guest-summary):not(.guest-scroll) footer,body.guest-fit:not(.guest-summary):not(.guest-scroll) #status{flex:none}
body.guest-fit:not(.guest-summary):not(.guest-scroll) header{padding-bottom:.4rem}
body.guest-fit:not(.guest-summary):not(.guest-scroll) main{flex:1;min-height:0;overflow-wrap:anywhere}
body.guest-fit:not(.guest-summary):not(.guest-scroll) h1{font-size:clamp(1.4rem,min(7vw,5.25dvh),2.5rem);line-height:1.12;margin:.35rem 0 .6rem}
body.guest-fit:not(.guest-summary):not(.guest-scroll) .meta{margin:.45rem 0 .3rem}
body.guest-fit:not(.guest-summary):not(.guest-scroll) .quiz-progress{margin:.3rem 0 .55rem}
body.guest-fit:not(.guest-summary):not(.guest-scroll) .options{gap:.3rem}
body.guest-fit:not(.guest-summary):not(.guest-scroll) .options legend{margin-bottom:.35rem}
body.guest-fit:not(.guest-summary):not(.guest-scroll) .options label{padding:.42rem .65rem;min-height:44px;line-height:1.25}
body.guest-fit:not(.guest-summary):not(.guest-scroll) .options input{flex:none}
body.guest-fit:not(.guest-summary):not(.guest-scroll) .actions{gap:.4rem;margin-top:.55rem}
body.guest-fit:not(.guest-summary):not(.guest-scroll) button{padding:.45rem .7rem}
body.guest-fit:not(.guest-summary):not(.guest-scroll) #status{margin:.35rem 0;min-height:0;overflow-wrap:anywhere}
body.guest-fit:not(.guest-summary):not(.guest-scroll) #status:empty{display:none}
body.guest-fit:not(.guest-summary):not(.guest-scroll) footer{margin:0;padding:0;display:flex;align-items:center;gap:.5rem}
body.guest-fit:not(.guest-summary):not(.guest-scroll) footer a{display:inline-flex;align-items:center;min-height:44px}
.guest-fit :where(main,dialog) [hidden],.guest-pager[hidden]{display:none!important}
.guest-pager{display:flex;gap:.45rem;align-items:center;justify-content:space-between;margin:.2rem 0;flex:none}
.guest-pager span{font-variant-numeric:tabular-nums;color:var(--muted)}
.guest-pager button{min-height:44px}
.choice-result .guest-pager{border-top:1px solid var(--line);padding-top:.3rem}
body.guest-fit:not(.guest-summary):not(.guest-scroll) dialog.choice-result{max-height:calc(100dvh - 1rem);margin:auto}
body.guest-fit:not(.guest-summary):not(.guest-scroll) dialog.choice-result .number{font-size:clamp(2rem,10dvh,4rem)}
@media(max-height:620px){
 body.guest-fit:not(.guest-summary):not(.guest-scroll) .brand{font-size:1.18rem}
 body.guest-fit:not(.guest-summary):not(.guest-scroll) .quiz-progress{height:4px}
 body.guest-fit:not(.guest-summary):not(.guest-scroll) .choice-result{padding:.8rem}
 body.guest-fit:not(.guest-summary):not(.guest-scroll) .result-personal{padding:.65rem .8rem}
 body.guest-fit:not(.guest-summary):not(.guest-scroll) .personal-insight{line-height:1.32}
}
.finish-confetti{position:fixed;inset:0;z-index:10;pointer-events:none;overflow:clip;contain:strict}
.finish-confetti i{position:absolute;left:var(--x);top:-.6rem;width:.42rem;height:.76rem;border-radius:.1rem;background:var(--accent);opacity:0}
.finish-confetti i:nth-child(3n){background:#e9af38}.finish-confetti i:nth-child(3n+1){background:#8e6fe4}.finish-confetti i:nth-child(4n){background:#72b7a3}
@media(prefers-reduced-motion:no-preference){.finish-confetti i{animation:full-fall 1.35s cubic-bezier(.2,.6,.7,1) var(--delay) both}
 @keyframes full-fall{0%{opacity:0;transform:translateY(0) rotate(var(--tilt))}8%{opacity:.95}85%{opacity:.9}100%{opacity:0;transform:translate(var(--drift),103dvh) rotate(calc(var(--tilt) + 260deg))}}}
@media(prefers-reduced-motion:reduce){.finish-confetti{display:none}}
@media(max-width:355px) and (max-height:650px){
 body.guest-fit:not(.guest-summary):not(.guest-scroll) h1{font-size:clamp(1.24rem,5.9vw,1.42rem);letter-spacing:-.035em}
 body.guest-fit:not(.guest-summary):not(.guest-scroll) .options{gap:.2rem}
}

/* Full distribution, shown from 10 votes. */
.result-verdict{margin:0 0 .2rem;font-weight:700}
.result-bars{list-style:none;margin:.7rem 0 0;padding:0;display:grid;gap:.3rem}
.result-bars li{position:relative;overflow:hidden;display:flex;justify-content:space-between;gap:.6rem;padding:.6rem .75rem;border:1px solid var(--line);border-radius:.85rem;background:var(--paper)}
.result-bars li::before{content:"";position:absolute;inset:0 auto 0 0;width:var(--share);background:rgba(137,103,229,.16);transform-origin:left}
.result-bars li>*{position:relative}
.result-bars li.mine{font-weight:700;border:1.5px solid var(--accent)}
.result-bars li.mine::before{background:var(--lav)}.result-bars li.mine strong{color:var(--accent)}

/* Vote au toucher et résultat dans la page, comme sur iPhone. */
.choices{gap:.45rem}.choices legend{color:var(--muted)}
.choice{display:flex;align-items:center;gap:.7rem;width:100%;min-height:48px;text-align:left;font-weight:500}
.choice i{flex:none;display:grid;place-items:center;width:1.65rem;height:1.65rem;border-radius:.45rem;font-style:normal;font-size:.7rem;font-weight:800;color:#302849;background:#C6B5FF}
.choice:nth-of-type(6n+1) i{background:#F5D67C}.choice:nth-of-type(6n+2) i{background:#C6B5FF}.choice:nth-of-type(6n+3) i{background:#A9D9CF}.choice:nth-of-type(6n+4) i{background:#F2AC96}.choice:nth-of-type(6n+5) i{background:#ADCCEF}.choice:nth-of-type(6n) i{background:#E0BDCF}
.choice.picked{border-color:var(--accent);background:var(--lav)}
.choices:disabled .choice:not(.picked){opacity:.5}
.reveal{display:grid;gap:.5rem}
.reveal .result-verdict{justify-self:start;margin:0;padding:.4rem .8rem;border-radius:.85rem;background:var(--dark);color:var(--bright);font-size:1.1rem}
.reveal .result-bars{margin:0}.result-count{margin:0;color:var(--muted);font-size:.85rem}
.reveal .personal-insight{background:var(--lav);padding:.75rem .85rem;border-radius:.85rem}
.people{padding:.75rem;border:1px solid var(--line);border-radius:.85rem;background:var(--paper)}
.people-row{display:flex;justify-content:space-between;gap:2px}.people-row svg{width:8%;max-width:29px;height:auto;fill:var(--line)}.people-row svg.on{fill:var(--accent)}
.people p{margin:.5rem 0 0;font-weight:700}.people strong{color:var(--accent);font-weight:800}
.gauge{padding:.85rem;border:1px solid var(--line);border-radius:1rem;background:var(--paper);display:grid;gap:.55rem}
.gauge h2{margin:0;font-size:1.45rem;letter-spacing:-.04em}.gauge p{margin:0;color:var(--muted)}
.gauge-dots{display:flex;justify-content:space-between}.gauge-dots i{width:1.35rem;height:1.35rem;border-radius:50%;background:var(--bg);border:1px solid var(--line)}.gauge-dots i.on{background:var(--accent);border-color:var(--accent)}
.invite-card{position:relative;overflow:hidden;background:var(--dark);color:var(--bright);border-radius:1.3rem;padding:1.05rem 1.15rem;margin-top:.7rem}
.invite-card h1{margin:.6rem 0 0;font-size:clamp(1.6rem,6.6vw,2.1rem)}
.duo-faces{display:flex;align-items:center;gap:.5rem}.face{display:grid;place-items:center;width:2.8rem;height:2.8rem;border-radius:50%;background:#E5DFFF;color:#382A66;font-weight:800;font-size:.85rem}.face.gold{background:#F5D67C;color:#40351E}.face-link{color:#F5D67C;font-size:1.2rem}
.invite-question{font-size:1.25rem;line-height:1.2;letter-spacing:-.02em;margin:.2rem 0 .7rem}
.mini-card{text-align:center}.mini-card .duo-faces{justify-content:center}.mini-card .face+.face{margin-left:-.7rem}.mini-card h1{font-size:clamp(2.2rem,10vw,2.9rem)}
.turn-name{display:grid;gap:.3rem;margin-bottom:.4rem}
.lanes{display:grid;gap:1rem}.lane-head{display:flex;justify-content:space-between;align-items:baseline}.lane .quiz-progress{height:7px;margin:.4rem 0 0}.quiz-progress .now{background:#B8A5F2}
@media(prefers-reduced-motion:no-preference){
 .reveal.fresh .result-bars li::before{animation:bar-rise .62s cubic-bezier(.23,1,.32,1) calc(var(--order)*50ms) both}
 .reveal.fresh .result-verdict{animation:verdict-pop .3s cubic-bezier(.23,1,.32,1) .5s both}
 .invite-card{animation:card-arrive .32s cubic-bezier(.23,1,.32,1) both}
 .quiz-progress .now{animation:lane-pulse 1.4s ease-in-out infinite}
 @keyframes bar-rise{from{transform:scaleX(0)}to{transform:scaleX(1)}}
 @keyframes verdict-pop{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}
 @keyframes card-arrive{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
 @keyframes lane-pulse{50%{opacity:.45}}
}
.vote-notice{margin:.5rem 0 0;font-size:.8rem;line-height:1.3;color:var(--muted)}