/* presidentielle-2027: editorial data-journalism. Monochrome chrome; the party colours are the only saturated colour on the page. */
@font-face{font-family:"Literata";src:url("fonts/literata-latin-wght-normal.woff2") format("woff2");font-weight:200 900;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Literata";src:url("fonts/literata-cyrillic-wght-normal.woff2") format("woff2");font-weight:200 900;font-style:normal;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Literata";src:url("fonts/literata-latin-wght-italic.woff2") format("woff2");font-weight:200 900;font-style:italic;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Literata";src:url("fonts/literata-cyrillic-wght-italic.woff2") format("woff2");font-weight:200 900;font-style:italic;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Fira Sans Condensed";src:url("fonts/fira-sans-condensed-latin-400-normal.woff2") format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Fira Sans Condensed";src:url("fonts/fira-sans-condensed-latin-500-normal.woff2") format("woff2");font-weight:500;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Fira Sans Condensed";src:url("fonts/fira-sans-condensed-latin-600-normal.woff2") format("woff2");font-weight:600;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Fira Sans Condensed";src:url("fonts/fira-sans-condensed-cyrillic-400-normal.woff2") format("woff2");font-weight:400;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Fira Sans Condensed";src:url("fonts/fira-sans-condensed-cyrillic-500-normal.woff2") format("woff2");font-weight:500;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Fira Sans Condensed";src:url("fonts/fira-sans-condensed-cyrillic-600-normal.woff2") format("woff2");font-weight:600;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}

:root{
  --paper:#F4F5F3; --ink:#171A1D; --muted:#5B6168; --rule:#C9CCC8; --rule-soft:#DEE0DC; --field:#EBEDEA; --warn:#8A4B00; --focus:#2B5DAF;
  --serif:"Literata",Georgia,"Times New Roman",serif; --sans:"Fira Sans Condensed","Arial Narrow",system-ui,sans-serif;
  --measure:1180px; --gut:clamp(16px,4vw,40px);
}
:root[data-theme=dark]{--paper:#14181C;--ink:#E6E8E5;--muted:#9AA1A8;--rule:#394047;--rule-soft:#2A3036;--field:#1B2025;--warn:#E0A15A;--focus:#7FA3E6}
@media (prefers-color-scheme: dark){:root[data-theme=auto]{--paper:#14181C;--ink:#E6E8E5;--muted:#9AA1A8;--rule:#394047;--rule-soft:#2A3036;--field:#1B2025;--warn:#E0A15A;--focus:#7FA3E6}}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;color-scheme:light dark}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.55 var(--serif);font-optical-sizing:auto;text-rendering:optimizeLegibility;min-height:100vh;display:flex;flex-direction:column}
main{flex:1}
.wrap{max-width:var(--measure);margin:0 auto;padding:0 var(--gut);width:100%}
a{color:inherit;text-decoration-color:var(--rule);text-underline-offset:.18em;text-decoration-thickness:1px}
a:hover{text-decoration-color:currentColor}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:2px}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--paper);padding:6px 10px;font:500 14px var(--sans);z-index:10}
.skip:focus{left:8px}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.12;margin:0;letter-spacing:-.012em}
.fine,.rng,.byline,.tick,.annot{font-family:var(--sans)}
.fine{font-size:14px;color:var(--muted);line-height:1.4}
.rng{color:var(--muted);font-size:.84em;font-weight:400}
.lede{font-size:clamp(17px,2.2vw,20px);color:var(--muted);max-width:60ch;margin:.6em 0 0}

