/* What You Voted For — Hugo theme layer.
   Every value comes from the design-system tokens; no literals below except layout maths. */
@import url("styles.css");

/* ---------- shell ---------- */
.site{min-height:100vh;display:flex;flex-direction:column}
.skiplink{position:absolute;left:-9999px}
.skiplink:focus{left:var(--space-5);top:var(--space-3);z-index:10;background:var(--surface-card);padding:var(--space-3) var(--space-4);box-shadow:var(--focus-ring)}

/* ---------- masthead ---------- */
.masthead{background:var(--surface-card);border-bottom:var(--border-heavy)}
.masthead__inner{max-width:var(--content-max);margin:0 auto;padding:var(--space-5) var(--gutter) var(--space-4);display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-6);flex-wrap:wrap}
.masthead__right{display:flex;align-items:center;gap:var(--space-5)}
.wordmark{font-family:var(--font-display);font-weight:var(--weight-black);font-size:var(--size-2xl);line-height:1;letter-spacing:var(--tracking-display);text-transform:uppercase;color:var(--text-heading);text-decoration:none;display:block}
.wordmark:hover{color:var(--text-heading);text-decoration:none}
.wordmark span{color:var(--red-600)}
.dateline{font:var(--type-data);color:var(--text-faint);margin-top:2px}
.mainnav{display:flex;gap:var(--space-5);flex-wrap:wrap}
.mainnav a{font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;text-decoration:none;color:var(--text-muted);border-bottom:3px solid transparent;padding-bottom:3px;transition:var(--transition-hover)}
.mainnav a:hover{color:var(--text-heading);text-decoration:none}
.mainnav a.is-active{color:var(--text-heading);border-bottom-color:var(--red-600)}
.themetoggle{background:transparent;border:var(--border-rule);border-radius:var(--radius-sm);width:32px;height:32px;color:var(--text-muted);cursor:pointer;transition:var(--transition-hover)}
.themetoggle:hover{color:var(--text-heading);border-color:var(--line-strong)}

/* ---------- page grid ---------- */
.page{flex:1;width:100%;max-width:var(--content-max);margin:0 auto;padding:var(--space-7) var(--gutter) var(--space-9);box-sizing:border-box}
.page--railed{display:grid;grid-template-columns:var(--sidebar-width) 1fr;gap:var(--space-8);align-items:start}
@media (max-width:900px){.page--railed{grid-template-columns:1fr;gap:var(--space-6)}}
main{min-width:0}

/* ---------- index rail ---------- */
.rail__title{font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-faint);padding-bottom:var(--space-3);border-bottom:var(--border-strong)}
.rail a{display:flex;justify-content:space-between;gap:var(--space-3);font:var(--type-ui);color:var(--text-body);text-decoration:none;padding:var(--space-3) var(--space-3) var(--space-3) var(--space-4);border-bottom:var(--border-hairline);border-left:3px solid transparent;transition:var(--transition-hover)}
.rail a:hover{background:var(--surface-sunken);text-decoration:none;color:var(--text-heading)}
.rail a.is-active{font-weight:var(--weight-bold);color:var(--text-heading);background:var(--surface-sunken);border-left-color:var(--red-600)}
.rail__child{padding-left:var(--space-7)!important;font-size:var(--size-xs);color:var(--text-muted)}
.rail .count{font-family:var(--font-mono);font-size:var(--size-xs);color:var(--text-faint)}

