/* World risks (Release C; sitebuild/worldrisks/pages.py and hub.py): the card pages /gps/risks/world/<slug>/ and the
   /gps/risks/ list. Copied into www/ only with site.config.json world_risks.pages on. Site tokens only (site.css
   :root); navy #132338 and one vermilion #A8321C per plate (.wr-hot), never gold; light pages, as the site.
   Phone first (W-115): the title, both scores and the "Under way" tag on the first 375 x 667 screen; no sideways
   scroll; 44 px targets. Classes only: the CSP forbids inline style. */
.wr [hidden]{display:none !important}
.wr-crumb{max-width:var(--max);margin:0 auto;padding:10px var(--g) 0;font:500 13px/1.4 var(--sans);color:var(--graphite)}
.wr-crumb a{color:var(--graphite)}
.wr .wr-top{padding:12px 0 20px}
.wr-top h1{font:600 26px/1.2 var(--serif);letter-spacing:-.01em;margin:6px 0 12px;max-width:30ch;text-wrap:pretty;overflow-wrap:anywhere}
@media (min-width:900px){.wr-top h1{font-size:34px}}
.wr-top .lbl{font:600 11px/1.3 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--graphite)}

/* the two scores, side by side and never combined (METHOD §2.3); the Likelihood chip in its band colour on one
   sequential ramp (the word too), the Impact chip plain with its navy outline (.wr-imp): colour shows Likelihood only */
