:root{--bg:#f5f5ef;--card:#fff;--ink:#24382f;--muted:#708076;--line:#dfe5db;--accent:#d3ed99;--green:#2b5542;--shadow:0 18px 50px #1f39200a}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0;background:var(--bg);color:var(--ink);font:0.9375rem/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}body.dark{--bg:#14231e;--card:#1c3027;--ink:#e8efdf;--muted:#a5b7a9;--line:#344a3c;--green:#b6d591;--shadow:0 18px 50px #0002}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit;color:inherit}button,a,input,select,textarea{outline-offset:4px}button{cursor:pointer;border:1px solid var(--line);background:var(--card);padding:10px 17px;border-radius:30px;transition:transform .15s,background .15s}button:hover{background:var(--accent);color:#24382f;transform:translateY(-1px)}button:disabled{opacity:.6;cursor:wait}input,select,textarea{border:1px solid var(--line);background:var(--card);border-radius:14px;padding:12px;max-width:100%}input,textarea{width:100%}textarea{min-height:105px;resize:vertical}[hidden]{display:none!important}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(2rem,calc(4.2vw * var(--text-scale)),3.8125rem);font-weight:500;line-height:1.08;letter-spacing:-2.5px;margin:19px 0}h1 em{font-family:Georgia,serif;font-weight:400;color:var(--green)}h2{font-weight:500;font-size:1.8125rem;line-height:1.25;letter-spacing:-.9px;margin-bottom:15px}h3{font-size:1.1875rem;font-weight:550}.top{max-width:1320px;margin:auto;height:100px;padding:0 48px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:25px}.brand{display:flex;align-items:center;font-size:1.4375rem;font-weight:650;letter-spacing:-1px;white-space:nowrap}.brand-icon{font-size:2.5rem;color:#648855;margin-right:9px}.new{background:var(--accent);color:#273d30;margin-left:7px;padding:1px 8px;border-radius:8px;font-size:1.0625rem}.top nav{display:flex;gap:30px;font-size:0.8125rem}.top nav a:hover{text-decoration:underline}nav small{background:#e1e8db;color:#375335;border-radius:5px;padding:2px 5px}main{max-width:1320px;margin:auto;padding:0 48px}.intro{display:grid;grid-template-columns:1.25fr 1fr;gap:70px;align-items:center;padding:58px 0 32px}.eyebrow{font-size:0.625rem;letter-spacing:2.3px;font-weight:700;color:var(--muted)}.intro p{color:var(--muted)}.search-box{position:relative}.search-box label{display:block;font-size:0.8125rem;margin-bottom:10px}.search-box form{display:flex;gap:8px}#searchForm{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:7px;box-shadow:var(--shadow)}#searchForm input{background:transparent;border:0;min-width:0}#searchForm button{background:var(--ink);color:var(--bg);border-radius:12px;font-size:1.4375rem;padding:3px 18px}.search-actions{display:flex;gap:13px;margin-top:10px}.search-actions button{border:0;background:transparent;padding:5px 0;font-size:0.6875rem}.search-box #coordinates{flex-wrap:wrap;margin-top:12px}#coordinates input{width:45%}#results:not(:empty){position:absolute;top:100px;left:0;right:0;background:var(--card);box-shadow:0 15px 35px #0002;z-index:8;border-radius:16px;padding:12px;max-height:350px;overflow:auto}#results a{display:block;padding:10px;border-bottom:1px solid var(--line)}#results a:hover{background:var(--bg)}.chips{display:flex;gap:9px;overflow:auto;padding:0 0 24px}.chips a{border:1px solid var(--line);border-radius:30px;padding:6px 14px;white-space:nowrap;font-size:0.75rem}.chips .active{background:var(--ink);color:var(--bg)}.notice{background:var(--accent);color:#273d30;padding:12px 18px;border-radius:13px;margin-bottom:20px}.notice.error{background:#fbe1ce;color:#663a1a}.weather-layout{display:grid;grid-template-columns:1.7fr 1fr;gap:22px}.hero{min-height:500px;border-radius:28px;position:relative;overflow:hidden;background:#9fbdba;color:#fafff7}.hero canvas{position:absolute;width:100%;height:100%;inset:0}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#173a3d50,transparent 90%);pointer-events:none}.hero-content{position:relative;z-index:1;padding:28px 35px 47px}.hero-top{display:flex;align-items:center;justify-content:space-between}.live-dot{font-size:0.625rem;letter-spacing:1.3px}.live-dot:before{content:'●';color:#dafca4;font-size:0.6875rem;margin-right:9px}.hero button{background:#ffffff25;border-color:#ffffff38;color:white;padding:5px 13px;font-size:1.4375rem}.location h2{font-size:2.1875rem;margin-top:35px;margin-bottom:0}.location p{font-size:0.75rem;opacity:.8;margin-bottom:10px}.temperature{display:flex;align-items:center;gap:30px;line-height:1.1}.temperature>span:first-child{font-size:5.875rem;font-weight:300;letter-spacing:-5px}.temperature>span:nth-child(2){font-size:3.5rem;filter:drop-shadow(0 5px 12px #0002)}.condition{font-size:1.25rem;margin:7px 0 0}.hero #feels{font-size:0.75rem;opacity:.8}.hero-bottom{border-top:1px solid #ffffff40;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:30px;padding-top:20px}.hero-bottom small{display:block;font-size:0.5rem;letter-spacing:1.5px;opacity:.75}.hero-bottom b{font-size:0.9375rem;font-weight:500}.scene-caption{position:absolute;z-index:2;bottom:12px;left:35px;font-size:0.5625rem;opacity:.7}.brief{border:1px solid var(--line);border-radius:28px;background:var(--card);padding:29px 28px;display:flex;flex-direction:column;align-items:flex-start}.orb{width:56px;height:56px;background:#edf2dc;color:#607747;font-size:2.625rem;line-height:56px;text-align:center;border-radius:50%;margin:20px 0 16px;animation:orb 12s linear infinite}.brief h2{font-family:Georgia,serif;font-size:1.875rem}.brief p{font-size:0.8125rem;color:var(--muted)}.button-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.primary{background:var(--ink);color:var(--bg);border-color:var(--ink)}.text-btn{border:0;background:transparent;color:var(--green);padding:11px 0;font-size:0.75rem}.tiny{font-size:0.6875rem;color:var(--muted);line-height:1.6}.sun-row{margin-top:auto;padding-top:18px;border-top:1px solid var(--line);width:100%;display:flex;gap:20px;font-size:0.6875rem}.sun-row b{display:block;font-size:1.0625rem;font-weight:500}.section{padding:42px 0;border-bottom:1px solid var(--line)}.section-title{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.section-title h2{margin:7px 0}.muted{color:var(--muted);font-size:0.75rem}.hours{display:flex;overflow:auto;gap:10px;padding:3px 1px 12px}.hour{flex:0 0 90px;background:var(--card);border:1px solid var(--line);border-radius:17px;padding:15px 10px;text-align:center;font-size:0.75rem}.hour strong{display:block;font-size:1.3125rem;margin:9px 0 0}.hour span{display:block}.hour small{color:var(--muted)}.chart{height:180px;margin:12px 0 25px;border-radius:17px;background:var(--card);padding:10px;border:1px solid var(--line);overflow:hidden}.chart svg{width:100%;height:100%}.chart-tools{display:flex;align-items:center;justify-content:space-between;font-size:0.75rem;margin-top:15px}.chart-tools select{padding:5px 9px}.days{display:flex;overflow:auto;gap:10px;padding:3px 0 15px}.day{min-width:112px;display:flex;flex-direction:column;align-items:center;gap:3px;border-radius:17px;padding:14px 10px}.day.selected{background:var(--ink);color:var(--bg)}.day .icon{font-size:1.5625rem;margin:8px 0}.day strong{font-size:1.1875rem}.day small{font-size:0.625rem;opacity:.7}.day-detail{background:var(--card);border:1px solid var(--line);border-radius:15px;padding:15px}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:20px 0}.metric-grid div{padding:12px;background:var(--bg);border-radius:10px}.metric-grid small{display:block;color:var(--muted)}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:0.75rem}td,th{text-align:left;padding:10px;border-bottom:1px solid var(--line);white-space:nowrap}.plan-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.plan-card{border:1px solid var(--line);border-radius:20px;background:var(--card);padding:24px}.plan-card:nth-child(2){background:#e8eddc;color:#2b4331}.plan-card:nth-child(3){background:#e5eced;color:#294146}.plan-card:nth-child(4){background:#f0e8db;color:#54442e}.plan-icon{font-size:1.6875rem;display:block;margin-bottom:20px}.plan-card h3{margin-bottom:6px;font-size:1.0625rem}.plan-card p{font-size:0.75rem;margin-bottom:5px}.plan-card small{font-size:0.625rem;opacity:.65}.tag{border:1px solid var(--line);border-radius:30px;padding:6px 13px;font-size:0.625rem}.catalog-bar{display:flex;gap:15px;margin:20px 0}.catalog-bar input{flex:1}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.feature{border:1px solid var(--line);background:var(--card);border-radius:16px;padding:18px;min-height:140px;display:flex;flex-direction:column;align-items:flex-start}.feature small{font-size:0.5625rem;color:var(--muted);letter-spacing:1px}.feature h3{font-size:0.875rem;margin:10px 0}.feature b{font-size:1.25rem;font-weight:500}.feature p{font-size:0.6875rem;color:var(--muted);margin:0}.feature button{font-size:0.6875rem;padding:5px 12px;margin-top:auto}.globe-section{position:relative}.city-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.city-grid a{border:1px solid var(--line);padding:15px 18px;background:var(--card);border-radius:14px}.city-grid a:hover{background:var(--accent);color:#24382f}.city-grid small{display:block;color:var(--muted);font-size:0.625rem}.community{display:grid;grid-template-columns:1fr 1fr;gap:65px}.community form{display:flex;flex-direction:column;gap:10px;margin-top:18px}.community #ratingForm{display:flex;flex-direction:row;align-items:center;font-size:0.6875rem}.community #ratingForm select{padding:5px}.community small{font-size:0.625rem;color:var(--muted)}.comment{padding:20px;background:var(--card);border:1px solid var(--line);border-radius:16px;margin-bottom:12px}.comment p{white-space:pre-wrap;font-size:0.8125rem;margin:10px 0}.faq details{padding:15px 0;border-bottom:1px solid var(--line)}summary{cursor:pointer;font-size:0.8125rem}.faq details p{max-width:800px;padding-top:15px;color:var(--muted);font-size:0.8125rem}footer{max-width:1320px;margin:auto;padding:35px 48px;display:flex;align-items:center;flex-wrap:wrap;gap:25px;justify-content:space-between}footer p,footer a,footer small{font-size:0.6875rem;color:var(--muted)}footer .brand{font-size:1.25rem;color:var(--ink)}footer div{display:flex;gap:20px;align-items:center}footer small{width:100%}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);max-width:90%;background:var(--ink);color:var(--bg);z-index:50;padding:15px 25px;border-radius:15px;box-shadow:0 10px 30px #0002}.skip{position:fixed;top:-100px;left:20px;background:var(--card);z-index:99;padding:10px}.skip:focus{top:10px}.ad-slot{border:1px dashed var(--line);border-radius:20px;background:var(--card);padding:22px;margin-top:30px}.ad-slot small{display:block;color:var(--muted);font-size:0.625rem}.ad-slot a{font-size:1.375rem}.admin-wrap{max-width:1150px;margin:40px auto;padding:0 25px}.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.admin-card{background:var(--card);border:1px solid var(--line);padding:25px;border-radius:20px;margin-bottom:20px}.admin-card textarea{min-height:160px;font:0.75rem/1.6 monospace}.admin-card label{display:block;margin:10px 0;font-size:0.8125rem}.stats{display:flex;gap:15px;flex-wrap:wrap}.stats div{background:var(--card);border:1px solid var(--line);border-radius:15px;padding:20px;flex:1}.stats b{font-size:1.875rem;display:block}.stats small{color:var(--muted)}.admin-actions{display:flex;gap:6px}.admin-actions button{padding:6px 10px;font-size:0.6875rem}@keyframes orb{to{transform:rotate(360deg)}}@media(max-width:1000px){.top,main,footer{padding-left:25px;padding-right:25px}.top nav{gap:17px}.intro{gap:25px}.weather-layout{grid-template-columns:1.4fr 1fr}.hero-content{padding-left:25px;padding-right:25px}.brief{padding:25px 20px}.plan-grid,.feature-grid{grid-template-columns:repeat(2,1fr)}.city-grid{grid-template-columns:repeat(3,1fr)}.community{gap:25px}}@media(max-width:680px){.top{height:76px;padding:0 18px}.brand{font-size:1.25rem}.top nav{display:none}.top>button{font-size:0.75rem;padding:7px 12px}main{padding:0 18px}.intro{grid-template-columns:1fr;gap:15px;padding-top:35px}h1{letter-spacing:-1.5px;font-size:2.5625rem}.intro p{font-size:0.75rem}.weather-layout{grid-template-columns:1fr;gap:15px}.hero{min-height:440px}.hero-content{padding-top:20px}.location h2{margin-top:23px}.temperature>span:first-child{font-size:5.1875rem}.brief{display:grid;grid-template-columns:1fr auto;gap:5px 12px}.brief>.eyebrow,.brief>h2,.brief>p,.brief>.sun-row,.brief>.text-btn{grid-column:1/-1}.brief .orb{grid-column:2;grid-row:2/4;margin:5px 0}.brief h2{font-size:1.6875rem;margin-top:7px}.brief .button-row{grid-column:1/-1}.sun-row{margin-top:10px}.section{padding:28px 0}.section-title{align-items:flex-start;flex-wrap:wrap;gap:10px}.section-title h2{font-size:1.5625rem}.section-title .muted{font-size:0.625rem}.plan-card{padding:17px}.plan-card h3{font-size:0.9375rem}.plan-icon{margin-bottom:12px}.feature-grid{gap:8px}.feature{padding:14px}.catalog-bar{flex-direction:column;gap:8px}.city-grid{grid-template-columns:repeat(2,1fr)}.community{grid-template-columns:1fr}.metric-grid{grid-template-columns:repeat(2,1fr)}footer{padding:25px 18px;gap:12px}footer div{flex-wrap:wrap;gap:12px}.admin-grid{grid-template-columns:1fr}.chart-tools{gap:10px;font-size:0.625rem}.chart-tools select{max-width:160px}.hour{flex-basis:78px}.temperature{gap:20px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important;transition:none!important}}@media print{.top,.search-box,.brief button,.chips,.button-row,#catalog,#commentForm,#ratingForm,footer,#toast,.ad-slot{display:none!important}body{background:white;color:black}main{padding:0}.weather-layout{display:block}.hero{color:black;background:#ddd;min-height:370px}.hero canvas{display:none}.section{break-inside:avoid}.days,.hours{flex-wrap:wrap}.community{display:block}}

.feature .activity-result{font-size:0.875rem}
/* Search and forecast are the primary actions, on every screen size. */
:root{--bg:#f3f6f4;--muted:#52695d;--line:#d9e3dc;--shadow:0 14px 44px #173f2d0d}
.top{gap:18px}.top nav{margin-right:auto;margin-left:35px}.top #language{font-size:0.75rem;padding:8px 10px;max-width:120px}
.intro{padding-top:36px;padding-bottom:24px;gap:48px;grid-template-columns:1fr 1.25fr}.intro h1{font-size:clamp(2.125rem,calc(4vw * var(--text-scale)),3.25rem);letter-spacing:-1.8px}.intro p{font-size:0.8125rem;max-width:350px}.search-box label{font-size:1.0625rem;font-weight:600;margin-bottom:10px}#searchForm{padding:8px;border-radius:20px;border-color:#9fb8a8;box-shadow:0 8px 28px #244a3210}#searchForm:focus-within{outline:3px solid #9cc6af55;border-color:#387453}#searchForm input{font-size:1.0625rem;padding:14px 12px}#results:not(:empty){top:104px;border:1px solid var(--line);box-shadow:0 18px 40px #153b302b;padding:7px;max-height:380px}#results a{border-radius:10px;border-bottom:0;padding:12px}#results a small{display:block;color:var(--muted);font-size:0.75rem;margin-top:2px}#results a:hover,#results .highlighted{background:var(--accent);color:#24382f}#results a:focus-visible{outline:2px solid var(--green)}.search-actions button{font-size:0.75rem;padding:8px 0}.hero{box-shadow:var(--shadow)}.hero:after{background:linear-gradient(90deg,#102b377d,#102b3720)}.hero .location p,.hero #feels,.scene-caption{opacity:1}.hero-content{text-shadow:0 1px 4px #132e3744}.brief{background:linear-gradient(145deg,var(--card),var(--bg))}.brief .orb{width:40px;height:40px;font-size:1.9375rem;line-height:40px;margin:15px 0}.brief h2{font-size:1.8125rem}.hours .hour:first-child{border-color:#62917a;background:var(--accent);color:#24382f}.day.selected{box-shadow:0 5px 12px #25462a22}.location h2{overflow-wrap:anywhere}.globe-section,.faq{content-visibility:auto;contain-intrinsic-size:auto 450px}
@media(max-width:1000px){.top nav{margin-left:10px;gap:12px}.intro{gap:25px}.top{gap:10px}}
@media(max-width:680px){.top{gap:8px}.top #language{margin-left:auto;max-width:95px;font-size:0.6875rem;padding:7px}.top #theme{padding:7px 10px}.top #theme span{display:none}.intro{grid-template-columns:1fr;padding:25px 0 18px;gap:12px}.intro h1{font-size:2.25rem;margin:9px 0;line-height:1.1}.intro h1 br{display:none}.intro h1 em:before{content:' '}.intro .eyebrow{font-size:0.5625rem}.intro p{margin-bottom:4px;max-width:none}.search-box label{font-size:0.875rem;margin-bottom:7px}#searchForm input{font-size:1rem;padding:11px 8px}#results:not(:empty){top:90px}.chips{padding-bottom:16px}.hero{min-height:415px}.brief h2{font-size:1.625rem}.brief .orb{display:none}.hero-content{padding-bottom:40px}.hero-bottom{margin-top:20px}.globe-section,.faq{content-visibility:visible}}

/* Readable forecast chart: fixed-size labels and horizontal scrolling. */
.chart{height:auto;min-height:395px;padding:12px 0;overflow-x:auto;overflow-y:hidden;border:2px solid #66977c;box-shadow:0 8px 28px #244a3214;scrollbar-color:var(--green) var(--bg)}
.chart svg{display:block;width:auto;height:370px;max-width:none;color:var(--ink)}
.chart-grid{stroke:var(--line);stroke-width:1.5;stroke-dasharray:5 5}.chart-line{stroke:var(--green);stroke-width:5;stroke-linejoin:round;stroke-linecap:round}.chart-point{fill:var(--green);stroke:var(--card);stroke-width:2}
.axis-label{fill:currentColor;font:calc(1.125rem / var(--text-scale)) system-ui}.chart-value{fill:var(--green);font:700 calc(1.25rem / var(--text-scale)) system-ui;paint-order:stroke;stroke:var(--card);stroke-width:5px;stroke-linejoin:round}
.chart-tools{font-size:1.0625rem;gap:12px;flex-wrap:wrap}.chart-tools select{font-size:1.0625rem;padding:10px 14px;max-width:100%}.chart-hint{font-size:0.9375rem;color:var(--muted);margin:10px 0}
body{font-size:1.0625rem}.tiny,.muted{font-size:0.875rem}.intro p{font-size:1rem}.eyebrow{font-size:0.75rem}.hero-bottom small,.sun-row,.day small,.hour small{font-size:0.8125rem}.hour{flex-basis:108px;font-size:1rem}.hour strong{font-size:1.5625rem}.day{min-width:134px;font-size:1rem}.day strong{font-size:1.5rem}.plan-card p,.plan-card small,.feature p,.feature small{font-size:0.875rem}.feature h3{font-size:1.0625rem}.feature button,table,summary,.faq details p{font-size:1rem}.city-grid small,.community small,.community #ratingForm,footer p,footer a,footer small{font-size:0.875rem}
@media(max-width:680px){.chart-tools{font-size:1rem}.chart-tools select{font-size:1rem}.chart-hint{font-size:0.875rem}.section-title .muted{font-size:0.875rem}.intro p{font-size:0.9375rem}.search-box label{font-size:1rem}.feature{padding:12px;overflow-wrap:anywhere}.feature h3,.plan-card h3{font-size:1.0625rem}.plan-card small{font-size:0.8125rem}.day{min-width:126px}.hour{flex-basis:100px}.catalog-bar>*{min-width:0;max-width:100%}}
.city-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.city-grid a{min-width:0;overflow-wrap:anywhere}.plan-grid,.feature-grid{min-width:0}.plan-card,.feature{min-width:0}
@media(max-width:1000px){.city-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:680px){.city-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.top .brand{min-width:0;flex-shrink:1}.top #language{min-width:0;flex-shrink:1}.top #theme{flex-shrink:0}}
@media(max-width:360px){.top{padding:0 12px;gap:6px}.top .brand{font-size:1.125rem}.top #language{max-width:82px}.hero-content{padding-left:18px;padding-right:18px}.hero-bottom{gap:12px}}

/* A quiet location header leaves the animated scene at the top. */
.top{height:56px}.intro{padding:10px 0 8px;gap:24px;align-items:center;grid-template-columns:1fr 1fr}.intro .eyebrow,.intro h1 br{display:none}.intro h1{font-size:1.125rem;line-height:1.3;letter-spacing:-.3px;margin:0}.intro h1 em{font-size:0.8125rem;font-style:normal;font-weight:400;color:var(--muted)}.intro h1 em:before{content:' · '}.intro p{font-size:0.6875rem;line-height:1.3;margin:3px 0 0;max-width:none}.search-box label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}#searchForm{padding:3px;border-radius:12px;box-shadow:none}#searchForm input{padding:6px 9px;font-size:0.875rem;min-width:0}#searchForm button{padding:4px 12px}.search-actions{margin-top:2px;gap:15px}.search-actions button{padding:2px 0;font-size:0.625rem}#results:not(:empty){top:42px}.chips:empty{display:none}.chips{padding-bottom:5px}.weather-layout{margin-top:4px}.overview-legend{display:flex;gap:12px;flex-wrap:wrap;font-size:0.8125rem;padding:5px 16px;position:sticky;left:0;width:fit-content;max-width:100%}.chart.overview-chart svg{height:610px}.overview-value{font:700 calc(1rem / var(--text-scale)) system-ui;paint-order:stroke;stroke:var(--card);stroke-width:4px;stroke-linejoin:round}.overview-label{fill:currentColor;font:600 calc(0.875rem / var(--text-scale)) system-ui}.chart.overview-chart .axis-label{font-size:calc(0.9375rem / var(--text-scale))}.chart.overview-chart{scrollbar-width:auto}.chart-tools{margin-top:5px}.chart-tools select{font-size:0.9375rem;padding:7px 10px}
@media(max-width:680px){.top{height:50px}.intro{grid-template-columns:1fr;padding:7px 0;gap:6px}.intro h1{font-size:0.9375rem;margin:0;letter-spacing:0}.intro h1 em{font-size:0.6875rem}.intro p{font-size:0.625rem;margin:1px 0 0}.search-box{min-width:0}#searchForm input{font-size:1rem;padding:4px 8px}#searchForm{padding:2px}.search-actions{display:flex;justify-content:space-between;margin-top:1px}.search-actions button{font-size:0.625rem;padding:1px 0}.hero{min-height:385px}.hero-content{padding-top:14px}.location h2{margin-top:12px}.hero-bottom{margin-top:15px}.overview-legend{font-size:0.75rem;gap:5px 12px}.chart-tools{font-size:0.875rem}.chart-tools select{font-size:0.875rem}}

/* Live weather takes the first screen; messages stay quiet and in the flow. */
.weather-layout{grid-template-columns:minmax(0,1fr);gap:14px}
.hero{min-height:470px;border-radius:28px;isolation:isolate}
.hero:after{background:linear-gradient(90deg,#0b223b9c 0%,#0b223b50 48%,#0b223b08 100%);pointer-events:none}
.hero-content{padding:26px 36px 38px;max-width:none}
.hero .location h2{font-size:clamp(1.6875rem,calc(4vw * var(--text-scale)),2.875rem);margin-top:18px}
.hero .temperature>span:first-child{font-size:clamp(4.875rem,calc(9vw * var(--text-scale)),7.25rem);font-weight:350}
.hero .temperature>span:nth-child(2){font-size:2.75rem}
.hero .condition{font-size:1.5rem}.hero #feels{font-size:0.875rem}
.hero-bottom{max-width:560px;margin-top:22px;padding-top:14px}.hero-bottom b{font-size:1.0625rem}
.scene-caption{left:auto;right:20px;bottom:12px;font-size:0.625rem}
.brief{display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;gap:8px 18px;padding:16px 20px;border-radius:18px}
.brief>.eyebrow,.brief .orb,.brief>h2{display:none}.brief>p{flex:1 1 340px;margin:0;font-size:0.875rem}.brief .sun-row{width:auto;margin:0;padding:0;border:0;gap:16px}.brief .sun-row b{font-size:0.9375rem}.brief .text-btn{padding:4px 0}.brief #mediaStatus{flex-basis:100%;font-size:0.6875rem}
.notice,#status{padding:7px 10px;border-radius:10px;font-size:0.75rem;line-height:1.45;margin:5px 0;border:1px solid var(--line);box-shadow:none}
#toast{bottom:max(12px,env(safe-area-inset-bottom));padding:8px 12px;border-radius:10px;font-size:0.75rem;line-height:1.45;width:max-content;max-width:min(360px,calc(100% - 24px));max-height:25vh;overflow:auto;pointer-events:none}
@media(max-width:680px){
 main{padding:0 12px}.intro{gap:4px;padding:6px 0}.intro #announcement{display:none}
 .hero{min-height:405px;border-radius:22px}.hero-content{padding:16px 20px 34px}
 .hero .location h2{font-size:1.875rem;margin-top:14px}.hero .location p{margin-bottom:8px}
 .hero .temperature>span:first-child{font-size:5.375rem}.hero .temperature>span:nth-child(2){font-size:2.1875rem}
 .hero .condition{font-size:1.3125rem}.hero-bottom{margin-top:18px;gap:8px}.hero-bottom small{font-size:0.625rem;letter-spacing:.8px}.hero-bottom b{font-size:0.875rem}
 .scene-caption{right:14px;font-size:0.5625rem}.brief{padding:12px 14px;gap:8px 12px}.brief>p{flex-basis:100%}.brief>.button-row{grid-column:auto}.brief .sun-row{flex:1;justify-content:space-between}
}
@media(max-width:360px){.hero-content{padding-left:16px;padding-right:16px}.hero .location h2{font-size:1.6875rem}.hero .temperature>span:first-child{font-size:4.75rem}.hero-bottom b{font-size:0.75rem}}

/* Explicit motion control also works when the device requests reduced motion. */
.hero #skyMotion{position:absolute;z-index:3;left:20px;bottom:8px;min-width:44px;min-height:36px;padding:3px 12px;font-size:1.25rem;background:#102b37b8;border:1px solid #ffffff88;border-radius:12px;cursor:pointer}
.hero #skyMotion:focus-visible{outline:3px solid #dafca4;outline-offset:2px}
.scene-caption{max-width:calc(100% - 90px);text-align:right}

/* Pogoda New: readable colour, restrained depth and weather that stays in view. */
:root{--muted:#455f53;--green:#245c4b;--line:#cfddd5;--shadow:0 12px 36px #224d3a0d}
body{background:radial-gradient(ellipse at 5% 5%,#e1f3eb 0,transparent 40%),radial-gradient(ellipse at 95% 35%,#e6edf9 0,transparent 42%),var(--bg)}
body.dark{--muted:#b8cbbf;--green:#b6d591;--line:#3e594b;background:radial-gradient(ellipse at 0 0,#203d33,transparent 50%),var(--bg)}
.top{position:relative;gap:14px}.brand-wordmark{line-height:1.1}.brand-wordmark small{display:block;font-size:0.625rem;letter-spacing:1.2px;color:var(--muted);margin-top:5px;font-weight:600}.top nav{gap:20px}.top nav a{padding:7px 0;border-bottom:2px solid transparent}.top nav a:hover,.top nav a:focus-visible{border-color:var(--green);text-decoration:none}
h2,h3{font-weight:650}.eyebrow{color:var(--green);letter-spacing:1.5px;font-weight:750}.section-title h2,.globe-section>h2,.faq>h2{position:relative;padding-left:17px}.section-title h2:before,.globe-section>h2:before,.faq>h2:before{content:'';position:absolute;left:0;top:4px;bottom:3px;width:5px;border-radius:5px;background:linear-gradient(#56b6b8,#79b580)}
.section-title h2{font-size:clamp(1.4375rem,calc(3vw * var(--text-scale)),1.9375rem)}.section{padding-top:32px;padding-bottom:32px}.tiny,.muted{font-size:0.8125rem}.brief p{color:var(--ink)}.brief{box-shadow:var(--shadow);border-left:4px solid #79b580}.brief .sun-row{color:var(--ink)}
.hero{box-shadow:0 18px 46px #163e5429;border:1px solid #ffffff50}.hero-content{text-shadow:0 2px 8px #091d3399}.hero:after{background:linear-gradient(90deg,#071b32b8 0%,#0b223b66 48%,#0b223b08 100%)}.hero .temperature>span:first-child{font-weight:500}.hero .location p,.hero #feels{opacity:1}.hero-bottom small{font-size:0.6875rem;opacity:1}.hero-bottom{background:#0a233a60;border:1px solid #ffffff40;border-radius:15px;padding:12px 16px;backdrop-filter:blur(8px)}.hero-bottom b{font-weight:650}.scene-caption{opacity:1;color:#fff;text-shadow:0 1px 4px #000}.live-dot:before{display:inline-block;animation:liveBreathe 3s ease-in-out infinite}
.hour,.day,.plan-card,.feature,.city-grid a{box-shadow:0 4px 16px #193f2c07;transition:transform .2s,box-shadow .2s,border-color .2s}.hour small,.day small{opacity:1}.day:hover,.feature:hover,.city-grid a:hover{border-color:#6d9e8a;box-shadow:0 7px 22px #193f2c12}.plan-card{border-top:3px solid #71a98a}.plan-card:nth-child(2){border-top-color:#94ac61}.plan-card:nth-child(3){border-top-color:#6aa5bf}.plan-card:nth-child(4){border-top-color:#c49e68}.plan-card p{font-size:0.875rem}.plan-card small{opacity:1;font-size:0.75rem}.feature h3{font-size:1rem}.feature p{font-size:0.8125rem}.city-grid small{font-size:0.75rem}.faq summary{font-size:0.9375rem;font-weight:600}.faq details p{font-size:0.9375rem}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #258b94;outline-offset:4px}
.weather-inbox{position:relative;margin-left:auto;flex-shrink:0}#inboxToggle{min-height:42px;min-width:52px;padding:7px 11px;color:var(--green)}#inboxCount{display:inline-grid;place-items:center;background:var(--green);color:var(--card);border-radius:50%;font-size:0.6875rem;min-width:20px;height:20px}.inbox-panel{position:absolute;right:0;top:calc(100% + 12px);width:360px;max-width:calc(100vw - 28px);max-height:70vh;overflow:auto;z-index:30;background:var(--card);border:1px solid var(--line);padding:20px;border-radius:22px;box-shadow:0 18px 60px #082d332e;animation:inboxReveal .2s ease-out}.inbox-heading{display:flex;gap:10px;align-items:center;justify-content:space-between}.inbox-heading h2{font-size:1.1875rem;letter-spacing:-.4px;margin:0}.inbox-heading button{font-size:1.375rem;padding:0 10px}.inbox-item{border:1px solid var(--line);border-left:3px solid #619e8b;padding:12px;border-radius:12px;margin:10px 0;background:var(--bg)}.inbox-item h3{font-size:0.9375rem;margin:0 0 5px}.inbox-item p{font-size:0.875rem;margin:0;color:var(--muted)}#inboxForecast{display:inline-block;font-size:0.875rem;font-weight:650;margin-top:8px}.has-update{animation:inboxNudge .65s ease-out}
@keyframes inboxReveal{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:translateY(0)}}@keyframes inboxNudge{40%{box-shadow:0 0 0 5px #70a68a33}}@keyframes liveBreathe{50%{opacity:.45;transform:scale(.85)}}
@media(max-width:1000px){.top nav{gap:12px;font-size:0.75rem}.top{gap:10px}}
@media(max-width:680px){.top{gap:7px;min-height:76px;height:auto;padding-top:10px;padding-bottom:10px}.top .brand{font-size:1.125rem}.top .brand-icon{font-size:1.75rem;margin-right:4px}.top .new{font-size:0.8125rem;margin-left:3px;padding:1px 4px}.top #language{width:74px;min-width:0;padding:7px 3px;font-size:0.75rem}.top #theme{padding:7px 9px}.top #theme span{display:none}.brand-wordmark small{font-size:0.5625rem;letter-spacing:.3px}#inboxToggle{min-width:44px;padding:6px;font-size:0.9375rem}.weather-inbox{position:static}.inbox-panel{right:12px;top:calc(100% - 2px)}.hero-bottom{padding:10px}.hero-bottom b{font-size:0.8125rem}.hero-bottom small{font-size:0.625rem}.section-title h2{font-size:1.5rem}.tiny,.muted{font-size:0.75rem}}
@media(prefers-reduced-motion:reduce){.has-update,.inbox-panel,.live-dot:before{animation:none!important}}

/* Night garden: shared visual language for every place. */
body.dark{color-scheme:dark;--bg:#0c171e;--card:#152731;--text:#edf5f6;--muted:#b3c9d5;--line:#324b5a;--accent:#264953;--green:#b1ebc0;background:radial-gradient(ellipse at 10% 0,#173d48,transparent 45%),radial-gradient(ellipse at 100% 45%,#252440,transparent 45%),var(--bg)}
body.dark .plan-card:nth-child(3n+1),body.dark .city-card:nth-child(3n+1){background:linear-gradient(135deg,#193b41,#152731)}
body.dark .plan-card:nth-child(3n+2){background:linear-gradient(135deg,#302d4b,#152731)}
body.dark .day.selected,body.dark .hours .hour:first-child{background:#294856;color:#f1fbff;border-color:#7ce0dd}
body.dark #searchForm,body.dark #results{background:var(--card);color:var(--text)}
body.dark #results a:hover{background:#294856;color:#fff}
#installApp{font-size:0.75rem;padding:8px 11px;white-space:nowrap;border-color:#61b8b0}
dialog{max-width:min(430px,90vw);background:var(--card);color:var(--text);border:1px solid var(--line);border-radius:22px;padding:26px}dialog::backdrop{background:#06121bcc;backdrop-filter:blur(5px)}
.credits{font-size:0.6875rem;max-width:230px}.credits summary{cursor:pointer}.credits span{display:block}
.weather-glyph,#weatherIcon{display:inline-block;filter:drop-shadow(0 4px 12px #72cef44a);animation:weather-float 4s ease-in-out infinite}
[data-kind="clear"]{animation:weather-glow 6s ease-in-out infinite!important}
[data-kind="rain"],[data-kind="storm"]{animation:weather-rain 2.5s ease-in-out infinite!important}
[data-kind="snow"]{animation:weather-float 5s ease-in-out infinite!important}
.day:nth-child(3n) .weather-glyph{animation-delay:-1.4s}.day:nth-child(2n) .weather-glyph{animation-delay:-2.7s}
.plan-card,.feature,.city-card{transition:transform .25s,box-shadow .25s}.plan-card:hover,.feature:hover,.city-card:hover{transform:translateY(-4px);box-shadow:0 12px 30px #07172440}
@keyframes weather-float{50%{transform:translateY(-5px) rotate(5deg)}}
@keyframes weather-glow{50%{transform:rotate(12deg) scale(1.08);filter:drop-shadow(0 0 14px #ffd77e88)}}
@keyframes weather-rain{50%{transform:translate(-2px,4px) rotate(-4deg)}}
@media(max-width:680px){.top{height:auto;min-height:76px;flex-wrap:wrap;padding-top:10px;padding-bottom:10px;gap:7px}#installApp{font-size:0.6875rem;padding:7px 9px}.top .brand{margin-right:auto}.top #language{margin-left:0}}
@media(prefers-reduced-motion:reduce){.weather-glyph,#weatherIcon,[data-kind]{animation:none!important}.plan-card:hover,.feature:hover,.city-card:hover{transform:none}}
@media(min-width:681px) and (max-width:1100px){.top{height:auto;min-height:90px;flex-wrap:wrap;padding-top:12px;padding-bottom:12px}.top nav{order:5;width:100%;margin:0;justify-content:center}.top #language{margin-left:auto}}
@media(min-width:681px) and (max-width:1100px){.weather-inbox{position:static}.inbox-panel{right:25px;top:calc(100% - 2px)}}

/* Keep metric names aligned with their bands throughout horizontal scrolling. */
.overview-plot{display:flex;align-items:flex-start;width:max-content;min-width:100%;isolation:isolate}
.overview-axis{position:sticky;left:0;z-index:2;flex:0 0 124px;width:124px;height:610px;background:var(--card);border-right:1px solid var(--line);box-shadow:6px 0 12px #00000010}
.overview-axis-row{position:absolute;left:0;right:0;height:119px;padding:12px 10px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;align-items:flex-start;gap:6px;line-height:1.35}
.overview-axis-row strong{font-size:calc(0.8125rem / var(--text-scale));font-weight:600;overflow-wrap:anywhere}
.overview-axis-row small{font-size:calc(0.75rem / var(--text-scale));color:var(--muted)}
.overview-axis-colors{display:flex;gap:5px;margin-top:2px}.overview-axis-colors i{display:block;width:20px;height:3px;border-radius:3px}
.overview-plot>svg{flex:none}
.chart.overview-chart .overview-legend{width:100%;max-width:none;background:var(--card);z-index:3;font-size:0.75rem;gap:4px 12px;padding:4px 10px 9px}
@media(max-width:680px){.overview-axis{flex-basis:104px;width:104px}.overview-axis-row{padding:10px 8px}.overview-axis-row strong{font-size:calc(0.75rem / var(--text-scale))}.overview-axis-row small{font-size:calc(0.6875rem / var(--text-scale))}}

.overview-axis-row:nth-child(1){top:66px}.overview-axis-row:nth-child(2){top:198px}.overview-axis-row:nth-child(3){top:330px}.overview-axis-row:nth-child(4){top:462px}
.overview-axis-colors .metric-high{background:#b35418}.overview-axis-colors .metric-low{background:#496bd4}.overview-axis-colors .metric-wind{background:#237963}.overview-axis-colors .metric-humidity{background:#2289ae}.overview-axis-colors .metric-pressure{background:#9761b5}

/* Compact forecast: full data, independent bands and a fixed metric column. */
.chart{min-height:0;padding:6px 0;margin:8px 0 14px;border-width:1px}
.chart svg{height:210px}
.chart .axis-label{font-size:calc(0.75rem / var(--text-scale))}
.chart .chart-value{font-size:calc(0.875rem / var(--text-scale));stroke-width:3px}
.chart-line{stroke-width:3}
.chart.overview-chart svg{height:332px}
.overview-axis{height:332px;flex-basis:112px;width:112px}
.overview-axis-row{height:70px;padding:5px 8px;gap:2px;justify-content:center}
.overview-axis-row strong{font-size:calc(0.6875rem / var(--text-scale));line-height:1.25}
.overview-axis-row small{font-size:calc(0.6875rem / var(--text-scale))}
.overview-axis-colors{margin-top:1px}
.overview-axis-row:nth-child(1){top:46px}.overview-axis-row:nth-child(2){top:116px}.overview-axis-row:nth-child(3){top:186px}.overview-axis-row:nth-child(4){top:256px}
.overview-value{font-size:calc(0.8125rem / var(--text-scale));stroke-width:3px;font-variant-numeric:tabular-nums}
.chart.overview-chart .axis-label{font-size:calc(0.75rem / var(--text-scale))}
.chart.overview-chart .overview-legend{font-size:0.6875rem;gap:2px 10px;padding:2px 8px 5px}
.chart-tools{font-size:0.8125rem;gap:6px;margin-top:3px}
.chart-tools select{font-size:0.8125rem;padding:5px 8px}
.chart-hint{font-size:0.75rem;line-height:1.4;margin:5px 0}
.chart svg{animation:forecastReveal .35s ease-out}
@keyframes forecastReveal{from{opacity:.35}to{opacity:1}}
@media(max-width:680px){.overview-axis{flex-basis:96px;width:96px}.overview-axis-row{padding:4px 6px}.chart-tools label{min-width:0}.chart-tools select{max-width:100%;font-size:0.75rem}.chart-tools #chartLabel{font-size:0.75rem}}
@media(prefers-reduced-motion:reduce){.chart svg{animation:none}}

/* Explicit theme colours prevent inherited light-card text on dark gradients. */
.plan-card,.plan-card:nth-child(n){color:#203c36;background:linear-gradient(135deg,#eff7ee,#fff);border-color:#b6cdbf}
.plan-card p{font-size:1rem;font-weight:650;line-height:1.6;color:inherit}
.plan-card small{display:block;font-size:0.875rem;line-height:1.6;opacity:1;color:#425f55}
body.dark .plan-card:nth-child(n){color:#f0f8fa;background:linear-gradient(135deg,#234550,#162b36);border-color:#53717d}
body.dark .plan-card:nth-child(2n){background:linear-gradient(135deg,#383550,#192b38)}
body.dark .plan-card small{color:#d0e4e9}
.forecast-scene{position:relative;isolation:isolate;min-height:208px;overflow:hidden;border-radius:20px;margin-top:14px;background:#284d66;color:#fff;box-shadow:0 10px 30px #10283e25}
.forecast-scene canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-2}
.forecast-scene:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#071a31d9,transparent 85%);z-index:-1}
.forecast-scene-copy{display:flex;flex-direction:column;gap:7px;padding:24px 24px 66px;max-width:85%;text-shadow:0 2px 5px #08182d}
.forecast-scene-copy b{font-size:0.9375rem}.forecast-scene-copy span{font-size:clamp(1.4375rem,calc(3vw * var(--text-scale)),2.125rem);font-weight:700;line-height:1.2}.forecast-scene-copy small{font-size:0.9375rem;color:#fff}
.forecast-scene-controls{position:absolute;left:20px;bottom:12px;display:flex;gap:8px}.forecast-scene-controls button{min-width:44px;min-height:38px;padding:5px 14px;background:#102a40d9;color:#fff;border:1px solid #c3e6fa8c}
@media(max-width:680px){.forecast-scene{min-height:220px}.forecast-scene-copy{padding:18px 16px 66px;max-width:100%}.plan-card{padding:16px}.plan-card p{font-size:0.9375rem}.plan-card small{font-size:0.8125rem}}

/* Legend text: separate theme palettes keep small labels above 4.5:1 contrast. */
.overview-legend .legend-high{color:#984211}.overview-legend .legend-low{color:#3858b5}.overview-legend .legend-wind{color:#19634f}.overview-legend .legend-humidity{color:#146b8a}.overview-legend .legend-pressure{color:#794791}
body.dark .overview-legend .legend-high{color:#ffc08a}body.dark .overview-legend .legend-low{color:#a9bdff}body.dark .overview-legend .legend-wind{color:#8bdfbc}body.dark .overview-legend .legend-humidity{color:#8bd8f4}body.dark .overview-legend .legend-pressure{color:#d8b0ed}

/* Visitor-controlled text size. Layout remains responsive at every setting. */
html{--text-scale:1;font-size:calc(100% * var(--text-scale))}
.font-controls{max-width:1224px;margin:8px auto;padding:0 12px;display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;font-size:.875rem}
.font-controls button{min-width:44px;min-height:44px;padding:5px 10px;line-height:1.3}
.font-controls button:disabled{cursor:default}
.font-controls button:focus-visible{outline:3px solid var(--green)}
.font-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.top{height:auto;min-height:76px;flex-wrap:wrap;padding-top:10px;padding-bottom:10px}
.top nav{flex-wrap:wrap}.top>*{max-width:100%}
html[data-large-text] .intro{grid-template-columns:minmax(0,1fr)}
html[data-large-text] .section-title,html[data-large-text] .sun-row{flex-wrap:wrap}
html[data-large-text] .plan-grid,html[data-large-text] .feature-grid,html[data-large-text] .city-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
html[data-large-text] .hero-bottom{flex-wrap:wrap;gap:14px}
html[data-large-text] .hero .temperature{flex-wrap:wrap;font-size:inherit}
html[data-large-text] .hero .temperature>span:first-child{font-size:clamp(3rem,calc(18vw * var(--text-scale)),7.25rem)}
html[data-large-text] .hero-content,html[data-large-text] .brief,html[data-large-text] .section-title>div{min-width:0;overflow-wrap:anywhere}
html[data-large-text] .search-actions,html[data-large-text] .button-row,html[data-large-text] footer>div{flex-wrap:wrap}
html[data-large-text] .scene-caption{position:static;display:block;margin:6px 12px 12px auto}
html[data-large-text] .forecast-scene{min-height:320px}
html[data-large-text] .forecast-scene-copy{max-width:100%}
html[data-large-text] .community{grid-template-columns:minmax(0,1fr)}
html[data-large-text] .community>*,html[data-large-text] .metric-grid>*{min-width:0;overflow-wrap:anywhere}
html[data-large-text] .metric-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))}
html[data-large-text] #ratingForm{flex-wrap:wrap}
html[data-large-text] .credits{overflow-wrap:anywhere;max-width:100%}
html[data-large-text] footer .brand{white-space:normal;overflow-wrap:anywhere;max-width:100%}

.overview-plot,.chart:not(.overview-chart)>svg{zoom:var(--text-scale)}

/* Compact first screen: text controls share the header. */
.top{min-height:60px;padding-top:6px;padding-bottom:6px;gap:10px}
.top nav{gap:12px}
.top .font-controls{max-width:none;margin:0;padding:0;gap:3px;flex-wrap:nowrap;font-size:.75rem}
.top .font-controls>span{display:none}
.top .font-controls button{min-width:32px;min-height:34px;padding:4px 7px;font-size:.75rem}
.top #language,.top #theme{padding:6px 8px;font-size:.75rem}
.intro{padding:6px 0 4px;gap:18px}
.intro h1{font-size:1rem;margin:0}
.intro p{margin:2px 0 0}
.chips{padding-bottom:3px;gap:6px}
.chips a{padding:3px 10px}
.weather-layout{margin-top:2px}
@media(min-width:681px) and (max-width:1200px){
 .top nav{order:5;width:100%;justify-content:center;gap:18px}
}
@media(max-width:680px){
 .top{display:grid;grid-template-columns:minmax(0,1fr) auto auto;min-height:0;padding:6px 12px;gap:5px 8px}
 .top .brand{grid-column:1;margin:0}
 .top .weather-inbox{grid-column:2;grid-row:1;margin:0}
 .top #theme{grid-column:3;grid-row:1}
 .top #language{grid-column:1;grid-row:2;width:82px;padding:5px 3px}
 .top #installApp{grid-column:2;grid-row:2;padding:5px 8px;font-size:.6875rem}
 .top .font-controls{grid-column:3;grid-row:2;justify-self:end}
 .top .font-controls button{min-width:28px;min-height:32px;padding:3px 5px;font-size:.6875rem}
 .intro{padding:4px 0;gap:3px}
 .intro h1{font-size:.875rem;line-height:1.25}
 .intro h1 em{font-size:.6875rem}
 .hero{min-height:370px}
 .hero-content{padding-top:12px;padding-bottom:34px}
 .hero .location h2{margin-top:8px}
 .hero-bottom{margin-top:12px}
}
html[data-large-text] .top{display:flex;flex-wrap:wrap;height:auto}
html[data-large-text] .top .font-controls{flex-wrap:wrap}
/* Publishing and catalogue */
.embed-frame{width:100%;min-height:160px;border:0;background:transparent}.integration-embed{margin:1rem 0}.source-credit{display:block;font-size:.7rem;opacity:.65;margin-top:.6rem}.ad-slot>a{display:block;font-size:1.15rem;margin:.5rem 0}.admin-card textarea{min-height:120px;width:100%;box-sizing:border-box}.admin-card label{display:block;margin-top:.6rem}.admin-card input,.admin-card select{max-width:100%;box-sizing:border-box}.admin-card .field-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}.admin-card .ad-editor{border:1px solid var(--line,#687a70);border-radius:12px;padding:14px;margin:12px 0}.admin-card .admin-actions{display:flex;flex-wrap:wrap;gap:8px}body [hidden]{display:none!important}.chips a{overflow-wrap:anywhere}
.admin-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-grid>*{min-width:0}.admin-card{min-width:0;overflow-wrap:anywhere}.admin-card form,.admin-card details,.admin-card .table-wrap{min-width:0;max-width:100%}.admin-card input:not([type=checkbox]),.admin-card select{width:100%;min-width:0}.admin-card .field-row{grid-template-columns:repeat(auto-fit,minmax(min(160px,100%),1fr))}.admin-card button{white-space:normal;max-width:100%}.admin-card input[type=checkbox]{width:auto;min-width:0}.admin-card output{overflow-wrap:anywhere}@media(max-width:760px){.admin-grid{grid-template-columns:minmax(0,1fr)}.admin-wrap{padding:0 14px}.admin-card{padding:18px}.stats div{min-width:100px}}

.stats div{flex:1 1 140px;min-width:0}.stats b{font-size:clamp(1.15rem,2vw,1.875rem)}

/* Compact weather identity, theme switch and accessible favorites rail. */
.top .brand-icon{display:grid;place-items:center;width:38px;height:38px;flex-shrink:0;border-radius:13px;background:linear-gradient(145deg,#207d83,#153947);box-shadow:0 3px 12px #12333c25;margin-right:7px}.brand-icon svg{width:34px;height:34px}.top .brand-wordmark{font-weight:800;letter-spacing:-.7px}.top .brand-wordmark small{margin-top:3px;font-size:.5625rem;letter-spacing:.7px}.top .new{font-size:.875rem;margin-left:4px;padding:2px 5px}.top nav{gap:14px;margin-left:12px}.top{gap:8px;min-height:58px}.top #theme{display:flex;align-items:center;gap:6px;padding:4px 7px;border-radius:30px;white-space:nowrap}.top #theme span{display:inline-block}.theme-track{position:relative;width:46px;height:25px;border-radius:20px;background:#d8e6dc;color:#5e502c;font-size:16px;line-height:25px;flex-shrink:0}.theme-sun,.theme-moon{position:absolute;width:23px;text-align:center;z-index:1;left:0}.theme-moon{left:23px}.theme-track i{position:absolute;left:2px;top:2px;width:21px;height:21px;border-radius:50%;background:#fff;box-shadow:0 1px 4px #10252c30;transition:transform .2s}body.dark .theme-track{background:#294956;color:#fff}body.dark .theme-track i{transform:translateX(21px);background:#607e94}.theme-label{font-size:.6875rem;min-width:44px}body:not(.dark){color-scheme:light}
.favorites-bar{display:flex;align-items:center;gap:5px;margin:3px 0 8px;min-width:0;max-width:100%}.favorites-bar>button{flex:0 0 30px;width:30px;min-height:32px;padding:0;font-size:24px;line-height:1}.favorites-bar>button:disabled{opacity:.3;cursor:default}#favorites{display:flex;flex:1 1 0;min-width:0;overflow-x:auto;overflow-y:hidden;padding:3px 0 7px;scrollbar-width:thin;scrollbar-color:var(--green) transparent;-webkit-overflow-scrolling:touch}#favorites a{flex:0 0 auto;white-space:nowrap;overflow-wrap:normal}
@media(max-width:680px){.top{padding-top:5px;padding-bottom:5px;gap:4px 7px}.top .brand-icon{width:32px;height:32px;border-radius:10px}.brand-icon svg{width:29px;height:29px}.top .brand{font-size:1.125rem}.top #theme{padding:3px}.top #theme .theme-label{display:none}.top .brand-wordmark small{font-size:.5rem}.top #language{padding:5px 3px}.top .font-controls button{min-height:28px}}
@media(prefers-reduced-motion:reduce){.theme-track i{transition:none}}

.catalog-countries{display:flex;flex-wrap:wrap;gap:7px;margin:14px 0}.catalog-countries a{border:1px solid var(--line);border-radius:18px;padding:5px 12px;font-size:.8125rem}.catalog-countries a:hover{background:var(--accent)}

.top #theme{justify-self:end;width:fit-content;background:var(--card)}
/* Explicit contrast: the dark accent is too dark for the wordmark's original ink. */
body.dark .brand .new{background:#c8efa7;color:#183324}body:not(.dark) .brand .new{background:#d3ed99;color:#273d30}
#notificationOpen{width:100%;margin-top:16px;font-weight:650}#notificationSettings{width:760px;max-width:calc(100vw - 24px);max-height:90dvh;padding:24px;border:1px solid var(--line);border-radius:24px;background:var(--card);color:var(--ink);overflow:auto;overscroll-behavior:contain}#notificationSettings::backdrop{background:#061820b8;backdrop-filter:blur(4px)}#notificationSettings fieldset{border:1px solid var(--line);border-radius:15px;margin:18px 0;padding:16px;min-width:0}#notificationSettings legend{font-weight:650;padding:0 7px}#notificationSettings input[type=checkbox]{width:18px;height:18px;flex-shrink:0;accent-color:#3a947e}.alert-events{display:grid;grid-template-columns:1fr 1fr;gap:10px}.alert-events label,.alert-check{display:flex;align-items:center;gap:8px}.alert-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}.alert-fields label{font-size:.875rem}.alert-fields input{display:block;margin-top:5px}.alert-channel{border:1px solid var(--line);border-radius:16px;padding:16px;margin:14px 0}.alert-channel p{font-size:.875rem;color:var(--muted);margin:8px 0 12px}.alert-channel .button-row{margin-top:10px}.alert-channel a{text-decoration:underline;overflow-wrap:anywhere}#alertStatus{position:sticky;bottom:0;background:var(--card);padding:12px 0;font-weight:650}#alertStatus:empty{display:none}#alertDelete{margin:8px 0}#alertForm>button{width:100%}@media(max-width:520px){#notificationSettings{padding:16px}.alert-events{grid-template-columns:1fr}.alert-fields{gap:10px}#notificationSettings h2{font-size:1.2rem}.alert-fields label{font-size:.8125rem}.alert-channel{padding:12px}}

.forecast-shortcuts{display:flex;flex-direction:column;align-items:center;gap:8px;margin:3px 0 10px;font-size:0.6875rem;line-height:1.4}
/* Bright forecast shortcut, readable in both themes. */
.chart-anchor{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:min(100%,360px);min-height:48px;text-align:center;flex-shrink:0;white-space:normal;padding:12px 24px;border:1px solid #d1e781;border-radius:16px;background:linear-gradient(115deg,#c9f478 0%,#e4ef7c 52%,#ffcf70 100%);color:#203520;font-size:.9375rem;font-weight:750;line-height:1.4;box-shadow:0 6px 20px #b4d65b30,inset 0 1px 0 #ffffff80;transition:transform .18s ease,box-shadow .18s ease,filter .18s ease}
.chart-anchor::before{content:"";width:22px;height:22px;flex:0 0 22px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 3v18h18M6 15l5-6 4 3 6-7' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.chart-anchor:hover{color:#203520;text-decoration:none;filter:brightness(1.05);transform:translateY(-2px);box-shadow:0 9px 24px #b4d65b45,inset 0 1px 0 #ffffff80}
.chart-anchor:active{transform:translateY(0);box-shadow:0 3px 10px #b4d65b25}
.chart-anchor:focus-visible{outline:3px solid var(--green);outline-offset:4px}
@media(prefers-reduced-motion:reduce){.chart-anchor{transition:none}.chart-anchor:hover{transform:none}}
#weather-chart{scroll-margin-top:0}

/* Compact navigation stays outside the scrolling forecast. */
.chart-scroll{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:6px 0;color:var(--green);font-size:.8125rem;font-weight:600}.chart-scroll>div{display:flex;gap:6px}.chart-scroll button{display:inline-flex;align-items:center;justify-content:center;width:36px;height:32px;padding:0;font-size:1rem}.chart-scroll button:disabled{opacity:.3;cursor:default;transform:none}

.voice-search{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:10px 0}.voice-search label{display:flex;align-items:center;gap:6px;font-size:13px}.voice-search select{max-width:170px}.voice-search p{flex-basis:100%;font-size:13px;margin:0;line-height:1.5}.voice-search button[aria-pressed="true"]{background:#a83232;color:#fff;outline:2px solid currentColor}.voice-search button{min-height:44px}
.search-box #results:not(:empty){position:relative;top:auto;left:auto;right:auto;margin:8px 0;max-height:350px}

/* Keep voice input inside the search field, with a full touch target. */
#searchForm{align-items:center;gap:2px}
#searchForm input{flex:1;width:0;min-width:0}
#searchForm #voiceStart{display:flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;padding:0;border:0;border-radius:9px;background:transparent;color:var(--ink);cursor:pointer}
#searchForm #voiceStart:hover{background:var(--accent);color:#24382f}
#searchForm #voiceStart[aria-pressed="true"]{background:#b32f39;color:white;outline:2px solid currentColor}
#searchForm #voiceStart:focus-visible{outline:3px solid var(--green);outline-offset:1px}
.search-box .voice-search label{position:static;width:auto;height:auto;overflow:visible;clip-path:none;margin:0;font-size:12px;font-weight:400}
.voice-search{gap:6px;margin:5px 0}.voice-search select{padding:4px 8px;font-size:12px}.voice-search #voiceStatus{font-size:12px;max-width:none;margin:0;line-height:1.4}

/* Location actions share the speech language row. Status remains below. */
.search-box .voice-search{gap:0 10px;margin:3px 0;align-items:center}
.search-box .voice-search label{flex:0 1 auto;min-width:0;gap:4px;font-size:10px;white-space:nowrap}
.voice-search select{min-width:0;width:88px;padding:3px 2px;font-size:10px}
.voice-search .search-actions{display:flex;align-items:center;flex:1;justify-content:flex-end;flex-wrap:nowrap;gap:10px;margin:0}
.voice-search .search-actions button{white-space:nowrap;font-size:10px;line-height:1.4;padding:5px 0;min-height:28px}
.voice-search #voiceStatus{flex-basis:100%;margin-top:2px}
@media(max-width:1100px){.search-box .voice-search{column-gap:6px}.voice-search .search-actions{gap:8px}.voice-search select{width:60px}.voice-search #voiceLanguageLabel{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}}
html[data-large-text] .search-box .voice-search{row-gap:4px}
html[data-large-text] .voice-search .search-actions{flex-wrap:wrap}

/* Keep language names readable, including native select arrow and larger text. */
.top #language{width:auto;min-width:max-content;max-width:none;flex-shrink:0;justify-self:start;padding:6px 10px}
.voice-search #voiceLanguage{width:auto;min-width:max-content;max-width:none;padding:4px 8px}
.search-box .voice-search label{flex-shrink:0}
.voice-search .search-actions{flex-wrap:wrap}

#installHelp{width:560px;max-width:calc(100vw - 24px);max-height:90dvh;overflow:auto;padding:24px;border:1px solid var(--line);border-radius:24px;background:var(--card);color:var(--ink)}#installHelp::backdrop{background:#061820b8;backdrop-filter:blur(4px)}#installHelp h3{margin-top:22px}#installHelp p{line-height:1.6}#installHelp details,#alertAdvanced{margin:16px 0}#installHelp summary,#alertAdvanced summary{cursor:pointer}#installHelp .inbox-heading form{margin:0}#notificationSettings>.alert-channel .primary{flex:1}@media(max-width:520px){#installHelp{padding:16px}#installHelp h2{font-size:1.25rem}}

/* One short toolbar; secondary controls appear only when requested. */
.top.compact-header,html[data-large-text] .top.compact-header{display:flex;flex-wrap:nowrap;min-height:52px;height:auto;padding-top:4px;padding-bottom:4px;gap:6px;position:relative;z-index:12}
.compact-header>.brand{margin-right:auto;min-width:0;font-size:1.125rem;grid-column:auto}
.compact-header .brand-wordmark small{display:none}
.compact-header .brand-icon{width:30px;height:30px;border-radius:10px}
.compact-header .brand-icon svg{width:28px;height:28px}
.compact-header>.weather-inbox,.compact-header>#theme{flex:none;margin:0;grid-column:auto;grid-row:auto}
.compact-header #theme{padding:3px;border:0;background:transparent;min-height:44px}
.compact-header #theme .theme-label{display:none}
.compact-header #inboxToggle{display:flex;align-items:center;justify-content:center;gap:2px;min-width:44px;min-height:44px;padding:5px;border:0;background:transparent}
.compact-header #inboxToggle>span:first-child{display:flex}
.compact-header #inboxCount{font-size:.625rem}
.header-menu{position:static;flex:none}
.header-menu>summary{display:flex;align-items:center;justify-content:center;list-style:none;width:44px;height:44px;border-radius:12px;border:1px solid var(--line);background:var(--card);cursor:pointer}
.header-menu>summary::-webkit-details-marker{display:none}
.header-menu>summary:hover,.header-menu[open]>summary{background:var(--accent);color:#24382f}
.header-menu>summary:focus-visible{outline:3px solid var(--green);outline-offset:2px}
.header-options{position:absolute;right:12px;top:calc(100% + 4px);width:300px;max-width:calc(100vw - 24px);max-height:70dvh;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 12px 36px #0003}
.top.compact-header .header-options nav{display:grid;grid-template-columns:1fr 1fr;width:100%;margin:0;gap:6px;order:0;font-size:.875rem}
.top.compact-header .header-options nav a{padding:10px;border:1px solid var(--line);border-radius:10px}
.top.compact-header .header-options #language{width:100%;min-width:0;padding:10px;min-height:44px;font-size:.875rem}
.top.compact-header .header-options #installApp{width:100%;min-height:44px;padding:8px 12px;font-size:.875rem}
.top.compact-header .header-options .font-controls{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.top.compact-header .header-options .font-controls>span{display:block;width:100%;text-align:center}
.top.compact-header .header-options .font-controls button{min-width:54px;min-height:44px;font-size:.875rem}
.intro,html[data-large-text] .intro{grid-template-columns:minmax(0,1fr);gap:6px;padding:8px 0}
.intro>div:first-child>.eyebrow,.intro #announcement{display:none}
.intro h1{font-size:1rem;line-height:1.35;letter-spacing:0;margin:0;overflow-wrap:anywhere}
.intro h1 br{display:none}.intro h1 em{font:inherit;color:var(--muted);margin-left:.35em}
.search-box>label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
#searchForm{padding:4px;border-radius:14px}
#searchForm input{padding:9px 8px}
@media(max-width:680px){.top.compact-header{padding-left:12px;padding-right:12px}.intro h1,.intro h1 em{font-size:.8125rem}.compact-header .brand{font-size:1rem}.compact-header .new{margin-left:2px}}
@media(prefers-reduced-motion:reduce){.header-menu *{scroll-behavior:auto}}

/* Language stays beside the logo, with the native keyboard/touch picker. */
.top.compact-header>.brand{margin-right:0}
.header-language{position:relative;flex:none;width:84px;height:44px;margin-right:auto;display:grid;place-items:center;border-radius:12px}
.header-language>span{display:none}
.top.compact-header .header-language #language{position:absolute;inset:0;width:100%;height:100%;max-width:none;margin:0;padding:0;opacity:1;cursor:pointer;font-size:14px;text-align:center;text-align-last:center;appearance:none;-webkit-appearance:none;min-width:0;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink)}
.header-language:hover{background:var(--card)}
.header-language:focus-within{outline:3px solid var(--green);outline-offset:2px}
@media(max-width:360px){.top.compact-header{gap:3px}.compact-header .brand-wordmark{font-size:.875rem}.compact-header .brand-icon{width:24px;height:24px}.compact-header .brand-icon svg{width:24px;height:24px}}

/* Prominent sunrise/sunset cards, with readable colors in both themes. */
.brief .sun-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding-top:18px}
.sun-card{min-width:0;padding:14px 12px;border:1px solid #e5ba61;border-radius:18px;background:#fff4d7;color:#644315;font-size:.8125rem}
.sunset-card{background:#ffebe1;border-color:#e5a17e;color:#783b25}
.sun-symbol{display:block;font-size:1.5rem;line-height:1.2;margin-bottom:6px}
.brief .sun-row b{font-size:1.75rem;font-weight:700;line-height:1.3;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.brief .sun-row b.sun-no-event{font-size:.875rem}
body.dark .sun-card{background:#3a301c;border-color:#8f7437;color:#ffdc8c}
body.dark .sunset-card{background:#3c2826;border-color:#9b6253;color:#ffc2a6}

/* Prominent weather video action, shared by both themes. */
.brief #video{display:inline-flex;align-items:center;justify-content:center;align-self:center;gap:8px;max-width:100%;min-height:48px;margin:10px 0 4px;padding:12px 20px;border:2px solid #ffca83;border-radius:16px;background:linear-gradient(135deg,#ffcc80,#ffad45);color:#34200a;font-size:1rem;font-weight:750;line-height:1.4;text-align:center;white-space:normal;overflow-wrap:anywhere;box-shadow:0 5px 16px #e9852638}
.brief #video:hover:not(:disabled){background:linear-gradient(135deg,#ffd99f,#ffbd67);color:#34200a;transform:translateY(-1px);box-shadow:0 7px 20px #e9852652}
.brief #video:focus-visible{outline:3px solid var(--ink);outline-offset:4px}
.brief #video:disabled{opacity:.65;transform:none;box-shadow:none}
@media(max-width:520px){.brief #video{width:100%;margin-top:12px;padding:12px 14px}}

.top.compact-header>.brand{flex-shrink:0}
@media(max-width:400px){
 .compact-header .brand-wordmark{font-size:.8125rem}
 .compact-header .brand-icon{display:none}
 .compact-header #inboxCount{display:none}
 .top.compact-header{padding-left:8px;padding-right:8px;gap:2px}
 .compact-header #inboxToggle{min-width:36px;padding:3px}
 .compact-header #theme{padding:0}
 .header-menu>summary{width:36px}
}

/* A direct invitation to the local conversation, below the video postcard. */
.brief .community-anchor{display:flex;align-items:center;justify-content:center;gap:12px;align-self:center;max-width:100%;min-height:50px;margin:4px 0 10px;padding:12px 22px;border:1px solid #c7eaa0;border-radius:16px;background:linear-gradient(115deg,#d9ef9e,#a9e3c1,#d9ef9e);background-size:200% 100%;color:#193e30;font-size:1rem;font-weight:750;line-height:1.4;text-align:center;box-shadow:0 5px 20px #70bc8c30;animation:community-shimmer 6s ease-in-out infinite;transition:transform .2s,box-shadow .2s;overflow-wrap:anywhere}
.community-anchor-icon{font-size:1.3em;flex-shrink:0}.community-anchor-arrow{flex-shrink:0;animation:community-arrow 2.4s ease-in-out infinite}
.brief .community-anchor:hover{transform:translateY(-2px);box-shadow:0 8px 24px #70bc8c50}.brief .community-anchor:focus-visible{outline:3px solid var(--ink);outline-offset:4px}
@keyframes community-shimmer{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes community-arrow{0%,100%{transform:translateY(-2px)}50%{transform:translateY(3px)}}
@media(max-width:520px){.brief .community-anchor{width:100%;padding:12px 14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.brief .community-anchor,.community-anchor-arrow{animation:none;transition:none}.brief .community-anchor:hover{transform:none}}

/* Daily precipitation probability has its own band. */
.chart.overview-chart svg,.overview-axis{height:402px}
.overview-axis-row:nth-child(5){top:326px}
.overview-axis-colors .metric-rain{background:#2c8bc4}
.legend-rain{color:#2c8bc4}
.hour small{overflow-wrap:anywhere}


/* SEO tail content keeps the same horizontal rhythm as the main forecast. */
.seo-tail{max-width:1320px;margin:0 auto;padding:24px 48px 46px}
.seo-tail-inner{border:1px solid var(--line);border-radius:24px;background:var(--card);padding:24px;box-shadow:var(--shadow);overflow:hidden}
.seo-tail #seo-content{padding:0}.seo-tail .chips{padding-bottom:14px;white-space:normal;flex-wrap:wrap;overflow:visible}.seo-tail .section{padding:22px 0}.seo-tail .section:first-child{padding-top:0}.seo-tail .section:last-child{border-bottom:0;padding-bottom:0}.seo-tail .table-wrap{max-width:100%;overflow:auto}.seo-tail table{min-width:680px}
@media(max-width:1000px){.seo-tail{padding-left:25px;padding-right:25px}}
@media(max-width:680px){.seo-tail{padding:18px 18px 34px}.seo-tail-inner{padding:18px 14px;border-radius:18px}.seo-tail .chips{gap:7px}.seo-tail table{min-width:620px}}

/* Larger temperature band at the top of the forecast. */
.chart.overview-chart svg,.overview-axis{height:482px}
.overview-axis-row:nth-child(1){top:46px;height:150px}
.overview-axis-row:nth-child(2){top:196px}
.overview-axis-row:nth-child(3){top:266px}
.overview-axis-row:nth-child(4){top:336px}
.overview-axis-row:nth-child(5){top:406px}
.chart.temperature-chart>svg{height:310px}
/* Forecast symbols share the same vocabulary in the axis, legend and data. */
.chart .metric-icon{display:inline-block;flex:none;width:24px!important;height:24px!important;vertical-align:middle;overflow:visible;zoom:1}
.chart .overview-legend .metric-icon{width:16px!important;height:16px!important}
.overview-legend>span{display:inline-flex;align-items:center;gap:5px}
.chart.overview-chart .overview-plot>svg,.overview-axis{height:596px}
.overview-axis{flex-basis:132px;width:132px}
.overview-axis-row{display:grid;grid-template-columns:28px 1fr;grid-template-rows:auto auto auto;align-content:center;align-items:center;gap:2px 5px;padding:6px 8px}
.overview-axis-row>.metric-icon{grid-row:1 / 3;align-self:start;color:var(--green)}
.overview-axis-row strong{grid-column:2;font-size:11px}
.overview-axis-row small{grid-column:2;font-size:11px}
.overview-axis-row .axis-current{grid-column:1 / -1;font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}
.overview-axis-colors{grid-column:1 / -1}
.forecast-column{transition:fill .2s,opacity .2s}
.forecast-column.is-selected{fill:var(--green);opacity:.12}
.plot-metric{color:var(--green)}
.metric-rain{color:#2c8bc4}.metric-humidity{color:#2289ae}.metric-pressure{color:#9761b5}.metric-temperature{color:#b35418}
.metric-icon .icon-rain{opacity:var(--rain-opacity,1);animation:metric-rain 1.4s linear infinite}
.metric-icon .icon-wind{animation:metric-wind var(--metric-speed,2s) ease-in-out infinite}
.icon-rays{transform-origin:12px 12px;animation:metric-sun 16s linear infinite}
.icon-water{animation:metric-water 2.8s ease-in-out infinite}
.icon-needle{transform-origin:12px 15px;animation:metric-needle 4s ease-in-out infinite}
.metric-dot{stroke:var(--card);stroke-width:2}
.metric-trend{stroke-linecap:round}
body:has(.scene-motion[aria-pressed="false"]) .metric-icon *{animation-play-state:paused}
@keyframes metric-rain{0%{transform:translateY(-1px)}75%{transform:translateY(2px)}100%{transform:translateY(-1px)}}
@keyframes metric-wind{0%,100%{transform:translateX(-1px)}50%{transform:translateX(2px)}}
@keyframes metric-sun{to{transform:rotate(360deg)}}
@keyframes metric-water{50%{transform:translateY(-2px)}}
@keyframes metric-needle{50%{transform:rotate(8deg)}}
@media(max-width:680px){.overview-axis{flex-basis:112px;width:112px}.overview-axis-row{padding:4px 5px;column-gap:3px}.overview-axis-row strong{font-size:10px}.overview-axis-row .axis-current{font-size:11px}}
@media(prefers-reduced-motion:reduce){.metric-icon *{animation:none!important}.forecast-column{transition:none}}
/* Explicit band geometry also works with a CSP that disallows inline styles. */
.overview-axis-row:nth-child(1){top:46px;height:190px}
.overview-axis-row:nth-child(2){top:236px;height:90px}
.overview-axis-row:nth-child(3){top:326px;height:90px}
.overview-axis-row:nth-child(4){top:416px;height:90px}
.overview-axis-row:nth-child(5){top:506px;height:90px}
.metric-icon.level-zero{--rain-opacity:0;--metric-speed:3s}
.metric-icon.level-low{--rain-opacity:.35;--metric-speed:2.6s}
.metric-icon.level-medium{--rain-opacity:.65;--metric-speed:1.5s}
.metric-icon.level-high{--rain-opacity:1;--metric-speed:.7s}
.metric-icon.level-zero .icon-wind{animation:none}

/* Compact bands, with CSS geometry matching the SVG under the public CSP. */
.chart.overview-chart .overview-plot>svg,.overview-axis{height:484px}
.chart.temperature-chart>svg{height:240px}
.overview-axis-row:nth-child(1){top:46px;height:150px}
.overview-axis-row:nth-child(2){top:196px;height:72px}
.overview-axis-row:nth-child(3){top:268px;height:72px}
.overview-axis-row:nth-child(4){top:340px;height:72px}
.overview-axis-row:nth-child(5){top:412px;height:72px}
.overview-axis-row{row-gap:0}
.chart .plot-condition{fill:var(--ink);font-family:'Apple Color Emoji','Segoe UI Emoji','Noto Color Emoji',sans-serif;font-size:18px}
.chart .metric-icon{color:inherit}
body.dark .chart{--series-high:#ffc08a;--series-low:#a9bdff;--series-rain:#83d3ff;--series-wind:#8bdfbc;--series-humidity:#8bd8f4;--series-pressure:#d8b0ed}
body.dark .chart .series-high,body.dark .chart .metric-temperature{color:var(--series-high);--series:var(--series-high)}
body.dark .chart .series-low{--series:var(--series-low)}
body.dark .chart .series-rain,body.dark .chart .metric-rain,body.dark .overview-legend .legend-rain{color:var(--series-rain);--series:var(--series-rain)}
body.dark .chart .series-wind,body.dark .chart .metric-wind{color:var(--series-wind);--series:var(--series-wind)}
body.dark .chart .series-humidity,body.dark .chart .metric-humidity{color:var(--series-humidity);--series:var(--series-humidity)}
body.dark .chart .series-pressure,body.dark .chart .metric-pressure{color:var(--series-pressure);--series:var(--series-pressure)}
body.dark .chart .metric-trend{stroke:var(--series)}
body.dark .chart .metric-dot,body.dark .chart .overview-value[class*="series-"]{fill:var(--series)}

.precipitation-chance{font-weight:600;margin:.6rem 0}.wind-direction{font-size:12px}

/* Equal compact rows; keep SVG and sticky labels aligned under CSP. */
.chart.overview-chart .overview-plot>svg,.overview-axis{height:406px}
.chart.temperature-chart>svg{height:210px}
.overview-axis-row:nth-child(1){top:46px;height:72px}
.overview-axis-row:nth-child(2){top:118px;height:72px}
.overview-axis-row:nth-child(3){top:190px;height:72px}
.overview-axis-row:nth-child(4){top:262px;height:72px}
.overview-axis-row:nth-child(5){top:334px;height:72px}
.chart .overview-missing{font-size:11px;fill:var(--muted)}
.precipitation-chance{padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink)}
.hour-wind{font-weight:600}

/* Keep current weather metrics aligned in one row. */
.hero-bottom{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;align-items:start}.hero-bottom>div{min-width:0}.hero-bottom b{overflow-wrap:anywhere}
@media(max-width:380px){.hero-bottom{gap:5px;padding:10px 8px}.hero-bottom small{font-size:0.5rem;letter-spacing:0}.hero-bottom b{font-size:0.75rem}}