/* Theme 2.0 Explore regional atlas, panels 1:1 with the design (palette-3) and Luke's target. Owner: Frontend Builder B. Prefix .ex-.
   Follows the site theme (light default, dark optional). Self-contained SVG map (Natural Earth outlines), no tiles, no third party. Tokens only. */
body.t2 .t2-page.ex-atlas { padding: 0; animation: none; }
.ex h1, .ex h2, .ex h3 { font-family: var(--font); text-transform: none; }
.ex b, .ex strong { font-family: inherit; }
.ex [hidden] { display: none !important; }

/* stage: full viewport under the nav, panels float over the map */
.ex-stage { --pw: min(780px, 48vw, calc(100vw - 400px)); position: relative; height: 100vh; min-height: 820px; overflow: hidden; background: var(--bg); isolation: isolate; }
.ex-map { position: absolute; inset: 0; overflow: hidden; z-index: 0; }
.ex-tilt { position: absolute; left: -10%; right: -10%; top: -30%; bottom: -10%; transform: perspective(900px) rotateX(24deg); transform-origin: 50% 85%; }
.ex-svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.ex-tint { position: absolute; inset: 0; z-index: 1; pointer-events: none; background: var(--glass); mix-blend-mode: color; opacity: 0.12; }
.ex-vignette { position: absolute; inset: 0; z-index: 2; pointer-events: none; background: radial-gradient(120% 90% at 55% 70%, transparent 35%, var(--fade) 100%), linear-gradient(180deg, color-mix(in srgb, var(--fade) 55%, transparent) 0%, transparent 18%); }
.ex-labels { position: absolute; inset: 0; z-index: 3; pointer-events: none; overflow: hidden; }

