/* Final layout and interaction layer. Keep the data scales and source text intact. */
:root {
  --control-line: #6b7b71;
  --bar-green: #607969;
  --page-gutter: clamp(16px, 3.5vw, 50px);
}

html { scroll-padding-block-start: 88px; }
body { line-height: 1.75; }
.wrap { width: min(1280px, calc(100% - var(--page-gutter) * 2)); }
.hero > *, .people-heading > *, .economy-focus > *, .economy-indicators > *,
.data-layout > *, .chart-card-head > *, .article-meta > *, .editorial > *,
.source-organizations > *, .footer-inner > * { min-width: 0; }
.hero h1, .section-head h2, .people-heading h2, .economy-intro h2,
.story-card h3, .factcheck-card h3, .dialog-title { text-wrap: balance; }
.section-head h2, .people-heading h2, .dialog-title { overflow-wrap: break-word; }
.section-index { line-height: 1.75; }
.section-deck { margin-top: 0; }
.hero-actions, .footer-links, .people-actions { flex-wrap: wrap; }
.topline .wrap { gap: 16px; }
.source-badge, .chart-axis { color: var(--soft); }
.filters button span { opacity: 1; }
.nav a span, .fact-arrow, .hero-foot .check-mark,
.quick-item:hover strong, .economy-indicator:hover strong,
.source-organizations a:hover, .source-organizations button:hover {
  color: var(--accent-text);
}

/* All standalone controls keep a usable hit area and an identifiable boundary. */
.button, .text-link, .plain-button, .search-trigger, .icon-button,
.filters button, .data-tabs button, .measure-switch button,
.employment-toggle button, .footer-links button, .footer-bottom > a,
.article-meta button, .literacy-card button, .check-links a,
.source-record a, .chart-method summary, .data-table-details summary {
  min-block-size: 44px;
}
.icon-button, .search-trigger, #clear-search, .footer-links button,
.nav a, .nav button { min-inline-size: 44px; }
.icon-button { width: 44px; height: 44px; }
.filters button, .measure-switch button, .employment-toggle button,
.article-meta button, .chart-select, .search-box input, .icon-button,
.more-stories .button { border-color: var(--control-line); }
.data-tabs button:not(.selected) { border-color: var(--control-line); }
.filters button.selected, .measure-switch button.selected,
.employment-toggle button.selected { border-color: var(--ink); }
.plain-button { text-decoration: underline; text-underline-offset: .2em; }
.search-box input, .chart-select { font-size: 16px; min-inline-size: 0; }
.search-input-row { gap: 12px; }
.chart-select { max-inline-size: 100%; }

:is(a, button, input, select, summary, [tabindex]):focus-visible {
  outline: 3px solid var(--accent-text);
  outline-offset: 3px;
}
.lead-visual :is(a, button):focus-visible,
.editorial :is(a, button):focus-visible {
  outline-color: var(--orange-bright);
  outline-offset: -5px;
}
.story-title:focus-visible { outline: none; }
.story-title:focus-visible::after {
  outline: 3px solid var(--accent-text);
  outline-offset: -5px;
}
.story-card:focus-within { border-color: var(--accent-text); }
#main:focus-visible { outline-offset: -4px; }
#chart-title, #dialog-title { scroll-margin-block-start: 16px; }
.skip { min-block-size: 44px; max-inline-size: calc(100% - 40px); }

/* The navigation remains one discoverable scroll row at narrow widths and zoom. */
.nav-inner {
  height: auto;
  min-height: 62px;
  padding-block: 4px;
  scrollbar-width: thin;
  scrollbar-color: var(--control-line) var(--paper);
  scroll-padding-inline: 8px;
}
.nav a, .nav button { min-height: 48px; height: auto; justify-content: center; }
.nav a:focus-visible, .nav button:focus-visible { outline-offset: -3px; }
.nav-inner::-webkit-scrollbar { display: block; height: 6px; }
.nav-inner::-webkit-scrollbar-thumb { background: var(--control-line); border-radius: 3px; }
.nav-inner::-webkit-scrollbar-track { background: var(--paper); }

