/* =====================================================================
   Travel Risk Calculator — 2026 design (released 16 Oct 2026)
   Active under html.d26 (set in layout/public.php). Loads after dossier.css and overrides it.
   City/country hero markup: app/Views/partials/d26.php + destinations/show.php, country.php.
   Type: Schibsted Grotesk (headings, labels, numbers) + Newsreader (reading text).
   ===================================================================== */

html.d26 {
  --d26-ui: 'Schibsted Grotesk', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --d26-read: 'Newsreader', ui-serif, Georgia, Cambria, 'Times New Roman', serif;

  --ink: #0f172a;
  --ink-2: #1e293b;
  --ink-soft: #526075;
  --ink-dim: #8592a6;
  --paper: #f5f7fa;
  --surface: #ffffff;
  --rule: #e2e7ee;
  --rule-strong: #cfd7e2;
  --accent: #047857;
  --accent-hover: #065f46;
  --accent-tint: #e6f4ee;

  --t-low: #13a07a;      --t-low-tint: #d5f0e4;  --t-low-ink: #05664c;
  --t-mod: #e2a21a;      --t-mod-tint: #fbecc6;  --t-mod-ink: #865600;
  --t-elev: #ee6a2f;     --t-elev-tint: #fcdcca; --t-elev-ink: #a43a0e;
  --t-ext: #db3445;      --t-ext-tint: #f9d3d7;  --t-ext-ink: #a31c2b;
  --tier: var(--t-mod);

  /* Re-point the old font tokens so every rule that used them follows the new type. */
  --font-sans: var(--d26-ui);
  --font-display: var(--d26-ui);
  --font-serif: var(--d26-ui);   /* the old 'serif' token was a sans; reading text gets Newsreader explicitly below */
  --font-mono: var(--d26-ui);
}
html.d26 [data-d26-tier="low"]      { --tier: var(--t-low); }
html.d26 [data-d26-tier="moderate"] { --tier: var(--t-mod); }
html.d26 [data-d26-tier="elevated"] { --tier: var(--t-elev); }
html.d26 [data-d26-tier="extreme"]  { --tier: var(--t-ext); }
html.d26 [data-d26-tier="unknown"]  { --tier: #94a3b8; }

/* ── Base ─────────────────────────────────────────────────────────── */
html.d26 body {
  font-family: var(--d26-ui);
  font-size: 16px;
  line-height: 1.5;
  color: var(--ink);
  background: var(--paper);
  background-image: none;
  font-feature-settings: "kern" 1;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
html.d26 input, html.d26 select, html.d26 textarea, html.d26 button { font-family: var(--d26-ui); }
html.d26 body { overflow-x: clip; }

/* No tracked capitals anywhere: labels are words, not stamps. */
html.d26 body *:not(.brand-mark) { text-transform: none !important; }
html.d26 :is(h4, .masthead-line, .nav, .nav a, .button, label, .threat-dial .tier, table th, .eyebrow, .metadata, .meta,
  .section-kicker, .trc-month strong, .trc-month em, .trc-news-topic, .emergency-badge .em-label, .persona-selector-label,
  .mobile-menu-toggle, .area-type, .risk-timeline time, .hub-note span, .hub-note small, .proof-strip span,
  .tools-feature__list span, .atlas-hero__proof span, .hero-lookup label, .mode-card .label, .wizard-steps .lbl,
  .wizard-step-title, .driver .pill, .pprr-card h3, .trc-consent strong, .trc-consent-actions a, .meter-row,
  .emergency-badge, .pocket-dossier-btn, .trc-byline, [style*="uppercase"], [style*="letter-spacing"]) {
  letter-spacing: normal !important;
}
/* Inline styles in the templates: monospace → grotesk, unloaded Fraunces → the right new face. */
html.d26 [style*="JetBrains"], html.d26 [style*="Plus Jakarta"], html.d26 [style*="Major Mono"] { font-family: var(--d26-ui) !important; }
html.d26 main :is(p, ol, ul, blockquote, li)[style*="Fraunces"] { font-family: var(--d26-read) !important; }
html.d26 main :is(summary, h1, h2, h3, h4, h5, span, div, a, strong, td, th)[style*="Fraunces"] { font-family: var(--d26-ui) !important; }
html.d26 main h1[style*="Fraunces"] { font-weight: 750; letter-spacing: -0.025em; }
html.d26 main [style*="font-size:10px"], html.d26 main [style*="font-size: 10px"] { font-size: 12.5px !important; }
html.d26 main [style*="font-size:11px"], html.d26 main [style*="font-size: 11px"] { font-size: 13px !important; }

/* Tabular figures only on pure numbers: this face also widens commas and colons under tnum. */
html.d26 :is(.d26-aside dd, .meter-val, .em-num, .threat-dial .number, .d26-score__value) { font-variant-numeric: tabular-nums; }

/* ── Type scale ───────────────────────────────────────────────────── */
html.d26 :is(h1, h2, h3, h4, h5) {
  font-family: var(--d26-ui);
  color: var(--ink);
  text-wrap: balance;
}
html.d26 main h1,
html.d26 main .hero h1 {
  font-size: clamp(2rem, 1.25rem + 2.1vw, 2.875rem);
  line-height: 1.06;
  font-weight: 750;
  letter-spacing: -0.026em;
  margin: 0 0 18px;
  max-width: 24ch;
}
html.d26 main h2 {
  font-size: clamp(1.5rem, 1.15rem + 0.95vw, 2rem);
  line-height: 1.14;
  font-weight: 700;
  letter-spacing: -0.02em;
  margin: 0 0 14px;
}
html.d26 main h3 { font-size: 1.1875rem; line-height: 1.3; font-weight: 650; letter-spacing: -0.01em; margin: 22px 0 8px; }
html.d26 main h4 { font-size: 1rem; line-height: 1.35; font-weight: 650; letter-spacing: 0; margin: 18px 0 6px; }
html.d26 main p { margin: 0 0 12px; }

/* Reading text: serif, generous leading, ≤70 characters. */
html.d26 main :is(.lead, .trc-ai-summary, .trc-fact-lead, #right-now p, .trc-how-safe > p, .section > p:not(.muted):not(.meta):not(.trc-source-note):not(.trc-evidence-note),
  .section > .card > p:not(.muted):not(.meta), details > p, details > div > p, .trc-seasonal-risk > p) {
  font-family: var(--d26-read);
  font-size: 1.125rem;
  line-height: 1.62;
  color: var(--ink-2);
  max-width: 70ch;
  font-optical-sizing: auto;
}
html.d26 main :is(.muted, .meta, .trc-evidence-note, .trc-source-note, small) {
  font-family: var(--d26-ui);
  color: var(--ink-soft);
}
html.d26 main .muted { font-size: 0.875rem; line-height: 1.5; }
html.d26 a { text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: color-mix(in srgb, currentColor 35%, transparent); }
html.d26 a:hover { color: var(--accent); text-decoration-color: currentColor; }
html.d26 :focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }

/* ── Masthead ─────────────────────────────────────────────────────── */
html.d26 .masthead { background: #fff; border-bottom: 1px solid var(--rule); backdrop-filter: none; }
html.d26 .brand-name { font-family: var(--d26-ui); font-weight: 750; letter-spacing: 0.01em; font-size: 15px; }
html.d26 .brand-mark { font-family: var(--d26-ui); font-weight: 800; letter-spacing: 0; }
html.d26 .masthead .nav a,
html.d26 .masthead .nav-dropdown-toggle {
  font-family: var(--d26-ui) !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  color: var(--ink-soft) !important;
  padding: 8px 12px !important;
  border-radius: 8px;
}
html.d26 .masthead .nav a:hover, html.d26 .masthead .nav-dropdown-toggle:hover { color: var(--ink) !important; background: var(--paper); }
html.d26 .masthead .nav a.active, html.d26 .masthead .nav-dropdown-toggle.active { color: var(--accent) !important; background: var(--accent-tint); font-weight: 600 !important; }
html.d26 .masthead input[type="search"], html.d26 .masthead input[type="text"], html.d26 #trc-global-search { font-family: var(--d26-ui) !important; font-size: 14.5px !important; border-radius: 8px; }
html.d26 .mobile-menu-toggle { font-family: var(--d26-ui); font-size: 14px; font-weight: 600; }
/* Keep the header on one line between the phone menu and full desktop. */
@media (min-width: 861px) and (max-width: 1240px) {
  html.d26 .masthead .nav a, html.d26 .masthead .nav-dropdown-toggle { font-size: 14px !important; padding: 7px 8px !important; }
  html.d26 .masthead .nav { gap: 2px; }
  html.d26 .masthead-search input, html.d26 #trc-global-search { width: 190px; min-width: 0; }
  html.d26 .brand-name { font-size: 14px; }
}

/* ── Buttons & chips ──────────────────────────────────────────────── */
html.d26 .button, html.d26 .pocket-dossier-btn {
  font-family: var(--d26-ui);
  font-size: 15px;
  font-weight: 600;
  border-radius: 9px;
  padding: 12px 18px;
  line-height: 1.2;
}
html.d26 .button.primary, html.d26 a.button.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
html.d26 .button.primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); color: #fff; }

/* Compare-with chips under the hero (inline-styled links). */
html.d26 .section--hero a[href^="/compare/"] {
  font-size: 14px !important;
  font-weight: 500;
  padding: 6px 13px !important;
  border-radius: 999px !important;
  border-color: var(--rule-strong) !important;
  background: #fff !important;
}
html.d26 .section--hero a[href^="/compare/"]:hover { border-color: var(--accent) !important; color: var(--accent) !important; }
html.d26 .section--hero a[href="/compare"] { font-family: var(--d26-ui) !important; font-size: 14px !important; color: var(--accent) !important; }

/* ── Layout: sections and cards ───────────────────────────────────── */
html.d26 main.site-main { padding-bottom: 32px; }
html.d26 main .section { padding: 44px 0 4px; }
html.d26 main .card {
  background: var(--surface);
  border: 1px solid var(--rule);
  border-radius: 14px;
  box-shadow: none;
  padding: 20px 22px;
}
html.d26 .card.dossier::before { display: none; }
html.d26 main .section-kicker { font-size: 13px !important; font-weight: 600; color: var(--accent); margin-bottom: 6px; }
html.d26 main table { font-family: var(--d26-ui); font-size: 14.5px; }
html.d26 main table th { font-size: 13.5px; font-weight: 500; color: var(--ink-soft); text-align: left; }
html.d26 main table :is(th, td) { border-color: var(--rule); padding-top: 8px; padding-bottom: 8px; }

/* ── Hero ─────────────────────────────────────────────────────────── */
html.d26 main .section--hero { padding: 36px 0 8px; }
html.d26 .trc-breadcrumb { font-size: 13.5px !important; color: var(--ink-soft) !important; gap: 4px 8px !important; margin-bottom: 18px !important; }
html.d26 .trc-breadcrumb a:hover { color: var(--accent) !important; text-decoration: underline !important; }
html.d26 .trc-breadcrumb [aria-hidden="true"] { color: var(--ink-dim); }
html.d26 main .section--hero > .meta { font-size: 14px; font-weight: 500; color: var(--ink-soft); margin: 0 0 8px; }
html.d26 .trc-byline { font-size: 13.5px !important; line-height: 1.55 !important; color: var(--ink-soft); margin: 14px 0 16px !important; }
html.d26 .trc-byline strong { font-weight: 600; color: var(--ink); }

/* The answer box: the first thing a visitor needs, edged in the place's tier colour. */
html.d26 #right-now {
  position: relative;
  border-radius: 14px;
  padding: 20px 24px 20px 28px;
  margin: 6px 0 16px;
  background: #fff;
  overflow: hidden;
}
/* Tier stripe: only where the template supplies the tier (the inline border stays elsewhere). */
html.d26 :is([data-d26-tier] #right-now, #right-now[data-d26-tier]) { border: 1px solid var(--rule) !important; border-left: 0 !important; }
html.d26 :is([data-d26-tier] #right-now, #right-now[data-d26-tier])::before {
  content: "";
  position: absolute; inset: 0 auto 0 0;
  width: 6px;
  background: var(--tier);
}
html.d26 #right-now h2 {
  font-size: 1.0625rem !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
  color: var(--ink) !important;
  margin: 0 0 6px !important;
}
html.d26 #right-now .d26-checked { font-weight: 400; color: var(--ink-soft); white-space: nowrap; }
html.d26 #right-now p { font-size: 1.25rem !important; line-height: 1.5 !important; margin: 0 !important; color: var(--ink) !important; max-width: none; }

