:root{--navy:#0c2441;--navy2:#14375b;--ink:#13253b;--muted:#64748b;--teal:#25a99a;--sky:#58adff;--mist:#edf6f8;--line:#dce8ee;--white:#fff;--shadow:0 22px 60px rgba(13,43,70,.12);--radius:24px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f7fafb;color:var(--ink);font-family:"Segoe UI",Arial,sans-serif;line-height:1.5}a{color:inherit;text-decoration:none}img{max-width:100%}.wrap{width:min(1180px,calc(100% - 36px));margin-inline:auto}.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(18px);border-bottom:1px solid rgba(203,220,228,.8)}.header-inner{max-width:1260px;margin:auto;padding:12px 22px;display:flex;align-items:center;gap:24px}.brand{display:flex;align-items:center;gap:10px;min-width:244px}.brand img{width:210px;height:49px;object-fit:contain;object-position:left}.brand span{display:none}.main-nav{display:flex;gap:4px;margin-left:auto}.main-nav a{padding:10px 13px;border-radius:12px;font-size:14px;font-weight:700;color:#4b6075}.main-nav a:hover,.main-nav a.active{background:#eaf5f6;color:#0b746d}.header-live{margin-left:10px;padding:9px 12px;border:1px solid var(--line);border-radius:999px;display:flex;align-items:center;gap:8px;font-weight:800}.status-dot{width:8px;height:8px;border-radius:50%;background:#2ac99f;box-shadow:0 0 0 5px rgba(42,201,159,.14)}.nav-toggle{display:none;margin-left:auto;border:0;background:#eef5f7;border-radius:10px;padding:9px 12px;font-size:20px}.weather-hero{position:relative;overflow:hidden;background:linear-gradient(125deg,#0b2340 0%,#104d68 60%,#248d9b 100%);color:#fff;min-height:575px}.hero-sky{position:absolute;inset:0;pointer-events:none}.hero-sky:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 15% 10%,rgba(255,255,255,.1),transparent 35%),linear-gradient(180deg,transparent 65%,rgba(4,23,40,.2))}.orb{position:absolute;width:360px;height:360px;border-radius:50%;right:8%;top:70px;background:radial-gradient(circle at 35% 35%,#fffbd6,#f9c967 38%,rgba(249,201,103,.25) 66%,transparent 67%);filter:blur(.2px);opacity:.9}.cloud{position:absolute;width:370px;height:88px;border-radius:80px;background:rgba(255,255,255,.12);filter:blur(1px)}.cloud:before,.cloud:after{content:"";position:absolute;background:inherit;border-radius:50%}.cloud:before{width:160px;height:160px;left:55px;bottom:0}.cloud:after{width:120px;height:120px;right:55px;bottom:0}.cloud-a{right:-80px;bottom:80px}.cloud-b{left:-130px;top:110px;transform:scale(.7);opacity:.5}.hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.35fr .65fr;align-items:center;gap:70px;min-height:575px;padding-block:75px}.eyebrow{display:flex;align-items:center;gap:16px;font-size:13px;color:#cde5ea}.live-pill{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:8px 12px;font-weight:800;letter-spacing:.08em}.live-pill i{width:8px;height:8px;border-radius:50%;background:#67ffd2;box-shadow:0 0 0 5px rgba(103,255,210,.12)}.hero-copy h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(100px,15vw,180px);line-height:.85;margin:38px 0 10px;letter-spacing:-.08em}.hero-copy h1 small{font-family:"Segoe UI",Arial,sans-serif;font-size:.2em;letter-spacing:0;margin-left:12px;vertical-align:top;color:#b6dce6}.hero-condition{font-family:Georgia,"Times New Roman",serif;font-size:36px;margin:22px 0 8px}.hero-sub{color:#d4e8ed;font-size:17px}.hero-actions{display:flex;gap:12px;margin-top:30px}.button{display:inline-flex;align-items:center;justify-content:center;padding:13px 18px;border-radius:14px;font-weight:800;font-size:14px;transition:.2s}.button.primary{background:#fff;color:var(--navy)}.button.primary:hover{transform:translateY(-2px)}.button.ghost{border:1px solid rgba(255,255,255,.32);color:#fff;background:rgba(255,255,255,.06)}.button.dark{background:var(--navy);color:#fff}.dark-text{color:var(--navy)!important;border-color:var(--line)!important}.wind-orbit{text-align:center;align-self:center}.wind-ring{position:relative;width:260px;height:260px;border-radius:50%;margin:auto;border:1px solid rgba(255,255,255,.32);box-shadow:inset 0 0 0 28px rgba(255,255,255,.04),0 30px 80px rgba(0,0,0,.2)}.wind-ring>span{position:absolute;font-size:12px;font-weight:800;color:#b9d8df}.wind-ring>span:nth-child(1){top:12px;left:50%}.wind-ring>span:nth-child(2){right:14px;top:50%}.wind-ring>span:nth-child(3){bottom:12px;left:50%}.wind-ring>span:nth-child(4){left:14px;top:50%}.wind-center{position:absolute;inset:82px;border-radius:50%;background:rgba(255,255,255,.12);display:grid;place-content:center}.wind-center b{font-size:38px;line-height:1}.wind-center small{font-size:12px}.wind-arrow{position:absolute;left:50%;top:50%;width:8px;height:92px;background:linear-gradient(#64f4d2,#fff);border-radius:9px;transform-origin:50% 100%;transform:translate(-50%,-100%) rotate(var(--direction));box-shadow:0 0 20px rgba(100,244,210,.5)}.wind-arrow:before{content:"";position:absolute;top:-8px;left:-6px;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:18px solid #64f4d2}.wind-orbit p{color:#cde5ea}.dashboard-section,.split-section,.neighborhood-note{margin-top:70px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:24px}.section-heading h2,.panel h2,.neighborhood-note h2,.about-layout h2{font-family:Georgia,"Times New Roman",serif;font-size:34px;margin:4px 0 0}.section-heading>a{color:#147b7b;font-weight:800}.kicker{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#29968f}.station-badge{padding:8px 12px;border-radius:999px;background:#e2f8f1;color:#127b62;font-weight:800;font-size:13px}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.metric-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px;display:flex;align-items:center;gap:16px;box-shadow:0 12px 35px rgba(26,60,83,.06)}.metric-card .metric-icon{width:48px;height:48px;border-radius:16px;background:#eef8f7;display:grid;place-items:center;font-size:23px}.metric-card span,.detail-grid span,.stat-list span,.history-cards span{display:block;color:var(--muted);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.metric-card strong{display:block;font-size:27px;margin:3px 0}.metric-card small{color:#718096}.split-section{display:grid;grid-template-columns:1.08fr .92fr;gap:18px}.panel{background:#fff;border-radius:var(--radius);border:1px solid var(--line);padding:28px;box-shadow:0 16px 50px rgba(26,60,83,.07)}.panel-title{display:flex;align-items:start;justify-content:space-between}.rain-live{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:800;color:#317a8b}.rain-live i{width:9px;height:9px;border-radius:50%;background:#55b9ff}.rain-layout{display:grid;grid-template-columns:1fr 1.2fr;gap:25px;align-items:center;margin-top:20px}.rain-drop{width:190px;height:190px;border-radius:50% 50% 50% 8%;transform:rotate(45deg);background:linear-gradient(135deg,#e0f6ff,#c5edff);display:grid;place-content:center;text-align:center;margin:15px auto}.rain-drop>*{transform:rotate(-45deg)}.rain-drop span{font-family:Newsreader;font-size:48px;line-height:1}.rain-drop small{color:#39768e}.rain-main p{text-align:center;color:var(--muted)}.stat-list{display:grid;gap:0}.stat-list>div{display:flex;justify-content:space-between;padding:13px 0;border-bottom:1px solid #e8eff2}.stat-list b{font-size:16px}.stat-list.horizontal{grid-template-columns:repeat(2,1fr);column-gap:24px;margin-top:26px}.sun-panel{background:linear-gradient(150deg,#fff 20%,#fff9e7)}.uv-chip{background:#fff0bb;color:#8c6712;border-radius:999px;padding:8px 12px;font-weight:800}.sun-gauge{margin-top:45px}.sun-track{height:18px;border-radius:999px;background:linear-gradient(90deg,#d6edf5,#ffdb78,#ff9f5a);overflow:hidden}.sun-fill{height:100%;background:rgba(255,255,255,.4);border-right:5px solid #152e46}.sun-value{display:flex;align-items:baseline;gap:8px;margin-top:14px}.sun-value strong{font-family:Newsreader;font-size:52px}.sun-value span{color:var(--muted)}.detail-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.detail-grid article{background:#fff;border:1px solid var(--line);padding:20px;border-radius:17px}.detail-grid b{display:block;font-size:19px;margin-top:7px}.neighborhood-note{margin-bottom:70px;background:linear-gradient(120deg,#dff5f1,#e9f3ff);border:1px solid #cfe6e6;border-radius:28px;padding:36px 40px;display:flex;align-items:center;justify-content:space-between;gap:40px}.neighborhood-note p{max-width:720px;color:#516577}.page-hero{background:linear-gradient(125deg,#0b2442,#16647a);color:#fff;padding:76px 0}.page-hero.compact{padding:58px 0}.page-hero h1{font-family:Newsreader;font-size:58px;margin:8px 0 10px}.page-hero p{max-width:720px;color:#d2e5e9;font-size:18px}.history-shell,.forecast-shell,.radar-shell,.station-shell,.about-layout{padding-block:55px 80px}.history-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.segmented{display:flex;background:#eaf1f4;border-radius:12px;padding:4px}.segmented button{border:0;background:transparent;padding:10px 14px;border-radius:9px;font-weight:800;color:#5e7182;cursor:pointer}.segmented button.active{background:#fff;color:#0f7772;box-shadow:0 4px 12px rgba(0,0,0,.08)}.history-toolbar label{font-size:13px;font-weight:800}.history-toolbar select{margin-left:8px;padding:10px;border-radius:10px;border:1px solid var(--line);background:#fff}.chart-panel{background:#fff;border:1px solid var(--line);border-radius:24px;padding:26px;box-shadow:var(--shadow)}.chart-head{display:flex;justify-content:space-between;align-items:start}.chart-head span{color:var(--muted);font-size:13px}.chart-head strong{display:block;font-size:32px;margin-top:3px}.chart-summary{display:flex;gap:24px}.chart-summary b{color:var(--ink)}.svg-chart{height:370px;margin-top:20px}.svg-chart svg{width:100%;height:100%;overflow:visible}.chart-grid line{stroke:#deeaee;stroke-width:1}.chart-grid text{fill:#8091a1;font-size:11px}.chart-line{fill:none;stroke:#198d89;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}.chart-area{fill:url(#none);opacity:.12;fill:#35a9a0}.loading,.loading-card{display:grid;place-items:center;min-height:180px;color:var(--muted)}.history-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:18px}.history-cards article{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px}.history-cards b{display:block;margin-top:7px}.alert-stack{display:grid;gap:10px}.weather-alert{background:#fff0ef;border-left:5px solid #df5d59;padding:16px 18px;border-radius:12px}.weather-alert b,.weather-alert span{display:block}.forecast-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.forecast-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:20px;min-height:320px}.forecast-card>span{font-size:13px;font-weight:800;color:#477}.forecast-icon{font-size:44px;margin:15px 0}.forecast-card strong{font-family:Newsreader;font-size:40px}.forecast-card b{display:block;margin:4px 0 10px}.forecast-card small,.forecast-card p{color:var(--muted);font-size:12px}.hourly-heading{margin-top:0}.daily-heading{margin-top:50px}.hourly-strip{display:flex;overflow:auto;gap:10px;padding-bottom:12px}.hourly-strip article{flex:0 0 105px;background:#fff;border:1px solid var(--line);border-radius:17px;padding:14px;text-align:center}.hourly-strip span,.hourly-strip small{display:block;color:var(--muted);font-size:12px}.hourly-strip i{display:block;font-style:normal;font-size:25px;margin:8px}.hourly-strip b{font-size:22px}.radar-card{background:#fff;border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:var(--shadow)}.radar-toolbar{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid var(--line)}.radar-toolbar b,.radar-toolbar span{display:block}.radar-toolbar span{color:var(--muted);font-size:13px}.radar-image{background:#071b2d;display:grid;place-items:center;padding:16px}.radar-image img{width:min(100%,900px);border-radius:14px}.radar-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}.radar-notes article{background:#fff;border:1px solid var(--line);border-radius:15px;padding:18px}.radar-notes b,.radar-notes span{display:block}.radar-notes span{color:var(--muted);font-size:13px}.status-banner{display:flex;align-items:center;gap:15px;background:#e8f8f2;border:1px solid #ccecdf;padding:18px;border-radius:16px}.status-banner i{width:14px;height:14px;background:#25b98c;border-radius:50%;box-shadow:0 0 0 7px rgba(37,185,140,.14)}.status-banner b,.status-banner span{display:block}.status-banner span{color:var(--muted);font-size:13px}.status-banner.offline,.status-banner.stale{background:#fff5e8}.setup-warning{margin-top:14px;background:#fff8d9;border:1px solid #f0dda0;padding:16px;border-radius:14px}.setup-warning b,.setup-warning span{display:block}.station-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}.station-card,.payload-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:24px}.station-card>span{color:#29968f;font-size:12px;font-weight:800;text-transform:uppercase}.station-card h2{font-family:Newsreader;margin:6px 0 18px}.station-card dl{margin:0}.station-card dl div{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid #edf2f4}.station-card dt{color:var(--muted)}.station-card dd{font-weight:800;margin:0}.payload-card{margin-top:18px}.payload-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.payload-grid div{background:#f4f8f9;border-radius:10px;padding:10px}.payload-grid span,.payload-grid b{display:block;overflow-wrap:anywhere}.payload-grid span{font-size:11px;color:var(--muted)}.payload-grid b{font-size:12px;margin-top:4px}.about-layout{display:grid;grid-template-columns:1.4fr .6fr;gap:35px}.story{background:#fff;border:1px solid var(--line);border-radius:24px;padding:34px}.story h3{margin-top:30px}.feature-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.feature-list span{background:#edf7f6;border-radius:12px;padding:12px;font-weight:700}.about-card{background:var(--navy);color:#fff;border-radius:24px;padding:28px;align-self:start}.about-card img{background:#fff;border-radius:12px;padding:10px}.about-card h3{margin-top:25px}.about-card p{color:#cbdbe5}.site-footer{background:#081d32;color:#fff;padding:40px max(24px,calc((100% - 1180px)/2));display:grid;grid-template-columns:1fr 1.2fr .8fr;gap:30px;align-items:center}.site-footer>div{display:flex;align-items:center;gap:12px}.site-footer img{width:48px}.site-footer b,.site-footer small{display:block}.site-footer small,.site-footer p{color:#a9becd;font-size:12px}.footer-links{display:flex;gap:14px;justify-content:end}.footer-links a{color:#d8e7ed}
@media(max-width:980px){.main-nav{display:none;position:absolute;top:72px;left:18px;right:18px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:10px;box-shadow:var(--shadow)}.main-nav.open{display:grid}.nav-toggle{display:block}.header-live{margin-left:0}.hero-grid{grid-template-columns:1fr}.wind-orbit{display:none}.metric-grid,.detail-grid{grid-template-columns:repeat(2,1fr)}.split-section{grid-template-columns:1fr}.forecast-grid{grid-template-columns:repeat(2,1fr)}.station-grid{grid-template-columns:1fr}.payload-grid{grid-template-columns:repeat(2,1fr)}.site-footer{grid-template-columns:1fr}.footer-links{justify-content:start}.about-layout{grid-template-columns:1fr}}
@media(max-width:620px){.brand img{width:170px}.header-live{display:none}.weather-hero,.hero-grid{min-height:510px}.hero-grid{padding-block:45px}.hero-copy h1{font-size:112px}.hero-condition{font-size:29px}.hero-actions{flex-direction:column;align-items:stretch}.eyebrow{align-items:start;flex-direction:column}.metric-grid,.detail-grid,.history-cards,.radar-notes,.forecast-grid{grid-template-columns:1fr}.rain-layout{grid-template-columns:1fr}.stat-list.horizontal{grid-template-columns:1fr}.section-heading,.history-toolbar,.chart-head,.radar-toolbar,.neighborhood-note{align-items:flex-start;flex-direction:column}.chart-summary{gap:12px;flex-wrap:wrap}.page-hero h1{font-size:44px}.payload-grid,.feature-list{grid-template-columns:1fr}.site-footer{padding:35px 22px}}

/* Twin Oaks Weather v2 brand and live-data refinements */
:root{--forest:#12482e;--forest-dark:#092f20;--burgundy:#8e1728;--cream:#f5f0df;--gold:#e3bd49;--teal:#1f8f82}
body{background:#f7f8f4}
.site-header{background:rgba(255,253,247,.95);border-bottom-color:rgba(68,88,72,.17)}
.header-inner{padding-block:7px;min-height:78px}
.brand{min-width:286px;gap:12px}
.brand img{width:72px;height:64px;object-fit:contain;object-position:center;filter:drop-shadow(0 3px 5px rgba(22,45,28,.14))}
.brand span{display:block;line-height:1.12}.brand b{display:block;color:var(--forest);font-family:Georgia,"Times New Roman",serif;font-size:19px}.brand small{display:block;color:#77666a;font-size:11px;margin-top:4px;letter-spacing:.06em;text-transform:uppercase}
.main-nav a:hover,.main-nav a.active{background:#edf4ec;color:var(--forest)}
.header-live{background:#fffdf8;border-color:#ded9c9;color:var(--forest)}
.status-dot[data-state="demo"]{background:var(--gold);box-shadow:0 0 0 5px rgba(227,189,73,.18)}.status-dot[data-state="stale"]{background:#e7902d;box-shadow:0 0 0 5px rgba(231,144,45,.17)}.status-dot[data-state="offline"]{background:#c94747;box-shadow:0 0 0 5px rgba(201,71,71,.16)}
.home-notices{padding-top:16px}.home-notices:empty{display:none}.data-notice{display:flex;align-items:center;gap:14px;padding:13px 16px;border-radius:15px;border:1px solid #ead7a1;background:#fff9e7;margin-bottom:10px}.data-notice[hidden]{display:none}.data-notice i{width:11px;height:11px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 6px rgba(227,189,73,.17);flex:0 0 auto}.data-notice b,.data-notice span{display:block}.data-notice b{color:#704d09}.data-notice span{font-size:13px;color:#786742}.data-notice.status-stale{background:#fff3df;border-color:#eccd9f}.data-notice.status-stale i{background:#e7902d}.data-notice.status-offline{background:#fff0ef;border-color:#e8bab7}.data-notice.status-offline i{background:#c94747}.data-notice.status-offline b{color:#8c2929}
.home-alerts{margin-bottom:10px}.home-alerts[hidden]{display:none}.home-alert{display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:center;padding:15px 18px;border-radius:15px;background:linear-gradient(110deg,#7d1221,#a42938);color:#fff;box-shadow:0 12px 32px rgba(120,15,33,.2)}.home-alert>span{grid-row:1/3;background:#fff2d1;color:#7d1221;border-radius:999px;padding:7px 10px;font-weight:900;font-size:11px;text-transform:uppercase;letter-spacing:.08em}.home-alert b{font-size:17px}.home-alert small{color:#ffe7e8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.weather-hero{min-height:490px;background:linear-gradient(125deg,#0c283c 0%,#0d493b 60%,#276f66 100%)}.weather-hero.is-night{background:linear-gradient(130deg,#071627 0%,#0b2935 58%,#123f3a 100%)}.weather-hero.is-day{background:linear-gradient(125deg,#0c2b42 0%,#115b50 60%,#358b78 100%)}
.hero-grid{min-height:490px;padding-block:54px;grid-template-columns:1.25fr .75fr;gap:48px}.hero-community-mark{position:absolute;right:-70px;bottom:-165px;width:490px;opacity:.075;filter:grayscale(.15);pointer-events:none;z-index:1}.weather-hero.is-night .hero-community-mark{opacity:.045}.weather-hero.is-night .orb{width:170px;height:170px;top:55px;right:12%;background:radial-gradient(circle at 38% 35%,#fff,#e9edf1 48%,rgba(219,231,239,.26) 66%,transparent 67%);opacity:.86}.weather-hero.is-night .orb:after{content:"";position:absolute;width:170px;height:170px;border-radius:50%;left:43px;top:-24px;background:#0b2634}.weather-hero.is-day .stars{display:none}.stars{position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.65) 0 1px,transparent 1.5px);background-size:83px 73px;opacity:.28}.weather-hero.is-night .cloud{opacity:.23}.weather-hero.is-day .cloud{opacity:.7}
.hero-copy h1{font-size:clamp(92px,12vw,154px);margin:24px 0 7px}.hero-condition{font-size:33px;margin:15px 0 8px}.hero-records{display:flex;gap:10px;margin:15px 0 8px}.hero-records span{min-width:120px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);padding:9px 12px;border-radius:13px}.hero-records small,.hero-records b{display:block}.hero-records small{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:#cae0dd}.hero-records b{font-size:20px;margin-top:2px}.hero-actions{margin-top:22px}.button.primary{background:var(--cream);color:var(--forest-dark)}.button.dark{background:var(--forest);color:#fff}.button.dark:hover{background:var(--burgundy)}
.wind-ring{width:244px;height:244px}.wind-center{inset:76px}.wind-arrow{height:84px}.dashboard-section,.split-section,.neighborhood-note{margin-top:54px}.kicker{color:var(--burgundy)}.section-heading>a{color:var(--forest)}.station-badge{background:#e5f3e8;color:var(--forest)}.station-badge.status-demo{background:#fff2c9;color:#7c5a08}.station-badge.status-stale{background:#fff0dc;color:#9b5c0a}.station-badge.status-offline{background:#ffe8e7;color:#9a2c2c}
.metric-card{border-color:#dde5dc}.metric-card .metric-icon{background:#edf4ec}.rain-panel{border-top:4px solid #4f9ecc}.sun-panel{border-top:4px solid var(--gold)}.detail-grid article{border-top:3px solid #d6dfd5}.neighborhood-note{background:linear-gradient(120deg,#f5f0df,#edf4ec);border-color:#dfdac8;padding:28px 34px;display:grid;grid-template-columns:1fr auto;gap:28px}.neighborhood-note p{margin-bottom:0}.page-hero{background:linear-gradient(125deg,#0b2c28,#155b43 65%,#8e1728 150%)}.about-card{background:linear-gradient(145deg,var(--forest-dark),var(--forest))}.about-card img{width:100%;max-height:260px;object-fit:contain;background:var(--cream);padding:14px}.site-footer{background:#092c21}.site-footer small,.site-footer p{color:#bcd0c4}.footer-links a{color:#f3e7c9}
@media(max-width:980px){.brand{min-width:220px}.brand img{width:62px;height:56px}.brand b{font-size:17px}.main-nav{top:78px}.hero-community-mark{right:-140px}.neighborhood-note{grid-template-columns:1fr auto}.neighborhood-note .button{grid-column:2}}
@media(max-width:620px){.header-inner{min-height:68px;padding-inline:14px}.brand{min-width:0}.brand img{width:55px;height:50px}.brand b{font-size:15px}.brand small{font-size:9px}.weather-hero,.hero-grid{min-height:470px}.hero-grid{padding-block:38px}.hero-copy h1{font-size:92px}.hero-condition{font-size:27px}.hero-records span{min-width:105px}.home-alert{grid-template-columns:1fr}.home-alert>span{grid-row:auto;width:max-content;margin-bottom:6px}.home-alert small{white-space:normal}.neighborhood-note{grid-template-columns:1fr}.neighborhood-note .button{grid-column:auto}}

/* Twin Oaks Weather v3: full-site solar theme */
body,.site-header,.main-nav,.nav-toggle,.header-live,.metric-card,.panel,.detail-grid article,.neighborhood-note,.chart-panel,.history-cards article,.forecast-card,.hourly-strip article,.radar-card,.radar-notes article,.station-card,.payload-card,.payload-grid div,.story,.about-card,.segmented,.segmented button,.history-toolbar select,.data-notice,.site-footer{transition:background-color 1.2s ease,background 1.2s ease,color 1.2s ease,border-color 1.2s ease,box-shadow 1.2s ease}
body[data-sun-phase="dawn"]{background:#ecebe2;color:#1c3028;--ink:#1c3028;--muted:#66756d;--line:#d2d8ce;--shadow:0 22px 60px rgba(29,52,42,.12)}
body[data-sun-phase="dawn"] .site-header{background:rgba(245,240,224,.94)}
body[data-sun-phase="dawn"] .weather-hero{background:linear-gradient(125deg,#263b4a 0%,#78644f 58%,#c58c65 100%)}
body[data-sun-phase="dawn"] .orb{background:radial-gradient(circle at 35% 35%,#fffbe7,#f5c87b 40%,rgba(245,200,123,.25) 66%,transparent 67%)}
body[data-sun-phase="dawn"] .metric-card,body[data-sun-phase="dawn"] .panel,body[data-sun-phase="dawn"] .detail-grid article,body[data-sun-phase="dawn"] .chart-panel,body[data-sun-phase="dawn"] .history-cards article,body[data-sun-phase="dawn"] .forecast-card,body[data-sun-phase="dawn"] .radar-card,body[data-sun-phase="dawn"] .radar-notes article,body[data-sun-phase="dawn"] .station-card,body[data-sun-phase="dawn"] .payload-card,body[data-sun-phase="dawn"] .story{background:#f7f5ec}
body[data-sun-phase="dusk"]{background:#17211d;color:#e5ece7;--ink:#e5ece7;--muted:#a9b6ae;--line:#394b42;--shadow:0 22px 60px rgba(0,0,0,.27)}
body[data-sun-phase="night"]{background:#07110e;color:#e8efea;--ink:#e8efea;--muted:#a6b6ad;--line:#294038;--shadow:0 22px 60px rgba(0,0,0,.38)}
body[data-sun-phase="dusk"] .site-header,body[data-sun-phase="night"] .site-header{background:rgba(8,25,19,.94);border-bottom-color:#2a4037}
body[data-sun-phase="dusk"] .brand b,body[data-sun-phase="night"] .brand b{color:#edf4ef}
body[data-sun-phase="dusk"] .brand small,body[data-sun-phase="night"] .brand small{color:#b6c2ba}
body[data-sun-phase="dusk"] .main-nav a,body[data-sun-phase="night"] .main-nav a{color:#b8c8bf}
body[data-sun-phase="dusk"] .main-nav a:hover,body[data-sun-phase="dusk"] .main-nav a.active,body[data-sun-phase="night"] .main-nav a:hover,body[data-sun-phase="night"] .main-nav a.active{background:#1b392d;color:#fff4d5}
body[data-sun-phase="dusk"] .nav-toggle,body[data-sun-phase="night"] .nav-toggle{background:#163126;color:#f2f7f3}
body[data-sun-phase="dusk"] .header-live,body[data-sun-phase="night"] .header-live{background:#10281f;border-color:#355044;color:#eaf2ed}
body[data-sun-phase="dusk"] .weather-hero{background:linear-gradient(130deg,#111b2a 0%,#25352f 58%,#654735 100%)}
body[data-sun-phase="night"] .weather-hero{background:linear-gradient(130deg,#040a12 0%,#081b21 58%,#0d3029 100%)}
body[data-sun-phase="dusk"] .page-hero{background:linear-gradient(125deg,#101c1a,#293d31 65%,#641829 145%)}
body[data-sun-phase="night"] .page-hero{background:linear-gradient(125deg,#050e0c,#123024 68%,#48121c 150%)}
body[data-sun-phase="dusk"] .metric-card,body[data-sun-phase="dusk"] .panel,body[data-sun-phase="dusk"] .detail-grid article,body[data-sun-phase="dusk"] .chart-panel,body[data-sun-phase="dusk"] .history-cards article,body[data-sun-phase="dusk"] .forecast-card,body[data-sun-phase="dusk"] .hourly-strip article,body[data-sun-phase="dusk"] .radar-card,body[data-sun-phase="dusk"] .radar-notes article,body[data-sun-phase="dusk"] .station-card,body[data-sun-phase="dusk"] .payload-card,body[data-sun-phase="dusk"] .story{background:#222e28;border-color:#3d5147;box-shadow:0 14px 38px rgba(0,0,0,.22)}
body[data-sun-phase="night"] .metric-card,body[data-sun-phase="night"] .panel,body[data-sun-phase="night"] .detail-grid article,body[data-sun-phase="night"] .chart-panel,body[data-sun-phase="night"] .history-cards article,body[data-sun-phase="night"] .forecast-card,body[data-sun-phase="night"] .hourly-strip article,body[data-sun-phase="night"] .radar-card,body[data-sun-phase="night"] .radar-notes article,body[data-sun-phase="night"] .station-card,body[data-sun-phase="night"] .payload-card,body[data-sun-phase="night"] .story{background:#102019;border-color:#294239;box-shadow:0 14px 40px rgba(0,0,0,.34)}
body[data-sun-phase="dusk"] .metric-card .metric-icon,body[data-sun-phase="night"] .metric-card .metric-icon{background:#1d382d}
body[data-sun-phase="dusk"] .metric-card small,body[data-sun-phase="night"] .metric-card small,body[data-sun-phase="dusk"] .neighborhood-note p,body[data-sun-phase="night"] .neighborhood-note p,body[data-sun-phase="dusk"] .station-card dt,body[data-sun-phase="night"] .station-card dt{color:var(--muted)}
body[data-sun-phase="dusk"] .stat-list>div,body[data-sun-phase="night"] .stat-list>div,body[data-sun-phase="dusk"] .station-card dl div,body[data-sun-phase="night"] .station-card dl div{border-bottom-color:#31473d}
body[data-sun-phase="dusk"] .rain-drop{background:linear-gradient(135deg,#193e4b,#24596a)}
body[data-sun-phase="night"] .rain-drop{background:linear-gradient(135deg,#112d38,#174451)}
body[data-sun-phase="dusk"] .rain-drop small,body[data-sun-phase="night"] .rain-drop small{color:#b7dbe5}
body[data-sun-phase="dusk"] .sun-panel{background:linear-gradient(150deg,#232d27 20%,#3a3322)}
body[data-sun-phase="night"] .sun-panel{background:linear-gradient(150deg,#101d18 20%,#282316)}
body[data-sun-phase="dusk"] .uv-chip,body[data-sun-phase="night"] .uv-chip{background:#4a3d19;color:#ffe29a}
body[data-sun-phase="dusk"] .sun-track,body[data-sun-phase="night"] .sun-track{opacity:.72}
body[data-sun-phase="dusk"] .neighborhood-note{background:linear-gradient(120deg,#2d2b23,#1f3329);border-color:#465044}
body[data-sun-phase="night"] .neighborhood-note{background:linear-gradient(120deg,#191b16,#11281e);border-color:#324439}
body[data-sun-phase="dusk"] .button.dark,body[data-sun-phase="night"] .button.dark{background:#8e1728}
body[data-sun-phase="dusk"] .section-heading>a,body[data-sun-phase="night"] .section-heading>a{color:#9bd2b5}
body[data-sun-phase="dusk"] .kicker,body[data-sun-phase="night"] .kicker{color:#ef8594}
body[data-sun-phase="dusk"] .station-badge,body[data-sun-phase="night"] .station-badge{background:#1b402f;color:#b8eccd}
body[data-sun-phase="dusk"] .segmented,body[data-sun-phase="night"] .segmented{background:#162a22}
body[data-sun-phase="dusk"] .segmented button,body[data-sun-phase="night"] .segmented button{color:#a9b9b0}
body[data-sun-phase="dusk"] .segmented button.active,body[data-sun-phase="night"] .segmented button.active{background:#294238;color:#f0f7f2}
body[data-sun-phase="dusk"] .history-toolbar select,body[data-sun-phase="night"] .history-toolbar select{background:#15271f;color:#eaf1ec;border-color:#395045}
body[data-sun-phase="dusk"] .payload-grid div,body[data-sun-phase="night"] .payload-grid div{background:#172b23}
body[data-sun-phase="dusk"] .about-card,body[data-sun-phase="night"] .about-card{background:linear-gradient(145deg,#050d0a,#153726)}
body[data-sun-phase="dusk"] .about-card img,body[data-sun-phase="night"] .about-card img{background:#d9d3c1}
body[data-sun-phase="dusk"] .feature-list span,body[data-sun-phase="night"] .feature-list span{background:#193328;color:#dfeae3}
body[data-sun-phase="dusk"] .radar-image,body[data-sun-phase="night"] .radar-image{background:#08110e}
body[data-sun-phase="dusk"] .dark-text,body[data-sun-phase="night"] .dark-text{color:#e8f0eb!important;border-color:#4b6156!important}
body[data-sun-phase="dusk"] .data-notice.status-demo,body[data-sun-phase="night"] .data-notice.status-demo{background:#352d17;border-color:#67582a}
body[data-sun-phase="dusk"] .data-notice.status-demo b,body[data-sun-phase="night"] .data-notice.status-demo b{color:#ffe09a}
body[data-sun-phase="dusk"] .data-notice.status-demo span,body[data-sun-phase="night"] .data-notice.status-demo span{color:#d7c28d}
body[data-sun-phase="dusk"] .site-footer{background:#071912}
body[data-sun-phase="night"] .site-footer{background:#030b08}
@media(max-width:980px){body[data-sun-phase="dusk"] .main-nav,body[data-sun-phase="night"] .main-nav{background:#10251c;border-color:#355044}}

/* v3.1: keep native history metric controls readable in light and dark browser themes */
.history-toolbar select{
  color:var(--ink);
  -webkit-text-fill-color:var(--ink);
  color-scheme:light;
  min-width:190px;
  font:inherit;
  font-weight:700;
}
.history-toolbar select option{
  background:#fff;
  color:#13253b;
  -webkit-text-fill-color:#13253b;
}
body[data-sun-phase="dusk"] .history-toolbar select,
body[data-sun-phase="night"] .history-toolbar select{
  color:#eaf1ec;
  -webkit-text-fill-color:#eaf1ec;
  color-scheme:dark;
}
body[data-sun-phase="dusk"] .history-toolbar select option,
body[data-sun-phase="night"] .history-toolbar select option{
  background:#15271f;
  color:#eaf1ec;
  -webkit-text-fill-color:#eaf1ec;
}

/* ============================================================
   Twin Oaks Weather v4: live weather appearance engine
   The sun phase controls brightness; the weather mode controls atmosphere.
   ============================================================ */
.hero-weather-detail{max-width:560px;margin:0 0 6px;color:#bcd8dd;font-size:14px}.weather-effects{position:absolute;inset:0;z-index:.5;overflow:hidden;pointer-events:none}.weather-effects>span{position:absolute;opacity:0;transition:opacity 1.2s ease}.storm-cloud{width:520px;height:120px;border-radius:999px;background:rgba(19,30,39,.76);filter:blur(2px);box-shadow:120px -40px 0 5px rgba(24,36,45,.68),250px 5px 0 -15px rgba(15,25,33,.72)}.storm-cloud:before,.storm-cloud:after{content:"";position:absolute;border-radius:50%;background:inherit}.storm-cloud:before{width:210px;height:210px;left:85px;bottom:0}.storm-cloud:after{width:170px;height:170px;right:70px;bottom:0}.storm-cloud-a{right:-120px;top:25px}.storm-cloud-b{left:-210px;top:140px;transform:scale(.75)}.rain-curtain{inset:-20% -10%;background-image:repeating-linear-gradient(112deg,transparent 0 16px,rgba(202,234,248,.42) 17px 18px,transparent 19px 34px);background-size:180px 180px;transform:translateZ(0)}.snow-field{inset:-20%;background-image:radial-gradient(circle,rgba(255,255,255,.95) 0 2px,transparent 2.8px),radial-gradient(circle,rgba(236,248,255,.8) 0 1.5px,transparent 2.3px),radial-gradient(circle,rgba(255,255,255,.7) 0 3px,transparent 3.8px);background-size:96px 110px,137px 151px,211px 230px;background-position:15px 8px,43px 61px,104px 29px}.snow-field-b{filter:blur(1px);transform:scale(1.15);opacity:0}.fog-bank{left:-15%;right:-15%;height:150px;border-radius:50%;background:linear-gradient(90deg,transparent,rgba(225,235,235,.65) 20%,rgba(242,247,246,.75) 55%,rgba(213,225,224,.55) 80%,transparent);filter:blur(17px)}.fog-bank-a{top:90px}.fog-bank-b{bottom:35px;transform:scaleX(1.2)}.lightning-flash{inset:0;background:radial-gradient(circle at 72% 18%,rgba(255,255,255,.95),rgba(218,232,255,.26) 20%,transparent 48%)}.wind-lines{inset:0;background-image:repeating-linear-gradient(170deg,transparent 0 30px,rgba(222,251,246,.2) 31px 32px,transparent 33px 72px);background-size:360px 160px}.heat-haze{inset:-15%;background:repeating-radial-gradient(ellipse at 50% 110%,rgba(255,215,145,.12) 0 18px,transparent 20px 42px);filter:blur(4px)}.frost-edge{inset:0;box-shadow:inset 0 0 70px rgba(210,239,255,.52);background:linear-gradient(120deg,rgba(255,255,255,.12),transparent 28%,transparent 75%,rgba(215,241,255,.13))}

@keyframes wxRain{from{background-position:0 -180px}to{background-position:80px 180px}}
@keyframes wxSnowA{from{background-position:15px -170px,43px -100px,104px -220px}to{background-position:55px 170px,5px 205px,155px 240px}}
@keyframes wxSnowB{from{background-position:0 -120px,70px -180px,20px -260px}to{background-position:-70px 220px,130px 180px,-30px 260px}}
@keyframes wxFogA{0%,100%{transform:translateX(-4%) scaleX(1.1)}50%{transform:translateX(7%) scaleX(1.2)}}
@keyframes wxFogB{0%,100%{transform:translateX(6%) scaleX(1.25)}50%{transform:translateX(-8%) scaleX(1.15)}}
@keyframes wxLightning{0%,88%,91%,100%{opacity:0}89%{opacity:.75}90%{opacity:.08}92%{opacity:.45}93%{opacity:0}}
@keyframes wxWind{from{background-position:-360px 0}to{background-position:360px -30px}}
@keyframes wxCloudDriftA{from{transform:translateX(0)}to{transform:translateX(-120px)}}
@keyframes wxCloudDriftB{from{transform:scale(.75) translateX(0)}to{transform:scale(.75) translateX(150px)}}
@keyframes wxHeat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-8px) scale(1.025)}}

body[data-weather-mode="cloud"]{--wx-page:#e8edeb;--wx-card:#f6f8f7;--wx-line:#ccd7d3;--wx-ink:#1a302b;--wx-muted:#64736e;--wx-header:rgba(241,244,241,.94);--wx-icon:#e3ebe7;--wx-note:#e5ece7;--wx-footer:#16372e;--wx-pagehero:linear-gradient(125deg,#314753,#46645e 65%,#526a63)}
body[data-weather-mode="rain"]{--wx-page:#dce7eb;--wx-card:#f1f7f9;--wx-line:#bfd0d7;--wx-ink:#122b39;--wx-muted:#5d7480;--wx-header:rgba(231,240,243,.94);--wx-icon:#dbecef;--wx-note:#dcebed;--wx-footer:#102e39;--wx-pagehero:linear-gradient(125deg,#173544,#23546a 65%,#315f68)}
body[data-weather-mode="storm"]{--wx-page:#cfd8dc;--wx-card:#e8eef0;--wx-line:#aebdc4;--wx-ink:#152731;--wx-muted:#566a73;--wx-header:rgba(220,228,230,.95);--wx-icon:#d5e0e3;--wx-note:#d9e2e4;--wx-footer:#101e26;--wx-pagehero:linear-gradient(125deg,#16232d,#293b46 68%,#4d3039)}
body[data-weather-mode="severe"]{--wx-page:#d6c9cb;--wx-card:#eee7e8;--wx-line:#c4aeb2;--wx-ink:#30171c;--wx-muted:#765b61;--wx-header:rgba(237,228,229,.95);--wx-icon:#eadbde;--wx-note:#eadfe0;--wx-footer:#26070d;--wx-pagehero:linear-gradient(125deg,#21070c,#4b101b 60%,#741727)}
body[data-weather-mode="snow"]{--wx-page:#edf4f7;--wx-card:#fbfdfe;--wx-line:#cddde5;--wx-ink:#193247;--wx-muted:#647989;--wx-header:rgba(247,251,252,.95);--wx-icon:#e8f3f8;--wx-note:#edf5f8;--wx-footer:#19384c;--wx-pagehero:linear-gradient(125deg,#6c8799,#9db4c2 58%,#d5e1e7)}
body[data-weather-mode="ice"]{--wx-page:#e4edf2;--wx-card:#f7fbfd;--wx-line:#bfd0dc;--wx-ink:#172f43;--wx-muted:#607687;--wx-header:rgba(239,247,250,.95);--wx-icon:#e1eef5;--wx-note:#e6f0f4;--wx-footer:#153249;--wx-pagehero:linear-gradient(125deg,#486779,#809cad 58%,#bbccd5)}
body[data-weather-mode="fog"]{--wx-page:#e1e5e2;--wx-card:#f3f5f3;--wx-line:#c8ceca;--wx-ink:#26332f;--wx-muted:#6b7571;--wx-header:rgba(239,242,239,.95);--wx-icon:#e5e9e6;--wx-note:#e7eae7;--wx-footer:#273832;--wx-pagehero:linear-gradient(125deg,#66726f,#8d9894 58%,#bdc5c2)}
body[data-weather-mode="wind"]{--wx-page:#dfeceb;--wx-card:#f3f9f8;--wx-line:#bed3d0;--wx-ink:#173735;--wx-muted:#5e7875;--wx-header:rgba(234,244,243,.95);--wx-icon:#deefec;--wx-note:#e1efec;--wx-footer:#123b37;--wx-pagehero:linear-gradient(125deg,#1a4c4a,#2f7770 60%,#56998d)}
body[data-weather-mode="heat"]{--wx-page:#f2e4d1;--wx-card:#fff8ed;--wx-line:#e2c8a6;--wx-ink:#44291b;--wx-muted:#806957;--wx-header:rgba(252,245,234,.95);--wx-icon:#f8ead3;--wx-note:#f5e8d4;--wx-footer:#542716;--wx-pagehero:linear-gradient(125deg,#75361b,#b5652d 58%,#d89b50)}
body[data-weather-mode="cold"]{--wx-page:#e1edf6;--wx-card:#f5faff;--wx-line:#c3d7e5;--wx-ink:#17334c;--wx-muted:#60798e;--wx-header:rgba(237,246,251,.95);--wx-icon:#dfedf7;--wx-note:#e4f0f8;--wx-footer:#123250;--wx-pagehero:linear-gradient(125deg,#244d72,#3f759e 58%,#6ca4c4)}

body[data-sun-phase="dusk"][data-weather-mode]:not([data-weather-mode="clear"]),body[data-sun-phase="night"][data-weather-mode]:not([data-weather-mode="clear"]){--wx-page:#0d1715;--wx-card:#17241f;--wx-line:#344941;--wx-ink:#e6eee9;--wx-muted:#a5b4ac;--wx-header:rgba(9,23,18,.95);--wx-icon:#20372e;--wx-note:#1b3028;--wx-footer:#030b08}
body[data-sun-phase="dusk"][data-weather-mode="rain"],body[data-sun-phase="night"][data-weather-mode="rain"]{--wx-page:#09161d;--wx-card:#12252d;--wx-line:#2b4651;--wx-icon:#193640;--wx-note:#18323b;--wx-footer:#02090d}
body[data-sun-phase="dusk"][data-weather-mode="storm"],body[data-sun-phase="night"][data-weather-mode="storm"]{--wx-page:#060a0e;--wx-card:#11191e;--wx-line:#303b42;--wx-icon:#1d292f;--wx-note:#151f24;--wx-footer:#020405}
body[data-sun-phase="dusk"][data-weather-mode="severe"],body[data-sun-phase="night"][data-weather-mode="severe"]{--wx-page:#100306;--wx-card:#200b10;--wx-line:#5b2831;--wx-icon:#35141a;--wx-note:#2c1016;--wx-footer:#050102}
body[data-sun-phase="dusk"][data-weather-mode="snow"],body[data-sun-phase="night"][data-weather-mode="snow"]{--wx-page:#0d1c29;--wx-card:#172b3a;--wx-line:#395366;--wx-icon:#1e3a4e;--wx-note:#1d3445;--wx-footer:#050d14}
body[data-sun-phase="dusk"][data-weather-mode="ice"],body[data-sun-phase="night"][data-weather-mode="ice"]{--wx-page:#091a28;--wx-card:#142a39;--wx-line:#355166;--wx-icon:#1b3a4d;--wx-note:#193445;--wx-footer:#040c13}
body[data-sun-phase="dusk"][data-weather-mode="fog"],body[data-sun-phase="night"][data-weather-mode="fog"]{--wx-page:#151c1a;--wx-card:#222b28;--wx-line:#46514d;--wx-icon:#2d3935;--wx-note:#29332f;--wx-footer:#080d0b}
body[data-sun-phase="dusk"][data-weather-mode="wind"],body[data-sun-phase="night"][data-weather-mode="wind"]{--wx-page:#071b1a;--wx-card:#102b28;--wx-line:#2c504b;--wx-icon:#183d38;--wx-note:#173732;--wx-footer:#020b0a}
body[data-sun-phase="dusk"][data-weather-mode="heat"],body[data-sun-phase="night"][data-weather-mode="heat"]{--wx-page:#211108;--wx-card:#332015;--wx-line:#64432d;--wx-icon:#49301e;--wx-note:#40291a;--wx-footer:#0d0603}
body[data-sun-phase="dusk"][data-weather-mode="cold"],body[data-sun-phase="night"][data-weather-mode="cold"]{--wx-page:#071526;--wx-card:#11263b;--wx-line:#31506b;--wx-icon:#193650;--wx-note:#183247;--wx-footer:#020912}

body[data-weather-mode]:not([data-weather-mode="clear"]){background:var(--wx-page);color:var(--wx-ink);--ink:var(--wx-ink);--muted:var(--wx-muted);--line:var(--wx-line);--shadow:0 22px 60px rgba(8,28,34,.18)}
body[data-weather-mode]:not([data-weather-mode="clear"]) .site-header{background:var(--wx-header);border-bottom-color:var(--wx-line)}
body[data-weather-mode]:not([data-weather-mode="clear"]) .main-nav a{color:var(--wx-muted)}
body[data-weather-mode]:not([data-weather-mode="clear"]) .main-nav a:hover,body[data-weather-mode]:not([data-weather-mode="clear"]) .main-nav a.active{background:var(--wx-icon);color:var(--wx-ink)}
body[data-weather-mode]:not([data-weather-mode="clear"]) .header-live,body[data-weather-mode]:not([data-weather-mode="clear"]) .nav-toggle{background:var(--wx-card);border-color:var(--wx-line);color:var(--wx-ink)}
body[data-weather-mode]:not([data-weather-mode="clear"]) .page-hero{background:var(--wx-pagehero)}
body[data-weather-mode]:not([data-weather-mode="clear"]) .metric-card,body[data-weather-mode]:not([data-weather-mode="clear"]) .panel,body[data-weather-mode]:not([data-weather-mode="clear"]) .detail-grid article,body[data-weather-mode]:not([data-weather-mode="clear"]) .chart-panel,body[data-weather-mode]:not([data-weather-mode="clear"]) .history-cards article,body[data-weather-mode]:not([data-weather-mode="clear"]) .forecast-card,body[data-weather-mode]:not([data-weather-mode="clear"]) .hourly-strip article,body[data-weather-mode]:not([data-weather-mode="clear"]) .radar-card,body[data-weather-mode]:not([data-weather-mode="clear"]) .radar-notes article,body[data-weather-mode]:not([data-weather-mode="clear"]) .station-card,body[data-weather-mode]:not([data-weather-mode="clear"]) .payload-card,body[data-weather-mode]:not([data-weather-mode="clear"]) .story{background:var(--wx-card);border-color:var(--wx-line);box-shadow:0 14px 40px rgba(9,32,38,.12)}
body[data-weather-mode]:not([data-weather-mode="clear"]) .metric-card .metric-icon,body[data-weather-mode]:not([data-weather-mode="clear"]) .payload-grid div,body[data-weather-mode]:not([data-weather-mode="clear"]) .feature-list span{background:var(--wx-icon);color:var(--wx-ink)}
body[data-weather-mode]:not([data-weather-mode="clear"]) .neighborhood-note{background:var(--wx-note);border-color:var(--wx-line)}
body[data-weather-mode]:not([data-weather-mode="clear"]) .neighborhood-note p,body[data-weather-mode]:not([data-weather-mode="clear"]) .metric-card small{color:var(--wx-muted)}
body[data-weather-mode]:not([data-weather-mode="clear"]) .site-footer{background:var(--wx-footer)}
body[data-weather-mode]:not([data-weather-mode="clear"]) .segmented{background:var(--wx-icon)}
body[data-weather-mode]:not([data-weather-mode="clear"]) .segmented button{color:var(--wx-muted)}
body[data-weather-mode]:not([data-weather-mode="clear"]) .segmented button.active,body[data-weather-mode]:not([data-weather-mode="clear"]) .history-toolbar select{background:var(--wx-card);color:var(--wx-ink);-webkit-text-fill-color:var(--wx-ink);border-color:var(--wx-line)}
body[data-weather-mode]:not([data-weather-mode="clear"]) .history-toolbar select option{background:var(--wx-card);color:var(--wx-ink);-webkit-text-fill-color:var(--wx-ink)}
body[data-weather-mode]:not([data-weather-mode="clear"]) .sun-panel{background:linear-gradient(145deg,var(--wx-card),var(--wx-note))}
body[data-weather-mode]:not([data-weather-mode="clear"]) .stat-list>div,body[data-weather-mode]:not([data-weather-mode="clear"]) .station-card dl div{border-color:var(--wx-line)}

body[data-weather-mode="cloud"] .weather-hero{background:linear-gradient(125deg,#314955,#4b6968 58%,#6f847f)}
body[data-weather-mode="cloud"] .orb{opacity:.3;filter:blur(5px)}
body[data-weather-mode="cloud"] .cloud{opacity:.88!important;background:rgba(225,233,232,.34)}
body[data-weather-mode="rain"] .weather-hero{background:linear-gradient(125deg,#122d3a,#1c4958 58%,#285866)}
body[data-weather-mode="rain"] .orb{opacity:.12;filter:blur(8px)}
body[data-weather-mode="rain"] .cloud{opacity:.85!important;background:rgba(43,67,78,.64)}
body[data-weather-mode="rain"] .storm-cloud,body[data-weather-mode="rain"] .rain-curtain{opacity:.48}
body[data-weather-mode="rain"] .rain-curtain{animation:wxRain .75s linear infinite}
body[data-weather-mode="rain"][data-weather-intensity="moderate"] .rain-curtain{opacity:.67;animation-duration:.55s}
body[data-weather-mode="rain"][data-weather-intensity="heavy"] .rain-curtain{opacity:.82;animation-duration:.38s}
body[data-weather-mode="rain"] .rain-panel{box-shadow:0 18px 55px rgba(49,130,170,.24);border-top-color:#278cc2}
body[data-weather-mode="storm"] .weather-hero{background:linear-gradient(125deg,#0a1218,#17252e 55%,#27333a)}
body[data-weather-mode="storm"] .orb,body[data-weather-mode="severe"] .orb{opacity:.04}
body[data-weather-mode="storm"] .cloud,body[data-weather-mode="severe"] .cloud{opacity:.2!important}
body[data-weather-mode="storm"] .storm-cloud,body[data-weather-mode="storm"] .rain-curtain{opacity:.78}
body[data-weather-mode="storm"] .storm-cloud-a{animation:wxCloudDriftA 18s ease-in-out infinite alternate}
body[data-weather-mode="storm"] .storm-cloud-b{animation:wxCloudDriftB 23s ease-in-out infinite alternate}
body[data-weather-mode="storm"] .rain-curtain{animation:wxRain .34s linear infinite}
body[data-weather-mode="storm"] .lightning-flash{animation:wxLightning 17s linear infinite}
body[data-weather-mode="severe"] .weather-hero{background:linear-gradient(125deg,#10060a,#250a11 55%,#47111d)}
body[data-weather-mode="severe"] .storm-cloud,body[data-weather-mode="severe"] .rain-curtain{opacity:.86}
body[data-weather-mode="severe"] .rain-curtain{animation:wxRain .3s linear infinite}
body[data-weather-mode="severe"] .lightning-flash{animation:wxLightning 10s linear infinite}
body[data-weather-mode="severe"] .live-pill{background:#8d1728;border-color:#d05d6d}
body[data-weather-mode="snow"] .weather-hero{background:linear-gradient(125deg,#496a82,#6f8da0 57%,#a8bdc9)}
body[data-weather-mode="snow"] .orb{opacity:.25;filter:blur(6px)}
body[data-weather-mode="snow"] .cloud{opacity:.55!important;background:rgba(235,244,248,.45)}
body[data-weather-mode="snow"] .snow-field-a{opacity:.76;animation:wxSnowA 11s linear infinite}
body[data-weather-mode="snow"] .snow-field-b{opacity:.45;animation:wxSnowB 17s linear infinite}
body[data-weather-mode="snow"] .frost-edge{opacity:.55}
body[data-weather-mode="ice"] .weather-hero{background:linear-gradient(125deg,#3c5a70,#657f92 57%,#93aebb)}
body[data-weather-mode="ice"] .rain-curtain{opacity:.38;animation:wxRain 1.05s linear infinite}
body[data-weather-mode="ice"] .frost-edge{opacity:.82}
body[data-weather-mode="fog"] .weather-hero{background:linear-gradient(125deg,#556562,#75827e 57%,#98a19e)}
body[data-weather-mode="fog"] .orb{opacity:.15;filter:blur(13px)}
body[data-weather-mode="fog"] .cloud{opacity:.22!important}
body[data-weather-mode="fog"] .fog-bank-a{opacity:.38;animation:wxFogA 18s ease-in-out infinite}
body[data-weather-mode="fog"] .fog-bank-b{opacity:.28;animation:wxFogB 24s ease-in-out infinite}
body[data-weather-mode="wind"] .weather-hero{background:linear-gradient(125deg,#123b42,#1e6260 58%,#3b7c73)}
body[data-weather-mode="wind"] .cloud-a{animation:wxCloudDriftA 5s linear infinite alternate}
body[data-weather-mode="wind"] .cloud-b{animation:wxCloudDriftB 7s linear infinite alternate}
body[data-weather-mode="wind"] .wind-lines{opacity:.55;animation:wxWind 2.8s linear infinite}
body[data-weather-mode="heat"] .weather-hero{background:linear-gradient(125deg,#71331b,#ad5f2a 58%,#d19249)}
body[data-weather-mode="heat"] .orb{opacity:1;transform:scale(1.15);filter:blur(.3px)}
body[data-weather-mode="heat"] .heat-haze{opacity:.7;animation:wxHeat 4.5s ease-in-out infinite}
body[data-weather-mode="heat"] .sun-panel{box-shadow:0 18px 55px rgba(205,112,36,.22)}
body[data-weather-mode="cold"] .weather-hero{background:linear-gradient(125deg,#17395a,#2b6489 58%,#5590ae)}
body[data-weather-mode="cold"] .frost-edge{opacity:.74}

body[data-sun-phase="dusk"][data-weather-mode="cloud"] .weather-hero,body[data-sun-phase="night"][data-weather-mode="cloud"] .weather-hero{background:linear-gradient(125deg,#111a1d,#1e2a29 58%,#2f3a36)}
body[data-sun-phase="dusk"][data-weather-mode="rain"] .weather-hero,body[data-sun-phase="night"][data-weather-mode="rain"] .weather-hero{background:linear-gradient(125deg,#050d13,#0a1e28 58%,#13323b)}
body[data-sun-phase="dusk"][data-weather-mode="snow"] .weather-hero,body[data-sun-phase="night"][data-weather-mode="snow"] .weather-hero{background:linear-gradient(125deg,#071421,#10283a 58%,#24445a)}
body[data-sun-phase="dusk"][data-weather-mode="fog"] .weather-hero,body[data-sun-phase="night"][data-weather-mode="fog"] .weather-hero{background:linear-gradient(125deg,#111817,#1d2623 58%,#2e3834)}
body[data-sun-phase="dusk"][data-weather-mode="heat"] .weather-hero,body[data-sun-phase="night"][data-weather-mode="heat"] .weather-hero{background:linear-gradient(125deg,#190b06,#33160b 58%,#552a13)}
body[data-sun-phase="dusk"][data-weather-mode="cold"] .weather-hero,body[data-sun-phase="night"][data-weather-mode="cold"] .weather-hero{background:linear-gradient(125deg,#030b15,#091a2b 58%,#133451)}

@media(max-width:980px){body[data-weather-mode]:not([data-weather-mode="clear"]) .main-nav{background:var(--wx-card);border-color:var(--wx-line)}}
@media(max-width:620px){.hero-weather-detail{font-size:13px;max-width:90%}.storm-cloud{transform:scale(.72)}.storm-cloud-b{display:none}.rain-curtain{inset:-30%}.fog-bank{height:110px}}
@media(prefers-reduced-motion:reduce){.weather-effects>span,.cloud{animation:none!important}.lightning-flash{display:none}.rain-curtain,.snow-field,.wind-lines{opacity:.2!important}}


/* v4.1 temporary JacksonMoWeather live-source states */
.data-notice.status-temporary{background:#eef7fb;border-color:#b9d9e7;color:#183e55}
.data-notice.status-temporary i{background:#42a9d4;box-shadow:0 0 0 8px rgba(66,169,212,.12)}
.data-notice.status-temporary b{color:#173f58}
.station-badge.status-temporary{background:#e5f2f8;color:#245f7d;border-color:#b9d9e7}
.status-banner.temporary{background:#eef7fb;border-color:#b9d9e7;color:#173f58}
.status-banner.temporary i{background:#42a9d4}
.temporary-source-callout{padding:18px 20px;margin:0 0 28px;border:1px solid #b9d9e7;border-radius:18px;background:#eef7fb;color:#183e55}
.temporary-source-callout b{display:block;margin-bottom:5px;color:#173f58}
.temporary-source-callout p{margin:0}
body[data-sun-phase="night"] .data-notice.status-temporary,body[data-sun-phase="dusk"] .data-notice.status-temporary,body[data-sun-phase="night"] .status-banner.temporary,body[data-sun-phase="dusk"] .status-banner.temporary{background:#122631;border-color:#284a5a;color:#d5e8f0}
body[data-sun-phase="night"] .data-notice.status-temporary b,body[data-sun-phase="dusk"] .data-notice.status-temporary b,body[data-sun-phase="night"] .status-banner.temporary b,body[data-sun-phase="dusk"] .status-banner.temporary b{color:#eefaff}
body[data-sun-phase="night"] .station-badge.status-temporary,body[data-sun-phase="dusk"] .station-badge.status-temporary{background:#18313d;color:#c9e6f2;border-color:#345565}
body[data-sun-phase="night"] .temporary-source-callout,body[data-sun-phase="dusk"] .temporary-source-callout{background:#122631;border-color:#284a5a;color:#d5e8f0}
body[data-sun-phase="night"] .temporary-source-callout b,body[data-sun-phase="dusk"] .temporary-source-callout b{color:#eefaff}

/* v4.2: reduce repeated logo use; header and hero watermark remain */
.footer-brand b{font-size:17px;letter-spacing:.01em}.footer-brand small{margin-top:3px}.neighborhood-note>div{min-width:0}

/* v4.3: compact secondary-page heroes so useful content appears sooner */
.page-hero,
.page-hero.compact{
  padding:42px 0 40px;
}
.page-hero .wrap{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.page-hero .kicker{
  margin:0 0 7px;
  font-size:11px;
  line-height:1.2;
}
.page-hero h1{
  margin:0 0 11px;
  font-size:clamp(44px,3.5vw,54px);
  line-height:1.04;
  letter-spacing:-.025em;
}
.page-hero p{
  margin:0;
  max-width:780px;
  font-size:16px;
  line-height:1.5;
}
@media(min-width:1600px){
  .page-hero h1{font-size:58px}
}
@media(max-width:980px){
  .page-hero,
  .page-hero.compact{padding:36px 0 34px}
  .page-hero h1{font-size:clamp(40px,6vw,48px)}
  .page-hero p{font-size:15.5px}
}
@media(max-width:620px){
  .page-hero,
  .page-hero.compact{padding:28px 0 27px}
  .page-hero .kicker{margin-bottom:6px;font-size:10px}
  .page-hero h1{font-size:36px;line-height:1.08;margin-bottom:9px}
  .page-hero p{font-size:14px;line-height:1.45}
}


/* v4.4: tighter secondary-page intro spacing and public-friendly station notice */
.page-hero,
.page-hero.compact{
  padding:34px 0 26px;
}
.history-shell,
.forecast-shell,
.radar-shell,
.station-shell,
.about-layout{
  padding-top:44px;
}
.setup-warning.public-status{
  background:#eef7f1;
  border-color:#c9e4d3;
  color:#173e2c;
}
.setup-warning.public-status b{
  color:#123a29;
}
.setup-warning.public-status span{
  color:#4f6f61;
}
body[data-sun-phase="night"] .setup-warning.public-status,
body[data-sun-phase="dusk"] .setup-warning.public-status{
  background:#15271f;
  border-color:#315343;
  color:#d7eadf;
}
body[data-sun-phase="night"] .setup-warning.public-status b,
body[data-sun-phase="dusk"] .setup-warning.public-status b{
  color:#f0fff6;
}
body[data-sun-phase="night"] .setup-warning.public-status span,
body[data-sun-phase="dusk"] .setup-warning.public-status span{
  color:#b9d2c3;
}
@media(max-width:980px){
  .page-hero,
  .page-hero.compact{padding:30px 0 24px}
  .history-shell,
  .forecast-shell,
  .radar-shell,
  .station-shell,
  .about-layout{padding-top:38px}
}
@media(max-width:620px){
  .page-hero,
  .page-hero.compact{padding:24px 0 22px}
  .history-shell,
  .forecast-shell,
  .radar-shell,
  .station-shell,
  .about-layout{padding-top:30px}
}

/* v4.5: visitor tracker responsive table is in visitor-tracker.php; lightning add-on content */
.lightning-card{margin-top:18px;background:linear-gradient(135deg,#fff9e9,#eef7f4);border:1px solid #d9dfc9;border-radius:22px;padding:26px;display:grid;grid-template-columns:1.2fr 1fr;gap:28px;align-items:start;box-shadow:0 16px 45px rgba(26,60,83,.06)}
.lightning-card h2,.lightning-about h3{font-family:Newsreader,Georgia,serif;margin:6px 0 10px;font-size:30px}.lightning-card p{color:var(--muted)}.lightning-card dl{margin:0}.lightning-card dl div{display:flex;justify-content:space-between;gap:18px;padding:9px 0;border-bottom:1px solid rgba(19,37,59,.10)}.lightning-card dt{color:var(--muted)}.lightning-card dd{font-weight:800;margin:0;text-align:right}.lightning-card .lightning-note{grid-column:1/-1;margin:0}.lightning-link{justify-self:start}.lightning-about{margin-top:34px;padding-top:30px;border-top:1px solid var(--line)}.lightning-about h3{font-size:28px}.lightning-about .button{margin-top:8px}
body[data-sun-phase="dusk"] .lightning-card,body[data-sun-phase="night"] .lightning-card{background:linear-gradient(135deg,#2d2818,#162c23);border-color:#4b513b}body[data-sun-phase="dusk"] .lightning-about,body[data-sun-phase="night"] .lightning-about{border-color:#3b5146}
@media(max-width:780px){.lightning-card{grid-template-columns:1fr}.lightning-card .lightning-note{grid-column:auto}.lightning-card dl div{align-items:start}.lightning-card dd{max-width:55%}}


/* Live astronomically positioned star field */
.stars{position:absolute;inset:0;width:100%;height:100%;display:block;background:none!important;background-image:none!important;opacity:.62;transition:opacity .8s ease;z-index:0}
.weather-hero.is-day .stars{display:none}
body[data-sun-phase="dusk"] .stars{opacity:.28}
body[data-weather-mode="cloud"] .stars{opacity:.12}
body[data-weather-mode="rain"] .stars,body[data-weather-mode="storm"] .stars,body[data-weather-mode="severe"] .stars,body[data-weather-mode="fog"] .stars,body[data-weather-mode="snow"] .stars,body[data-weather-mode="ice"] .stars{opacity:.015}
body[data-weather-mode="heat"] .stars,body[data-weather-mode="cold"] .stars,body[data-weather-mode="wind"] .stars{opacity:.5}
@media (prefers-reduced-motion:reduce){.stars{transition:none}}

/* v4.7 — accurate Moon phase and restrained bright-star emphasis */
.weather-hero.is-night .orb.live-moon{
  width:126px;
  height:126px;
  top:26px;
  right:12%;
  background:none;
  opacity:.94;
  filter:drop-shadow(0 0 14px rgba(224,237,241,.16));
  overflow:hidden;
}
.weather-hero.is-night .orb.live-moon:after{content:none}
.weather-hero.is-day .orb.live-moon{
  background:none;
}
.stars{opacity:.64}
@media(max-width:980px){
  .weather-hero.is-night .orb.live-moon{width:108px;height:108px;top:24px;right:7%}
}
@media(max-width:620px){
  .weather-hero.is-night .orb.live-moon{width:88px;height:88px;top:24px;right:4%}
}

/* v5.9 live paths; v9.2 keeps the Moon shadow transparent. */
.hero-sky .orb.live-sun,.hero-sky .orb.live-moon{position:absolute;right:auto;transform:translate(-50%,-50%);transition:left 60s linear,top 60s linear,opacity .8s ease,filter .8s ease}
.hero-sky .orb.live-sun{display:block;width:82px;height:82px;background:radial-gradient(circle at 36% 32%,#fffef2 0 9%,#fff3b0 31%,#f8cf67 68%,#e9aa3e 100%);border:1px solid rgba(255,244,188,.38);box-shadow:0 0 14px rgba(255,224,133,.48),0 0 38px rgba(249,201,103,.25);filter:none;z-index:0}
.hero-sky .orb.live-moon{width:126px;height:126px;background:none!important;background-color:transparent!important;background-image:none!important;border:0;box-shadow:none;opacity:.94;filter:drop-shadow(0 0 14px rgba(224,237,241,.16));overflow:hidden;z-index:0}
.hero-sky .orb[hidden]{display:none!important}
.hero-sky .orb.live-sun:after,.hero-sky .orb.live-moon:after{content:none!important}
body[data-sun-phase="night"] .live-sun,body[data-sun-phase="dusk"] .live-sun{display:none!important}
body[data-sun-phase="day"] .live-moon,body[data-sun-phase="dawn"] .live-moon{opacity:.48;filter:drop-shadow(0 0 8px rgba(224,237,241,.1))}
body[data-weather-mode="cloud"] .live-sun,body[data-weather-mode="cloud"] .live-moon{opacity:.3;filter:blur(5px)}
body[data-weather-mode="rain"] .live-sun,body[data-weather-mode="rain"] .live-moon{opacity:.12;filter:blur(8px)}
body[data-weather-mode="storm"] .live-sun,body[data-weather-mode="storm"] .live-moon,body[data-weather-mode="severe"] .live-sun,body[data-weather-mode="severe"] .live-moon{opacity:.04}
body[data-weather-mode="fog"] .live-sun,body[data-weather-mode="fog"] .live-moon{opacity:.15;filter:blur(13px)}

/* v8.8 — remove the complete celestial layer when the sky obscures it. */
body[data-weather-mode="cloud"][data-sky-cover="mostly"] .hero-sky .orb,
body[data-weather-mode="cloud"][data-sky-cover="overcast"] .hero-sky .orb,
body[data-weather-mode="rain"] .hero-sky .orb,
body[data-weather-mode="storm"] .hero-sky .orb,
body[data-weather-mode="severe"] .hero-sky .orb,
body[data-weather-mode="fog"] .hero-sky .orb,
body[data-weather-mode="snow"] .hero-sky .orb,
body[data-weather-mode="ice"] .hero-sky .orb{
  display:none!important;
  opacity:0!important;
  visibility:hidden;
  filter:none!important;
}

@media(max-width:980px){.hero-sky .orb.live-sun{width:72px;height:72px}.hero-sky .orb.live-moon{width:108px;height:108px}}
@media(max-width:620px){.hero-sky .orb.live-sun{width:62px;height:62px}.hero-sky .orb.live-moon{width:88px;height:88px}}
@media(prefers-reduced-motion:reduce){.hero-sky .orb.live-sun,.hero-sky .orb.live-moon{transition:opacity .8s ease,filter .8s ease}}



/* Moon terminator visibility is handled inside south-sky.js; layout unchanged. */

/* ============================================================
   Twin Oaks Weather v4.9 — approved rain-on-glass effect
   Rounded water beads lead each drop, with a thin trail extending
   straight upward. The complete rain layer remains behind the
   temperature, condition text, wind dial, readings, and buttons.
   ============================================================ */
.rain-glass{
  inset:0;
  overflow:hidden;
  opacity:0;
  transition:opacity .9s ease;
  contain:layout paint;
}

/* Small beads that remain on the glass while the larger drops roll. */
.rain-glass::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse 8px 11px at 8% 24%,rgba(228,247,252,.17) 0 38%,rgba(77,120,138,.11) 52%,transparent 70%),
    radial-gradient(ellipse 5px 8px at 18% 72%,rgba(228,247,252,.14) 0 38%,rgba(77,120,138,.09) 52%,transparent 70%),
    radial-gradient(ellipse 10px 14px at 43% 18%,rgba(228,247,252,.15) 0 38%,rgba(77,120,138,.10) 52%,transparent 70%),
    radial-gradient(ellipse 6px 9px at 63% 64%,rgba(228,247,252,.14) 0 38%,rgba(77,120,138,.09) 52%,transparent 70%),
    radial-gradient(ellipse 9px 13px at 82% 33%,rgba(228,247,252,.16) 0 38%,rgba(77,120,138,.10) 52%,transparent 70%),
    radial-gradient(ellipse 5px 8px at 94% 78%,rgba(228,247,252,.13) 0 38%,rgba(77,120,138,.08) 52%,transparent 70%);
  opacity:.64;
}

.glass-drop{
  position:absolute;
  z-index:1;
  top:-280px;
  left:var(--drop-x);
  width:var(--drop-size);
  height:var(--drop-total-height);
  opacity:var(--drop-alpha);
  transform:translate3d(-50%,-90px,0);
  animation-name:wxGlassDrop;
  animation-timing-function:linear;
  animation-iteration-count:infinite;
  animation-delay:var(--drop-delay);
  will-change:transform,opacity;
}

/* The narrow wet trail is above the bead, never tilted sideways. */
.glass-drop::before{
  content:"";
  position:absolute;
  left:50%;
  top:0;
  width:var(--drop-trail-width);
  height:var(--drop-trail);
  transform:translateX(-50%);
  border-radius:999px;
  background:linear-gradient(to bottom,
    transparent 0%,
    rgba(220,243,250,.12) 18%,
    rgba(205,235,245,.32) 74%,
    rgba(229,248,252,.62) 100%);
  box-shadow:0 0 2px rgba(220,246,253,.18);
}

/* The larger rounded water blob stays at the bottom of the trail. */
.glass-drop::after{
  content:"";
  position:absolute;
  left:50%;
  top:var(--drop-trail);
  width:var(--drop-size);
  height:var(--drop-bead-height);
  transform:translateX(-50%);
  border-radius:48% 52% 55% 45% / 34% 34% 66% 66%;
  border:1px solid rgba(229,248,252,.25);
  background:
    radial-gradient(circle at 34% 23%,rgba(255,255,255,.72) 0 8%,rgba(255,255,255,.18) 12%,transparent 26%),
    radial-gradient(ellipse at 50% 45%,rgba(205,236,246,.29) 0 42%,rgba(85,132,151,.18) 68%,rgba(15,48,62,.31) 100%);
  box-shadow:
    inset 2px 2px 4px rgba(255,255,255,.21),
    inset -3px -4px 6px rgba(6,31,42,.24),
    0 2px 5px rgba(0,0,0,.16),
    0 0 5px rgba(207,240,249,.13);
}

@keyframes wxGlassDrop{
  0%{transform:translate3d(-50%,-90px,0);opacity:0}
  5%{opacity:var(--drop-alpha)}
  92%{opacity:var(--drop-alpha)}
  100%{transform:translate3d(-50%,calc(100vh + 520px),0);opacity:0}
}

/* Remove the diagonal line curtain whenever liquid rain is displayed. */
body[data-weather-mode="rain"] .rain-curtain,
body[data-weather-mode="storm"] .rain-curtain,
body[data-weather-mode="severe"] .rain-curtain{display:none}

body[data-weather-mode="rain"] .rain-glass{opacity:.67}
body[data-weather-mode="rain"][data-weather-intensity="moderate"] .rain-glass{opacity:.79}
body[data-weather-mode="rain"][data-weather-intensity="heavy"] .rain-glass{opacity:.90}
body[data-weather-mode="storm"] .rain-glass{opacity:.86}
body[data-weather-mode="severe"] .rain-glass{opacity:.94}

body[data-weather-intensity="light"] .glass-drop{animation-duration:var(--drop-duration-light)}
body[data-weather-intensity="light"] .glass-drop:nth-child(3n){display:none}
body[data-weather-intensity="moderate"] .glass-drop{animation-duration:var(--drop-duration-moderate)}
body[data-weather-intensity="heavy"] .glass-drop{animation-duration:var(--drop-duration-heavy)}

@media(max-width:620px){
  .glass-drop:nth-child(4n){display:none}
}

@media(prefers-reduced-motion:reduce){
  .glass-drop{animation:none!important;transform:translate3d(-50%,34vh,0);opacity:.28!important}
  .rain-glass{opacity:.28!important}
}

/* v5.4 — restore the approved compact v4.6.4 rain-on-glass droplets. */
.rain-glass{inset:0;display:block;overflow:hidden;opacity:0;transition:opacity .8s ease;contain:layout paint}
.rain-glass::before{content:"";position:absolute;inset:0;background:linear-gradient(105deg,rgba(255,255,255,.025),transparent 28%,rgba(198,229,241,.035) 70%,transparent);mix-blend-mode:screen;opacity:1}
.glass-drop{position:absolute;z-index:1;top:-12%;left:var(--x);width:var(--w);height:var(--h);background:none;box-shadow:none;filter:none;border-radius:0;opacity:var(--o);animation:glassRun var(--d) linear var(--delay) infinite;transform:translate3d(0,-18vh,0)}
.glass-drop::before{content:"";position:absolute;left:50%;bottom:58%;top:auto;width:16%;height:var(--trail);transform:translateX(-50%);border-radius:999px 999px 45% 45%;background:linear-gradient(to bottom,rgba(205,234,245,0),rgba(196,228,240,.08) 42%,rgba(185,220,234,.24) 82%,rgba(220,241,248,.38));box-shadow:0 0 2px rgba(205,235,246,.15);filter:blur(.45px);opacity:.78}
.glass-drop::after{content:"";position:absolute;inset:0;width:100%;height:100%;transform:none;border:0;border-radius:48% 52% 58% 58% / 42% 42% 68% 68%;background:radial-gradient(ellipse at 34% 24%,rgba(255,255,255,.82) 0 7%,rgba(214,238,247,.34) 18%,transparent 36%),radial-gradient(ellipse at 50% 72%,rgba(184,220,234,.30),rgba(142,191,211,.14) 57%,rgba(255,255,255,.38) 78%,rgba(78,127,149,.16) 100%);box-shadow:inset 1px 1px 2px rgba(255,255,255,.62),inset -2px -3px 4px rgba(58,102,121,.20),0 1px 2px rgba(0,0,0,.14);opacity:1}
.glass-drop-merged::before{width:20%;opacity:.92}.glass-drop-runner::before{width:17%}.glass-drop-slow::before{width:13%;opacity:.62}
.glass-bead{position:absolute;left:var(--x);top:var(--y);width:var(--s);height:var(--s);border-radius:50% 48% 55% 45%;background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.7),rgba(177,220,236,.18) 45%,rgba(71,120,142,.15) 72%,rgba(255,255,255,.28));box-shadow:inset 1px 1px 1px rgba(255,255,255,.5),0 1px 2px rgba(0,0,0,.1);opacity:var(--o);animation:beadPulse var(--p) ease-in-out var(--delay) infinite alternate}
@keyframes glassRun{0%{transform:translate3d(0,-18vh,0);opacity:0}8%{opacity:var(--o)}45%{transform:translate3d(0,45vh,0);opacity:var(--o)}100%{transform:translate3d(0,115vh,0);opacity:0}}
@keyframes beadPulse{from{transform:scale(.82);filter:brightness(.9)}to{transform:scale(1.08);filter:brightness(1.16)}}
body[data-weather-mode="rain"] .rain-glass,body[data-weather-mode="storm"] .rain-glass,body[data-weather-mode="severe"] .rain-glass{opacity:.72}
body[data-weather-intensity="light"] .rain-glass{opacity:.46}body[data-weather-intensity="moderate"] .rain-glass{opacity:.7}body[data-weather-intensity="heavy"] .rain-glass{opacity:.9}
body[data-weather-intensity="light"] .glass-drop:nth-of-type(n+13),body[data-weather-intensity="light"] .glass-bead:nth-of-type(n+77){display:none}
body[data-weather-intensity="moderate"] .glass-drop:nth-of-type(n+29),body[data-weather-intensity="moderate"] .glass-bead:nth-of-type(n+109){display:none}
body[data-weather-intensity="light"] .glass-drop{animation-duration:calc(var(--d) * 1.45);opacity:calc(var(--o) * .72)}body[data-weather-intensity="moderate"] .glass-drop{animation-duration:var(--d)}body[data-weather-intensity="heavy"] .glass-drop{animation-duration:calc(var(--d) * .58)}
body[data-weather-intensity="light"] .glass-drop::before{height:calc(var(--trail) * .55);opacity:.48}body[data-weather-intensity="moderate"] .glass-drop::before{height:var(--trail)}body[data-weather-intensity="heavy"] .glass-drop::before{height:calc(var(--trail) * 1.45);width:20%;opacity:.92}
@media(max-width:620px){.glass-drop:nth-child(n+19),.glass-bead:nth-child(n+31){display:none}}
@media(prefers-reduced-motion:reduce){.glass-drop{animation:none!important;top:34vh;transform:none;opacity:.28!important}.glass-bead{animation:none!important}}

/* v5.8 — falling drops mean rain now; stationary beads mean recently wet. */
body[data-glass-wet="true"] .rain-glass{opacity:calc(var(--glass-wet-opacity,0) * .62)}
body[data-glass-wet="false"] .rain-glass{opacity:0}
body[data-rain-active="false"] .glass-drop{display:none!important}
body[data-rain-active="false"] .glass-bead{animation:none!important}
body[data-rain-active="true"][data-weather-intensity="light"] .rain-glass{opacity:.46}
body[data-rain-active="true"][data-weather-intensity="moderate"] .rain-glass{opacity:.7}
body[data-rain-active="true"][data-weather-intensity="heavy"] .rain-glass{opacity:.9}

/* v5.0 private indoor readings and richer station summaries */
.hero-records small em{display:block;margin-top:2px;font-style:normal;font-size:9px;letter-spacing:.04em;text-transform:none;color:rgba(235,247,244,.82)}
.stat-list span small{display:block;margin-top:2px;font-size:10px;font-weight:600;letter-spacing:0;text-transform:none;color:#84928b}
.last-rain{margin:8px auto 0!important;max-width:240px;font-size:12px;line-height:1.4}
.last-rain b{color:var(--ink)}
.rain-stats{align-content:center}
.private-reading{border-top-color:#a77422!important;background:linear-gradient(150deg,#fff,#fff8e6)!important}
.private-reading span small{display:inline-block;margin-left:5px;padding:2px 5px;border-radius:999px;background:#f3dfac;color:#725515;font-size:9px;letter-spacing:.05em}
.setup-warning.private-status{background:#e8f5ec;border-color:#9bc7a9;color:#184b2d}
.setup-warning.private-status span{color:#3d6850}
.station-card .private-row{margin-inline:-10px;padding-inline:10px;background:linear-gradient(90deg,rgba(240,211,137,.18),transparent);border-radius:8px}
.summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.private-diagnostics{border-top:4px solid #b4872c}
body[data-sun-phase="night"] .private-reading,body[data-sun-phase="dusk"] .private-reading{background:linear-gradient(145deg,#2a291c,#17251d)!important}
body[data-sun-phase="night"] .last-rain b,body[data-sun-phase="dusk"] .last-rain b{color:#e9f1eb}
@media(max-width:980px){.summary-grid{grid-template-columns:1fr}}

/* v5.1 forecast order and editable trusted IP controls */

/* v5.2 optional full-screen current-conditions display */
.fullscreen-toggle{position:absolute;z-index:12;top:20px;right:22px;display:flex;align-items:center;gap:8px;border:1px solid rgba(255,255,255,.26);border-radius:12px;padding:10px 13px;background:rgba(7,31,49,.36);color:#fff;font:700 12px/1 "Segoe UI",Arial,sans-serif;letter-spacing:.02em;cursor:pointer;backdrop-filter:blur(12px);transition:background .2s,transform .2s}
.fullscreen-toggle:hover{background:rgba(7,31,49,.55);transform:translateY(-1px)}
.fullscreen-toggle span{font-size:18px;line-height:1}
.fullscreen-details{display:none}
.weather-hero:fullscreen{width:100vw;height:100vh;min-height:100vh;overflow:hidden;background-color:#0b2340}
.weather-hero:fullscreen .hero-grid{min-height:calc(100vh - 210px);height:auto;padding:clamp(62px,8vh,95px) clamp(35px,5vw,86px) 22px;grid-template-columns:1.25fr .75fr;gap:clamp(38px,7vw,110px)}
.weather-hero:fullscreen .wrap{width:100%;max-width:none}
.weather-hero:fullscreen .hero-copy h1{font-size:clamp(118px,19vh,210px);margin-top:clamp(20px,4vh,42px)}
.weather-hero:fullscreen .hero-condition{font-size:clamp(32px,4.5vh,54px);margin-top:14px}
.weather-hero:fullscreen .hero-actions{display:none}
.weather-hero:fullscreen .wind-ring{width:clamp(250px,30vh,350px);height:clamp(250px,30vh,350px)}
.weather-hero:fullscreen .wind-center{inset:31%}
.weather-hero:fullscreen .wind-arrow{height:36%}
.weather-hero:fullscreen .fullscreen-details{position:relative;z-index:7;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;padding:0 clamp(28px,4vw,70px) clamp(24px,4vh,42px)}
.weather-hero:fullscreen .fullscreen-details article{min-width:0;padding:15px 16px;border:1px solid rgba(255,255,255,.17);border-radius:16px;background:rgba(5,28,43,.31);backdrop-filter:blur(10px)}
.weather-hero:fullscreen .fullscreen-details span,.weather-hero:fullscreen .fullscreen-details b,.weather-hero:fullscreen .fullscreen-details small{display:block}
.weather-hero:fullscreen .fullscreen-details>article>span{color:#bcdde4;font-size:10px;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.weather-hero:fullscreen .fullscreen-details b{margin-top:4px;color:#fff;font-size:clamp(18px,1.7vw,27px);white-space:nowrap}
.weather-hero:fullscreen .fullscreen-details small{margin-top:2px;color:#c7e0e5;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.weather-hero:fullscreen .fullscreen-highlight{background:rgba(22,118,120,.30)}
.weather-hero:fullscreen .fullscreen-rain{background:rgba(23,87,110,.34);border-color:rgba(160,225,239,.24)}
.weather-hero:fullscreen .fullscreen-sky{background:rgba(52,73,112,.34);border-color:rgba(188,211,255,.24)}
.fullscreen-details article{transition:opacity .35s ease,transform .35s ease}
@media(max-width:900px){.fullscreen-toggle b{display:none}.weather-hero:fullscreen{overflow:auto}.weather-hero:fullscreen .hero-grid{grid-template-columns:1fr 260px;min-height:auto;padding-top:75px}.weather-hero:fullscreen .fullscreen-details{grid-template-columns:repeat(4,1fr)}.weather-hero:fullscreen .hero-copy h1{font-size:clamp(92px,17vh,150px)}}
@media(max-width:620px){.fullscreen-toggle{top:12px;right:12px;padding:9px}.weather-hero:fullscreen .hero-grid{grid-template-columns:1fr;padding:70px 20px 18px;gap:24px}.weather-hero:fullscreen .hero-copy h1{font-size:96px}.weather-hero:fullscreen .hero-condition{font-size:30px}.weather-hero:fullscreen .wind-ring{width:220px;height:220px}.weather-hero:fullscreen .fullscreen-details{grid-template-columns:repeat(2,1fr);padding:0 14px 24px}.weather-hero:fullscreen .fullscreen-details article{padding:12px}.weather-hero:fullscreen .fullscreen-details b{font-size:19px}}

/* v6.4: keep the website watermark comfortably inside the right edge and
   remove the complete image element in every full-screen implementation. */
.hero-community-mark{right:30px}
@media(max-width:980px){.hero-community-mark{right:18px}}
.weather-hero:fullscreen .wind-orbit{display:block!important}
.weather-hero:fullscreen .hero-community-mark,
.weather-hero:-webkit-full-screen .hero-community-mark,
.weather-hero.is-fullscreen .hero-community-mark,
html:fullscreen .hero-community-mark,
html:-webkit-full-screen .hero-community-mark,
html.is-weather-fullscreen .hero-community-mark,
body.is-weather-fullscreen .hero-community-mark,
.hero-community-mark[hidden]{display:none!important;visibility:hidden!important;opacity:0!important;width:0!important;height:0!important;max-width:0!important;overflow:hidden!important}
@media(max-width:980px) and (min-width:621px){.weather-hero:fullscreen{overflow:hidden}.weather-hero:fullscreen .hero-grid{grid-template-columns:minmax(0,1fr) 230px;gap:clamp(24px,4vw,52px)}.weather-hero:fullscreen .wind-ring{width:220px;height:220px}.weather-hero:fullscreen .wind-orbit p{font-size:14px;margin-bottom:0}}
@media(max-height:850px) and (min-width:621px){.weather-hero:fullscreen .hero-grid{min-height:calc(100vh - 142px);padding-top:42px;padding-bottom:10px}.weather-hero:fullscreen .hero-copy h1{font-size:clamp(104px,17vh,158px);margin-top:16px;margin-bottom:5px}.weather-hero:fullscreen .hero-condition{font-size:clamp(28px,4vh,42px);margin:10px 0 4px}.weather-hero:fullscreen .hero-weather-detail{margin:4px 0}.weather-hero:fullscreen .hero-records{margin-top:12px}.weather-hero:fullscreen .hero-sub{margin-bottom:4px}.weather-hero:fullscreen .wind-ring{width:clamp(205px,27vh,250px);height:clamp(205px,27vh,250px)}.weather-hero:fullscreen .fullscreen-details{gap:8px;padding:0 clamp(22px,3vw,48px) 18px}.weather-hero:fullscreen .fullscreen-details article{padding:11px 13px}.weather-hero:fullscreen .fullscreen-details b{font-size:clamp(17px,1.55vw,23px)}.weather-hero:fullscreen .fullscreen-details small{font-size:10px}}

/* v6.6: the pale rounded "frame" was the rectangular base of the decorative
   right-side cloud, not the community logo. Keep it on the normal website but
   remove that one cloud from every full-screen implementation. */
.weather-hero:fullscreen .cloud-a,
.weather-hero:-webkit-full-screen .cloud-a,
.weather-hero.is-fullscreen .cloud-a,
html.is-weather-fullscreen .weather-hero .cloud-a,
body.is-weather-fullscreen .weather-hero .cloud-a{display:none!important}

/* v7.2 — full-screen, weather-reactive Twin Oaks centerpiece */
.twin-oaks-scene{display:none}
@media(min-width:981px){
 .weather-hero:fullscreen .hero-grid,.weather-hero.is-fullscreen .hero-grid{grid-template-columns:minmax(430px,1.05fr) minmax(250px,.66fr) minmax(245px,.58fr);gap:clamp(18px,2.4vw,48px)}
 .weather-hero:fullscreen .twin-oaks-scene,.weather-hero.is-fullscreen .twin-oaks-scene{position:relative;display:block;align-self:end;width:100%;max-width:520px;height:min(47vh,440px);margin:0 auto -8px;z-index:3;filter:saturate(.94)}
 .twin-oaks-art{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
 .tree-ground{position:absolute;z-index:-1;left:3%;right:3%;bottom:3%;height:13%;border-radius:50%;background:radial-gradient(ellipse at center,rgba(18,62,31,.88),rgba(9,35,23,.62) 58%,transparent 72%);filter:blur(.4px);box-shadow:0 16px 28px rgba(0,0,0,.26)}
 .oak-sway{transform-origin:50% 89%;animation:towTreeSway var(--tree-sway-duration,6s) ease-in-out var(--tree-delay,0s) infinite alternate}
 .oak-right .oak-sway{animation-direction:alternate-reverse}
 .oak-trunk,.oak-branch{fill:url(#towTrunk);stroke:#201910;stroke-width:3;stroke-linejoin:round;transition:filter 1.2s,fill 1.2s}
 .oak-crown ellipse{fill:url(#towLeaf);stroke:rgba(5,43,24,.72);stroke-width:3;transition:fill 1.5s,opacity 1.5s,filter 1.2s}
 .oak-buds{opacity:0;transition:opacity 1.5s}.oak-buds circle{fill:#77a954;stroke:#426f37;stroke-width:2}
 .oak-snow{opacity:0;transition:opacity 1.4s}.oak-snow path{fill:#eef8ff;stroke:#c8e2ef;stroke-width:2;filter:drop-shadow(0 5px 5px rgba(18,40,55,.25))}
 .tree-caption{position:absolute;left:50%;bottom:0;transform:translateX(-50%);font:700 clamp(13px,1.2vw,18px)/1 Georgia,"Times New Roman",serif;letter-spacing:.28em;text-transform:uppercase;color:rgba(236,244,224,.66);text-shadow:0 2px 8px rgba(0,0,0,.45);white-space:nowrap}
 .falling-leaves{position:absolute;inset:12% 2% 3%;overflow:hidden;pointer-events:none}.falling-leaves i{display:none;position:absolute;top:0;left:var(--leaf-x);width:9px;height:6px;border-radius:80% 15% 80% 15%;background:#b96924;box-shadow:inset 2px 0 rgba(255,208,74,.28);animation:towLeafFall var(--leaf-fall-duration,6s) linear var(--leaf-delay) infinite}
 body[data-tree-season="winter"] .oak-crown{opacity:.03}
 body[data-tree-season="winter"] .oak-buds{opacity:0}
 body[data-tree-season="spring"] .oak-crown{opacity:.76;filter:hue-rotate(12deg) saturate(.8) brightness(1.25)}
 body[data-tree-season="spring"] .oak-buds{opacity:.9}
 body[data-tree-season="autumn"] .oak-crown ellipse{fill:#9a5726;filter:saturate(1.18)}
 body[data-tree-season="autumn"] .oak-crown ellipse:nth-child(3n){fill:#bd762b}
 body[data-tree-season="autumn"] .oak-crown ellipse:nth-child(3n+1){fill:#774124}
 body[data-tree-season="autumn"][data-tree-wind="light"] .falling-leaves i:nth-child(-n+6),body[data-tree-season="autumn"][data-tree-wind="moderate"] .falling-leaves i:nth-child(-n+11),body[data-tree-season="autumn"][data-tree-wind="strong"] .falling-leaves i{display:block}
 body[data-glass-wet="true"] .oak-trunk,body[data-glass-wet="true"] .oak-branch{filter:brightness(.62) saturate(1.15)}
 body[data-glass-wet="true"] .oak-crown{filter:brightness(.76) saturate(1.22) drop-shadow(0 0 5px rgba(190,235,225,.18))}
 body[data-weather-mode="snow"] .oak-snow,body[data-weather-mode="ice"] .oak-snow{opacity:.9}
 body[data-weather-mode="snow"][data-weather-intensity="light"] .oak-snow{opacity:.48}
 body[data-weather-mode="snow"][data-weather-intensity="heavy"] .oak-snow{opacity:1;filter:drop-shadow(0 2px 5px rgba(255,255,255,.45))}
 body[data-weather-mode="storm"] .twin-oaks-scene,body[data-weather-mode="severe"] .twin-oaks-scene{filter:brightness(.64) saturate(.78)}
 body[data-sun-phase="night"] .twin-oaks-scene{filter:brightness(.54) saturate(.7) drop-shadow(0 0 8px rgba(93,141,171,.14))}
 @keyframes towTreeSway{0%{transform:rotate(calc(0deg - var(--tree-sway-angle,.4deg)))}52%{transform:rotate(0deg)}100%{transform:rotate(var(--tree-sway-angle,.4deg))}}
 @keyframes towLeafFall{0%{transform:translate3d(0,-20px,0) rotate(0);opacity:0}12%{opacity:.9}55%{transform:translate3d(var(--leaf-drift),180px,0) rotate(420deg)}100%{transform:translate3d(calc(var(--leaf-drift) * -.45),370px,0) rotate(780deg);opacity:0}}
}
@media(min-width:981px) and (max-width:1250px){.weather-hero:fullscreen .hero-grid,.weather-hero.is-fullscreen .hero-grid{grid-template-columns:minmax(380px,1fr) minmax(190px,.48fr) 220px;gap:14px}.weather-hero:fullscreen .twin-oaks-scene,.weather-hero.is-fullscreen .twin-oaks-scene{height:min(39vh,350px)}}
@media(max-height:850px) and (min-width:981px){.weather-hero:fullscreen .twin-oaks-scene,.weather-hero.is-fullscreen .twin-oaks-scene{height:min(39vh,340px)}.weather-hero:fullscreen .hero-grid,.weather-hero.is-fullscreen .hero-grid{min-height:calc(100vh - 142px)}}
@media(prefers-reduced-motion:reduce){.oak-sway,.falling-leaves i{animation:none!important}.falling-leaves{display:none!important}}

/* ============================================================
   Twin Oaks Weather v7.5 — photographic full-screen scene
   The normal page deliberately keeps the established v7.1 layout. The
   generated landscape, forecast rail, and reference-style typography appear
   only while the current-conditions hero owns the full screen.
   ============================================================ */
.cinematic-backdrop,.cinematic-heading,.cinematic-bottom,.cinematic-current{display:none}

@media(min-width:981px){
 .weather-hero:fullscreen,.weather-hero:-webkit-full-screen,.weather-hero.is-fullscreen{
  --scene-brightness:1;--scene-saturation:1;--scene-hue:0deg;
  width:100vw;height:100vh;min-height:100vh;overflow:hidden;background:#52636d;
  font-family:"Segoe UI",Arial,sans-serif;
 }
 .weather-hero:fullscreen .cinematic-backdrop,.weather-hero:-webkit-full-screen .cinematic-backdrop,.weather-hero.is-fullscreen .cinematic-backdrop{
  display:block;position:absolute;inset:0;z-index:0;overflow:hidden;
  filter:brightness(var(--scene-brightness)) saturate(var(--scene-saturation)) hue-rotate(var(--scene-hue));
  transition:filter 1.8s ease;
 }
 .cinematic-season,.cinematic-canopy{position:absolute;inset:0;background-position:center;background-repeat:no-repeat;background-size:cover}
 .cinematic-season{opacity:0;transition:opacity 2.2s ease}
 .cinematic-spring{background-image:url('../img/cinematic/twin-oaks-spring.webp')}
 .cinematic-summer{background-image:url('../img/cinematic/twin-oaks-summer.webp')}
 .cinematic-summer-clear{background-image:url('../img/cinematic/twin-oaks-summer-clear.webp')}
 .cinematic-autumn{background-image:url('../img/cinematic/twin-oaks-autumn.webp')}
 .cinematic-winter{background-image:url('../img/cinematic/twin-oaks-winter.webp')}
 .cinematic-snow{background-image:url('../img/cinematic/twin-oaks-snow.webp')}
 body[data-tree-season="spring"] .cinematic-spring,body[data-tree-season="summer"] .cinematic-summer,body[data-tree-season="autumn"] .cinematic-autumn,body[data-tree-season="winter"] .cinematic-winter{opacity:1}
 body[data-tree-season="summer"][data-sky-cover="clear"] .cinematic-summer{opacity:0}
 body[data-tree-season="summer"][data-sky-cover="clear"] .cinematic-summer-clear{opacity:1}
 body[data-tree-season="summer"][data-sky-cover="partly"] .cinematic-summer{opacity:.56}
 body[data-tree-season="summer"][data-sky-cover="partly"] .cinematic-summer-clear{opacity:.64}
 body[data-weather-mode="snow"] .cinematic-season,body[data-weather-mode="ice"] .cinematic-season{opacity:0}
 body[data-weather-mode="snow"] .cinematic-snow,body[data-weather-mode="ice"] .cinematic-snow{opacity:1}
 .cinematic-backdrop:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,37,51,.06),transparent 52%,rgba(3,17,13,.27));pointer-events:none;transition:background 1.5s ease}

 body[data-weather-mode="rain"] .weather-hero:fullscreen,body[data-weather-mode="rain"] .weather-hero.is-fullscreen{--scene-brightness:.78;--scene-saturation:.82}
 body[data-weather-mode="storm"] .weather-hero:fullscreen,body[data-weather-mode="storm"] .weather-hero.is-fullscreen{--scene-brightness:.57;--scene-saturation:.68}
 body[data-weather-mode="severe"] .weather-hero:fullscreen,body[data-weather-mode="severe"] .weather-hero.is-fullscreen{--scene-brightness:.48;--scene-saturation:.58;--scene-hue:-7deg}
 body[data-weather-mode="fog"] .weather-hero:fullscreen,body[data-weather-mode="fog"] .weather-hero.is-fullscreen{--scene-brightness:1.08;--scene-saturation:.55}
 body[data-weather-mode="heat"] .weather-hero:fullscreen,body[data-weather-mode="heat"] .weather-hero.is-fullscreen{--scene-brightness:1.08;--scene-saturation:1.04;--scene-hue:-8deg}
 body[data-weather-mode="cold"] .weather-hero:fullscreen,body[data-weather-mode="cold"] .weather-hero.is-fullscreen{--scene-brightness:.93;--scene-saturation:.78;--scene-hue:7deg}
 body[data-sun-phase="dusk"] .weather-hero:fullscreen,body[data-sun-phase="dusk"] .weather-hero.is-fullscreen{--scene-brightness:.55;--scene-saturation:.75;--scene-hue:-4deg}
 body[data-sun-phase="night"] .weather-hero:fullscreen,body[data-sun-phase="night"] .weather-hero.is-fullscreen{--scene-brightness:.31;--scene-saturation:.58;--scene-hue:9deg}
 body[data-glass-wet="true"] .cinematic-backdrop:after{background:linear-gradient(125deg,rgba(172,207,215,.11),transparent 32%),linear-gradient(180deg,rgba(8,25,34,.08),transparent 48%,rgba(0,11,8,.38))}

 .weather-hero:fullscreen .hero-sky,.weather-hero:-webkit-full-screen .hero-sky,.weather-hero.is-fullscreen .hero-sky{z-index:1;clip-path:inset(0 0 37% 0)}
 .weather-hero:fullscreen .hero-sky:after,.weather-hero:-webkit-full-screen .hero-sky:after,.weather-hero.is-fullscreen .hero-sky:after{background:linear-gradient(180deg,rgba(10,29,40,.08),transparent 60%)}
 .weather-hero:fullscreen .cloud,.weather-hero:-webkit-full-screen .cloud,.weather-hero.is-fullscreen .cloud,.weather-hero:fullscreen .storm-cloud,.weather-hero.is-fullscreen .storm-cloud{display:none!important}
 .weather-hero:fullscreen .weather-effects,.weather-hero:-webkit-full-screen .weather-effects,.weather-hero.is-fullscreen .weather-effects{z-index:2}

 .weather-hero:fullscreen .cinematic-heading,.weather-hero:-webkit-full-screen .cinematic-heading,.weather-hero.is-fullscreen .cinematic-heading{
  position:absolute;z-index:8;top:clamp(24px,3.5vh,42px);left:clamp(28px,3.6vw,62px);right:clamp(28px,3.6vw,62px);display:flex;align-items:center;justify-content:space-between;
  color:rgba(255,255,255,.94);font-size:clamp(15px,1.25vw,21px);font-weight:400;letter-spacing:.22em;text-transform:uppercase;text-shadow:0 2px 12px rgba(0,0,0,.45)
 }
 .cinematic-heading time{font-size:.86em;letter-spacing:.18em}
 .weather-hero:fullscreen .fullscreen-toggle,.weather-hero:-webkit-full-screen .fullscreen-toggle,.weather-hero.is-fullscreen .fullscreen-toggle{top:11px;right:auto;left:50%;transform:translateX(-50%);padding:6px;border:0;background:transparent;opacity:.22;backdrop-filter:none}
 .weather-hero:fullscreen .fullscreen-toggle b,.weather-hero:-webkit-full-screen .fullscreen-toggle b,.weather-hero.is-fullscreen .fullscreen-toggle b{display:none}

 .weather-hero:fullscreen .hero-grid,.weather-hero:-webkit-full-screen .hero-grid,.weather-hero.is-fullscreen .hero-grid{
  position:relative;z-index:4;width:100%;max-width:none;height:100vh;min-height:0;padding:clamp(75px,9vh,106px) clamp(34px,4.2vw,72px) clamp(188px,22vh,220px);
  display:grid;grid-template-columns:minmax(280px,.82fr) minmax(480px,2.35fr) minmax(250px,.76fr);gap:clamp(18px,2vw,38px);align-items:center
 }
 .weather-hero:fullscreen .hero-copy,.weather-hero:-webkit-full-screen .hero-copy,.weather-hero.is-fullscreen .hero-copy{align-self:center;max-width:420px;text-shadow:0 3px 18px rgba(0,0,0,.38)}
 .weather-hero:fullscreen .eyebrow,.weather-hero:fullscreen .hero-weather-detail,.weather-hero:fullscreen .hero-records,.weather-hero:fullscreen .hero-actions,.weather-hero:-webkit-full-screen .eyebrow,.weather-hero:-webkit-full-screen .hero-weather-detail,.weather-hero:-webkit-full-screen .hero-records,.weather-hero:-webkit-full-screen .hero-actions,.weather-hero.is-fullscreen .eyebrow,.weather-hero.is-fullscreen .hero-weather-detail,.weather-hero.is-fullscreen .hero-records,.weather-hero.is-fullscreen .hero-actions{display:none!important}
 .weather-hero:fullscreen .hero-copy h1,.weather-hero:-webkit-full-screen .hero-copy h1,.weather-hero.is-fullscreen .hero-copy h1{
  margin:0 0 clamp(22px,3vh,34px);font-family:"Segoe UI",Arial,sans-serif;font-size:clamp(138px,14vw,226px);font-weight:200;line-height:.68;letter-spacing:-.085em;color:#fff
 }
 .weather-hero:fullscreen .hero-copy h1 small,.weather-hero:-webkit-full-screen .hero-copy h1 small,.weather-hero.is-fullscreen .hero-copy h1 small{display:none}
 .weather-hero:fullscreen .hero-copy h1>span,.weather-hero:-webkit-full-screen .hero-copy h1>span,.weather-hero.is-fullscreen .hero-copy h1>span{display:none}
 .weather-hero:fullscreen .hero-copy h1:before,.weather-hero:-webkit-full-screen .hero-copy h1:before,.weather-hero.is-fullscreen .hero-copy h1:before{content:attr(data-fs-temp)}
 .weather-hero:fullscreen .hero-condition,.weather-hero:-webkit-full-screen .hero-condition,.weather-hero.is-fullscreen .hero-condition{margin:0 0 2px;font-family:"Segoe UI",Arial,sans-serif;font-size:clamp(24px,2vw,34px);font-weight:400;letter-spacing:.01em}
 .weather-hero:fullscreen .hero-sub,.weather-hero:-webkit-full-screen .hero-sub,.weather-hero.is-fullscreen .hero-sub{margin:0;color:rgba(255,255,255,.92);font-size:clamp(16px,1.25vw,21px);font-weight:300}
 .weather-hero:fullscreen .hero-sub-extra,.weather-hero:-webkit-full-screen .hero-sub-extra,.weather-hero.is-fullscreen .hero-sub-extra{display:none}
 .weather-hero:fullscreen .cinematic-current,.weather-hero:-webkit-full-screen .cinematic-current,.weather-hero.is-fullscreen .cinematic-current{display:flex;flex-direction:column;flex-wrap:nowrap;align-items:flex-start;gap:10px;margin-top:clamp(18px,3vh,30px)}
 .cinematic-condition-icon{display:block!important;flex:0 0 100%;font-size:48px;line-height:1;filter:drop-shadow(0 5px 9px rgba(0,0,0,.24))}
 .cinematic-current>span:not(.cinematic-condition-icon){position:relative;display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;column-gap:8px;align-items:center;width:max-content;max-width:100%;padding-right:0;border-right:0}
 .cinematic-current i{grid-row:1/3;font-style:normal;color:#d8ebee;font-size:23px}
 .cinematic-current b{font-size:clamp(18px,1.45vw,24px);font-weight:500;line-height:1.05}
 .cinematic-current small{font-size:10px;font-weight:400;letter-spacing:.07em;text-transform:uppercase;color:rgba(255,255,255,.72)}

 .weather-hero:fullscreen .twin-oaks-scene,.weather-hero:-webkit-full-screen .twin-oaks-scene,.weather-hero.is-fullscreen .twin-oaks-scene{display:block;position:absolute;inset:0;z-index:3;width:auto;max-width:none;height:auto;margin:0;pointer-events:none}
 .weather-hero:fullscreen .wind-orbit,.weather-hero:-webkit-full-screen .wind-orbit,.weather-hero.is-fullscreen .wind-orbit{position:relative;z-index:5;display:block!important;grid-column:3;align-self:center;justify-self:end;transform:none;text-shadow:0 2px 12px rgba(0,0,0,.38)}
 .weather-hero:fullscreen .wind-orbit p,.weather-hero:-webkit-full-screen .wind-orbit p,.weather-hero.is-fullscreen .wind-orbit p{display:none}
 .weather-hero:fullscreen .wind-ring,.weather-hero:-webkit-full-screen .wind-ring,.weather-hero.is-fullscreen .wind-ring{
  width:clamp(230px,17.5vw,306px);height:clamp(230px,17.5vw,306px);border:2px solid rgba(255,255,255,.68);background:rgba(64,92,108,.18);box-shadow:inset 0 0 0 12px rgba(255,255,255,.045),0 14px 42px rgba(0,0,0,.15);backdrop-filter:blur(3px)
 }
 .wind-ring:before{content:"";position:absolute;inset:15px;border-radius:50%;background:repeating-conic-gradient(from -1deg,rgba(255,255,255,.68) 0 .7deg,transparent .7deg 15deg);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 9px),#000 calc(100% - 8px));mask:radial-gradient(farthest-side,transparent calc(100% - 9px),#000 calc(100% - 8px));opacity:.85}
 .weather-hero:fullscreen .wind-ring>span,.weather-hero:-webkit-full-screen .wind-ring>span,.weather-hero.is-fullscreen .wind-ring>span{z-index:3;color:#fff;font-size:14px;font-weight:500}
 .weather-hero:fullscreen .wind-ring>span:nth-child(1),.weather-hero.is-fullscreen .wind-ring>span:nth-child(1){top:-30px;left:50%;transform:translateX(-50%)}
 .weather-hero:fullscreen .wind-ring>span:nth-child(2),.weather-hero.is-fullscreen .wind-ring>span:nth-child(2){right:-28px;top:50%;transform:translateY(-50%)}
 .weather-hero:fullscreen .wind-ring>span:nth-child(3),.weather-hero.is-fullscreen .wind-ring>span:nth-child(3){bottom:-32px;left:50%;transform:translateX(-50%)}
 .weather-hero:fullscreen .wind-ring>span:nth-child(4),.weather-hero.is-fullscreen .wind-ring>span:nth-child(4){left:-28px;top:50%;transform:translateY(-50%)}
 .weather-hero:fullscreen .wind-center,.weather-hero:-webkit-full-screen .wind-center,.weather-hero.is-fullscreen .wind-center{inset:31%;background:transparent;border-radius:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
 .wind-center:before{content:"Wind";display:block;margin-bottom:7px;color:rgba(255,255,255,.9);font-size:clamp(15px,1.15vw,20px);font-weight:500;letter-spacing:.06em;text-transform:uppercase}
 .weather-hero:fullscreen .wind-center b,.weather-hero:-webkit-full-screen .wind-center b,.weather-hero.is-fullscreen .wind-center b{font-size:clamp(43px,3.8vw,64px);font-weight:300}
 .weather-hero:fullscreen .wind-center small,.weather-hero:-webkit-full-screen .wind-center small,.weather-hero.is-fullscreen .wind-center small{font-size:clamp(17px,1.5vw,24px);font-weight:300}
 .weather-hero:fullscreen .wind-arrow,.weather-hero:-webkit-full-screen .wind-arrow,.weather-hero.is-fullscreen .wind-arrow{z-index:2;width:5px;height:37%;background:linear-gradient(#18d5ed,#d5fbff);box-shadow:0 0 16px rgba(19,217,239,.52)}
 .weather-hero:fullscreen .wind-arrow:before,.weather-hero:-webkit-full-screen .wind-arrow:before,.weather-hero.is-fullscreen .wind-arrow:before{top:-7px;left:-7px;border-left-width:9px;border-right-width:9px;border-bottom:17px solid #16d5ed}

 .weather-hero:fullscreen .cinematic-bottom,.weather-hero:-webkit-full-screen .cinematic-bottom,.weather-hero.is-fullscreen .cinematic-bottom{
  position:absolute;z-index:8;left:clamp(28px,3.6vw,62px);right:clamp(28px,3.6vw,62px);bottom:clamp(17px,2.5vh,28px);display:grid;grid-template-columns:minmax(0,4fr) repeat(2,minmax(0,1fr));gap:clamp(10px,1vw,17px)
 }
 .cinematic-forecast{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,1vw,17px)}
 .cinematic-card{min-width:0;height:clamp(132px,17.5vh,174px);padding:clamp(13px,1.2vw,20px);border:1px solid rgba(255,255,255,.42);border-radius:15px;background:linear-gradient(145deg,rgba(35,64,49,.43),rgba(12,33,29,.39));box-shadow:0 12px 32px rgba(0,0,0,.12);backdrop-filter:blur(8px);color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.3);overflow:hidden}
 .cinematic-card>span{display:block;color:rgba(255,255,255,.82);font-size:clamp(10px,.82vw,13px);font-weight:500;letter-spacing:.04em;text-transform:uppercase}
 .cinematic-card>b{display:block;margin-top:5px;font-size:clamp(20px,1.7vw,28px);font-weight:400;line-height:1.15}
 .cinematic-card>small{display:block;margin-top:4px;color:rgba(255,255,255,.78);font-size:clamp(10px,.78vw,13px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .cinematic-card hr{height:1px;margin:9px 0;border:0;background:rgba(255,255,255,.35)}
 .cinematic-card b small{display:inline;color:rgba(255,255,255,.8);font-size:.55em;font-weight:300}
 .cinematic-day{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto 1fr auto auto;column-gap:8px}
 .cinematic-day>span{grid-column:1/-1}
 .cinematic-day .cinematic-icon{align-self:center;font-size:clamp(32px,2.7vw,46px);filter:drop-shadow(0 4px 6px rgba(0,0,0,.2))}
 .cinematic-temperatures{align-self:center;text-align:right}.cinematic-temperatures b,.cinematic-temperatures small{display:block;font-size:clamp(19px,1.6vw,27px);font-weight:400;line-height:1.25}.cinematic-temperatures small{color:rgba(255,255,255,.58)}
 .cinematic-day>small{grid-column:1/2;align-self:end}.cinematic-day>em{grid-column:2/3;align-self:end;font-size:clamp(10px,.78vw,13px);font-style:normal;white-space:nowrap}
 .cinematic-loading{opacity:.72}
 .cinematic-sun-times b,.cinematic-station-pair b{font-size:clamp(17px,1.35vw,23px)}
 .weather-hero:fullscreen .fullscreen-details,.weather-hero:-webkit-full-screen .fullscreen-details,.weather-hero.is-fullscreen .fullscreen-details{display:none!important}

 .cinematic-canopy{display:none;z-index:2;pointer-events:none;opacity:.44;background-image:url('../img/cinematic/twin-oaks-summer.webp')}
 body[data-tree-season="summer"]:not([data-sky-cover="clear"])[data-tree-wind="light"] .cinematic-canopy,body[data-tree-season="summer"]:not([data-sky-cover="clear"])[data-tree-wind="moderate"] .cinematic-canopy,body[data-tree-season="summer"]:not([data-sky-cover="clear"])[data-tree-wind="strong"] .cinematic-canopy{display:block}
 .cinematic-canopy-left{clip-path:ellipse(16% 26% at 36% 36%);animation:cinematicOakLeft var(--tree-sway-duration,6s) ease-in-out infinite alternate}
 .cinematic-canopy-right{clip-path:ellipse(16% 26% at 64% 36%);animation:cinematicOakRight var(--tree-sway-duration,6s) ease-in-out infinite alternate-reverse}
 @keyframes cinematicOakLeft{from{transform:translate3d(calc(0px - var(--canopy-shift,1px)),0,0)}to{transform:translate3d(var(--canopy-shift,1px),0,0)}}
 @keyframes cinematicOakRight{from{transform:translate3d(var(--canopy-shift,1px),0,0)}to{transform:translate3d(calc(0px - var(--canopy-shift,1px)),0,0)}}

 body[data-tree-season="autumn"][data-tree-wind="light"] .falling-leaves i:nth-child(-n+6),body[data-tree-season="autumn"][data-tree-wind="moderate"] .falling-leaves i:nth-child(-n+11),body[data-tree-season="autumn"][data-tree-wind="strong"] .falling-leaves i{display:block}
 .weather-hero:fullscreen .falling-leaves,.weather-hero.is-fullscreen .falling-leaves{position:absolute;inset:15% 17% 18%;overflow:hidden}
}

@media(min-width:981px) and (max-height:800px){
 .weather-hero:fullscreen .hero-grid,.weather-hero.is-fullscreen .hero-grid{padding-top:58px;padding-bottom:168px;grid-template-columns:minmax(245px,.75fr) minmax(420px,2.25fr) minmax(220px,.7fr)}
 .weather-hero:fullscreen .hero-copy h1,.weather-hero.is-fullscreen .hero-copy h1{font-size:clamp(116px,13vw,178px);margin-bottom:19px}
 .weather-hero:fullscreen .hero-condition,.weather-hero.is-fullscreen .hero-condition{font-size:clamp(21px,1.8vw,28px)}
 .weather-hero:fullscreen .cinematic-current,.weather-hero.is-fullscreen .cinematic-current{margin-top:14px}
 .cinematic-condition-icon{font-size:37px}
 .cinematic-card{height:128px;padding:11px 13px}.cinematic-card hr{margin:6px 0}.cinematic-card>b{font-size:19px}.cinematic-day .cinematic-icon{font-size:31px}.cinematic-temperatures b,.cinematic-temperatures small{font-size:19px}
 .weather-hero:fullscreen .cinematic-bottom,.weather-hero.is-fullscreen .cinematic-bottom{bottom:14px}
}

@media(prefers-reduced-motion:reduce){.cinematic-season{transition:none}.cinematic-canopy{display:none!important}}

/* ============================================================
   Twin Oaks Weather v7.7 — simplified full-screen information rail
   The fixed class is also used when a TV or phone cannot make the hero the
   browser's native full-screen element. It deliberately leaves the regular
   scrolling website untouched until full screen is selected.
   ============================================================ */
html.is-weather-fullscreen,body.is-weather-fullscreen{overflow:hidden!important;overscroll-behavior:none}
.weather-hero.is-fullscreen{position:fixed!important;inset:0!important;z-index:1000!important;width:100vw!important;height:100vh!important;height:100dvh!important;min-height:0!important;margin:0!important}

/* These image declarations are shared by desktop, TV, and responsive phone
   full-screen modes. The backdrop itself remains hidden on the normal page. */
.cinematic-season,.cinematic-canopy{position:absolute;inset:0;background-position:center;background-repeat:no-repeat;background-size:cover}
.cinematic-season{opacity:0;transition:opacity 2.2s ease}
.cinematic-spring{background-image:url('../img/cinematic/twin-oaks-spring.webp')}
.cinematic-summer{background-image:url('../img/cinematic/twin-oaks-summer.webp')}
.cinematic-summer-clear{background-image:url('../img/cinematic/twin-oaks-summer-clear.webp')}
.cinematic-autumn{background-image:url('../img/cinematic/twin-oaks-autumn.webp')}
.cinematic-winter{background-image:url('../img/cinematic/twin-oaks-winter.webp')}
.cinematic-snow{background-image:url('../img/cinematic/twin-oaks-snow.webp')}
body[data-tree-season="spring"] .cinematic-spring,body[data-tree-season="summer"] .cinematic-summer,body[data-tree-season="autumn"] .cinematic-autumn,body[data-tree-season="winter"] .cinematic-winter{opacity:1}
body[data-tree-season="summer"][data-sky-cover="clear"] .cinematic-summer{opacity:0}
body[data-tree-season="summer"][data-sky-cover="clear"] .cinematic-summer-clear{opacity:1}
body[data-tree-season="summer"][data-sky-cover="partly"] .cinematic-summer{opacity:.56}
body[data-tree-season="summer"][data-sky-cover="partly"] .cinematic-summer-clear{opacity:.64}
body[data-weather-mode="snow"] .cinematic-season,body[data-weather-mode="ice"] .cinematic-season{opacity:0}
body[data-weather-mode="snow"] .cinematic-snow,body[data-weather-mode="ice"] .cinematic-snow{opacity:1}

/* A partly cloud-obscured sun can still read as soft light behind cloud. */
body[data-weather-mode="cloud"][data-sky-cover="partly"] .weather-hero.is-fullscreen .live-sun{
 background:radial-gradient(circle at 36% 32%,#fffef2 0 9%,#fff3b0 31%,#f8cf67 68%,#e9aa3e 100%);opacity:.46!important;filter:blur(.8px) drop-shadow(0 0 20px rgba(255,236,174,.22))!important
}

@media(min-width:981px){
 .weather-hero:fullscreen .hero-grid,.weather-hero:-webkit-full-screen .hero-grid,.weather-hero.is-fullscreen .hero-grid{padding-bottom:clamp(120px,13vh,150px)}
 .weather-hero:fullscreen .cinematic-bottom,.weather-hero:-webkit-full-screen .cinematic-bottom,.weather-hero.is-fullscreen .cinematic-bottom{
  bottom:clamp(108px,10.8vh,120px)
 }
 .cinematic-card{height:clamp(108px,11.6vh,124px);padding:clamp(10px,.9vw,14px)}
 .cinematic-card hr{margin:5px 0}
 .cinematic-card>b{font-size:clamp(18px,1.45vw,24px)}
 .cinematic-day .cinematic-icon{font-size:clamp(27px,2.2vw,37px)}
 .cinematic-temperatures b,.cinematic-temperatures small{font-size:clamp(17px,1.35vw,22px)}
 .weather-hero:fullscreen .fullscreen-details,.weather-hero:-webkit-full-screen .fullscreen-details,.weather-hero.is-fullscreen .fullscreen-details{
  position:absolute;z-index:9;left:clamp(28px,3.6vw,62px);right:clamp(28px,3.6vw,62px);bottom:clamp(14px,1.6vh,18px);
  display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr));gap:clamp(8px,.72vw,12px);padding:0
 }
 .weather-hero:fullscreen .fullscreen-details article,.weather-hero:-webkit-full-screen .fullscreen-details article,.weather-hero.is-fullscreen .fullscreen-details article{
  min-width:0;min-height:78px;padding:9px 12px;border:1px solid rgba(255,255,255,.34);border-radius:13px;
  background:linear-gradient(145deg,rgba(25,53,41,.52),rgba(8,30,27,.48));box-shadow:0 9px 24px rgba(0,0,0,.12);backdrop-filter:blur(8px);color:#fff;text-shadow:0 2px 7px rgba(0,0,0,.3);overflow:hidden
 }
 .weather-hero:fullscreen .fullscreen-details article[hidden],.weather-hero:-webkit-full-screen .fullscreen-details article[hidden],.weather-hero.is-fullscreen .fullscreen-details article[hidden]{display:none!important}
 .weather-hero:fullscreen .fullscreen-details>article>span,.weather-hero:-webkit-full-screen .fullscreen-details>article>span,.weather-hero.is-fullscreen .fullscreen-details>article>span{display:block;color:rgba(255,255,255,.8);font-size:clamp(8px,.68vw,11px)}
 .weather-hero:fullscreen .fullscreen-details b,.weather-hero:-webkit-full-screen .fullscreen-details b,.weather-hero.is-fullscreen .fullscreen-details b{display:block;margin-top:2px;font-size:clamp(16px,1.3vw,22px);font-weight:500}
 .weather-hero:fullscreen .fullscreen-details small,.weather-hero:-webkit-full-screen .fullscreen-details small,.weather-hero.is-fullscreen .fullscreen-details small{display:block;margin-top:0;color:rgba(255,255,255,.7);font-size:clamp(8px,.64vw,10px)}
 .weather-hero:fullscreen .fullscreen-details .fullscreen-highlight,.weather-hero:-webkit-full-screen .fullscreen-details .fullscreen-highlight,.weather-hero.is-fullscreen .fullscreen-details .fullscreen-highlight{background:linear-gradient(145deg,rgba(22,91,78,.58),rgba(8,43,37,.52))}
 .weather-hero:fullscreen .fullscreen-details .fullscreen-rain,.weather-hero:-webkit-full-screen .fullscreen-details .fullscreen-rain,.weather-hero.is-fullscreen .fullscreen-details .fullscreen-rain{background:linear-gradient(145deg,rgba(24,74,83,.58),rgba(9,41,48,.52))}
}

@media(min-width:981px) and (max-height:800px){
 .weather-hero:fullscreen .hero-grid,.weather-hero.is-fullscreen .hero-grid{padding-bottom:94px}
 .weather-hero:fullscreen .cinematic-bottom,.weather-hero.is-fullscreen .cinematic-bottom{bottom:88px}
 .cinematic-card{height:92px;padding:7px 10px}
 .cinematic-card>small{font-size:9px}.cinematic-card>b{font-size:16px}.cinematic-day .cinematic-icon{font-size:23px}.cinematic-temperatures b,.cinematic-temperatures small{font-size:15px}
 .weather-hero:fullscreen .fullscreen-details,.weather-hero.is-fullscreen .fullscreen-details{bottom:10px;gap:6px}
 .weather-hero:fullscreen .fullscreen-details article,.weather-hero.is-fullscreen .fullscreen-details article{min-height:68px;padding:7px 9px}
 .weather-hero:fullscreen .fullscreen-details b,.weather-hero.is-fullscreen .fullscreen-details b{font-size:15px}
}

/* Phone and compact-TV fallback. In landscape the complete display fits in a
   single viewport. Browsers that permit it are also asked to lock landscape. */
@media(max-width:980px){
 .weather-hero.is-fullscreen{--scene-brightness:1;--scene-saturation:1;--scene-hue:0deg;overflow:hidden!important;background:#52636d;font-family:"Segoe UI",Arial,sans-serif}
 body[data-weather-mode="rain"] .weather-hero.is-fullscreen{--scene-brightness:.78;--scene-saturation:.82}body[data-weather-mode="storm"] .weather-hero.is-fullscreen{--scene-brightness:.57;--scene-saturation:.68}body[data-weather-mode="severe"] .weather-hero.is-fullscreen{--scene-brightness:.48;--scene-saturation:.58;--scene-hue:-7deg}body[data-weather-mode="fog"] .weather-hero.is-fullscreen{--scene-brightness:1.08;--scene-saturation:.55}body[data-sun-phase="dusk"] .weather-hero.is-fullscreen{--scene-brightness:.55;--scene-saturation:.75;--scene-hue:-4deg}body[data-sun-phase="night"] .weather-hero.is-fullscreen{--scene-brightness:.31;--scene-saturation:.58;--scene-hue:9deg}
 .weather-hero.is-fullscreen .cinematic-backdrop{display:block;position:absolute;inset:0;z-index:0;overflow:hidden;filter:brightness(var(--scene-brightness)) saturate(var(--scene-saturation)) hue-rotate(var(--scene-hue));transition:filter 1.8s ease}
 .weather-hero.is-fullscreen .cinematic-backdrop:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(17,37,51,.08),transparent 48%,rgba(3,17,13,.34));pointer-events:none}
 .weather-hero.is-fullscreen .hero-sky{z-index:1;clip-path:inset(0 0 34% 0)}
 .weather-hero.is-fullscreen .cloud,.weather-hero.is-fullscreen .storm-cloud{display:none!important}
 .weather-hero.is-fullscreen .weather-effects{z-index:2}
 .weather-hero.is-fullscreen .cinematic-heading{position:absolute;z-index:8;top:max(9px,env(safe-area-inset-top));left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right));display:flex;justify-content:space-between;color:rgba(255,255,255,.94);font-size:clamp(9px,1.8vw,14px);font-weight:500;letter-spacing:.2em;text-transform:uppercase;text-shadow:0 2px 10px rgba(0,0,0,.5)}
 .weather-hero.is-fullscreen .cinematic-heading time{font-size:.84em;letter-spacing:.12em}
 .weather-hero.is-fullscreen .fullscreen-toggle{top:4px;right:auto;left:50%;transform:translateX(-50%);padding:5px;border:0;background:transparent;opacity:.3;backdrop-filter:none}
 .weather-hero.is-fullscreen .fullscreen-toggle b{display:none}
 .weather-hero.is-fullscreen .hero-grid{position:relative;z-index:4;width:100%;max-width:none;height:100dvh;min-height:0;padding:38px max(18px,env(safe-area-inset-right)) 78px max(18px,env(safe-area-inset-left));display:grid;grid-template-columns:minmax(0,1fr) 170px;gap:20px;align-items:center}
 .weather-hero.is-fullscreen .hero-copy{max-width:290px;text-shadow:0 3px 16px rgba(0,0,0,.42)}
 .weather-hero.is-fullscreen .eyebrow,.weather-hero.is-fullscreen .hero-weather-detail,.weather-hero.is-fullscreen .hero-records,.weather-hero.is-fullscreen .hero-actions{display:none!important}
 .weather-hero.is-fullscreen .hero-copy h1{margin:0 0 11px;font-family:"Segoe UI",Arial,sans-serif;font-size:clamp(68px,16vh,106px);font-weight:200;line-height:.72;letter-spacing:-.08em;color:#fff}
 .weather-hero.is-fullscreen .hero-copy h1 small,.weather-hero.is-fullscreen .hero-copy h1>span{display:none}
 .weather-hero.is-fullscreen .hero-copy h1:before{content:attr(data-fs-temp)}
 .weather-hero.is-fullscreen .hero-condition{margin:0;font-family:"Segoe UI",Arial,sans-serif;font-size:clamp(18px,4.8vh,25px);font-weight:400}
 .weather-hero.is-fullscreen .hero-sub{margin:0;color:rgba(255,255,255,.9);font-size:clamp(12px,3vh,16px)}
 .weather-hero.is-fullscreen .hero-sub-extra,.weather-hero.is-fullscreen .cinematic-current{display:none!important}
 .weather-hero.is-fullscreen .twin-oaks-scene{display:block;position:absolute;inset:0;z-index:3;width:auto;max-width:none;height:auto;margin:0;pointer-events:none}
 .weather-hero.is-fullscreen .wind-orbit{position:relative;z-index:5;display:block!important;grid-column:2;justify-self:end;text-shadow:0 2px 10px rgba(0,0,0,.4)}
 .weather-hero.is-fullscreen .wind-orbit p{display:none}
 .weather-hero.is-fullscreen .wind-ring{width:clamp(118px,30vh,168px);height:clamp(118px,30vh,168px);border:2px solid rgba(255,255,255,.68);background:rgba(64,92,108,.18);box-shadow:inset 0 0 0 7px rgba(255,255,255,.045);backdrop-filter:blur(3px)}
 .weather-hero.is-fullscreen .wind-ring:before{inset:9px}
 .weather-hero.is-fullscreen .wind-ring>span{z-index:3;color:#fff;font-size:9px}
 .weather-hero.is-fullscreen .wind-ring>span:nth-child(1){top:-20px;left:50%;transform:translateX(-50%)}.weather-hero.is-fullscreen .wind-ring>span:nth-child(2){right:-18px;top:50%;transform:translateY(-50%)}.weather-hero.is-fullscreen .wind-ring>span:nth-child(3){bottom:-21px;left:50%;transform:translateX(-50%)}.weather-hero.is-fullscreen .wind-ring>span:nth-child(4){left:-18px;top:50%;transform:translateY(-50%)}
 .weather-hero.is-fullscreen .wind-center{inset:29%;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center}
 .weather-hero.is-fullscreen .wind-center:before{margin-bottom:2px;font-size:9px}.weather-hero.is-fullscreen .wind-center b{font-size:clamp(25px,7.5vh,38px);font-weight:300}.weather-hero.is-fullscreen .wind-center small{font-size:11px}
 .weather-hero.is-fullscreen .wind-arrow{z-index:2;width:3px;height:36%;background:linear-gradient(#18d5ed,#d5fbff)}.weather-hero.is-fullscreen .wind-arrow:before{top:-5px;left:-5px;border-left-width:7px;border-right-width:7px;border-bottom:12px solid #16d5ed}
 .weather-hero.is-fullscreen .cinematic-bottom{position:absolute;z-index:8;left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));bottom:74px;display:block}
 .weather-hero.is-fullscreen .cinematic-forecast{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
 .weather-hero.is-fullscreen .cinematic-sun-times,.weather-hero.is-fullscreen .cinematic-station-pair{display:none}
 .weather-hero.is-fullscreen .cinematic-card{height:78px;padding:6px 8px;border-radius:9px;background:linear-gradient(145deg,rgba(35,64,49,.52),rgba(12,33,29,.48));backdrop-filter:blur(6px)}
 .weather-hero.is-fullscreen .cinematic-card>span{font-size:7px}.weather-hero.is-fullscreen .cinematic-day .cinematic-icon{font-size:18px}.weather-hero.is-fullscreen .cinematic-temperatures b,.weather-hero.is-fullscreen .cinematic-temperatures small{font-size:13px}.weather-hero.is-fullscreen .cinematic-card>small,.weather-hero.is-fullscreen .cinematic-day>em{font-size:7px}
 .weather-hero.is-fullscreen .fullscreen-details{position:absolute;z-index:9;left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));bottom:max(7px,env(safe-area-inset-bottom));display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;padding:0}
 .weather-hero.is-fullscreen .fullscreen-details article{min-width:0;min-height:58px;padding:5px 7px;border:1px solid rgba(255,255,255,.3);border-radius:8px;background:rgba(10,39,34,.52);backdrop-filter:blur(6px);overflow:hidden}
 .weather-hero.is-fullscreen .fullscreen-details article[hidden]{display:none!important}
 .weather-hero.is-fullscreen .fullscreen-details>article>span{display:block;font-size:6.5px;color:rgba(255,255,255,.8)}.weather-hero.is-fullscreen .fullscreen-details b{display:block;margin-top:1px;font-size:12px;font-weight:500}.weather-hero.is-fullscreen .fullscreen-details small{display:block;margin:0;font-size:6.5px;color:rgba(255,255,255,.68)}
}

@media(max-width:620px) and (orientation:portrait){
 .weather-hero.is-fullscreen .hero-grid{height:100dvh;padding:62px 18px 292px;display:block}
 .weather-hero.is-fullscreen .hero-copy{max-width:210px}.weather-hero.is-fullscreen .hero-copy h1{font-size:82px}.weather-hero.is-fullscreen .hero-condition{font-size:21px}
 .weather-hero.is-fullscreen .wind-orbit{position:absolute;top:145px;right:28px}.weather-hero.is-fullscreen .wind-ring{width:116px;height:116px}
 .weather-hero.is-fullscreen .cinematic-bottom{display:none!important}
 .weather-hero.is-fullscreen .fullscreen-details{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
 .weather-hero.is-fullscreen .fullscreen-details article{min-height:62px;padding:6px 9px}.weather-hero.is-fullscreen .fullscreen-details>article>span{font-size:8px}.weather-hero.is-fullscreen .fullscreen-details b{font-size:15px}.weather-hero.is-fullscreen .fullscreen-details small{font-size:8px}
}

/* ============================================================
   Twin Oaks Weather v7.8 — live wind-driven photographic clouds
   These layers exist only inside the cinematic full-screen backdrop. The
   source artwork is transparent photography, not drawn CSS cloud shapes.
   ============================================================ */
.cinematic-cloud-field{display:none}
.weather-hero:fullscreen .cinematic-cloud-field,
.weather-hero:-webkit-full-screen .cinematic-cloud-field,
.weather-hero.is-fullscreen .cinematic-cloud-field{
 display:block;position:absolute;z-index:1;inset:-8vh -12vw 34%;overflow:visible;pointer-events:none;
 -webkit-mask-image:linear-gradient(to bottom,#000 0 56%,rgba(0,0,0,.92) 72%,rgba(0,0,0,.34) 91%,transparent 100%);
 mask-image:linear-gradient(to bottom,#000 0 56%,rgba(0,0,0,.92) 72%,rgba(0,0,0,.34) 91%,transparent 100%)
}
.cinematic-season{z-index:0}.cinematic-canopy{z-index:2}
.cinematic-cloud-field:after{
 content:"";position:absolute;z-index:0;inset:0;background:linear-gradient(180deg,rgba(189,202,209,.22),rgba(109,131,142,.13) 70%,transparent);opacity:0;transition:opacity 2.4s ease
}
.cinematic-cloud{
 position:absolute;z-index:1;left:0;top:0;width:clamp(320px,var(--cloud-width,38vw),1050px);aspect-ratio:1600/441;opacity:0;
 transform:translate3d(0,0,0);transform-origin:center;will-change:transform,opacity;transition:transform .28s linear,opacity 2.2s ease;contain:layout paint
}
.cinematic-cloud:before{content:"";position:absolute;inset:0;background-position:center;background-repeat:no-repeat;background-size:contain;filter:saturate(.86) contrast(.92) brightness(.94);transition:filter 2s ease}
.cinematic-cloud-cumulus:before{background-image:url('../img/cinematic/cloud-cumulus.webp')}
.cinematic-cloud-stratocumulus:before{background-image:url('../img/cinematic/cloud-stratocumulus.webp')}
.cinematic-cloud.is-mirrored:before{transform:scaleX(-1)}

/* Progressive coverage keeps reported conditions visually distinct. */
body[data-sky-cover="mostly-clear"] .cinematic-cloud:nth-child(-n+2){opacity:var(--cloud-opacity-mostly-clear,.24)}
body[data-sky-cover="partly"] .cinematic-cloud:nth-child(-n+4){opacity:var(--cloud-opacity-partly,.4)}
body[data-sky-cover="mostly"] .cinematic-cloud:nth-child(-n+8){opacity:var(--cloud-opacity-mostly,.5)}
body[data-sky-cover="overcast"] .cinematic-cloud{opacity:var(--cloud-opacity-overcast,.58)}
body[data-sky-cover="overcast"] .cinematic-cloud-field:after{opacity:.44}

/* Weather and light alter the same cloud photography rather than swapping to
   a visually unrelated effect. */
body[data-weather-mode="rain"] .cinematic-cloud:before{filter:saturate(.65) contrast(1.03) brightness(.7)}
body[data-weather-mode="storm"] .cinematic-cloud:before,
body[data-weather-mode="severe"] .cinematic-cloud:before{filter:saturate(.52) contrast(1.12) brightness(.5)}
body[data-weather-mode="snow"] .cinematic-cloud:before,
body[data-weather-mode="ice"] .cinematic-cloud:before{filter:saturate(.42) contrast(.9) brightness(1.06)}
body[data-sun-phase="dusk"] .cinematic-cloud:before{filter:saturate(.62) contrast(.98) brightness(.65) hue-rotate(-8deg)}
body[data-sun-phase="night"] .cinematic-cloud:before{filter:saturate(.4) contrast(1.04) brightness(.34) hue-rotate(7deg)}

/* The duplicated leafy crowns remain over the cloud field so clouds read as
   distant sky, not mist painted across the oak leaves. */
body[data-tree-season="spring"] .cinematic-canopy{background-image:url('../img/cinematic/twin-oaks-spring.webp')}
body[data-tree-season="summer"] .cinematic-canopy{background-image:url('../img/cinematic/twin-oaks-summer.webp')}
body[data-tree-season="autumn"] .cinematic-canopy{background-image:url('../img/cinematic/twin-oaks-autumn.webp')}
body[data-tree-season="spring"]:not([data-sky-cover="clear"]) .weather-hero.is-fullscreen .cinematic-canopy,
body[data-tree-season="summer"]:not([data-sky-cover="clear"]) .weather-hero.is-fullscreen .cinematic-canopy,
body[data-tree-season="autumn"]:not([data-sky-cover="clear"]) .weather-hero.is-fullscreen .cinematic-canopy{display:block}

@media(prefers-reduced-motion:reduce){.cinematic-cloud{transition:none!important;will-change:auto}.cinematic-cloud-field:after{transition:none!important}}

/* ============================================================
   Twin Oaks Weather v7.9 — visible cloud drift and clear glass cards
   The seven-card rail remains readable but no longer paints a dark green
   strip over the grass. These overrides apply only to the cinematic display.
   ============================================================ */
@media(min-width:981px){
 .weather-hero:fullscreen .fullscreen-details article,
 .weather-hero:-webkit-full-screen .fullscreen-details article,
 .weather-hero.is-fullscreen .fullscreen-details article{
  border-color:rgba(255,255,255,.42);
  background:rgba(5,22,25,.14);
  box-shadow:0 8px 22px rgba(0,0,0,.08),inset 0 1px rgba(255,255,255,.06);
  -webkit-backdrop-filter:blur(3px) saturate(1.04);
  backdrop-filter:blur(3px) saturate(1.04)
 }
 .weather-hero:fullscreen .fullscreen-details .fullscreen-highlight,
 .weather-hero:-webkit-full-screen .fullscreen-details .fullscreen-highlight,
 .weather-hero.is-fullscreen .fullscreen-details .fullscreen-highlight{background:rgba(7,55,47,.17)}
 .weather-hero:fullscreen .fullscreen-details .fullscreen-rain,
 .weather-hero:-webkit-full-screen .fullscreen-details .fullscreen-rain,
 .weather-hero.is-fullscreen .fullscreen-details .fullscreen-rain{background:rgba(7,42,50,.18)}
}
@media(max-width:980px){
 .weather-hero.is-fullscreen .fullscreen-details article{
  border-color:rgba(255,255,255,.4);
  background:rgba(5,22,25,.16);
  -webkit-backdrop-filter:blur(3px) saturate(1.04);
  backdrop-filter:blur(3px) saturate(1.04)
 }
}

/* ============================================================
   Twin Oaks Weather v8.0 — compact-TV parity
   Some 1080p television browsers expose a 960px CSS viewport and request
   reduced motion. Keep their landscape display visually aligned with the
   desktop cinematic scene while leaving portrait-phone accessibility intact.
   ============================================================ */
@media(min-width:700px) and (max-width:980px) and (orientation:landscape){
 body[data-display-profile="compact-tv"] .weather-hero.is-fullscreen .hero-copy{max-width:330px}
 body[data-display-profile="compact-tv"] .weather-hero.is-fullscreen .cinematic-current{
  display:flex!important;flex-direction:column;flex-wrap:nowrap;align-items:flex-start;gap:8px;margin-top:14px
 }
 body[data-display-profile="compact-tv"] .weather-hero.is-fullscreen .cinematic-condition-icon{
  display:block!important;flex:0 0 100%;font-size:32px;line-height:1;filter:drop-shadow(0 4px 7px rgba(0,0,0,.24))
 }
 body[data-display-profile="compact-tv"] .weather-hero.is-fullscreen .cinematic-current>span:not(.cinematic-condition-icon){
  position:relative;display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;column-gap:6px;align-items:center;width:max-content;max-width:100%;padding-right:0;border-right:0
 }
 body[data-display-profile="compact-tv"] .weather-hero.is-fullscreen .cinematic-current i{grid-row:1/3;font-style:normal;color:#d8ebee;font-size:17px}
 body[data-display-profile="compact-tv"] .weather-hero.is-fullscreen .cinematic-current b{font-size:17px;font-weight:500;line-height:1.05}
 body[data-display-profile="compact-tv"] .weather-hero.is-fullscreen .cinematic-current small{font-size:7px;font-weight:400;letter-spacing:.07em;text-transform:uppercase;color:rgba(255,255,255,.72)}
}

/* ============================================================
   Twin Oaks Weather v8.1 — television cloud-engine compatibility
   JavaScript supplies explicit pixel width and height so older TV browsers do
   not collapse the empty cloud sprite elements. Short linear interpolation
   smooths the wall-clock updates used when animation frames are throttled.
   ============================================================ */
body[data-display-profile="compact-tv"] .weather-hero.is-fullscreen .cinematic-cloud{
 backface-visibility:hidden;
 -webkit-backface-visibility:hidden;
 transform-style:flat
}
@media(prefers-reduced-motion:reduce){
 body[data-display-profile="compact-tv"] .weather-hero.is-fullscreen .cinematic-cloud{
  transition:transform .28s linear,opacity 2.2s ease!important;
  will-change:transform,opacity
 }
}

/* ============================================================
   Twin Oaks Weather v8.7 — compact, consistent glass conditions
   The landscape stays visible while each live reading gets a clearer visual
   hierarchy and a restrained category accent. Rain cards share one treatment.
   ============================================================ */
.fullscreen-details article{--fs-accent:#9ed5d1}
.fullscreen-details .fullscreen-humidity{--fs-accent:#61c9f2}
.fullscreen-details .fullscreen-pressure{--fs-accent:#b6a0ef}
.fullscreen-details .fullscreen-solar{--fs-accent:#f6c75d}
.fullscreen-details .fullscreen-gust{--fs-accent:#55d7bc}
.fullscreen-details .fullscreen-rain{--fs-accent:#58b9ea}

@media(min-width:981px){
 .weather-hero:fullscreen .fullscreen-details,
 .weather-hero:-webkit-full-screen .fullscreen-details,
 .weather-hero.is-fullscreen .fullscreen-details{gap:clamp(7px,.68vw,11px)}
 .weather-hero:fullscreen .fullscreen-details article,
 .weather-hero:-webkit-full-screen .fullscreen-details article,
 .weather-hero.is-fullscreen .fullscreen-details article{
  position:relative;min-height:62px;padding:7px 11px 6px;border-color:rgba(255,255,255,.42);
  background:rgba(5,22,25,.23);box-shadow:0 7px 20px rgba(0,0,0,.1),inset 0 1px rgba(255,255,255,.07);
  -webkit-backdrop-filter:blur(5px) saturate(1.06);backdrop-filter:blur(5px) saturate(1.06)
 }
 .weather-hero:fullscreen .fullscreen-details article:before,
 .weather-hero:-webkit-full-screen .fullscreen-details article:before,
 .weather-hero.is-fullscreen .fullscreen-details article:before{
  content:"";position:absolute;z-index:1;left:11px;right:11px;top:0;height:2px;border-radius:0 0 3px 3px;background:var(--fs-accent);opacity:.9;box-shadow:0 0 8px color-mix(in srgb,var(--fs-accent) 55%,transparent)
 }
 .weather-hero:fullscreen .fullscreen-details .fullscreen-highlight,
 .weather-hero:-webkit-full-screen .fullscreen-details .fullscreen-highlight,
 .weather-hero.is-fullscreen .fullscreen-details .fullscreen-highlight{background:rgba(6,47,41,.25)}
 .weather-hero:fullscreen .fullscreen-details .fullscreen-rain,
 .weather-hero:-webkit-full-screen .fullscreen-details .fullscreen-rain,
 .weather-hero.is-fullscreen .fullscreen-details .fullscreen-rain{background:rgba(7,42,50,.27);border-color:rgba(151,220,241,.46)}
 .weather-hero:fullscreen .fullscreen-details>article>span,
 .weather-hero:-webkit-full-screen .fullscreen-details>article>span,
 .weather-hero.is-fullscreen .fullscreen-details>article>span{font-size:clamp(9px,.7vw,11px);line-height:1.1;letter-spacing:.075em}
 .weather-hero:fullscreen .fullscreen-details b,
 .weather-hero:-webkit-full-screen .fullscreen-details b,
 .weather-hero.is-fullscreen .fullscreen-details b{display:block;margin-top:3px;font-size:clamp(17px,1.27vw,22px);font-weight:540;line-height:1.05;white-space:nowrap}
 .weather-hero:fullscreen .fullscreen-details small,
 .weather-hero:-webkit-full-screen .fullscreen-details small,
 .weather-hero.is-fullscreen .fullscreen-details small{margin-top:3px;font-size:clamp(9px,.68vw,11px);line-height:1.12;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .weather-hero:fullscreen .fullscreen-details b>span,
 .weather-hero:-webkit-full-screen .fullscreen-details b>span,
 .weather-hero.is-fullscreen .fullscreen-details b>span{display:inline}
 .fullscreen-details b>em{display:inline;margin-left:4px;color:rgba(255,255,255,.78);font-size:.58em;font-style:normal;font-weight:500;letter-spacing:.015em}
 .fullscreen-details .fullscreen-pair{display:grid;grid-template-columns:.75fr 1.25fr;gap:8px;margin-top:2px;align-items:end}
 .fullscreen-details .fullscreen-pair>div{min-width:0}
 .fullscreen-details .fullscreen-pair small{margin:0;color:rgba(255,255,255,.7);font-size:clamp(7px,.56vw,9px);font-weight:700;letter-spacing:.055em;text-transform:uppercase}
 .fullscreen-details .fullscreen-pair b{margin-top:1px;font-size:clamp(15px,1.08vw,19px)}
 .fullscreen-details .fullscreen-pair b>em{margin-left:2px;font-size:.5em}
}

@media(max-width:980px){
 .weather-hero.is-fullscreen .fullscreen-details article{
  position:relative;min-height:52px;padding:5px 7px 4px;border-color:rgba(255,255,255,.42);background:rgba(5,22,25,.24);
  -webkit-backdrop-filter:blur(4px) saturate(1.05);backdrop-filter:blur(4px) saturate(1.05)
 }
 .weather-hero.is-fullscreen .fullscreen-details article:before{content:"";position:absolute;left:7px;right:7px;top:0;height:2px;border-radius:0 0 2px 2px;background:var(--fs-accent);opacity:.9}
 .weather-hero.is-fullscreen .fullscreen-details .fullscreen-highlight{background:rgba(6,47,41,.26)}
 .weather-hero.is-fullscreen .fullscreen-details .fullscreen-rain{background:rgba(7,42,50,.28);border-color:rgba(151,220,241,.44)}
 .weather-hero.is-fullscreen .fullscreen-details>article>span{font-size:7.5px;line-height:1.08;letter-spacing:.07em}
 .weather-hero.is-fullscreen .fullscreen-details b{display:block;margin-top:2px;font-size:13px;line-height:1.05;white-space:nowrap}
 .weather-hero.is-fullscreen .fullscreen-details small{margin-top:2px;font-size:7.5px;line-height:1.08;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .weather-hero.is-fullscreen .fullscreen-details b>span{display:inline}
 .weather-hero.is-fullscreen .fullscreen-details b>em{display:inline;margin-left:2px;color:rgba(255,255,255,.78);font-size:.56em;font-style:normal;font-weight:500}
 .weather-hero.is-fullscreen .fullscreen-details .fullscreen-pair{display:grid;grid-template-columns:.72fr 1.28fr;gap:4px;margin-top:1px;align-items:end}
 .weather-hero.is-fullscreen .fullscreen-details .fullscreen-pair>div{min-width:0}
 .weather-hero.is-fullscreen .fullscreen-details .fullscreen-pair small{margin:0;font-size:6px;font-weight:700;letter-spacing:.035em;text-transform:uppercase}
 .weather-hero.is-fullscreen .fullscreen-details .fullscreen-pair b{margin-top:1px;font-size:11px}
 .weather-hero.is-fullscreen .fullscreen-details .fullscreen-pair b>em{margin-left:1px;font-size:.45em}
}

@media(max-width:620px) and (orientation:portrait){
 .weather-hero.is-fullscreen .fullscreen-details article{min-height:60px;padding:7px 9px 6px}
 .weather-hero.is-fullscreen .fullscreen-details>article>span{font-size:8px}
 .weather-hero.is-fullscreen .fullscreen-details b{font-size:15px}
 .weather-hero.is-fullscreen .fullscreen-details small{font-size:8px}
 .weather-hero.is-fullscreen .fullscreen-details .fullscreen-pair small{font-size:7px}
 .weather-hero.is-fullscreen .fullscreen-details .fullscreen-pair b{font-size:13px}
}

/* ============================================================
   Twin Oaks Weather v9.0 — feathered wind-driven oak crowns
   The safe default is static. Moving crowns are enabled only when the browser
   can blend a soft mask, so a hard oval can never reappear on older TVs.
   ============================================================ */
.cinematic-canopy{
 display:none!important;position:absolute;inset:0;z-index:2;overflow:hidden;
 pointer-events:none;opacity:1!important;background:none!important;
 clip-path:none!important;will-change:transform
}
.cinematic-canopy:before,.cinematic-canopy:after{
 content:"";position:absolute;inset:0;background-position:center;
 background-repeat:no-repeat;background-size:cover;opacity:0
}

@supports ((-webkit-mask-image:url('../img/cinematic/canopy-mask-left.png')) or (mask-image:url('../img/cinematic/canopy-mask-left.png'))){
 .cinematic-canopy-left{
  -webkit-mask-image:url('../img/cinematic/canopy-mask-left.png');
  mask-image:url('../img/cinematic/canopy-mask-left.png');
  animation:cinematicOakLeft var(--tree-sway-duration,6s) ease-in-out infinite alternate
 }
 .cinematic-canopy-right{
  -webkit-mask-image:url('../img/cinematic/canopy-mask-right.png');
  mask-image:url('../img/cinematic/canopy-mask-right.png');
  animation:cinematicOakRight var(--tree-sway-duration,6s) ease-in-out infinite alternate-reverse
 }
 .cinematic-canopy-left,.cinematic-canopy-right{
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-size:cover;mask-size:cover;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-mode:alpha;mask-mode:alpha
 }

 body[data-tree-motion="active"][data-tree-season="spring"] .weather-hero:fullscreen .cinematic-canopy,
 body[data-tree-motion="active"][data-tree-season="summer"] .weather-hero:fullscreen .cinematic-canopy,
 body[data-tree-motion="active"][data-tree-season="autumn"] .weather-hero:fullscreen .cinematic-canopy,
 body[data-tree-motion="active"][data-tree-season="spring"] .weather-hero:-webkit-full-screen .cinematic-canopy,
 body[data-tree-motion="active"][data-tree-season="summer"] .weather-hero:-webkit-full-screen .cinematic-canopy,
 body[data-tree-motion="active"][data-tree-season="autumn"] .weather-hero:-webkit-full-screen .cinematic-canopy,
 body[data-tree-motion="active"][data-tree-season="spring"] .weather-hero.is-fullscreen .cinematic-canopy,
 body[data-tree-motion="active"][data-tree-season="summer"] .weather-hero.is-fullscreen .cinematic-canopy,
 body[data-tree-motion="active"][data-tree-season="autumn"] .weather-hero.is-fullscreen .cinematic-canopy{display:block!important}

 body[data-tree-season="spring"] .cinematic-canopy:before{background-image:url('../img/cinematic/twin-oaks-spring.webp');opacity:1}
 body[data-tree-season="summer"] .cinematic-canopy:before{background-image:url('../img/cinematic/twin-oaks-summer.webp');opacity:1}
 body[data-tree-season="summer"] .cinematic-canopy:after{background-image:url('../img/cinematic/twin-oaks-summer-clear.webp')}
 body[data-tree-season="autumn"] .cinematic-canopy:before{background-image:url('../img/cinematic/twin-oaks-autumn.webp');opacity:1}

 body[data-tree-season="summer"][data-sky-cover="clear"] .cinematic-canopy:before{opacity:0}
 body[data-tree-season="summer"][data-sky-cover="clear"] .cinematic-canopy:after{opacity:1}
 body[data-tree-season="summer"][data-sky-cover="partly"] .cinematic-canopy:before{opacity:.56}
 body[data-tree-season="summer"][data-sky-cover="partly"] .cinematic-canopy:after{opacity:.64}
}

@media(prefers-reduced-motion:reduce){
 body:not([data-display-profile="compact-tv"]) .cinematic-canopy{display:none!important}
}