.map-status-stack{position:absolute;z-index:9;top:12px;left:12px;max-width:calc(100% - 90px);display:flex;flex-direction:column;align-items:flex-start;gap:7px;pointer-events:none}
.map-status-stack>*{pointer-events:auto}
.map-status-stack .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.map-status-stack .weather-legend,.immersive .map-status-stack .weather-legend{position:static;max-width:min(260px,100%);width:auto;margin:0}
.immersive .map-status-stack{position:fixed;top:max(70px,calc(env(safe-area-inset-top) + 62px));left:12px}
#phenomena-status{min-height:44px;border-radius:20px;border:1px solid #51616a;padding:9px 13px;background:#0d2630ed;color:#eddcae;box-shadow:0 4px 18px #0003;font-size:13px}
#phenomena-status[hidden],.phenomena-panel[hidden]{display:none!important}
.phenomena-panel{position:absolute;z-index:85;top:12px;left:12px;bottom:14px;width:min(370px,calc(100% - 24px));box-sizing:border-box;max-height:650px;background:#10272ff7;border:1px solid #4b6269;border-radius:20px;padding:18px;box-shadow:0 16px 54px #0008;overflow:auto;overscroll-behavior:contain;color:#d6e2df;scrollbar-width:thin}
.phenomena-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}
.phenomena-heading h2{margin:4px 0 0;font-size:27px;line-height:1.1;color:#f1eee3}
.phenomena-heading>button{min-width:44px;min-height:44px;font-size:24px}
.phenomena-heading .eyebrow{font-size:10px}
#phenomena-intro{font-size:13px;line-height:1.55;color:#b2c6c6}
.phenomena-toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:46px;border-bottom:1px solid #32505a;font-size:14px;cursor:pointer}
.phenomena-toggle input{accent-color:#e6c17a;width:22px;height:22px;flex:none;margin:8px}
.phenomena-toggle:has(input:disabled){opacity:.5}
.phenomena-key{display:grid;grid-template-columns:8px 1fr;gap:9px;margin:18px 0;font-size:11px;color:#b8ccca;align-items:center}
.phenomena-red,.phenomena-yellow{height:8px;width:8px;border-radius:50%;background:#ff776f}.phenomena-yellow{background:#f1c75b}
.phenomena-results{border-top:1px solid #36525a;padding:13px 0}
.phenomena-results-heading{display:flex;justify-content:space-between;gap:10px;align-items:center}
.phenomena-results-heading h3{font-family:inherit;font-size:15px;font-weight:600;line-height:1.4;margin:0;flex:1}
.phenomena-results-heading button{font-size:21px;min-width:44px;min-height:44px}
.phenomena-state,.phenomena-note{color:#abbfbe;font-size:14px;line-height:1.6;margin:6px 0 12px}
.phenomena-filter{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;margin:8px 0}
.phenomena-filter select{color:#efdeb7;background:#09202a;border:1px solid #48616a;border-radius:9px;padding:10px;font-size:14px;min-height:44px}
.phenomena-list{display:grid;gap:5px}
.phenomena-event{display:grid;grid-template-columns:24px 1fr 9px;gap:10px;align-items:center;text-align:left;padding:12px 10px;border:1px solid #36535d;background:#09212a;border-radius:12px;color:#e4ece6;min-height:62px}
.phenomena-event:hover{background:#16343d;border-color:#bdac79}
.phenomena-event:focus-visible,#phenomena-status:focus-visible,.phenomena-toggle:focus-within{outline:2px solid #ebc477;outline-offset:3px}
.phenomena-event strong{display:block;font-size:14px;font-weight:600;line-height:1.45;overflow-wrap:anywhere}
.phenomena-event small{display:block;font-size:12px;color:#acbebd;margin-top:4px}
.phenomena-event-symbol{color:var(--event-color);font-size:22px}
.phenomena-empty{padding:14px 0;font-size:13px;line-height:1.6;color:#c8d9d2}
.phenomena-provenance{margin-top:12px;border-top:1px solid #28434d;padding-top:10px;font-size:12px}
.phenomena-provenance summary,.phenomena-detail summary{cursor:pointer;min-height:30px;color:#e0ca95;line-height:1.5}
.phenomena-source{padding:11px 0;border-bottom:1px solid #2b4650;font-size:12px;overflow-wrap:anywhere}
.phenomena-source a{color:#c9d7ce;text-decoration:underline;text-underline-offset:3px}
.phenomena-source small,.phenomena-source strong{display:block;font-size:11px;line-height:1.6;margin-top:4px;color:#aabfbd}
.phenomena-source strong,.phenomena-warning{color:#edc36e}
.phenomena-back{min-height:44px;margin-bottom:12px;font-size:13px;color:#e7cc92}
.phenomena-badge{color:var(--event-color);font-size:12px}
.phenomena-detail h3{font-size:26px;line-height:1.2;margin:12px 0;color:#f3ecd8}
.phenomena-detail p{font-size:13px;line-height:1.6}
.phenomena-detail dl{display:grid;gap:10px;padding:14px 0;margin:0;border-block:1px solid #37515c}
.phenomena-detail dl>div{display:flex;gap:10px;justify-content:space-between;font-size:13px}
.phenomena-detail dd{margin:0;color:#e6cf99;text-align:right}
.phenomena-detail dt{color:#b4c8c6}
.phenomena-detail details{margin:14px 0}
.phenomena-detail details p{white-space:pre-line}
.phenomena-track-key{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.phenomena-track-key>span{width:26px;border-top:2px solid #ff776f}
.phenomena-track-key>span.forecast{border-top-style:dashed}
.immersive .phenomena-panel{position:fixed;top:70px;bottom:auto;left:12px;max-height:calc(100dvh - 94px)}
.immersive:has(#phenomena-panel:not([hidden])) .map-status-stack,.immersive:has(#map-controls:not([hidden])) .map-status-stack{visibility:hidden}
@media(max-width:700px){
 .phenomena-panel{max-height:min(530px,65dvh);top:auto;bottom:12px;left:12px;right:12px;width:auto;padding:16px}
 .immersive .phenomena-panel{top:auto;bottom:max(14px,env(safe-area-inset-bottom));max-height:64dvh;left:12px;right:12px;width:auto;border-radius:22px}
 .phenomena-heading h2{font-size:25px}
}
@media(prefers-reduced-motion:reduce){.phenomena-panel,.phenomena-event{transition:none}}