/* The world risk map (Release C; sitebuild/worldrisks/worldmap.py): exhibit R-0 on /gps/ and /gps/risks/, R-1 on each
   card page. The base map in the GPS map look (gps-front-map.css: the same sea, land and paper borders, here under wr-
   names so a card page needs no /gps/ stylesheet); one circle per risk: size = Impact, colour = Likelihood band on one
   navy ramp (Low lightest, Severe navy #132338), a solid navy ring when under way, and the plate's one vermilion mark
   (#A8321C, --verm) round the top risk. Never gold. No inline styles (CSP). Phone first: the map is full width at 375px,
   the key wraps, the list is plain text. */
.wr-plate{--wr-sea:#E3E9EE;--wr-land:#CDD2D6;--wr-edge:#FBF9F5;--wr-b1:#DCE4EE;--wr-b2:#93A8C0;--wr-b3:#4D6685;
  --wr-b4:#132338;--wr-ring:#132338;--wr-p:#93A8C0;--wr-af:#B7C2CD;max-width:100%;min-width:0}
.wr-svg{display:block;width:100%;height:auto;margin:0 0 10px}
.wr-sea{fill:var(--wr-sea);stroke:none}
.wr-land path{fill:var(--wr-land);stroke:var(--wr-edge);stroke-width:.4}
.wr-land use.wr-base{fill:var(--wr-land);stroke:var(--wr-edge);stroke-width:.4}
.wr-land path.wr-p{fill:var(--wr-p)}
.wr-land path.wr-af{fill:var(--wr-af)}
.wr-la:hover path,.wr-la:focus path{stroke:var(--ink);stroke-width:1.6;vector-effect:non-scaling-stroke}
.wr-la:focus{outline:none}
.wr-la:focus-visible path{stroke:var(--ink);stroke-width:2.2}
/* the circles: a thin navy edge on every one (the Low tint against the land), the ring of an under-way risk solid */
.wr-c{stroke:var(--wr-ring);stroke-width:.8;fill-opacity:.94}
.wr-c.wr-b1{fill:var(--wr-b1)}.wr-c.wr-b2{fill:var(--wr-b2)}.wr-c.wr-b3{fill:var(--wr-b3)}
.wr-c.wr-b4{fill:var(--wr-b4);stroke:var(--wr-edge)}
.wr-c.wr-uw{stroke:var(--wr-ring);stroke-width:2.6}
.wr-c.wr-b4.wr-uw{stroke:var(--wr-b2)}
.wr-hot{fill:none;stroke:var(--verm);stroke-width:2.6}
.wr-a{cursor:pointer}
.wr-a:hover .wr-c,.wr-a:focus .wr-c{stroke:var(--ink);stroke-width:2.6}
.wr-a:focus{outline:none}
.wr-a:focus-visible .wr-c{stroke:var(--ink);stroke-width:3.4}
/* a place's name (a strait, Global): drawn over the circles with a paper halo, never in the way of a tap */
.wr-lab{font:500 17px/1 var(--mono);fill:var(--graphite);text-anchor:middle;letter-spacing:.06em;text-transform:uppercase;
  stroke:var(--wr-edge);stroke-width:4px;stroke-linejoin:round;paint-order:stroke;pointer-events:none}
/* a crowded place: one cluster circle with its count, a link to the list (worldmap.cluster_r sizes the circle for the
   count's digits at the phone's size below) */
.wr-cl{fill:var(--paper);stroke:var(--wr-ring);stroke-width:1.4}
.wr-cn{font:600 16px/1 var(--mono);fill:var(--wr-ring);text-anchor:middle;pointer-events:none}
.wr-a:hover .wr-cl,.wr-a:focus .wr-cl{stroke:var(--ink);stroke-width:2.6}
.wr-a:focus-visible .wr-cl{stroke:var(--ink);stroke-width:3.4}
/* the key: the four bands, then size, ring and mark */
.wr-key{list-style:none;display:flex;flex-wrap:wrap;gap:4px 14px;margin:0 0 6px;padding:0;font:13px/1.4 var(--sans);color:var(--ink)}
.wr-key li{display:inline-flex;align-items:center;gap:6px}
.wr-sw{display:inline-block;width:14px;height:14px;border-radius:50%;border:1px solid var(--wr-ring);flex:none}
.wr-sw.wr-b1{background:var(--wr-b1)}.wr-sw.wr-b2{background:var(--wr-b2)}.wr-sw.wr-b3{background:var(--wr-b3)}
.wr-sw.wr-b4{background:var(--wr-b4)}
.wr-sw-size{width:18px;height:18px;background:var(--wr-b2)}
.wr-sw-uw{background:var(--paper);border-width:3px}
.wr-sw-cl{width:18px;height:18px;background:var(--paper);border-width:1.5px}
.wr-sw-p,.wr-sw-af{border-radius:2px;border-color:var(--graphite)}
.wr-sw-p{background:var(--wr-p)}.wr-sw-af{background:var(--wr-af)}
.wr-draft{margin:4px 0 0;padding:4px 8px;border-left:3px solid var(--navy);background:var(--tint)}
/* the list under the map: the same risks as text, by Impact then Likelihood */
.wr-fold{margin:10px 0 4px;font:14px/1.45 var(--sans)}
.wr-fold > summary{cursor:pointer;font-weight:600;color:var(--navy);padding:6px 0}
.wr-lh{margin:10px 0 4px}
.wr-list{margin:4px 0 8px;padding:0 0 0 22px;font:14px/1.45 var(--sans);color:var(--ink)}
.wr-list li{margin:0 0 8px;overflow-wrap:anywhere}
.wr-list a{color:var(--navy)}
.wr-sc{display:block;font:12.5px/1.4 var(--mono);color:var(--graphite)}
.wr-uwt{color:var(--navy);font-weight:600}
@media (min-width:960px){.wr-list{columns:2;column-gap:28px}.wr-list li{break-inside:avoid}}
/* small places the atlas has no shape for (as gps-front-map.css): a land-toned dot, its tap area unseen under the land */
.wr-dot{fill:var(--wr-land);stroke:var(--graphite);stroke-width:.8}
.wr-hit{fill:#000;fill-opacity:0;stroke:none}
.wr-la:hover .wr-dot,.wr-la:focus-visible .wr-dot{stroke:var(--ink);stroke-width:1.6}
/* a held card (drawn only in a --drafts build): a dashed edge, and "Held" in its list row */
.wr-c.wr-held{stroke-dasharray:3 2}
.wr-heldt{color:var(--graphite);font-weight:600}
/* phone: the plate draws at about a third of its viewBox, so labels and rings grow to stay readable */
@media (max-width:599px){.wr-lab{font-size:22px;letter-spacing:0;stroke-width:6px}.wr-c{stroke-width:1.6}
  .wr-c.wr-uw{stroke-width:6}.wr-hot{stroke-width:5}.wr-c.wr-held{stroke-dasharray:6 4}.wr-dot{stroke-width:1.6}
  .wr-cl{stroke-width:2.6}
  /* the count: 36 viewBox units are 11 CSS px at 375px (the plate draws at 0.31 of its viewBox) */
  .wr-cn{font-size:36px;font-weight:700;letter-spacing:-.06em}}