/* ===========================================================================
   Theme — Report 2026-48, "The Global Climate–Pollution Risk Atlas"

   Aesthetic: bivariate cartogram. The masthead is a tile cartogram of 157
   countries placed by two scores at once — pollution exposure across,
   climate hazard upward — each tile coloured on a three-by-three bivariate
   scale (teal for hazard, red for pollution, deep slate where both are high),
   sized by population and made more opaque where coping capacity is weakest
   (inline SVG data URI) on a dusk-violet field. Below it the page is warm
   paper with a fine bivariate legend motif. Hazard is teal, pollution red,
   weak coping slate-plum and co-benefit opportunity amber; every h2 opens with
   a tiny 2×2 bivariate key. Parkinsans for display, Reddit Sans for prose,
   Cascadia Mono for figures.

   Loaded after report.css; report.js reads these tokens for chart colours,
   and charts.js reads the --b, --x and --i tokens so no hex lives in the script.
   =========================================================================== */

:root {
  --bg: #f5f3ef;
  --bg-card: #fffdf9;
  --bg-accent: #ebe6df;
  --bg-dark: #1c1a24;
  --bg-dark-2: #121018;

  --text: #1b1a21;
  --text-secondary: #403d4a;
  --text-muted: #757080;
  --text-inverse: #f3f0f6;

  --primary: #2a2340;
  --primary-light: #4e7f92;
  --accent: #c85a5a;
  --accent-light: #f2a6a6;

  --border: #ddd6cc;
  --border-light: #ece6dd;
  --rule: #c8bfb2;

  /* bivariate 3x3: hazard (rows) x pollution (cols) */
  --b00: #e8e8e8; --b01: #e4acac; --b02: #c85a5a;
  --b10: #b0d5df; --b11: #ad9ea5; --b12: #985356;
  --b20: #64acbe; --b21: #627f8c; --b22: #574249;
  /* single dimensions */
  --x-haz: #4e9bb0;
  --x-pol: #c85a5a;
  --x-cope: #5b4a6e;
  --x-opp: #d9a12b;
  --x-heat: #e07b39;
  --x-water: #3f7fae;
  --x-smoke: #8c6d5a;
  /* income */
  --i-lic: #574249;
  --i-lmc: #c85a5a;
  --i-umc: #d9a12b;
  --i-hic: #4e9bb0;
  --i-muted: #d8d1c6;

  --chart-blue: #2b6cb0;
  --chart-blue-light: #9cc7e6;
  --chart-gold: #e0a020;
  --chart-red: #e2574c;
  --chart-teal: #1fb58f;
  --chart-gray: #8a91ab;
  --chart-orange: #f0883a;
  --chart-purple: #7b5ce0;

  --serif: "Parkinsans", "Avenir Next", system-ui, sans-serif;
  --sans: "Reddit Sans", -apple-system, BlinkMacSystemFont, "system-ui", "Segoe UI", sans-serif;
  --mono: "Cascadia Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --biv: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='330' viewBox='0 0 900 330'%3E%3Cline x1='110.0' y1='12.0' x2='110.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='129.5' y1='12.0' x2='129.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='149.0' y1='12.0' x2='149.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='168.5' y1='12.0' x2='168.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='188.0' y1='12.0' x2='188.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='207.5' y1='12.0' x2='207.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='227.0' y1='12.0' x2='227.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='246.5' y1='12.0' x2='246.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='266.0' y1='12.0' x2='266.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='285.5' y1='12.0' x2='285.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='305.0' y1='12.0' x2='305.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='324.5' y1='12.0' x2='324.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='344.0' y1='12.0' x2='344.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='363.5' y1='12.0' x2='363.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='383.0' y1='12.0' x2='383.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='402.5' y1='12.0' x2='402.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='422.0' y1='12.0' x2='422.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='441.5' y1='12.0' x2='441.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='461.0' y1='12.0' x2='461.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='480.5' y1='12.0' x2='480.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='500.0' y1='12.0' x2='500.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='519.5' y1='12.0' x2='519.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='539.0' y1='12.0' x2='539.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='558.5' y1='12.0' x2='558.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='578.0' y1='12.0' x2='578.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='597.5' y1='12.0' x2='597.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='617.0' y1='12.0' x2='617.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='636.5' y1='12.0' x2='636.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='656.0' y1='12.0' x2='656.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='675.5' y1='12.0' x2='675.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='695.0' y1='12.0' x2='695.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='714.5' y1='12.0' x2='714.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='734.0' y1='12.0' x2='734.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='753.5' y1='12.0' x2='753.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='773.0' y1='12.0' x2='773.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='792.5' y1='12.0' x2='792.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='812.0' y1='12.0' x2='812.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='831.5' y1='12.0' x2='831.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='851.0' y1='12.0' x2='851.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='870.5' y1='12.0' x2='870.5' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Cline x1='890.0' y1='12.0' x2='890.0' y2='304.5' stroke='%23ffffff' stroke-opacity='0.05'/%3E%3Crect x='696.8' y='33.2' width='16.0' height='16.0' rx='2' fill='%23574249' fill-opacity='0.74'/%3E%3Ctext x='704.8' y='43.5' font-family='monospace' font-size='6.5' fill='%23111' text-anchor='middle'%3EIND%3C/text%3E%3Crect x='599.2' y='52.8' width='16.0' height='16.0' rx='2' fill='%23627f8c' fill-opacity='0.66'/%3E%3Ctext x='607.2' y='63.0' font-family='monospace' font-size='6.5' fill='%23111' text-anchor='middle'%3ECHN%3C/text%3E%3Crect x='131.2' y='91.8' width='16.0' height='16.0' rx='2' fill='%2364acbe' fill-opacity='0.60'/%3E%3Ctext x='139.2' y='102.0' font-family='monospace' font-size='6.5' fill='%23111' text-anchor='middle'%3EUSA%3C/text%3E%3Crect x='482.4' y='91.9' width='15.7' height='15.7' rx='2' fill='%23627f8c' fill-opacity='0.74'/%3E%3Ctext x='490.2' y='102.0' font-family='monospace' font-size='6.5' fill='%23111' text-anchor='middle'%3EIDN%3C/text%3E%3Crect x='755.7' y='14.2' width='15.1' height='15.1' rx='2' fill='%23574249' fill-opacity='0.84'/%3E%3Ctext x='763.2' y='23.9' font-family='monospace' font-size='6.5' fill='%23111' text-anchor='middle'%3EPAK%3C/text%3E%3Crect x='794.9' y='53.4' width='14.8' height='14.8' rx='2' fill='%23574249' fill-opacity='0.96'/%3E%3Ctext x='802.2' y='63.0' font-family='monospace' font-size='6.5' fill='%23111' text-anchor='middle'%3ENGA%3C/text%3E%3Crect x='346.6' y='131.6' width='14.3' height='14.3' rx='2' fill='%23b0d5df' fill-opacity='0.71'/%3E%3Ctext x='353.8' y='140.9' font-family='monospace' font-size='6.5' fill='%23111' text-anchor='middle'%3EBRA%3C/text%3E%3Crect x='795.5' y='15.0' width='13.4' height='13.4' rx='2' fill='%23574249' fill-opacity='0.77'/%3E%3Ctext x='802.2' y='23.9' font-family='monospace' font-size='6.5' fill='%23111' text-anchor='middle'%3EBGD%3C/text%3E%3Crect x='191.4' y='171.4' width='12.6' height='12.6' rx='2' fill='%23b0d5df' fill-opacity='0.65'/%3E%3Crect x='640.1' y='171.6' width='12.4' height='12.4' rx='2' fill='%23985356' fill-opacity='0.92'/%3E%3Crect x='484.1' y='74.1' width='12.3' height='12.3' rx='2' fill='%23627f8c' fill-opacity='0.71'/%3E%3Crect x='152.7' y='74.2' width='12.1' height='12.1' rx='2' fill='%2364acbe' fill-opacity='0.55'/%3E%3Crect x='464.8' y='54.8' width='11.9' height='11.9' rx='2' fill='%23627f8c' fill-opacity='0.75'/%3E%3Crect x='562.3' y='54.8' width='11.9' height='11.9' rx='2' fill='%23627f8c' fill-opacity='0.73'/%3E%3Crect x='815.9' y='152.4' width='11.7' height='11.7' rx='2' fill='%23985356' fill-opacity='0.99'/%3E%3Crect x='562.5' y='35.5' width='11.4' height='11.4' rx='2' fill='%23627f8c' fill-opacity='0.78'/%3E%3Crect x='523.7' y='94.2' width='11.1' height='11.1' rx='2' fill='%23627f8c' fill-opacity='0.84'/%3E%3Crect x='484.8' y='191.8' width='10.9' height='10.9' rx='2' fill='%23ad9ea5' fill-opacity='0.78'/%3E%3Crect x='133.8' y='191.8' width='10.8' height='10.8' rx='2' fill='%23b0d5df' fill-opacity='0.56'/%3E%3Crect x='543.6' y='16.6' width='10.4' height='10.4' rx='2' fill='%23627f8c' fill-opacity='0.74'/%3E%3Crect x='680.1' y='211.6' width='10.3' height='10.3' rx='2' fill='%23c85a5a' fill-opacity='0.89'/%3E%3Crect x='134.1' y='133.6' width='10.3' height='10.3' rx='2' fill='%23b0d5df' fill-opacity='0.57'/%3E%3Crect x='114.6' y='192.1' width='10.3' height='10.3' rx='2' fill='%23b0d5df' fill-opacity='0.60'/%3E%3Crect x='543.7' y='133.7' width='10.1' height='10.1' rx='2' fill='%23ad9ea5' fill-opacity='0.82'/%3E%3Crect x='309.8' y='172.8' width='9.9' height='9.9' rx='2' fill='%23b0d5df' fill-opacity='0.70'/%3E%3Crect x='621.8' y='133.8' width='9.8' height='9.8' rx='2' fill='%23ad9ea5' fill-opacity='0.84'/%3E%3Crect x='680.4' y='36.4' width='9.7' height='9.7' rx='2' fill='%23574249' fill-opacity='0.86'/%3E%3Crect x='407.4' y='94.9' width='9.6' height='9.6' rx='2' fill='%23627f8c' fill-opacity='0.66'/%3E%3Crect x='310.0' y='95.0' width='9.6' height='9.6' rx='2' fill='%2364acbe' fill-opacity='0.56'/%3E%3Crect x='661.0' y='56.0' width='9.6' height='9.6' rx='2' fill='%23574249' fill-opacity='0.98'/%3E%3Crect x='797.5' y='212.0' width='9.6' height='9.6' rx='2' fill='%23c85a5a' fill-opacity='0.91'/%3E%3Crect x='290.5' y='192.5' width='9.5' height='9.5' rx='2' fill='%23b0d5df' fill-opacity='0.61'/%3E%3Crect x='212.6' y='173.1' width='9.4' height='9.4' rx='2' fill='%23b0d5df' fill-opacity='0.77'/%3E%3Crect x='563.6' y='17.1' width='9.4' height='9.4' rx='2' fill='%23627f8c' fill-opacity='0.81'/%3E%3Crect x='212.6' y='114.6' width='9.3' height='9.3' rx='2' fill='%23b0d5df' fill-opacity='0.73'/%3E%3Crect x='758.6' y='75.6' width='9.2' height='9.2' rx='2' fill='%23574249' fill-opacity='0.97'/%3E%3Crect x='700.2' y='114.7' width='9.1' height='9.1' rx='2' fill='%23985356' fill-opacity='0.93'/%3E%3Crect x='115.2' y='212.2' width='9.1' height='9.1' rx='2' fill='%23e8e8e8' fill-opacity='0.59'/%3E%3Crect x='622.3' y='251.3' width='9.0' height='9.0' rx='2' fill='%23e4acac' fill-opacity='0.93'/%3E%3Crect x='349.3' y='251.3' width='9.0' height='9.0' rx='2' fill='%23e8e8e8' fill-opacity='0.73'/%3E%3Crect x='407.8' y='153.8' width='8.9' height='8.9' rx='2' fill='%23ad9ea5' fill-opacity='0.73'/%3E%3Crect x='563.8' y='95.3' width='8.9' height='8.9' rx='2' fill='%23627f8c' fill-opacity='0.70'/%3E%3Crect x='485.8' y='153.8' width='8.9' height='8.9' rx='2' fill='%23ad9ea5' fill-opacity='0.62'/%3E%3Crect x='329.8' y='251.3' width='8.8' height='8.8' rx='2' fill='%23e8e8e8' fill-opacity='0.60'/%3E%3Crect x='232.3' y='114.8' width='8.8' height='8.8' rx='2' fill='%23b0d5df' fill-opacity='0.69'/%3E%3Crect x='602.9' y='114.9' width='8.8' height='8.8' rx='2' fill='%23ad9ea5' fill-opacity='0.93'/%3E%3Crect x='680.9' y='153.9' width='8.8' height='8.8' rx='2' fill='%23985356' fill-opacity='0.84'/%3E%3Crect x='544.4' y='153.9' width='8.7' height='8.7' rx='2' fill='%23ad9ea5' fill-opacity='0.72'/%3E%3Crect x='524.9' y='153.9' width='8.6' height='8.6' rx='2' fill='%23ad9ea5' fill-opacity='0.98'/%3E%3Crect x='563.9' y='173.4' width='8.6' height='8.6' rx='2' fill='%23ad9ea5' fill-opacity='0.90'/%3E%3Crect x='778.5' y='115.0' width='8.5' height='8.5' rx='2' fill='%23985356' fill-opacity='0.91'/%3E%3Crect x='739.5' y='95.5' width='8.5' height='8.5' rx='2' fill='%23574249' fill-opacity='0.87'/%3E%3Crect x='427.6' y='115.1' width='8.4' height='8.4' rx='2' fill='%23ad9ea5' fill-opacity='0.93'/%3E%3Crect x='817.6' y='115.1' width='8.4' height='8.4' rx='2' fill='%23985356' fill-opacity='0.99'/%3E%3Crect x='115.6' y='134.6' width='8.3' height='8.3' rx='2' fill='%23b0d5df' fill-opacity='0.61'/%3E%3Crect x='622.6' y='173.6' width='8.3' height='8.3' rx='2' fill='%23985356' fill-opacity='0.88'/%3E%3Crect x='544.6' y='76.1' width='8.2' height='8.2' rx='2' fill='%23627f8c' fill-opacity='0.93'/%3E%3Crect x='759.2' y='56.7' width='8.2' height='8.2' rx='2' fill='%23574249' fill-opacity='0.93'/%3E%3Crect x='739.7' y='134.7' width='8.1' height='8.1' rx='2' fill='%23985356' fill-opacity='0.93'/%3E%3Crect x='681.3' y='173.8' width='8.0' height='8.0' rx='2' fill='%23985356' fill-opacity='0.88'/%3E%3Crect x='681.3' y='232.3' width='8.0' height='8.0' rx='2' fill='%23c85a5a' fill-opacity='0.93'/%3E%3Crect x='603.3' y='173.8' width='8.0' height='8.0' rx='2' fill='%23ad9ea5' fill-opacity='0.75'/%3E%3Crect x='778.8' y='76.3' width='7.9' height='7.9' rx='2' fill='%23574249' fill-opacity='0.99'/%3E%3Crect x='388.8' y='134.8' width='7.9' height='7.9' rx='2' fill='%23ad9ea5' fill-opacity='0.67'/%3E%3Crect x='486.3' y='271.3' width='7.8' height='7.8' rx='2' fill='%23e4acac' fill-opacity='0.61'/%3E%3Crect x='525.3' y='56.8' width='7.8' height='7.8' rx='2' fill='%23627f8c' fill-opacity='0.95'/%3E%3Crect x='349.9' y='232.4' width='7.8' height='7.8' rx='2' fill='%23e8e8e8' fill-opacity='0.65'/%3E%3Crect x='720.4' y='95.9' width='7.8' height='7.8' rx='2' fill='%23574249' fill-opacity='0.83'/%3E%3Crect x='642.4' y='154.4' width='7.7' height='7.7' rx='2' fill='%23985356' fill-opacity='0.80'/%3E%3Crect x='427.9' y='173.9' width='7.7' height='7.7' rx='2' fill='%23ad9ea5' fill-opacity='0.82'/%3E%3Crect x='135.4' y='154.4' width='7.7' height='7.7' rx='2' fill='%23b0d5df' fill-opacity='0.59'/%3E%3Crect x='525.4' y='37.4' width='7.7' height='7.7' rx='2' fill='%23627f8c' fill-opacity='0.85'/%3E%3Crect x='583.9' y='115.4' width='7.6' height='7.6' rx='2' fill='%23ad9ea5' fill-opacity='0.87'/%3E%3Crect x='701.0' y='174.0' width='7.5' height='7.5' rx='2' fill='%23985356' fill-opacity='0.90'/%3E%3Crect x='779.0' y='96.0' width='7.4' height='7.4' rx='2' fill='%23574249' fill-opacity='0.96'/%3E%3Crect x='818.0' y='291.0' width='7.4' height='7.4' rx='2' fill='%23c85a5a' fill-opacity='0.81'/%3E%3Crect x='837.5' y='291.0' width='7.4' height='7.4' rx='2' fill='%23c85a5a' fill-opacity='0.89'/%3E%3Crect x='662.1' y='96.1' width='7.3' height='7.3' rx='2' fill='%23574249' fill-opacity='0.83'/%3E%3Crect x='291.6' y='115.6' width='7.2' height='7.2' rx='2' fill='%23b0d5df' fill-opacity='0.79'/%3E%3Crect x='701.1' y='96.1' width='7.2' height='7.2' rx='2' fill='%23574249' fill-opacity='1.00'/%3E%3Crect x='135.7' y='174.2' width='7.2' height='7.2' rx='2' fill='%23b0d5df' fill-opacity='0.67'/%3E%3Crect x='545.2' y='96.2' width='7.2' height='7.2' rx='2' fill='%23627f8c' fill-opacity='0.96'/%3E%3Crect x='389.2' y='154.7' width='7.2' height='7.2' rx='2' fill='%23ad9ea5' fill-opacity='0.69'/%3E%3Crect x='369.7' y='76.7' width='7.2' height='7.2' rx='2' fill='%2364acbe' fill-opacity='0.77'/%3E%3Crect x='584.2' y='37.7' width='7.2' height='7.2' rx='2' fill='%23627f8c' fill-opacity='0.67'/%3E%3Crect x='662.2' y='174.2' width='7.1' height='7.1' rx='2' fill='%23985356' fill-opacity='0.87'/%3E%3Crect x='291.7' y='96.2' width='7.1' height='7.1' rx='2' fill='%2364acbe' fill-opacity='0.75'/%3E%3Crect x='252.7' y='252.2' width='7.1' height='7.1' rx='2' fill='%23e8e8e8' fill-opacity='0.57'/%3E%3Crect x='233.2' y='291.2' width='7.1' height='7.1' rx='2' fill='%23e8e8e8' fill-opacity='0.58'/%3E%3Crect x='642.7' y='135.2' width='7.1' height='7.1' rx='2' fill='%23985356' fill-opacity='0.79'/%3E%3Crect x='486.7' y='174.2' width='7.1' height='7.1' rx='2' fill='%23ad9ea5' fill-opacity='0.93'/%3E%3Crect x='116.2' y='232.7' width='7.1' height='7.1' rx='2' fill='%23e8e8e8' fill-opacity='0.71'/%3E%3Crect x='213.7' y='232.7' width='7.0' height='7.0' rx='2' fill='%23e8e8e8' fill-opacity='0.66'/%3E%3Crect x='428.2' y='154.7' width='7.0' height='7.0' rx='2' fill='%23ad9ea5' fill-opacity='0.79'/%3E%3Crect x='272.2' y='193.7' width='7.0' height='7.0' rx='2' fill='%23b0d5df' fill-opacity='0.60'/%3E%3Crect x='291.8' y='213.3' width='7.0' height='7.0' rx='2' fill='%23e8e8e8' fill-opacity='0.64'/%3E%3Crect x='311.3' y='213.3' width='6.9' height='6.9' rx='2' fill='%23e8e8e8' fill-opacity='0.65'/%3E%3Crect x='135.8' y='252.3' width='6.9' height='6.9' rx='2' fill='%23e8e8e8' fill-opacity='0.57'/%3E%3Crect x='194.3' y='252.3' width='6.9' height='6.9' rx='2' fill='%23e8e8e8' fill-opacity='0.66'/%3E%3Crect x='642.8' y='193.8' width='6.9' height='6.9' rx='2' fill='%23985356' fill-opacity='0.93'/%3E%3Crect x='720.8' y='174.3' width='6.9' height='6.9' rx='2' fill='%23985356' fill-opacity='0.88'/%3E%3Crect x='701.4' y='76.9' width='6.8' height='6.8' rx='2' fill='%23574249' fill-opacity='0.86'/%3E%3Crect x='389.4' y='76.9' width='6.8' height='6.8' rx='2' fill='%23627f8c' fill-opacity='0.82'/%3E%3Crect x='428.4' y='193.9' width='6.7' height='6.7' rx='2' fill='%23ad9ea5' fill-opacity='0.90'/%3E%3Crect x='486.9' y='232.9' width='6.7' height='6.7' rx='2' fill='%23e4acac' fill-opacity='0.75'/%3E%3Crect x='525.9' y='135.4' width='6.7' height='6.7' rx='2' fill='%23ad9ea5' fill-opacity='0.80'/%3E%3Crect x='545.4' y='193.9' width='6.7' height='6.7' rx='2' fill='%23ad9ea5' fill-opacity='0.91'/%3E%3Crect x='467.4' y='193.9' width='6.6' height='6.6' rx='2' fill='%23ad9ea5' fill-opacity='0.78'/%3E%3Crect x='720.9' y='135.4' width='6.6' height='6.6' rx='2' fill='%23985356' fill-opacity='0.95'/%3E%3Crect x='428.4' y='271.9' width='6.6' height='6.6' rx='2' fill='%23e4acac' fill-opacity='0.66'/%3E%3Crect x='564.9' y='193.9' width='6.6' height='6.6' rx='2' fill='%23ad9ea5' fill-opacity='0.72'/%3E%3Crect x='175.0' y='194.0' width='6.6' height='6.6' rx='2' fill='%23b0d5df' fill-opacity='0.55'/%3E%3Crect x='136.0' y='213.5' width='6.6' height='6.6' rx='2' fill='%23e8e8e8' fill-opacity='0.55'/%3E%3Crect x='565.0' y='252.5' width='6.5' height='6.5' rx='2' fill='%23e4acac' fill-opacity='0.85'/%3E%3Crect x='623.5' y='155.0' width='6.5' height='6.5' rx='2' fill='%23985356' fill-opacity='0.95'/%3E%3Crect x='116.5' y='252.5' width='6.5' height='6.5' rx='2' fill='%23e8e8e8' fill-opacity='0.59'/%3E%3Crect x='136.0' y='233.0' width='6.5' height='6.5' rx='2' fill='%23e8e8e8' fill-opacity='0.57'/%3E%3Crect x='799.0' y='174.5' width='6.5' height='6.5' rx='2' fill='%23985356' fill-opacity='1.00'/%3E%3Crect x='409.0' y='116.0' width='6.5' height='6.5' rx='2' fill='%23ad9ea5' fill-opacity='0.67'/%3E%3Crect x='116.5' y='272.0' width='6.5' height='6.5' rx='2' fill='%23e8e8e8' fill-opacity='0.67'/%3E%3Crect x='272.5' y='213.5' width='6.5' height='6.5' rx='2' fill='%23e8e8e8' fill-opacity='0.77'/%3E%3Crect x='545.5' y='213.5' width='6.5' height='6.5' rx='2' fill='%23e4acac' fill-opacity='0.84'/%3E%3Crect x='214.0' y='291.5' width='6.5' height='6.5' rx='2' fill='%23e8e8e8' fill-opacity='0.57'/%3E%3Crect x='662.5' y='38.0' width='6.5' height='6.5' rx='2' fill='%23574249' fill-opacity='0.91'/%3E%3Crect x='428.5' y='233.0' width='6.4' height='6.4' rx='2' fill='%23e4acac' fill-opacity='0.61'/%3E%3Crect x='487.0' y='135.5' width='6.4' height='6.4' rx='2' fill='%23ad9ea5' fill-opacity='0.75'/%3E%3Crect x='389.6' y='174.6' width='6.4' height='6.4' rx='2' fill='%23ad9ea5' fill-opacity='0.84'/%3E%3Crect x='487.1' y='213.6' width='6.3' height='6.3' rx='2' fill='%23ad9ea5' fill-opacity='0.61'/%3E%3Crect x='350.6' y='174.6' width='6.3' height='6.3' rx='2' fill='%23b0d5df' fill-opacity='0.65'/%3E%3Crect x='662.6' y='116.1' width='6.2' height='6.2' rx='2' fill='%23985356' fill-opacity='0.99'/%3E%3Crect x='701.7' y='213.7' width='6.2' height='6.2' rx='2' fill='%23c85a5a' fill-opacity='0.72'/%3E%3Crect x='253.2' y='233.2' width='6.2' height='6.2' rx='2' fill='%23e8e8e8' fill-opacity='0.69'/%3E%3Crect x='584.7' y='213.7' width='6.1' height='6.1' rx='2' fill='%23e4acac' fill-opacity='0.80'/%3E%3Crect x='506.7' y='174.7' width='6.1' height='6.1' rx='2' fill='%23ad9ea5' fill-opacity='0.79'/%3E%3Crect x='467.7' y='272.2' width='6.1' height='6.1' rx='2' fill='%23e4acac' fill-opacity='0.63'/%3E%3Crect x='506.7' y='135.7' width='6.1' height='6.1' rx='2' fill='%23ad9ea5' fill-opacity='0.56'/%3E%3Crect x='233.7' y='252.7' width='6.1' height='6.1' rx='2' fill='%23e8e8e8' fill-opacity='0.61'/%3E%3Crect x='448.2' y='116.2' width='6.1' height='6.1' rx='2' fill='%23ad9ea5' fill-opacity='0.72'/%3E%3Crect x='799.2' y='155.2' width='6.1' height='6.1' rx='2' fill='%23985356' fill-opacity='0.88'/%3E%3Crect x='584.7' y='194.2' width='6.0' height='6.0' rx='2' fill='%23ad9ea5' fill-opacity='0.87'/%3E%3Crect x='487.2' y='252.7' width='6.0' height='6.0' rx='2' fill='%23e4acac' fill-opacity='0.81'/%3E%3Crect x='604.3' y='233.3' width='6.0' height='6.0' rx='2' fill='%23e4acac' fill-opacity='0.88'/%3E%3Crect x='311.8' y='252.8' width='6.0' height='6.0' rx='2' fill='%23e8e8e8' fill-opacity='0.82'/%3E%3Crect x='467.8' y='155.3' width='6.0' height='6.0' rx='2' fill='%23ad9ea5' fill-opacity='0.70'/%3E%3Crect x='740.8' y='174.8' width='6.0' height='6.0' rx='2' fill='%23985356' fill-opacity='0.98'/%3E%3Crect x='331.3' y='272.3' width='5.9' height='5.9' rx='2' fill='%23e8e8e8' fill-opacity='0.63'/%3E%3Crect x='701.8' y='233.3' width='5.9' height='5.9' rx='2' fill='%23c85a5a' fill-opacity='0.97'/%3E%3Crect x='389.8' y='233.3' width='5.9' height='5.9' rx='2' fill='%23e4acac' fill-opacity='0.63'/%3E%3Crect x='526.3' y='291.8' width='5.9' height='5.9' rx='2' fill='%23e4acac' fill-opacity='0.75'/%3E%3Crect x='467.8' y='116.3' width='5.8' height='5.8' rx='2' fill='%23ad9ea5' fill-opacity='0.71'/%3E%3Crect x='467.9' y='252.9' width='5.8' height='5.8' rx='2' fill='%23e4acac' fill-opacity='0.85'/%3E%3Crect x='331.4' y='213.9' width='5.7' height='5.7' rx='2' fill='%23e8e8e8' fill-opacity='0.62'/%3E%3Crect x='194.9' y='194.4' width='5.7' height='5.7' rx='2' fill='%23b0d5df' fill-opacity='0.66'/%3E%3Crect x='272.9' y='272.4' width='5.7' height='5.7' rx='2' fill='%23e8e8e8' fill-opacity='0.57'/%3E%3Crect x='545.9' y='233.4' width='5.7' height='5.7' rx='2' fill='%23e4acac' fill-opacity='0.80'/%3E%3Crect x='253.4' y='194.4' width='5.7' height='5.7' rx='2' fill='%23b0d5df' fill-opacity='0.62'/%3E%3Crect x='682.4' y='57.9' width='5.7' height='5.7' rx='2' fill='%23574249' fill-opacity='0.89'/%3E%3C/svg%3E");
  --ramp: linear-gradient(90deg, var(--b20), var(--b11), var(--b02), var(--b22));

  --max-width: 1200px;
}

