@layer pages {
/* /emergency/ (07 P6): plain paper and no motion (07 §f.6); the one cover
   sits under the "call now" line. Red is reserved for this page and red-flag
   cards. */
.emergency-head { padding-block: 1.5rem 1rem; }
.emergency-first {
  padding: 1rem 1.1rem;
  border-radius: 12px;
  border: 3px solid var(--emergency);
  font-size: 1.25rem;
  font-weight: 700;
  max-inline-size: var(--measure);
}
.button-emergency {
  background: var(--emergency);
  border-color: var(--emergency);
  color: var(--on-emergency);
}
* { transition: none !important; animation: none !important; }
/* The switch is in the HTML without `hidden`, and shown from the first paint
   only when poison-region.js has run (it sets data-poison-country before the
   switch is parsed). Without JavaScript it never shows: the select needs it. */
.country-switch { display: none; max-inline-size: 24rem; }
:root[data-poison-country] .country-switch { display: block; }
.country-switch label { display: block; margin-block-end: .4rem; }
.country-switch select {
  min-block-size: 3.4rem;
  inline-size: 100%;
  padding-inline: .85rem 2.4rem;
  border-radius: 12px;
  border: 2px solid var(--line);
  background-color: var(--paper);
  color: var(--ink);
  font-size: 1.0625rem;
}
.country-switch .field-hint { font-size: var(--step-label); color: var(--ink-soft); margin-block-start: .35rem; }
.country-jump ul { display: flex; flex-wrap: wrap; gap: .25rem 1rem; padding: 0; list-style: none; }
.country-jump a { display: inline-flex; align-items: center; min-block-size: var(--target); }
.poison-country { padding-block: 1rem; border-block-start: 1px solid var(--line); }
.poison-country > * + * { margin-block-start: .75rem; }
.poison-country h3 { font-size: 1.375rem; }
.poison-line {
  display: grid;
  gap: .6rem;
  padding: 1rem 1.1rem;
  border-radius: 14px;
  background: var(--paper-2);
}
.poison-line h4 { margin: 0; font-size: var(--step-h3); }
.poison-line-secondary { background: transparent; border: 1px dashed var(--line); }
.call-button { justify-self: start; min-block-size: 3.25rem; font-size: 1.25rem; font-variant-numeric: lining-nums tabular-nums; }
.line-facts { display: grid; gap: .4rem; margin: 0; }
/* The label column is 7rem until the value no longer fits beside it (200%
   text on a phone): then the value wraps under its label instead of widening the
   page. */
.line-facts div { display: flex; flex-wrap: wrap; gap: 0 .75rem; }
.line-facts dt { flex: 0 0 7rem; }
.line-facts dd { flex: 1 1 10rem; min-inline-size: 0; overflow-wrap: anywhere; }
.line-facts dt { font-weight: 700; color: var(--ink-soft); }
.line-facts dd { margin: 0; }
.line-note { color: var(--ink-soft); }
.line-gap { font-weight: 700; }
.data-note { margin-block-start: 1rem; font-size: var(--step-label); color: var(--ink-soft); }
.maps-row { display: flex; flex-wrap: wrap; gap: .75rem; }
.go-now { padding: 1.25rem; border-radius: var(--radius-card); border: 2px solid var(--emergency); }
.go-now h2 { color: var(--emergency); }
.go-now-list { display: grid; gap: .5rem; padding-inline-start: 1.2rem; font-weight: 500; }
.go-now-group { padding-block-start: .75rem; border-block-start: 1px solid var(--line); }
.go-now-group h3 { margin: 0 0 .5rem; font-size: var(--step-h3); }
.flag-source { font-weight: 400; font-size: var(--step-label); color: var(--ink-soft); }
.flag-source a { overflow-wrap: anywhere; display: inline-flex; align-items: center; min-block-size: var(--target); }

}
