.toolbar select{max-width:135px;font-size:11px}.toolbar #historyOpen,.toolbar #notificationOpen{font-size:11px}.spread-bar{display:flex;justify-content:space-between;align-items:center;gap:6px;margin-top:5px;font-size:10px;color:#b3d8e9}.spread-bar button{font-size:9px;padding:2px 6px}.rain-timeline{display:flex;height:20px;gap:2px;margin:7px 0 14px}.rain-timeline>span{flex:1;position:relative;border-radius:2px;min-width:0}.rain-timeline small{position:absolute;top:19px;left:0;font-size:8px;color:#9cb0c4}.rain-timeline>span:nth-child(even) small{display:none}#rainDirection{font-size:10px;color:#9cb5c9;margin-top:3px}.rain-outlook{display:block;font-size:11px}#rainTimingMessage{color:#86e2ca;font-size:13px;margin:5px 0 12px}.overview #modeStatus{font-size:11px;color:#89dcc9;margin-left:15px}#stormOverview{display:none}body.storm-mode #stormOverview{display:block;padding:6px 10px;background:#342b20;border-radius:5px;color:#fbd48a;font-size:11px;margin-bottom:8px}.feature-table{width:100%;border-collapse:collapse;font-size:12px}.feature-table th,.feature-table td{text-align:left;padding:9px;border-bottom:1px solid #2e4459}.feature-table th{position:sticky;top:0;background:#182b3f}.feature-table-wrap{max-height:62vh;overflow:auto}.feature-table .bad{background:#483b2522}#historyChart svg{display:block;width:100%;height:auto}#historyChart{min-height:180px}.history-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:10px}#historySummary{font-size:12px;color:#aec7da}.event-list{list-style:none;margin:10px 0;padding:0;max-height:250px;overflow:auto}.event-list li,#eventItems article{border-left:3px solid #456c8f;background:#172b40;padding:8px 12px;margin-bottom:7px}.event-list time,#eventItems time{font-size:10px;color:#a4b6c8;margin-right:12px}.event-list strong{font-size:12px}.event-list p{font-size:11px;color:#acbed0;margin:3px 0}.event-caution{border-left-color:#f5c363!important}.event-danger{border-left-color:#ff647d!important}#eventItems h3{font-size:19px;margin:4px 0}#eventItems p{font-size:13px;color:#c1d3e1}#eventItems{max-height:65vh;overflow:auto}.event-foot{display:flex;justify-content:space-between;margin-top:15px;align-items:center}#eventCountdown{font-size:12px;color:#6fddc5}#healthSummary{font-size:9px;color:#9cb6c9;margin-bottom:4px}#notificationOpen{font-variant-numeric:tabular-nums}body.storm-mode .brand-icon{color:#ffca62}
@media(min-width:1200px){
 #chart{height:79px}.grid{grid-template-rows:250px 400px 170px}#map{height:175px}.rain-outlook{font-size:10px}.rain-timeline{margin-top:5px;margin-bottom:15px;height:14px}.rain-timeline small{top:14px}.rain-test{float:right;margin-top:-21px}#sources{gap:4px}.source{padding:3px 6px}.source small{font-size:8px}.sources .section-top{margin-bottom:3px}
 body.storm-mode .grid{grid-template-columns:1.2fr 1.2fr 1.15fr 1fr}body.storm-mode .typhoon{grid-column:1/3;grid-row:1/3}body.storm-mode .forecast{grid-column:3/5;grid-row:1}body.storm-mode .radar{grid-column:3;grid-row:2}body.storm-mode .current{grid-column:4;grid-row:2}body.storm-mode .weekly,body.storm-mode .official{display:none}body.storm-mode .typhoon-image{height:450px}body.storm-mode .wind-summary p{font-size:12px}body.storm-mode #map{height:135px}body.storm-mode .typhoon-selector{margin-bottom:10px}body.storm-mode .typhoon-selector select{font-size:14px}body.storm-mode .typhoon .section-top h2{font-size:18px}body.storm-mode .grid{grid-template-rows:250px 370px 170px}
}
@media(max-width:1199px){.toolbar{flex-wrap:wrap;justify-content:flex-end}.toolbar select{max-width:115px}.rain-timeline small{font-size:7px}.spread-bar{font-size:9px}body.storm-mode .typhoon{order:-1}body.storm-mode .typhoon-image{height:240px}body.storm-mode .typhoon{grid-column:1/3}body.storm-mode #stormOverview{font-size:10px}}
@media(max-width:650px){.toolbar{max-width:190px;gap:5px}.toolbar button{padding:4px 7px}.toolbar select{font-size:10px;padding:3px 4px}h1 span{font-size:12px}.overview{gap:5px}.overview #modeStatus{margin-left:0;display:block;font-size:10px}.overview #sync{font-size:9px;text-align:right}.history-toolbar{display:block}.feature-table{font-size:10px}.feature-table th,.feature-table td{padding:6px}.rain-timeline>span small{font-size:7px}.event-foot{gap:8px}}