/* masthead: a rule above and below, name set small and left, like a section head */
.masthead{border-top:3px solid var(--ink);border-bottom:1px solid var(--rule)}
.masthead-row{display:flex;align-items:baseline;gap:8px 28px;flex-wrap:wrap;padding-top:12px;padding-bottom:10px}
.brand{text-decoration:none;display:flex;flex-direction:column;line-height:1.1}
.brand-name{font:600 22px/1 var(--serif);letter-spacing:-.02em}
.brand-tag{font:400 13px var(--sans);color:var(--muted);margin-top:4px}
.nav{display:flex;gap:2px 20px;flex-wrap:wrap;font:500 15px var(--sans);flex:1}
.nav a{text-decoration:none;padding:4px 0;border-bottom:2px solid transparent;color:var(--muted)}
.nav a:hover{color:var(--ink)}
.nav a[aria-current=page]{color:var(--ink);border-bottom-color:var(--ink)}
.tools{display:flex;align-items:center;gap:14px;font:500 14px var(--sans)}
.tools .lang{text-decoration:none;color:var(--muted)}
.tools .langs{display:inline-flex;gap:.45em}
.tools .lang.current{color:var(--text,inherit);font-weight:600}
.theme{background:none;border:1px solid var(--rule);width:30px;height:30px;border-radius:2px;color:var(--ink);cursor:pointer;display:grid;place-items:center;padding:0}
.theme:hover{border-color:var(--ink)}
.linkish{background:none;border:0;padding:0;font:inherit;color:var(--muted);text-decoration:underline;text-decoration-color:var(--rule);cursor:pointer;text-underline-offset:.18em}
.linkish:hover{color:var(--ink)}
.logout{margin:0}

/* hero: the headline is a sentence generated from the data, left-aligned, big serif, no decoration */
.hero{padding:clamp(28px,6vw,64px) 0 clamp(20px,3vw,32px);border-bottom:1px solid var(--rule)}
.hero h1{font-size:clamp(30px,5.4vw,58px);max-width:20ch;font-weight:560;letter-spacing:-.025em;line-height:1.04}
.hero.compact{padding:clamp(20px,3.5vw,36px) 0 clamp(14px,2vw,22px)}
.hero.compact h1{font-size:clamp(26px,4vw,40px);max-width:none;display:flex;align-items:center;gap:.4em;flex-wrap:wrap}
.byline{font-size:15px;color:var(--muted);margin:18px 0 0;max-width:72ch;line-height:1.45}
.byline em{color:var(--ink);font-style:normal;font-weight:600}
.crumb{font:500 14px var(--sans);margin:0 0 10px}.crumb a{color:var(--muted);text-decoration:none}.crumb a:hover{color:var(--ink)}
.warn{font:500 14px var(--sans);color:var(--warn);border-left:3px solid var(--warn);padding:2px 0 2px 10px;margin:14px 0 0}

/* the grid: a narrow margin-note column on the left, the figure on the right */
.fig{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:0 clamp(20px,4vw,48px);padding:clamp(24px,4vw,40px) 0;border-bottom:1px solid var(--rule-soft)}
.fig:last-of-type{border-bottom:0}
.note h2{font-size:21px;line-height:1.2;margin-bottom:.5em}
.note p{margin:.4em 0;font-size:15px;color:var(--muted);line-height:1.5}
.note p.fine{font-size:13.5px}
.figure{min-width:0}
.prose p{max-width:62ch;margin:0 0 1em}
.prose p:last-child{margin-bottom:0}
@media (max-width:820px){.fig{grid-template-columns:minmax(0,1fr)}.note{margin-bottom:14px}}

/* key figures on a candidate page: a ruled row, not cards */
.keys{padding:22px 0;border-bottom:1px solid var(--rule)}
.keys dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0}
.keys dl>div{padding:0 18px 0 0;border-right:1px solid var(--rule-soft);margin-right:18px}
.keys dl>div:last-child{border-right:0}
.keys dt{font:500 13px var(--sans);color:var(--muted)}
.keys dd{margin:2px 0 0;font:400 15px var(--sans);color:var(--muted)}
.keys dd b{font:560 clamp(28px,4vw,40px)/1.1 var(--serif);color:var(--ink);letter-spacing:-.02em;font-variant-numeric:lining-nums tabular-nums}
.keys .fine{margin:12px 0 0}
@media (max-width:640px){.keys dl{grid-template-columns:1fr 1fr;row-gap:16px}.keys dl>div:nth-child(2){border-right:0;margin-right:0}}