/* ---------- breadcrumbs + page header ---------- */
.crumbs{display:flex;gap:var(--space-3);align-items:center;flex-wrap:wrap;font:var(--type-data);color:var(--text-faint);margin-bottom:var(--space-4)}
.crumbs a{color:var(--text-muted);text-decoration:none}
.crumbs a:hover{color:var(--text-heading)}
.crumbs__here{color:var(--text-body)}
.pagehead{border-bottom:var(--border-strong);padding-bottom:var(--space-6);margin-bottom:var(--space-7)}
.kicker{font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--red-600);margin-bottom:var(--space-4)}
.pagehead h1{font-family:var(--font-display);font-weight:var(--weight-black);font-size:var(--size-3xl);line-height:var(--leading-tight);letter-spacing:var(--tracking-display);margin:0;max-width:22ch}
.home .pagehead h1{font-size:var(--size-5xl)}
@media (max-width:700px){.home .pagehead h1{font-size:var(--size-3xl)}}
.standfirst{font:var(--type-body);font-size:var(--size-md);color:var(--text-muted);margin:var(--space-5) 0 0;max-width:var(--measure-prose)}
.ctas{display:flex;gap:var(--space-4);flex-wrap:wrap;margin-top:var(--space-6)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:var(--space-3);font-family:var(--font-ui);font-weight:var(--weight-bold);font-size:var(--size-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase;text-decoration:none;padding:10px 18px;border:2px solid transparent;border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition-hover),transform var(--duration-instant) var(--ease-out)}
.btn:hover{text-decoration:none}
.btn:active{transform:translateY(1px)}
.btn--primary{background:var(--navy-700);border-color:var(--navy-700);color:var(--paper-000)}
.btn--primary:hover{background:var(--navy-900);border-color:var(--navy-900);color:var(--paper-000)}
.btn--danger{background:var(--red-600);border-color:var(--red-600);color:var(--paper-000)}
.btn--danger:hover{background:var(--red-700);border-color:var(--red-700);color:var(--paper-000)}
.btn--secondary{border-color:var(--line-brand);color:var(--text-brand);background:transparent}
.btn--secondary:hover{background:var(--surface-brand-quiet);color:var(--text-brand)}

/* ---------- content ---------- */
.content{font:var(--type-body);color:var(--text-body)}
.content>*{max-width:var(--measure-prose)}
.content h2{font:var(--type-h2);letter-spacing:var(--tracking-tight);margin:var(--space-8) 0 var(--space-4)}
.content h3{font:var(--type-h3);margin:var(--space-6) 0 var(--space-3)}
.content ul,.content ol{padding-left:var(--space-6);margin:0 0 var(--space-5)}
.content li{margin-bottom:var(--space-3)}
.content blockquote{margin:var(--space-6) 0;padding-left:var(--space-5);border-left:var(--border-heavy);font-style:italic;color:var(--text-heading)}
.content blockquote p:last-child{margin-bottom:0;font-style:normal;font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted)}
.content--home>p:first-of-type::first-letter{float:left;font-family:var(--font-display);font-weight:var(--weight-black);font-size:64px;line-height:.82;padding:2px var(--space-3) 0 0;color:var(--text-heading)}
/* figures and maps break the prose measure */
.content .figure,.content .stats,.content .sharebar,.content .callout,.content .update{max-width:none}

/* ---------- chart figure ---------- */
.figure{margin:var(--space-7) 0 var(--space-8);background:var(--surface-card);border:var(--border-rule);border-top:var(--border-strong)}
.figure__head{padding:var(--space-5) var(--space-6) var(--space-4)}
.figure__head h3{font:var(--type-h2);letter-spacing:var(--tracking-tight);margin:0}
.figure__desc{font:var(--type-body-sm);color:var(--text-muted);margin:var(--space-2) 0 0;max-width:var(--measure-prose)}
.figure__plot{position:relative;height:var(--chart-height-landscape);padding:0 var(--space-5) var(--space-5)}
.figure__plot--map{height:480px}
.figure__caption{border-top:var(--border-rule);padding:var(--space-4) var(--space-6);font:var(--type-data);color:var(--text-muted);display:grid;gap:var(--space-2)}
.figure__caption .marker{color:var(--chart-annotation)}
.figure__source{font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-faint)}
.maplegend{display:flex;gap:var(--space-5);flex-wrap:wrap;align-items:center}
.maplegend i{display:inline-block;width:18px;height:10px;margin-right:var(--space-2);vertical-align:middle}
@media only screen and (orientation:portrait),(max-width:700px){.figure__plot{height:var(--chart-height-portrait)}.figure__plot--map{height:320px}}

/* ---------- stats ---------- */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:var(--space-6);margin:var(--space-6) 0 var(--space-8)}
.stat{border-top:var(--border-strong);padding:var(--space-5) 0}
.stat__label{font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted)}
.stat__row{display:flex;align-items:baseline;gap:var(--space-3);flex-wrap:wrap;margin-top:var(--space-2)}
.stat__value{font-family:var(--font-mono);font-weight:var(--weight-semibold);font-size:var(--size-3xl);line-height:var(--leading-tight);font-variant-numeric:tabular-nums;color:var(--text-heading)}
.stat__period,.stat__note{font-family:var(--font-mono);font-size:var(--size-xs);color:var(--text-faint)}
.stat__note{margin-top:var(--space-2)}
.delta{display:inline-flex;align-items:baseline;gap:var(--space-2);font-family:var(--font-mono);font-size:var(--size-xs);font-weight:var(--weight-medium);font-variant-numeric:tabular-nums;padding:2px 7px;border-radius:var(--radius-sm)}
.delta--worse{background:var(--red-100);color:var(--signal-worse)}
.delta--better{background:var(--teal-100);color:var(--signal-better)}
.delta--flat{background:var(--surface-sunken);color:var(--signal-flat)}