/* Exact values stay outside the bars; fill contrast does not carry the meaning alone. */
.bar-fill { background: var(--bar-green); }
.bar-row:first-child .bar-fill { background: var(--orange); }
.bar-label, .bar-track { min-width: 0; }
.bar-label { overflow-wrap: break-word; }
.bar-value {
  color: var(--ink);
  font-size: 14px;
  font-variant-numeric: tabular-nums;
  line-height: 1.4;
  top: -24px;
  height: auto;
  max-inline-size: 100%;
}
.bar-row:first-child .bar-value { color: var(--ink); }
.chart-scale-note, .chart-source { overflow-wrap: anywhere; }
.chart-source a, .quick-source a, .update-note a {
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
}
.chart-card .tag { color: var(--soft); }
.chart-source button { text-align: start; }
.data-table-details summary, .chart-method summary { max-inline-size: 100%; }
.data-note { display: flex; color: var(--soft); }
.economy-indicator strong.long-number { font-size: clamp(20px, 2.1vw, 32px); }
.people-count strong, .economy-indicator strong, .article-stat strong {
  font-variant-numeric: tabular-nums;
}

/* Long source names, URLs, and units wrap inside their containing column. */
.source-record, .quick-source, .article-prose, .dialog-section,
.glossary-terms, .essential-context, .article-callout, .takeaway {
  min-width: 0;
  overflow-wrap: anywhere;
}
.source-record a {
  display: inline-block;
  max-inline-size: 100%;
  padding-block: 10px;
  line-height: 1.75;
  overflow-wrap: anywhere;
}
.source-record h3 { margin-block: 8px; }
.editorial .text-link:hover { color: var(--orange-bright); }
.dialog-section h3:not(:first-child) { margin-block-start: 28px; }
.article-meta { flex-wrap: wrap; }
.article-stat strong { max-inline-size: 100%; overflow-wrap: anywhere; }
.essential-context > div { min-width: 0; }
.full-analysis > summary, .source-details > summary { min-block-size: 56px; }
.full-analysis > summary > span, .source-details > summary > span { min-width: 0; }
.full-analysis > summary b, .source-details > summary b { flex-shrink: 0; }
.table-scroll {
  max-inline-size: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-color: var(--control-line) var(--paper);
  scrollbar-width: thin;
  margin-block: 12px;
}
.table-scroll > table { margin-top: 0; }
.comparison-table .table-scroll > table { min-inline-size: 32rem; }
.comparison-table table { table-layout: fixed; }
table { line-height: 1.75; }
th, td { vertical-align: top; overflow-wrap: anywhere; }
thead th { color: var(--ink); background: var(--pale); }
.comparison-table td:nth-child(2) { white-space: normal; }
.data-table-details table { color: var(--ink); }
.data-table-details th { font-weight: 600; }

dialog { overscroll-behavior: contain; scroll-padding-block-start: 92px; }
.dialog-toolbar { min-height: 68px; }
.dialog-status:not(:empty) {
  margin: 0;
  padding: 12px 28px;
  background: var(--pale);
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  font-size: 14px;
  line-height: 1.75;
  overflow-wrap: anywhere;
}
.dialog-status:empty { margin: 0; padding: 0; }
.footer-bottom { align-items: center; }
.footer-bottom > a { display: inline-flex; align-items: center; }
.toast { overflow-wrap: anywhere; }
.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;
}

