/* IMCC thematic intelligence panels — section 01 holds editable theme values. */
:root {
  --sd-background: #f3f7fa;
  --sd-card: #ffffff;
  --sd-ink: #18314a;
  --sd-muted: #61778c;
  --sd-subtle: #91a3b1;
  --sd-line: #e2ebf1;
  --sd-accent: #177cb7;
  --sd-accent-soft: #e6f3fa;
  --sd-blue: #3f97cf;
  --sd-fire: #cf5c50;
  --sd-flood: #478dbd;
  --sd-weather: #8571b5;
  --sd-red: #a84b42;
  --sd-radius: 14px;
  --sd-shadow: 0 16px 42px rgba(22,57,82,.07);
}

/* 02. Masthead and shared controls */
.sd-heading { color:#f5faff; background:radial-gradient(ellipse at 78% 10%,#214b6c 0%,#102c46 48%,#091d31 100%); padding:32px 0 58px; }
.sd-heading .sr-breadcrumb { margin-bottom:35px; }
.sd-heading-row { display:flex; align-items:end; justify-content:space-between; gap:30px; }
.sd-heading-row > div { max-width:760px; }
.sd-heading h1 { font-size:clamp(30px,4vw,49px); font-weight:750; letter-spacing:-.046em; line-height:1.17; margin:0 0 14px; }
.sd-heading-row p:last-child { color:#bacddd; font-size:13px; line-height:1.7; margin:0; max-width:690px; }
.sd-map-link { display:inline-flex; align-items:center; gap:10px; flex:none; color:#eff8ff!important; font-size:12px; font-weight:700; border:1px solid rgba(197,224,244,.28); border-radius:9px; padding:11px 15px; }
.sd-map-link:hover { background:rgba(255,255,255,.08); }
.sd-main { padding:27px 0 84px; background:var(--sd-background); }
.sd-toolbar { display:flex; justify-content:space-between; align-items:center; gap:18px; margin-bottom:28px; }
.sd-periods { background:#eaf0f5; padding:4px; border-radius:9px; display:inline-flex; align-items:center; gap:2px; }
.sd-periods a { display:inline-flex; padding:8px 14px; border-radius:7px; font-weight:650; color:var(--sd-muted); font-size:11px; }
.sd-periods a:hover { color:var(--sd-ink); }
.sd-periods a.is-active { background:var(--sd-card); color:var(--sd-ink); box-shadow:0 2px 8px rgba(16,55,82,.06); }
.sd-updated { color:var(--sd-muted); font:11px/1.5 var(--sr-mono); }
.sd-updated i { margin-right:5px; color:var(--sd-accent); }
.sd-data-warning { padding:13px 17px; border-radius:10px; color:#805e28; border:1px solid #eadbbd; background:#fff8eb; margin-bottom:20px; display:flex; gap:10px; align-items:center; font-size:12px; }
.sd-overline { color:var(--sd-accent); font:10px var(--sr-mono); letter-spacing:.12em; margin:0 0 9px; }

/* 03. Review signals — avoid artificial severity labels */
.sd-attention { background:var(--sd-card); border:1px solid var(--sd-line); border-radius:var(--sd-radius); padding:27px; margin-bottom:47px; }
.sd-attention-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:24px; margin-bottom:20px; }
.sd-attention-heading h2 { font-size:23px; font-weight:750; letter-spacing:-.035em; margin:0 0 7px; }
.sd-attention-heading h2 i { color:var(--sd-accent); font-size:21px; margin-right:9px; }
.sd-attention-heading p:last-child { font-size:11px; color:var(--sd-muted); margin:0; }
.sd-attention-count { font:11px var(--sr-mono); white-space:nowrap; color:var(--sd-muted); background:var(--sd-background); border-radius:7px; padding:8px 11px; }
.sd-attention-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
.sd-signal { display:flex; flex-direction:column; min-height:165px; position:relative; padding:15px; border-radius:11px; background:#f5f8fb; border:1px solid transparent; gap:10px; }
.sd-signal:hover { border-color:#c2ddea; background:#eff7fc; }
.sd-signal-marker { display:grid; place-items:center; width:30px; height:30px; border-radius:9px; color:var(--sd-accent); background:#e2f0fa; }
.sd-signal-floods { color:var(--sd-flood); background:#e4f0f8; }
.sd-signal-weather { color:var(--sd-weather); background:#eeeafa; }
.sd-signal-earthquakes { color:var(--sd-fire); background:#fff1e7; }
.sd-signal-copy { display:flex; flex:1; flex-direction:column; gap:5px; }
.sd-signal-copy strong { color:var(--sd-ink); font-weight:650; font-size:12px; line-height:1.45; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.sd-signal-copy small { color:var(--sd-muted); font-size:10px; line-height:1.4; }
.sd-reason { margin-top:auto; font-size:10px; font-weight:650; color:var(--sd-accent); }
.sd-signal > i { position:absolute; right:14px; top:15px; color:var(--sd-subtle); font-size:12px; }
.sd-attention-empty { color:var(--sd-muted); font-size:12px; background:var(--sd-background); padding:16px; border-radius:9px; margin:0; }

/* 04. Hazard panels */
.sd-section-line { display:flex; align-items:end; justify-content:space-between; gap:30px; margin-bottom:24px; }
.sd-section-line h2 { font-size:28px; letter-spacing:-.04em; line-height:1.15; margin:0; }
.sd-section-line > p { margin:0; max-width:370px; color:var(--sd-muted); font-size:12px; line-height:1.6; }
.sd-panel-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.sd-panel { display:flex; flex-direction:column; background:var(--sd-card); border:1px solid var(--sd-line); border-radius:var(--sd-radius); padding:27px 28px 0; min-height:475px; min-width:0; }
.sd-panel-header { display:flex; align-items:center; gap:11px; min-height:45px; margin-bottom:15px; }
.sd-panel-icon { display:grid; place-items:center; width:43px; height:43px; font-size:20px; color:var(--sd-blue); background:#eaf5fc; border-radius:12px; }
.sd-fires .sd-panel-icon { color:var(--sd-fire); background:#fcefeb; }
.sd-floods .sd-panel-icon { color:var(--sd-flood); background:#e9f2fc; }
.sd-weather .sd-panel-icon { color:var(--sd-weather); background:#f0eefa; }
.sd-panel-source { font:9px/1.5 var(--sr-mono); letter-spacing:.085em; color:var(--sd-subtle); }
.sd-panel-expand { margin-left:auto; display:grid; place-items:center; border:1px solid var(--sd-line); width:30px; height:30px; border-radius:9px; color:var(--sd-accent)!important; }
.sd-panel-expand:hover { background:var(--sd-accent-soft); }
.sd-panel h3 { font-size:22px; font-weight:740; letter-spacing:-.035em; margin:0 0 5px; line-height:1.3; }
.sd-panel-lead { font-size:12px; color:var(--sd-muted); line-height:1.5; margin:0 0 24px; }
.sd-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin-bottom:24px; }
.sd-metrics > div { display:flex; flex-direction:column; justify-content:center; gap:5px; padding:16px 12px; border-radius:10px; background:#f3f7fa; min-height:86px; }
.sd-metrics strong { font-size:clamp(18px,2vw,26px); line-height:1.1; letter-spacing:-.04em; font-weight:750; color:var(--sd-ink); overflow-wrap:anywhere; }
.sd-metrics span { font-size:10px; color:var(--sd-muted); line-height:1.3; }
.sd-panel-details { flex:1; min-height:124px; }
.sd-mini-label { display:block; font:9px var(--sr-mono); letter-spacing:.10em; color:var(--sd-subtle); margin-bottom:10px; }
.sd-mini-row { display:flex; align-items:center; gap:10px; padding:10px 0; border-top:1px solid var(--sd-line); }
.sd-mini-row:first-of-type { border-top:0; }
.sd-mini-link:hover .sd-mini-text { color:var(--sd-accent); }
.sd-mini-link > i { margin-left:auto; color:var(--sd-subtle); }
.sd-mini-text { flex:1; font-size:11px; line-height:1.4; font-weight:600; color:var(--sd-ink); overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.sd-mini-text small { display:block; font-size:10px; font-weight:400; color:var(--sd-muted); }
.sd-earthquake-tag { flex:none; font:600 12px var(--sr-mono); color:var(--sd-fire); background:#fff2e9; border-radius:6px; padding:6px 8px; }
.sd-weather-tag { flex:none; font-size:9px; font-weight:700; color:#6153a0; background:#efecfb; padding:5px 8px; border-radius:5px; text-transform:uppercase; }
.sd-level-extreme { color:#9f473a; background:#fbece9; }
.sd-level-severe { color:#8f6323; background:#fff4dd; }
.sd-pip { display:inline-block; flex:none; width:7px; height:7px; border-radius:50%; background:var(--sd-blue); }
.sd-no-feed { font-size:12px; color:var(--sd-subtle); margin:0; padding:15px 0; }
.sd-feed-unavailable { background:#fff7e9; color:#88632b; padding:18px; border-radius:10px; font-size:12px; flex:1; }
.sd-panel-bottom { display:flex; align-items:center; justify-content:space-between; margin:20px -28px 0; padding:17px 28px; border-top:1px solid var(--sd-line); color:var(--sd-accent)!important; font-size:12px; font-weight:700; }
.sd-panel-bottom:hover { background:#f6fbff; }
.sd-panel-bottom i { margin-left:12px; }
.sd-bottom { margin-top:26px; border:1px solid var(--sd-line); border-radius:var(--sd-radius); padding:24px 28px; background:var(--sd-card); display:flex; align-items:center; justify-content:space-between; gap:24px; }
.sd-bottom h2 { font-size:17px; letter-spacing:-.025em; margin:0 0 5px; }
.sd-bottom p { font-size:11px; color:var(--sd-muted); margin:0; }
.sd-secondary-action { display:inline-flex; align-items:center; gap:10px; color:var(--sd-accent)!important; font-size:11px; font-weight:700; flex:none; border:1px solid #cfe4ef; border-radius:8px; padding:10px 14px; }
.sd-secondary-action:hover { background:var(--sd-accent-soft); }
.sd-footnote { display:flex; gap:9px; color:var(--sd-subtle); font-size:10px; line-height:1.7; margin:20px 0 0; }
.sd-footnote i { flex:none; }

/* 05. Real-data bar charts */
.sd-bars, .sd-chart-large { display:flex; align-items:end; gap:6px; height:86px; padding:8px 3px 0; }
.sd-chart-large { height:275px; padding:24px 5px 0; gap:9px; }
.sd-chart-bar { position:relative; flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:end; height:100%; gap:7px; }
.sd-chart-bar > div { background:linear-gradient(180deg,#e7897e,#cf5c50); width:min(85%,44px); min-height:2px; border-radius:5px 5px 1px 1px; }
.sd-chart-bar > span { font:9px var(--sr-mono); color:var(--sd-subtle); white-space:nowrap; }
.sd-chart-large .sd-chart-bar > div { width:min(76%,55px); }
.sd-chart-large .sd-chart-bar > span { font-size:10px; }
.sd-chart-note { color:var(--sd-subtle); font-size:10px; margin:11px 0 0; }
.sd-bars .sd-chart-note { margin-top:0; }

/* 06. Specialized thematic pages */
.sd-theme-heading { padding-bottom:45px; }
.sd-theme-title-icon { color:#8cd0f0; font-size:.68em; margin-right:8px; }
.sd-theme-nav { display:flex; flex-wrap:wrap; gap:7px; padding-bottom:23px; margin-bottom:22px; border-bottom:1px solid var(--sd-line); }
.sd-theme-nav a { padding:9px 13px; border-radius:8px; font-size:11px; font-weight:650; color:var(--sd-muted); background:#e9f0f5; }
.sd-theme-nav a.is-active { background:#196eaa; color:#fff; }
.sd-theme-nav a:hover:not(.is-active) { background:#daeaf4; color:var(--sd-accent); }
.sd-theme-method { display:flex; align-items:flex-start; gap:10px; font-size:11px; color:var(--sd-muted); background:#eaf2f8; padding:13px 16px; border-radius:9px; margin:0 0 21px; }
.sd-theme-method i { color:var(--sd-accent); flex:none; }
.sd-theme-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:22px; }
.sd-theme-metrics > div { background:var(--sd-card); border:1px solid var(--sd-line); border-radius:var(--sd-radius); padding:22px; display:flex; flex-direction:column-reverse; gap:15px; }
.sd-theme-metrics span { color:var(--sd-muted); font-size:11px; }
.sd-theme-metrics strong { color:var(--sd-ink); letter-spacing:-.05em; font-size:clamp(24px,2.7vw,35px); font-weight:750; }
.sd-theme-columns { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.95fr); gap:18px; align-items:start; }
.sd-theme-section { min-width:0; padding:26px; border-radius:var(--sd-radius); background:var(--sd-card); border:1px solid var(--sd-line); }
.sd-theme-section-head { margin-bottom:19px; }
.sd-theme-section-head h2 { font-size:19px; margin:0; line-height:1.25; letter-spacing:-.035em; }
.sd-theme-map { height:410px; border-radius:10px; overflow:hidden; background:#e5eff5; }
.sd-theme-records { display:flex; flex-direction:column; gap:0; }
.sd-theme-record { display:flex; align-items:flex-start; gap:11px; padding:14px 0; border-top:1px solid var(--sd-line); min-width:0; }
.sd-theme-record:first-child { border-top:0; }
a.sd-theme-record:hover strong { color:var(--sd-accent); }
.sd-theme-record-count { font:11px var(--sr-mono); color:var(--sd-subtle); padding-top:3px; flex:none; }
.sd-theme-record-body { display:flex; flex-direction:column; gap:5px; min-width:0; flex:1; }
.sd-theme-record-body strong { font-size:12px; line-height:1.4; font-weight:650; color:var(--sd-ink); overflow-wrap:anywhere; }
.sd-theme-record-body small { font-size:10px; color:var(--sd-muted); line-height:1.4; overflow-wrap:anywhere; }
.sd-theme-record-value { font:600 13px var(--sr-mono); color:var(--sd-accent); }
.sd-theme-record-action { color:var(--sd-accent)!important; flex:none; font-size:12px; margin-top:3px; }
.sd-theme-actions { border-top:1px solid var(--sd-line); margin-top:12px; padding-top:20px; }
.sd-theme-section .sd-chart-large { height:400px; }
.sd-map-popup { padding:9px 12px; background:rgba(255,255,255,.98); border:1px solid #c7dce9; border-radius:9px; box-shadow:0 8px 25px rgba(10,40,65,.16); max-width:240px; font:12px var(--sr-font); color:var(--sd-ink); }
.sd-map-popup strong { display:block; line-height:1.4; }
.sd-map-popup a { color:var(--sd-accent)!important; font-weight:700; font-size:11px; }
.sd-map-popup p { margin:5px 0 0; font-size:10px; color:var(--sd-muted); }

/* 07. Responsive */
@media (max-width:1100px) {
  .sd-attention-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .sd-panel { padding-inline:23px; }
  .sd-panel-bottom { margin-inline:-23px; padding-inline:23px; }
  .sd-theme-columns { grid-template-columns:1fr; }
  .sd-theme-map { height:380px; }
}
@media (max-width:800px) {
  .sd-heading-row { flex-direction:column; align-items:flex-start; }
  .sd-toolbar { flex-direction:column; align-items:flex-start; }
  .sd-attention-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .sd-section-line { flex-direction:column; align-items:flex-start; gap:11px; }
  .sd-panel-grid { grid-template-columns:1fr; }
  .sd-panel { min-height:440px; }
}
@media (max-width:600px) {
  .sd-heading { padding:25px 0 40px; }
  .sd-heading h1 { font-size:33px; }
  .sd-main { padding-top:20px; padding-bottom:56px; }
  .sd-attention { padding:18px; margin-bottom:35px; }
  .sd-attention-heading { flex-direction:column; gap:10px; }
  .sd-attention-heading h2 { font-size:21px; }
  .sd-attention-grid { grid-template-columns:1fr; }
  .sd-signal { min-height:0; flex-direction:row; padding:13px; }
  .sd-signal-marker { flex:none; }
  .sd-signal > i { display:none; }
  .sd-section-line h2 { font-size:26px; }
  .sd-panel { padding:20px 17px 0; }
  .sd-panel-bottom { margin-inline:-17px; padding-inline:17px; }
  .sd-metrics { gap:6px; }
  .sd-metrics > div { padding:11px 8px; }
  .sd-metrics strong { font-size:21px; }
  .sd-metrics span { font-size:9px; }
  .sd-bottom { flex-direction:column; align-items:flex-start; padding:21px; }
  .sd-theme-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .sd-theme-metrics > div { padding:17px; }
  .sd-theme-section { padding:19px; }
  .sd-theme-map { height:300px; }
  .sd-theme-section .sd-chart-large { height:280px; }
}
@media (prefers-reduced-motion:reduce) {
  .sd-periods a,.sd-panel-expand,.sd-signal { transition:none; }
}

/* Visible OpenFreeMap/OpenMapTiles/OSM credits in event and thematic maps. */
.imcc-map-credit-theme,.imcc-map-credit-detail{margin:7px 0 9px;line-height:1.4}
.imcc-map-credit-theme a,.imcc-map-credit-detail a{color:#1b6e9b!important;text-decoration:underline}
.imcc-map-credit-theme .imcc-basemap-credit,.imcc-map-credit-detail .imcc-basemap-credit{font-size:10px;color:#667c8a}
.imcc-map-error{padding:11px 14px;font-size:12px;color:#8b492c;background:#fff5ec;border:1px solid #f2d3bd;border-radius:8px;margin-top:8px}
.imcc-map-error[hidden]{display:none}