/* Best for / watch out for / updated row */
html.d26 .section--hero > div[style*="flex-wrap"]:not(:has(a[href^="/compare"])) { gap: 10px 28px !important; font-size: 15px !important; margin: 4px 0 18px !important; }
html.d26 .section--hero > div[style*="flex-wrap"] .muted[style*="uppercase"] { display: inline-block; font-size: 13px !important; margin-bottom: 2px; }
html.d26 .section--hero > div[style*="flex-wrap"] strong { font-weight: 650; }

html.d26 main .section--hero .lead { font-size: 1.25rem; line-height: 1.6; margin: 0 0 22px; max-width: 62ch; }
html.d26 main .section--hero .lead a { color: var(--accent); }

/* Country page extras in the hero */
html.d26 .trc-audio-box {
  border: 1px solid var(--rule) !important;
  border-radius: 12px !important;
  background: #fff !important;
  padding: 12px 16px !important;
  margin: 4px 0 14px !important;
  box-shadow: none !important;
}
html.d26 .trc-audio-box .button { padding: 7px 14px !important; font-size: 14px !important; white-space: nowrap; }
html.d26 .trc-audio-box [style*="uppercase"] { font-size: 14.5px !important; font-weight: 600 !important; }
html.d26 .trc-audio-box select { border-radius: 8px; font-size: 14px; }