/* tables: tabular figures, hairlines, square */
table{border-collapse:collapse;width:100%;font:400 15px/1.35 var(--sans)}
table.num{font-variant-numeric:tabular-nums lining-nums}
th,td{padding:7px 12px 7px 0;text-align:left;vertical-align:baseline;border-bottom:1px solid var(--rule-soft)}
thead th{font:500 13px var(--sans);color:var(--muted);border-bottom:1px solid var(--ink);padding-bottom:6px;vertical-align:bottom}
tbody th{font-weight:500}
td.v,th.v{text-align:right;white-space:nowrap}
thead th.cc{text-align:right;white-space:nowrap}
thead th.cc span{display:inline-block;margin-left:3px}
td.viz{width:1%;white-space:nowrap}
.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
table.ladder td.v b{font:600 17px var(--sans)}
table.ladder td.d7{color:var(--muted)}
.polls th[scope=row] .rd{display:block;font-weight:400}
.polls td a{margin-right:8px}
.strong{font-weight:600}
.pager{display:flex;justify-content:space-between;font:500 14px var(--sans);margin-top:14px;color:var(--muted)}
.pager a{color:var(--ink)}

/* marks + range bars + dumbbells: colour comes from --c, shape from the mark so colour is never the only code */
.mk{vertical-align:-1px;flex:none}.mk *{fill:var(--c)}
.cname{display:inline-flex;align-items:center;gap:7px}
.cname a{text-decoration:none}.cname a:hover{text-decoration:underline}
.rbar .axis,.dumbbell .axis{stroke:var(--rule);stroke-width:1}
.rbar .span{stroke:var(--c);stroke-width:2;opacity:.5}
.rbar circle{fill:var(--c);stroke:var(--paper);stroke-width:2}
.dumbbell .gap{stroke:var(--c);stroke-width:2;opacity:.35}
.dumbbell .mod{fill:var(--c);stroke:var(--paper);stroke-width:1.5}
.dumbbell .mkt{fill:var(--paper);stroke:var(--c);stroke-width:2}
.legend-mk{vertical-align:-1px;margin:0 2px 0 6px}
.moves,.items,.plainlist{list-style:none;margin:0;padding:0}
.moves li{padding:7px 0;border-bottom:1px solid var(--rule-soft);display:flex;gap:8px;align-items:center;font-size:16px}
.items li{padding:9px 0;border-bottom:1px solid var(--rule-soft);line-height:1.35}
.items a{font-weight:500}.items .fine{display:block;margin-top:2px}
.plainlist li{padding:4px 0;font-size:16px}
.bloc{margin:0 0 24px}.bloc h3{font-size:18px;margin-bottom:4px}
.keyline{font:400 16px var(--sans);margin:0 0 14px}
.sub{font:600 15px var(--sans);margin:18px 0 6px}.sub:first-child{margin-top:0}
.tone .t-pos{fill:var(--tone-pos)}.tone .t-neutral{fill:var(--tone-neu)}.tone .t-neg{fill:var(--tone-neg)}.tone .t-abstain{fill:none;stroke:var(--muted);stroke-width:1}
:root{--tone-pos:#2B5DAF;--tone-neu:#9AA0A6;--tone-neg:#B07D00}
:root[data-theme=dark]{--tone-pos:#6C93E0;--tone-neu:#6C737A;--tone-neg:#D9A21B}
.key{display:inline-block;width:9px;height:9px;margin:0 4px 0 8px;vertical-align:0}
.key.pos{background:var(--tone-pos)}.key.neutral{background:var(--tone-neu)}.key.neg{background:var(--tone-neg)}.key.abstain{border:1px solid var(--muted)}

/* charts */
.chart{position:relative;min-height:240px;margin:6px 0 0}
.chart svg{max-width:100%;overflow:visible;font-family:var(--sans)}
.chart .grid{stroke:var(--rule-soft);stroke-width:1}
.chart .baseline{stroke:var(--rule);stroke-width:1}
.chart .tick{font-size:12px;fill:var(--muted)}
.chart .annot{font-size:12px;fill:var(--muted);font-style:italic}
.chart .ln{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.chart .ln.mkt{stroke:var(--muted);stroke-width:1.6}
.chart .band{opacity:.14;stroke:none}.chart .band.wide{opacity:.12}
:root[data-theme=dark] .chart .band{opacity:.26}:root[data-theme=dark] .chart .band.wide{opacity:.22}
@media (prefers-color-scheme: dark){:root[data-theme=auto] .chart .band{opacity:.26}:root[data-theme=auto] .chart .band.wide{opacity:.22}}
.chart .bf-field{fill:var(--field);opacity:.85}
.chart .vmark{stroke:var(--muted);stroke-dasharray:3 3}
.chart .vmark.live{stroke:var(--ink);stroke-dasharray:none;stroke-width:1.2;opacity:.7}
.chart .annot.live{fill:var(--ink);font-style:normal;font-weight:500}
.chart .ln.rec{stroke-dasharray:5 4;opacity:.45}
.chart .cross{stroke:var(--ink);stroke-width:1;opacity:.5}
.chart .hit{fill:transparent;cursor:crosshair}
.chart .leader{stroke:var(--rule);stroke-width:1}
.chart .endlabels text{font-size:13px;fill:var(--ink);font-weight:500}
.chart .endlabels .val{font-weight:600;font-variant-numeric:tabular-nums}
.chart .endlabels .mkt{fill:var(--muted);font-weight:400}
.chart .mk{stroke:var(--paper);stroke-width:1}
.chart .event circle{fill:none;stroke-width:1.6;stroke:var(--ink)}
.chart .pt{opacity:.55;stroke:var(--paper);stroke-width:.8}.chart .pt.on{opacity:1;stroke:var(--ink)}
.tip{position:absolute;z-index:20;pointer-events:none;background:var(--paper);color:var(--ink);border:1px solid var(--ink);border-radius:4px;padding:8px 10px;font:400 13px/1.35 var(--sans);max-width:300px;box-shadow:none}
.tip[hidden]{display:none}.tip table{font-size:13px;margin-top:4px}.tip td{border:0;padding:1px 10px 1px 0}.tip td.v{text-align:right;padding-right:0}

/* controls: square-ish, ruled, no pills */
.controls{display:flex;gap:10px 22px;flex-wrap:wrap;align-items:center;margin-bottom:6px}
.controls[hidden]{display:none}
.seg{display:inline-flex;border:1px solid var(--rule);border-radius:2px}
.seg button{background:none;border:0;border-right:1px solid var(--rule);padding:5px 12px;font:500 13px var(--sans);color:var(--muted);cursor:pointer}
.seg button:last-child{border-right:0}
.seg button[aria-pressed=true]{background:var(--ink);color:var(--paper)}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;gap:6px;background:none;border:1px solid var(--rule);border-radius:2px;padding:4px 9px;font:500 13px var(--sans);color:var(--ink);cursor:pointer}
.chip[aria-pressed=true]{color:var(--ink);border-color:var(--ink)}
.chip[aria-pressed=false]{color:var(--muted);border-style:dashed}.chip[aria-pressed=false] svg{opacity:.5}
:root[data-theme=dark] .chip[aria-pressed=false]{color:#B5BBC2}:root[data-theme=dark] .chip[aria-pressed=false] svg{opacity:.9}
.btn{background:var(--ink);color:var(--paper);border:0;border-radius:2px;padding:9px 16px;font:500 15px var(--sans);cursor:pointer}
.btn.small{padding:5px 12px;font-size:13px}
.btn:hover{opacity:.88}
details.tv{margin-top:12px;font:500 14px var(--sans)}
details.tv summary{cursor:pointer;color:var(--muted);padding:4px 0}
details.tv .scroll{max-height:320px;overflow:auto;margin-top:6px}
.filters,.scn{display:grid;gap:10px;margin-top:12px}
.filters label,.scn label{display:grid;gap:3px;font:500 13px var(--sans);color:var(--muted)}
select,input[type=date],input[type=text],input[type=password]{font:400 15px var(--sans);background:var(--paper);color:var(--ink);border:1px solid var(--rule);border-radius:2px;padding:6px 8px;width:100%;min-height:34px}
.filters .row{display:flex;gap:14px;align-items:center;font:500 14px var(--sans)}

/* login */
.login{max-width:380px;padding:clamp(36px,10vh,96px) 0}
.login h1{font-size:30px;margin-bottom:22px}
.login form{display:grid;gap:14px}
.login label{display:grid;gap:4px;font:500 14px var(--sans);color:var(--muted)}
.login .err{font:500 14px var(--sans);color:var(--warn);border-left:3px solid var(--warn);padding-left:10px;margin:0 0 14px}

.footer{border-top:1px solid var(--rule);margin-top:48px;padding:18px 0 28px;font:400 14px var(--sans);color:var(--muted)}
.footer-row{display:flex;justify-content:space-between;gap:8px 24px;flex-wrap:wrap}
.footer p{margin:0}

@media (max-width:640px){
  body{font-size:16px}
  .masthead-row{gap:6px 16px}.nav{order:3;flex-basis:100%;gap:2px 16px;font-size:14.5px;overflow-x:auto;flex-wrap:nowrap;white-space:nowrap}
  th,td{padding-right:9px}
  th.viz,td.viz{display:none}
  .chart .endlabels text{font-size:12px}
}
/* small multiples: two columns, one on a phone; every panel shares the y-scale */
.sm-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 28px}
.sm-cell{margin:0;min-width:0}
.sm-cell figcaption{display:flex;align-items:center;gap:6px;font:600 14px var(--sans);color:var(--ink);margin-bottom:2px}
.sm-plot{min-height:150px}
.chart .sm-val{font:600 13px var(--sans);fill:var(--ink);font-variant-numeric:tabular-nums}
.chart .endpt{stroke:var(--paper);stroke-width:1.5}
@media (max-width:640px){.sm-grid{grid-template-columns:minmax(0,1fr)}.chart .endlabels .val{font-weight:600}}
@media (prefers-reduced-motion:no-preference){.chart .ln{transition:opacity .2s}}
@media print{.masthead .tools,.controls,.skip{display:none}}

/* ---- stage 3b: why-card, today, news feed, explorer ---- */
.seg .segl{padding:5px 12px;font:500 13px var(--sans);color:var(--muted);text-decoration:none;border-right:1px solid var(--rule)}
.seg .segl:last-child{border-right:0}
.seg .segl[aria-current=true]{background:var(--ink);color:var(--paper)}
.hero .seg{margin-top:14px}
.howto{font:400 14px/1.45 var(--sans);color:var(--muted);margin:.5em 0 0;max-width:46ch}
.howto b{color:var(--ink);font-weight:600}
.whygrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:22px 28px}
.why{border-top:2px solid var(--ink);padding-top:10px;min-width:0}
.why h3{font-size:19px;margin:0 0 4px}.why h4{font:600 13px var(--sans);text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:14px 0 4px}
.why .whyhead{font-weight:600;margin:.1em 0 2px}
.why .autotext{margin:.6em 0 .2em;padding-left:10px;border-left:2px solid var(--rule)}
.why-terms{width:100%;margin:8px 0 4px}.why-terms caption{text-align:left;padding-bottom:4px}
.why-terms th{font-weight:400;text-align:left}.why-terms td.v{white-space:nowrap}
.why-terms .sumrow th,.why-terms .sumrow td,.flowtab .sumrow th,.flowtab .sumrow td{border-top:1px solid var(--ink)}
.caution{margin-top:12px;font-style:italic}
dl.fresh{display:grid;grid-template-columns:max-content 1fr;gap:6px 22px;margin:0;font:400 15px var(--sans)}
dl.fresh dt{color:var(--muted)}dl.fresh dd{margin:0}
table.feed td.ttl{max-width:46ch}table.feed td.ttl a{font-weight:500}
table.feed td,table.feed th{vertical-align:top}
.filters .btn.ghost{background:none;color:var(--muted);border-color:var(--rule)}
@media (min-width:760px){.filters{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));align-items:end}}
/* heatmap: one hue, light to dark by count; the count stays printed in the cell */
table.heat{border-collapse:separate;border-spacing:2px;width:100%}
table.heat th.rot{height:96px;vertical-align:bottom;padding:0 0 4px;font:500 12px var(--sans);color:var(--muted)}
table.heat th.rot span{display:inline-block;writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap}
table.heat td.hc{--h:var(--focus);text-align:center;width:44px;min-width:34px;height:30px;padding:0;border-radius:3px;font:500 12px var(--sans);
  background:color-mix(in srgb,var(--h) calc(var(--v) * 85%),var(--field));color:var(--ink)}
