/* ============================================================================
   VOTEZ BIEN ! — styles.css (Édition V7.5 Optimisée & Accessible)
   Système de design civique tricolore, typographie Fraunces / Inter.
   Mode sombre natif, zéro dépendance externe bloquante, responsive multi-écrans.
   ========================================================================= */

:root{
  --paper:#F3F6FA; --paper-raised:#FFFFFF;
  --ink:#14213D; --ink-soft:#526078; --ink-faint:#8290A4;
  --brass:#C93948; --brass-deep:#A62534; --brass-pale:#FBE8EA;
  --line:#DCE3EC; --line-soft:#E9EEF4;
  --left:#A23B57; --left-pale:#F3E1E6;
  --right:#2C5C87; --right-pale:#DEE7EF;
  --blue:#244B83; --blue-deep:#152B4D; --red:#C93948;
  --good:#26734F; --good-pale:#DCEDE3; --warn:#8A5A12; --warn-pale:#FBF0DC;
  --radius-lg:22px; --radius-md:15px; --radius-sm:10px;
  --shadow-card:0 6px 20px rgba(20,33,61,.06);
  --font-display:'Fraunces', ui-serif, Georgia, serif;
  --font-body:'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --maxw:1120px;
  color-scheme: light dark;
}

/* ---------- Mode Sombre Natif ---------- */
@media (prefers-color-scheme: dark) {
  :root {
    --paper:#0B132B; --paper-raised:#16233B;
    --ink:#F1F5F9; --ink-soft:#94A3B8; --ink-faint:#64748B;
    --brass:#E64C5D; --brass-deep:#FF6B7A; --brass-pale:#2A1822;
    --line:#263852; --line-soft:#1C2B42;
    --left:#E26D89; --left-pale:#2E1A23;
    --right:#5B8EBE; --right-pale:#16273B;
    --blue:#4A7BBF; --blue-deep:#0D1B2A; --red:#E64C5D;
    --good:#3DA372; --good-pale:#16342A; --warn:#C68A28; --warn-pale:#3A2C10;
    --shadow-card:0 8px 24px rgba(0,0,0,.35);
  }
}

*{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:env(safe-area-inset-top,0px)}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--font-body); font-size:16px; line-height:1.5;
  -webkit-font-smoothing:antialiased;
  min-height:100%;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
html,body{height:100%}
img,svg{max-width:100%;display:block}
button{font-family:inherit}
a{color:var(--blue); text-decoration-thickness:1px; text-underline-offset:2px}
a:hover{color:var(--brass-deep)}
.tabular{font-variant-numeric:tabular-nums}

h1,h2,h3,.serif{font-family:var(--font-display); font-weight:700; letter-spacing:-.025em; color:var(--ink)}
h1{font-size:clamp(2rem,5.5vw,3.6rem); line-height:1.05}
h2{font-size:clamp(1.4rem,3.2vw,2rem); line-height:1.18}
h3{font-size:1.15rem; font-weight:600; margin:0}
p{margin:0 0 .9em; max-width:64ch}
.lede{color:var(--ink-soft); font-size:1.06rem; line-height:1.65; max-width:60ch}

.skip-link{position:absolute; left:-999px; top:0; background:var(--ink); color:#fff; padding:.6em 1em; border-radius:0 0 8px 0; z-index:100}
.skip-link:focus{left:0}

:focus-visible{outline:3px solid var(--brass); outline-offset:2px; border-radius:4px}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important}
}