/* ---------- callouts and updates ---------- */
.callout{background:var(--surface-note);border:1px solid var(--highlight-400);border-left-width:4px;padding:var(--space-5) var(--space-6);margin:var(--space-6) 0}
.callout--alert{background:var(--surface-alert);border-color:var(--red-600)}
.callout--alert .callout__title{color:var(--text-alert)}
.callout--brand{background:var(--surface-brand-quiet);border-color:var(--navy-700)}
.callout--brand .callout__title{color:var(--text-brand)}
.callout--quiet{background:var(--surface-sunken);border-color:var(--line-rule)}
.callout__title{display:flex;align-items:center;gap:var(--space-3);font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;margin-bottom:var(--space-3)}
.callout__body{font:var(--type-body-sm);max-width:var(--measure-prose)}
.callout__body p:last-child{margin-bottom:0}
.update{background:var(--surface-card);border:var(--border-rule);border-left:4px solid var(--highlight-400);padding:var(--space-5) var(--space-6);margin:0 0 var(--space-5)}
.update--alert{border-left-color:var(--red-600)}
.update--brand{border-left-color:var(--navy-700)}
.update__head{display:flex;align-items:baseline;gap:var(--space-4);flex-wrap:wrap}
.update__date{font-family:var(--font-mono);font-size:var(--size-xs);color:var(--text-faint)}
.update__title{font:var(--type-h3);color:var(--text-heading)}
.update__body{font:var(--type-body-sm);margin-top:var(--space-3);max-width:var(--measure-prose)}
.update__body p:last-child{margin-bottom:0}

/* ---------- section index + share ---------- */
.section-index__title{font:var(--type-h2);margin:var(--space-8) 0 0}
.section-index{border-top:var(--border-strong);margin-top:var(--space-4)}
.section-index a{display:grid;grid-template-columns:1fr auto;gap:var(--space-2) var(--space-4);padding:var(--space-5) 0;border-bottom:var(--border-rule);text-decoration:none;transition:var(--transition-hover)}
.section-index a:hover{background:var(--surface-sunken);text-decoration:none}
.section-index a i{grid-column:2;grid-row:1;align-self:center;color:var(--text-faint)}
.section-index a:has(.section-index__desc) i{grid-row:1/3}
.section-index__label{font:var(--type-h3);color:var(--text-link)}
.section-index__desc{font:var(--type-body-sm);color:var(--text-muted)}
.sharebar{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap;padding:var(--space-5) 0;border-top:var(--border-rule);border-bottom:var(--border-rule);margin:var(--space-7) 0}
.sharebar__label{font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted)}
.sharebar__links{display:flex;gap:var(--space-3);flex-wrap:wrap}
.sharebar a{display:inline-flex;align-items:center;gap:var(--space-2);font:var(--type-ui);color:var(--text-brand);text-decoration:none;border:1px solid var(--line-rule);border-radius:var(--radius-pill);padding:5px 12px;transition:var(--transition-hover)}
.sharebar a:hover{background:var(--surface-brand-quiet);border-color:var(--line-brand);text-decoration:none}

/* ---------- footer ---------- */
.footer{background:var(--surface-inverse);color:var(--text-inverse);border-top:var(--border-heavy);margin-top:var(--space-10)}
.footer__cols{max-width:var(--content-max);margin:0 auto;padding:var(--space-8) var(--gutter);display:grid;gap:var(--space-8);grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.footer h4{font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-inverse-muted);padding-bottom:var(--space-3);border-bottom:1px solid var(--line-inverse);margin:0 0 var(--space-3)}
.footer__cols>div{display:grid;gap:var(--space-3);align-content:start}
.footer a{color:var(--text-inverse-strong);font:var(--type-ui);text-decoration:none}
.footer a:hover{color:var(--text-inverse);text-decoration:underline}
.colophon{border-top:1px solid var(--line-inverse)}
.colophon__inner{max-width:var(--content-max);margin:0 auto;padding:var(--space-5) var(--gutter);display:flex;justify-content:space-between;gap:var(--space-5);flex-wrap:wrap;font:var(--type-data);color:var(--text-inverse-muted)}
.colophon__inner code{color:var(--text-inverse-strong)}