/* Topbar "Tropical" dropdown (ui/tropicalPanel.js) -- same fixed-dropdown pattern as nwsAlerts.css. */
.tropical-panel {
    position: fixed;
    top: calc(var(--topbar-h) + 8px);
    left: 12px;
    z-index: 100001;
    width: min(340px, calc(100vw - 24px));
    max-height: calc(100vh - var(--topbar-h) - 24px);
    overflow-y: auto;
    background: var(--panel-bg);
    border: 1px solid var(--panel-border);
    border-radius: 7px;
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.48);
    color: var(--text-light);
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.tropical-panel[hidden] { display: none; }
.tropical-header { font-weight: bold; font-size: 14px; padding-bottom: 4px; border-bottom: 1px solid var(--panel-border); }
.tropical-storms { display: flex; flex-direction: column; gap: 6px; }
.tropical-storm { border-left: 3px solid #cfd5dc; padding: 2px 0 2px 8px; }
.tropical-class-TS { border-left-color: #f5a300; }
.tropical-class-HU { border-left-color: #e3141b; }
.tropical-class-TD { border-left-color: #2e9bff; }
.tropical-storm-head {
    display: block; width: 100%; text-align: left; padding: 0; border: 0; background: none; cursor: pointer;
    font: inherit; font-size: 13px; font-weight: 600; color: white;
}
.tropical-storm-head:hover, .tropical-storm-head:focus-visible { color: var(--mint, #43d2aa); }
.tropical-fly { font-size: 10px; font-weight: 400; color: var(--text-muted, #9aa3ad); margin-left: 4px; }
.tropical-storm-detail { font-size: 11px; color: var(--text-muted, #9aa3ad); }
.tropical-storm-detail a { color: var(--mint, #43d2aa); }
.tropical-empty { font-size: 12px; font-style: italic; color: var(--text-muted, #9aa3ad); }
.tropical-controls { display: flex; flex-direction: column; gap: 4px; border-top: 1px solid var(--panel-border); padding-top: 6px; font-size: 12px; }
.tropical-sub { display: flex; flex-direction: column; gap: 4px; padding-left: 20px; }
.tropical-sub[hidden] { display: none; }
.tropical-row { display: flex; align-items: center; gap: 6px; cursor: pointer; }
.tropical-row select { margin-left: auto; font-size: 11px; }
.tropical-status { font-size: 11px; color: var(--text-muted, #9aa3ad); }
.tropical-status.tropical-warn { color: #f59e0b; }
.tropical-subtitle { font-size: 11px; line-height: 1.35; color: var(--text-muted, #9aa3ad); border-top: 1px solid var(--panel-border); padding-top: 6px; }