@charset "UTF-8";
:root{--bg:#f7f8fa;--surface:#fff;--ink:#17263b;--muted:#5a6a7e;--teal:#16776a;--teal-dark:#105c53;--soft:#e7f2ef;--border:#dbe2e8;--radius:10px;
  --for:#2f9e6b;--against:#c8463d;--abstain:#c9a227;--none:#cfd6dd;
  --accent:#b46d19;--c1:#7fb77e;--c2:#16776a;--c3:#5ba4c9;--c4:#8a97a6;--c5:#b46d19}
[hidden]{display:none!important}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,"Segoe UI",system-ui,Arial,sans-serif;font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:var(--teal);text-underline-offset:3px}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid #b46d19;outline-offset:3px}
main:focus{outline:none}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif;line-height:1.15;margin:0 0 12px}
h1{font-size:clamp(32px,4.5vw,56px);letter-spacing:-1px}
h2{font-size:clamp(22px,2.6vw,30px)}
h3{font-size:19px}
p{margin:0 0 14px}
.skip{position:fixed;top:-80px;left:16px;z-index:20;background:var(--ink);color:#fff;padding:10px 16px}
.skip:focus{top:10px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}

.header{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;max-width:1180px;margin:0 auto;padding:18px 20px}
.brand{display:flex;align-items:center;gap:10px;font-family:Georgia,serif;font-weight:700;font-size:24px;color:var(--ink);text-decoration:none}
.brand span{color:var(--teal)}
nav{display:flex;gap:6px;flex-wrap:wrap}
nav a{padding:8px 12px;border-radius:8px;color:var(--ink);text-decoration:none;font-weight:500}
nav a:hover{background:var(--soft)}
nav a[aria-current=page]{background:var(--soft);color:var(--teal-dark)}
main{max-width:1180px;margin:0 auto;padding:12px 20px 60px;min-height:70vh}
.footer{border-top:1px solid var(--border);color:var(--muted);font-size:14px;text-align:center;padding:24px 20px}
.loading{color:var(--muted);padding:60px 0;text-align:center}

.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:22px}
.muted{color:var(--muted)}
.small{font-size:14px}
.button{display:inline-flex;align-items:center;gap:8px;border:0;border-radius:999px;padding:12px 22px;background:var(--teal);color:#fff;font-weight:600;text-decoration:none}
.button:hover{background:var(--teal-dark)}
.button.secondary{background:var(--surface);color:var(--ink);border:1px solid var(--border)}
.button.secondary:hover{background:var(--soft)}
.linklike{background:none;border:0;color:var(--teal);text-decoration:underline;padding:0}

/* Accueil */
.hero{text-align:center;padding:48px 0 28px}
.hero h1 em{font-style:normal;color:var(--teal)}
.mantra{color:var(--teal-dark);font-weight:600;margin-bottom:18px}
.notice{padding:12px 16px;border-radius:8px;background:var(--soft);max-width:700px;margin:16px auto}
.official-groups{font-size:14px;margin:12px 0}
.official-groups summary{cursor:pointer;color:var(--teal);padding:8px 0}
.group-table{border-collapse:collapse;width:100%;min-width:420px;margin-top:8px}
.group-table th,.group-table td{text-align:left;padding:8px;border-bottom:1px solid var(--border)}
.group-table td{text-align:center}
.result-head .actions{margin-top:20px}
.rank-score{white-space:nowrap}
.table-wrap{overscroll-behavior-x:contain}
.answers .abstain{grid-column:1/-1;font-weight:500;font-size:15px;padding:10px}
.answers .abstain[aria-pressed=true]{border-color:var(--abstain);background:#fff8de}
.hero .lead{font-size:19px;color:var(--muted);max-width:680px;margin:0 auto 26px}
.actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.blocs-legend{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:34px 0 8px}
.bloc-pill{display:inline-flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:6px 14px;font-size:14px}
.dot{width:12px;height:12px;border-radius:50%;flex:none;display:inline-block}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px}
.steps .card h3{margin-bottom:6px}

/* Test */
.quiz{max-width:760px;margin:0 auto}
.progress{height:6px;background:var(--border);border-radius:6px;overflow:hidden;margin:6px 0 20px}
.progress>span{display:block;height:100%;background:var(--teal);transition:width .2s}
.quiz-top{display:flex;justify-content:space-between;align-items:center;gap:10px;color:var(--muted);font-size:14px}
.theme-chip{display:inline-block;background:var(--soft);color:var(--teal-dark);border-radius:999px;padding:3px 12px;font-size:13px;font-weight:600;margin-bottom:14px}
.question{font-size:clamp(22px,3vw,30px)}
.explication{font-size:16px;line-height:1.5;border-left:3px solid var(--border);padding-left:12px;margin:14px 0 10px}
.context{color:var(--muted);font-size:14px;margin:0 0 22px}
.context summary{cursor:pointer;margin-bottom:6px}
.answers{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.answers button{border:2px solid var(--border);background:var(--surface);border-radius:12px;padding:16px;font-weight:600;font-size:17px}
.answers button:hover{border-color:var(--teal)}
.answers button.agree[aria-pressed=true]{border-color:var(--for);background:#e7f6ee}
.answers button.disagree[aria-pressed=true]{border-color:var(--against);background:#fbecea}
.answers .skip-q{grid-column:1/-1;font-weight:500;font-size:15px;padding:10px;color:var(--muted)}
.important{display:flex;align-items:center;gap:8px;margin:16px 0 0;font-size:15px}
.quiz-nav{display:flex;justify-content:space-between;align-items:center;margin-top:24px;gap:12px;flex-wrap:wrap}

/* Résultats */
.result-head{text-align:center;margin:20px 0 26px}
.ranking{display:grid;gap:12px}
.rank-row{display:grid;grid-template-columns:200px 1fr 60px;gap:14px;align-items:center}
.rank-name{font-weight:600;line-height:1.2}
.rank-name small{display:block;font-weight:400;color:var(--muted);font-size:12px}
.bar{height:22px;background:#eef1f4;border-radius:6px;overflow:hidden}
.bar>span{display:block;height:100%;border-radius:6px}
.rank-score{font-weight:700;font-size:20px;text-align:right}
.section{margin-top:38px}
.table-wrap{overflow-x:auto}
table.grid{border-collapse:separate;border-spacing:4px;width:100%;min-width:620px;table-layout:fixed}
table.grid th:first-child,table.grid td:first-child{width:28%}
table.grid th .dot{margin-right:5px;vertical-align:-1px}
.rank-name .dot{margin-right:6px}
table.grid th{font-size:13px;font-weight:600;text-align:center;padding:6px;color:var(--muted)}
table.grid th:first-child{text-align:left}
table.grid td{text-align:center;padding:10px 6px;border-radius:6px;font-weight:600;font-size:15px}
table.grid td:first-child{text-align:left;font-weight:500;background:none}
.heat-na{background:#f0f2f5;color:#9aa6b2;font-weight:400}
.q-detail{border-top:1px solid var(--border);padding:12px 0}
.q-detail summary{cursor:pointer;font-weight:600;list-style-position:inside}
.q-detail summary .muted{font-weight:400}
.q-detail[open] summary{margin-bottom:8px}
.diverge{margin-top:10px;font-size:14px}
.diverge li{margin-bottom:8px}
.q-detail h3{font-family:inherit;font-size:16px;margin-bottom:6px}
.your{font-size:14px;margin-bottom:8px}
.your b.agree{color:var(--for)}.your b.disagree{color:var(--against)}
.bloc-votes{display:flex;flex-wrap:wrap;gap:8px}
.bloc-vote{display:flex;align-items:center;gap:6px;font-size:13px;border:1px solid var(--border);border-radius:999px;padding:3px 10px;background:var(--surface)}
.bloc-vote.match{border-color:var(--for);background:#e7f6ee}
.bloc-vote.clash{border-color:var(--against);background:#fbecea}
.sources{font-size:13px;color:var(--muted);margin-top:8px}
.note{background:var(--soft);border-radius:var(--radius);padding:14px 16px;font-size:14px;color:var(--teal-dark)}

/* Explorer */
.tabs{display:flex;gap:6px;border-bottom:1px solid var(--border);margin:10px 0 20px;flex-wrap:wrap}
.tabs button{border:0;background:none;padding:10px 14px;font-weight:600;color:var(--muted);border-bottom:3px solid transparent}
.tabs button[aria-selected=true]{color:var(--teal-dark);border-bottom-color:var(--teal)}
.filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:18px}
.filters label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted);font-weight:600}
.filters select,.filters input{border:1px solid var(--border);border-radius:8px;padding:9px 10px;background:var(--surface);font-weight:400;color:var(--ink)}
.matrix td:first-child{color:var(--ink)}
.matrix td:first-child .dot{margin-right:6px}
.pair-pick{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.pair-pick select{border:1px solid var(--border);border-radius:8px;padding:8px 10px;background:var(--surface)}
.big-number{font-family:Georgia,serif;font-size:44px;font-weight:700;line-height:1}
.theme-bars{display:grid;gap:8px;margin-top:14px}
.theme-bar{display:grid;grid-template-columns:240px 1fr 110px;gap:12px;align-items:center;font-size:14px}
.vote-list{display:grid;gap:10px}
.vote-row{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px}
.vote-meta{font-size:13px;color:var(--muted);display:flex;gap:10px;flex-wrap:wrap;margin-bottom:4px}
.vote-title{margin-bottom:8px}
.pos{display:inline-flex;align-items:center;gap:6px;font-size:13px}
.pos i{width:10px;height:10px;border-radius:3px;display:inline-block}
.pos-for{background:var(--for)}.pos-against{background:var(--against)}.pos-abstain{background:var(--abstain)}.pos-none{background:var(--none)}
.legend-pos{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin-bottom:12px}
.pager{display:flex;justify-content:center;gap:10px;align-items:center;margin-top:18px}
.prose{max-width:780px}
.prose h2{margin-top:30px}
.prose li{margin-bottom:6px}

@media (max-width:760px){
  .steps{grid-template-columns:1fr}
  .rank-row{grid-template-columns:1fr 54px}
  .rank-row .bar{grid-column:1/-1;grid-row:2}
  .theme-bar{grid-template-columns:1fr 90px}
  .theme-bar .bar{grid-column:1/-1;grid-row:2}
  .answers{grid-template-columns:1fr}
  .header{padding:14px 16px}
  main{padding:8px 16px 48px}
}

#print-report{display:none}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.progress>span{transition:none}}
@media print{
  @page{size:A4;margin:12mm}
  body{background:#fff;color:#17263b;font-size:10pt;line-height:1.3}
  .header,.footer,.skip,main>:not(#print-report){display:none!important}
  main{padding:0;max-width:none;min-height:0}
  #print-report{display:block}
  #print-report h1{font-size:24pt;letter-spacing:0}
  #print-report h2{font-size:14pt;margin:14px 0 7px}
  #print-report p{margin:0 0 10px}
  #print-report table{border-collapse:collapse;width:100%;font-size:9pt;table-layout:fixed}
  #print-report th,#print-report td{border-bottom:1px solid #cbd5df;padding:5px 6px;text-align:left;vertical-align:top;overflow-wrap:anywhere}
  #print-report th:first-child{width:30%}
  #print-report thead{display:table-header-group}
  #print-report tr{break-inside:avoid}
  #print-report .print-note{font-size:9pt;margin-top:12px}
  #print-report .print-brand{color:#16776a;font-weight:600}
  #print-report .print-responses{break-before:page}
  #print-report .print-responses th:first-child{width:61%}
  #print-report .print-responses th:nth-child(2){width:15%}
  #print-report .print-responses table{font-size:8.5pt}
  #print-report a{color:#17263b}
}

/* Pop-up explicatif */
.nav-intro{background:none;border:0;padding:8px 12px;border-radius:8px;color:var(--teal);font-weight:500;text-decoration:underline;text-underline-offset:3px}
.nav-intro:hover{background:var(--soft)}
.intro{width:min(980px,calc(100% - 32px));max-height:calc(100dvh - 32px);border:0;border-radius:14px;padding:28px 28px 24px;background:var(--surface);color:var(--ink);box-shadow:0 20px 60px rgba(23,38,59,.25)}
.intro::backdrop{background:rgba(23,38,59,.55)}
.intro ul{padding-left:20px;margin:0 0 14px}
.intro li{margin-bottom:8px}
.intro .actions{margin-top:20px}
.intro-close-form{position:absolute;top:10px;right:10px;margin:0}
.intro-close{width:36px;height:36px;border:0;border-radius:50%;background:none;font-size:26px;line-height:1;color:var(--muted)}
.intro-close:hover{background:var(--soft);color:var(--ink)}
.powers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0}
.power{display:flex;flex-direction:column;gap:8px;border:1px solid var(--border);border-radius:var(--radius);padding:18px}
.power .theme-chip{align-self:flex-start;margin-bottom:0}
.power h3{margin:0;font-size:19px}
.power p{margin:0;font-size:15px}
.power .power-who{font-size:14px;color:var(--muted)}
.power-test{margin-top:auto;display:flex;flex-direction:column;gap:6px;background:var(--soft);border-radius:10px;padding:14px}
.power-test p{font-size:14px}
.power-test .button{align-self:flex-start;margin-top:4px}
.power-none{background:none;border:1px dashed var(--border);color:var(--muted)}
.intro-foot{font-size:14px;color:var(--muted);margin:0}
@media (max-width:520px){.intro{padding:24px 18px 20px}}
@media (max-width:860px){.powers{grid-template-columns:1fr}.power-test{margin-top:6px}}

/* Deux tests : accueil */
.tests{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:8px}
.test-card{display:flex;flex-direction:column;gap:10px;padding:26px}
.test-card .theme-chip{align-self:flex-start;margin-bottom:0}
.test-card h2{margin:0}
.test-card p{margin:0}
.test-card ul{margin:0;padding-left:20px;color:var(--muted);font-size:15px}
.test-card li{margin-bottom:4px}
.test-card .actions{justify-content:flex-start;margin-top:auto;padding-top:8px}
.nav-sep{width:1px;align-self:stretch;background:var(--border);margin:6px 4px}

/* Test des grands dossiers */
.dz-run{max-width:820px}
.dz-phase{font-size:13px;font-weight:600;color:var(--muted);margin-left:10px}
.dz-situation{font-size:17px;border-left:3px solid var(--teal);padding-left:14px;margin:6px 0 22px}
.dz-learn{display:grid;gap:20px;margin-bottom:24px}
.dz-learn h2,.dz-h{font-size:20px;margin:0 0 6px}
.dz-learn p{margin:0 0 6px}
.dz-src{font-size:13px;color:var(--muted);margin:4px 0 0}
.dz-src a,.dz-fact small a{color:var(--muted)}
.dz-chart{border:1px solid var(--border);border-radius:var(--radius);padding:16px 18px;margin:0 0 18px;background:var(--surface)}
.dz-chart figcaption{font-weight:700;margin-bottom:12px}
.dz-bars,.dz-groups{display:grid;gap:9px}
.dz-bar{display:grid;grid-template-columns:minmax(0,240px) minmax(0,1fr) 92px;gap:12px;align-items:center;font-size:14px}
.dz-bar .bar{height:14px}
.dz-bar .bar>span{background:var(--teal)}
.dz-bar.hl .bar>span{background:var(--accent)}
.dz-bar em{font-style:normal;font-weight:700;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.dz-bar-s{grid-template-columns:minmax(0,1fr) 64px}
.dz-group{display:grid;gap:4px}
.dz-group b{font-size:14px}
.dz-note{font-size:13px;color:var(--muted);margin:10px 0 0}
.dz-legend{display:flex;flex-wrap:wrap;gap:14px;font-size:13px;color:var(--muted);margin:0 0 10px}
.dz-legend i{width:12px;height:12px;border-radius:3px;display:inline-block;margin-right:6px;vertical-align:-1px}
.dz-merit svg{width:100%;max-width:560px;height:auto;display:block}
.dz-toggle,.dz-seg{display:flex;flex-wrap:wrap;gap:6px}
.dz-toggle{margin-bottom:12px}
.dz-toggle button,.dz-seg button{border:1px solid var(--border);background:var(--surface);border-radius:999px;padding:6px 14px;font-size:14px;font-weight:500}
.dz-toggle button:hover,.dz-seg button:hover{border-color:var(--teal)}
.dz-toggle button[aria-pressed=true],.dz-seg button[aria-pressed=true]{background:var(--teal);border-color:var(--teal);color:#fff}
table.dz-table{border-collapse:collapse;width:100%;min-width:420px;font-size:14px}
table.dz-table.txt{min-width:600px}
.dz-table th,.dz-table td{text-align:left;padding:8px;border-bottom:1px solid var(--border);vertical-align:top}
.dz-table thead th{font-size:13px;color:var(--muted);font-weight:600}
.dz-table td{font-variant-numeric:tabular-nums}
.dz-table:not(.txt) td{text-align:right;white-space:nowrap}
.dz-table:not(.txt) thead th:not(:first-child){text-align:right}
.dz-table tr:last-child th,.dz-table tr:last-child td{border-bottom:0}
.dz-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0 0 18px}
.dz-fact{background:var(--soft);border-radius:var(--radius);padding:14px 16px}
.dz-fact b{display:block;font-family:Georgia,serif;font-size:26px;color:var(--teal-dark);line-height:1.1;margin-bottom:4px}
.dz-fact span{display:block;font-size:14px}
.dz-fact small{display:block;font-size:12px;margin-top:6px}
.dz-myth{border:1px solid var(--border);border-radius:var(--radius);padding:16px 18px;margin-bottom:22px}
.dz-myth p{margin:0 0 12px}
.dz-myth p:last-child{margin:0}
.dz-myth p:nth-of-type(1){font-style:italic}
.dz-label{display:block;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:4px}
.dz-q{font-family:Georgia,serif;font-size:22px;line-height:1.25;margin:6px 0 14px}
.dz-options{display:grid;gap:10px}
.dz-option{display:block;width:100%;text-align:left;border:2px solid var(--border);background:var(--surface);border-radius:12px;padding:14px 16px}
.dz-option:hover{border-color:var(--teal)}
.dz-option[aria-pressed=true]{border-color:var(--teal);background:var(--soft)}
.dz-option strong{display:block;font-size:16px;line-height:1.35;margin-bottom:6px}
.dz-pro,.dz-con{display:block;position:relative;padding-left:18px;font-size:14px;color:var(--muted)}
.dz-pro::before,.dz-con::before{position:absolute;left:0;font-weight:700}
.dz-pro::before{content:"+";color:var(--for)}
.dz-con::before{content:"−";color:var(--against)}
.dz-q2{margin-top:26px;padding-top:18px;border-top:1px solid var(--border)}
.dz-after{margin-top:22px;padding-top:18px;border-top:1px solid var(--border)}
.dz-sim{display:grid;gap:16px}
.dz-gauge{position:sticky;top:0;z-index:2;background:var(--surface);padding:10px 0;border-bottom:1px solid var(--border)}
.dz-gauge-nums{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-weight:600;font-variant-numeric:tabular-nums}
.dz-gauge .progress{margin:8px 0 0}
.dz-gauge .progress>span.over{background:var(--for)}
.dz-lever{display:grid;gap:8px;padding-bottom:14px;border-bottom:1px solid var(--border)}
.dz-lever-h{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.dz-lever-h em{font-style:normal;font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}
.dz-lever .dz-note{margin:0}
.dz-effects{margin:0;padding-left:18px;font-size:14px}
.dz-effects li{margin-bottom:6px}
.dz-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.dz-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.dz-chip{border:1px solid var(--border);background:var(--surface);border-radius:999px;padding:7px 14px;font-size:14px;font-weight:500}
.dz-chip small{color:var(--teal);font-weight:600;margin-left:4px}
.dz-chip[aria-pressed=true]{background:var(--soft);border-color:var(--teal);color:var(--teal-dark)}
.dz-chip[aria-pressed=false]{color:var(--muted);text-decoration:line-through}
.dz-axes-intro{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.dz-axes-intro .card{padding:16px}
.dz-axes-intro h3{margin-bottom:4px}
.dz-axes-intro p{margin:0}
.dz-axes{display:grid;gap:22px}
.dz-axes-card{margin-top:24px}
.dz-axes-card h2{margin-top:0}
.dz-axis b{display:block;margin-bottom:6px}
.dz-track{position:relative;height:22px}
.dz-track::before{content:"";position:absolute;left:0;right:0;top:10px;height:2px;background:var(--border)}
.dz-track::after{content:"";position:absolute;left:50%;top:5px;width:1px;height:12px;background:var(--muted)}
.dz-you-mark{position:absolute;top:3px;width:16px;height:16px;margin-left:-8px;border-radius:50%;background:var(--teal);border:3px solid var(--bg);box-shadow:0 0 0 1px var(--teal);z-index:1}
.dz-fam-mark{position:absolute;top:3px;width:4px;height:16px;margin-left:-2px;border-radius:2px;background:var(--accent)}
.dz-legend .dz-you{border-radius:50%;background:var(--teal)}
.dz-legend .dz-fam{width:4px;background:var(--accent)}
.dz-ends{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--muted)}
.dz-recap{display:grid;gap:8px;font-size:15px}
.dz-recap>div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:12px;padding-bottom:8px;border-bottom:1px solid var(--border)}
.dz-recap b{font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);padding-top:2px}
.dz-sources{font-size:14px;padding-left:18px;margin:8px 0 0}
.dz-sources li{margin-bottom:6px;overflow-wrap:anywhere}

@media (max-width:760px){
  .tests{grid-template-columns:1fr}
  .dz-bar{grid-template-columns:minmax(0,1fr) 80px}
  .dz-bar>.bar{grid-column:1/-1;grid-row:2}
  .dz-bar-s{grid-template-columns:minmax(0,1fr) 64px}
  .dz-bar-s>.bar{grid-column:auto;grid-row:auto}
  .dz-facts{grid-template-columns:1fr}
  .dz-axes-intro{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dz-recap>div{grid-template-columns:1fr;gap:2px}
  .nav-sep{display:none}
}