body { font-size: 1rem; line-height: 1.66; background-image: linear-gradient(135deg, rgba(100, 172, 190, 0.05), transparent 40%, rgba(200, 90, 90, 0.05)); }

::selection { background: rgba(200, 90, 90, 0.18); }
:where(a, button, [tabindex], input, select):focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

a { color: var(--primary-light); }
a:hover { color: var(--accent); }

.progress__bar { background: var(--ramp); }
.skip-link { background: var(--primary); }

/* --- masthead: the signal bars -------------------------------------------------- */

.masthead {
  position: relative;
  color: var(--text-inverse);
  border-bottom: 0;
  padding: 3.3rem var(--gutter) 4.2rem;
  background:
    linear-gradient(90deg, rgba(18, 16, 24, 0.97) 0 36%, rgba(18, 16, 24, 0.7) 54%, rgba(18, 16, 24, 0.06) 82%),
    var(--biv) right center / 900px auto no-repeat,
    radial-gradient(ellipse at 78% 40%, #2c2638, transparent 70%),
    linear-gradient(180deg, #221f2c, #121018);
}
.masthead::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 6px; background: var(--ramp); }
.masthead .overline { font-family: var(--mono); font-size: 0.74rem; letter-spacing: 0.1em; color: var(--accent-light); margin-bottom: 1rem; }
.masthead .overline::before { content: "HAZARD ↑ · POLLUTION → · "; color: #fff; }
.masthead h1 { font-family: var(--serif); font-weight: 700; font-size: clamp(2.1rem, 4.8vw, 3.5rem); line-height: 1.06; letter-spacing: -0.005em; max-width: 22ch; color: #fff; }
.masthead .subtitle { font-family: var(--sans); font-weight: 500; font-size: 1.2rem; color: #ddd6e8; max-width: 56ch; }
.masthead .strapline { font-family: var(--sans); font-style: normal; font-size: 1.02rem; color: #f1edf6; border-left: 4px solid var(--b22); max-width: 64ch; background: rgba(18, 16, 24, 0.74); }
.masthead .meta-row { border-top: 1px solid rgba(255, 255, 255, 0.16); color: #bcb4c9; font-family: var(--mono); font-size: 0.78rem; position: relative; }
.masthead .meta-row strong { color: var(--accent-light); font-family: var(--mono); font-weight: 700; font-size: 0.66rem; letter-spacing: 0.1em; }

/* --- nav --------------------------------------------------------------------- */

.sticky-nav { background: rgba(245, 243, 239, 0.96); border-bottom: 1px solid var(--border); }
.nav-inner a { color: var(--text-muted); font-family: var(--mono); font-size: 0.76rem; }
.nav-inner a:hover { color: var(--text); }
.nav-inner a.is-active { color: var(--primary); border-bottom-color: var(--accent); }

/* --- headings with a signal glyph ------------------------------------------------ */

section > h2 {
  position: relative;
  font-family: var(--serif);
  font-weight: 700;
  font-size: clamp(1.8rem, 3.8vw, 2.4rem);
  letter-spacing: -0.012em;
  line-height: 1.1;
  color: var(--primary);
  border-bottom: 1px solid var(--rule);
  padding: 0 0 0.55rem 1.9rem;
}
section > h2::before {
  content: "";
  position: absolute; left: 0.1rem; top: 0.32em;
  width: 0.95rem; height: 0.95rem;
  background:
    linear-gradient(var(--b20), var(--b20)) 0 0 / 50% 50% no-repeat,
    linear-gradient(var(--b22), var(--b22)) 100% 0 / 50% 50% no-repeat,
    linear-gradient(var(--b00), var(--b00)) 0 100% / 50% 50% no-repeat,
    linear-gradient(var(--b02), var(--b02)) 100% 100% / 50% 50% no-repeat;
  box-shadow: 0 0 0 1px var(--text);
}
.abstract h2, .endmatter h2 { padding-left: 0; border-bottom: 0; font-family: var(--mono); font-size: 0.86rem; }
.abstract h2::before, .endmatter h2::before { content: none; }
section > .section-dek { font-family: var(--sans); font-style: normal; font-weight: 500; color: var(--text-muted); font-size: 1.15rem; line-height: 1.45; max-width: none; }

.section-rule { border-top: 1px solid var(--border-light); margin: 2.6rem 0 2.8rem; }

/* --- abstract, endmatter ------------------------------------------------------------- */

.abstract { background: var(--bg-card); border: 1px solid var(--border); border-top: 6px solid transparent; border-image: var(--ramp) 1; border-radius: 0; }
.abstract h2 { color: var(--primary); letter-spacing: 0.12em; }
.endmatter .kw { background: var(--bg-accent); border-color: var(--border); font-family: var(--mono); font-size: 0.72rem; }
.endmatter dt { font-family: var(--mono); font-size: 0.72rem; }

/* --- KPI board ------------------------------------------------------------------------- */

.kpi-board { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 1.6rem 0; }
.kpi { position: relative; background: var(--bg-card); border: 1px solid var(--border); border-radius: 2px; padding: 1.15rem 1.05rem 0.85rem; display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
.kpi::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--k, var(--accent)); }

.kpi--haz { --k: var(--x-haz); }
.kpi--pol { --k: var(--x-pol); }
.kpi--both { --k: var(--b22); }
.kpi--opp { --k: var(--x-opp); }
.kpi--smoke { --k: var(--x-smoke); }
.kpi-value { font-family: var(--serif); font-weight: 800; font-size: clamp(1.8rem, 3.2vw, 2.35rem); letter-spacing: -0.02em; line-height: 1; color: var(--text); font-variant-numeric: lining-nums tabular-nums; }
.kpi-label { font-size: 0.86rem; line-height: 1.42; color: var(--text-secondary); margin-top: 0.45rem; flex: 1; }
.kpi-source { font-family: var(--mono); font-size: 0.66rem; color: var(--text-muted); margin-top: 0.6rem; border-top: 1px solid var(--border-light); padding-top: 0.4rem; margin-bottom: 0.3rem; }

/* --- readout ----------------------------------------------------------------------------- */

.readout { background: var(--bg-dark); border-radius: 2px; padding: 1.15rem 1.4rem 0.45rem; margin: 1.6rem 0; position: relative; overflow: hidden; border-top: 6px solid transparent; border-image: var(--ramp) 1; }
.readout-title { font-family: var(--mono); font-size: 0.74rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--accent-light); margin: 0 0 0.4rem !important; }
.readout p { color: #e4dfec; text-align: justify; hyphens: auto; -webkit-hyphens: auto; position: relative; }
.readout strong { color: #fff; }

/* --- panels ------------------------------------------------------------------------------ */

.dash-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 1.2rem 0; }
.panel { background: var(--bg-card); border: 1px solid var(--border); border-radius: 2px; padding: 1.05rem 1.15rem 0.95rem; min-width: 0; }
.panel--wide { grid-column: 1 / -1; }
.panel--hero { margin: 1.2rem 0; padding: 1.15rem 1.25rem 1.05rem; border-top: 5px solid transparent; border-image: var(--ramp) 1; }
.panel-head { border-bottom: 1px solid var(--border-light); margin-bottom: 0.75rem; padding-bottom: 0.55rem; }
.panel-title { font-family: var(--serif); font-weight: 800; letter-spacing: -0.01em; font-size: 1.18rem; line-height: 1.2; color: var(--text); margin: 0 !important; }
.panel-meta { font-family: var(--mono); font-size: 0.7rem; color: var(--text-muted); margin: 0.25rem 0 0.4rem !important; }
.panel-note { font-size: 0.85rem; line-height: 1.5; color: var(--text-muted); margin: 0.6rem 0 0 !important; text-align: left !important; }
.panel canvas { max-width: 100%; }
.panel .chart-frame { height: 310px; }
.panel .chart-frame--tall { height: 440px; }
.panel .chart-frame--short { height: 240px; }

.stat-tile { background: var(--bg-card); border: 1px solid var(--border); border-radius: 2px; padding: 0.85rem 1rem; border-left: 6px solid var(--k, var(--accent)); min-width: 0; }
.stat-tile--hf { --k: var(--q-hf); }
.stat-tile--hc { --k: var(--q-hc); }
.stat-tile--lf { --k: var(--q-lf); }
.stat-tile--lc { --k: var(--q-lc); }
.stat-tile--haz { --k: var(--x-haz); }
.stat-tile--pol { --k: var(--x-pol); }
.stat-tile--both { --k: var(--b22); }
.stat-tile--opp { --k: var(--x-opp); }
.stat-tile-value { font-family: var(--serif); font-weight: 800; letter-spacing: -0.02em; font-size: 1.6rem; line-height: 1.05; color: var(--text); margin: 0 !important; font-variant-numeric: lining-nums tabular-nums; }
.stat-tile-label { font-size: 0.82rem; color: var(--text-muted); margin: 0.2rem 0 0 !important; text-align: left !important; line-height: 1.4; }
.tile-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 1rem 0; }

/* --- controls ------------------------------------------------------------------------------ */

.controls { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px 22px; margin-bottom: 1rem; padding-bottom: 0.9rem; border-bottom: 1px solid var(--border-light); }
.slider { display: grid; gap: 3px; }
.slider-top { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.slider label, .seg-wrap .seg-label { font-family: var(--sans); font-weight: 600; font-size: 0.9rem; color: var(--text); }
.slider output { font-family: var(--mono); font-weight: 700; font-size: 0.84rem; color: var(--accent); white-space: nowrap; }
.slider .hint { font-size: 0.78rem; line-height: 1.35; color: var(--text-muted); margin: 0 !important; text-align: left !important; }
.slider input[type="range"] { width: 100%; accent-color: var(--accent); margin: 2px 0; }
.seg-wrap { display: grid; gap: 5px; }
.segmented { display: inline-flex; flex-wrap: wrap; border: 1px solid var(--rule); border-radius: 2px; overflow: hidden; background: var(--bg-card); width: fit-content; max-width: 100%; }
.segmented button { font: inherit; font-family: var(--mono); font-size: 0.76rem; padding: 0.38rem 0.66rem; border: 0; background: transparent; color: var(--text-secondary); cursor: pointer; }
.segmented button + button { border-left: 1px solid var(--rule); }
.segmented button.is-on { background: var(--primary); color: #fff; }
.calc-note { font-family: var(--mono); font-size: 0.7rem; color: var(--text-muted); margin: 0.6rem 0 0 !important; line-height: 1.5; }
select.pick { font: inherit; font-family: var(--sans); font-size: 0.92rem; padding: 0.35rem 0.5rem; border: 1px solid var(--rule); border-radius: 2px; background: var(--bg-card); color: var(--text); max-width: 100%; }

/* --- atlas and country card ------------------------------------------------------------------- */

.atlas-layout { display: grid; grid-template-columns: minmax(0, 2.15fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.atlas-wrap { position: relative; border-radius: 2px; overflow: hidden; background: #eeeae4; border: 1px solid var(--border); }
.atlas { display: block; width: 100%; height: auto; }
.atlas .atlas-sea { fill: #eeeae4; }
.atlas .atlas-land path { fill: #dcd5ca; stroke: #fff; stroke-width: 0.45; stroke-linejoin: round; transition: fill 0.25s; }
.atlas .atlas-dots circle { fill: #dcd5ca; stroke: var(--text); stroke-width: 0.5; }
.atlas [data-iso].is-in { cursor: pointer; }
.atlas [data-iso].is-in:hover { stroke: var(--text); stroke-width: 1.3; }
.atlas [data-iso].is-pick { stroke: var(--text); stroke-width: 2.2; }
.atlas-corner { position: absolute; left: 10px; bottom: 8px; font-family: var(--mono); font-size: 0.62rem; color: var(--text-muted); background: rgba(255, 255, 255, 0.85); padding: 1px 6px; border-radius: 2px; }
.legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 0.6rem 0 0; }
.legend span { display: inline-flex; align-items: center; gap: 6px; font-family: var(--mono); font-size: 0.72rem; color: var(--text-secondary); }
.legend i { width: 14px; height: 10px; border-radius: 1px; flex: none; }
.country-card { border: 1px solid var(--border); border-radius: 2px; background: var(--bg); padding: 0.85rem 0.95rem; min-height: 300px; border-top: 6px solid var(--cc, var(--rule)); }
.country-card .cc-kicker { font-family: var(--mono); font-size: 0.66rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); margin: 0 !important; }
.country-card h3 { font-family: var(--serif); font-weight: 800; font-size: 1.45rem; color: var(--primary); margin: 0.05rem 0 0.15rem; line-height: 1.1; }
.country-card .cc-class { font-family: var(--mono); font-size: 0.72rem; margin: 0 0 0.55rem !important; color: var(--text-secondary); text-align: left !important; }
.kv { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; font-size: 0.86rem; margin: 0; }
.kv dt { color: var(--text-secondary); }
.kv dd { margin: 0; font-family: var(--mono); font-size: 0.8rem; color: var(--text); text-align: right; }
.tag-row { display: flex; flex-wrap: wrap; gap: 5px; margin: 0.5rem 0 0; }
.tag-row span { font-family: var(--mono); font-size: 0.64rem; letter-spacing: 0.04em; padding: 2px 6px; border-radius: 2px; background: var(--bg-accent); color: var(--text-secondary); }
.tag-row span.on { background: var(--accent); color: #fff; }

/* --- breaker cards -------------------------------------------------------------- */

.cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 1.2rem 0; }
.card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 2px; padding: 0.95rem 1rem; border-top: 5px solid var(--k, var(--primary-light)); }
.card h3 { font-family: var(--serif); font-weight: 800; font-size: 1.15rem; line-height: 1.2; color: var(--primary); margin: 0 0 0.35rem; }
.card p { font-size: 0.88rem; line-height: 1.5; color: var(--text-secondary); margin: 0 !important; text-align: left !important; }
.card .tag { font-family: var(--mono); font-size: 0.64rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-muted); margin: 0 0 0.25rem !important; }
.card--a { --k: var(--x-opp); }
.card--b { --k: var(--x-pol); }
.card--c { --k: var(--x-haz); }
.card--d { --k: var(--b22); }

/* --- references, footer --------------------------------------------------------------------- */

.ref-list .ref-org { font-family: var(--mono); color: var(--primary-light); font-size: 0.7rem; }
.report-footer { border-top: 0; position: relative; padding-top: calc(3rem + 6px); }
.report-footer::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px; background: var(--ramp); }
.footer-inner h3 { color: #fff; font-family: var(--serif); font-weight: 800; font-size: 1.45rem; }
.footer-inner a { color: var(--accent-light); }
.cite-box { border-left-color: var(--accent); }

/* --- responsive ------------------------------------------------------------------------------ */

@media (max-width: 1000px) {
  .kpi-board, .tile-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .atlas-layout { grid-template-columns: minmax(0, 1fr); }
  .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .dash-grid, .cards { grid-template-columns: minmax(0, 1fr); }
  .masthead { padding-top: 2.2rem; background: linear-gradient(180deg, rgba(18, 16, 24, 0.92) 0 60%, rgba(18, 16, 24, 0.6)), var(--biv) 70% 100% / 680px auto no-repeat, linear-gradient(180deg, #221f2c, #121018); }
  .segmented button { padding: 0.34rem 0.5rem; font-size: 0.7rem; }
}
@media (max-width: 420px) {
  .kpi-board, .tile-row { grid-template-columns: minmax(0, 1fr); }
}

@media print {
  .controls { display: none; }
  .masthead, .readout, .report-footer::before, .atlas-wrap, .strip { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* --- quadrant tiles ---------------------------------------------------------------- */

.q-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 0.9rem 0; }
.q-tile { border: 1px solid var(--border); border-left: 6px solid var(--k); background: var(--bg-card); border-radius: 2px; padding: 0.6rem 0.75rem; }
.q-tile b { font-family: var(--serif); font-size: 1.5rem; display: block; line-height: 1.05; color: var(--text); }
.q-tile span { font-size: 0.78rem; color: var(--text-muted); display: block; line-height: 1.35; }
.marg { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0.6rem 0 0.9rem; }
@media (max-width: 680px) { .q-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } .marg { grid-template-columns: minmax(0, 1fr); } }

.mixbar { display: flex; height: 10px; border-radius: 2px; overflow: hidden; margin: 0.55rem 0 0.2rem; background: var(--bg-accent); }
.mixbar span { display: block; height: 100%; }
.mixlab { font-family: var(--mono); font-size: 0.66rem; color: var(--text-muted); }

/* --- weights, bivariate legend, pathway bars ------------------------------------------ */

.biv-legend { display: grid; grid-template-columns: repeat(3, 14px); grid-template-rows: repeat(3, 14px); gap: 1px; transform: rotate(0deg); }
.biv-legend i { display: block; }
.biv-wrap { display: flex; align-items: center; gap: 10px; font-family: var(--mono); font-size: 0.68rem; color: var(--text-muted); margin: 0.6rem 0 0; }
.pathbar { display: flex; height: 10px; border-radius: 2px; overflow: hidden; background: var(--bg-accent); margin: 0.5rem 0 0.15rem; }
.pathbar span { display: block; height: 100%; }
.pathlab { display: flex; flex-wrap: wrap; gap: 4px 10px; font-family: var(--mono); font-size: 0.64rem; color: var(--text-muted); }
.pathlab i { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 3px; vertical-align: -1px; }
table.rank { width: 100%; border-collapse: collapse; font-size: 0.86rem; }
table.rank th, table.rank td { padding: 0.38rem 0.5rem; border-bottom: 1px solid var(--border-light); text-align: left; }
table.rank thead th { font-family: var(--mono); font-weight: 400; font-size: 0.66rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--text-muted); border-bottom: 2px solid var(--rule); }
table.rank td.n { font-family: var(--mono); text-align: right; white-space: nowrap; }
table.rank td.bar { width: 34%; }
table.rank td.bar b { display: block; height: 9px; border-radius: 2px; }
.rank-wrap { overflow-x: auto; max-height: 520px; overflow-y: auto; }