/* Two columns from 1080px: reading column + score panel in the space that used to sit empty. */
html.d26 .d26-aside { margin: 28px 0 8px; }
@media (min-width: 1080px) {
  html.d26 .d26-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 384px;
    grid-template-rows: auto 1fr;
    column-gap: 56px;
    align-items: start;
  }
  html.d26 .d26-hero > .section--hero { grid-column: 1; grid-row: 1; }
  html.d26 .d26-hero > .d26-aside { grid-column: 2; grid-row: 1 / span 2; margin: 92px 0 0; }
  html.d26 .d26-hero > .d26-aside:has(#trc-destination-tools) { min-height: 1400px; }
  html.d26 .d26-hero > .d26-beside { grid-column: 1; grid-row: 2; }
  html.d26 main .section--hero { padding-bottom: 0; }
}
@media (min-width: 1280px) {
  html.d26 .d26-hero { grid-template-columns: minmax(0, 1fr) 400px; column-gap: 72px; }
}

/* ── Score panel ──────────────────────────────────────────────────── */
html.d26 .d26-aside {
  background: #fff;
  border: 1px solid var(--rule);
  border-radius: 16px;
  padding: 22px 22px 18px;
}
html.d26 .d26-score { padding-bottom: 16px; border-bottom: 1px solid var(--rule); margin-bottom: 4px; }
html.d26 .d26-score__place { font-size: 15px; font-weight: 600; color: var(--ink); margin: 0 0 6px; }
html.d26 .d26-score__row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
html.d26 .d26-score__num { margin: 0; line-height: 1; display: flex; align-items: baseline; gap: 4px; }
html.d26 .d26-score__value { font-size: 64px; font-weight: 750; letter-spacing: -0.04em; line-height: 0.95; color: var(--ink); }
html.d26 .d26-score__den { font-size: 18px; font-weight: 500; color: var(--ink-soft); }
html.d26 .d26-score__tier { font-size: 14.5px; font-weight: 650; padding: 5px 11px; border-radius: 999px; }
html.d26 .d26-tier--low      { color: var(--t-low-ink);  background: var(--t-low-tint); }
html.d26 .d26-tier--moderate { color: var(--t-mod-ink);  background: var(--t-mod-tint); }
html.d26 .d26-tier--elevated { color: var(--t-elev-ink); background: var(--t-elev-tint); }
html.d26 .d26-tier--extreme  { color: var(--t-ext-ink);  background: var(--t-ext-tint); }
html.d26 .d26-score__note { font-size: 14px !important; line-height: 1.5 !important; color: var(--ink-soft) !important; margin: 10px 0 0 !important; font-family: var(--d26-ui) !important; }