/* map drawing */
.ex-land { fill: color-mix(in srgb, var(--panelsolid) 88%, var(--tx)); stroke: color-mix(in srgb, var(--tx) 14%, transparent); stroke-width: 0.6; vector-effect: non-scaling-stroke; }
.ex-land.is-in { fill: color-mix(in srgb, var(--panelsolid) 70%, var(--r2)); stroke: color-mix(in srgb, var(--tx) 30%, transparent); }
.ex-dot { fill: url(#exDotGrad); stroke: var(--tx); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.ex-halo { fill: color-mix(in srgb, var(--r2) 28%, transparent); }
.ex-lab { position: absolute; left: 0; top: 0; display: flex; gap: 8px; align-items: baseline; padding: 6px 11px; border-radius: 9px; white-space: nowrap; font-size: 12px; color: var(--tx); text-decoration: none; font-variant-numeric: tabular-nums; backdrop-filter: blur(14px); background: color-mix(in srgb, var(--panelsolid) 62%, transparent); border: 1px solid var(--pbd); pointer-events: auto; will-change: transform; }
.ex-lab:hover { background: color-mix(in srgb, var(--panelsolid) 92%, transparent); border-color: var(--r2); }
.ex-lab b { font-weight: 700; }
.ex-lab b.t2-pos { color: var(--gain); } .ex-lab b.t2-neg { color: var(--loss); }

/* ── left column ── */
.ex-left { position: absolute; left: 20px; top: 96px; bottom: 20px; width: var(--pw); z-index: 6; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; scrollbar-width: none; }
.ex-left::-webkit-scrollbar { display: none; }
.ex-card { background: color-mix(in srgb, var(--panelsolid) 84%, transparent); border: 1px solid var(--pbd); border-radius: 12px; padding: 18px; box-sizing: border-box; backdrop-filter: blur(20px); display: flex; flex-direction: column; gap: 14px; color: var(--tx); min-width: 0; }
.ex-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.ex-card-head > div { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.ex-title { margin: 0; font-size: 18px; font-weight: 500; line-height: 1.3; color: var(--tx); }
.ex-sub { font-size: 12px; color: var(--td); }
.ex-iconbtn { width: 32px; height: 32px; border-radius: 9px; border: 1px solid var(--grid); background: var(--ghost); color: var(--t2); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; text-decoration: none; }
.ex-iconbtn:hover { color: var(--tx); }
.ex-iconbtn svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }

/* big panel */
.ex-big { padding-bottom: 0; overflow: hidden; }
.ex-hero { display: flex; flex-wrap: nowrap; gap: 16px 32px; }
.ex-stat { display: flex; flex-direction: column; gap: 6px; }
.ex-stat-row { display: flex; align-items: flex-start; }
.ex-stat-num { font-size: 48px; font-weight: 400; letter-spacing: -0.03em; line-height: 1; font-variant-numeric: tabular-nums; color: var(--tx); }
.ex-stat-lab { font-size: 13px; color: var(--td); }
.ex-chip { display: inline-flex; align-items: center; gap: 8px; margin: -2px 0 0 -4px; padding: 4px 8px 4px 10px; border-radius: 7px; background: var(--ghost); font-size: 12px; font-weight: 500; color: var(--tx); white-space: nowrap; backdrop-filter: blur(8px); }
.ex-chip i { font-style: normal; font-size: 11px; }
.ex-chip i.t2-pos { color: var(--gain); } .ex-chip i.t2-neg { color: var(--loss); }
.ex-bigchart { height: 290px; margin: 0 -18px; margin-top: auto; }

/* six small panels at the design's scale: authored at full size, shown at zoom .5 (the design does the same) */
.ex-minis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; align-items: stretch; zoom: 0.5; }
.ex-mini-card { min-height: 512px; }
.ex-body { display: flex; flex-direction: column; gap: 14px; flex: 1; min-width: 0; }
.ex-none { margin: 0; padding: 12px 0; color: var(--td); font-size: 14px; }
.ex-big-num { font-size: 48px; font-weight: 400; letter-spacing: -0.03em; line-height: 1; font-variant-numeric: tabular-nums; color: var(--tx); }
.ex-big-num.t2-pos { color: var(--tx); } .ex-big-num.t2-neg { color: var(--tx); }
.ex-line13 { font-size: 13px; color: var(--t2); }
.ex-line13.is-d { color: var(--td); }
.ex-legend { display: flex; gap: 18px; font-size: 12px; color: var(--t2); }
.ex-legend span { display: inline-flex; align-items: center; gap: 7px; }
.ex-legend i { width: 9px; height: 9px; border-radius: 50%; background: var(--r2); }
.ex-legend i.is-grey { background: var(--td); }
.ex-tabs2 { display: flex; justify-content: center; gap: 20px; }
.ex-tabs2 button { padding: 0 0 4px; border: 0; border-bottom: 2px solid transparent; background: transparent; font: inherit; font-size: 13px; font-weight: 500; color: var(--td); cursor: pointer; }
.ex-tabs2 button[aria-pressed="true"] { color: var(--tx); border-bottom-color: var(--tx); }
.ex-tabs2 button:disabled { opacity: 0.45; cursor: not-allowed; }
.ex-dots { position: relative; display: block; width: 100%; height: 180px; }
.ex-dots svg { display: block; width: 100%; height: 100%; overflow: visible; }
.ex-dot-a { fill: var(--td); opacity: 0.65; } .ex-dot-f { fill: var(--tx); }
.ex-foot2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding-top: 10px; border-top: 1px solid var(--grid); margin-top: auto; }
.ex-foot2 > span { display: flex; flex-direction: column; gap: 3px; }
.ex-foot2 .k { font-size: 12px; color: var(--td); }
.ex-foot2 .v { font-size: 13px; font-weight: 500; font-variant-numeric: tabular-nums; color: var(--tx); }
.ex-note { font-size: 12px; color: var(--td); line-height: 1.5; margin: 0; }
.ex-trio { display: flex; flex-wrap: wrap; gap: 16px 32px; }
.ex-trio > div { display: flex; flex-direction: column; gap: 6px; }
.ex-trio .n { font-size: 40px; font-weight: 400; letter-spacing: -0.03em; line-height: 1; font-variant-numeric: tabular-nums; color: var(--tx); }
.ex-trio .l { font-size: 13px; color: var(--td); }
.ex-kick { font-size: 12px; font-weight: 500; letter-spacing: 0.12em; color: var(--td); }
.ex-mix { display: flex; flex-direction: column; gap: 9px; margin-top: 6px; }
.ex-mix-row { display: grid; grid-template-columns: 90px minmax(0, 1fr) 40px; gap: 12px; align-items: center; font-size: 13px; color: var(--t2); }
.ex-mix-row .bar { height: 5px; border-radius: 3px; background: var(--track); }
.ex-mix-row .bar i { display: block; height: 100%; border-radius: 3px; background: var(--r2); }
.ex-mix-row .p { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--tx); }
.ex-tops { display: flex; flex-direction: column; margin-top: auto; }
.ex-tops a { display: flex; justify-content: space-between; gap: 10px; padding: 9px 0; border-top: 1px solid var(--grid); text-decoration: none; }
.ex-tops a span:first-child { font-size: 13px; font-weight: 500; color: var(--tx); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ex-tops a span:last-child { font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--gain); }
.ex-tops a span.neg { color: var(--loss); }
.ex-gsvg { display: block; width: 100%; margin-top: 14px; overflow: visible; }
.ex-gtrack { fill: none; stroke: var(--track); stroke-width: 4.2; }
.ex-garc { fill: none; stroke-width: 4.2; }
.ex-gleg { display: flex; justify-content: space-between; gap: 8px; margin-top: 10px; }
.ex-gleg span { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: var(--t2); white-space: nowrap; }
.ex-gleg i { width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0; }
.ex-foot { margin: 6px 4px 0; font-size: 11px; line-height: 1.6; color: var(--td); }

