/* TROIS RÔLES, TROIS JETONS.
     --ink servait à la fois de couleur de texte, de bordure ET de fond des blocs
     noirs. Ces rôles divergent dès qu'on inverse le thème : le texte doit
     s'éclaircir, le fond des blocs non. D'où :
       --ink       texte et bordures   (sombre en clair, clair en sombre)
       --strong    fond des blocs forts (sombre dans les DEUX thèmes)
       --on-strong ce qui se lit dessus (clair dans les deux)
       --on-candy  ce qui se lit sur une pastille jaune/rose/cyan/lime —
                   ces pastilles restent vives, donc leur texte reste sombre,
                   sinon on obtient du clair sur jaune, illisible. */
  :root{
    --ink:#131313;
    --ink-2:#131313;
    --paper:#FFFDF5;
    --paper-2:#FFFBEA;
    --card:#FFFFFF;
    --line:#131313;
    --slate:#555555;
    --strong:#131313;
    --on-strong:#FFFDF5;
    --on-strong-dim:#C9CEDD;
    --on-candy:#131313;
    --gold:#131313;
    --gold-soft:#FFDD33;
    --amber:#131313;
    --amber-soft:#FFF7D6;
    --green:#2E7D32;
    --green-soft:#C6F24E;
    --red:#C0143C;
    --red-soft:#FF90C8;
    --yellow:#FFDD33;
    --pink:#FF90C8;
    --cyan:#7DE0E6;
    --lime:#C6F24E;
    --vote-pour:#2E9958;
    --vote-contre:#D9442F;
    --vote-abst:#8B8578;
    --track:#D8D4C8;
    --radius:0px;
    --shadow:5px 5px 0 var(--ink);
  }

  /* THÈME SOMBRE — chaud plutôt que gris bleuté, pour rester dans la famille du
     papier crème. Les pastilles candy sont légèrement assourdies : à pleine
     saturation sur fond sombre, elles éblouissent. */
  /* ⚠️ THÈME DÉSACTIVÉ (2026-09-12, décision de Martin : « ça le fait pas »).
     Le bloc ci-dessous est complet et vérifié, mais rien ne le déclenche : ni
     bouton dans l'entête, ni @media (prefers-color-scheme: dark). Aucun visiteur
     ne le voit, y compris ceux dont le système est en sombre — inutile de leur
     servir un design qu'on n'a pas validé.
     POUR LE RALLUMER, au choix :
       • essai ponctuel : document.documentElement.setAttribute('data-theme','sombre')
       • suivre le système : réenvelopper le bloc dans
         @media (prefers-color-scheme: dark){ :root:not([data-theme="clair"]){ … } }
       • choix manuel : remettre le bouton (voir l'historique git, commit « Mode sombre »).
     La séparation des rôles de couleur (--strong / --on-strong / --on-candy) reste
     en place : elle ne change rien au mode clair et c'est elle qui rend le thème
     possible. La refaire coûterait cher. */
  :root[data-theme="sombre"]{
    --ink:#F3EFE0;
    --ink-2:#F3EFE0;
    --paper:#14140E;
    --paper-2:#1C1B13;
    --card:#232118;
    --line:#D8D2BE;
    --slate:#A8A292;
    --strong:#2B2921;
    --on-strong:#F6F2E4;
    --on-strong-dim:#A9A392;
    --on-candy:#131313;
    --gold:#F3EFE0;
    --gold-soft:#E8C62B;
    --amber:#F3EFE0;
    --amber-soft:#3A3626;
    --green:#6FCF7A;
    --green-soft:#AFD945;
    --red:#FF7A93;
    --red-soft:#E87BB4;
    --yellow:#E8C62B;
    --pink:#E87BB4;
    --cyan:#62C6CC;
    --lime:#AFD945;
    --vote-pour:#4CAF6A;
    --vote-contre:#E2573F;
    --vote-abst:#9A9382;
    --track:#3A3628;
  }
  h1, h2, .brand-text h1{ font-family:'Archivo Black',sans-serif !important; text-transform:uppercase; letter-spacing:-0.015em; font-weight:400; }
  .bill h3, .m-card h3, .vote-card h3, .depute-card h3, .petition-card h3, .role-card h3, .lexique-item dt, .calendar-box h3, .mission-box h2, .issue-body h3, .role-group-title{ font-family:'Archivo Black',sans-serif !important; text-transform:uppercase; letter-spacing:-0.01em; font-weight:400; line-height:1.15; }
  .dq-ticker{background:var(--strong); color:var(--on-strong); overflow:hidden;}
  header.top{ display:grid !important; grid-template-columns:1fr auto 1fr; align-items:center !important; gap:16px; padding:14px 26px !important; border-bottom:5px solid var(--ink) !important; }
  .brand{ display:block !important; font-family:'Archivo Black',sans-serif; font-size:38px; text-transform:uppercase; letter-spacing:-0.02em; text-align:center; cursor:pointer; line-height:1; color:var(--ink); text-decoration:none; }
  .brand .hl{ background:var(--yellow); padding:0 8px;  color:var(--on-candy);}
  .header-date{ font-size:12px; font-weight:600; text-transform:uppercase; color:var(--ink); white-space:nowrap; }
  .header-left{ display:flex; align-items:center; gap:12px; min-width:0; }
  .header-right{ display:flex; gap:6px; justify-content:flex-end; align-items:center; }
  header.top .font-size-ctrl{ border:none !important; padding:0; gap:6px; background:transparent; }
  header.top .font-size-ctrl button, header.top .lang-toggle{ border:2px solid var(--ink) !important; border-radius:0 !important; background:var(--paper) !important; color:var(--ink) !important; font-weight:700; height:30px; box-shadow:none; }
  header.top .lang-toggle{ background:var(--strong) !important; color:var(--on-strong) !important; }
  @media (max-width:640px){
    .header-date{display:none;}
    /* minmax(0,1fr) : sans ça la colonne refuse de descendre sous le min-content
       du logo (283px) et, additionné aux contrôles (183px), le header force la
       page à 484px sur un écran de 412px. */
    header.top{grid-template-columns:minmax(0,1fr) auto; padding:14px 18px !important; gap:10px;}
    .brand{grid-column:1; grid-row:1; text-align:left; font-size:24px; min-width:0; overflow-wrap:anywhere;}
    .header-right{grid-column:2; grid-row:1; gap:6px;}
    /* Le réseau des provinces s'ouvre sous le logo principal */
    .header-left{grid-column:1 / -1; grid-row:2; justify-content:center; margin-top:6px; min-width:0;}
  }
  .dq-ticker > div{display:flex; white-space:nowrap; width:max-content; animation:dcTicker 32s linear infinite; font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:0.06em; padding:7px 0;}
  .dq-ticker:hover > div{animation-play-state:paused;}
  @keyframes dcTicker{from{transform:translateX(0);} to{transform:translateX(-50%);}}
  *{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{
    background:var(--paper);
    color:var(--ink);
    font-family:'IBM Plex Mono',monospace;
    -webkit-font-smoothing:antialiased;
    min-height:100vh;
  }
  .app{--gutter:28px; max-width:1280px;margin:0 auto;padding:0 var(--gutter) 24px;}

  /* ---------- HEADER ---------- */
  header.top{
    padding:36px 28px 0;
    max-width:1280px;
    margin:0 auto;
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    gap:24px;
    flex-wrap:wrap;
    border-bottom:1px solid var(--line);
    padding-bottom:22px;
  }
  .brand{display:flex;align-items:center;gap:14px;cursor:pointer;}
  .brand-mark{
    width:40px;height:40px;flex:none;
    border:none; overflow:hidden;
    border-radius:50%;
    position:relative;
  }
  .brand-mark svg{position:absolute;inset:0;}
  .brand-text h1{
    font-family:'IBM Plex Mono',monospace;
    font-weight:600;
    font-size:22px;
    letter-spacing:-0.01em;
    margin:0;
    line-height:1.05;
  }
  .brand-text p{margin:2px 0 0; font-size:12.5px; color:var(--slate); letter-spacing:0.02em;}
  /* Logo + pastilles côte à côte. Les pastilles s'empilent en colonne et
     débordent vers la droite après 3 (max-height = 3 ronds), donc l'en-tête
     ne grandit jamais même en ajoutant des provinces. */
  .brand-col{display:flex; align-items:center; gap:14px;}
  .province-network{display:flex; flex-direction:row; flex-wrap:wrap; align-content:center; max-height:none; gap:6px;}
  .pn-dot{width:26px; height:26px; border-radius:50%; border:2px solid var(--ink); display:inline-flex; align-items:center; justify-content:center; font-family:'IBM Plex Mono',monospace; font-size:10.5px; font-weight:800; letter-spacing:-0.04em; color:#fff; text-decoration:none; box-shadow:none; transition:transform .12s;}
  .pn-dot:hover{transform:scale(1.15);}
  #provinceNetwork .pn-2{ display:none; }
  @media (max-width:640px){ #provinceNetwork .pn-2{ display:inline-flex; } #provinceNetworkR{ display:none; } }
  .pn-dot.pn-off{ background:transparent !important; color:var(--slate); border-color:var(--slate); opacity:.5; cursor:default; }
  .pn-dot.pn-off:hover{ transform:none; }
  /* La seule pastille avec un vrai lien se retourne périodiquement pour se signaler */
  .pn-dot.pn-live{ animation:pnFlip 5s ease-in-out infinite; }
  @keyframes pnFlip{ 0%,80%{transform:rotateY(0);} 90%{transform:rotateY(180deg);} 100%{transform:rotateY(360deg);} }
  .pn-dot.pn-live:hover{ animation-play-state:paused; transform:scale(1.15); }
  .top-meta{display:flex; gap:28px; align-items:baseline; flex-wrap:wrap;}
  .top-meta .stat{text-align:right;}
  .top-meta .stat b{
    display:block; font-family:'IBM Plex Mono',monospace; font-size:20px; font-weight:600;
  }
  .top-meta .stat span{font-size:11px; color:var(--slate); text-transform:uppercase; letter-spacing:0.06em;}

  /* ---------- NAV TABS ---------- */
  nav.tabs{
    max-width:1280px;margin:0 auto; padding:0;
    display:grid; grid-template-columns:repeat(6,1fr); gap:0;
    border-bottom:5px solid var(--ink); background:var(--card);
   color:var(--ink);}
  nav.tabs::-webkit-scrollbar{height:32px; width:32px;}
  nav.tabs::-webkit-scrollbar-track{background:transparent;}
  nav.tabs::-webkit-scrollbar-thumb{background:#c1c1c1; border-radius:16px; border:8px solid var(--paper);}
  nav.tabs::-webkit-scrollbar-thumb:hover{background:#a8a8a8;}
  nav.tabs{scrollbar-width:auto;}
  nav.tabs a{
    font-family:'IBM Plex Mono',monospace;
    font-size:12.5px; font-weight:700; text-transform:uppercase;
    letter-spacing:0.01em;
    background:none; border:none; border-right:2px solid var(--ink);
    padding:12px 6px; margin:0 !important;
    color:var(--ink); cursor:pointer; text-align:center;
    white-space:nowrap; text-decoration:none;
  }
  nav.tabs a:last-child{border-right:none;}
  nav.tabs a[data-view='apercu']:hover, nav.tabs a[data-view='apercu'].active{background:var(--yellow); color:var(--on-candy);}
  nav.tabs a[data-view='ministres']:hover, nav.tabs a[data-view='ministres'].active{background:var(--pink); color:var(--on-candy);}
  nav.tabs a[data-view='projets']:hover, nav.tabs a[data-view='projets'].active{background:var(--lime); color:var(--on-candy);}
  nav.tabs a[data-view='votes']:hover, nav.tabs a[data-view='votes'].active{background:var(--yellow); color:var(--on-candy);}
  nav.tabs a[data-view='cabinet']:hover, nav.tabs a[data-view='cabinet'].active{background:var(--cyan); color:var(--on-candy);}
  nav.tabs a[data-view='lexique']:hover, nav.tabs a[data-view='lexique'].active{background:var(--pink); color:var(--on-candy);}
  nav.tabs a .n{
    font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:12.5px;
    color:inherit; margin-right:5px;
  }
  nav.tabs a.active{color:var(--ink);}

  nav.tabs .close-menu{display:none;}

  .view{display:none; padding-top:0;}
  .view.active{display:block;}

  /* ---------- INTRO BANNER ---------- */
  .intro-toggle-row{display:flex; justify-content:flex-end; margin-bottom:8px;}
  .quick-nav{
    display:flex; flex-wrap:wrap; gap:8px; align-items:center;
    margin-bottom:20px; padding-bottom:14px; border-bottom:3px solid var(--ink);
  }
  .quick-nav-label{font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--slate); text-transform:uppercase; letter-spacing:0.03em; margin-right:4px;}
  .quick-nav a{
    font-family:'IBM Plex Mono',monospace; font-size:12px; font-weight:700; text-transform:uppercase; color:var(--ink);
    background:var(--card); border:2px solid var(--ink); border-radius:0;
    padding:6px 13px; cursor:pointer; text-decoration:none;
  }
  .quick-nav a:hover{background:var(--yellow); color:var(--on-candy);}

  .intro-compact{
    display:none; justify-content:space-between; align-items:center; gap:12px;
    background:var(--card); border:3px solid var(--ink); border-radius:0; box-shadow:4px 4px 0 var(--ink);
    padding:12px 16px; margin-bottom:24px; cursor:pointer; font-size:12.5px; color:var(--ink);
  }
  .intro-compact.open{display:flex;}
  .intro-compact:hover{background:var(--paper-2); color:var(--ink);}
  #introBlock.collapsed{display:none;}

  .mission-box{
    background:var(--card); border:3px solid var(--ink); border-radius:0; box-shadow:5px 5px 0 var(--ink);
    padding:22px 24px; margin-bottom:28px;
   color:var(--ink);}
  .mission-box h2{font-family:'IBM Plex Mono',monospace; font-weight:500; font-size:19px; margin:20px 0 10px; color:var(--ink);}
  .mission-box .compare{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:16px;}
  @media (max-width:640px){.mission-box .compare{grid-template-columns:1fr;}}
  .mission-box .compare-col{background:var(--paper-2); border:2px solid var(--ink); border-radius:0; padding:14px 16px; color:var(--ink);}
  .mission-box .compare-col .tag{font-family:'IBM Plex Mono',monospace; font-size:10px; text-transform:uppercase; letter-spacing:0.03em; color:var(--slate); display:block; margin-bottom:8px;}
  .mission-box .compare-col ul{margin:0; padding-left:18px; font-size:12.5px; line-height:1.7; color:var(--ink);}

  .banner{
    background:var(--strong); color:var(--on-strong);
    border-radius:var(--radius);
    padding:22px 24px;
    margin-bottom:28px;
    display:flex; gap:20px; justify-content:space-between; align-items:flex-start;
    flex-wrap:wrap;
  }
  .banner h2{font-family:'IBM Plex Mono',monospace; font-weight:500; font-size:19px; margin:0 0 6px;}
  .banner p{margin:0; font-size:13.5px; line-height:1.55; color:var(--on-strong-dim); max-width:640px;}
  .banner .badge{
    font-family:'IBM Plex Mono',monospace; font-size:10.5px; font-weight:700; letter-spacing:0.04em;
    text-transform:uppercase; background:var(--yellow);
    border:2px solid var(--ink);
    padding:4px 10px; border-radius:0; color:var(--on-candy); flex:none;
  }

  /* ---------- SECTION HEADS ---------- */
  .section-head{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:22px; gap:16px 20px; flex-wrap:wrap;}
  .section-head > div:first-child{ display:flex; flex-direction:column; gap:10px; }
  .bd-back{ font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:11px; text-transform:uppercase; color:var(--ink); background:var(--card); border:2px solid var(--ink); border-radius:0; padding:6px 12px; cursor:pointer; flex:none; user-select:none; height:fit-content; box-shadow:2px 2px 0 var(--ink); text-decoration:none; }
  .bd-back:hover{ border-color:var(--gold); color:var(--gold); }
  .footer-etmoi{ cursor:pointer; color:var(--gold); margin-left:4px; text-decoration:none; }
  .footer-etmoi:hover{ text-decoration:underline; }
  .snooze-pill{
    font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:11px; text-transform:uppercase; color:var(--ink);
    background:var(--card); border:2px solid var(--ink); border-radius:0;
    padding:6px 12px; cursor:pointer; flex:none; user-select:none; height:fit-content; box-shadow:2px 2px 0 var(--ink);
  }
  .snooze-pill:hover{border-color:var(--gold); color:var(--gold);}
  .snooze-pill.snoozed{background:var(--strong); color:var(--on-strong); border-color:var(--ink); box-shadow:none;}
  [id^="body-"].collapsed{display:none;}
  .view{ --page:var(--yellow); }
  #view-ministres{ --page:var(--pink); }
  #view-projets{ --page:var(--lime); }
  #view-votes{ --page:var(--yellow); }
  #view-cabinet{ --page:var(--cyan); }
  #view-lexique{ --page:var(--pink); }
  .section-head h2{ font-family:'Archivo Black',sans-serif !important; text-transform:uppercase; letter-spacing:-0.01em; font-weight:400; font-size:24px; margin:0; display:inline-block; background:var(--page); color:var(--ink); padding:6px 14px; border:3px solid var(--ink); box-shadow:5px 5px 0 var(--ink); line-height:1.1; }
  .section-head .sub{font-size:12.5px; font-weight:600; text-transform:uppercase; letter-spacing:0.02em; color:var(--ink); margin-top:0;}
  .page-band{ background:var(--page); border-bottom:5px solid var(--ink); padding:26px var(--gutter) 28px; margin:0 calc(-1 * var(--gutter)) 26px; display:flex; align-items:flex-end; justify-content:space-between; gap:18px 24px; flex-wrap:wrap; }
  .band-search{ flex:1; min-width:280px; max-width:460px; border:3px solid var(--ink); background:var(--card); padding:12px 16px; font-family:'IBM Plex Mono',monospace; font-size:13.5px; font-weight:600; box-shadow:5px 5px 0 var(--ink); outline:none; border-radius:0;  color:var(--ink);}
  .page-band .band-title{ color:var(--on-candy); font-family:'Archivo Black',sans-serif; font-size:44px; text-transform:uppercase; letter-spacing:-0.01em; font-weight:400; margin:0; line-height:1.04; }
  .crumbs{ font-family:'IBM Plex Mono',monospace; font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:0.06em; color:var(--on-candy); margin:0 0 10px; }
  .crumbs a{ color:inherit; text-decoration:underline; text-underline-offset:3px; }
  .crumbs a:hover{ text-decoration-thickness:2px; }
  .page-band .sub{ font-size:13px; font-weight:600; text-transform:uppercase; letter-spacing:0.04em; color:var(--on-candy); margin:8px 0 0; }
  .page-toolbar{ display:flex; gap:10px 16px; flex-wrap:wrap; align-items:center; margin-bottom:20px; }
  @media (max-width:640px){ .page-band .band-title{ font-size:30px; } }
  /* Les titres de bande nomment le fédéral (« Lexique du Parlement — 14 termes ») : plus
     longs, ils poussaient la recherche du Lexique sous le titre. La colonne du titre peut
     maintenant rétrécir, le titre passe à la ligne et la recherche reste à droite. */
  #view-lexique .page-band > div:first-child, #view-projets .page-band > div:first-child{ flex:1 1 420px; min-width:0; }
  #view-bd{ --page:var(--cyan); }
  /* ---------- MISES À JOUR DU SITE (/mises-a-jour) ----------
     La case du créateur reprend celle de l'ancienne bande dessinée (photo ronde, bulle,
     trait sous le nom), refaite en HTML et au style du site (traits noirs, ombres franches). */
  .createur{ max-width:760px; background:var(--card); border:3px solid var(--ink); box-shadow:var(--shadow); padding:22px 26px; margin:0 0 36px; }
  .createur-tete{ display:flex; align-items:center; gap:24px; }
  /* Le mot du créateur : pourquoi le site existe. Texte de lecture, 62 caractères par ligne. */
  .createur-mot{ margin:20px 0 0; }
  .createur-mot p{ font-family:'Archivo',system-ui,sans-serif; font-size:15.5px; line-height:1.65; color:var(--ink); margin:0 0 11px; max-width:62ch; }
  .createur-mot p:last-child{ margin-bottom:0; }
  .createur-lead{ font-weight:700; border-left:5px solid var(--yellow); padding-left:12px; }
  /* Seule exception au « tout est carré » : la photo reste ronde, comme dans la case d'origine. */
  .createur-photo{ flex:none; width:120px; height:120px; border-radius:50% !important; object-fit:cover; border:3px solid var(--ink); background:var(--paper-2); }
  .createur-bulle{ position:relative; display:flex; flex-direction:column; gap:3px; min-width:0; background:var(--paper-2); border:3px solid var(--ink); padding:14px 20px 15px; font-family:'Archivo',sans-serif; font-size:15px; line-height:1.45; color:var(--ink); }
  /* La pointe de la bulle, tournée vers la photo : un triangle du trait, puis un du fond. */
  .createur-bulle::before, .createur-bulle::after{ content:''; position:absolute; top:50%; border-style:solid; border-color:transparent; }
  .createur-bulle::before{ left:-16px; margin-top:-13px; border-width:13px 16px 13px 0; border-right-color:var(--ink); }
  .createur-bulle::after{ left:-11px; margin-top:-9px; border-width:9px 11px 9px 0; border-right-color:var(--paper-2); }
  .createur-nom{ font-family:'Archivo Black',sans-serif; font-weight:400; font-size:21px; line-height:1.2; margin-top:2px; }
  .createur-nom::after{ content:''; display:block; width:120px; max-width:100%; height:4px; margin:7px 0 4px; background:var(--yellow); }
  @media (max-width:560px){
    .createur{ padding:16px; }
    .createur-tete{ gap:18px; }
    .createur-photo{ width:84px; height:84px; }
    .createur-mot p{ font-size:15px; }
    .createur-bulle{ padding:11px 14px 12px; font-size:14px; }
    .createur-nom{ font-size:18px; }
  }
  .maj{ max-width:760px; }
  .maj-liste, .maj-liste ol{ list-style:none; margin:0; padding:0; }
  .maj-mois{ margin:0 0 30px; }
  .maj-mois h2{ font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:13px; text-transform:uppercase; letter-spacing:0.06em; color:var(--ink); margin:0 0 4px; padding-bottom:8px; border-bottom:3px solid var(--ink); }
  .maj-entree{ display:grid; grid-template-columns:118px 1fr; gap:16px; padding:14px 0; border-bottom:1px solid var(--track); }
  .maj-entree time{ font-family:'IBM Plex Mono',monospace; font-size:12.5px; font-weight:600; color:var(--slate); padding-top:3px; }
  .maj-corps h3{ font-family:'Archivo',sans-serif; font-weight:600; font-size:16px; line-height:1.3; margin:7px 0 4px; color:var(--ink); text-transform:none; letter-spacing:0; }
  .maj-corps p{ margin:0; font-family:'Archivo',sans-serif; font-size:14.5px; line-height:1.55; color:var(--ink); }
  .maj-volet{ display:inline-block; font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:10.5px; text-transform:uppercase; letter-spacing:0.04em; line-height:1; padding:4px 7px 3px; border:2px solid var(--ink); background:var(--card); color:var(--on-candy); }
  .maj-volet-projets{ background:var(--lime); }
  .maj-volet-deputes, .maj-volet-lexique{ background:var(--pink); }
  .maj-volet-votes{ background:var(--yellow); }
  .maj-volet-compte{ background:var(--cyan); }
  .maj-vide{ font-size:14px; color:var(--slate); padding:14px 0; }
  .maj-plus{ font-family:'IBM Plex Mono',monospace; font-size:12.5px; font-weight:700; text-transform:uppercase; cursor:pointer; background:var(--card); color:var(--ink); border:3px solid var(--ink); box-shadow:4px 4px 0 var(--ink); padding:10px 18px; margin:4px 0 12px; }
  .maj-plus:hover{ background:var(--yellow); color:var(--on-candy); }
  .maj-plus[hidden]{ display:none; }
  @media (max-width:560px){ .maj-entree{ grid-template-columns:1fr; gap:2px; } }
  /* Accueil : la phrase d'intro et ses chiffres (écrits par renderApercuStats, pré-rendus). */
  .a3-intro{ font-family:'Archivo',sans-serif; font-size:15px; line-height:1.55; margin:0 0 24px; color:var(--ink); }
  .a3-intro:empty{ display:none; }
  .a3-intro b{ font-family:'Archivo Black',sans-serif; font-weight:400; background:var(--yellow); color:var(--on-candy); padding:0 4px; }
  /* Zones remplies par le JavaScript : on réserve leur hauteur pour que le contenu
     pré-rendu ne saute pas quand elles se remplissent (CLS). */
  #challengedList:empty{ min-height:207px; }
  @media (max-width:640px){ #challengedList:empty{ min-height:277px; } }
  .toolbar{display:flex; gap:10px; flex-wrap:wrap;}
  .toolbar input, .toolbar select{
    font-family:'IBM Plex Mono',monospace; font-size:13px; font-weight:600;
    border:2px solid var(--ink); background:var(--card);
    padding:9px 12px; border-radius:0; color:var(--ink);
  }
  .toolbar input{min-width:200px;}

  /* ---------- HEMICYCLE (signature element) ---------- */
  .hemicycle-wrap{
    background:var(--card); border:3px solid var(--line); border-radius:var(--radius);
    padding:24px; margin-bottom:28px; display:flex; gap:28px; align-items:center; flex-wrap:wrap;
   color:var(--ink);}
  .hemicycle-wrap svg{flex:none; width:100%; max-width:420px; height:auto;}
  .hemicycle-legend{display:flex; flex-direction:column; gap:10px; font-size:13px;}
  .hemicycle-legend .row{display:flex; align-items:center; gap:8px;}
  .hemicycle-legend .dot{width:10px;height:10px;border-radius:50%;}
  .hemicycle-legend b{font-family:'IBM Plex Mono',monospace; font-size:12.5px;}

  /* ---------- MINISTER GRID ---------- */
  .grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:14px;}
  #view-cabinet .grid{ grid-template-columns:repeat(3,1fr); gap:20px; }
  .min-more{ border:3px dashed var(--ink); background:var(--paper); padding:20px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; text-align:center; cursor:pointer; text-decoration:none; color:var(--ink); }
  .min-more:hover{ background:var(--amber-soft);  color:var(--on-candy);}
  .min-more-n{ font-family:'Archivo Black',sans-serif; font-size:30px; line-height:1; }
  .min-more-t{ font-size:12.5px; font-weight:700; text-transform:uppercase; }
  @media (max-width:900px){ #view-cabinet .grid{ grid-template-columns:repeat(2,1fr); } }
  @media (max-width:640px){ #view-cabinet .grid{ grid-template-columns:1fr; } }
  .m-card{
    background:var(--card); border:3px solid var(--line); border-radius:var(--radius);
    padding:16px; position:relative; box-shadow:var(--shadow);
   color:var(--ink);}
  .m-card .top-row{display:flex; justify-content:space-between; align-items:flex-start; gap:8px;}
  .m-card .avatar, .depute-card .avatar{
    width:40px;height:40px;border-radius:0; border:2px solid var(--ink);
    background:var(--cyan); color:var(--on-candy);
    display:flex;align-items:center;justify-content:center;
    flex:none; text-decoration:none; transition:background 0.15s; font-family:'Archivo Black',sans-serif; font-size:14px;
  }
  .m-card .avatar:hover, .depute-card .avatar:hover{background:var(--yellow); color:var(--on-candy);}
  .m-card .avatar svg, .depute-card .avatar svg{width:18px; height:18px;}
  .m-card h3{font-size:15px; font-family:'IBM Plex Mono',monospace; font-weight:600; margin:10px 0 2px;}
  .m-card .role{font-size:12.5px; color:var(--slate); line-height:1.4; min-height:34px;}
  .mc-role-wrap{ min-height:34px; margin:9px 0 2px; }
  .mc-role{ display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.02em; border:2px solid var(--ink); padding:3px 9px; line-height:1.35; }
  .m-card .meta-row{display:flex; justify-content:space-between; align-items:center; margin-top:14px; padding-top:12px; border-top:2px solid var(--ink);}
  .m-card .party{font-size:11px; font-family:'IBM Plex Mono',monospace; color:var(--slate); text-transform:uppercase; letter-spacing:0.04em;}
  .follow-btn{
    font-family:'IBM Plex Mono',monospace; font-size:11.5px; font-weight:700; text-transform:uppercase;
    border:2px solid var(--ink); background:var(--card); color:var(--ink);
    padding:6px 11px; border-radius:0; cursor:pointer; box-shadow:2px 2px 0 var(--ink);
  }
  .follow-btn.on{background:var(--lime); color:var(--on-candy); border-color:var(--on-candy); box-shadow:none;}
  /* Alignés à GAUCHE, comme tout le reste de la fiche. En flex-end ils se
     collaient au bord droit : invisible dans les cartes étroites de l'accueil,
     mais sur une fiche de projet large (1175 px en desktop) les boutons se
     retrouvaient seuls dans le coin, à un écran du texte qu'ils concernent. */
  .bill-follow-row{display:flex; align-items:center; justify-content:flex-start; gap:10px; flex-wrap:wrap; margin-top:12px;}
  .follow-hint{font-size:11px; color:var(--slate); text-align:left;}
  /* Partage du projet (bouton natif sur mobile, sinon repli 𝕏 / FB / copier) */
  .bill-share-row{display:flex; align-items:center; justify-content:flex-start; gap:8px; flex-wrap:wrap; margin-top:10px;}
  .bill-share-label{font-family:'IBM Plex Mono',monospace; font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; color:var(--slate);}
  .bill-share-btn{font-family:'IBM Plex Mono',monospace; font-size:11.5px; font-weight:700; text-transform:uppercase; border:2px solid var(--ink); background:var(--card); color:var(--ink); padding:6px 11px; border-radius:0; cursor:pointer; box-shadow:2px 2px 0 var(--ink);}
  .bill-share-btn:hover{background:var(--yellow); color:var(--on-candy);}
  /* Confirmation du copier-coller, à même le bouton. Le lime dit « c'est fait »
     sans rien interrompre ; la transition évite le clignotement brutal. */
  /* Sélecteurs explicites plutôt qu'un `.copie` nu : la classe seule perdait la
     cascade dans la fiche de projet, et une couleur de confirmation qui ne
     s'affiche pas ne confirme rien. Couleur figée, pas de var() : une variable
     non résolue dans ce sous-arbre laissait le bouton blanc. */
  button.copie, a.copie, .bill-share-btn.copie, .cc-share .copie{background:#C6F24E !important; color:#131313 !important; border-color:#131313 !important;}
  button.copie-echec, a.copie-echec, .bill-share-btn.copie-echec, .cc-share .copie-echec{background:#FF90C8 !important; color:#131313 !important; border-color:#131313 !important;}
  .bill-share-btn.ic{padding:6px 10px; min-width:34px;}
  .vp-note{font-size:10.5px; color:var(--slate); background:var(--paper-2); border-radius:20px; padding:4px 9px; font-family:'IBM Plex Mono',monospace;}

  /* ---------- BILLS ---------- */
  .bill{
    background:var(--card); border:3px solid var(--line); border-radius:var(--radius);
    padding:18px 20px; margin-bottom:20px; cursor:pointer;
    box-shadow:var(--shadow); transition:border-color .15s, box-shadow .15s;
   color:var(--ink);}
  .bill:hover{transform:translate(2px,2px); box-shadow:3px 3px 0 var(--ink);}
  .bill .head{display:flex; justify-content:space-between; gap:16px; align-items:flex-start; flex-wrap:wrap;}
  .bill .head > div:first-child{flex:1 1 0; min-width:0;}
  .bill .num{font-family:'IBM Plex Mono',monospace; font-size:13px; color:var(--on-candy); font-weight:700; background:var(--cyan); border:2px solid var(--ink); padding:1px 7px; display:inline-block;}
  .bill h3{font-family:'IBM Plex Mono',monospace; font-size:16px; font-weight:600; margin:4px 0 8px; max-width:640px; line-height:1.35;}
  .bill .meta, .vote-card .meta{font-size:12px; color:var(--slate); margin-top:2px;}
  .bill .last-activity{
    font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--gold);
    margin:2px 0 6px; text-transform:uppercase; letter-spacing:0.02em;
  }
  .bill .last-activity b{color:var(--gold); font-weight:600;}
  .bill .expand-hint, .vote-card .expand-hint{font-family:'IBM Plex Mono',monospace; font-size:10.5px; color:var(--gold); margin-top:10px; text-transform:uppercase; letter-spacing:0.03em;}
  .vote-card .expand-hint{margin-top:18px;}
  .bill-summary{
    display:none; margin-top:14px; padding-top:16px; border-top:2px dashed var(--ink);
  }
  /* Fiche dépliée en deux colonnes (comme DossierQuébec) : le résumé à gauche garde
     des lignes courtes, la colonne de droite regroupe l'activité, le texte officiel
     et le partage. Une seule colonne sous 860 px. */
  .bill-meta-top{ font-family:'IBM Plex Mono',monospace; font-size:11.5px; font-weight:600; text-transform:uppercase; letter-spacing:0.03em; color:var(--slate); margin:0 0 10px; }
  .bill-stages{ display:flex; flex-wrap:wrap; gap:4px; margin:0 0 4px; }
  .bill-cols{ display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:32px; align-items:start; }
  .bill-col-main{ min-width:0; }
  .bill-side-label{ font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; color:var(--ink); margin:0 0 8px; }
  .bill-side-box{ border:3px solid var(--ink); background:var(--paper-2); padding:13px 16px; font-family:'Archivo',system-ui,sans-serif; font-weight:600; font-size:14.5px; line-height:1.4; color:var(--ink); }
  .bill-cta{ display:block; margin:16px 0 0; padding:14px 16px; text-align:center; background:var(--yellow); color:var(--on-candy); border:3px solid var(--ink); box-shadow:5px 5px 0 var(--ink); font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:12.5px; text-transform:uppercase; letter-spacing:0.02em; text-decoration:none; }
  .bill-cta:hover{ background:var(--strong); color:var(--yellow); }
  .bill-col-side .bill-share-row{ justify-content:flex-end; margin-top:20px; }
  @media (max-width:860px){ .bill-cols{ grid-template-columns:1fr; gap:18px; } .bill-col-side .bill-share-row{ justify-content:flex-start; } }
  .bill-summary.open{display:block;}
  .bill-summary p{font-family:'Archivo',system-ui,sans-serif; font-size:15.5px; line-height:1.65; color:var(--ink); margin:0 0 12px; max-width:59ch;}
  .bill-sum-head{font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; color:var(--gold); margin:0 0 9px;}
  .bill-sum-list{margin:0 0 12px; padding-left:22px;}
  /* TEXTE DE LECTURE EN ARCHIVO, PAS EN CHASSE FIXE.
     Le mono fait l'identité du site — étiquettes, pastilles, ticker, métadonnées —
     mais il est conçu pour aligner du code, pas pour lire de la prose : toutes les
     lettres ayant la même largeur, la silhouette des mots disparaît, et c'est
     justement ce que l'œil utilise pour lire vite. Archivo est déjà dans la
     famille du site (Archivo Black sert aux titres) et c'est la police de lecture
     de DossierQuébec. On en profite pour remonter la taille : 13 px de mono
     n'équivalent pas à 16 px de proportionnelle. */
  /* Longueur de ligne bornée : sur un grand écran, la colonne du résumé atteignait
     110 caractères par ligne — au-delà d'environ 75, l'œil retrouve mal le début de
     la ligne suivante. Avec la taille et l'interligne ci-dessous, on tombe à ~70. */
  .bill-sum-list li{font-family:'Archivo',system-ui,sans-serif; font-size:16px; line-height:1.65; color:var(--ink); margin:0 0 10px; font-weight:400; max-width:59ch;}
  .bill-sum-list li::marker{color:var(--gold);}
  .bill-summary .src-note{font-size:10.5px; color:var(--slate); margin:2px 0 0; font-style:italic;}
  /* Lobbying déclaré — bloc replié par défaut : la fiche reste courte, le détail
     s'ouvre à la demande (même logique que « qui a voté quoi »). */
  /* Pastille de filtre « Lobbying » + compteur sur la rangée : même cyan que le
     compteur du bloc, pour qu'on relie les deux d'un coup d'œil. */
  .step-chip.lob-chip b{background:var(--cyan); color:var(--on-candy); padding:0 4px; margin-left:5px; font-weight:700;}
  .step-chip.lob-chip.active b{background:var(--paper); color:var(--ink);}
  /* Omnibus, présenté comme sur DossierOntario : pastille pleine et sombre sur la
     rangée, avis à filet latéral, et une tête par partie (leur « annexe »). */
  .ab-omni{flex:none; font-family:'IBM Plex Mono',monospace; font-size:10.5px; font-weight:700; color:var(--on-strong); background:var(--strong); border:1px solid var(--ink); padding:2px 6px; cursor:pointer; text-transform:uppercase; letter-spacing:0.04em; line-height:normal;}
  .ab-omni:hover{ background:var(--yellow); color:var(--on-candy); }
  .step-chip.om-chip b{background:var(--lime); color:var(--on-candy); padding:0 4px; margin-left:5px; font-weight:700;}
  .step-chip.om-chip.active b{background:var(--paper); color:var(--ink);}
  /* Avis omnibus sur la fiche ouverte : un projet qui touche plusieurs lois ne se
     lit pas comme un projet ordinaire, et son titre n'en nomme qu'une. */
  .bill-omni-note{ font-family:'Archivo',system-ui,sans-serif; font-size:14px; line-height:1.5; color:var(--ink); background:var(--paper-2); border-left:5px solid var(--lime); padding:8px 12px; margin:0 0 14px; max-width:62ch; }
  /* Tête de partie dans un résumé d'omnibus (« ## Partie 2 — Transport… ») : le numéro
     en pastille, puis le sujet ou la loi touchée, en toutes lettres et en casse normale. */
  /* Découpage d'un omnibus, aux mesures de DossierOntario (relevées sur son site) :
     titre d'annexe en Archivo 15 px gras, marge de 16 px au-dessus, pas d'encadré —
     c'est l'espace et la pastille du numéro qui séparent, pas un filet. */
  .bill-part{ margin:16px 0 0; }
  .bill-part .bill-sum-list{ margin-bottom:0; }
  .bill-part .bill-sum-list li:last-child{ margin-bottom:0; }
  .bill-sum-part{ font-family:'Archivo',system-ui,sans-serif; font-weight:700; font-size:15px; line-height:1.35; color:var(--ink); margin:0 0 4px; max-width:62ch; }
  .bill-sum-part span{ display:inline-block; font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:11px; text-transform:uppercase; letter-spacing:0.05em; background:var(--strong); color:var(--on-strong); padding:2px 7px; margin-right:7px; vertical-align:2px; }
  .bill-sum-part:first-child{ margin-top:0; }
  .ab-lob{flex:none; font-family:'IBM Plex Mono',monospace; font-size:10.5px; font-weight:700; color:var(--on-candy); background:var(--cyan); border:1px solid var(--ink); padding:1px 5px; cursor:help;}
  .lob{margin:12px 0 0; border:2px solid var(--ink); background:var(--paper-2); padding:9px 11px; cursor:pointer; color:var(--ink);}
  .lob-head{display:flex; align-items:baseline; gap:8px; flex-wrap:wrap;}
  .lob.open .lob-body{cursor:auto;}
  .lob-title{font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; color:var(--gold);}
  .lob-count{font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--on-candy); background:var(--cyan); padding:1px 6px; font-weight:700;}
  .lob-asof{font-family:'IBM Plex Mono',monospace; font-size:10.5px; color:var(--slate); white-space:nowrap;}
  .lob-toggle{margin-left:auto; font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--slate); white-space:nowrap;}
  .lob-orgs{display:flex; flex-wrap:wrap; gap:4px; margin:8px 0 0;}
  .lob-org{font-family:'IBM Plex Mono',monospace; font-size:10.5px; color:var(--ink); background:var(--paper); border:1px solid var(--ink); padding:1px 6px;}
  .lob-org b{background:var(--yellow); padding:0 3px; margin-left:4px; color:var(--on-candy);}
  .lob-org.match{background:var(--yellow); border-width:2px; font-weight:700; color:var(--on-candy);}
  .lob-org.match b{background:var(--strong); color:var(--yellow);}
  .lob-body{display:none; margin:10px 0 0; border-top:1px dashed var(--slate); padding-top:9px;}
  .lob.open .lob-body{display:block;}
  .lob-item{display:block; text-decoration:none; color:inherit; border-left:3px solid var(--pink); padding:0 0 0 8px; margin:0 0 9px;}
  .lob-item:hover{border-left-color:var(--gold); background:var(--paper); color:var(--ink);}
  .lob-when{font-family:'IBM Plex Mono',monospace; font-size:10.5px; color:var(--slate);}
  .lob-who{font-size:12.5px; font-weight:600; color:var(--ink); line-height:1.35;}
  .lob-met{font-size:11.5px; color:var(--slate); line-height:1.4;}
  .lob-note{font-size:10.5px; color:var(--slate); margin:8px 0 0; font-style:italic; line-height:1.45;}
  .bill-more{
    display:inline-flex; align-items:center; gap:6px;
    font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:12.5px; text-transform:uppercase;
    background:var(--strong); color:var(--yellow); text-decoration:none;
    padding:8px 14px; border-radius:0; border:2px solid var(--ink); box-shadow:3px 3px 0 var(--ink);
  }
  .status-pill{
    font-family:'IBM Plex Mono',monospace; font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:0.04em;
    padding:3px 10px; border-radius:0; white-space:nowrap; flex:none; border:2px solid var(--ink);
  }
  .status-sanctionne{background:var(--lime); color:var(--on-candy);}
  .status-encours{background:var(--yellow); color:var(--on-candy);}
  .status-glace{background:var(--card); color:var(--ink); border:2px solid var(--ink);}
  /* Pro forma : gris volontairement éteint — ce projet n'ira nulle part, il ne
     doit pas attirer l'œil comme un projet vivant. */
  .status-proforma{background:var(--paper-2); color:var(--slate); border:2px dashed var(--slate);}

  .stepper{display:flex; gap:4px; margin-top:14px;}
  .stepper .step{flex:1; height:6px; background:var(--line); border-radius:2px; position:relative;}
  .stepper .step.done{background:var(--amber);}
  .stepper .step.current{background:var(--strong);}
  .stepper-labels{display:flex; gap:4px; margin-top:6px;}
  .stepper-labels span{flex:1; font-size:9.5px; color:var(--slate); text-align:center; line-height:1.2;}

  .vote-inline-block{margin-top:12px; padding-top:12px; border-top:1px dashed var(--line);}
  .vote-inline-date{font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--slate); text-transform:uppercase; letter-spacing:0.02em; margin-bottom:6px;}

  /* ---------- ONGLET VOTES : cartes par vote ---------- */
  .vote-card{ border:3px solid var(--ink); box-shadow:var(--shadow); background:var(--card); margin-bottom:16px;  color:var(--ink);}
  .vc-head{ display:flex; align-items:flex-start; gap:16px; padding:18px 20px; cursor:pointer; }
  .vc-head:hover{ background:var(--amber-soft);  color:var(--on-candy);}
  .vc-head-main{ flex:1; min-width:0; }
  .vc-head-main h3{ margin:0; font-family:'IBM Plex Mono',monospace !important; font-size:15px; font-weight:700; line-height:1.35; text-transform:none; letter-spacing:0; }
  .vc-meta{ font-family:'IBM Plex Mono',monospace; font-size:11.5px; font-weight:600; color:var(--slate); text-transform:uppercase; letter-spacing:0.04em; margin-top:5px; }
  .vc-counts{ display:flex; gap:14px; align-items:baseline; flex:none; }
  .vcc{ font-family:'IBM Plex Mono',monospace; font-size:10.5px; font-weight:700; text-transform:uppercase; color:var(--slate); white-space:nowrap; }
  .vcc b{ font-family:'Archivo Black',sans-serif; font-size:20px; font-weight:400; letter-spacing:-0.02em; display:block; }
  .vcc.pour b{ color:var(--vote-pour); } .vcc.contre b{ color:var(--vote-contre); } .vcc.abst b{ color:var(--vote-abst); }
  .vc-toggle{ flex:none; font-family:'Archivo Black',sans-serif; font-size:20px; line-height:1; min-width:20px; text-align:center; }
  .vote-card > .vc-bar{ margin:0 20px 18px; cursor:pointer; }
  .vc-detail{ display:none; border-top:3px solid var(--ink); padding:18px 20px; }
  .vc-detail.open{ display:block; }
  .vc-pgrid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(165px, 1fr)); gap:12px; margin-bottom:16px; }
  .vc-pbox{ border:2px solid var(--ink); background:var(--card);  color:var(--ink);}
  .vc-phead{ padding:7px 12px; font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:12px; text-transform:uppercase; letter-spacing:0.04em; border-bottom:2px solid var(--ink); }
  .vc-pbody{ padding:11px 12px; display:flex; flex-direction:column; gap:5px; }
  .vc-prow{ display:flex; justify-content:space-between; gap:10px; font-size:13px; }
  .vc-prow span{ font-family:'IBM Plex Mono',monospace; font-weight:600; text-transform:uppercase; letter-spacing:0.03em; color:var(--slate); }
  .vc-prow b{ font-weight:700; }
  .vc-ncols{ display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; margin-bottom:16px; }
  .vc-ncol{ border:2px solid var(--ink); background:var(--card); display:flex; flex-direction:column; min-width:0;  color:var(--ink);}
  .vc-nhead{ padding:7px 12px; font-family:'IBM Plex Mono',monospace; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; color:#fff; border-bottom:2px solid var(--ink); }
  .vc-nhead.pour{ background:var(--vote-pour)} .vc-nhead.contre{ background:var(--vote-contre)} .vc-nhead.abst{ background:var(--vote-abst); }
  .vc-nbody{ padding:10px 12px; max-height:260px; overflow-y:auto; display:flex; flex-direction:column; gap:5px; }
  .vc-nrow{ display:flex; align-items:center; gap:8px; font-size:12.5px; font-weight:600; }
  .vc-chip{ width:12px; height:12px; border:1px solid var(--ink); flex:none; }
  .vc-empty{ font-size:12px; color:var(--slate); }
  .vc-foot{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
  .vc-foot-note{ font-family:'IBM Plex Mono',monospace; font-size:11.5px; font-weight:600; text-transform:uppercase; letter-spacing:0.04em; color:var(--slate); max-width:60ch; }
  @media (max-width:820px){ .vc-ncols{ grid-template-columns:1fr; } }
  @media (max-width:640px){ .vc-head{ flex-wrap:wrap; } .vc-counts{ width:100%; order:3; } .vc-head-main{ flex:1 1 100%; order:2; } .result-badge{ order:1; } .vc-toggle{ order:1; margin-left:auto; } }
  .result-badge{ font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; border:2px solid var(--ink); padding:3px 10px; white-space:nowrap; flex:none; align-self:flex-start; }
  .result-badge.adopte{ background:var(--lime); color:var(--on-candy); }
  .result-badge.rejete{ background:var(--pink); color:var(--on-candy); }
  .vc-bar{ height:16px; border:2px solid var(--ink); background:var(--track); display:flex; overflow:hidden; }
  .vc-bar .seg{ height:100%; }
  .vc-bar .seg.pour{ background:var(--vote-pour)}
  .vc-bar .seg.contre{ background:var(--vote-contre); border-left:2px solid var(--ink)}
  .vc-bar .seg.abst{ background:var(--track); border-left:2px solid var(--ink); }
  .votes-more{ display:block; width:100%; margin-top:10px; border:3px solid var(--ink); background:var(--yellow); color:var(--on-candy); box-shadow:var(--shadow); cursor:pointer; font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:13px; text-transform:uppercase; letter-spacing:0.05em; padding:14px 20px; text-align:center; }
  .votes-more:hover{ background:var(--strong); color:var(--yellow); }
  .votes-more-note{ margin-top:10px; text-align:center; font-family:'IBM Plex Mono',monospace; font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:0.05em; color:var(--slate); }
  /* Bande pédagogique « Comment lire un vote » (pleine largeur) */
  .band-lire{ background:#12327A; color:#fff; padding:34px var(--gutter) 38px; margin:26px calc(-1 * var(--gutter)) 0; border-top:5px solid var(--ink); }
  .band-lire h2{ font-family:'Archivo Black',sans-serif !important; text-transform:uppercase; letter-spacing:-0.02em; font-size:clamp(24px,3.2vw,38px); margin:0 0 26px; color:#fff; background:none !important; border:none !important; box-shadow:none !important; padding:0 !important; }
  .lire-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
  .lire-box{ border:3px solid #fff; padding:20px 22px; }
  .lire-box h3{ font-family:'Archivo Black',sans-serif !important; font-size:19px; margin:0 0 10px; color:#fff; letter-spacing:-0.01em; text-transform:uppercase; }
  .lire-box p{ font-size:14px; line-height:1.55; margin:0; color:#D6E4FF; font-weight:500; }
  .lire-box.hl{ border-color:var(--yellow); background:rgba(255,221,51,0.10); }
  .lire-box.hl h3{ color:var(--yellow); }
  .lire-box.hl p{ color:#fff; }
  @media (max-width:900px){ .lire-grid{ grid-template-columns:1fr; } }
  /* ---------- VOTES TAB ---------- */
  .vote-card{background:var(--card); border:3px solid var(--line); border-radius:var(--radius); padding:18px 20px; margin-bottom:12px; cursor:pointer; box-shadow:var(--shadow); transition:border-color .15s, box-shadow .15s; color:var(--ink);}
  .vote-card:hover{transform:translate(2px,2px); box-shadow:3px 3px 0 var(--ink);}
  .vote-card .head{display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap;}
  .vote-card h3{font-family:'IBM Plex Mono',monospace; font-size:15.5px; font-weight:600; margin:2px 0 10px; max-width:600px;}
  .bar{height:18px; border-radius:0; background:var(--paper); display:flex; overflow:hidden; border:2px solid var(--ink); margin-top:8px; color:var(--ink);}
  .bar .seg{height:100%;}
  .bar .seg.pour{background:var(--lime); color:var(--on-candy);}
  .bar .seg.contre{background:var(--pink); color:var(--on-candy);}
  .bar .seg.abst{background:var(--strong); opacity:0.35;}
  .tally{display:flex; flex-direction:column; gap:6px; margin-top:10px; font-family:'IBM Plex Mono',monospace; font-size:12px;}
  @media (max-width:640px){ .tally{gap:14px;} }
  .tally b{font-size:14px;}
  .tally-row{display:flex; align-items:center; flex-wrap:wrap; gap:8px;}
  .tally-row .tally-label{flex:none;}
  .tally-breakdown{display:flex; flex-wrap:wrap; gap:2px 10px; color:var(--slate);}
  .tally-plus{
    font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:600; color:var(--on-strong);
    background:var(--strong); border:none; border-radius:50%; width:18px; height:18px;
    display:inline-flex; align-items:center; justify-content:center; cursor:pointer; flex:none;
  }
  .tally-plus:hover{opacity:0.7;}

  .nominal-detail{display:none; margin-top:10px; padding-top:10px; border-top:1px dashed var(--line);}
  .nominal-detail.open{display:block;}
  .nominal-party-group{margin-bottom:10px;}
  .nominal-party-group:last-child{margin-bottom:0;}
  .nominal-party-header{font-family:'IBM Plex Mono',monospace; font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:0.03em; margin-bottom:6px;}
  .nominal-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:6px;}
  .nominal-row{
    display:flex; justify-content:space-between; align-items:center; gap:8px;
    background:var(--card); border:2px solid var(--ink); border-radius:0;
    padding:7px 10px; font-size:12px;
   color:var(--ink);}

  .depute-card{
    background:var(--card); border:3px solid var(--line); border-radius:var(--radius);
    padding:16px; position:relative;
   color:var(--ink);}
  .depute-card .top-row{display:flex; justify-content:space-between; align-items:flex-start; gap:8px;}
  .depute-card h3{font-family:'IBM Plex Mono',monospace; font-size:14.5px; font-weight:600; margin:9px 0 2px;}
  .depute-card .meta{font-size:12px; color:var(--slate); min-height:17px;}
  .depute-card .meta-row{display:flex; justify-content:space-between; align-items:center; margin-top:12px; padding-top:10px; border-top:2px solid var(--ink);}
  .depute-party{
    font-family:'IBM Plex Mono',monospace; font-size:10.5px; font-weight:700; text-transform:uppercase;
    padding:3px 9px; border-radius:0; flex:none; border:2px solid var(--ink);
  }
  .depute-email{
    font-family:'IBM Plex Mono',monospace; font-size:10.5px; color:var(--slate);
    text-decoration:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
    max-width:150px;
  }
  .depute-email:hover{color:var(--ink); text-decoration:underline;}
  .party-filters{display:flex; gap:6px; flex-wrap:wrap; align-items:center;}
  .party-chip{
    font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:11px; text-transform:uppercase;
    padding:7px 12px; border-radius:0; cursor:pointer; border:2px solid var(--ink);
    background:var(--card); user-select:none;
   color:var(--ink);}
  .party-chip.active{color:var(--on-strong) !important;}
  /* Les couleurs de parti sont des couleurs de marque, calibrées pour du papier
     blanc. Posées en texte sur fond sombre, le bleu conservateur tombe à 1,7 de
     contraste. On les mélange vers l'encre claire : la teinte reste reconnaissable,
     la lecture redevient possible. */
  :root[data-theme="sombre"] .party-chip:not(.active){ color:color-mix(in srgb, var(--pc) 45%, #F3EFE0) !important; border-color:color-mix(in srgb, var(--pc) 60%, #F3EFE0) !important; }

  #legendBtn.active{ background:var(--yellow); color:var(--on-candy) !important; }
  #senateChip.active{ background:var(--cyan); color:var(--on-candy) !important; }

  .status-filters, .step-filters{display:flex; gap:6px; flex-wrap:wrap; align-items:center; margin-top:10px;}
  .step-filters{margin-top:6px;}
  .status-chip, .step-chip{
    font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:11px; text-transform:uppercase;
    padding:6px 12px; border-radius:0; cursor:pointer; user-select:none;
    border:2px solid var(--ink); background:var(--card); color:var(--ink);
  }
  .step-chip{font-size:10.5px; padding:5px 10px; text-transform:none; font-weight:500;}
  .status-chip.active{background:var(--yellow); border-color:var(--on-candy); color:var(--on-candy);}
  .step-chip.active{background:var(--yellow); border-color:var(--on-candy); color:var(--on-candy);}
  .filter-hamburger{display:none;}
  .sort-toggle{
    font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:700; text-transform:uppercase;
    padding:7px 14px; border-radius:0; cursor:pointer;
    border:2px solid var(--ink); background:var(--card); color:var(--ink); box-shadow:2px 2px 0 var(--ink);
    white-space:nowrap;
  }
  .sort-toggle:hover{border-color:var(--ink);}

  .no-results{font-size:13px; color:var(--slate); padding:20px 0;}
  /* Lu par les moteurs et les lecteurs d'écran, invisible à l'œil */
  .sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
  .filters-row{ display:flex; align-items:center; gap:10px 8px; flex-wrap:wrap; margin-bottom:20px; }
  .deputes-pager{ display:flex; align-items:center; gap:8px 10px; flex-wrap:wrap; margin-left:auto; font-family:'IBM Plex Mono',monospace; font-size:12px; font-weight:700; text-transform:uppercase; }
  .deputes-pager:empty{ display:none; }
  .deputes-pager .count{ color:var(--slate); }
  .deputes-pager .controls{ display:flex; gap:6px; }
  .pager-btn{ border:2px solid var(--ink); background:var(--card); padding:6px 12px; cursor:pointer; font-family:inherit; font-weight:700; font-size:12px; text-transform:uppercase; border-radius:0;  color:var(--ink);}
  .pager-btn:hover:not(:disabled){ background:var(--yellow);  color:var(--on-candy);}
  .pager-btn:disabled{ opacity:.4; cursor:default; }
  .pager-cur{ border:2px solid var(--ink); background:var(--strong); color:var(--on-strong); padding:6px 12px; }
  #deputesList{ scroll-margin-top:24px; }

  .lexique-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:14px;}
  @media(max-width:640px){ .lexique-grid{grid-template-columns:1fr;} }
  .lexique-item{padding:20px 22px; background:var(--card); border:3px solid var(--ink); box-shadow:6px 6px 0 var(--ink); margin-bottom:12px; min-width:0; color:var(--ink);}
  .lexique-grid .lexique-item{margin-bottom:0;}
  .lexique-item dt{font-family:'IBM Plex Mono',monospace; font-size:20px; font-weight:600; margin-bottom:0; line-height:1.15;}
  .lex-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:8px 12px; margin-bottom:10px; flex-wrap:wrap; min-width:0; }
  .lex-badge{ flex:none; font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:700; text-transform:uppercase; border:2px solid var(--ink); padding:2px 9px; white-space:nowrap; color:var(--on-candy); }
  .lex-cats{ display:flex; gap:8px; flex-wrap:wrap; margin:14px 0 4px; }
  .lex-chip{ font-family:'IBM Plex Mono',monospace; font-size:12px; font-weight:700; text-transform:uppercase; border:2px solid var(--ink); background:var(--card); color:var(--ink); padding:6px 12px; cursor:pointer; user-select:none; }
  .lex-chip:hover{ background:var(--amber-soft);  color:var(--on-candy);}
  .lex-chip.active{ background:var(--strong); color:var(--on-strong); }
  .lex-chip.on{ color:var(--ink); }
  .ppl-role{ font-family:'IBM Plex Mono',monospace; font-size:12px; font-weight:700; text-transform:uppercase; color:var(--slate); margin-bottom:6px; }
  .ppl-tag{ margin-top:10px; display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:10px; text-transform:uppercase; letter-spacing:.04em; color:var(--ink); background:var(--paper-2); border:2px solid var(--ink); padding:2px 9px; }
  .ppl-badge{ white-space:normal; max-width:48%; text-align:right; line-height:1.25; }
  .news-item{display:flex; gap:16px; padding:14px 0; border-bottom:1px solid var(--line);}
  .news-item:last-child{border-bottom:none;}
  .news-date{flex:none; width:90px; font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--gold); padding-top:2px;}
  .news-body p{margin:0; font-size:13.5px; line-height:1.55; color:var(--ink);}
  .calendar-box{
    background:var(--strong); color:var(--on-strong); border-radius:var(--radius);
    padding:20px 22px; margin-bottom:26px;
  }
  .calendar-box h3{font-family:'IBM Plex Mono',monospace; font-size:16px; font-weight:600; margin:0 0 10px;}
  .calendar-box p{font-size:12.5px; line-height:1.65; color:var(--on-strong-dim); margin:0 0 8px;}
  .calendar-box .status{font-family:'IBM Plex Mono',monospace; font-size:11.5px; font-weight:700; color:var(--cyan); margin-bottom:12px;}

  .promesse-card{
    background:var(--card); border:3px solid var(--line); border-radius:var(--radius);
    padding:18px 20px; margin-bottom:14px;
   color:var(--ink);}
  .promesse-grid{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:12px;}
  @media (max-width:640px){.promesse-grid{grid-template-columns:1fr;}}
  .promesse-col{background:var(--paper-2); border-radius:var(--radius); padding:14px 16px; color:var(--ink);}
  .promesse-col .tag{font-family:'IBM Plex Mono',monospace; font-size:10px; text-transform:uppercase; letter-spacing:0.03em; color:var(--gold); display:block; margin-bottom:8px;}
  .promesse-col p{font-size:13px; line-height:1.55; color:var(--ink); margin:0 0 8px;}
  .promesse-col a{font-size:11.5px; color:var(--slate); text-decoration:underline;}

  .role-card{
    background:var(--card); border:3px solid var(--line); border-radius:var(--radius);
    padding:16px 18px; margin-bottom:10px; display:flex; justify-content:space-between; gap:14px; align-items:flex-start; flex-wrap:wrap;
   color:var(--ink);}
  .role-card h3{font-family:'IBM Plex Mono',monospace; font-size:15px; font-weight:600; margin:0 0 3px;}
  .role-card .role{font-size:11.5px; color:var(--gold); font-family:'IBM Plex Mono',monospace; text-transform:uppercase; letter-spacing:0.02em; margin-bottom:6px;}
  .role-card p{font-size:12.5px; color:var(--slate); line-height:1.55; margin:0; max-width:520px;}
  .role-badge{
    font-family:'IBM Plex Mono',monospace; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:0.03em;
    background:var(--cyan); color:var(--on-candy); padding:3px 9px; border-radius:0; flex:none; border:2px solid var(--ink);
  }
  .role-group-title{font-family:'IBM Plex Mono',monospace; font-size:14px; font-weight:600; margin:24px 0 10px; color:var(--slate);}
  .petition-card{
    background:var(--card); border:3px solid var(--line); border-radius:var(--radius);
    padding:18px 20px; margin-bottom:12px;
   color:var(--ink);}
  .petition-card h3{font-family:'IBM Plex Mono',monospace; font-size:15.5px; font-weight:600; margin:0 0 8px; max-width:600px; line-height:1.4;}
  .petition-meta{display:flex; gap:18px; flex-wrap:wrap; font-size:12px; color:var(--slate); margin-bottom:12px;}
  .petition-meta b{color:var(--ink); font-family:'IBM Plex Mono',monospace;}
  .petition-progress{height:10px; background:var(--card); border:2px solid var(--ink); border-radius:0; overflow:hidden; margin-bottom:8px; color:var(--ink);}
  .petition-progress .fill{height:100%; background:var(--lime); color:var(--on-candy);}
  .petition-count{font-family:'IBM Plex Mono',monospace; font-size:12.5px; color:var(--gold); font-weight:600;}

  .role-group-title:first-child{margin-top:0;}

  .lexique-item dd{font-size:13.5px; line-height:1.6; color:var(--ink); margin:0; max-width:680px;}

  .info-box{
    border:2px solid var(--ink); border-radius:0; padding:14px 16px;
    background:var(--paper-2); font-size:12.5px; color:var(--ink); line-height:1.55; margin-top:14px;
  }
  .info-box b{color:var(--ink);}
  .account-box{
    border:3px solid var(--ink); border-radius:0; box-shadow:5px 5px 0 var(--ink); padding:18px 20px;
    background:var(--card); margin-bottom:20px;
   color:var(--ink);}
  .account-box .account-row{display:flex; gap:10px; flex-wrap:wrap; align-items:center;}
  .account-box input[type="email"], .account-box input[type="text"]{
    font-family:'IBM Plex Mono',monospace; font-size:13px; border:1px solid var(--line);
    background:var(--paper); padding:9px 12px; border-radius:var(--radius); color:var(--ink);
    flex:1 1 220px; min-width:180px;
  }
  .account-box .account-btn{
    font-family:'IBM Plex Mono',monospace; font-weight:600; font-size:12.5px;
    background:var(--strong); color:var(--on-strong); border:none; cursor:pointer;
    padding:9px 16px; border-radius:var(--radius); flex:none;
  }
  .account-box .account-btn:hover{background:var(--gold);}
  .account-box .account-btn:disabled{background:var(--slate); cursor:default; opacity:0.7;}
  .account-box .account-note{font-size:12px; color:var(--slate); margin-top:8px;}
  .account-box .account-email{font-weight:600; color:var(--ink);}

  .issue-form{display:flex; gap:10px; margin-bottom:20px; flex-wrap:wrap;}
  .issue-form input{flex:1; min-width:220px;}
  .issue-form button{
    font-family:'IBM Plex Mono',monospace; font-weight:600; font-size:13px;
    background:var(--strong); color:var(--on-strong); border:none; border-radius:var(--radius);
    padding:10px 18px; cursor:pointer;
  }
  .issue-card{background:var(--card); border:3px solid var(--line); border-radius:var(--radius); padding:16px 18px; margin-bottom:10px; display:flex; gap:16px; align-items:flex-start; color:var(--ink);}
  .vote-btn{
    flex:none; display:flex; flex-direction:column; align-items:center; gap:2px;
    background:var(--paper-2); border:1px solid var(--line); border-radius:var(--radius);
    padding:9px 15px; cursor:pointer; font-family:'IBM Plex Mono',monospace; user-select:none;
   color:var(--ink);}
  .vote-btn.voted{background:var(--strong); color:var(--on-strong); border-color:var(--ink);}
  .vote-btn .count{font-size:17px; font-weight:600; line-height:1;}
  .vote-btn .label{font-size:9px; text-transform:uppercase; opacity:0.7; margin-top:3px;}
  .issue-body h3{font-family:'IBM Plex Mono',monospace; font-size:15px; font-weight:600; margin:2px 0 4px;}
  .issue-body .meta{font-size:11.5px; color:var(--slate);}

  .chamber-toggle{ display:flex; gap:8px; margin:16px 0 12px; flex-wrap:wrap; }
  .chamber-btn{ font-family:'IBM Plex Mono',monospace; font-size:12.5px; padding:7px 15px; border:1px solid var(--line); border-radius:999px; background:var(--card); color:var(--slate); cursor:pointer; transition:background .15s, color .15s; }
  .chamber-btn:hover{ border-color:var(--gold); color:var(--gold); }
  .chamber-btn.on{ background:var(--strong); color:var(--on-strong); border-color:var(--strong); }
  .vote-list-panel{ background:var(--card); border:3px solid var(--line); border-radius:var(--radius); padding:2px 16px;  color:var(--ink);}
  .vote-row{ padding:11px 2px; border-top:1px solid var(--line); }
  .vote-row:first-child{ border-top:none; }
  .vote-row-head{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
  .vote-row-line{ font-size:13px; }
  .vote-row-date{ font-family:'IBM Plex Mono',monospace; color:var(--slate); }
  .vote-row-toggle{ margin-left:auto; white-space:nowrap; }
  .vote-row-who{ font-size:11px; color:var(--slate); opacity:.7; }
  .vote-row-sub{ font-size:12px; color:var(--slate); margin-top:3px; }
  .vote-row-sub a{ color:var(--gold); }
  .challenge-band{ background:var(--yellow); border:none; border-bottom:5px solid var(--ink); box-shadow:none; padding:24px var(--gutter) 28px; margin:0 calc(-1 * var(--gutter)) 0;  color:var(--on-candy);}
  .cb-head{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:6px; flex-wrap:wrap; }
  .challenge-band h2{ background:none !important; border:none !important; box-shadow:none !important; padding:0 !important; font-size:26px !important; }
  .cb-cta{ border:3px solid var(--ink); background:var(--strong); color:var(--yellow); padding:9px 16px; font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:12.5px; text-transform:uppercase; cursor:pointer; box-shadow:4px 4px 0 var(--ink); transition:transform .08s, box-shadow .08s; text-decoration:none; display:inline-block; line-height:normal; letter-spacing:normal; text-align:center; }
  .cb-cta:hover{ background:var(--pink); color:var(--on-candy); transform:translate(2px,2px); box-shadow:2px 2px 0 var(--ink); }
  .cb-sub{ font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:0.04em; margin-bottom:0; }
  .cb-subrow{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; }
  .cb-more{ flex:none; width:36px; height:36px; border:3px solid var(--ink); background:var(--strong); color:var(--yellow); font-family:'Archivo Black',sans-serif; font-size:20px; line-height:1; cursor:pointer; box-shadow:3px 3px 0 var(--ink); }
  .cb-more:hover{ background:var(--pink); color:var(--on-candy); transform:translate(2px,2px); box-shadow:1px 1px 0 var(--ink); }
  @keyframes challengeSwap{ 0%{opacity:1; transform:translateX(0);} 42%{opacity:0; transform:translateX(-18px);} 58%{opacity:0; transform:translateX(18px);} 100%{opacity:1; transform:translateX(0);} }
  .challenge-swapping{ animation:challengeSwap .44s cubic-bezier(.4,0,.2,1); }
  .challenge-viewport{ overflow:hidden; }
  .challenge-track{ display:flex; gap:16px; will-change:transform; }
  .challenge-track .challenge-card{ flex:0 0 calc((100% - 32px)/3); }
  /* ---- Aperçu : grille 3 colonnes (comme le proto) ---- */
  .apercu-3col{ display:grid; grid-template-columns:300px 1fr 280px; margin:0 calc(-1 * var(--gutter)) 28px; }
  .a3-left{ border-right:3px solid var(--ink); padding:22px; display:flex; flex-direction:column; gap:14px; }
  .a3-left .news-item, .a3-right .news-item{ flex-direction:column; gap:3px; padding:11px 0; }
  .a3-left .news-date, .a3-right .news-date{ width:auto; padding-top:0; }
  .a3-left .news-body p, .a3-right .news-body p{ font-size:12.5px; line-height:1.5; }
  .a3-main{ border-right:3px solid var(--ink); padding:22px 24px; min-width:0; }
  .a3-right{ padding:22px 20px; background:var(--card); display:flex; flex-direction:column; gap:14px;  color:var(--ink);}
  @media (max-width:900px){ .apercu-3col{ grid-template-columns:1fr; } .a3-left, .a3-main{ border-right:none; border-bottom:3px solid var(--ink); } }
  .a3-hero{ font-family:'Archivo Black',sans-serif !important; font-size:28px; line-height:1.05; text-transform:uppercase; margin:0; }
  .a3-hero .hlp{ background:var(--pink); padding:0 4px;  color:var(--on-candy);}
  .a3-tagline{ margin:0; font-size:13px; line-height:1.55; color:var(--ink); }
  .a3-stats{ border:3px solid var(--ink); background:var(--card); padding:14px 16px; box-shadow:5px 5px 0 var(--cyan);  color:var(--ink);}
  .a3-stats-h{ font-size:11px; font-weight:700; text-transform:uppercase; margin-bottom:8px; }
  .a3-stat{ display:flex; justify-content:space-between; align-items:center; font-size:13px; border-bottom:1px solid var(--ink); padding:6px 4px; cursor:pointer; text-decoration:none; color:var(--ink); }
  .a3-stat:last-child{ border-bottom:none; }
  .a3-stat:hover{ background:var(--amber-soft);  color:var(--on-candy);}
  .a3-stat strong{ font-family:'IBM Plex Mono',monospace; }
  .a3-explore{ display:block; text-align:center; background:var(--strong); color:var(--on-strong); padding:12px; font-weight:700; font-size:13px; text-transform:uppercase; cursor:pointer; text-decoration:none; border:3px solid var(--ink); }
  .a3-explore:hover{ background:var(--lime); color:var(--on-candy); }
  .a3-main-head{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:14px; }
  .a3-main-head h2{ font-family:'Archivo Black',sans-serif !important; font-size:20px; text-transform:uppercase; margin:0; background:none !important; border:none !important; box-shadow:none !important; padding:0 !important; }
  .a3-seeall{ font-size:11px; text-transform:uppercase; color:var(--slate); font-weight:700; cursor:pointer; text-decoration:none; white-space:nowrap; }
  .a3-seeall:hover{ color:var(--ink); }
  .a3-tiles{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:16px; }
  @media (max-width:560px){ .a3-tiles{ grid-template-columns:1fr; } }
  .a3-tile{ border:3px solid var(--ink); background:var(--card); padding:14px 16px; display:block; cursor:pointer; text-decoration:none; box-shadow:4px 4px 0 var(--ink);  color:var(--ink);}
  .a3-tile:hover{ background:var(--amber-soft); transform:translate(2px,2px); box-shadow:2px 2px 0 var(--ink);  color:var(--on-candy);}
  .a3-tile-tag{ color:var(--on-candy); font-size:11px; font-weight:700; text-transform:uppercase; border:2px solid var(--ink); display:inline-block; padding:2px 8px; margin-bottom:8px; }
  .a3-tile p{ margin:0; font-size:13px; line-height:1.5; font-weight:600; color:var(--ink); }
  .a3-hiw-h{ font-family:'Archivo Black',sans-serif !important; font-size:18px; text-transform:uppercase; border-bottom:3px solid var(--ink); padding-bottom:8px; margin:0 0 12px; }
  .a3-steps{ display:flex; flex-direction:column; gap:10px; }
  .a3-step{ border:2px solid var(--ink); padding:10px 12px; background:var(--paper);  color:var(--ink);}
  .a3-step-n{ font-size:12px; font-weight:700; border:2px solid var(--ink); display:inline-block; padding:0 7px; margin-bottom:6px; font-family:'IBM Plex Mono',monospace; }
  .a3-step p{ margin:0; font-size:12.5px; font-weight:600; line-height:1.45; color:var(--ink); }
  /* Aperçu : lignes compactes de projets de loi (déplient le détail au clic) */
  .ab-row{ border:3px solid var(--ink); background:var(--card); margin-bottom:10px; box-shadow:4px 4px 0 var(--ink);  color:var(--ink);}
  .ab-row:last-child{ margin-bottom:0; }
  .ab-head{ display:flex; align-items:center; gap:10px; padding:11px 14px; cursor:pointer; }
  .ab-head:hover{ background:var(--amber-soft);  color:var(--on-candy);}
  .ab-num{ flex:none; font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:13px; background:var(--cyan); border:2px solid var(--ink); padding:1px 7px; white-space:nowrap;  color:var(--on-candy);}
  .ab-title{ flex:1; min-width:0; font-family:'Archivo',system-ui,sans-serif; font-size:15px; font-weight:500; line-height:1.4; }
  .ab-caret{ flex:none; font-size:11px; transition:transform .15s; }
  .ab-row.open .ab-caret{ transform:rotate(180deg); }
  .ab-detail{ display:none; }
  .ab-row.open .ab-detail{ display:block; padding:12px 14px 14px; border-top:2px solid var(--ink); }
  .ab-detail .bill{ border:none !important; box-shadow:none !important; padding:0 !important; margin:0 !important; cursor:default; background:transparent !important; }
  .ab-detail .bill:hover{ transform:none !important; box-shadow:none !important; }
  .ab-detail .bill > .head{ display:none !important; }
  /* Sur mobile, le titre était écrasé entre les badges : il passe seul sur la
     première ligne, et numéro / parti / statut se regroupent en dessous. */
  @media (max-width:640px){
    .ab-head{ flex-wrap:wrap; row-gap:9px; align-items:center; }
    .ab-head .ab-title{ order:1; flex:1 1 100%; min-width:0; font-size:15.5px; }
    .ab-head .ab-num{ order:2; }
    .ab-head .depute-party{ order:3; }
    .ab-head .status-pill{ order:4; }
    /* Sans ordre explicite le compteur de lobbying restait seul au-dessus du
       titre : sa place est sur la ligne des pastilles, avec le reste. */
    .ab-head .ab-lob{ order:5; }
    .ab-head .ab-omni{ order:4; }
    .ab-head .ab-caret{ order:6; margin-left:auto; }
  }
  @media (max-width:900px){ .challenge-track .challenge-card{ flex:0 0 calc((100% - 16px)/2); } }
  @media (max-width:640px){ .challenge-track .challenge-card{ flex:0 0 100%; } }
  .challenge-card{ background:var(--card); border:3px solid var(--ink); padding:16px 18px; box-shadow:5px 5px 0 var(--ink); display:flex; flex-direction:column; cursor:pointer; transition:transform .08s, box-shadow .08s; border-radius:0;  color:var(--ink);}
  .challenge-card:hover{ transform:translate(2px,2px); box-shadow:3px 3px 0 var(--ink); }
  .cc-top{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:10px; }
  .cc-num{ color:var(--on-candy); font-weight:700; font-size:14px; border:2px solid var(--ink); padding:2px 8px; white-space:nowrap; }
  .cc-count{ background:var(--strong); color:var(--pink); font-size:11.5px; font-weight:700; padding:3px 9px; white-space:nowrap; }
  .cc-title{ font-size:14px; font-weight:700; line-height:1.4; margin-bottom:10px; }
  .cc-share{ display:flex; gap:6px; align-items:center; margin-bottom:8px; }
  .cc-share button{ border:2px solid var(--ink); background:var(--card); font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:11px; padding:3px 8px; cursor:pointer;  color:var(--ink);}
  .cc-share button:hover{ background:var(--yellow);  color:var(--on-candy);}
  .cc-foot{ font-size:11px; font-weight:600; text-transform:uppercase; color:var(--slate); margin-top:auto; padding-top:8px; border-top:2px solid var(--ink); }
  .challenge-panel{ background:var(--card); border:3px solid var(--line); border-radius:var(--radius); padding:2px 14px;  color:var(--ink);}
  .challenge-row{ display:flex; align-items:baseline; gap:11px; padding:11px 3px; border-top:1px solid var(--line); cursor:pointer; }
  .challenge-row:first-child{ border-top:none; }
  .challenge-row:hover{ background:var(--paper-2);  color:var(--ink);}
  .ch-rank{ font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--slate); min-width:16px; text-align:right; }
  .ch-num{ font-weight:700; white-space:nowrap; }
  .ch-title{ flex:1; color:var(--slate); font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .ch-count{ white-space:nowrap; font-size:12.5px; }
  @keyframes jumpFlash { 0%, 60% { background:#175CD318; box-shadow:0 0 0 3px #175CD355; } 100% { background:transparent; box-shadow:none; } }
  .jump-highlight{ animation: jumpFlash 1.8s ease-out; border-radius:6px; }
  .compare-table-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch; margin-top:14px;}
  .compare-table{border-collapse:collapse; width:100%; min-width:560px; font-size:13px; background:var(--card); border:3px solid var(--line); border-radius:var(--radius); overflow:hidden; color:var(--ink);}
  .compare-table th, .compare-table td{text-align:left; padding:10px 14px; border-bottom:1px solid var(--line); vertical-align:top;}
  .compare-table th{font-family:'IBM Plex Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:0.03em; color:var(--slate); background:var(--paper-2);}
  .compare-table td:first-child{font-weight:600; color:var(--slate); white-space:nowrap;}

  footer{
    max-width:1280px;margin:0 auto; padding:18px 28px 32px; border-top:3px solid var(--ink);
    font-size:11px; color:var(--slate); text-transform:uppercase; letter-spacing:0.02em; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
  }
  .footer-right-group{display:flex; align-items:center; gap:16px; flex-wrap:wrap;}
  .footer-gh{display:inline-flex; align-items:center; gap:5px; color:var(--slate); text-decoration:none;}
  .footer-gh:hover{color:var(--ink);}
  .footer-coffee{cursor:pointer;}
  /* Retirer son accord aux témoins : même poids visuel que les autres liens du pied. */
  .footer-temoins{
    background:none; border:0; padding:0; cursor:pointer;
    font-family:'IBM Plex Mono',monospace; font-size:inherit; color:var(--slate);
    text-decoration:underline; text-underline-offset:3px;
  }
  .footer-temoins:hover{ color:var(--ink); }

  /* ---------- DEMANDE DE CONSENTEMENT AUX TÉMOINS ----------
     En bas de page, pas au centre : la question se pose sans bloquer la lecture.
     Même forme que sur DossierQuébec. Les deux boutons ont la même taille —
     refuser doit être aussi facile qu'accepter. */
  .temoins{
    position:fixed; left:16px; right:16px; bottom:16px; z-index:60;
    display:flex; justify-content:center; pointer-events:none;
  }
  .temoins[hidden]{ display:none; }
  .temoins-carte{
    pointer-events:auto; width:100%; max-width:640px;
    background:var(--paper); border:3px solid var(--ink); box-shadow:5px 5px 0 var(--ink);
    padding:16px 18px 15px;
  }
  .temoins-titre{
    font-family:'Archivo Black',sans-serif; font-weight:400; text-transform:uppercase;
    font-size:15px; line-height:1.2; color:var(--ink); margin:0 0 9px;
  }
  .temoins-texte{
    margin:0 0 14px; font-family:'Archivo',system-ui,sans-serif;
    font-size:14px; line-height:1.55; color:var(--ink); max-width:66ch;
  }
  .temoins-boutons{ display:flex; gap:10px; }
  .temoins-boutons button{
    font-family:'IBM Plex Mono',monospace; font-size:12px; font-weight:700;
    text-transform:uppercase; letter-spacing:0.04em;
    padding:9px 18px; border:2px solid var(--ink); cursor:pointer;
    box-shadow:3px 3px 0 var(--ink);
  }
  .temoins-oui{ background:var(--lime); color:var(--on-candy); }
  .temoins-non{ background:var(--paper-2); color:var(--ink); }
  .temoins-boutons button:hover{ background:var(--yellow); color:var(--on-candy); }
  .temoins-boutons button:active{ transform:translate(2px,2px); box-shadow:1px 1px 0 var(--ink); }
  @media (max-width:560px){
    .temoins{ left:10px; right:10px; bottom:10px; }
    .temoins-carte{ padding:13px 14px 12px; }
    .temoins-texte{ font-size:13.5px; }
    .temoins-boutons button{ flex:1; padding:9px 10px; }
  }

  .back-to-top{
    position:fixed; right:24px; bottom:24px; z-index:50;
    width:46px; height:46px; border-radius:0; border:2px solid var(--ink);
    background:var(--yellow); color:var(--on-candy); cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    box-shadow:3px 3px 0 var(--ink);
    opacity:0; visibility:hidden; transform:translateY(8px);
    transition:opacity 0.25s ease, transform 0.25s ease, visibility 0.25s, background 0.2s ease;
  }
  .back-to-top.visible{opacity:1; visibility:visible; transform:translateY(0);}
  .back-to-top:hover{background:var(--pink); color:var(--on-candy);}
  @media (max-width:640px){
    .back-to-top{right:16px; bottom:16px; width:42px; height:42px;}
  }
  a{color:inherit;}

  @media (max-width:640px){
    header.top{padding:24px 18px 18px;}
    .app{--gutter:18px; padding:0 var(--gutter) 24px;}
    nav.tabs{padding:0 18px;}
    .hemicycle-wrap{flex-direction:column; align-items:flex-start;}

    .filter-hamburger{
      display:flex; align-items:center; gap:6px;
      font-family:'IBM Plex Mono',monospace; font-weight:600; font-size:11.5px;
      padding:8px 14px; border-radius:20px; cursor:pointer;
      border:1.5px solid var(--line); background:var(--card); color:var(--ink);
      margin-top:10px; width:100%; justify-content:space-between;
    }
    .filter-hamburger[aria-expanded="true"]{border-color:var(--ink);}
    .status-filters, .step-filters{
      display:none; margin-top:8px; padding:10px; background:var(--paper-2);
      border-radius:var(--radius); border:1px solid var(--line);
     color:var(--ink);}
    .step-filters{margin-top:8px;}
    .status-filters.open, .step-filters.open{display:flex;}
  }

  .font-size-ctrl{
    display:flex; align-items:center; gap:2px; flex:none;
    background:var(--card); border:2px solid var(--ink); border-radius:0; padding:3px;
   color:var(--ink);}
  .font-size-ctrl button{
    font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:12px; color:var(--ink);
    background:none; border:none; cursor:pointer; padding:6px 10px; border-radius:0; line-height:1;
  }
  .font-size-ctrl button:hover{background:var(--yellow); color:var(--on-candy);}
  /* Largeur fixe et chiffres tabulaires : sans ça, passer de 100 % à 90 % fait
     glisser les boutons A− / A+ sous le curseur. */
  .font-size-ctrl #fontPct{
    font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:700;
    color:var(--slate); min-width:4.2ch; text-align:center;
    font-variant-numeric:tabular-nums; letter-spacing:-0.02em;
  }
  /* Sur mobile l'entête est disputé : les 34 px du pourcentage poussaient la
     marque sur trois lignes, coupée en plein mot (« DOSSIE / R CAN / ADA »).
     On récupère la place sur les boutons, pas sur le nom du site. « DossierCanada »
     est UN seul mot dans le balisage : sans point de coupure il déborderait, d'où
     le <wbr> ajouté entre les deux moitiés — il ne casse plus qu'entre
     « Dossier » et « Canada », jamais en plein milieu. */
  @media (max-width: 640px){
    .font-size-ctrl{ gap:0; padding:2px; }
    .font-size-ctrl button{ padding:6px 6px; }
    .font-size-ctrl #fontPct{ font-size:10px; min-width:3.6ch; }
    header.top .brand{ overflow-wrap:normal; }
  }

  .lang-toggle{
    font-family:'IBM Plex Mono',monospace; font-weight:600; font-size:12px;
    background:var(--card); color:var(--ink); border:1px solid var(--line); border-radius:20px;
    padding:8px 14px; cursor:pointer; flex:none;
    text-decoration:none; display:inline-flex; align-items:center; justify-content:center;
  }
  .lang-toggle:hover{background:var(--paper-2); color:var(--ink);}

  /* ---------- HAMBURGER (mobile) ---------- */
  .hamburger{
    display:none; flex:none; width:36px; height:36px;
    border:2px solid var(--ink); border-radius:0; background:var(--card);
    align-items:center; justify-content:center; gap:4px; flex-direction:column; cursor:pointer;
   color:var(--ink);}
  .hamburger span{display:block; width:18px; height:1.5px; background:var(--strong); transition:transform 0.2s, opacity 0.2s;}
  .hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(5.5px) rotate(45deg);}
  .hamburger[aria-expanded="true"] span:nth-child(2){opacity:0;}
  .hamburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg);}

  @media (max-width:640px){
    .top-meta{display:none;}
    .hamburger{display:flex; margin-left:auto;}
    nav.tabs{
      display:none; position:fixed; inset:0; z-index:100;
      flex-direction:column; overflow-y:auto; background:var(--paper);
      padding:20px 0 40px; border-bottom:none;
     color:var(--ink);}
    nav.tabs.open{display:flex;}
    nav.tabs a{
      padding:16px 24px; border-bottom:1px solid var(--line); border-left:3px solid transparent;
      text-align:left; font-size:15px;
    }
    nav.tabs a.active{border-left-color:var(--gold); border-bottom-color:var(--line); background:var(--card); color:var(--ink);}
    nav.tabs .close-menu{
      display:flex; justify-content:flex-end; padding:0 18px 12px;
      font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--slate); cursor:pointer;
    }
  }

  /* ---------- BLOC COLLANT LOGO + MENU ---------- */
  /* L'en-tête (logo + stats) et les onglets forment un seul bloc sticky. Après
     ~80px de scroll (JS, hystérésis 80/20), la rangée logo/stats se replie et il
     ne reste qu'une barre mince sur fond blanc avec le mini-logo + les onglets. */
  #dq-topbar{
    position:sticky; top:0; z-index:90;
    background:var(--paper);
    border-bottom:1px solid var(--line);
    transition:background-color 0.22s ease, box-shadow 0.22s ease;
   color:var(--ink);}
  #dq-topbar.compact{
    background:var(--card);
    box-shadow:0 6px 16px rgb(16 24 40 / 8%);
   color:var(--ink);}
  #dq-topbar header.top{
    border-bottom:none;
    padding-top:20px; padding-bottom:12px;
    overflow:hidden; max-height:180px;
    transition:max-height 0.22s ease, opacity 0.18s ease, padding 0.22s ease;
  }
  #dq-topbar nav.tabs{border-bottom:5px solid var(--ink);}
  #dq-topbar.compact header.top{
    max-height:0; opacity:0; padding-top:0; padding-bottom:0; pointer-events:none;
  }
  /* La barre collante couvre le haut des cibles de saut (Aller à…) */
  .view, [id^="sec-"]{scroll-margin-top:64px;}
  @media (max-width:640px){
    /* Les sélecteurs avec .compact sont répétés exprès : sans eux, la règle
       desktop « #dq-topbar.compact header.top » gagnerait en spécificité et
       replierait l'en-tête sur mobile aussi. */
    /* Collant sur mobile aussi. Fond opaque obligatoire : en sticky, le contenu
       défile DERRIÈRE la barre. */
    #dq-topbar, #dq-topbar.compact{position:sticky; top:0; z-index:90; border-bottom:none; background:var(--paper); color:var(--ink);}
    #dq-topbar.compact{box-shadow:0 4px 12px rgb(0 0 0 / 12%);}
    /* Une fois défilé, la rangée des provinces se replie pour garder une barre fine */
    #dq-topbar.compact .header-left{display:none;}
    #dq-topbar.compact .dq-ticker{display:none;}
    #dq-topbar header.top, #dq-topbar.compact header.top{
      max-height:none; overflow:visible; opacity:1;
      border-bottom:1px solid var(--line);
      padding:24px 18px 18px; pointer-events:auto;
    }
  }