/* The scale: four bands (0–25–50–70–100); the band the place sits in is in full colour. */
html.d26 .d26-scale { position: relative; margin: 18px 0 2px; padding-top: 6px; }
html.d26 .d26-scale__track {
  display: block; height: 8px; border-radius: 99px;
  --b1: var(--t-low-tint); --b2: var(--t-mod-tint); --b3: var(--t-elev-tint); --b4: var(--t-ext-tint);
  background: linear-gradient(to right,
    var(--b1) 0 calc(25% - 1.5px), #fff calc(25% - 1.5px) calc(25% + 1.5px),
    var(--b2) calc(25% + 1.5px) calc(50% - 1.5px), #fff calc(50% - 1.5px) calc(50% + 1.5px),
    var(--b3) calc(50% + 1.5px) calc(70% - 1.5px), #fff calc(70% - 1.5px) calc(70% + 1.5px),
    var(--b4) calc(70% + 1.5px) 100%);
}
html.d26 [data-d26-tier="low"] .d26-scale__track      { --b1: var(--t-low); }
html.d26 [data-d26-tier="moderate"] .d26-scale__track { --b2: var(--t-mod); }
html.d26 [data-d26-tier="elevated"] .d26-scale__track { --b3: var(--t-elev); }
html.d26 [data-d26-tier="extreme"] .d26-scale__track  { --b4: var(--t-ext); }
html.d26 .d26-scale__mark {
  position: absolute; top: 0;
  left: clamp(3px, calc(var(--s) * 1%), calc(100% - 3px));
  width: 5px; height: 20px; margin-left: -2.5px;
  background: var(--ink); border-radius: 3px;
  box-shadow: 0 0 0 2px #fff;
}
html.d26 .d26-scale__legend {
  display: grid; grid-template-columns: 25fr 25fr 20fr 30fr;
  margin-top: 8px; font-size: 12.5px; color: var(--ink-dim);
}
html.d26 .d26-scale__legend span:nth-child(4) { text-align: right; }
html.d26 [data-d26-tier="low"] .d26-scale__legend span:nth-child(1),
html.d26 [data-d26-tier="moderate"] .d26-scale__legend span:nth-child(2),
html.d26 [data-d26-tier="elevated"] .d26-scale__legend span:nth-child(3),
html.d26 [data-d26-tier="extreme"] .d26-scale__legend span:nth-child(4) { color: var(--ink); font-weight: 650; }