/* ── right side ── */
.ex-right { position: absolute; left: calc(var(--pw) + 40px); right: 28px; top: 96px; bottom: 20px; z-index: 5; pointer-events: none; }
.ex-right > * { pointer-events: auto; }
.ex-head { display: flex; flex-direction: column; gap: 14px; pointer-events: none; }
.ex-head > * { pointer-events: auto; }
.ex-kicker { margin-top: 47px; font-size: 11px; font-weight: 500; letter-spacing: 0.12em; color: var(--t2); }
.ex-region { margin: 0; font-size: 56px; font-weight: 400; letter-spacing: -0.035em; line-height: 1; color: var(--tx); }
.ex-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.ex-pill { padding: 8px 14px; border-radius: 10px; background: var(--seg); border: 1px solid var(--pbd); backdrop-filter: blur(16px); font-size: 13px; color: var(--tx); font-variant-numeric: tabular-nums; }
.ex-switch { position: absolute; right: 0; top: 0; display: flex; align-items: center; gap: 4px; padding: 5px; border-radius: 12px; background: var(--seg); border: 1px solid var(--pbd); backdrop-filter: blur(16px); }
.ex-sw, .ex-sw-arrow { height: 38px; border: 0; border-radius: 9px; background: transparent; color: var(--t2); font: inherit; cursor: pointer; }
.ex-sw { padding: 0 18px; font-size: 14px; font-weight: 500; }
.ex-sw[aria-pressed="true"] { background: var(--ink); color: var(--inktx); }
.ex-sw-arrow { width: 38px; display: inline-flex; align-items: center; justify-content: center; }
.ex-sw-arrow svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.ex-macro { position: absolute; right: 0; bottom: 110px; width: min(420px, 100%); box-sizing: border-box; padding: 22px; border-radius: 20px; background: color-mix(in srgb, var(--panelsolid) 94%, transparent); border: 1px solid var(--pbd); backdrop-filter: blur(24px); display: flex; flex-direction: column; gap: 14px; }
.ex-macro-title { margin: 0; font-size: 24px; font-weight: 500; color: var(--tx); }
.ex-macro-sub { font-size: 13px; color: var(--td); margin-top: 4px; }
.ex-macro-hero { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.ex-macro-hero > div { display: flex; flex-direction: column; gap: 6px; }
.ex-macro-big { font-size: 56px; font-weight: 400; letter-spacing: -0.03em; line-height: 1; font-variant-numeric: tabular-nums; color: var(--tx); }
.ex-macro-cap { font-size: 13px; color: var(--td); }
.ex-sent { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 10px; background: var(--seg); font-size: 13px; color: var(--tx); white-space: nowrap; }
.ex-sent i { width: 10px; height: 10px; border-radius: 50%; background: var(--td); }
.ex-macro-bars { display: flex; align-items: flex-end; gap: 3px; height: 112px; margin-top: 4px; }
.ex-macro-bars .b { flex: 1; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 6px; }
.ex-macro-bars .b span { display: block; width: 2px; border-radius: 1px; background: color-mix(in srgb, var(--tx) 20%, transparent); }
.ex-macro-bars .b em { display: block; width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--tx); margin: 0 -8px; flex-shrink: 0; }
.ex-macro-bars.is-empty .b span { background: var(--grid); }
.ex-macro-axis { display: flex; justify-content: space-between; font-size: 12px; color: var(--td); }
.ex-macro-txt { margin: 0; font-size: 14px; line-height: 1.55; color: var(--t2); }
.ex-macro-note { margin: 0; font-size: 12px; color: var(--td); }

