*{box-sizing:border-box}body{margin:0;background:#fff;color:#203545;font:15px/1.55 system-ui,-apple-system,Arial,sans-serif}main{max-width:1100px;margin:auto;padding:20px}header{background:#112735;border-top:4px solid #ca293c;color:white;padding:24px;border-radius:10px}header h1{font-size:30px;line-height:1.15;margin:8px 0 12px}header p{margin:0}.eyebrow{color:#f6bdc6;font-size:11px;font-weight:750;letter-spacing:1.8px}.controls{display:flex;gap:14px;align-items:end;flex-wrap:wrap;margin:22px 0 10px}label{display:flex;flex:1;flex-direction:column;gap:6px;font-weight:650;font-size:13px}select,button{font:inherit;min-height:44px;padding:9px 12px;border:1px solid #bac9d3;border-radius:6px;color:#18354a;background:#fff;max-width:100%}button{cursor:pointer;font-weight:650}button:hover{background:#eaf0f5}button:disabled{opacity:.5;cursor:default}select{width:100%}#status{font-size:13px;color:#4f6574;min-height:20px;margin:8px 0}#warning{padding:12px;background:#fff2d6;border-left:4px solid #b47711;border-radius:4px}.map-wrap{background:#edf3f7;border:1px solid #d5dfe7;border-radius:8px;overflow:hidden}canvas{display:block;width:100%;height:auto;touch-action:pan-y}#point{font-size:12px;min-height:20px;margin:4px 12px 10px;color:#425d70}.time-panel{padding:16px;background:#f2f6f8;border-radius:8px;margin-top:14px}.time-label,.range-label,.playback{display:flex;justify-content:space-between;gap:12px;align-items:center}.time-label{flex-wrap:wrap}#valid{font-size:16px}#lead{font-size:13px;color:#536777}input[type=range]{width:100%;height:40px;accent-color:#b91f36;cursor:pointer}.range-label{font-size:11px;color:#526777}.playback{justify-content:center;flex-wrap:wrap;margin-top:14px}#play{background:#bd2439;color:white;border-color:#bd2439}#explanation{padding:0 2px;font-size:14px}details{padding:12px 16px;border:1px solid #d8e2e9;border-radius:6px}summary{cursor:pointer;font-weight:650;min-height:24px}details p,footer{font-size:12px;color:#506270}footer{padding-top:14px}a{color:#165783;text-underline-offset:3px}button:focus-visible,select:focus-visible,input:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #cb293e;outline-offset:3px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:550px){main{padding:10px}header{padding:18px}header h1{font-size:25px}.controls{gap:10px}.controls label{flex-basis:100%}#refresh{width:100%}.time-label{display:block}#lead{display:block}.playback{gap:6px}.playback button{font-size:12px;padding:8px 10px}#valid{font-size:14px}}

.model-guide{background:#f0f5f8;border-left:4px solid #254c68;padding:8px 16px;margin:16px 0;font-size:14px;line-height:1.6}.model-guide p{margin:8px 0}

.forecast-graphic{border:1px solid #c3d2dc;border-radius:10px;overflow:hidden}.forecast-graphic .time-panel{margin:0;border-radius:0;padding:14px 16px;border-bottom:1px solid #c3d2dc}.forecast-graphic .map-wrap{border:0;border-radius:0}.forecast-graphic .playback{margin-top:10px}#play{min-width:150px}

#export-video{border-color:#165783;color:#165783}.export-panel{background:#f2f6f8;padding:0 16px}.export-panel p{margin:0;font-size:13px}.export-panel p:not(:empty){padding:10px 0}#video-download:not([hidden]){display:inline-block;background:#165783;color:white;border-radius:6px;padding:10px 18px;margin:0 0 12px;font-weight:650}

.forecast-window{border:1px solid #a9becb;border-radius:10px;margin:0 0 14px;padding:12px}.forecast-window legend{font-weight:700}.forecast-window .controls{margin:4px 0}.forecast-window select{width:100%}.forecast-window p{font-size:14px;margin:8px 0}.forecast-window small{display:block;color:#40586a}