table.heat td.hc[style*="--v:0."]:not([style*="--v:0.0"]):not([style*="--v:0.1"]):not([style*="--v:0.2"]):not([style*="--v:0.3"]){color:var(--paper)}
table.heat td.hc[style*="--v:1"]{color:var(--paper)}
table.heat th[scope=row]{white-space:nowrap;text-align:left;font-weight:400;padding-right:8px}
/* chart marks of the explorer */
.chart .ln.thin{stroke-width:1.3;opacity:.85}
.chart .mpt{fill:var(--paper);stroke-width:2}
.chart .rowlab{font:500 12.5px var(--sans);fill:var(--ink)}
.chart .fine{font:400 11.5px var(--sans);fill:var(--muted)}
.chart .grid{stroke:var(--rule-soft)}
.chart .val{font:600 12.5px var(--sans);fill:var(--ink)}
.chart .seglab{font:600 11.5px var(--sans);fill:#fff;pointer-events:none}
.chart .fseg.none{stroke:var(--muted);stroke-width:1}
.chart .whisk{stroke:var(--ink);stroke-width:1.4}.chart .whisk.wide{stroke-width:2.4;opacity:.45}
.chart .hdia{fill:var(--paper);stroke:var(--ink);stroke-width:1.6}.chart .hdot{stroke:var(--paper);stroke-width:1.5}
.chart .tl .tlsym{fill:var(--ink)}.chart .tl .auto .tlsym{fill:var(--paper);stroke:var(--ink);stroke-width:1.6}
.chart .tl .tlhit{fill:transparent;cursor:pointer}.chart .tl .tlm:hover .tlsym{stroke:var(--focus);stroke-width:2}
@media (max-width:559px){table.heat{border-spacing:1px;table-layout:fixed}table.heat th:first-child{width:92px}table.heat th[scope=row]{white-space:normal;font-size:12.5px;line-height:1.15;padding-right:4px}table.heat td.hc{width:auto;min-width:0;height:26px;font-size:11px;border-radius:2px}table.heat th.rot{font-size:11px}.why h3{font-size:17px}}
@media (max-width:640px){
  table.feed thead{display:none}
  table.feed,table.feed tbody{display:block}
  table.feed tr{display:flex;flex-wrap:wrap;gap:.1rem .7rem;padding:.7rem 0;border-bottom:1px solid var(--rule,#d8d8d4)}
  table.feed td{padding:0;border:0;font-size:.85rem}
  table.feed td.v{order:1}table.feed td.ttl{order:0;flex:0 0 100%;max-width:none;font-size:1rem}
}

/* editorial pages, glossary, term pop-ups, permanent footer line */
.foot-line{max-width:70ch}
.gloss dt{font-weight:600;margin-top:1.1em}.gloss dd{margin:.2em 0 0;max-width:62ch}
a.term,.term{color:inherit;text-decoration:none;border-bottom:1px dotted currentColor;cursor:help;position:relative}
.term:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.term[data-def]:hover::after,.term[data-def]:focus::after{content:attr(data-def);position:absolute;left:0;top:calc(100% + 6px);z-index:20;width:min(320px,80vw);padding:10px 12px;background:var(--bg,#fff);color:var(--ink);border:1px solid var(--rule);font:400 14px/1.4 var(--sans);box-shadow:0 4px 14px rgba(0,0,0,.14)}
details.more{margin:.6em 0 0;max-width:62ch}details.more summary{cursor:pointer;font:600 14px var(--sans)}details.more p{font:400 14px/1.5 var(--sans);color:var(--muted)}
.legalinfo{display:block;font-weight:400;margin-top:2px;max-width:34ch}
table.polls tr.pmeta td{padding-top:0;border-top:0;font:400 12px/1.4 var(--sans);color:var(--muted)}
table.polls tr.pmeta td[colspan]{max-width:none}
table.polls tbody tr:has(+ tr.pmeta) > *{border-bottom:0}
table.polls tr.pmeta .pm{display:block;position:sticky;left:0;max-width:min(100%,calc(100vw - 48px));white-space:normal}
.evid{display:block;margin-top:2px}.evl{margin:.2em 0 .4em;padding-left:1.1em;font:400 13px/1.45 var(--sans)}.evl li{margin:.1em 0}
/* names as links: quiet until hovered; SVG links keep keyboard focus visible */
a.nl{color:inherit;text-decoration:none;border-bottom:1px dotted var(--muted)}
a.nl:hover,a.nl:focus-visible{border-bottom-style:solid}
.chart a.nl{border-bottom:0;cursor:pointer}
.chart a.nl:hover text,.chart a.nl:focus-visible text{text-decoration:underline}
.chart a.nl:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.sm-cell figcaption a.nl{font:inherit}
/* sourced profile (experimental, outside P(win)) */
.profile .prof-sum{max-width:70ch;margin:0 0 14px;line-height:1.5}
.prof-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 32px}
.prof-pts{list-style:none;margin:0;padding:0}
.prof-pts li{padding:9px 0;border-bottom:1px solid var(--rule-soft);line-height:1.4}
.prof-src{display:block;margin-top:2px}
.prof-src .tag{border:1px solid var(--rule-soft);border-radius:3px;padding:0 4px;font-size:12px}
.prof-wiki{margin-top:12px}
@media (max-width:640px){.prof-cols{grid-template-columns:minmax(0,1fr)}}

/* home: candidate board, share first, probability second */
.board{list-style:none;margin:26px 0 0;padding:0;max-width:760px}
.board li{display:grid;grid-template-columns:1.6em minmax(0,1fr) auto;grid-template-areas:"rk who sh" ". bar bar" ". pw pw";column-gap:10px;row-gap:4px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--rule-soft)}
.board .rk{grid-area:rk;font:500 14px var(--sans);color:var(--muted)}
.board .who{grid-area:who;font-size:17px;min-width:0;overflow-wrap:anywhere}
.board .sh{grid-area:sh;text-align:right;white-space:nowrap;font-family:var(--sans)}
.board .sh b{font-size:clamp(22px,4.4vw,30px);font-weight:600;letter-spacing:-.02em}
.board .bar{grid-area:bar;display:block;height:5px;background:var(--field);border-radius:3px;overflow:hidden}
.board .bar i{display:block;height:100%;background:var(--c,var(--ink))}
.board .pw{grid-area:pw;margin:0}
.pchip{display:inline-block;font:500 12px var(--sans);padding:1px 7px;border:1px solid var(--rule);border-left:3px solid var(--c,var(--rule));border-radius:3px;color:var(--muted);vertical-align:2px}
.pchip a{color:inherit;text-decoration:none}
.big{font-size:1.2em;font-weight:650}
.soft,.keys .soft dd{color:var(--muted);font-weight:400}.soft b{font-weight:400}

/* correlations: diverging heatmap (blue = together, orange = opposite), |value| sets the strength, sign is printed in the cell */
table.heat.div td.hc{--h:var(--focus);--w:0;width:48px;background:color-mix(in srgb,var(--h) calc(var(--w) * 85%),var(--field));color:var(--ink)}
table.heat.div td.hc.neg{--h:#C2641E}
table.heat.div td.hc.pale{opacity:.55}
table.heat.div td.hc.na{background:none;color:var(--muted)}
table.heat.div td.hc.dg{background:var(--rule-soft);color:var(--muted)}
table.subst td.v.sig{font-weight:600}
table.heat.div th.rot{height:132px}

/* candidate portraits (Wikimedia Commons, free licences). Same size and frame for everyone; no photo = neutral initials. */
.avatar{box-sizing:border-box;display:inline-block;flex:none;border-radius:50%;object-fit:cover;object-position:center 20%;background:var(--field);border:1px solid var(--rule);vertical-align:middle;margin-right:10px}
.avatar.ph{display:inline-flex;align-items:center;justify-content:center;font:600 15px var(--sans);color:var(--muted);letter-spacing:.02em;box-sizing:border-box}
th.withav .avatar{vertical-align:middle}
th.withav{white-space:nowrap}
.portrait{margin:0;display:flex;flex-direction:column;align-items:flex-start;gap:6px;max-width:200px}
.portrait .avatar{margin-right:0}
.portrait figcaption{line-height:1.3;color:var(--muted)}
.hero.has-portrait{display:flex;align-items:flex-start;gap:22px}
.hero.has-portrait .hero-text{min-width:0;flex:1}
.photo-credits{margin-top:10px}
@media (max-width:640px){.hero.has-portrait{flex-direction:column;gap:12px}}

/* "Aujourd'hui" board and the folded "why" block: plain SVG, no script */
.tdstrip{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px 22px;margin:0 0 8px}
.tdstrip dt{font:500 13px var(--sans);color:var(--muted)}.tdstrip dd{margin:3px 0 0}.tdstrip .big{font:600 24px var(--sans)}
.sparkgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:18px 20px}
.spark{margin:0;padding:8px 0;border-top:2px solid var(--c,var(--rule))}
.spark figcaption{font:500 15px var(--sans)}.sp-val b{font:600 20px var(--sans)}
.spark svg.sp{display:block;width:100%;height:auto;margin-top:4px;overflow:visible}
.sp-line{fill:none;stroke:var(--c);stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}
.sp-band{fill:var(--c);opacity:.16;stroke:none}.sp-dot{fill:var(--c)}.sp-d{margin-top:2px}
table.ribbon td svg.dv{vertical-align:middle;margin-right:8px}.dv-axis{stroke:var(--rule);stroke-width:1}
.dv-bar{fill:var(--c)}.dv-bar.dim{fill:var(--muted);opacity:.55}
.pressgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px 28px}
table.hbars td.bar{width:55%;padding:2px 8px}table.hbars td.bar rect{fill:var(--muted)}table.hbars th{font-weight:400;text-align:left}
details.whydetail{margin:10px 0 4px;flex-basis:100%}details.whydetail summary{cursor:pointer;color:var(--muted);font:500 14px var(--sans);padding:4px 0}
details.whydetail .wd-body{padding:6px 0 4px;max-width:70ch}.wd-body h4{margin:14px 0 4px;font:600 14px var(--sans)}
.moves li{flex-wrap:wrap}
@media (max-width:640px){.sparkgrid{grid-template-columns:repeat(2,1fr)}}

/* avatars beside candidate names (home board / ladder / moves, today strip / cards / ribbon / polls): same frame for everyone; the name truncates instead of wrapping */
.cname.has-av{display:inline-flex;align-items:center;gap:8px;max-width:100%;min-width:0;vertical-align:middle}
.cname.has-av .avatar{margin-right:0}
.cname.has-av .cn-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.board .who .cname.has-av{max-width:calc(100% - 3.2em)}
.moves li>.avatar{margin-right:0}
.why h3 .cname.has-av{display:flex}
.tdstrip dd .cname.has-av{vertical-align:middle;margin-right:8px}
.tdstrip dd .cname.has-av .avatar.ph{font-size:20px}
table.ribbon th[scope=row],table.ladder th[scope=row]{white-space:nowrap}
@media (max-width:559px){.cname.has-av{gap:6px}.board .who .cname.has-av{max-width:calc(100% - 2.6em)}table.ribbon th[scope=row] .cn-name,table.ladder th[scope=row] .cn-name{max-width:34vw}}
/* /validation: two small server-side SVG line charts (three methods told apart by dash and marker, not by colour alone) */
svg.vl{display:block;width:100%;max-width:640px;height:auto}.vl-ax{stroke:var(--rule);stroke-width:1}.vl-grid{stroke:var(--rule-soft);stroke-width:1}
.vl-ref{stroke:var(--ink);stroke-width:1;stroke-dasharray:2 3;opacity:.7}.vl text{font:400 11px var(--sans);fill:var(--muted)}
.vl-l{fill:none;stroke:var(--ink);stroke-width:2;stroke-linejoin:round}.vl-m-naive .vl-l{stroke-dasharray:none}.vl-m-v2 .vl-l{stroke-dasharray:7 4;stroke:var(--focus)}
.vl-m-opinion .vl-l{stroke-dasharray:2 4;stroke:var(--warn)}.vl-m-naive .vl-p{fill:var(--ink)}.vl-m-v2 .vl-p{fill:var(--focus)}.vl-m-opinion .vl-p{fill:var(--warn)}
.vl-key{display:flex;flex-wrap:wrap;gap:6px 18px;margin:6px 0 0;padding:0;list-style:none;font:400 14px var(--sans)}
.vl-key svg{vertical-align:middle;margin-right:6px}.vl-key .vl-l{stroke-width:2}.fp{word-break:break-all;font-family:ui-monospace,monospace}