/* ── under the atlas: crawlable country lists + browse all ── */
.ex-countries, .ex-browse { padding: 40px var(--page-x, 36px) 8px; background: var(--bg); position: relative; z-index: 1; }
.ex-browse { padding-bottom: 48px; }
.ex-countries-in, .ex-browse-in { max-width: 1320px; margin: 0 auto; display: flex; flex-direction: column; gap: 8px; }
.ex-countries-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 12px; align-items: start; }
.ex-clist { padding: 20px; }
.ex-clist h3 { margin: 0 0 8px; }
.ex-cols, .ex-row-main { display: grid; grid-template-columns: minmax(0, 1fr) 48px 52px 64px 70px; gap: 8px; align-items: center; }
.ex-cols { padding: 8px 0; font-size: 11px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--td); }
.ex-cols span:not(:first-child), .ex-n { text-align: right; }
.ex-rows { list-style: none; margin: 0; padding: 0; }
.ex-row { border-top: 1px solid var(--grid); }
.ex-row-main { padding: 10px 0; color: inherit; text-decoration: none; border-radius: var(--rad-tile); }
.ex-row-main:hover { background: var(--ghost); }
.ex-row-name { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ex-n { font-size: 13px; font-variant-numeric: tabular-nums; color: var(--t2); white-space: nowrap; }
.ex-browse-text { max-width: 760px; margin: 8px 0 0; }
.ex-browse-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 12px; align-items: start; }
.ex-browse-col { padding: 20px; }
.ex-browse-col h3 { margin: 0 0 8px; }
.ex-browse-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.ex-browse-col li { border-top: 1px solid var(--grid); }
.ex-browse-col a { display: block; padding: 8px 0; font-size: 13px; color: var(--t2); text-decoration: none; }
.ex-browse-col a:hover { color: var(--tx); }

.ex-skel { height: 96px; border-radius: 12px; background: linear-gradient(90deg, var(--sk1), var(--sk2), var(--sk1)); background-size: 200% 100%; animation: exsk 1.4s linear infinite; }
@keyframes exsk { from { background-position: 200% 0; } to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .ex-skel { animation: none; } }

