.monitor-map-panel,.hazard-panel,.volcano-panel,.weather-monitor,.national-counters,.resource-brief{border:1px solid var(--border);border-radius:4px;background:var(--panel);padding:12px;margin-bottom:12px;min-width:0}
.monitor-map-panel>.group-heading,.hazard-panel>.group-heading,.volcano-panel>.group-heading,.weather-monitor>.group-heading,.national-counters>.group-heading,.resource-brief>.group-heading{margin-top:0;padding-top:0;border-bottom:1px solid var(--border);padding-bottom:10px;align-items:center;gap:10px;flex-wrap:wrap}
.monitor-map{display:block;width:100%;height:auto;aspect-ratio:2;max-height:480px;background:var(--canvas);border:1px solid var(--border)}
.monitor-map a:hover g{stroke:var(--text);stroke-width:1.5}
.monitor-legend{display:flex;flex-wrap:wrap;gap:8px 20px;font-size:10px;color:var(--muted);padding-top:10px}
.monitor-legend span:nth-child(1){color:var(--sem-green)}.monitor-legend span:nth-child(2){color:var(--sem-blue)}.monitor-legend span:nth-child(3){color:var(--sem-purple)}
.monitor-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:12px 0;border:1px solid var(--border);background:var(--surface)}
.monitor-stats>div{padding:12px;border-right:1px solid var(--border);min-width:0}.monitor-stats>div:last-child{border-right:0}
.monitor-stats span,.monitor-stats small{font-size:10px;color:var(--secondary);display:block;line-height:1.5}
.monitor-stats strong{display:block;font-size:23px;font-weight:550;font-variant-numeric:tabular-nums;line-height:1.3;margin:7px 0;color:var(--tone,var(--text));overflow-wrap:anywhere}
.monitor-stats small{color:var(--muted)}
.monitor-controls{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin:12px 0}
.monitor-controls label,.weather-monitor label,.monitor-map-panel label{font-size:11px;display:flex;align-items:center;gap:8px;color:var(--secondary)}
.monitor-controls>span{margin-left:auto;font-size:10px;color:var(--muted)}
.semantic-tag{display:inline-flex;color:var(--tone,var(--secondary));background:color-mix(in srgb,var(--tone,var(--secondary)) 8%,var(--surface));border:1px solid color-mix(in srgb,var(--tone,var(--secondary)) 30%,var(--border));padding:3px 5px;border-radius:3px;font-size:10px;white-space:nowrap}
.hazard-table{min-width:780px;width:100%;table-layout:fixed}.hazard-table th:nth-child(1){width:13%}.hazard-table th:nth-child(2){width:38%}.hazard-table th:nth-child(3){width:23%}.hazard-table th:nth-child(4),.hazard-table th:nth-child(5){width:13%}
.hazard-table td{padding:10px 7px;font-size:11px;line-height:1.55;vertical-align:top}.hazard-table td a{color:var(--text)}.hazard-table small{display:block;font-size:10px;color:var(--muted);margin-top:4px}
.volcano-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 18px}.volcano-grid article{padding:12px 0;border-bottom:1px solid var(--border);min-width:0}.volcano-grid article>div{display:flex;justify-content:space-between;gap:8px;align-items:center}.volcano-grid time,.volcano-grid p,.volcano-grid small{font-size:10px;color:var(--muted)}.volcano-grid h3{font-size:13px;line-height:1.45;margin:10px 0;color:var(--text)}.volcano-grid a:hover h3{color:var(--accent)}
.weather-monitor-table{min-width:960px;width:100%}.weather-monitor-table th,.weather-monitor-table td{padding:9px 6px;font-size:11px;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}.weather-monitor-table td:first-child,.weather-monitor-table th:first-child{text-align:left}.weather-monitor-table small{display:block;font-size:10px;color:var(--muted);margin-top:4px}.weather-monitor-table td:nth-child(4){color:var(--sem-teal)}.weather-monitor-table td:nth-child(5),.weather-monitor-table td:nth-child(7){color:var(--sem-cyan)}.weather-monitor-table td:nth-child(8){color:var(--sem-blue)}
.national-counters summary{cursor:pointer;font-size:11px;color:var(--sem-purple)}.national-counters details>a{font-size:11px;color:var(--blue)}.national-counters .monitor-stats strong{font-size:21px}.national-counters .monitor-stats>div:first-child strong{color:var(--sem-purple)}
.resource-brief-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.resource-brief article{min-width:0}.resource-brief h3{font-size:13px;display:flex;align-items:center;gap:8px}.resource-brief article>strong{display:block;font-size:25px;font-weight:550;margin:10px 0 4px;font-variant-numeric:tabular-nums}.resource-brief article>span,.resource-brief article>small{font-size:10px;color:var(--muted)}.resource-brief dl{margin:14px 0;display:grid;gap:8px}.resource-brief dl>div{display:flex;justify-content:space-between;gap:12px;font-size:11px}.resource-brief dt{color:var(--secondary)}.resource-brief dd{margin:0;text-align:right;font-variant-numeric:tabular-nums}
@media(min-width:1700px){.volcano-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:900px){.volcano-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.national-counters .monitor-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.national-counters .monitor-stats>div{border-bottom:1px solid var(--border)}}
@media(max-width:600px){.monitor-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.monitor-stats>div{padding:10px;border-bottom:1px solid var(--border)}.monitor-stats>div:nth-child(2n){border-right:0}.monitor-stats>div:nth-last-child(-n+2){border-bottom:0}.monitor-stats strong{font-size:20px}.monitor-controls>span{margin-left:0}.monitor-map{min-height:220px}.volcano-grid,.resource-brief-grid{grid-template-columns:1fr}.resource-brief article+article{border-top:1px solid var(--border);padding-top:8px}.national-counters .monitor-stats strong{font-size:18px}}

.weather-forecast{grid-column:1/-1;margin-top:10px;border-top:1px solid var(--border);padding-top:10px}.weather-forecast summary{font-size:11px;color:var(--sem-cyan);cursor:pointer}.weather-forecast>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px}.weather-forecast section>strong{font-size:11px}.weather-forecast section dl{display:grid;grid-template-columns:1fr;gap:6px}.weather-forecast dt,.weather-forecast dd{font-size:10px}@media(max-width:600px){.weather-forecast>div{grid-template-columns:1fr}}

.weather-monitor>.table-wrap{max-height:460px;overflow:auto}.hazard-panel>.table-wrap{max-height:640px;overflow:auto}.weather-monitor th,.hazard-panel th{position:sticky;top:0;background:var(--panel);z-index:1}.weather-monitor>.table-wrap,.hazard-panel>.table-wrap{scrollbar-width:thin;scrollbar-color:var(--border-strong) var(--surface)}