/* ---------- Layout shell ---------- */
.app{min-height:100vh; display:flex; flex-direction:column; overflow-x:hidden}
.topbar{
  position:sticky; top:0; z-index:25; background:var(--paper-raised);
  border-bottom:1px solid var(--line); box-shadow:0 3px 18px rgba(20,33,61,.05);
  padding:.7rem max(1.1rem, calc((100vw - 1180px)/2));
  padding-top:calc(.7rem + env(safe-area-inset-top,0px));
  display:flex; align-items:center; justify-content:space-between; gap:.75rem;
}
.topbar::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:4px;
  background:linear-gradient(90deg,#1E3A8A 0 33.33%,#CBD5E1 33.33% 66.66%,#DC2626 66.66% 100%);
  border-top:1px solid rgba(20,33,61,.08);
}
.brand{display:flex; align-items:center; gap:.55rem; font-family:var(--font-display); font-weight:700; font-size:1.22rem; color:var(--ink); text-decoration:none; background:none; border:none; cursor:pointer; padding:0}
.brand .mark{width:36px; height:36px; flex:none; border-radius:50%; background:#fff; object-fit:contain}
.topbar nav{display:flex; gap:.35rem; align-items:center}
.navlink{
  font-size:.88rem; color:var(--ink-soft); background:none; border:none; padding:.52rem .82rem;
  border-radius:999px; cursor:pointer; font-weight:600; transition:background .18s, color .18s;
  white-space:nowrap;
}
.navlink:hover:not(:disabled){background:var(--line-soft); color:var(--ink)}
.navlink.active{background:var(--blue-deep); color:#fff; box-shadow:0 3px 10px rgba(21,43,77,.18)}
@media (prefers-color-scheme: dark) {
  .navlink.active{background:var(--blue); color:#fff}
}
.donate-quick{display:none}
.navlink:disabled{opacity:.4; cursor:not-allowed}
.navlink.navlink-donate,.navlink.navlink-donate.active{background:var(--brass); color:#fff; font-weight:800; box-shadow:0 3px 12px rgba(201,57,72,.25)}
.navlink.navlink-donate:hover:not(:disabled){background:var(--brass-deep); color:#fff}
.donation-panel{max-width:780px; margin:1.4rem auto; padding:clamp(1.4rem,4vw,2.6rem); background:var(--paper-raised); border:1px solid var(--line); border-top:4px solid var(--brass); border-radius:var(--radius-lg); box-shadow:var(--shadow-card)}
.donation-panel h1{margin-top:0}
.donation-panel .lede{margin-bottom:1.1rem}
.btn-donate{display:inline-flex; align-items:center; gap:.65rem; margin-top:.5rem; background:var(--brass); color:#fff; font-weight:800; box-shadow:0 4px 14px rgba(201,57,72,.22)}
.btn-donate:hover{background:var(--brass-deep); color:#fff}

main{flex:1; width:100%}
.wrap{max-width:var(--maxw); margin:0 auto; padding:1.8rem 1.2rem 4rem}
.wrap.wide{max-width:var(--maxw)}

.screen{display:none}
.screen.active{display:block; animation:fadeIn .3s ease}
@keyframes fadeIn{ from{opacity:0; transform:translateY(5px)} to{opacity:1; transform:none} }

.section-kicker{display:inline-flex; align-items:center; gap:.55rem; color:var(--red); font-size:.78rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; margin-bottom:.5rem}
.section-kicker::before{content:""; width:22px; height:3px; border-radius:99px; background:linear-gradient(90deg,#244B83 0 33%,#fff 33% 66%,#C93948 66%)}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  font-family:var(--font-body); font-weight:600; font-size:1rem; line-height:1; min-height:46px;
  padding:.85em 1.5em; border-radius:999px; border:1px solid transparent; cursor:pointer;
  transition:transform .15s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.btn:active{transform:scale(.98)}
.btn-primary{background:var(--blue-deep); color:#fff}
.btn-primary:hover{background:#244979}
.btn-brass{background:var(--red); color:#fff; box-shadow:0 4px 14px rgba(201,57,72,.22)}
.btn-brass:hover{background:var(--brass-deep)}
.btn-ghost{background:transparent; color:var(--ink); border-color:var(--line)}
.btn-ghost:hover{border-color:var(--ink-faint); background:var(--line-soft)}
.btn-sm{padding:.55em 1.1em; font-size:.88rem; min-height:36px}
.btn[disabled]{opacity:.4; cursor:not-allowed}
.btn-row{display:flex; gap:.7rem; flex-wrap:wrap; align-items:center}

/* ---------- Home ---------- */
.hero{
  position:relative; isolation:isolate; overflow:hidden;
  padding:clamp(1.4rem, 4vw, 3rem); border-radius:26px; color:#fff;
  background:radial-gradient(circle at 88% 24%, rgba(92,126,180,.28), transparent 30%), linear-gradient(125deg, #18345D 0%, #13243F 65%, #182C4A 100%);
  box-shadow:0 20px 45px rgba(20,40,71,.16);
  border:1px solid rgba(255,255,255,.08);
}
.hero-text{max-width:740px}
.hero h1{color:#fff; font-size:clamp(2.2rem, 5.5vw, 3.8rem); line-height:1.02}
.hero h1 .accent{color:#FF919A}
.hero .lede{color:#D7E1EF; margin-top:.9rem}
.eyebrow-note{color:#D9E4F3; font-weight:700; font-size:.9rem}
.hero-actions{margin-top:1.3rem}
.hero .btn-brass{background:#E64C5D}
.hero .btn-brass:hover{background:#F05C6C}
.hero .btn-ghost{color:#fff; border-color:rgba(255,255,255,.35)}
.hero .btn-ghost:hover{background:rgba(255,255,255,.1); border-color:#fff}
.duration-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; margin-top:1.2rem; max-width:680px}
@media(max-width:640px){.duration-grid{grid-template-columns:1fr; gap:.55rem}}
.duration-card{display:flex; align-items:center; gap:.8rem; padding:.75rem .9rem; border:1px solid rgba(255,255,255,.16); border-radius:14px; background:rgba(255,255,255,.08); backdrop-filter:blur(5px)}
.duration-icon{display:grid; place-items:center; width:2.2rem; height:2.2rem; flex:none; border-radius:50%; background:#fff; color:var(--blue-deep); font-size:.72rem; font-weight:800}
.duration-card strong{display:block; font-size:.88rem; color:#fff}
.duration-card small{display:block; color:#D4DFED; font-size:.76rem; margin-top:.1rem}
.duration-total{margin:.6rem 0 0; color:#CAD7E8; font-size:.8rem}
.trust-row{display:flex; gap:1.4rem; flex-wrap:wrap; margin-top:1.5rem; color:#CAD7E8; font-size:.86rem}
.trust-row strong{display:block; color:#fff; font-family:var(--font-display); font-size:1.45rem; font-weight:700}

.resume-banner{
  background:#FFF7E8; border:1px solid #EBD49A; border-radius:var(--radius-md);
  padding:.95rem 1.15rem; display:flex; flex-wrap:wrap; gap:.8rem; align-items:center; justify-content:space-between;
  margin-bottom:1.2rem; box-shadow:var(--shadow-card);
}
@media (prefers-color-scheme: dark) {
  .resume-banner{background:#261E14; border-color:#664D1E; color:#F5E6CC}
}
.resume-banner[hidden]{display:none}
.resume-banner p{margin:0; max-width:none}

.how-it-works{margin-top:2rem; padding:1.8rem 1.8rem 2rem; background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--shadow-card)}
.how-it-works h2{margin:0 0 1.2rem}
.hiw-list{display:grid; gap:1.4rem 2rem}
@media(min-width:640px){ .hiw-list{grid-template-columns:1fr 1fr} }
.hiw-item{display:flex; gap:.9rem}
.hiw-num{display:grid; place-items:center; width:2.2rem; height:2.2rem; background:var(--line-soft); color:var(--blue); border-radius:50%; font-weight:800; font-size:.88rem; flex:none}
.hiw-item h3{margin-bottom:.2rem; font-size:1.05rem}
.hiw-item p{margin:0; color:var(--ink-soft); font-size:.93rem; line-height:1.55}

/* ---------- Quiz Screen ---------- */
.quiz-head{display:flex; align-items:center; justify-content:space-between; gap:.8rem; margin-bottom:1.1rem; flex-wrap:wrap}
.progress-track{flex:1; min-width:140px; height:8px; background:var(--line-soft); border-radius:999px; overflow:hidden}
.progress-fill{height:100%; background:linear-gradient(90deg,var(--blue),var(--red)); border-radius:999px; transition:width .35s ease}
.progress-label{font-size:.88rem; font-weight:700; color:var(--blue); white-space:nowrap}
.quiz-duration{padding:.3rem .65rem; background:var(--line-soft); border-radius:999px; color:var(--ink-soft); font-size:.76rem; font-weight:700; white-space:nowrap}
.phase-chip{display:inline-block; font-size:.8rem; font-weight:600; color:var(--brass-deep); background:var(--brass-pale); padding:.35em .85em; border-radius:999px; margin-bottom:1rem}
.q-card{background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-lg); padding:clamp(1.2rem, 3.5vw, 2rem); box-shadow:var(--shadow-card)}
.q-topic{color:var(--blue); font-size:.82rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; margin-bottom:.35rem}
.q-why-toggle{background:none; border:none; color:var(--ink-soft); font-size:.85rem; text-decoration:underline; cursor:pointer; padding:0; margin-top:.5rem}
.q-why{font-size:.9rem; color:var(--ink-soft); background:var(--line-soft); border-radius:var(--radius-sm); padding:.8rem 1rem; margin-top:.7rem; display:none}
.q-why.show{display:block}
.propositions{display:grid; gap:.85rem; margin-top:1.1rem}
@media(min-width:680px){ .propositions{grid-template-columns:1fr 1fr} }
.prop{border:1px solid var(--line); border-radius:var(--radius-md); padding:1rem 1.15rem; background:var(--paper-raised)}
.prop .letter{font-family:var(--font-display); font-weight:700; color:var(--red); font-size:.84rem; display:block; margin-bottom:.3rem}
.prop p{margin:0; font-size:.98rem; color:var(--ink); line-height:1.5}
.clarify{font-size:.84rem; color:var(--ink-soft); margin-top:.5rem; padding-top:.5rem; border-top:1px dashed var(--line)}

.scale{display:grid; grid-template-columns:repeat(5,1fr); gap:.45rem; margin-top:1.3rem}
@media(max-width:540px){ .scale{grid-template-columns:1fr; gap:.5rem} }
.scale-btn{
  border:1.5px solid var(--line); background:var(--paper-raised); border-radius:var(--radius-sm); padding:.75em .45em;
  font-size:.84rem; text-align:center; cursor:pointer; color:var(--ink); font-weight:500; line-height:1.25; min-height:44px;
}
.scale-btn:hover{border-color:var(--blue)}
.scale-btn.sel{background:var(--blue-deep); border-color:var(--blue-deep); color:#fff; font-weight:700}
@media (prefers-color-scheme: dark) {
  .scale-btn.sel{background:var(--blue); border-color:var(--blue)}
}
.dk-row{margin-top:.9rem; text-align:center}
.dk-btn{background:none; border:none; color:var(--ink-soft); text-decoration:underline; font-size:.86rem; cursor:pointer; padding:.4em}
.dk-btn.sel{color:var(--red); font-weight:700}

.plain-box{margin:.9rem 0 0; padding:.75rem 1rem; background:var(--brass-pale); border-radius:var(--radius-sm); font-size:.9rem; color:var(--ink)}
.plain-box strong{color:var(--brass-deep)}

.choice-list{display:grid; gap:.7rem; margin-top:1.1rem}
.choice-btn{
  text-align:left; width:100%; padding:.95rem 1.1rem; border:1.5px solid var(--line); border-radius:var(--radius-md);
  background:var(--paper-raised); color:var(--ink); font-family:inherit; font-size:.96rem; line-height:1.45; cursor:pointer;
}
.choice-btn:hover{border-color:var(--blue)}
.choice-btn.sel{background:var(--blue-deep); border-color:var(--blue-deep); color:#fff; font-weight:600}
@media (prefers-color-scheme: dark) {
  .choice-btn.sel{background:var(--blue); border-color:var(--blue)}
}

.quiz-nav{display:flex; justify-content:space-between; align-items:center; margin-top:1.3rem; gap:.7rem}

/* ---------- Palier & Priorités ---------- */
.prio-box{margin-top:2rem; padding-top:1.6rem; border-top:1px solid var(--line)}
.prio-grid{display:grid; grid-template-columns:1fr; gap:.7rem; margin-top:1rem}
@media(min-width:560px){ .prio-grid{grid-template-columns:1fr 1fr} }
.prio-card{
  position:relative; text-align:left; padding:1rem 1.1rem; border:1.5px solid var(--line); border-radius:var(--radius-md);
  background:var(--paper-raised); color:var(--ink); font-family:inherit; cursor:pointer; display:flex; flex-direction:column; gap:.25rem;
}
.prio-card:hover{border-color:var(--red)}
.prio-card.sel{border-color:var(--red); background:var(--brass-pale)}
.prio-card strong{font-size:.98rem; padding-right:2rem}
.prio-def{font-size:.83rem; color:var(--ink-soft); line-height:1.4}
.prio-rank{
  position:absolute; top:.75rem; right:.8rem; width:1.75rem; height:1.75rem; border-radius:50%;
  background:var(--red); color:#fff; font-family:var(--font-display); font-weight:700; font-size:.9rem;
  display:flex; align-items:center; justify-content:center;
}

/* ---------- Results Screen ---------- */
.result-headline{margin-bottom:1.5rem}
.result-headline .label{font-size:clamp(1.8rem, 5vw, 2.7rem); margin:.2rem 0}
.confidence-note{font-size:.9rem; color:var(--ink-soft); margin-top:.4rem}
.undetermined-box{background:#FBF0DC; border:1px solid #E9CE95; border-radius:var(--radius-md); padding:1.1rem 1.2rem; margin-bottom:1.5rem; color:#5D420F}
.composite-box{background:var(--line-soft); border:1px solid var(--line); border-radius:var(--radius-md); padding:1rem 1.2rem; margin-bottom:1.5rem; font-size:.93rem; color:var(--ink-soft)}
.spectrum{margin:1.4rem 0 2rem}
.spectrum-bar{position:relative; height:14px; border-radius:999px; background:linear-gradient(90deg, var(--left), #E7D9DC 48%, #D9E2E9 52%, var(--right)); margin:1.4rem 0 .5rem}
.spectrum-dot{position:absolute; top:50%; width:22px; height:22px; border-radius:50%; background:#fff; border:3px solid var(--ink); transform:translate(-50%,-50%); box-shadow:0 2px 6px rgba(0,0,0,.25)}
.spectrum-labels{display:flex; justify-content:space-between; font-size:.82rem; color:var(--ink-soft); font-weight:600}

.best-matches{margin-top:2.2rem; padding-top:1.8rem; border-top:1px solid var(--line)}
.match-grid{display:grid; grid-template-columns:1fr; gap:.85rem; margin-top:1.1rem}
@media(min-width:640px){ .match-grid{grid-template-columns:repeat(3,1fr)} }
.match-card{
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:.55rem;
  border:1px solid var(--line); border-top:5px solid var(--card-accent,var(--blue)); border-radius:var(--radius-md);
  background:var(--paper-raised); padding:1.3rem 1rem 1.1rem; cursor:pointer; font-family:inherit; color:var(--ink);
  transition:transform .18s, border-color .18s, box-shadow .18s; box-shadow:var(--shadow-card);
}
.match-card:hover{transform:translateY(-3px); border-color:var(--ink-faint)}
.match-card.top{background:var(--brass-pale); border-color:#E2CB9E; border-top-color:var(--card-accent,var(--red))}
.top-badge{font-size:.73rem; font-weight:800; color:var(--brass-deep); text-transform:none; letter-spacing:0}
.candidacy-shared-badge{display:inline-block; font-size:.68rem; font-weight:700; color:var(--blue); background:var(--line-soft); padding:.2em .6em; border-radius:999px; margin-top:.2rem}
.match-card-name h3{font-size:.98rem; margin:0 0 .15rem}

.match-ring{position:relative; width:var(--size,64px); height:var(--size,64px); flex:none; display:inline-flex; align-items:center; justify-content:center}
.match-ring svg{width:100%; height:100%; transform:rotate(-90deg)}
.match-ring .ring-bg{fill:none; stroke:var(--line-soft)}
.match-ring .ring-fill{fill:none; stroke:var(--red); stroke-linecap:round; transition:stroke-dashoffset .6s ease}
.match-ring .ring-label{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:700; font-size:calc(var(--size,64px) * 0.27); color:var(--ink)}
.match-ring .ring-label small{font-family:var(--font-body); font-size:.32em; font-weight:700; margin-left:.05em; color:var(--ink-soft)}
.match-ring.match-ring-empty .ring-label{color:var(--ink-faint); font-family:var(--font-body); font-weight:600}

.dim-list{display:flex; flex-direction:column; gap:1.15rem; margin-top:1.8rem}
.dim-row{border-bottom:1px solid var(--line-soft); padding-bottom:1.1rem}
.dim-row-head{display:flex; justify-content:space-between; align-items:baseline; gap:.6rem; margin-bottom:.4rem; flex-wrap:wrap}
.dim-pos-label{font-size:.88rem; color:var(--blue); font-weight:700}
.dim-bar-track{position:relative; height:8px; background:var(--line-soft); border-radius:999px}
.dim-bar-dot{position:absolute; top:50%; width:15px; height:15px; border-radius:50%; background:var(--red); transform:translate(-50%,-50%)}
.dim-conf{font-size:.78rem; color:var(--ink-faint); margin-top:.45rem; display:flex; align-items:center; gap:.4rem}
.conf-track{width:64px; height:5px; background:var(--line-soft); border-radius:999px; overflow:hidden; display:inline-block}
.conf-fill{height:100%; background:var(--blue)}

/* ---------- NOUVEL ONGLET : THÈMES ---------- */
.theme-filters-box{margin:1.4rem 0 1.2rem}
.theme-pills{display:flex; gap:.5rem; flex-wrap:wrap; margin-bottom:.5rem}
@media(max-width:680px){
  .theme-pills{
    flex-wrap:nowrap; overflow-x:auto; padding-bottom:.5rem; -webkit-overflow-scrolling:touch; scrollbar-width:none;
    mask-image:linear-gradient(to right, black 85%, transparent 100%);
    -webkit-mask-image:linear-gradient(to right, black 85%, transparent 100%);
  }
}
.theme-pills::-webkit-scrollbar{display:none}
.theme-pill{
  flex:none; padding:.6rem 1.05rem; border:1px solid var(--line); border-radius:999px;
  background:var(--paper-raised); color:var(--ink-soft); font-size:.86rem; font-weight:700; cursor:pointer;
  transition:all .18s ease; display:inline-flex; align-items:center; gap:.45em;
}
.theme-pill:hover{border-color:var(--blue); color:var(--ink)}
.theme-pill.active{background:var(--blue-deep); border-color:var(--blue-deep); color:#fff; box-shadow:0 3px 10px rgba(21,43,77,.18)}
@media (prefers-color-scheme: dark) {
  .theme-pill.active{background:var(--blue); border-color:var(--blue)}
}

.theme-detail-container{display:flex; flex-direction:column; gap:1.4rem; margin-top:.6rem}
.theme-briefing-box{padding:1.4rem 1.5rem; background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--shadow-card)}
.theme-briefing-box h2{display:flex; align-items:center; gap:.5em; margin:0 0 .5rem}
.theme-cleavages-tag{margin:.6rem 0 0; padding:.65rem .95rem; border-left:4px solid var(--red); background:var(--brass-pale); border-radius:0 10px 10px 0; font-size:.88rem; color:var(--ink)}
.theme-candidates-grid{display:grid; grid-template-columns:1fr; gap:1rem}
@media(min-width:700px){ .theme-candidates-grid{grid-template-columns:repeat(2,1fr)} }
.theme-candidate-card{
  border:1px solid var(--line); border-top:4px solid var(--candidate-color, var(--blue)); border-radius:var(--radius-md);
  background:var(--paper-raised); padding:1.2rem 1.25rem; box-shadow:var(--shadow-card);
}
.tc-head{display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:.55rem}
.tc-candidate{font-size:1.1rem; margin:0}
.tc-party-badge{font-size:.72rem; font-weight:800; padding:.25em .65em; border-radius:999px; background:var(--line-soft); color:var(--ink)}
.tc-stance{font-size:.92rem; color:var(--ink); font-weight:600; line-height:1.45; margin-bottom:.7rem}
.tc-proposals{margin:0; padding-left:1.2rem; font-size:.84rem; color:var(--ink-soft); line-height:1.45}
.tc-proposals li{margin-bottom:.35rem}

/* ---------- NOUVEL ONGLET : SONDAGES ---------- */
.polls-notice-card{display:flex; gap:.9rem; align-items:flex-start; padding:.95rem 1.15rem; background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-md); box-shadow:var(--shadow-card); margin:1.2rem 0}
.polls-notice-card p{margin:0; font-size:.86rem; color:var(--ink-soft); line-height:1.5}
.polls-controls{display:flex; gap:.5rem; flex-wrap:wrap; margin:1.2rem 0 1.5rem}

.poll-aggregate-box{background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-lg); padding:1.5rem; box-shadow:var(--shadow-card); margin-bottom:1.5rem}
.poll-bars-list{display:flex; flex-direction:column; gap:.9rem; margin-top:1.2rem}
.poll-bar-item{display:grid; grid-template-columns:190px 1fr 90px; align-items:center; gap:1rem}
@media(max-width:600px){ .poll-bar-item{grid-template-columns:130px 1fr 80px; font-size:.82rem; gap:.6rem} }
.poll-candidate-info{display:flex; flex-direction:column}
.poll-candidate-info strong{font-size:.92rem; color:var(--ink)}
.poll-candidate-info span{font-size:.72rem; color:var(--ink-soft)}
.poll-bar-track{height:12px; background:var(--line-soft); border-radius:999px; overflow:hidden}
.poll-bar-fill{height:100%; border-radius:999px; transition:width .6s ease}
.poll-score-val{font-weight:800; font-family:var(--font-display); font-size:1.15rem; text-align:right; color:var(--ink); white-space:nowrap; font-variant-numeric:tabular-nums; display:block}

.duels-grid{display:grid; grid-template-columns:1fr; gap:1rem}
@media(min-width:680px){ .duels-grid{grid-template-columns:1fr 1fr} }
.duel-card{border:1px solid var(--line); border-radius:var(--radius-md); background:var(--paper-raised); padding:1.2rem 1.3rem; box-shadow:var(--shadow-card)}
.duel-card h3{font-size:1rem; margin-bottom:.3rem}
.duel-spread{font-size:.78rem; font-weight:700; color:var(--blue); margin-bottom:.85rem}
.duel-bars-wrap{display:flex; height:24px; border-radius:999px; overflow:hidden; background:var(--line-soft); margin:.6rem 0}
.duel-bar-a{height:100%; background:var(--color-a, var(--blue))}
.duel-bar-b{height:100%; background:var(--color-b, var(--red))}
.duel-labels{display:flex; justify-content:space-between; font-size:.85rem; font-weight:700}

/* ---------- Partis & Drawer ---------- */
.party-directory-banner{display:flex; align-items:center; gap:.9rem; margin:1.3rem 0 1.15rem; padding:.9rem 1rem; background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-md); box-shadow:var(--shadow-card)}
.party-directory-banner p{margin:0; font-size:.88rem; color:var(--ink-soft)}
.flag-mark{width:8px; align-self:stretch; min-height:42px; flex:none; border-radius:99px; background:linear-gradient(180deg,#244B83 0 33.33%,#fff 33.33% 66.66%,#C93948 66.66%)}
.filter-row{display:flex; gap:.5rem; flex-wrap:wrap; margin:1rem 0 1.2rem}
.filter-chip{border:1.5px solid var(--line); background:var(--paper-raised); border-radius:999px; padding:.48em 1em; font-size:.84rem; cursor:pointer; color:var(--ink-soft); font-weight:600}
.filter-chip.sel{background:var(--blue-deep); border-color:var(--blue-deep); color:#fff}
@media (prefers-color-scheme: dark) {
  .filter-chip.sel{background:var(--blue); border-color:var(--blue)}
}

.party-grid{display:grid; grid-template-columns:1fr; gap:1rem}
@media(min-width:700px){ .party-grid{grid-template-columns:repeat(2,1fr)} }
.party-card{
  display:flex; flex-direction:column; overflow:hidden; padding:0; border:1px solid var(--line);
  border-top:4px solid var(--card-accent, #294F84); border-radius:18px; background:var(--paper-raised);
  box-shadow:var(--shadow-card); transition:transform .18s, box-shadow .18s;
}
.party-card:hover{transform:translateY(-3px); box-shadow:0 12px 28px rgba(20,33,61,.1)}
.party-main{display:flex; align-items:stretch; gap:1rem; width:100%; padding:1rem 1.05rem .85rem}
.party-portrait{display:flex; flex-direction:column; width:100px; flex:none; align-self:flex-start}
.party-photo{width:100px; height:128px; object-fit:cover; object-position:center 24%; border-radius:12px; background:var(--line-soft)}
.portrait-placeholder{display:grid; place-items:center; color:#fff; background:linear-gradient(145deg,var(--blue),var(--red)); font-size:1.4rem; font-weight:800}
.portrait-credit{display:block; margin:.3rem 0 0; font-size:.58rem; line-height:1.25; color:var(--ink-faint)}
.party-card-text{display:flex; flex-direction:column; align-items:flex-start; min-width:0; flex:1; width:100%; padding:0; background:transparent; border:0; text-align:left; color:inherit; font:inherit; cursor:pointer}
.party-family{display:inline-block; margin:0 0 .2rem; color:var(--blue); font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em}
.party-card-title{font-size:1.15rem; line-height:1.2; letter-spacing:-.025em; color:var(--ink)}
.party-person{display:block; margin-top:.4rem; font-size:.92rem; font-weight:700; color:var(--ink)}
.party-person small{display:block; margin-top:.1rem; color:var(--ink-soft); font-size:.72rem; font-weight:500; line-height:1.35}
.party-status{display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:3; margin:.5rem 0 0; color:var(--ink-soft); font-size:.76rem; line-height:1.45}
.party-card-match{display:flex; align-items:center; gap:.55rem; margin-top:.65rem; min-height:46px}
.party-card-match .match-ring{--size:42px !important}
.party-card-match .match-caption{margin:0; font-size:.68rem; line-height:1.35}
.party-unscored{padding:.34rem .58rem; background:var(--line-soft); color:var(--ink-soft); border-radius:99px; font-size:.68rem; font-weight:700}
.party-open-hint{display:block; margin-top:.45rem; color:var(--blue); font-size:.73rem; font-weight:700}
.party-card-actions{padding:.55rem 1rem .8rem; border-top:1px solid var(--line-soft)}
.compare-pick{margin:0; color:var(--ink-soft); font-size:.74rem; font-weight:600}

/* Drawer */
.drawer-backdrop{position:fixed; inset:0; background:rgba(10,18,34,.55); backdrop-filter:blur(3px); z-index:40; display:none}
.drawer-backdrop.show{display:block}
.drawer{
  position:fixed; right:0; top:0; bottom:0; width:min(500px,100%); background:var(--paper); z-index:45;
  overflow-y:auto; transform:translateX(100%); transition:transform .3s ease;
  padding:calc(1.4rem + env(safe-area-inset-top,0px)) 1.35rem calc(3rem + env(safe-area-inset-bottom,0px));
  border-left:1px solid var(--line); box-shadow:-10px 0 35px rgba(0,0,0,.15);
}
.drawer.show{transform:none}
.drawer-close{background:var(--line-soft); border:none; font-size:.9rem; font-weight:700; cursor:pointer; color:var(--ink); padding:.5rem .9rem; border-radius:999px}
.drawer-top{display:flex; align-items:flex-start; gap:.85rem; margin-bottom:.8rem}
.drawer-portrait{width:90px; flex:none; margin:0}
.drawer-portrait img{width:90px; height:116px; object-fit:cover; border-radius:12px}
.drawer-portrait figcaption{font-size:.58rem; line-height:1.3; color:var(--ink-faint); margin-top:.3rem}
.source-row{display:flex; gap:.6rem; flex-wrap:wrap; margin-top:1rem}

.dim-compare{margin-top:1.6rem; display:flex; flex-direction:column; gap:1rem}
.dc-item{border:1px solid var(--line); border-radius:var(--radius-sm); padding:.8rem .95rem; background:var(--paper-raised)}
.dc-item .dc-head{display:flex; justify-content:space-between; font-size:.88rem; font-weight:600}
.dc-tag{font-size:.74rem; padding:.2em .65em; border-radius:999px; font-weight:700}
.dc-tag.proche{background:#DCEDE3; color:var(--good)}
.dc-tag.assez-proche{background:var(--brass-pale); color:var(--brass-deep)}
.dc-tag.eloigne, .dc-tag.tres-eloigne{background:var(--line-soft); color:var(--ink-soft)}
.dc-tag.non-renseigne{background:var(--line-soft); color:var(--ink-faint)}
.dc-detail{font-size:.82rem; color:var(--ink-soft); margin-top:.4rem; line-height:1.45}

/* Table Comparateur */
.compare-table-wrap{overflow-x:auto; margin-top:1rem; border-radius:var(--radius-md); border:1px solid var(--line)}
table.compare{border-collapse:collapse; width:100%; min-width:540px; background:var(--paper-raised)}
table.compare th, table.compare td{border:1px solid var(--line); padding:.75rem .85rem; font-size:.88rem; text-align:left; vertical-align:top}
table.compare th{background:var(--line-soft); font-family:var(--font-display); font-weight:700; color:var(--ink)}

/* Modal Export Badge */
.modal-backdrop{position:fixed; inset:0; background:rgba(10,18,34,.65); backdrop-filter:blur(4px); z-index:60; display:flex; align-items:center; justify-content:center; padding:1.2rem}
.modal-backdrop[hidden]{display:none !important}
.modal-card{background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-lg); padding:1.4rem; max-width:640px; width:100%; box-shadow:0 24px 50px rgba(0,0,0,.35)}
.modal-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:1rem}
.modal-close{background:none; border:none; font-size:1.3rem; font-weight:700; cursor:pointer; color:var(--ink-soft)}
.canvas-wrap{display:flex; justify-content:center; margin-bottom:1.2rem; background:var(--line-soft); border-radius:var(--radius-md); padding:1rem}
#profileCanvas{max-width:100%; height:auto; border-radius:12px; box-shadow:0 8px 24px rgba(0,0,0,.15)}

/* Toast */
.toast{
  position:fixed; bottom:calc(1.2rem + env(safe-area-inset-bottom,0px)); left:50%; transform:translateX(-50%) translateY(140%);
  background:var(--blue-deep); color:#fff; padding:.8em 1.4em; border-radius:999px; font-size:.9rem; z-index:70;
  opacity:0; pointer-events:none; visibility:hidden; transition:transform .3s ease, opacity .25s ease, visibility .3s;
  box-shadow:0 8px 24px rgba(0,0,0,.25);
}
.toast.show{transform:translateX(-50%) translateY(0); opacity:1; pointer-events:auto; visibility:visible}

/* Footer */
footer{background:var(--blue-deep); color:#D6E0ED; padding:1.8rem 1.2rem; text-align:center; font-size:.84rem; border-top:4px solid transparent; border-image:linear-gradient(90deg,#244B83 0 33.33%,#fff 33.33% 66.66%,#C93948 66.66%) 1}

/* Responsive */
@media(max-width:759px){
  .topbar{padding-left:.85rem; padding-right:.85rem}
  .brand{font-size:1.05rem}
  .brand .mark{width:32px; height:32px}
  .wrap{padding:.9rem .8rem 3rem}
  .hero{padding:1.1rem 1rem 1.35rem; border-radius:18px}
  .hero h1{font-size:clamp(1.75rem,7.5vw,2.3rem); line-height:1.08}
  .hero .lede{font-size:.92rem; margin-top:.5rem; line-height:1.45}
  .duration-grid{margin-top:.8rem; gap:.45rem}
  .duration-card{padding:.55rem .75rem}
  .duration-total{margin:.45rem 0 0; font-size:.76rem}
  .hero-actions{margin-top:.95rem; gap:.5rem; align-items:stretch}
  .hero-actions .btn{flex:1 1 auto; font-size:.88rem; min-height:42px}
  .trust-row{margin-top:1.1rem; gap:.9rem}
  .party-main{gap:.72rem; padding:.8rem .75rem}
  .party-portrait{width:84px}
  .party-photo{width:84px; height:110px}
  .party-card-title{font-size:1.02rem}
  .party-person{font-size:.84rem}
  .party-status{-webkit-line-clamp:2; font-size:.72rem}
}

/* ================================================================
   RADAR INTELLIGENT & AUDIT DE BIAIS
   ================================================================ */
.radar-score-card{
  background:var(--paper-raised); border:1px solid var(--line); border-left:4px solid var(--blue);
  border-radius:var(--radius-lg); padding:1.5rem; display:flex; gap:2rem; align-items:center;
  margin:1.5rem 0 2rem; box-shadow:var(--shadow-card);
}
@media (max-width:768px){
  .radar-score-card{flex-direction:column; align-items:flex-start; gap:1rem; padding:1.2rem}
}
.radar-score-val{display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:140px; text-align:center}
.radar-score-val .score-number{font-family:var(--font-display); font-size:3rem; font-weight:800; color:var(--blue); line-height:1}
.radar-score-val .score-number small{font-size:1.1rem; font-weight:600; color:var(--ink-soft)}
.score-badge{
  display:inline-block; margin-top:.5rem; font-size:.72rem; font-weight:800; text-transform:uppercase;
  letter-spacing:.05em; background:var(--line-soft); color:var(--ink-soft);
  padding:.28rem .65rem; border-radius:999px;
}
.score-badge[data-level="ok"]{background:var(--good-pale); color:var(--good)}
.score-badge[data-level="warn"]{background:var(--warn-pale); color:var(--warn)}
.score-badge[data-level="error"]{background:var(--brass-pale); color:var(--brass-deep)}
.radar-score-details{flex:1; min-width:0}
.radar-score-details > p{margin:0; font-size:.95rem}
.radar-check-list{
  list-style:none; padding:0; margin:.9rem 0 0; display:grid;
  grid-template-columns:repeat(auto-fit, minmax(230px, 1fr)); gap:.45rem 1.2rem;
}
.radar-check-list li{font-size:.86rem; display:flex; align-items:baseline; gap:.5rem; color:var(--ink-soft)}
.radar-check-list .check-icon{color:var(--good); font-weight:800; flex:none}
.radar-check-list .check-icon[data-level="warn"]{color:var(--warn)}
.radar-check-list .check-icon[data-level="error"]{color:var(--brass)}

.radar-visual-grid{display:grid; grid-template-columns:1.05fr 1fr; gap:1.5rem; margin-bottom:2.2rem; align-items:start}
@media (max-width:900px){ .radar-visual-grid{grid-template-columns:1fr} }
.radar-chart-container{
  background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:1.4rem; text-align:center; box-shadow:var(--shadow-card);
}
.radar-chart-container h2{font-size:1.1rem; margin:0 0 .9rem}
.radar-svg-wrapper{max-width:340px; margin:0 auto}
.radar-svg{width:100%; height:auto; display:block; color:var(--ink)}
.radar-svg .grid-line{stroke:var(--line); stroke-width:1}
.radar-svg .grid-line.dashed{stroke-dasharray:3 3}
.radar-svg .spoke{stroke:var(--line); stroke-width:1.2}
.radar-svg .shape{fill:url(#radarGrad); stroke:var(--blue); stroke-width:2.5}
.radar-svg .dot{fill:var(--blue); stroke:var(--paper-raised); stroke-width:2}
.radar-svg .axis-label{fill:var(--ink); font-size:10px; font-weight:600; font-family:var(--font-body)}
.radar-svg .axis-value{fill:var(--blue); font-size:10px; font-weight:800; font-family:var(--font-body)}
.radar-chart-caption{font-size:.8rem; color:var(--ink-faint); margin:.8rem 0 0}

.radar-axis-breakdown{display:flex; flex-direction:column; gap:.6rem}
.radar-axis-card{
  background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-md);
  padding:.85rem 1rem; box-shadow:var(--shadow-card);
}
.axis-card-top{display:flex; justify-content:space-between; align-items:baseline; gap:.6rem; margin-bottom:.25rem}
.axis-card-top strong{font-size:.95rem}
.axis-score{font-size:.85rem; font-weight:800; color:var(--blue); white-space:nowrap}
.radar-axis-card p{font-size:.82rem; color:var(--ink-soft); margin:0; line-height:1.4}
.axis-bar-track{height:6px; background:var(--line-soft); border-radius:999px; overflow:hidden; margin-top:.55rem}
.axis-bar-fill{height:100%; background:linear-gradient(90deg, var(--blue), var(--right)); border-radius:999px}
.axis-metrics{
  list-style:none; margin:.6rem 0 0; padding:.55rem 0 0; border-top:1px dashed var(--line);
  display:grid; grid-template-columns:repeat(auto-fit, minmax(140px, 1fr)); gap:.3rem .8rem;
}
.axis-metrics li{display:flex; justify-content:space-between; gap:.5rem; font-size:.76rem; color:var(--ink-faint)}
.axis-metrics li strong{color:var(--ink); font-weight:700; font-variant-numeric:tabular-nums}

.radar-findings-section{margin-bottom:2.2rem}
.radar-findings-section h2{font-size:1.25rem; margin:0 0 .25rem}
.radar-findings{display:grid; gap:.6rem; margin-top:1rem}
.radar-finding{
  display:flex; gap:.75rem; align-items:flex-start;
  background:var(--paper-raised); border:1px solid var(--line);
  border-left:4px solid var(--line); border-radius:var(--radius-md); padding:.85rem 1rem;
}
.radar-finding h3{font-size:.95rem; margin:0 0 .15rem}
.radar-finding p{margin:0; font-size:.86rem; color:var(--ink-soft); line-height:1.45}
.finding-mark{
  flex:none; width:26px; height:26px; border-radius:50%; display:grid; place-items:center;
  font-size:.82rem; font-weight:800; background:var(--line-soft); color:var(--ink-soft);
}
.finding-axis{
  display:inline-block; margin-top:.45rem; font-size:.68rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.05em; color:var(--ink-faint); background:var(--line-soft); padding:.16em .55em; border-radius:999px;
}
.radar-finding.error{border-left-color:var(--red)}
.radar-finding.error .finding-mark{background:var(--brass-pale); color:var(--brass-deep)}
.radar-finding.warn{border-left-color:var(--warn)}
.radar-finding.warn .finding-mark{background:var(--warn-pale); color:var(--warn)}
.radar-finding.ok{border-left-color:var(--good)}
.radar-finding.ok .finding-mark{background:var(--good-pale); color:var(--good)}

.radar-sim-box{
  background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:1.5rem; margin-bottom:2.2rem; box-shadow:var(--shadow-card);
}
.radar-sim-header{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; margin-bottom:1rem}
.radar-sim-header h2{font-size:1.2rem; margin:0 0 .25rem}
.radar-sim-header p{font-size:.88rem; color:var(--ink-soft); margin:0; max-width:62ch}
.radar-sim-results{margin-top:.2rem}
.sim-status-banner{
  display:flex; align-items:flex-start; gap:.6rem; font-size:.88rem; color:var(--ink-soft);
  background:var(--line-soft); border:1px solid var(--line); border-radius:var(--radius-sm);
  padding:.8rem 1rem; margin-bottom:1.1rem;
}
.sim-status-banner strong{color:var(--ink)}
.sim-pulse{width:9px; height:9px; border-radius:50%; background:var(--good); flex:none; margin-top:.42rem; box-shadow:0 0 0 3px var(--good-pale)}
.sim-bars-grid{display:flex; flex-direction:column; gap:.4rem}
.sim-bar-row{
  display:grid; grid-template-columns:200px 1fr 92px; align-items:center; gap:.8rem;
  background:var(--paper-raised); border:1px solid var(--line-soft); border-radius:var(--radius-sm); padding:.45rem .8rem;
}
@media (max-width:640px){
  .sim-bar-row{grid-template-columns:118px 1fr 68px; gap:.5rem; font-size:.8rem}
}
.sim-bar-label{display:flex; align-items:baseline; gap:.4rem; font-size:.86rem; min-width:0; overflow:hidden}
.sim-bar-label strong{white-space:nowrap}
.sim-bar-label small{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.sim-bar-track{height:8px; background:var(--line-soft); border-radius:999px; overflow:hidden}
.sim-bar-fill{height:100%; border-radius:999px; transition:width .4s ease}
.sim-bar-val{text-align:right; font-size:.84rem; font-variant-numeric:tabular-nums; white-space:nowrap}

.radar-reflexive-section{margin-bottom:2.2rem}
.radar-reflexive-section h2{font-size:1.25rem; margin:0 0 1rem}
.reflexive-grid{display:grid; grid-template-columns:1fr 1fr; gap:1rem}
@media (max-width:760px){ .reflexive-grid{grid-template-columns:1fr} }
.reflexive-card{
  background:var(--paper-raised); border:1px solid var(--line); border-top:3px solid var(--blue);
  border-radius:var(--radius-md); padding:1.15rem 1.25rem; box-shadow:var(--shadow-card);
}
.reflexive-card:nth-child(2){border-top-color:var(--right)}
.reflexive-card:nth-child(3){border-top-color:var(--red)}
.reflexive-card:nth-child(4){border-top-color:var(--good)}
.rf-badge{display:inline-block; font-size:.7rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-faint); margin-bottom:.35rem}
.reflexive-card h3{font-size:1.05rem; margin:0 0 .45rem}
.reflexive-card p{font-size:.87rem; color:var(--ink-soft); line-height:1.5; margin:0}
.radar-layout-note{
  margin-top:.9rem; padding:.7rem .9rem; background:var(--line-soft);
  border-left:3px solid var(--blue); border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  font-size:.85rem; color:var(--ink-soft);
}

.radar-parties-audit{margin-bottom:2.2rem}
.radar-parties-audit h2{font-size:1.25rem; margin:0 0 1rem}
.radar-table-wrap{overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius-md); background:var(--paper-raised)}
.radar-table{width:100%; border-collapse:collapse; font-size:.87rem; text-align:left; min-width:620px}
.radar-table th{background:var(--line-soft); padding:.75rem 1rem; font-weight:700; color:var(--ink); border-bottom:1px solid var(--line)}
.radar-table td{padding:.75rem 1rem; border-bottom:1px solid var(--line-soft); vertical-align:top}
.radar-table tr:last-child td{border-bottom:none}
.status-chip{display:inline-block; font-size:.73rem; font-weight:700; padding:.22rem .6rem; border-radius:999px}
.status-chip.ready{background:var(--good-pale); color:var(--good)}
.status-chip.partial{background:var(--warn-pale); color:var(--warn)}
.party-dot{width:9px; height:9px; border-radius:50%; display:inline-block; margin-right:6px; vertical-align:middle; flex:none}

/* ================================================================
   CANDIDATURES & CALENDRIER
   ================================================================ */
.candidatures-grid{display:grid; grid-template-columns:1fr; gap:.9rem; margin-top:1.2rem}
@media(min-width:700px){ .candidatures-grid{grid-template-columns:repeat(2,1fr)} }
@media(min-width:1080px){ .candidatures-grid{grid-template-columns:repeat(3,1fr)} }
.candidature-card{
  background:var(--paper-raised); border:1px solid var(--line); border-top:4px solid var(--card-accent, var(--blue));
  border-radius:var(--radius-md); padding:1.1rem 1.2rem; box-shadow:var(--shadow-card);
}
.candidature-head{display:flex; align-items:center; justify-content:space-between; gap:.6rem; margin-bottom:.2rem}
.candidature-head h3{font-size:1.02rem; margin:0}
.candidature-party{margin:0; font-size:.84rem; font-weight:600; color:var(--ink)}
.candidature-note{margin:.45rem 0 0; font-size:.8rem; color:var(--ink-soft); line-height:1.45}
.candidature-poll{margin:.5rem 0 0; font-size:.8rem; color:var(--ink-soft)}
.candidatures-out-list{display:grid; gap:.55rem; margin-top:1rem}
.candidature-out-row{
  display:grid; grid-template-columns:minmax(160px, 1fr) 2fr auto; gap:.5rem 1rem; align-items:center;
  background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-sm); padding:.7rem .9rem;
}
@media(max-width:700px){ .candidature-out-row{grid-template-columns:1fr} }
.candidature-out-row strong{display:block; font-size:.9rem}
.candidature-out-row span{display:block; font-size:.76rem; color:var(--ink-faint)}
.candidature-out-row p{margin:0; font-size:.8rem; color:var(--ink-soft)}
.candidature-out-row a{font-size:.78rem; font-weight:700; white-space:nowrap}

.calendar-list{list-style:none; margin:1.2rem 0 0; padding:0; display:grid; gap:.6rem}
.calendar-item{
  display:grid; grid-template-columns:130px 1fr auto; gap:.4rem 1.1rem; align-items:start;
  background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-md); padding:.9rem 1.1rem;
}
.calendar-item.official{border-left:4px solid var(--blue)}
@media(max-width:760px){ .calendar-item{grid-template-columns:1fr} }
.calendar-date strong{display:block; font-family:var(--font-display); font-size:1rem; color:var(--ink)}
.calendar-date span{display:block; margin-top:.1rem; font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-faint)}
.calendar-body h3{font-size:.98rem; margin:0 0 .2rem}
.calendar-body p{margin:0; font-size:.84rem; color:var(--ink-soft); line-height:1.45}
.calendar-flag{
  align-self:center; font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em;
  background:var(--line-soft); color:var(--ink-soft); padding:.25rem .6rem; border-radius:999px; white-space:nowrap;
}
.calendar-item.official .calendar-flag{background:var(--right-pale); color:var(--blue)}

/* ================================================================
   QUIZ : ENTRÉE, PALIER, DÉPARTAGE
   ================================================================ */
.quiz-intro-grid{display:grid; grid-template-columns:1fr; gap:.9rem; margin:1.6rem 0 1.2rem}
@media(min-width:700px){ .quiz-intro-grid{grid-template-columns:1fr 1fr} }
.quiz-intro-card{
  display:flex; gap:1rem; align-items:flex-start;
  background:var(--paper-raised); border:1px solid var(--line); border-top:4px solid var(--blue);
  border-radius:var(--radius-lg); padding:1.2rem 1.3rem; box-shadow:var(--shadow-card);
}
.quiz-intro-card:nth-child(2){border-top-color:var(--red)}
.quiz-intro-number{font-family:var(--font-display); font-size:1.7rem; font-weight:800; color:var(--ink-faint); line-height:1; flex:none}
.quiz-intro-card h2{font-size:1.05rem; margin:0 0 .2rem}
.quiz-intro-card p{margin:0; font-size:.9rem; font-weight:700; color:var(--ink)}
.quiz-intro-card small{display:block; margin-top:.25rem; font-size:.82rem; color:var(--ink-soft); line-height:1.45}
.quiz-intro-note{margin-top:1rem; font-size:.83rem; color:var(--ink-faint)}
.quiz-start-state:empty{display:none}

.checkpoint-next{
  background:var(--paper-raised); border:1px solid var(--line); border-top:4px solid var(--red);
  border-radius:var(--radius-lg); padding:1.5rem; margin-top:1.6rem; box-shadow:var(--shadow-card);
}
.checkpoint-next h2{font-size:1.2rem; margin:0 0 .4rem}
.btn-link-skip{
  display:inline-block; margin-top:.9rem; background:none; border:none; padding:.4em 0;
  font-family:inherit; font-size:.86rem; font-weight:600; color:var(--blue);
  text-decoration:underline; text-underline-offset:2px; cursor:pointer;
}
.btn-link-skip:hover{color:var(--brass-deep)}

.depart-box{
  background:var(--paper-raised); border:1px solid var(--line); border-top:4px solid var(--blue);
  border-radius:var(--radius-lg); padding:1.4rem 1.5rem; margin-top:1.6rem; box-shadow:var(--shadow-card);
}
.depart-box h2{font-size:1.2rem; margin:0 0 .4rem}
.depart-list{display:grid; gap:.7rem; margin-top:1.1rem}
.depart-item{border:1px solid var(--line); border-radius:var(--radius-md); background:var(--paper); padding:.9rem 1rem}
.depart-item-head{display:flex; align-items:baseline; justify-content:space-between; gap:.6rem; flex-wrap:wrap; margin-bottom:.35rem}
.depart-item-head h3{font-size:.98rem; margin:0}
.depart-imp{margin:.5rem 0 0; font-size:.8rem; font-weight:600; color:var(--blue)}

/* ================================================================
   RÉSULTATS : PROFIL VIDE, PRIORITÉS, PARTAGE
   ================================================================ */
.profile-empty{
  max-width:620px; margin:2rem auto; text-align:center;
  background:var(--paper-raised); border:1px solid var(--line); border-top:5px solid var(--blue);
  border-radius:var(--radius-lg); padding:2.2rem 1.6rem; box-shadow:var(--shadow-card);
}
.profile-empty-icon{font-size:2rem; color:var(--red); line-height:1}
.profile-empty .lede{margin-left:auto; margin-right:auto}
.profile-empty-steps{display:flex; gap:.5rem; flex-wrap:wrap; justify-content:center; margin:1.1rem 0 1.5rem}
.profile-empty-steps span{font-size:.82rem; background:var(--line-soft); color:var(--ink-soft); padding:.35em .85em; border-radius:999px}
.priorities-box{margin-top:2rem; padding-top:1.6rem; border-top:1px solid var(--line)}
.priorities-box h2{font-size:1.15rem; margin:0 0 .4rem}
.chip-list{display:flex; flex-wrap:wrap; gap:.45rem; margin-top:.7rem}
.chip{font-size:.85rem; font-weight:700; background:var(--brass-pale); color:var(--brass-deep); padding:.4em .9em; border-radius:999px}
.dim-plain{font-size:.86rem; color:var(--ink-soft); margin:0 0 .5rem; line-height:1.45}
.dim-note{margin-top:.55rem; font-size:.82rem; color:var(--ink-soft); background:var(--line-soft); border-radius:var(--radius-sm); padding:.55rem .8rem; line-height:1.45}
.share-row{display:flex; flex-wrap:wrap; gap:.6rem; margin-top:2rem; padding-top:1.6rem; border-top:1px solid var(--line)}
.modal-actions{justify-content:center; margin-top:.4rem}

/* ================================================================
   PROGRAMMES
   ================================================================ */
.programs-note{
  background:var(--paper-raised); border:1px solid var(--line); border-left:4px solid var(--blue);
  border-radius:var(--radius-md); padding:1rem 1.2rem; margin:1.3rem 0; box-shadow:var(--shadow-card);
}
.programs-note strong{display:block; font-family:var(--font-display); font-size:1rem; margin-bottom:.35rem}
.programs-note p{margin:0 0 .55em; font-size:.88rem; color:var(--ink-soft); line-height:1.5}
.programs-note p:last-child{margin-bottom:0}
.programs-controls{display:flex; gap:.8rem; flex-wrap:wrap; align-items:center; justify-content:space-between; margin:1.2rem 0 1.1rem}
.program-tabs{display:flex; gap:.4rem; flex-wrap:wrap}
.program-tab{
  border:1.5px solid var(--line); background:var(--paper-raised); border-radius:999px;
  padding:.55em 1.1em; font-family:inherit; font-size:.87rem; font-weight:700; color:var(--ink-soft); cursor:pointer;
}
.program-tab:hover{border-color:var(--blue); color:var(--ink)}
.program-tab.active{background:var(--blue-deep); border-color:var(--blue-deep); color:#fff}
@media (prefers-color-scheme: dark){ .program-tab.active{background:var(--blue); border-color:var(--blue)} }
.program-filter{display:inline-flex; align-items:center; gap:.45rem; font-size:.85rem; color:var(--ink-soft)}
.program-filter select{
  border:1px solid var(--line); background:var(--paper-raised); color:var(--ink);
  border-radius:999px; padding:.5em .9em; font-family:inherit; font-size:.85rem; min-height:40px;
}
.program-phase-intro{font-size:.89rem; color:var(--ink-soft); margin:0 0 1rem; line-height:1.5}
.program-question-list{display:grid; gap:.6rem}
.program-question{
  background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-md);
  overflow:hidden; box-shadow:var(--shadow-card);
}
.program-question > summary{
  display:flex; align-items:center; gap:.75rem; padding:.85rem 1.05rem; cursor:pointer;
  list-style:none; font-family:inherit;
}
.program-question > summary::-webkit-details-marker{display:none}
.program-question > summary:hover{background:var(--line-soft)}
.program-question > summary:focus-visible{outline:3px solid var(--brass); outline-offset:-3px}
.program-question-count{font-family:var(--font-display); font-weight:800; font-size:.88rem; color:var(--ink-faint); flex:none}
.program-question-title{flex:1; min-width:0; font-size:.95rem; font-weight:700; color:var(--ink)}
.program-question-topic{
  font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.05em; white-space:nowrap;
  color:var(--blue); background:var(--right-pale); padding:.22em .6em; border-radius:999px;
}
.program-question[open] > summary{border-bottom:1px solid var(--line-soft)}
.program-question-content{padding:.2rem 1.05rem 1.1rem}
.program-question-plain{font-size:.89rem; color:var(--ink-soft); margin:.85rem 0; line-height:1.5}
.program-options{display:grid; gap:.5rem; grid-template-columns:repeat(auto-fit, minmax(230px, 1fr)); margin:.85rem 0}
.program-options > div{display:flex; gap:.6rem; align-items:flex-start; background:var(--line-soft); border-radius:var(--radius-sm); padding:.7rem .85rem}
.program-options > div > span{font-weight:800; color:var(--blue); flex:none; font-size:.85rem}
.program-options > div > p{margin:0; font-size:.88rem; line-height:1.45}
.program-basis{
  margin:1rem 0 0; padding:.75rem .9rem; background:var(--line-soft); border-radius:var(--radius-sm);
  font-size:.82rem; color:var(--ink-soft); line-height:1.5;
}
.program-basis strong{color:var(--ink)}
.program-basis p{margin:.3rem 0 0}
.program-basis ul{margin:.3rem 0 0; padding-left:1.1rem}
.program-basis li{margin-bottom:.2rem}
.program-answer-list{display:grid; gap:.6rem; margin-top:1rem}
@media(min-width:780px){ .program-answer-list{grid-template-columns:1fr 1fr} }
.program-answer{border:1px solid var(--line); border-radius:var(--radius-sm); padding:.75rem .9rem; background:var(--paper)}
.program-answer-head{display:flex; flex-direction:column; gap:.05rem; margin-bottom:.4rem}
.program-answer-head strong{font-size:.9rem; color:var(--ink)}
.program-answer-head span{font-size:.73rem; color:var(--ink-faint)}
.program-answer-label{
  display:inline-block; font-size:.75rem; font-weight:800; margin-bottom:.35rem;
  padding:.22em .65em; border-radius:999px; background:var(--line-soft); color:var(--ink-soft);
}
.program-answer.documented .program-answer-label{background:var(--good-pale); color:var(--good)}
.program-answer.unknown .program-answer-label{background:var(--warn-pale); color:var(--warn)}
.program-answer.toward-a .program-answer-label{background:var(--left-pale); color:var(--left)}
.program-answer.toward-b .program-answer-label{background:var(--right-pale); color:var(--right)}
.program-answer.balanced .program-answer-label{background:var(--line-soft); color:var(--ink-soft)}
.program-answer p{margin:.15rem 0; font-size:.85rem; color:var(--ink-soft); line-height:1.45}
.program-answer-note{font-size:.81rem !important; border-left:3px solid var(--line); padding-left:.6rem; margin-top:.45rem !important}
.program-primary-source{display:inline-block; margin-top:.5rem; font-size:.79rem; font-weight:700; color:var(--blue)}
.program-source-list{margin-top:1.3rem; font-size:.87rem}
.program-source-list summary{cursor:pointer; font-weight:700; padding:.5rem 0; color:var(--ink)}
.program-source-list ul{margin:.4rem 0 0; padding-left:1.15rem; display:grid; gap:.35rem; color:var(--ink-soft)}
.source-subheading{font-weight:800; color:var(--ink); margin-top:.9rem}
.source-type{color:var(--ink-faint); font-size:.8rem}

/* ================================================================
   SONDAGES : NOTES & DÉTAILS
   ================================================================ */
.poll-note{display:block; margin-top:.15rem; font-size:.72rem; color:var(--ink-faint); line-height:1.35}
.poll-bar-item.poll-out-scope{opacity:.72}
.poll-bar-item.poll-out-scope .poll-candidate-info strong::after{
  content:"(hors périmètre)"; display:inline-block; margin-left:.35rem; font-size:.66rem; font-weight:700;
  color:var(--ink-faint); background:var(--line-soft); padding:.1em .45em; border-radius:999px; vertical-align:middle;
}
.duel-detail{margin-top:.8rem; border-top:1px dashed var(--line); padding-top:.6rem}
.duel-detail summary{cursor:pointer; font-size:.8rem; font-weight:700; color:var(--blue)}
.duel-detail ul{list-style:none; margin:.5rem 0 0; padding:0; display:grid; gap:.3rem}
.duel-detail li{display:grid; grid-template-columns:1fr auto auto; gap:.6rem; font-size:.78rem; color:var(--ink-soft)}
.duel-detail li strong{color:var(--ink); font-variant-numeric:tabular-nums}

/* ================================================================
   DIVERS
   ================================================================ */
.text-muted{color:var(--ink-faint)}
.method-section{
  background:var(--paper-raised); border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:1.35rem 1.5rem; margin-bottom:1.05rem; box-shadow:var(--shadow-card);
}
.method-section h2{font-size:1.15rem; margin:0 0 .45rem}
.method-section p{margin:0 0 .55em; font-size:.91rem; color:var(--ink-soft); line-height:1.6}
.method-section p:last-child{margin-bottom:0}
.method-section ul{margin:.4rem 0 0; padding-left:1.15rem; display:grid; gap:.4rem; font-size:.89rem; color:var(--ink-soft)}
.method-section li strong{color:var(--ink)}
.party-directory-actions{margin-top:1.6rem}
.party-person-role{margin:.15rem 0 .4rem; font-size:.84rem; color:var(--ink-soft)}
.dc-note{margin:.45rem 0 0; font-size:.81rem; color:var(--ink-soft); border-left:3px solid var(--line); padding-left:.6rem; line-height:1.45}
.ring-label-empty{color:var(--ink-faint)}

/* ================================================================
   NAVIGATION MOBILE (bouton menu + panneau déroulant)
   ================================================================ */
.nav-toggle{
  display:none; flex-direction:column; justify-content:center; gap:4px;
  width:44px; height:44px; padding:0 10px; background:var(--paper-raised);
  border:1px solid var(--line); border-radius:12px; cursor:pointer; flex:none;
}
.nav-toggle-bar{display:block; width:100%; height:2px; border-radius:2px; background:var(--ink); transition:transform .22s ease, opacity .18s ease}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

@media (max-width:1100px){
  .nav-toggle{display:flex}
  .topbar nav{
    position:absolute; top:100%; left:0; right:0;
    flex-direction:column; align-items:stretch; gap:.1rem;
    background:var(--paper-raised); border-bottom:1px solid var(--line);
    padding:.5rem .85rem .8rem; box-shadow:0 12px 26px rgba(20,33,61,.12);
    max-height:calc(100vh - 70px); overflow-y:auto; display:none;
  }
  .topbar nav.open{display:flex}
  .navlink{width:100%; text-align:left; padding:.7rem .8rem; border-radius:var(--radius-sm); font-size:.95rem}
  .navlink.active{box-shadow:none}
  .donate-quick{display:inline-flex; width:auto; text-align:center; padding:.52rem .72rem; font-size:.82rem; flex:none}
}

/* ================================================================
   DENSITÉ MOBILE (iPhone SE 320 px & Galaxy 360 px)
   ================================================================ */
@media (max-width:480px){
  .scale-btn{padding:.55rem .75rem; min-height:42px; font-size:.88rem}
  .q-card{padding:1.1rem .9rem}
  .radar-score-val .score-number{font-size:2.4rem}
  .radar-score-card{padding:1rem}
  .radar-check-list{grid-template-columns:1fr}
  .sim-bar-row{grid-template-columns:100px 1fr 62px}
  .sim-bar-label{font-size:.78rem}
  .sim-bar-label small{display:none}
  .candidature-card{padding:.9rem 1rem}
  .quiz-intro-card{padding:1rem}
}