/* tablet and phones (under 1200): one scroll column, panels at full size (no zoom), the map is a band on top (brief and GM gate 11) */
@media (max-width: 1199px) {
  .ex-stage { height: auto; min-height: 0; padding: 340px 16px 24px; display: flex; flex-direction: column; gap: 12px; overflow: visible; }
  .ex-map, .ex-tint, .ex-vignette, .ex-labels { position: absolute; left: 0; right: 0; top: 0; bottom: auto; height: 340px; }
  .ex-left, .ex-right { position: static; width: auto; overflow: visible; }
  .ex-right { order: -1; display: flex; flex-direction: column; gap: 12px; pointer-events: auto; }
  .ex-head { pointer-events: auto; }
  .ex-switch { position: static; align-self: flex-start; max-width: 100%; }
  .ex-macro { position: static; width: auto; max-width: none; }
  .ex-kicker { margin-top: 0; }
  .ex-region { font-size: 40px; }
  .ex-minis { zoom: 1; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ex-mini-card { min-height: 0; }
  .ex-hero { flex-wrap: wrap; }
  .ex-countries-grid, .ex-browse-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 899px) {
  .ex-minis { grid-template-columns: minmax(0, 1fr); }
  .ex-countries-grid, .ex-browse-grid { grid-template-columns: minmax(0, 1fr); }
  .ex-stat-num { font-size: 40px; }
  .ex-bigchart { height: 240px; }
  body.t2 .t2-page.ex :is(p, li) { font-size: 16px !important; line-height: 1.55; }
  .ex-iconbtn { width: 44px; height: 44px; }
  .ex-sw, .ex-sw-arrow { height: 44px; min-width: 44px; }
  .ex-switch { width: 100%; justify-content: space-between; box-sizing: border-box; }
  .ex-sw { flex: 1; padding: 0 8px; }
  .ex-lab { padding: 13px 11px; }
  .ex-tabs2 button { min-height: 44px; min-width: 44px; padding: 0 8px 4px; }
  .ex-tops a, .ex-gap-tip { min-height: 44px; align-items: center; }
  .ex-fold > summary { min-height: 44px; }
  .ex-macro { padding: 16px; border-radius: 16px; }
  .ex-macro-big { font-size: 44px; }
  /* country rows: name on its own line, the four numbers underneath with their labels */
  .ex-cols { display: none; }
  .ex-row-main { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px 12px; padding: 12px 0; min-height: 44px; }
  .ex-row-name { grid-column: 1 / -1; padding-left: 0; }
  .ex-n { text-align: left; font-size: 16px; }
  .ex-n::before { content: attr(data-l); display: block; font-size: 12px; font-weight: 400; color: var(--td); }
  .ex-browse-col a { padding: 12px 0; min-height: 44px; box-sizing: border-box; font-size: 16px; }
  .ex-fold > summary h2 { font-size: 18px; }
}

/* the left column scrolls; its panels keep their own height instead of shrinking to fit */
.ex-left > * { flex-shrink: 0; }

/* static topic H1 for crawlers and screen readers; the region name below it is the visible headline */
.ex-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.ex .ex-head h2.ex-region { margin: 0; }

.ex-foot2.is-tight { margin-top: 0; }
/* the two crawl sections are closed by default (real H2 inside the summary, all text and links stay in the HTML) */
.ex-fold { max-width: 1320px; margin: 0 auto; }
.ex-fold > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; border: 1px solid var(--pbd); border-radius: 12px; background: var(--panel); }
.ex-fold > summary::-webkit-details-marker { display: none; }
.ex-fold > summary::after { content: ''; width: 8px; height: 8px; border-right: 2px solid var(--td); border-bottom: 2px solid var(--td); transform: rotate(45deg); transition: transform var(--dur); margin-right: 4px; }
.ex-fold[open] > summary::after { transform: rotate(-135deg); }
.ex-fold > summary h2 { margin: 0; }
.ex-fold[open] > summary { margin-bottom: 12px; }
.ex-countries, .ex-browse { padding-top: 24px; padding-bottom: 8px; }
.ex-browse { padding-bottom: 48px; }
.ex-minis .ex-body { gap: 12px; }

