/* Crisis Watch in the Gravitas site system (site-system.css). */
body.gx-crisis-watch { --gold: var(--gx-gold); --border: var(--gx-border); --raise: var(--gx-raise);
  --nv-raise: 4px 4px 9px #050f19, -3px -3px 8px #1d3a52; --nv-inset: inset 3px 3px 7px #050f19, inset -3px -3px 7px #1d3a52; }
body.gx-crisis-watch main { padding-top: 0; }

/* hero card */
body.gx-crisis-watch .watch-intro.gx-hero { gap: clamp(24px, 5vw, 64px); align-items: end; }
body.gx-crisis-watch .watch-intro h1 { font: 500 var(--gx-h3)/1.1 var(--gx-serif) !important; letter-spacing: -.01em; margin: 0; }
body.gx-crisis-watch .watch-intro h1 span { font-size: var(--gx-h1); line-height: 1.04; letter-spacing: -.02em; margin-top: 14px; color: var(--gx-ink); }
body.gx-crisis-watch .intro-side { max-width: 470px; }
body.gx-crisis-watch .intro-side > p:first-child { font-size: var(--gx-body); line-height: 1.55; color: var(--gx-ink); margin-top: 0; }
body.gx-crisis-watch .snapshot-label { font: 700 .6875rem/1.4 var(--gx-sans); letter-spacing: .12em; text-transform: uppercase; color: var(--gx-gold-deep); padding: 8px 14px; border: 1px solid var(--gx-border); border-radius: var(--gx-r); background: var(--gx-ground); box-shadow: var(--gx-raise-sm); }
body.gx-crisis-watch .connection-note { font: italic 400 1.0625rem/1.5 var(--gx-serif); color: var(--gx-slate); margin-top: 12px; }

/* the national picture: a raised night panel */
body.gx-crisis-watch .watch-board { box-sizing: border-box; width: var(--gx-frame); margin: 28px auto 0; padding: clamp(28px, 4vw, 52px) 0 clamp(26px, 3.5vw, 44px); border-radius: var(--gx-r); background: var(--gx-ink); box-shadow: var(--gx-raise); color: #e8deca; scroll-margin-top: 100px; }
body.gx-crisis-watch .watch-board > .hub-width { width: auto; padding-inline: clamp(18px, 4vw, 52px); }
body.gx-crisis-watch .board-top .eyebrow { color: #d2b575 !important; }
body.gx-crisis-watch .board-top h2 { font-size: var(--gx-h2) !important; color: #f3ecdd !important; margin: 0; max-width: none; }
body.gx-crisis-watch #freshness { font: 600 .6875rem/1.6 var(--gx-sans); letter-spacing: .1em; text-transform: uppercase; color: #c9c2b2; }
body.gx-crisis-watch .watch-filters { gap: 12px; margin-block: 30px 26px; }
body.gx-crisis-watch .watch-filters button { min-height: 44px; padding: 10px 18px; font: 600 .75rem/1.3 var(--gx-sans); letter-spacing: .06em; text-transform: uppercase; color: #e8deca; background: var(--gx-ink); border: 1px solid #ffffff1f; border-radius: var(--gx-r); box-shadow: var(--nv-raise); cursor: pointer; transition: box-shadow .15s, color .15s; }
body.gx-crisis-watch .watch-filters button:hover { color: #e5cf9d; }
body.gx-crisis-watch .watch-filters button:active, body.gx-crisis-watch .watch-filters button[aria-pressed=true] { background: var(--gx-ink); color: #e5cf9d; border-color: #d2b57599; box-shadow: var(--nv-inset); }
body.gx-crisis-watch .map-shell { padding: 8px; border: 0; border-radius: var(--gx-r); background: var(--gx-ink); box-shadow: var(--nv-inset); }
body.gx-crisis-watch .map-shell #incident-map { border-radius: 14px 14px 0 0; }
body.gx-crisis-watch .map-caption { border-radius: 0 0 14px 14px; background: #0c2133; font: 600 .6875rem/1.5 var(--gx-sans); letter-spacing: .08em; text-transform: uppercase; color: #c9c2b2; }
body.gx-crisis-watch .map-caption button { font: 600 .6875rem/1.4 var(--gx-sans); letter-spacing: .08em; text-transform: uppercase; color: #e5cf9d; cursor: pointer; padding: 8px 4px; }
body.gx-crisis-watch #map-fallback { left: 8px; right: 8px; font-size: var(--gx-body); }
body.gx-crisis-watch .report-list { background: var(--gx-ink); border: 0; box-shadow: var(--nv-inset); padding: 20px; }
body.gx-crisis-watch .list-eyebrow { font: 700 .6875rem/1.5 var(--gx-sans); letter-spacing: .14em; color: #d2b575; }
body.gx-crisis-watch .report-select { background: var(--gx-ink); border: 1px solid #ffffff1a; box-shadow: var(--nv-raise); color: #f3ecdd; cursor: pointer; transition: box-shadow .15s; }
body.gx-crisis-watch .report-select:active, body.gx-crisis-watch .report-select[aria-pressed=true] { background: var(--gx-ink); border-color: #d2b57599; box-shadow: var(--nv-inset); }
body.gx-crisis-watch .report-select small { font: 600 .6875rem/1.6 var(--gx-sans); letter-spacing: .06em; color: #c9c2b2; }
body.gx-crisis-watch .report-select strong { font: 500 1.375rem/1.2 var(--gx-serif); color: #f3ecdd; }
body.gx-crisis-watch .report-select em { font: 600 .6875rem/1.5 var(--gx-sans); letter-spacing: .08em; text-transform: uppercase; color: #e5cf9d; }
body.gx-crisis-watch .empty-reports { font-size: var(--gx-small); color: #e8deca; }
body.gx-crisis-watch .coverage-note { font-size: 1.0625rem; line-height: 1.5; color: #c9c2b2; margin-top: 22px; }
body.gx-crisis-watch .coverage-note a { color: #e5cf9d; }

/* the selected report: a raised panel; the response notes sit in an inset well */
body.gx-crisis-watch .report-section { box-sizing: border-box; width: var(--gx-frame); margin: 28px auto 0; padding: clamp(28px, 4.5vw, 60px); border-radius: var(--gx-r); background: var(--gx-ground); box-shadow: var(--gx-raise); }
body.gx-crisis-watch .detail-grid { gap: clamp(28px, 5vw, 64px); }
body.gx-crisis-watch .detail-grid h2 { font-size: var(--gx-h2) !important; margin: 0 0 16px; }
body.gx-crisis-watch .detail-grid h3 { font-size: 1.625rem !important; margin: 30px 0 10px; }
body.gx-crisis-watch .detail-grid p { font-size: 1.1875rem; line-height: 1.55; color: var(--gx-ink); }
body.gx-crisis-watch .detail-grid .report-meta { font: 600 .6875rem/1.6 var(--gx-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--gx-slate); margin: 0 0 8px; }
body.gx-crisis-watch .detail-grid .eyebrow { margin-bottom: 12px; }
body.gx-crisis-watch .implications { border: 0; border-radius: var(--gx-r); background: var(--gx-ground); box-shadow: var(--gx-inset); padding: clamp(22px, 3vw, 34px); }
body.gx-crisis-watch .implications h3:first-of-type { margin-top: 0; }
body.gx-crisis-watch .action-list { font-size: 1.125rem; line-height: 1.55; color: var(--gx-ink); }
body.gx-crisis-watch .action-list li::marker { color: var(--gx-gold); font-family: var(--gx-sans); font-weight: 600; }
body.gx-crisis-watch .deployment-status { font: italic 400 1.0625rem/1.5 var(--gx-serif) !important; color: var(--gx-slate) !important; border-top-color: var(--gx-border); }
body.gx-crisis-watch .report-uncertainty { background: var(--gx-ground); border: 0; border-radius: 14px; box-shadow: var(--gx-inset); padding: 18px 22px; }
body.gx-crisis-watch .history-entry { border-left-color: var(--gx-gold); }
body.gx-crisis-watch .history-entry strong { font: 700 .6875rem/1.5 var(--gx-sans); letter-spacing: .1em; text-transform: uppercase; color: var(--gx-gold); }
body.gx-crisis-watch .detail-source { font: 600 .75rem/1.5 var(--gx-sans); letter-spacing: .06em; text-transform: uppercase; color: var(--gx-ink); text-decoration: none; border-bottom: 1px solid var(--gx-gold); padding-bottom: 2px; }
body.gx-crisis-watch .detail-source:hover { color: var(--gx-gold-deep); }
body.gx-crisis-watch .report-sources li { margin-bottom: 10px; }
body.gx-crisis-watch .location-note { font-style: italic; font-size: 1.0625rem !important; color: var(--gx-slate) !important; }

/* the two watches: a raised panel */
body.gx-crisis-watch .two-watches { box-sizing: border-box; width: var(--gx-frame); margin: 28px auto 0; padding: clamp(28px, 4.5vw, 60px); border: 0; border-radius: var(--gx-r); background: var(--gx-ground); box-shadow: var(--gx-raise); }
body.gx-crisis-watch .two-watches h2 { font-size: var(--gx-h2) !important; }
body.gx-crisis-watch .two-watches h3 { font-size: var(--gx-h3) !important; margin: 14px 0 12px; }
body.gx-crisis-watch .two-watches p { font-size: 1.1875rem; line-height: 1.55; color: var(--gx-slate); }
body.gx-crisis-watch .two-watches small { display: inline-block; margin-top: 10px; font: 600 .6875rem/1.6 var(--gx-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--gx-gold-deep); }

/* keep perspective: the inset closing card with the star; the two destinations are raised */
body.gx-crisis-watch .watch-resources { box-sizing: border-box; width: var(--gx-frame); margin: 28px auto 56px; padding: clamp(32px, 5vw, 64px); gap: clamp(20px, 3vw, 32px); border-radius: var(--gx-r); background: var(--gx-ground); box-shadow: var(--gx-inset); align-items: stretch; }
body.gx-crisis-watch .watch-resources > div { align-self: center; }
body.gx-crisis-watch .watch-resources > div::before { content: "✦"; display: block; font-size: 1.5rem; line-height: 1; color: var(--gx-gold); margin-bottom: 16px; }
body.gx-crisis-watch .watch-resources h2 { font-size: var(--gx-h3) !important; }
body.gx-crisis-watch .watch-resources > a { border: 0; padding: 26px 28px; border-radius: var(--gx-r); background: var(--gx-ground); box-shadow: var(--gx-raise); color: var(--gx-ink); transition: box-shadow .15s; }
body.gx-crisis-watch .watch-resources > a:hover { box-shadow: var(--gx-raise-sm); }
body.gx-crisis-watch .watch-resources > a:active { box-shadow: var(--gx-inset); }
body.gx-crisis-watch .watch-resources strong { font: 600 .8125rem/1.5 var(--gx-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--gx-ink); }
body.gx-crisis-watch .watch-resources span { font-size: 1.1875rem; line-height: 1.45; color: var(--gx-slate); }

/* footer lines up with the frame */
body.gx-crisis-watch .watch-footer { box-sizing: border-box; width: var(--gx-frame); font: 600 .75rem/1.5 var(--gx-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--gx-slate); }

@media (max-width: 850px) { body.gx-crisis-watch .watch-intro.gx-hero { grid-template-columns: 1fr; } }
@media (max-width: 600px) {
  body.gx-crisis-watch .watch-intro h1 span { font-size: var(--gx-h1); }
  body.gx-crisis-watch .watch-filters button { padding: 10px 14px; font-size: .6875rem; }
  body.gx-crisis-watch .watch-resources > a { border-top: 0; padding: 22px; }
  body.gx-crisis-watch .map-caption { font-size: .625rem; }
}
