
  .vote-card { padding: var(--s5); margin-bottom: var(--s4); }
  .vote-head { display: flex; align-items: baseline; gap: var(--s3); flex-wrap: wrap; margin-bottom: var(--s2); }
  .vote-title { font-family: var(--font-head); font-size: 19px; font-weight: 700; color: var(--ink); }
  .vote-date { font-family: var(--font-mono); font-size: 11px; color: var(--muted); }
  .vote-type {
    font-family: var(--font-mono); font-size: 10px; text-transform: uppercase; letter-spacing: .06em;
    padding: 1px var(--s2); border: 1px solid var(--border-strong); border-radius: 2px; color: var(--muted);
  }
  .vote-summary { font-size: 14px; color: var(--text); margin-bottom: var(--s4); }

  .cap { font-family: var(--font-mono); font-size: 10px; font-weight: 600; text-transform: uppercase;
    letter-spacing: .08em; color: var(--muted); margin-bottom: var(--s2); }

  /* Badge de provenance */
  .badge { font-family: var(--font-mono); font-size: 9px; font-weight: 600; text-transform: uppercase;
    letter-spacing: .06em; padding: 2px var(--s2); border-radius: 2px; }
  .badge.official { background: #eef7f0; color: #226b3a; border: 1px solid #bfe2c9; }
  .badge.demo { background: var(--center-bg); color: var(--muted); border: 1px solid var(--border-strong); }

  /* Resultat national officiel */
  .result { display: flex; align-items: center; gap: var(--s4); flex-wrap: wrap; margin-bottom: var(--s4);
    padding: var(--s3) var(--s4); background: var(--paper); border: 1px solid var(--border); border-radius: var(--radius-sm); }
  .result .outcome { font-family: var(--font-mono); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
  .result .outcome.yes { color: var(--rel-high); }
  .result .outcome.no { color: var(--accent); }
  .result .metric { font-family: var(--font-mono); font-size: 12px; color: var(--muted); }
  .result .metric strong { color: var(--ink); }

  .recos { display: flex; flex-wrap: wrap; gap: var(--s2); margin-bottom: var(--s4); }
  .reco { display: inline-flex; align-items: center; gap: var(--s2); padding: 3px var(--s2);
    border-radius: 3px; font-size: 12px; border: 1px solid var(--border); }
  .reco .dot { width: 8px; height: 8px; border-radius: 50%; }
  .reco .verdict { font-family: var(--font-mono); font-size: 10px; font-weight: 600; text-transform: uppercase; }
  .v-oui { color: var(--rel-high); } .v-non { color: var(--accent); } .v-liberte { color: var(--muted); }

  .roesti { display: grid; grid-template-columns: 90px 1fr 48px; gap: var(--s2); align-items: center; }
  .roesti-row { display: contents; }
  .roesti-label { font-family: var(--font-mono); font-size: 11px; color: var(--muted); text-align: right; }
  .roesti-track { height: 10px; border-radius: 3px; background: var(--border); overflow: hidden; }
  /* display:block indispensable : un <span> inline ignore width/height -> la barre ne se remplit pas. */
  .roesti-fill { display: block; height: 100%; background: var(--ink); border-radius: 3px; }
  .roesti-val { font-family: var(--font-mono); font-size: 11px; color: var(--ink); }
  .roesti-gap { font-size: 12px; color: var(--muted); margin-top: var(--s2); }

  .vote-actions { display: flex; align-items: center; gap: var(--s4); flex-wrap: wrap; margin: var(--s5) 0; }

.vote-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s4); margin:var(--s5) 0; }
.vote-grid > * { min-width:0; }
.vote-grid h2 { font-family:var(--font-head); font-size:21px; }
.vote-grid li { margin:var(--s3) 0; }
.vote-links { display:flex; flex-wrap:wrap; gap:var(--s3); margin:var(--s4) 0; }
.vote-authorities { padding:0; list-style:none; }
.vote-authorities li { padding:var(--s2) 0; }
.vote-section { margin:var(--s6) 0; }
.vote-note { color:var(--muted); font-size:13px; line-height:1.6; }
.vote-card a { overflow-wrap:anywhere; }
@media(max-width:700px) { .vote-grid { grid-template-columns:1fr; } .vote-card { padding:var(--s4); } }