/* ── brief 09 additions ── */
.ex-mini-card { transition: border-color 0.18s cubic-bezier(0.16, 1, 0.3, 1); }
.ex-mini-card:hover { border-color: var(--r2); }
.ex-card :is(a, button):focus-visible, .ex-sw:focus-visible, .ex-sw-arrow:focus-visible, .ex-row-main:focus-visible { outline: 2px solid var(--r3); outline-offset: 2px; }
.ex-body { transition: opacity 0.18s cubic-bezier(0.16, 1, 0.3, 1); }
.ex-left.is-swap .ex-body { opacity: 0.35; }
@media (prefers-reduced-motion: reduce) { .ex-body, .ex-mini-card { transition: none; } }
/* minimised: heading, subheading and the one big number (the script hides the rest) */
/* gap ribbon chart (design 6b) */
.ex-gap { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 8px; align-items: stretch; }
.ex-gap-y { display: flex; flex-direction: column; justify-content: space-between; height: 150px; font-size: 12px; color: var(--td); font-variant-numeric: tabular-nums; }
.ex-gap-plot { position: relative; height: 150px; }
.ex-gap-plot svg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: block; }
.ex-gdot-s, .ex-gdot-p { position: absolute; border-radius: 50%; transform: translate(-50%, -50%); pointer-events: none; }
.ex-gdot-s { width: 9px; height: 9px; background: var(--ink); }
.ex-gdot-p { width: 5px; height: 5px; background: var(--td); opacity: 0.6; }
.ex-gap-x { display: flex; justify-content: space-between; margin-left: 44px; font-size: 12px; color: var(--td); }
.ex-gap-tip { position: absolute; top: 4px; display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border-radius: 8px; background: color-mix(in srgb, var(--panelsolid) 90%, transparent); border: 1px solid var(--pbd); font-size: 12px; color: var(--t2); pointer-events: none; white-space: nowrap; }
.ex-gap-tip b { color: var(--tx); font-weight: 600; }
.ex-legend i.is-ink { background: var(--ink); }
/* Builder A residuals: Macro Events height and region switcher position */
.ex-macro { gap: 12px; }
.ex-macro-bars { height: 100px; }
.ex-switch { right: -20px; top: 11px; }
.ex-ribbon { position: relative; height: 170px; }

/* panel links: title and open icon are real anchors; the minimise button stays a button */
.ex-hb { display: flex; align-items: flex-start; gap: 6px; flex-shrink: 0; }
.ex-open[hidden] { display: none; }
.ex-title a.ex-tl, .ex-line13 a.ex-tl { color: inherit; text-decoration: none; }
.ex-title a.ex-tl:hover, .ex-line13 a.ex-tl:hover { text-decoration: underline; }
.ex-card :is(a.ex-tl, a.ex-open):focus-visible { outline: 2px solid var(--r3); outline-offset: 2px; }
@media (max-width: 899px) { body.t2 .t2-page.ex a.ex-tl { display: inline-flex; align-items: center; min-height: 44px; min-width: 44px; } }
.ex-mini-card.is-min { min-height: 0; align-self: start; }   /* shared minimise (panel-min.js) adds .is-min */

/* region pager: full names (Europe, United States, Asia Pacific) from 900px, short names on phones */
.ex-sw-s { display: none; }
@media (max-width: 899px) { .ex-sw-l { display: none; } .ex-sw-s { display: inline; } }

/* axis labels never wrap letter by letter at the chart edge (375px check) */
.ex-bigchart .t2-sub { white-space: nowrap; }

/* one header (Luke): eyebrow, region title, chips and the sub-line now sit at the top of the big left panel; the left stack starts 24px under the nav (top 96px) and scrolls inside */
.ex-big > .ex-kicker { margin: 0; font-size: 11px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; color: var(--t2); }
.ex-big .ex-title { font-size: 40px; font-weight: 400; letter-spacing: -0.035em; line-height: 1.05; }
.ex-big .ex-chips { margin-top: -4px; }
@media (max-width: 1199px) {
  /* stacked: map band, region switch, the big panel (header), macro, then the small panels */
  .ex-left, .ex-right { display: contents; }
  .ex-switch { order: 0; }
  .ex-big { order: 1; }
  .ex-macro { order: 2; }
  .ex-minis { order: 3; }
  .ex-foot { order: 4; }   /* the compliance footer stays last (it was sorting up under the map) */
  .ex-big .ex-title { font-size: 34px; }
}

.ex-macro-ticks { margin-top: 4px; }

/* too few events to compare: a sentence in place of the big percentage */
.ex-macro-big.is-note { font-size: 24px; line-height: 1.25; letter-spacing: -0.01em; font-weight: 500; }