/* City tools panel, restyled to sit inside the score panel */
html.d26 .d26-aside #trc-destination-tools {
  background: none !important; border: 0 !important; box-shadow: none !important;
  padding: 0 !important; margin: 0 !important; max-width: none !important;
}
html.d26 .d26-aside #trc-destination-tools > .drawer-header,
html.d26 .d26-aside #trc-destination-tools > .drawer-header + .trc-evidence-note,
html.d26 .d26-aside .d26-score ~ #trc-destination-tools > .trc-risk-summary,
html.d26 .d26-aside .trc-den { display: none; }
html.d26 .d26-aside .trc-evidence-note { font-size: 13px; line-height: 1.5; color: var(--ink-soft); margin: 8px 0; }
html.d26 .d26-aside h4 {
  font-size: 15px !important; font-weight: 650; color: var(--ink);
  margin: 18px 0 8px; padding-top: 16px; border-top: 1px solid var(--rule);
}
html.d26 .d26-aside .trc-risk-grid { display: block; margin: 6px 0 0; }
html.d26 .d26-aside .trc-risk-grid > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 96px minmax(30px, auto);
  grid-template-areas: "l b v";
  align-items: center; column-gap: 12px;
  padding: 6px 0; margin: 0;
  background: none; border: 0; border-radius: 0; box-shadow: none;
  --fill: var(--t-mod);
}
html.d26 .d26-aside .trc-risk-grid > div[data-tier="low"] { --fill: var(--t-low); }
html.d26 .d26-aside .trc-risk-grid > div[data-tier="elevated"] { --fill: var(--t-elev); }
html.d26 .d26-aside .trc-risk-grid > div[data-tier="extreme"] { --fill: var(--t-ext); }
html.d26 .d26-aside .trc-risk-grid > div::before {
  content: ""; grid-area: b; height: 6px; border-radius: 9px;
  background: linear-gradient(var(--fill), var(--fill)) 0 0 / calc(var(--v, 0) * 1%) 100% no-repeat, #edf1f5;
}
html.d26 .d26-aside .trc-risk-grid dt { grid-area: l; font-size: 14.5px; color: var(--ink-2); font-weight: 400; margin: 0; }
html.d26 .d26-aside .trc-risk-grid dd { grid-area: v; margin: 0; text-align: right; font-size: 14.5px; font-weight: 650; color: var(--ink); }
html.d26 .d26-aside .trc-official-advisory { background: none !important; border: 0 !important; padding: 0 !important; margin: 0 !important; }
html.d26 .d26-aside .trc-official-advisory p:not(.trc-evidence-note) { font-size: 15.5px; font-weight: 600; margin: 0 0 4px; }
html.d26 .d26-aside .trc-official-advisory a { font-size: 14.5px; color: var(--accent); }
html.d26 .d26-aside .emergency-hud { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0; }
html.d26 .d26-aside .emergency-badge {
  display: flex; flex-direction: column; gap: 2px;
  padding: 9px 12px; border: 1px solid var(--rule); border-radius: 10px; background: #fff;
  text-decoration: none; color: var(--ink); min-width: 0;
}
html.d26 .d26-aside a.emergency-badge:hover { border-color: var(--accent); }
html.d26 .d26-aside .emergency-badge:first-child { grid-column: 1 / -1; flex-direction: row; justify-content: space-between; align-items: baseline; background: var(--paper); }
html.d26 .d26-aside .em-label { font-family: var(--d26-ui) !important; font-size: 13px !important; color: var(--ink-soft) !important; font-weight: 500; }
html.d26 .d26-aside .em-num { font-family: var(--d26-ui) !important; font-size: 19px !important; font-weight: 700; color: var(--ink); }
html.d26 .d26-aside .emergency-badge:not(a) .em-num { font-size: 14px !important; font-weight: 500; color: var(--ink-dim); }
html.d26 .d26-aside .persona-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 10px; }
html.d26 .d26-aside .persona-chip {
  font: 500 13.5px/1.2 var(--d26-ui); padding: 7px 12px; border-radius: 999px;
  border: 1px solid var(--rule-strong); background: #fff; color: var(--ink-2); cursor: pointer;
}
html.d26 .d26-aside .persona-chip.active { background: var(--ink); border-color: var(--ink); color: #fff; }
html.d26 .d26-aside .trc-persona-guidance > p:last-child { font-family: var(--d26-read); font-size: 16.5px; line-height: 1.55; color: var(--ink-2); }
html.d26 .d26-aside .drawer-actions { margin-top: 14px; }
html.d26 .d26-aside .pocket-dossier-btn {
  width: 100%; background: #fff; color: var(--ink); border: 1px solid var(--rule-strong);
  font-size: 14.5px; padding: 11px 14px; cursor: pointer;
}
html.d26 .d26-aside .pocket-dossier-btn:hover { border-color: var(--ink); }

/* Country: score layers inside the panel */
html.d26 .d26-layers h3 { font-size: 15px; font-weight: 650; margin: 16px 0 8px; }
html.d26 .d26-layers { padding-top: 2px; }

/* ── Meters (categories, layers) ──────────────────────────────────── */
html.d26 main .meter-row { font-family: var(--d26-ui); gap: 14px; padding: 6px 0; align-items: center; }
html.d26 main .meter-label { font-family: var(--d26-ui); font-size: 14.5px; color: var(--ink-2); }
html.d26 main .meter-val { font-size: 14.5px; font-weight: 650; color: var(--ink); }
html.d26 main .bar { height: 7px; border-radius: 99px; background: #edf1f5; overflow: hidden; }
html.d26 main .bar > div { border-radius: 99px; }
html.d26 main .bar.low > div { background: var(--t-low) !important; }
html.d26 main .bar.moderate > div { background: var(--t-mod) !important; }
html.d26 main .bar.elevated > div { background: var(--t-elev) !important; }
html.d26 main .bar.extreme > div, html.d26 main .bar.high > div { background: var(--t-ext) !important; }
html.d26 .d26-aside .meters { gap: 0; }
html.d26 .d26-aside .meter-row { grid-template-columns: minmax(0, 1fr) 96px 30px; display: grid; padding: 6px 0; }
html.d26 .d26-aside .meter-row .meter-label { grid-column: auto; }
html.d26 .d26-aside .meter-label { font-size: 14px; }

/* Country score dial (if shown elsewhere) */
html.d26 .threat-dial .number { font-family: var(--d26-ui); font-weight: 750; letter-spacing: -0.04em; }
html.d26 .threat-dial .tier { font-family: var(--d26-ui); font-weight: 650; }

/* ── Month strip, FAQ, lists ──────────────────────────────────────── */
html.d26 .trc-month { font-family: var(--d26-ui); border-radius: 10px; }
html.d26 .trc-month strong { font-size: 13px; font-weight: 650; }
html.d26 main details { border-bottom: 1px solid var(--rule); }
html.d26 main details > summary {
  font-family: var(--d26-ui) !important;
  font-size: 1.0625rem !important; font-weight: 600 !important; line-height: 1.4;
  color: var(--ink); padding: 14px 0; cursor: pointer;
}
html.d26 main details > summary:hover { color: var(--accent); }
html.d26 main details[open] > summary { padding-bottom: 6px; }
html.d26 main details :is(p, li) { font-size: 1.0625rem; }
html.d26 main :is(.section, .card) > :is(ul, ol) li { line-height: 1.55; margin-bottom: 6px; }
html.d26 main .trc-embassy-item { border-radius: 10px; }
html.d26 .trc-incity-nav a { font-family: var(--d26-ui) !important; font-size: 14px !important; font-weight: 500; }
html.d26 .trc-popular-searches a, html.d26 .trc-popular-countries a { font-family: var(--d26-ui) !important; font-size: 14px !important; }

/* ── Footer ───────────────────────────────────────────────────────── */
html.d26 footer, html.d26 footer.dossier-footer { font-family: var(--d26-ui); }

/* ── Small screens ────────────────────────────────────────────────── */
@media (max-width: 700px) {
  html.d26 main .meter-row { grid-template-columns: minmax(0, 1fr) 84px 30px; row-gap: 0; padding: 5px 0; }
  html.d26 main .meter-row .meter-label { grid-column: auto; font-size: 14px; line-height: 1.3; }
  html.d26 main .meters { gap: 2px; }
}
@media (max-width: 640px) {
  html.d26 body { font-size: 15.5px; }
  html.d26 main .section { padding-top: 32px; }
  html.d26 main .section--hero { padding-top: 22px; }
  html.d26 main h1, html.d26 main .hero h1 { font-size: 1.875rem; line-height: 1.1; margin-bottom: 14px; }
  html.d26 main h2 { font-size: 1.4375rem; }
  html.d26 .trc-breadcrumb { margin-bottom: 12px !important; font-size: 13px !important; }
  html.d26 #right-now { padding: 16px 16px 16px 20px; border-radius: 12px; }
  html.d26 :is([data-d26-tier] #right-now, #right-now[data-d26-tier])::before { width: 5px; }
  html.d26 #right-now p { font-size: 1.125rem !important; }
  html.d26 #right-now .d26-checked { display: block; font-size: 14px; margin-top: 2px; }
  html.d26 main :is(.lead, .trc-ai-summary, .trc-fact-lead, .trc-how-safe > p, .section > p:not(.muted):not(.meta):not(.trc-source-note):not(.trc-evidence-note),
    .section > .card > p:not(.muted):not(.meta), details > p, details > div > p) { font-size: 1.0625rem; }
  html.d26 main .section--hero .lead { font-size: 1.125rem; }
  html.d26 .d26-aside { padding: 18px 16px 14px; border-radius: 14px; }
  html.d26 .d26-score__value { font-size: 56px; }
  html.d26 .d26-aside .trc-risk-grid > div, html.d26 .d26-aside .meter-row { grid-template-columns: minmax(0, 1fr) 84px 28px; }
  html.d26 main .card { padding: 16px; border-radius: 12px; }
  /* Wide tables scroll inside their own box instead of widening the page. */
  html.d26 main table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  html.d26 main .card, html.d26 main .section { min-width: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html.d26 * { scroll-behavior: auto !important; }
}

/* Print stays as before */
@media print {
  html.d26 .d26-aside { border: 0; padding: 0; }
}