@media (max-width: 900px) {
  .hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .data-tabs { overflow: visible; }
  .data-tabs button { white-space: normal; min-width: 0; }
  .economy-indicator strong.long-number { font-size: clamp(24px, 4vw, 32px); }
  .factchecks-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 650px) {
  .topline .wrap { flex-wrap: wrap; gap: 2px 12px; }
  .topline .wrap > span, .topline .wrap > span:last-child { font-size: 11px; text-align: start; }
  .masthead { min-height: 94px; height: auto; padding-block: 18px; }
  .hero { grid-template-columns: minmax(0, 1fr); }
  .hero h1 { font-size: clamp(48px, 10.5vw, 62px); letter-spacing: -1.5px; }
  .hero-actions { gap: 12px 20px; }
  .lead-top { flex-wrap: wrap; gap: 8px; }
  .lead-columns { left: 38px; right: 8px; gap: clamp(18px, 6vw, 36px); }
  .lead-column { flex: 1; min-width: 0; max-width: 110px; }
  .lead-column > span { width: 100%; font-size: 12px; }
  .section-head h2 { font-size: clamp(30px, 7.3vw, 36px); }
  .people-heading h2 { font-size: clamp(29px, 7.3vw, 34px); }
  .section-index { white-space: normal; }
  .data-tabs button { flex-basis: calc(50% - 7px); }
  .chart-card { padding: 22px 16px; }
  .chart-card-head { gap: 12px; }
  .chart-card h3 { font-size: 22px; overflow-wrap: break-word; }
  .bar-chart { gap: 28px; }
  .bar-row { grid-template-columns: minmax(0, 1fr); gap: 6px; font-size: 14px; }
  .bar-track { margin-top: 24px; }
  .bar-value { right: 0; }
  .bar-label small { font-size: 12px; }
  .chart-axis { margin-inline: 0; font-size: 11px; }
  .reading-context { padding: 14px; }
  .factchecks-grid { grid-template-columns: minmax(0, 1fr); }
  .economy-indicator { grid-template-columns: max-content minmax(0, 1fr); }
  .economy-stat-label { overflow-wrap: break-word; }
  .economy-indicator:has(.long-number) { grid-template-columns: minmax(0, 1fr); }
  .economy-indicator:has(.long-number) > * { grid-column: 1; grid-row: auto; }
  .economy-indicator strong.long-number { font-size: clamp(28px, 8vw, 36px); }
  .comparison-table th, .comparison-table td,
  .comparison-table td:nth-child(2), .comparison-table td:last-child {
    font-size: 14px;
    padding: 10px 8px;
  }
  .source-organizations { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .source-organizations > * { overflow-wrap: break-word; }
  .source-organizations span { font-size: 21px; letter-spacing: -.3px; }
  .source-organizations small { flex-wrap: wrap; }
  .footer-links { gap: 12px 24px; }
  .footer-bottom { gap: 8px 16px; }
  #dialog-content { padding-inline: 20px; }
  .dialog-title { font-size: clamp(29px, 7.2vw, 36px); letter-spacing: -.6px; }
  .dialog-toolbar { padding: 12px 16px; }
  .dialog-status:not(:empty) { padding-inline: 20px; }
}

@media (max-width: 440px) {
  .hero-actions > .button { width: 100%; }
  .lead-visual { padding-inline: 20px; }
  .lead-link { width: calc(100% + 40px); margin-right: -20px; padding-inline: 20px; }
  .lead-column b { font-size: 32px; }
  .lead-column b span { font-size: 18px; }
  .story-art { flex-direction: column; align-items: flex-start; gap: 14px; padding: 22px; min-height: 174px; }
  .art-number { max-width: 100%; font-size: clamp(36px, 12vw, 48px); }
  .art-number.long-number { font-size: clamp(27px, 8vw, 36px); }
  .art-meaning { font-size: 13px; max-width: none; }
  .story-bottom { align-items: flex-start; flex-wrap: wrap; }
  .story-read { margin-inline-start: auto; }
  .article-action { max-inline-size: 100%; gap: 16px; text-align: start; }
  .people-count strong { font-size: clamp(32px, 10vw, 41px); }
  .article-stat strong.long-number { font-size: clamp(27px, 8vw, 37px); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .story-card:hover, .button:hover { transform: none; }
}

@media (forced-colors: active) {
  :is(a, button, input, select, summary, [tabindex]):focus-visible,
  .story-title:focus-visible::after { outline-color: Highlight; }
  .story-card, .chart-card, .factcheck-card, .lead-visual, .editorial { border: 1px solid CanvasText; box-shadow: none; }
  .filters button.selected, .data-tabs button.selected,
  .measure-switch button.selected, .employment-toggle button.selected {
    border: 2px solid Highlight;
    text-decoration: underline;
  }
  .nav .active { text-decoration: underline; text-underline-offset: .25em; }
  .bar-track { outline: 1px solid CanvasText; background: Canvas; }
  .bar-fill, .bar-row:first-child .bar-fill, .column {
    forced-color-adjust: none;
    background: CanvasText;
    outline: 1px solid CanvasText;
  }
  .bar-row:first-child .bar-fill, .column.orange { background: Highlight; }
  .chart-grid span::after { background: CanvasText; }
}

@media print {
  html, body { overflow: visible; }
  .nav, .dialog-toolbar { position: static; }
  .nav-inner { flex-wrap: wrap; white-space: normal; overflow: visible; }
  .story-card, .chart-card, .lead-visual, .editorial { box-shadow: none; }
  .story-card, .factcheck-card, .source-record, .bar-row { break-inside: avoid; }
  .table-scroll { overflow: visible; }
  .comparison-table .table-scroll > table { min-inline-size: 0; }
  .lead-visual, .editorial { background: white; color: #172c39; border: 1px solid #172c39; }
  .lead-caption, .lead-top .tag, .tiny, .chart-grid,
  .editorial .eyebrow, .editorial-copy p, .editorial .text-link { color: #172c39; }
  .lead-link { background: white; color: #172c39; border-top: 1px solid #172c39; }
  .column, .bar-fill { border: 1px solid #172c39; }
  .source-record a[href]::after {
    content: " (" attr(href) ")";
    display: block;
    direction: ltr;
    unicode-bidi: plaintext;
    font-size: 11px;
    overflow-wrap: anywhere;
  }
  dialog[open] { position: static; width: 100%; max-height: none; overflow: visible; box-shadow: none; }
  .dialog-toolbar { border-bottom: 1px solid #172c39; }
}

/* A composition chart is used only for mutually exclusive parts of one total. */
.composition-chart { margin: 24px 0; padding: 20px; border: 1px solid #aab4a9; background: #fffefa; color: #172c39; }
.composition-chart figcaption strong { display: block; font-size: 18px; line-height: 1.5; }
.composition-chart figcaption > span { display: block; font-size: 13px; line-height: 1.7; margin-top: 5px; color: #52615b; }
.composition-layout { display: grid; grid-template-columns: 160px minmax(0, 1fr); align-items: center; gap: 24px; margin-top: 18px; }
.composition-layout svg { display: block; max-width: 100%; height: auto; }
.composition-legend { list-style: decimal; margin: 0; padding-inline-start: 22px; min-width: 0; }
.composition-legend li { position: relative; padding-inline-start: 20px; margin-block: 12px; font-size: 14px; line-height: 1.7; }
.composition-swatch { position: absolute; inset-inline-start: 0; top: .5em; width: 10px; height: 10px; border: 1px solid #172c39; }
.composition-legend strong { display: block; font-size: 19px; font-variant-numeric: tabular-nums; }
.composition-chart .composition-note { margin-top: 16px; font-size: 13px; line-height: 1.8; color: #52615b; }
@media (max-width: 560px) {
  .composition-chart { padding: 16px; }
  .composition-layout { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .composition-layout svg { width: 140px; margin-inline: auto; }
}
@media (forced-colors: active) {
  .composition-chart { border-color: CanvasText; background: Canvas; color: CanvasText; }
  .composition-chart figcaption > span, .composition-chart .composition-note { color: CanvasText; }
  .composition-layout svg, .composition-swatch { display: none; }
  .composition-layout { grid-template-columns: minmax(0, 1fr); }
  .composition-legend li { padding-inline-start: 0; }
}
@media print {
  .composition-chart { break-inside: avoid; background: white; }
  .composition-layout svg { print-color-adjust: exact; }
}

/* Reading flow and equivalent treatment of comparable groups. */
.inline-icon{display:inline-block;width:1em;height:1em;vertical-align:-.15em;flex-shrink:0}.diagonal-back{transform:rotate(180deg)}
.bar-row:first-child .bar-fill{background:var(--bar-green)}
.story-content{padding-top:0}.story-art{height:136px;min-height:136px;margin-block:12px;flex-shrink:0}.story-card .story-summary{margin-top:4px}.story-card h3{margin-block:8px 4px}
.story-art .art-number{font-size:clamp(30px,3.6vw,48px)}.story-art .art-number.long-number{font-size:clamp(25px,2.6vw,34px)}
.chart-context-details{font-size:14px;border-top:1px solid var(--line);padding-top:8px;margin-top:18px}.chart-context-details>summary{min-height:44px;display:flex;align-items:center;font-weight:600}
.search-input-row{flex-wrap:wrap}.search-input-row input{flex:1 1 220px}#search-result-count{font-size:15px;font-weight:600;line-height:1.6;color:var(--ink)}
@media(max-width:440px){.story-art{min-height:136px;height:136px;padding:16px;gap:8px}.story-art .art-number{font-size:36px}.story-art .art-number.long-number{font-size:27px}.search-input-row .button{flex:1 1 auto}.chart-card{padding-inline:18px}.bar-row{grid-template-columns:minmax(0,1fr);gap:30px}.chart-axis{margin-inline-start:0}.bar-value{font-size:13px}}

.article-inline-data>summary{min-height:48px;display:flex;align-items:center;font-weight:700;cursor:pointer;border-block:1px solid #89968c;padding:10px 0;margin-top:24px}.article-chart{margin-block:28px;padding-block:8px;border-bottom:1px solid #b5beb3}.article-chart h2,.article-chart h3{font-size:22px;line-height:1.4;margin-bottom:10px}.inline-chart-meta,.inline-chart-scale,.inline-chart-limit,.inline-chart-sources{font-size:14px;line-height:1.8;margin-block:14px}.inline-bars{list-style:none;padding:0;margin:24px 0;display:grid;gap:18px}.inline-bars li>div{display:flex;justify-content:space-between;align-items:baseline;gap:18px;flex-wrap:wrap}.inline-bars strong{font-variant-numeric:tabular-nums}.inline-bar-track{display:block;height:16px;background:#e0e6dd;margin-top:6px;border:1px solid #89968c}.inline-bar-track>span{display:block;height:100%;background:#607969}.inline-chart-sources a{text-decoration:underline;overflow-wrap:anywhere}.article-chart .table-scroll{margin-top:18px}.article-chart .reading-context{font-size:14px}.article-inline-data .chart-finding{font-size:15px}@media(forced-colors:active){.inline-bar-track{border-color:CanvasText}.inline-bar-track>span{background:CanvasText;forced-color-adjust:none}}

.composition-layout svg{width:160px;max-width:100%;height:auto}.table-hint{display:none}.article-chart table{min-inline-size:32rem}.article-chart td bdi{white-space:nowrap}.quick-source a,.chart-source a,.update-note a,.inline-chart-sources a{display:inline-flex;align-items:center;min-height:44px;max-width:100%}
@media(max-width:700px){.table-hint{display:block;font-size:13px;line-height:1.7;color:inherit;margin-block:8px}}
@media(max-width:560px){.composition-layout svg{width:140px}}