.wr-scores{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.wr-score{display:inline-flex;align-items:baseline;gap:6px;min-height:36px;padding:6px 10px;font:400 14px/1.3 var(--sans);border:1px solid var(--navy);background:var(--knockout);color:var(--ink)}
.wr-score .wr-sl{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.wr-score .wr-sn{font:500 17px/1 var(--mono);font-variant-numeric:tabular-nums lining-nums}
.wr-score .wr-tr{font-family:var(--mono)}
.wr-score.wr-sm{min-height:30px;padding:4px 8px;font-size:13px}
.wr-score.wr-sm .wr-sn{font-size:15px}
.wr-b1{background:#E6EBF1}
.wr-b2{background:#B9C6D6}
.wr-b3{background:#4D6585;color:var(--knockout)}
.wr-b4{background:var(--navy);color:var(--knockout)}
.wr-tag{display:inline-flex;align-items:center;min-height:36px;padding:4px 10px;font:600 12px/1.2 var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--navy);background:var(--knockout)}
.wr-tag.wr-uw{border:2px solid var(--navy)}          /* "Under way": the solid ring, as on the map */
.wr-rv{margin-top:10px;color:var(--graphite)}
.wr-why-tr{margin-top:4px}
.wr-draft,.wr-notice{margin-top:10px;padding:8px 12px;font:400 14px/1.45 var(--sans);border-left:3px solid var(--navy);background:var(--tint)}
.wr-notice{font-weight:600}
.wr .my-follow{margin-top:12px}

/* the sections */
.wr .wr-sec{padding:24px 0}
.wr-sec h2{font:600 21px/1.25 var(--serif);margin-bottom:10px}
.wr-sec p + p{margin-top:8px}
.wr-sec p,.wr-sec li{max-width:var(--measure)}
.wr-ks{font-size:18px;line-height:1.5}
.wr-event{margin-top:10px}
.wr-facts,.wr-changes,.wr-conn,.wr-sp{display:grid;gap:8px}
.wr-facts li,.wr-changes li,.wr-conn li{padding-left:14px;position:relative}
.wr-facts li::before,.wr-changes li::before,.wr-conn li::before{content:"";position:absolute;left:0;top:.7em;width:6px;height:1px;background:var(--ink)}
.wr-changes li.wr-can{font-weight:500}
.wr-asof{font:400 13px/1.4 var(--sans);color:var(--graphite)}
.wr-ref{font:500 12px/1 var(--mono);text-decoration:none;white-space:nowrap}
.wr-ref:hover{text-decoration:underline}
.wr-exposed{display:grid;gap:8px;margin:0}
.wr-ex{display:grid;grid-template-columns:1fr;gap:2px}
@media (min-width:600px){.wr-ex{grid-template-columns:120px 1fr;gap:12px}}
.wr-ex dt{font:600 11px/1.6 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--graphite)}
.wr-ex dd{margin:0;overflow-wrap:anywhere}
.wr-scns{display:grid;gap:14px}
@media (min-width:900px){.wr-scns{grid-template-columns:repeat(3,1fr)}}
.wr-scn{padding:12px 14px;border:1px solid var(--hair);background:var(--knockout)}
.wr-scn h3{font:600 17px/1.3 var(--serif);margin-bottom:6px}
.wr-sp-h{margin-top:8px;font-weight:600}
.wr-src{display:grid;gap:8px;padding-left:28px;list-style:decimal;font-size:15px}
.wr-src li{overflow-wrap:anywhere}
.wr-src li:target{background:var(--tint)}
.wr-close{padding:16px 0 32px}

/* the plates: R-3 calendar strip (R-1 and R-0 are world-risk-map.css) */
.wr-plates .plate{max-width:760px}
.wr-strip{display:block;width:100%;height:auto;margin:4px 0 12px}
.wr-strip .wr-ax{stroke:var(--ink);stroke-width:1}
.wr-strip .wr-today{stroke:var(--graphite);stroke-width:1;stroke-dasharray:3 3}
.wr-strip .wr-cd{fill:var(--navy)}
.wr-strip .wr-ct{fill:var(--knockout);stroke:var(--navy);stroke-width:1.5}
.wr-strip .wr-hot{fill:var(--verm);stroke:var(--verm)}
.wr-strip .wr-axl{font:400 11px var(--mono);fill:var(--graphite)}
.wr-strip .wr-end{text-anchor:end}
.wr-crows{display:grid;gap:10px;margin-bottom:8px}
.wr-crow{display:grid;grid-template-columns:1fr;gap:2px;font-size:15px}
@media (min-width:600px){.wr-crow{grid-template-columns:110px 1fr}.wr-crow > :not(.wr-cdate){grid-column:2}}
.wr-cdate{font:500 13px/1.5 var(--mono);color:var(--ink)}
.wr-remind{display:inline-flex;align-items:center;gap:6px;min-height:44px;font:600 13px/1.2 var(--sans);color:var(--ink)}
.wr .wr-crow .my-follow{margin-top:4px}         /* the short "Remind me" of a row; its sign-in note once, below */
.wr-rnote{margin-top:4px;color:var(--graphite)}

/* the hub's list */
.wr-hub .standfirst{margin-top:4px}
.wr-filt{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:end;margin:4px 0 16px}
.wr-f{display:grid;gap:4px;font:600 12px/1.3 var(--sans);letter-spacing:.04em;color:var(--graphite)}
.wr-f select{min-height:44px;max-width:100%;padding:6px 8px;font:400 15px/1.3 var(--sans);color:var(--ink);background:var(--knockout);border:1px solid var(--navy)}
.wr-f.wr-fc{display:inline-flex;align-items:center;gap:8px;min-height:44px}
.wr-f.wr-fc input{width:20px;height:20px}
.wr-count{flex-basis:100%}
.wr-rows{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.wr-row{display:grid;gap:6px;padding:12px 14px;background:var(--knockout);border:1px solid var(--hair)}
.wr-rt{font:600 17px/1.3 var(--serif);text-decoration:none;text-wrap:pretty;overflow-wrap:anywhere}
.wr-rt:hover{text-decoration:underline}
.wr-rm{color:var(--graphite)}
.wr-grp + .wr-grp{margin-top:20px}
.wr-grp h3{font:600 17px/1.3 var(--sans);margin-bottom:8px}
.wr-grp h3 .fine{font-weight:400}
/* a region's other rows: a closed fold under its first rows (every card reachable without script; a short phone page) */
.wr-more{margin-top:6px}
.wr-more > summary{display:flex;align-items:center;gap:8px;min-height:44px;cursor:pointer;font:600 15px/1.3 var(--sans);color:var(--navy)}
.wr-more > summary:hover{text-decoration:underline}
.wr-more[open] > summary{margin-bottom:8px}
.wr-ours{margin-top:6px}
/* the phone (W-115): one compact row per risk, the title on one line, then the two scores and the tag; the where
   and what line, the bands and the arrows are on the card page */
@media (max-width:599px){
.wr-hub .wr-rows{gap:0}
.wr-hub .wr-row{position:relative;gap:2px;padding:8px 0;background:none;border:0;border-bottom:1px solid var(--hair)}
.wr-hub .wr-rt::after{content:"";position:absolute;inset:0}   /* the whole row opens the card (a 44 px target) */
.wr-hub .wr-rt{display:block;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wr-hub .wr-rm,.wr-hub .wr-row .wr-band,.wr-hub .wr-row .wr-tr{display:none}
.wr-hub .wr-row .wr-scores{gap:6px}
.wr-hub .wr-row .wr-score,.wr-hub .wr-row .wr-tag{min-height:24px;padding:2px 6px;font-size:12px}
.wr-hub .wr-row .wr-score .wr-sn{font-size:13px}
.wr-hub .wr-row .wr-tag.wr-uw{border-width:1px}
}

/* ---------- the risk page on the Atlas Wire template (WS-888; sitebuild/worldrisks/pages.py; the mock's risk_page,
   gen_M.py l.535-873 and style_M.css). A white page (WS-878 (3)); A's serif with small capitals for headings and
   text, B's sans for data (WS-878 (4)). Own tokens under the wr- prefix until base.css (agent B) lands. No sideways
   scroll at 375 px: every grid track is minmax(0,1fr), tables fold to blocks, SVGs scale to their box. */
.wr-page{--wr-ink:#1B2530;--wr-mute:#435059;--wr-soft:#6C777E;--wr-rule:#CDD0C6;--wr-hair:#E2E3DB;--wr-off:#ECEDE7;
  --wr-crim:#A3242B;--wr-up:#8C4A2F;--wr-flat:#5A6B78;--wr-down:#2C7064;background:var(--knockout);color:var(--wr-ink)}
.wr-page .wr-sec{padding:22px 0;border-top:1px solid var(--wr-hair)}
.wr-page .wr-sec h2{font:600 19px/1.2 var(--serif);font-variant-caps:all-small-caps;letter-spacing:.12em;margin-bottom:6px;max-width:none}
.wr-page .wr-sub{margin:0 0 10px}
.wr-crumb{font-variant-caps:all-small-caps}
.wr-k{display:block;font:600 13.5px/1.3 var(--serif);font-variant-caps:all-small-caps;letter-spacing:.14em;color:var(--wr-mute)}
.wr-page .wr-top h1{max-width:28ch}
.wr-head{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
@media (min-width:900px){.wr-head{grid-template-columns:minmax(0,1fr) minmax(0,430px);gap:32px}}
.wr-head > *{min-width:0}
.wr-test{margin:4px 0 0;font:400 16px/1.45 var(--serif);max-width:var(--measure)}
.wr-test .wr-k{display:inline;margin-right:6px}
.wr-uwb{display:inline-block;font:700 10.5px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--knockout);background:var(--wr-crim);padding:4px 7px 3px}
.wr-nub{display:inline-block;font:700 10.5px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--wr-mute);border:1px solid var(--wr-rule);padding:3px 6px 2px}

/* B's two 10-cell meters, never combined */
.wr-meters{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border-top:1px solid var(--wr-ink);border-bottom:1px solid var(--wr-rule)}
.wr-meter{min-width:0;padding:10px 12px 12px 0}
.wr-meter + .wr-meter{border-left:1px solid var(--wr-rule);padding-left:12px}
.wr-srow{display:flex;align-items:center;gap:10px;margin:4px 0 2px}
.wr-snum{font:600 36px/1 var(--sans);font-variant-numeric:tabular-nums;letter-spacing:-.02em;min-width:24px}
.wr-swd{min-width:0}   /* not .wr-sw: world-risk-map.css draws its 14px key swatch with that class */
.wr-sband{display:block;font:italic 500 18px/1.1 var(--serif)}
.wr-strend{display:block;margin-top:3px;font:500 12px/1.3 var(--sans)}
.wr-t-up{color:var(--wr-up)}
.wr-t-flat{color:var(--wr-flat)}
.wr-t-down{color:var(--wr-down)}
.wr-m10{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:3px;margin-top:8px}
.wr-m10 i{height:14px;background:var(--wr-off);border:1px solid #D6D8CF}
.wr-m10 i.on{background:var(--wr-ink);border-color:var(--wr-ink)}
.wr-mbands{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:3px;margin-top:3px;font:400 10px/1 var(--sans);color:var(--wr-soft)}
.wr-mbands span{border-top:1px solid var(--wr-rule);padding-top:3px;white-space:nowrap;overflow:hidden}
.wr-mb3{grid-column:span 3}
.wr-mb2{grid-column:span 2}
.wr-meter .wr-why-tr{margin-top:8px}
.wr-iparts{display:grid;grid-template-columns:minmax(0,1fr);gap:6px 18px;margin:12px 0 6px}
@media (min-width:600px){.wr-iparts{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.wr-ip{display:grid;grid-template-columns:minmax(0,7.5em) minmax(0,1fr) 2em;gap:8px;align-items:center;font:400 12.5px/1.2 var(--sans);color:var(--wr-mute)}
.wr-ip b{color:var(--wr-ink);font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
.wr-ip .wr-m10{margin:0;gap:1.5px}
.wr-ip .wr-m10 i{height:6px;border:0}
.wr-ip .wr-m10 i.on{background:var(--wr-flat)}
.wr-ipn{margin:0}
.wr-ipnote,.wr-never{margin-top:4px}
@media (max-width:379px){.wr-meters{grid-template-columns:minmax(0,1fr)}.wr-meter + .wr-meter{border-left:0;border-top:1px solid var(--wr-rule);padding-left:0}}

/* what changed: dated, newest first */
.wr-chg{list-style:none;margin:0;padding:0}
.wr-chg li{display:grid;grid-template-columns:minmax(0,6.5em) minmax(0,1fr);gap:12px;padding:8px 0;border-bottom:1px solid var(--wr-hair);font-size:15.5px}
.wr-chg time{font:600 12px/1.6 var(--sans);letter-spacing:.04em;text-transform:uppercase}
.wr-chg li.wr-cx span{font-family:var(--sans);font-size:14px}
.wr-page .wr-more > summary{font-family:var(--sans)}
.wr-why2{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;margin-top:12px}
@media (min-width:900px){.wr-why2{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}}
.wr-why2 p{margin:0}
.wr-fold{margin-top:14px}

/* where: the locator (agent A's zoom map) or the R-1 plate */
.wr-locwrap{max-width:560px}
.wr-locwrap svg{display:block;width:100%;height:auto;max-width:100%}
.wr-loc-p{display:none}
@media (max-width:599px){.wr-locwrap{max-width:none}.wr-loc-d{display:none}.wr-loc-p{display:block}}
.wr-credit{margin-top:6px}

/* how it spreads: C's chain, A's detail */
.wr-chain{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;border-top:1px solid var(--wr-ink);padding-top:12px}
@media (min-width:900px){.wr-chain{grid-template-columns:minmax(0,240px) minmax(0,1fr);gap:28px}}
.wr-chain > *{min-width:0}
.wr-shock{align-self:start;border:1px solid var(--wr-ink);border-left:4px solid var(--wr-crim);padding:12px 14px;background:#FAFAF7}
.wr-sev{margin:4px 0 6px;font:italic 500 18px/1.3 var(--serif);overflow-wrap:anywhere}
.wr-chh{font:600 15px/1.2 var(--serif);font-variant-caps:all-small-caps;letter-spacing:.13em;margin:0 0 8px}
.wr-chh small{font:italic 400 13px/1 var(--serif);font-variant-caps:normal;letter-spacing:0;color:var(--wr-soft);margin-left:4px}
.wr-chs{list-style:none;margin:0;padding:0}
.wr-chs li{display:grid;grid-template-columns:minmax(0,1fr);gap:2px;padding:8px 0;border-bottom:1px solid var(--wr-hair)}
@media (min-width:600px){.wr-chs li{grid-template-columns:minmax(0,11em) minmax(0,1fr);gap:14px}}
.wr-chs li.wr-can .wr-cc{color:var(--wr-crim)}
.wr-cc{font:600 15px/1.35 var(--serif)}
.wr-ct{font:400 14px/1.45 var(--sans);color:var(--wr-mute);overflow-wrap:anywhere}
.wr-cmore summary{display:inline-flex;align-items:center;min-height:32px;cursor:pointer;font:600 12.5px/1 var(--sans);color:var(--navy)}
.wr-carried{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;margin-top:16px;padding-top:12px;border-top:1px solid var(--wr-rule)}
@media (min-width:900px){.wr-carried{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}}
.wr-carried > *{min-width:0}
.wr-pill{display:flex;flex-wrap:wrap;gap:4px 12px;margin:0;padding:0;list-style:none;font:400 14px/1.4 var(--sans)}
.wr-pill li{overflow-wrap:anywhere}
.wr-pill i{font-size:12px;color:var(--wr-soft)}

/* scenarios: C's S1/S2/S3 labels and one signpost table */
.wr-page .wr-scns{list-style:none;margin:0;padding:0}
.wr-page .wr-scn{min-width:0;border:0;border-top:3px solid var(--wr-flat);padding:10px 0 0;background:none}
.wr-page .wr-scn.wr-s2{border-top-color:var(--wr-up)}
.wr-page .wr-scn.wr-s3{border-top-color:var(--wr-down)}
.wr-skc{display:inline-block;font:700 11px/1 var(--sans);letter-spacing:.04em;color:var(--knockout);background:var(--wr-flat);padding:4px 6px 3px;margin-right:8px;vertical-align:1px}
.wr-skc.wr-s2{background:var(--wr-up)}
.wr-skc.wr-s3{background:var(--wr-down)}
.wr-scnn{font:600 13px/1 var(--serif);font-variant-caps:all-small-caps;letter-spacing:.14em}
.wr-page .wr-scn h3{margin-top:8px}
.wr-sigt{width:100%;border-collapse:collapse;margin-top:20px;font:400 13.5px/1.4 var(--sans);table-layout:fixed}
.wr-sigt th{text-align:left;font:600 13.5px/1.2 var(--serif);font-variant-caps:all-small-caps;letter-spacing:.12em;color:var(--wr-mute);border-bottom:1px solid var(--wr-ink);padding:6px 10px 6px 0}
.wr-sigt th:first-child{width:3.5em}
.wr-sigt th:last-child{width:9em}
.wr-sigt.wr-sig2 th:last-child{width:auto}
.wr-sigt td{border-bottom:1px solid var(--wr-hair);padding:8px 10px 8px 0;vertical-align:top;color:var(--wr-mute);overflow-wrap:anywhere}
.wr-sigt td:nth-child(2){font:500 15px/1.35 var(--serif);color:var(--wr-ink)}
.wr-sigm{display:block;margin-top:2px}
.wr-gap{color:#8E979C;font-style:italic}
.wr-st{display:inline-block;font:600 11.5px/1.2 var(--sans);letter-spacing:.04em;padding:2px 6px;border:1px solid var(--wr-rule)}
.wr-st-watch{color:var(--wr-up);border-color:var(--wr-up)}
.wr-st-hit{color:var(--wr-crim);border-color:var(--wr-crim)}
.wr-st-no{color:var(--wr-mute)}
.wr-st-un{color:#8E979C;border-style:dashed}
@media (max-width:599px){
.wr-sigt thead{display:none}
.wr-sigt,.wr-sigt tbody,.wr-sigt tr,.wr-sigt td{display:block;width:auto}
.wr-sigt tr{border-bottom:1px solid var(--wr-hair);padding:8px 0}
.wr-sigt td{border:0;padding:2px 0}
}

/* forecasts: A's panel plus the related forecasts, explained when opened */
.wr-fc{max-width:760px}
.wr-fcn{display:flex;align-items:flex-end;gap:14px;margin:6px 0 4px}
.wr-fcn > b{font:500 52px/1 var(--sans);font-variant-numeric:tabular-nums}
.wr-fcn > b small{font-size:.45em}
.wr-fcn > span{min-width:0;font:400 15px/1.4 var(--serif);overflow-wrap:anywhere}
.wr-yard{display:block;width:100%;max-width:420px;height:auto;margin:6px 0 10px}
.wr-yb{fill:var(--wr-off)}
.wr-yf{fill:var(--wr-ink)}
.wr-ym{stroke:var(--wr-crim);stroke-width:2}
.wr-yard text{font:400 10px var(--sans);fill:var(--wr-soft)}
.wr-fwhy{font:400 15px/1.5 var(--serif);color:var(--wr-mute)}
.wr-fwhy .wr-k{display:inline;margin-right:6px}
.wr-frh{margin-top:14px}
.wr-frh .fine{font-variant-caps:normal;letter-spacing:0;margin-left:4px}
.wr-frel{list-style:none;margin:6px 0 10px;padding:0;border-top:1px solid var(--wr-ink)}
.wr-frel li{border-bottom:1px solid var(--wr-hair)}
.wr-frel summary{display:grid;grid-template-columns:minmax(0,4.5em) minmax(0,4.5em) minmax(0,1fr);gap:10px;align-items:baseline;min-height:44px;padding:9px 0;cursor:pointer}
.wr-fid{font:600 12px/1.3 var(--sans);color:var(--wr-mute)}
.wr-fp{font:600 15px/1.2 var(--sans);text-align:right;font-variant-numeric:tabular-nums}
.wr-fw{font:400 15px/1.35 var(--serif);overflow-wrap:anywhere}
.wr-frel details p{margin:0 0 8px;font:400 14.5px/1.5 var(--serif);color:var(--wr-mute)}
@media (min-width:600px){.wr-frel details p{margin-left:calc(9em + 20px)}}

/* what to do: approved actions only (WS-872) */
.wr-todo{display:grid;gap:12px;margin:0;padding-left:22px}
.wr-who{display:block;font:600 11px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--wr-up)}
.wr-if{display:block;margin-top:4px;font:400 13px/1.4 var(--sans);color:var(--wr-soft)}
