:root{--bg:#f2f6fa;--card:#fff;--text:#112031;--muted:#5f6f82;--accent:#0f6cbf;--line:#d9e3ec;--good:#1f7a33;--bad:#a12828;--space:1rem}
*{box-sizing:border-box}body{margin:0;font-family:Verdana,Arial,sans-serif;background:linear-gradient(180deg,#e8f1f9,#f8fbfe 30%,#f2f6fa);color:var(--text);min-height:100vh;display:flex;flex-direction:column}
.wrap{width:min(1120px,94vw);margin:0 auto}.top{background:#0b2f52;color:#fff;padding:.8rem 0}.head-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}.brand-wrap{display:inline-flex;align-items:center;gap:.42rem}.brand{font-weight:700;color:inherit;text-decoration:none}.brand-version{display:inline-flex;align-items:center;padding:.08rem .36rem;border:1px solid rgba(255,255,255,.35);border-radius:999px;font-size:.68rem;line-height:1;opacity:.9}
nav a{color:#fff;text-decoration:none;padding:.35rem .6rem;border-radius:8px}nav a:hover{background:rgba(255,255,255,.14)}
nav .nav-switch{display:inline-flex;align-items:center;gap:.22rem;margin-left:.25rem}
nav .nav-switch a{font-size:.78rem;padding:.15rem .35rem;opacity:.9}
nav .nav-switch a.active{text-decoration:underline;opacity:1}
nav .nav-switch .sep{font-size:.74rem;opacity:.72}
main{padding:var(--space) 0 2rem;display:flex;flex-direction:column;gap:var(--space);flex:1}.panel{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:1rem;margin:0;box-shadow:0 6px 18px rgba(8,42,78,.06)}
.panel-dashboard{position:relative;background-color:#f6f9fc;background-size:cover;background-position:center;border-color:#c9d8e8;overflow:visible}
.panel-dashboard::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.55),rgba(255,255,255,.25));pointer-events:none}
.panel-dashboard>*{position:relative;z-index:1}
.panel-dashboard.season-spring{background-image:url('../img/seasons/spring.svg')}
.panel-dashboard.season-summer{background-image:url('../img/seasons/summer.svg')}
.panel-dashboard.season-autumn{background-image:url('../img/seasons/autumn.svg')}
.panel-dashboard.season-winter{background-image:url('../img/seasons/winter.svg')}
body.page-loading-skeleton main .panel,body.page-loading-skeleton main .card{position:relative;overflow:hidden}
body.page-loading-skeleton main .panel>*:not(script),body.page-loading-skeleton main .card>*{visibility:hidden}
body.page-loading-skeleton main .panel::before,body.page-loading-skeleton main .card::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#eef3f8,#e7edf5);z-index:3}
body.page-loading-skeleton main .panel::after,body.page-loading-skeleton main .card::after{content:"";position:absolute;inset:-40% -30%;background:linear-gradient(90deg,rgba(255,255,255,0) 20%,rgba(255,255,255,.55) 50%,rgba(255,255,255,0) 80%);animation:skeletonShimmer 1.15s linear infinite;z-index:4}
body.page-loading-skeleton-done main .panel,body.page-loading-skeleton-done main .card{animation:skeletonReveal .24s ease}
body.page-loading-skeleton main .panel-dashboard::before{background:
linear-gradient(#dfe8f2,#dfe8f2) 1rem 1rem/34% 16px no-repeat,
linear-gradient(#e7eef6,#e7eef6) 1rem 2.9rem/42% 12px no-repeat,
linear-gradient(#dbe6f1,#dbe6f1) 1rem calc(100% - 3.05rem)/90px 28px no-repeat,
linear-gradient(#e4ecf4,#e4ecf4) calc(100% - 14.2rem) calc(100% - 3.05rem)/13.2rem 28px no-repeat,
linear-gradient(#dbe6f1,#dbe6f1) calc(100% - 14.2rem) calc(100% - 1.9rem)/13.2rem 4px no-repeat,
linear-gradient(180deg,#edf3f9,#e6edf5)}
body.page-loading-skeleton main .weather-hero::before{background:
linear-gradient(#dbe6f1,#dbe6f1) 1rem 1rem/120px 120px no-repeat,
linear-gradient(#dfe8f2,#dfe8f2) 10.2rem 1.2rem/36% 18px no-repeat,
linear-gradient(#e6edf5,#e6edf5) 10.2rem 2.8rem/28% 12px no-repeat,
linear-gradient(#e6edf5,#e6edf5) 10.2rem 4.1rem/32% 12px no-repeat,
linear-gradient(#d9e4ef,#d9e4ef) calc(100% - 11.8rem) 1.2rem/10.8rem 52px no-repeat,
linear-gradient(#e5edf6,#e5edf6) calc(100% - 11.8rem) 4.2rem/10.8rem 22px no-repeat,
linear-gradient(180deg,#eef4fa,#e7eef6)}
body.page-loading-skeleton main .station-card::before{background:
linear-gradient(#dfe8f2,#dfe8f2) .8rem .8rem/52% 14px no-repeat,
radial-gradient(circle at 22px 58px,#dbe6f1 0 22px,transparent 23px) .8rem .8rem/52px 52px no-repeat,
linear-gradient(#e6edf5,#e6edf5) .8rem 4.6rem/88% 10px no-repeat,
linear-gradient(#e6edf5,#e6edf5) .8rem 5.8rem/74% 10px no-repeat,
linear-gradient(#e6edf5,#e6edf5) .8rem 7rem/66% 10px no-repeat,
linear-gradient(#e6edf5,#e6edf5) .8rem 8.2rem/80% 10px no-repeat,
linear-gradient(180deg,#eef3f9,#e7edf5)}
body.page-loading-skeleton main .forecast-card::before{background:
linear-gradient(#dfe8f2,#dfe8f2) .8rem .8rem/62% 14px no-repeat,
linear-gradient(#dbe6f1,#dbe6f1) .8rem 2rem/42px 42px no-repeat,
linear-gradient(#dfe8f2,#dfe8f2) 3.7rem 2.1rem/38% 15px no-repeat,
linear-gradient(#e6edf5,#e6edf5) 3.7rem 3.15rem/26% 10px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 5rem/calc(50% - 1.05rem) 56px no-repeat,
linear-gradient(#e8eef6,#e8eef6) calc(50% + .25rem) 5rem/calc(50% - 1.05rem) 56px no-repeat,
linear-gradient(#e6edf5,#e6edf5) .8rem calc(100% - 1.25rem)/44% 10px no-repeat,
linear-gradient(180deg,#eef4fa,#e7eef6)}
body.page-loading-skeleton main .extremes-card::before{background:
linear-gradient(#dfe8f2,#dfe8f2) .8rem .8rem/58% 14px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 2rem/88% 30px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 3.95rem/88% 30px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 5.9rem/88% 30px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 7.85rem/88% 30px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 9.8rem/88% 30px no-repeat,
linear-gradient(180deg,#eef4fa,#e7eef6)}
body.page-loading-skeleton main .metric-group-card::before{background:
linear-gradient(#dfe8f2,#dfe8f2) .8rem .8rem/68% 14px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 2rem/calc(50% - .95rem) 58px no-repeat,
linear-gradient(#e8eef6,#e8eef6) calc(50% + .15rem) 2rem/calc(50% - .95rem) 58px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 6.05rem/calc(50% - .95rem) 58px no-repeat,
linear-gradient(#e8eef6,#e8eef6) calc(50% + .15rem) 6.05rem/calc(50% - .95rem) 58px no-repeat,
linear-gradient(180deg,#eef4fa,#e7eef6)}
body.page-loading-skeleton main .wind-rose-card::before{background:
linear-gradient(#dfe8f2,#dfe8f2) .8rem .8rem/56% 14px no-repeat,
linear-gradient(#e6edf5,#e6edf5) calc(100% - 4.6rem) .8rem/3.8rem 14px no-repeat,
radial-gradient(circle at 50% 62%,#dfe8f2 0 58px,transparent 59px) center 2.1rem/140px 140px no-repeat,
linear-gradient(#e6edf5,#e6edf5) 1.1rem calc(100% - 1.2rem)/80% 10px no-repeat,
linear-gradient(180deg,#eef4fa,#e7eef6)}
body.page-loading-skeleton main .metric-groups-panel::before,
body.page-loading-skeleton main .rain-totals-panel::before{background:
linear-gradient(#dfe8f2,#dfe8f2) 1rem 1rem/34% 15px no-repeat,
linear-gradient(#e8eef6,#e8eef6) 1rem 2.2rem/100% 1px no-repeat,
linear-gradient(180deg,#eef4fa,#e7eef6)}
body.page-loading-skeleton main .card:not(.station-card):not(.forecast-card):not(.extremes-card):not(.metric-group-card):not(.wind-rose-card)::before{background:
linear-gradient(#dfe8f2,#dfe8f2) .8rem .8rem/56% 14px no-repeat,
linear-gradient(#dbe6f1,#dbe6f1) .8rem 2.1rem/72% 22px no-repeat,
linear-gradient(#e6edf5,#e6edf5) .8rem 4rem/84% 10px no-repeat,
linear-gradient(#e6edf5,#e6edf5) .8rem 5.2rem/62% 10px no-repeat,
linear-gradient(180deg,#eef4fa,#e7eef6)}
@keyframes skeletonShimmer{0%{transform:translateX(-35%)}100%{transform:translateX(35%)}}
@keyframes skeletonReveal{0%{opacity:.74;transform:translateY(1px)}100%{opacity:1;transform:none}}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:var(--space);margin:0}.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:.7rem;height:100%}.card h3{margin:0 0 .35rem;font-size:.9rem;color:var(--muted)}.card div{font-size:1.2rem;font-weight:700}
.card h3 .label-paren{font-size:.82em;font-weight:600;opacity:.86}
.card.is-stale-card{filter:grayscale(.88);opacity:.58}
[data-live-key]{transition:background-color .35s ease,color .35s ease,transform .25s ease,box-shadow .35s ease}
.live-updated{background:rgba(26,92,157,.11);border-radius:8px;padding:.04rem .28rem;box-shadow:0 0 0 1px rgba(26,92,157,.2) inset;animation:liveFlash .85s ease}
.live-updated-up{color:#18733f}
.live-updated-down{color:#a62d2d}
@keyframes liveFlash{0%{transform:translateY(0) scale(1)}40%{transform:translateY(-1px) scale(1.02)}100%{transform:translateY(0) scale(1)}}
.small-muted{margin:.3rem 0 0;font-size:.8rem;color:var(--muted)}
.legal-content{line-height:1.55;white-space:normal}
.station-card .station-map-link{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;margin-left:.28rem;color:#4a6785;text-decoration:none;vertical-align:middle}
.station-card .station-map-link:hover{color:#2f6ea4}
.station-card .station-map-link svg{width:12px;height:12px}
.forecast-card .forecast-head{display:flex;align-items:center;gap:.55rem;margin:.1rem 0 .45rem}
.forecast-card .forecast-icon{width:42px;height:42px;display:flex;align-items:center;justify-content:center;background:#f4f9ff;border:1px solid #d4e2ef;border-radius:10px;overflow:hidden}
.forecast-card .forecast-icon svg{width:34px;height:34px}
.forecast-card .forecast-current{display:flex;flex-direction:column}
.forecast-card .forecast-value{font-size:1.1rem;font-weight:700}
.sea-card .sea-illustration{color:#2f79b7;background:linear-gradient(180deg,#f7fcff,#e9f4ff)}
.metar-card .metar-icon{color:#2f5f8a;background:linear-gradient(180deg,#f6fbff,#ebf4ff)}
.metar-card .metar-raw{margin:.2rem 0 0;font-size:.76rem}
.forecast-card .forecast-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem;margin-top:.45rem}
.forecast-card .forecast-day{border:1px solid var(--line);border-radius:8px;padding:.35rem .45rem;background:#f8fbff}
.forecast-card .forecast-day strong{display:block;margin-bottom:.25rem;font-size:.78rem;color:var(--muted)}
.forecast-card .forecast-line{margin:.1rem 0;font-size:.8rem;color:#26496a}
.extremes-card .extremes-grid{display:flex;flex-direction:column;gap:.35rem}
.extremes-card .extremes-line{margin:0;padding:.32rem .45rem;display:flex;align-items:center;justify-content:space-between;gap:.45rem;background:#f8fbff;border:1px solid #d7e3ef;border-radius:8px}
.extremes-card .extremes-label{font-size:.77rem;color:#5e7590}
.extremes-card .extremes-label .extremes-icon{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;margin-right:.35rem;vertical-align:-2px;opacity:.92}
.extremes-card .extremes-label .extremes-icon svg{width:15px;height:15px;display:block}
.extremes-card .extremes-line strong{font-size:.87rem;color:#1d3e60}
.extremes-card .extremes-line strong .extremes-time{font-size:.82em;font-weight:600;opacity:.86}
.extremes-card .sun-visual{padding:.4rem .45rem;background:#f8fbff;border:1px solid #d7e3ef;border-radius:8px}
.extremes-card .sun-scale{position:relative;height:10px;border-radius:999px;background:linear-gradient(90deg,#c7d7e8,#b7cade);overflow:visible}
.extremes-card .sun-daylight{position:absolute;top:0;height:100%;border-radius:999px;background:linear-gradient(90deg,#f3c766,#ffe08b)}
.extremes-card .sun-tick{position:absolute;top:-3px;width:2px;height:16px;background:#7d93ac;transform:translateX(-50%);opacity:.7}
.extremes-card .sun-now{position:absolute;top:50%;width:14px;height:14px;border-radius:50%;background:#ff9f1c;border:2px solid #fff;box-shadow:0 1px 7px rgba(0,0,0,.2);transform:translate(-50%,-50%)}
.extremes-card .sun-caption{margin:.4rem 0 0;display:flex;align-items:center;justify-content:space-between;gap:.45rem}
.metric-groups-panel{display:flex;flex-direction:column;gap:.7rem}
.metric-groups-panel>.panel-title-with-icon,
.rain-totals-panel>.panel-title-with-icon{margin:0 0 .2rem;line-height:1.2}
.panel-title-with-icon{display:flex;align-items:center;gap:.4rem}
.panel-title-icon{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;color:#4a6785}
.panel-title-icon svg{width:16px;height:16px;display:block}
.metrics-cards{margin:0}
.metric-group-card{padding:.7rem}
.metric-group-card h3{display:flex;align-items:center;gap:.45rem}
.metric-group-icon{width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;border:1px solid #d4e2ef;border-radius:8px;background:#f4f9ff;color:#3e678e;flex:0 0 24px}
.metric-group-icon svg{width:16px;height:16px;display:block}
.metric-group-card .metric-group-lines{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem}
.metric-group-card .metric-line{margin:0}
.metric-group-card .metric-line-value{font-size:1.05rem;font-weight:700;color:#1d3e60}
.metric-trend{display:inline-block;margin-right:.22rem;font-weight:700}
.metric-trend-up{color:#1f8a45}
.metric-trend-down{color:#b23a2b}
.metric-trend-stable{color:#4b6783}
.metric-trend-unknown{color:#7a8fa5}
.wind-compass{display:inline-flex;align-items:center;justify-content:center;width:1.2em;height:1.2em;margin-right:.22rem;border:1px solid #c8d6e5;border-radius:50%;background:#f7fbff;vertical-align:middle}
.wind-compass .needle{display:inline-block;line-height:1;font-size:.9em;color:#2f5f8a;transform-origin:50% 55%}
.wind-rose-card{display:flex;flex-direction:column;align-items:center;justify-content:flex-start}
.wind-rose-head{width:100%;display:flex;align-items:center;justify-content:space-between;gap:.55rem}
.wind-rose-head h3{margin:0}
.wind-rose-periods{display:inline-flex;align-items:center;gap:.25rem;flex-wrap:wrap;justify-content:flex-end}
.wind-rose-period{display:inline-flex;align-items:center;justify-content:center;min-width:28px;padding:.12rem .34rem;border:1px solid #d3dfeb;border-radius:999px;background:#f5f9fd;color:#3b5d80;text-decoration:none;font-size:.72rem;line-height:1}
.wind-rose-period:hover{background:#edf4fb}
.wind-rose-period.is-active{border-color:#2f79b7;background:#2f79b7;color:#fff}
.wind-rose-svg{width:min(100%,220px);height:auto;display:block;margin:.2rem auto .35rem}
.wind-rose-grid{fill:none;stroke:#d3e0ec;stroke-width:1}
.wind-rose-axis{stroke:#b4c7db;stroke-width:1}
.wind-rose-spoke{stroke:#d8e4ef;stroke-width:.9}
.wind-rose-sector{fill:#2f79b7;stroke:#2f79b7;stroke-width:.7}
.wind-rose-center{fill:#2f79b7}
.wind-rose-label{font-size:6.5px;fill:#5a7592;text-anchor:middle;dominant-baseline:middle;font-weight:700}
.wind-rose-scale{font-size:6px;fill:#8aa1b8}
.weather-hero{display:grid;grid-template-columns:130px 1fr auto;align-items:center;gap:1rem;background:linear-gradient(125deg,#f5fbff,#edf5fc)}
.weather-icon{width:120px;height:120px;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid var(--line);border-radius:16px}
.weather-icon svg{width:100px;height:100px}
.weather-copy h3{margin:.1rem 0 .35rem;font-size:1.3rem}
.weather-copy p{margin:.15rem 0;color:var(--muted)}
.weather-trend{font-weight:700;color:#26496a!important}
.weather-temp-side{min-width:170px;display:flex;flex-direction:column;align-items:flex-end;gap:.35rem}
.weather-temp-side .current-label{font-size:.75rem;color:#5b6f83;text-transform:uppercase;letter-spacing:.04em}
.weather-temp-side .current-value{font-size:2.35rem;font-weight:700;line-height:1;color:#12355a}
.weather-temp-side .current-value small{font-size:1rem;margin-left:.18rem;color:#37506a;font-weight:600}
.weather-temp-side .current-value .temp-trend{display:inline-flex;align-items:center;justify-content:center;width:.75em;margin-right:.1em;font-size:.9em;line-height:1}
.weather-temp-side .current-value .temp-trend-up{color:#1f8a45}
.weather-temp-side .current-value .temp-trend-down{color:#b23a2b}
.weather-temp-side .current-value .temp-trend-stable{color:#4b6783}
.weather-temp-side .current-value .temp-trend-unknown{color:#7a8fa5}
.day-minmax{display:flex;gap:.65rem}
.day-minmax .min,.day-minmax .max{display:flex;align-items:center;gap:.2rem;padding:.16rem .35rem;border:1px solid #cbd9e7;border-radius:999px;background:rgba(255,255,255,.72);font-size:.82rem}
.day-minmax .arrow{font-weight:700}
.day-minmax .min .arrow{color:#3d79b2}
.day-minmax .max .arrow{color:#b35634}
.day-minmax .v{font-weight:700;color:#193a5c}
.weather-sunny{background:linear-gradient(125deg,#fff9e6,#fff3c8)}
.weather-rain{background:linear-gradient(125deg,#edf5fd,#dcefff)}
.weather-snow{background:linear-gradient(125deg,#f6fbff,#e7f3ff)}
.weather-wind{background:linear-gradient(125deg,#f2f8ff,#e1ecfb)}
.weather-very_cloudy,.weather-cloudy{background:linear-gradient(125deg,#f2f6fa,#e5edf5)}
.weather-offline{background:linear-gradient(125deg,#f5f7fa,#eceff3)}
.rain-totals-panel .card{background:var(--card);border-color:var(--line);border-radius:10px;padding:.7rem}
.pill{display:inline-block;padding:.25rem .7rem;border-radius:999px;font-weight:700}.pill-ok{background:#e4f4e7;color:var(--good)}.pill-bad{background:#fbe4e4;color:var(--bad)}
.status-row{justify-content:space-between}
.status-controls{display:flex;align-items:flex-start;gap:.45rem;flex-wrap:wrap;justify-content:flex-end}
.auto-refresh{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.auto-refresh-mini{display:flex;flex-direction:column;align-items:flex-end;gap:.3rem;--auto-progress-width:150px}
.theme-toggle{display:inline-flex;align-items:center;gap:.38rem;border:1px solid var(--line);background:rgba(255,255,255,.78);color:#27435f;border-radius:999px;padding:.25rem .5rem;cursor:pointer}
.theme-toggle .theme-dot{font-size:.8rem;line-height:1;opacity:.9}
.theme-toggle .theme-label{font-size:.75rem;color:#4e6279}
.theme-toggle .theme-mode{font-size:.74rem;font-family:Consolas,monospace;border:1px solid #d8e4f0;background:#eef4fb;border-radius:999px;padding:.08rem .28rem}
.auto-chip{display:inline-flex;align-items:center;gap:.45rem;background:rgba(255,255,255,.78);border:1px solid var(--line);border-radius:999px;padding:.25rem .55rem;cursor:pointer;color:#27435f}
.auto-chip .dot{width:10px;height:10px;border-radius:50%;background:#1f9d4a;display:inline-flex;align-items:center;justify-content:center;font-size:7px;line-height:1;color:#fff}
.auto-chip .label{font-size:.78rem;color:#4e6279}
.auto-chip .count{font-family:Consolas,monospace;font-size:.78rem;background:#eef4fb;border:1px solid #d8e4f0;padding:.08rem .28rem;border-radius:999px;min-width:44px;text-align:center}
.auto-chip.is-off .dot{background:#8ea1b5}
.auto-chip.is-off .count{opacity:.65}
.auto-chip.is-off + .auto-progress{background:#e8edf3}
.auto-chip.is-off + .auto-progress span{background:linear-gradient(90deg,#9aaabc,#8f9faf)}
.auto-chip.is-loading{cursor:progress;pointer-events:none;opacity:.88}
.auto-chip.is-loading .count{min-width:92px}
.auto-progress{display:block;width:var(--auto-progress-width);height:4px;background:#dfe8f2;border-radius:999px;overflow:hidden}
.auto-progress span{display:block;height:100%;width:0;margin-left:auto;background:linear-gradient(90deg,#2c88d9,#22b3be)}
.btn-lite{font:inherit;border:1px solid var(--line);background:#fff;color:var(--text);padding:.42rem .65rem;border-radius:8px;cursor:pointer}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid var(--line);background:#fff;color:var(--text);border-radius:10px;cursor:pointer;padding:0}
.icon-btn svg{width:17px;height:17px;display:block}
.refresh-cache-btn.is-loading svg{animation:spin .9s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.row{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}select,input,button,.btn{font:inherit;border:1px solid var(--line);background:#fff;color:var(--text);padding:.5rem .7rem;border-radius:8px;text-decoration:none}
button,.btn{background:var(--accent);border-color:var(--accent);color:#fff;cursor:pointer}
.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:.87rem}th,td{padding:.48rem .35rem;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
.chart-panel{position:relative;min-height:320px}
.chart-title{margin:0 0 .55rem;font-size:.95rem;color:var(--muted);font-weight:700}
.weather-chart{display:block;width:100%!important;height:280px!important;pointer-events:auto;cursor:crosshair}
.chart-tooltip{position:absolute;z-index:6;pointer-events:none;max-width:220px;background:rgba(17,32,49,.96);color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:8px;padding:.35rem .45rem;font-size:.78rem;line-height:1.35;box-shadow:0 6px 18px rgba(5,15,25,.28)}
body.theme-dark .chart-tooltip{background:rgba(8,16,28,.96);border-color:rgba(170,198,224,.35)}
.foot{padding:1.2rem 0 2rem;border-top:1px solid var(--line);font-size:.9rem;color:var(--muted)}
.admin-layout{display:grid;grid-template-columns:220px 1fr;min-height:100vh}.admin-nav{background:#102946;color:#dbe9f7;padding:1rem}.admin-nav h1{margin:.2rem 0 .8rem;font-size:1.2rem}.admin-nav a{display:block;color:#dbe9f7;text-decoration:none;margin:.38rem 0}.admin-main{padding:1rem}.alert{padding:.65rem .8rem;border-radius:8px;margin-bottom:.8rem}.alert-ok{background:#e4f4e7;color:#1e6e2f}.alert-bad{background:#f8e4e4;color:#8e1f1f}
.code{font-family:Consolas,monospace;background:#eef4fb;border:1px solid var(--line);padding:.3rem .4rem;border-radius:6px;word-break:break-all}
@media (max-width:820px){
body.page-loading-skeleton main .panel-dashboard::before{background:
linear-gradient(#dfe8f2,#dfe8f2) .9rem .9rem/48% 16px no-repeat,
linear-gradient(#e7eef6,#e7eef6) .9rem 2.7rem/62% 12px no-repeat,
linear-gradient(#dbe6f1,#dbe6f1) .9rem calc(100% - 3.25rem)/92px 26px no-repeat,
linear-gradient(#e4ecf4,#e4ecf4) .9rem calc(100% - 1.75rem)/calc(100% - 1.8rem) 4px no-repeat,
linear-gradient(180deg,#edf3f9,#e6edf5)}
body.page-loading-skeleton main .weather-hero::before{background:
linear-gradient(#dbe6f1,#dbe6f1) 1rem 1rem/92px 92px no-repeat,
linear-gradient(#dfe8f2,#dfe8f2) 1rem 7.1rem/58% 18px no-repeat,
linear-gradient(#e6edf5,#e6edf5) 1rem 8.55rem/46% 12px no-repeat,
linear-gradient(#e6edf5,#e6edf5) 1rem 9.8rem/52% 12px no-repeat,
linear-gradient(#d9e4ef,#d9e4ef) 1rem 11.5rem/72% 44px no-repeat,
linear-gradient(#e5edf6,#e5edf6) 1rem 14.8rem/72% 18px no-repeat,
linear-gradient(180deg,#eef4fa,#e7eef6)}
body.page-loading-skeleton main .forecast-card::before{background:
linear-gradient(#dfe8f2,#dfe8f2) .8rem .8rem/62% 14px no-repeat,
linear-gradient(#dbe6f1,#dbe6f1) .8rem 2rem/42px 42px no-repeat,
linear-gradient(#dfe8f2,#dfe8f2) 3.7rem 2.1rem/42% 15px no-repeat,
linear-gradient(#e6edf5,#e6edf5) 3.7rem 3.15rem/34% 10px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 5rem/100% 52px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 8.4rem/100% 52px no-repeat,
linear-gradient(#e6edf5,#e6edf5) .8rem calc(100% - 1.25rem)/56% 10px no-repeat,
linear-gradient(180deg,#eef4fa,#e7eef6)}
body.page-loading-skeleton main .metric-group-card::before{background:
linear-gradient(#dfe8f2,#dfe8f2) .8rem .8rem/68% 14px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 2rem/100% 50px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 5.4rem/100% 50px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 8.8rem/100% 50px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 12.2rem/100% 50px no-repeat,
linear-gradient(180deg,#eef4fa,#e7eef6)}
body.page-loading-skeleton main .extremes-card::before{background:
linear-gradient(#dfe8f2,#dfe8f2) .8rem .8rem/62% 14px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 2rem/100% 30px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 3.95rem/100% 30px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 5.9rem/100% 30px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 7.85rem/100% 30px no-repeat,
linear-gradient(#e8eef6,#e8eef6) .8rem 9.8rem/100% 30px no-repeat,
linear-gradient(180deg,#eef4fa,#e7eef6)}
body.page-loading-skeleton main .wind-rose-card::before{background:
linear-gradient(#dfe8f2,#dfe8f2) .8rem .8rem/56% 14px no-repeat,
linear-gradient(#e6edf5,#e6edf5) calc(100% - 4.6rem) .8rem/3.8rem 14px no-repeat,
radial-gradient(circle at 50% 59%,#dfe8f2 0 50px,transparent 51px) center 2rem/124px 124px no-repeat,
linear-gradient(#e6edf5,#e6edf5) 1rem calc(100% - 1.15rem)/82% 10px no-repeat,
linear-gradient(180deg,#eef4fa,#e7eef6)}
body.page-loading-skeleton main .card:not(.station-card):not(.forecast-card):not(.extremes-card):not(.metric-group-card):not(.wind-rose-card)::before{background:
linear-gradient(#dfe8f2,#dfe8f2) .8rem .8rem/64% 14px no-repeat,
linear-gradient(#dbe6f1,#dbe6f1) .8rem 2.05rem/82% 20px no-repeat,
linear-gradient(#e6edf5,#e6edf5) .8rem 3.8rem/90% 10px no-repeat,
linear-gradient(#e6edf5,#e6edf5) .8rem 5rem/74% 10px no-repeat,
linear-gradient(180deg,#eef4fa,#e7eef6)}
}
@media (max-width:820px){.admin-layout{grid-template-columns:1fr}.weather-hero{grid-template-columns:1fr}.weather-icon{width:100%;max-width:120px}.weather-temp-side{align-items:flex-start;min-width:0}.weather-temp-side .current-value{font-size:2rem}}
@media (max-width:820px){.metric-group-card .metric-group-lines{grid-template-columns:1fr}}
@media (max-width:820px){.chart-panel{min-height:250px}.weather-chart{height:220px!important}}

body.theme-dark{--bg:#0b1220;--card:#10192b;--text:#d9e6f3;--muted:#97adbf;--line:#253852;background:linear-gradient(180deg,#0c1524,#0a1322 45%,#09111e)}
body.theme-dark .top{background:#081a2f}
body.theme-dark .panel{box-shadow:0 8px 22px rgba(2,8,20,.45)}
body.theme-dark .panel-dashboard{border-color:#2f435f;background-color:#0f1d31}
body.theme-dark .panel-dashboard::before{background:linear-gradient(90deg,rgba(15,26,44,.35),rgba(10,20,36,.12))}
body.theme-dark .weather-hero{background:linear-gradient(125deg,#122640,#112238)}
body.theme-dark .weather-icon{background:#0f1b2e}
body.theme-dark .forecast-card .forecast-icon,
body.theme-dark .metric-group-icon,
body.theme-dark .wind-compass{background:#10243c;border-color:#2b4361;color:#89b2d8}
body.theme-dark .wind-rose-grid{stroke:#35506f}
body.theme-dark .wind-rose-axis{stroke:#4a6685}
body.theme-dark .wind-rose-spoke{stroke:#2f4866}
body.theme-dark .wind-rose-sector{fill:#62a4dd;stroke:#62a4dd}
body.theme-dark .wind-rose-center{fill:#62a4dd}
body.theme-dark .wind-rose-label{fill:#a9c2d8}
body.theme-dark .wind-rose-scale{fill:#86a5c2}
body.theme-dark .wind-rose-period{border-color:#3a5776;background:#11263f;color:#b9d2e8}
body.theme-dark .wind-rose-period:hover{background:#16304d}
body.theme-dark .wind-rose-period.is-active{border-color:#62a4dd;background:#62a4dd;color:#0d2238}
body.theme-dark .forecast-card .forecast-line{color:#b7cde0}
body.theme-dark .forecast-card .forecast-day,
body.theme-dark .extremes-card .extremes-line,
body.theme-dark .extremes-card .sun-visual{background:#12233a;border-color:#2b4361}
body.theme-dark .rain-totals-panel .card{background:var(--card);border-color:var(--line)}
body.theme-dark .extremes-card .extremes-label{color:#9fb5cb}
body.theme-dark .extremes-card .extremes-line strong,
body.theme-dark .metric-group-card .metric-line-value,
body.theme-dark .weather-temp-side .current-value{color:#e6f0fb}
body.theme-dark .weather-temp-side .current-value small{color:#b4c8dc}
body.theme-dark .weather-temp-side .current-label{color:#9ab2c8}
body.theme-dark .weather-trend{color:#b5cce0!important}
body.theme-dark .day-minmax .min,
body.theme-dark .day-minmax .max{background:rgba(10,24,40,.72);border-color:#34506f}
body.theme-dark .day-minmax .v{color:#d6e7f7}
body.theme-dark .theme-toggle,
body.theme-dark .auto-chip{background:rgba(15,31,51,.78);color:#c6d9ea}
body.theme-dark .theme-toggle .theme-mode,
body.theme-dark .auto-chip .count{background:#11263f;border-color:#35506f;color:#d7e8f8}
body.theme-dark .theme-toggle .theme-label,
body.theme-dark .auto-chip .label{color:#9eb7cb}
body.theme-dark .auto-progress{background:#21364f}
body.theme-dark .auto-chip.is-off + .auto-progress{background:#273a50}
body.theme-dark .station-card .station-map-link{color:#8faec8}
body.theme-dark .station-card .station-map-link:hover{color:#b4d0e8}
body.theme-dark .btn-lite{background:#11233a}
body.theme-dark .icon-btn{background:#11233a;border-color:#2f4662;color:#d8e8f8}
body.theme-dark .panel-title-icon{color:#9ab7d1}
body.theme-dark select,
body.theme-dark input,
body.theme-dark .btn,
body.theme-dark button{background:#102236;color:#d8e8f8;border-color:#2f4662}
body.theme-dark button,
body.theme-dark .btn{background:#1f6ab3;border-color:#1f6ab3;color:#fff}
body.theme-dark .code{background:#102236;border-color:#2f4662}
body.theme-dark .foot{border-top-color:#253852}
