:root{--ink:#172534;--muted:#5c6b7b;--blue:#095d92;--border:#e3e8ee;--mono:ui-monospace,SFMono-Regular,Consolas,monospace}
*{box-sizing:border-box}
body{margin:0;background:#fff;color:var(--ink);font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input,select{font:inherit;color:inherit}
button,a,input,select,summary{outline-offset:4px}
:focus-visible{outline:2px solid var(--blue)}
button,summary{cursor:pointer}
button:disabled{cursor:wait}
a{color:var(--blue);text-underline-offset:3px}
.topbar{max-width:1280px;margin:auto;padding:20px 32px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border)}
.brand{display:block;line-height:0}
.brand img{display:block;width:180px;height:60px;object-fit:contain}
.source-link{font-size:12px;text-decoration:none;color:var(--muted)}
main{max-width:1280px;margin:auto;padding:30px 32px 16px}
.intro{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px}
h1{font-size:28px;font-weight:600;letter-spacing:-.6px;line-height:1.2;margin:0 0 6px}
.intro p{margin:0;font-size:13px}.station-id{color:var(--muted);font-size:12px;margin-left:10px}
.controls{display:flex;flex-wrap:wrap;gap:18px;align-items:end;padding:18px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.control-label{display:block;font-size:12px;color:var(--muted);margin-bottom:6px}
.period-control{margin-right:auto}
.segmented{display:flex;gap:2px;padding:3px;background:#f3f5f7;border-radius:4px}
.segmented button{border:0;background:transparent;color:var(--muted);font-size:12px;padding:7px 12px;border-radius:2px;white-space:nowrap}
.segmented button.active{background:#fff;color:var(--blue);font-weight:600}
.segmented button:hover{color:var(--blue)}
.input-wrap{display:flex;border:1px solid var(--border);border-radius:3px;align-items:center;height:36px;padding-right:10px;gap:5px}
.input-wrap input{width:64px;min-width:0;border:0;background:transparent;padding:7px 0 7px 10px;font-variant-numeric:tabular-nums}
.input-wrap span{font-size:11px;color:var(--muted)}
.refresh,.primary,.error button,.mode-actions button{background:#fff;border:1px solid var(--border);border-radius:3px;padding:8px 12px;font-size:12px}
.refresh:hover,.primary:hover,.error button:hover,.mode-actions button:hover{background:#f3f5f7}
.period-options{width:100%;font-size:12px;color:var(--muted)}
.period-options summary{width:fit-content}.anchor-control{display:block;margin-top:10px}.anchor-control select{margin-left:10px;background:#fff;border:1px solid var(--border);border-radius:3px;padding:7px}
#custom-range{width:100%;gap:14px;align-items:center;flex-wrap:wrap;font-size:12px}#custom-range:not([hidden]){display:flex}
#custom-range input{margin-left:5px;padding:7px;border:1px solid var(--border);border-radius:3px}#custom-range span{color:var(--muted)}
.period-info{font-size:12px;color:var(--muted);margin:16px 0 22px}
.status,.error{font-size:13px;padding:12px 14px;background:#f3f6f9;border-left:3px solid var(--blue);margin-bottom:20px}
.status.warning{background:#fff8e8;border-color:#aa761c;color:#715318}.error{background:#fff4f1;border-color:#b45a42}.error button{margin:4px 8px 0 0}
.mode-actions{margin-bottom:16px}
.summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.metric{padding:0 20px 0 0;border-right:1px solid var(--border)}.metric:last-child{border:0;padding-right:0}
.metric-label{font-size:12px;color:var(--muted)}
.metric-value{display:flex;align-items:baseline;gap:8px;font-size:34px;font-weight:500;line-height:1.2;letter-spacing:-.8px;font-variant-numeric:tabular-nums;margin:10px 0 6px}
.metric-unit{font-size:12px;font-weight:400;letter-spacing:0;color:var(--muted)}.metric p{margin:0;font-size:11px;color:var(--muted)}
.direction-arrow{font-size:25px;align-self:center;display:inline-block;color:var(--blue)}
.observation-note{display:flex;justify-content:space-between;gap:12px;font-size:11px;color:var(--muted);margin:20px 0 30px}
.chart-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.panel{min-width:0;border-top:1px solid var(--border);padding-top:20px}
.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:34px}
h2{margin:0;font-size:17px;font-weight:600;letter-spacing:-.2px}
.rose-chart{height:360px;width:100%;margin:10px 0}.legend{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 12px;font-size:11px;color:var(--muted)}.legend span{display:flex;align-items:center;gap:5px}.legend i{width:9px;height:9px;border-radius:1px}
.distribution-note{font-size:11px;color:var(--muted);text-align:center;margin:16px 0 0}
.table-scroll{overflow:auto;margin-top:18px}table{width:100%;border-collapse:separate;border-spacing:3px;text-align:center;font-size:11px;font-variant-numeric:tabular-nums}
th{font-weight:500;color:var(--muted)}thead th{font-size:10px;padding-bottom:7px;white-space:nowrap}tbody th{text-align:left;font:10px var(--mono);width:36px}
#heatmap td{padding:4px 5px;min-width:42px;border-radius:2px;cursor:help}#heatmap td:hover{outline:1px solid var(--blue)}
.heat-legend{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:14px;font-size:10px;color:var(--muted)}.gradient{height:6px;width:100px;background:linear-gradient(90deg,#f1f5fa,#aecce1,#095d92)}
.series-panel{margin-top:30px}.series-legend{display:flex;gap:16px;font-size:11px;color:var(--muted)}.series-legend>span{display:flex;align-items:center;gap:5px}.line-key{display:inline-block;width:17px;height:2px;background:var(--blue)}.gust-key{background:#91b4cf}.threshold-key{width:17px;border-top:1px dashed #a97632}
.series-chart{height:285px;width:100%;margin-top:12px}.series-footer{display:flex;justify-content:space-between;gap:12px;font-size:11px;color:var(--muted);margin:14px 0}.series-footer strong{font-weight:500}.above-key{display:inline-block;width:5px;height:5px;background:#a97632;border-radius:50%;margin-right:5px}
.data-details{font-size:12px;color:var(--muted);margin:16px 0}.observation-table{overflow:auto;max-height:300px;margin-top:10px}.observation-table table{text-align:left}.observation-table td{padding:5px 10px;border-bottom:1px solid var(--border)}
.source-details{border-top:1px solid var(--border);padding:18px 0;margin-top:28px;font-size:12px;color:var(--muted)}.source-details details>div{max-width:900px;line-height:1.7;padding-top:8px}
footer{max-width:1280px;margin:auto;border-top:1px solid var(--border);padding:18px 32px 24px;color:var(--muted);font-size:11px}
.cell-tooltip{position:fixed;max-width:270px;background:var(--ink);color:#fff;padding:10px 12px;font-size:11px;border-radius:3px;z-index:10;pointer-events:none}
.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}
[hidden]{display:none!important}#dashboard[aria-busy=true]{opacity:.5;pointer-events:none}
@media(max-width:1000px){.controls{gap:12px}.period-control{flex-basis:100%}.metric-value{font-size:28px}.summary-grid{gap:16px}.metric{padding-right:12px}.chart-grid{gap:24px}}
@media(max-width:700px){.topbar{padding:16px 20px}.brand img{width:150px;height:50px}main{padding:24px 20px 12px}.intro{align-items:start;flex-direction:column;gap:8px}.station-id{display:block;margin:2px 0 0}.summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 16px}.metric:nth-child(2){border:0}.metric-value{font-size:30px}.period-control .segmented{justify-content:space-between}.segmented button{padding:7px 9px}.chart-grid{grid-template-columns:1fr;gap:26px}.rose-chart{height:330px}.observation-note,.series-footer{flex-direction:column;gap:4px}.series-panel .panel-heading{align-items:start;flex-direction:column;gap:10px}.series-legend{flex-wrap:wrap;gap:10px}.series-chart{height:250px}footer{padding:18px 20px}.anchor-control select{display:block;margin:6px 0 0;max-width:100%}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.report-button{background:#fff;border:1px solid var(--border);border-radius:3px;padding:8px 12px;font-size:12px;white-space:nowrap}.report-button:hover{background:#f3f5f7}.report-button:disabled{color:var(--muted)}.report-feedback{font-size:12px;color:var(--muted);margin:12px 0}.report-chart{position:absolute;left:-10000px;top:0;pointer-events:none}
