.typhoon-mode-button{width:100%;margin:8px 0 2px;min-height:42px;border:1px solid rgba(255,107,132,.35);border-radius:12px;background:linear-gradient(135deg,rgba(103,22,43,.42),rgba(22,52,78,.4));color:var(--text);display:grid;grid-template-columns:24px 1fr auto;align-items:center;gap:8px;padding:8px 10px;text-align:left;box-shadow:0 9px 25px rgba(0,0,0,.16)}.typhoon-mode-button:hover,.typhoon-mode-button.active{border-color:rgba(255,110,139,.75);background:linear-gradient(135deg,rgba(145,29,57,.54),rgba(26,73,104,.5));box-shadow:0 0 22px rgba(255,61,97,.17)}.typhoon-mode-button span{display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:rgba(255,255,255,.08);color:#ff7795;font-size:15px}.typhoon-mode-button b{font-size:9px}.typhoon-mode-button em{min-width:23px;height:23px;border-radius:999px;display:grid;place-items:center;background:#ff4f75;color:#fff;font-size:8px;font-style:normal;font-weight:900}
.typhoon-console{position:fixed;z-index:1210;right:12px;top:122px;width:min(390px,calc(100vw - 230px));max-height:calc(100vh - 236px);overflow:auto;padding:14px;border:1px solid rgba(255,122,147,.24);border-radius:20px;background:linear-gradient(160deg,rgba(8,23,38,.96),rgba(9,31,49,.92));box-shadow:0 22px 70px rgba(0,0,0,.42),0 0 35px rgba(255,54,95,.08);backdrop-filter:blur(22px);scrollbar-width:thin}.typhoon-console[hidden]{display:none}.typhoon-console-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.typhoon-console-heading .eyebrow{display:block;font-size:7px;color:#87a8bc;letter-spacing:.11em;text-transform:uppercase;font-weight:900}.typhoon-console-heading h2{margin:4px 0 0;font-size:17px}.typhoon-console-close{width:31px;height:31px;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:rgba(255,255,255,.05);font-size:17px}.typhoon-content{display:grid;gap:9px}.storm-selector{margin-top:8px}.section-label{display:block;margin-bottom:5px;color:#89a4b7;font-size:7px;text-transform:uppercase;letter-spacing:.09em;font-weight:900}.storm-selector-row{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}.storm-select{flex:0 0 auto;min-width:108px;padding:7px 9px;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:rgba(255,255,255,.045);color:var(--text);text-align:left;font-size:9px;font-weight:900}.storm-select small{display:block;margin-top:3px;color:#839caf;font-size:7px;font-weight:600}.storm-select.active{border-color:rgba(255,93,128,.72);background:rgba(118,24,49,.44)}
.storm-hero{margin-top:8px;padding:11px;border:1px solid rgba(255,255,255,.09);border-radius:14px;background:radial-gradient(circle at 12% 10%,rgba(255,70,104,.16),transparent 38%),linear-gradient(145deg,rgba(31,63,87,.37),rgba(9,25,41,.44))}.storm-title{display:flex;align-items:center;gap:10px}.storm-symbol{position:relative;flex:0 0 auto;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.04);box-shadow:0 0 25px rgba(255,70,110,.18)}.storm-symbol i{position:absolute;width:28px;height:7px;border-radius:999px;border:2px solid currentColor;border-left-color:transparent;border-bottom-color:transparent;transform-origin:center}.storm-symbol i:nth-child(1){transform:rotate(10deg)}.storm-symbol i:nth-child(2){transform:rotate(130deg)}.storm-symbol i:nth-child(3){transform:rotate(250deg)}.storm-symbol.watch{color:#ffd35b}.storm-symbol.warning{color:#ff8b4f}.storm-symbol.danger{color:#ff4e76}.storm-names{min-width:0;flex:1}.storm-names h3{margin:0;font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.storm-names p{margin:2px 0 0;color:#93adbf;font-size:8px}.freshness-badge{flex:0 0 auto;padding:5px 7px;border-radius:999px;font-size:7px;font-weight:900;text-transform:uppercase}.freshness-badge.live{color:#8ff0c1;background:rgba(54,210,150,.14)}.freshness-badge.recent{color:#9ce8ff;background:rgba(66,185,230,.14)}.freshness-badge.delayed{color:#ffe18f;background:rgba(255,205,69,.13)}.freshness-badge.stale,.freshness-badge.unavailable{color:#ffb1bc;background:rgba(255,78,105,.13)}.storm-summary{margin:8px 0 0;color:#cfe2ec;font-size:9px}.storm-source-time{display:flex;align-items:center;gap:7px;margin-top:8px;color:#7893a5;font-size:7px}.storm-source-time strong{color:#dcecf5;font-size:8px}.storm-source-time small{margin-left:auto}
.storm-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.storm-metric{padding:9px;border:1px solid rgba(255,255,255,.07);border-radius:11px;background:rgba(255,255,255,.035)}.storm-metric span{display:block;color:#7893a7;font-size:7px;text-transform:uppercase}.storm-metric strong{display:block;margin-top:4px;font-size:12px}.storm-metric small{display:block;margin-top:3px;color:#7f9caf;font-size:7px;line-height:1.3}.storm-status-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:9px;border:1px solid rgba(83,211,255,.13);border-radius:12px;background:rgba(19,68,91,.18)}.storm-status-item{display:grid;gap:2px}.storm-status-item span{color:#7391a4;font-size:7px}.storm-status-item strong{font-size:9px}.track-legend{grid-column:1/-1;display:flex;gap:12px;padding-top:5px;border-top:1px solid rgba(255,255,255,.07)}.track-legend-item{display:flex;align-items:center;gap:5px;color:#9ab2c1;font-size:7px}.track-legend-item i{width:25px;height:3px;border-radius:3px;background:#ffd15c}.track-legend-item.forecast i{background:repeating-linear-gradient(90deg,#ff5b86 0 6px,transparent 6px 10px)}.source-limitation{grid-column:1/-1;color:#718b9d;font-size:6.5px;line-height:1.35}.storm-track-timeline{min-width:0}.storm-track-scroll{display:flex;gap:5px;overflow-x:auto;padding-bottom:3px}.track-time-item{position:relative;flex:0 0 82px;padding:8px 7px 7px;border:1px solid rgba(255,255,255,.07);border-radius:10px;background:rgba(255,255,255,.03);color:var(--text);text-align:left}.track-time-item i{position:absolute;left:8px;top:0;width:20px;height:3px;background:#ffd15c}.track-time-item.forecast i{background:#ff5b86}.track-time-item time{display:block;color:#8ba5b5;font-size:7px}.track-time-item strong{display:block;margin-top:4px;font-size:9px}.track-time-item small{display:block;margin-top:2px;color:#6f899a;font-size:6px}.storm-actions{display:flex;gap:7px}.storm-action{flex:1;min-height:34px;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:rgba(255,255,255,.04);color:#cfe5ef;display:grid;place-items:center;padding:7px;text-decoration:none;font-size:8px;font-weight:800}.storm-action.primary{border-color:rgba(255,94,128,.5);background:rgba(126,26,52,.38);color:#ffdce4}.typhoon-empty{display:grid;justify-items:center;gap:8px;padding:28px 14px;text-align:center}.typhoon-empty-orb{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(111,204,255,.25);background:rgba(45,133,175,.12);color:#80dbff;font-size:22px}.typhoon-empty strong{max-width:260px;font-size:11px;line-height:1.45}.typhoon-empty small{color:#7390a4;font-size:7px}
.operational-typhoon-marker{position:relative!important;display:grid!important;place-items:center!important;background:transparent!important;border:none!important;color:#ff6c8a!important}.operational-typhoon-marker .typhoon-vortex{position:absolute;left:13px;top:4px;width:42px;height:42px;border-radius:50%;filter:drop-shadow(0 0 8px rgba(255,57,103,.55));animation:vortex-spin 5s linear infinite}.operational-typhoon-marker .typhoon-vortex i{position:absolute;left:7px;top:16px;width:29px;height:8px;border:2px solid currentColor;border-left-color:transparent;border-bottom-color:transparent;border-radius:999px;transform-origin:center}.operational-typhoon-marker .typhoon-vortex i:nth-child(2){transform:rotate(120deg)}.operational-typhoon-marker .typhoon-vortex i:nth-child(3){transform:rotate(240deg)}.operational-typhoon-marker b{position:absolute;top:45px;left:50%;transform:translateX(-50%);padding:3px 6px;border:1px solid rgba(255,255,255,.18);border-radius:7px;background:rgba(5,16,28,.9);color:#fff;font-size:7px;white-space:nowrap}.operational-typhoon-marker.selected{color:#ff315f!important}.operational-typhoon-marker.storm{color:#ffd35a!important}.operational-typhoon-marker.sts{color:#ffad4d!important}.operational-typhoon-marker.typhoon{color:#ff715b!important}.operational-typhoon-marker.severe,.operational-typhoon-marker.super{color:#ff315f!important}@keyframes vortex-spin{to{transform:rotate(360deg)}}.typhoon-map-tooltip{border:1px solid rgba(255,89,124,.38)!important;background:rgba(7,18,31,.94)!important;color:#fff!important;font-size:8px!important}.typhoon-map-tooltip:before{border-top-color:rgba(7,18,31,.94)!important}
@media(max-width:900px){.typhoon-console{right:8px;top:120px;width:min(390px,calc(100vw - 16px));max-height:calc(100vh - 222px)}.storm-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}.storm-metric{padding:7px}.storm-metric strong{font-size:10px}}@media(max-width:680px){.typhoon-console{left:6px;right:6px;top:116px;bottom:100px;width:auto;max-height:none;padding:11px;border-radius:16px}.typhoon-console-heading h2{font-size:14px}.storm-hero{padding:9px}.storm-symbol{width:36px;height:36px}.storm-symbol i{width:24px}.storm-names h3{font-size:15px}.storm-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.storm-status-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.storm-actions{position:sticky;bottom:0;padding-top:8px;background:linear-gradient(180deg,transparent,rgba(8,23,38,.98) 28%)}}@media(prefers-reduced-motion:reduce){.operational-typhoon-marker .typhoon-vortex{animation:none}}