/* SolarAtlas24 – editorial atlas look: warm paper, ink, sun-orange accent. No web fonts. */
:root{
  --paper:#f4efe4;--sheet:#fbf8f1;--ink:#1f1b16;--ink-2:#5a5248;--rule:#d9cfbd;--rule-2:#e9e1d1;
  --sun:#d9541e;--sun-2:#f0a03c;--sun-soft:#fbe3c6;--sky:#2f5d8a;--sky-soft:#dce7f1;
  --pos:#2f7d4f;--neg:#b23a2a;--link:#a8401a;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --paper:#11151d;--sheet:#171c26;--ink:#ece6da;--ink-2:#a69f93;--rule:#2c3340;--rule-2:#222834;
  --sun:#f07a3e;--sun-2:#f5b45a;--sun-soft:#3a2516;--sky:#7fa7d1;--sky-soft:#1d2a3a;
  --pos:#6cc391;--neg:#f08a7a;--link:#f5a36f;
}}
:root[data-theme="dark"]{
  --paper:#11151d;--sheet:#171c26;--ink:#ece6da;--ink-2:#a69f93;--rule:#2c3340;--rule-2:#222834;
  --sun:#f07a3e;--sun-2:#f5b45a;--sun-soft:#3a2516;--sky:#7fa7d1;--sky-soft:#1d2a3a;
  --pos:#6cc391;--neg:#f08a7a;--link:#f5a36f;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.6 var(--sans);font-variant-numeric:tabular-nums}
a{color:var(--link);text-decoration-thickness:1px;text-underline-offset:2px}
a:hover{text-decoration-thickness:2px}
.wrap{max-width:1100px;margin:0 auto;padding:0 16px}
.skip{position:absolute;left:-999px}.skip:focus{left:16px;top:8px;background:var(--sheet);padding:6px 10px;z-index:9}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.15;letter-spacing:-.005em}
h1{font-size:clamp(2rem,5.4vw,3.3rem);margin:.15em 0 .35em}
h2{font-size:clamp(1.35rem,3vw,1.75rem);margin:2.2em 0 .6em;padding-top:.7em;border-top:1px solid var(--rule)}
h3{font-size:1.15rem;margin:1.6em 0 .5em}
h2 a{color:inherit;text-decoration:none}
p{margin:.6em 0}
small{color:var(--ink-2)}
.kicker{font:600 .74rem/1.3 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--sun);margin:0}
.note{font-size:.86rem;color:var(--ink-2)}

/* masthead */
.masthead{border-bottom:3px double var(--rule);background:var(--paper)}
.masthead .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:62px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:.5em;color:var(--ink);text-decoration:none;font:600 1.45rem/1 var(--serif)}
.brand svg{width:30px;height:30px}
.brand circle{fill:var(--sun)}
.brand path{stroke:var(--sun-2);stroke-width:2.4;stroke-linecap:round;fill:none}
.topnav{display:flex;gap:2px;flex-wrap:wrap;margin:0 -8px}
.topnav a{color:var(--ink);text-decoration:none;font-size:.93rem;padding:6px 8px;border-bottom:2px solid transparent}
.topnav a:hover{border-color:var(--rule)}
.topnav a[aria-current]{border-color:var(--sun)}

.crumbs{font-size:.84rem;color:var(--ink-2);margin:18px 0 0}
.crumbs a{color:var(--ink-2)}

/* heads */
.pagehead{margin:22px 0 18px;max-width:820px}
.answer{font:1.14rem/1.6 var(--serif);margin:.2em 0 .6em}
.answer b{background:linear-gradient(transparent 62%,var(--sun-soft) 62%)}
.hero{margin:36px 0 26px;max-width:820px}
.hero h1{font-size:clamp(2.3rem,7vw,4.2rem)}
.lede{font:1.2rem/1.55 var(--serif);color:var(--ink-2);max-width:700px}

/* search */
.search{position:relative;display:flex;gap:8px;margin-top:22px;max-width:620px;flex-wrap:wrap}
.search input{flex:1 1 260px;min-width:0;font:inherit;font-size:1.08rem;padding:13px 14px;border:1.5px solid var(--ink);border-radius:0;background:var(--sheet);color:var(--ink)}
.search input:focus{outline:3px solid var(--sun-soft);border-color:var(--sun)}
.search button{font:inherit;font-size:.95rem;padding:0 16px;min-height:50px;border:1.5px solid var(--ink);background:var(--ink);color:var(--paper);cursor:pointer}
.search button:disabled{opacity:.6}
#results{position:absolute;top:100%;left:0;right:0;margin:4px 0 0;padding:0;list-style:none;background:var(--sheet);border:1px solid var(--rule);z-index:5;box-shadow:0 10px 30px rgba(0,0,0,.12)}
#results:empty{display:none}
#results a{display:flex;justify-content:space-between;gap:12px;padding:10px 14px;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--rule-2)}
#results a:hover,#results a.sel{background:var(--sun-soft)}

/* layout */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,330px);gap:28px;align-items:start;margin:10px 0}
.split.wide{grid-template-columns:minmax(0,1fr) minmax(0,360px)}
@media (max-width:820px){.split,.split.wide{grid-template-columns:minmax(0,1fr)}}

/* fact sheet */
.facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:0;margin:0;border-top:2px solid var(--ink)}
.facts div{padding:12px 12px 12px 0;border-bottom:1px solid var(--rule)}
.facts dt{font:600 .72rem/1.3 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}
.facts dd{margin:4px 0 0}
.facts dd b{display:block;font:600 1.9rem/1.1 var(--serif)}
.facts dd small{display:block;font-size:.82rem}

/* maps */
.map{margin:0}
.mapbox{position:relative;line-height:0}
.mapbox img{width:100%;height:auto;display:block}
.map.big .mapbox{max-width:620px}
.pin{position:absolute;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:var(--ink);border:2px solid var(--sheet);line-height:1}
.pin.me{width:16px;height:16px;margin:-8px 0 0 -8px;background:var(--sun);box-shadow:0 0 0 4px rgba(217,84,30,.25)}
.pin span{position:absolute;left:12px;top:-6px;white-space:nowrap;font:600 .74rem/1.2 var(--sans);color:var(--ink);background:rgba(251,248,241,.85);padding:1px 4px;text-decoration:none}
:root[data-theme="dark"] .pin span{background:rgba(23,28,38,.85)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .pin span{background:rgba(23,28,38,.85)}}
.pin:not(.lbl):not(.me){width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-width:1px}
.pin.lbl{z-index:2}
.pin:not(.lbl):hover{transform:scale(1.5)}
.map figcaption{font-size:.84rem;color:var(--ink-2);margin-top:8px;line-height:1.45}
.legend{display:flex;align-items:center;gap:8px;font-size:.8rem;color:var(--ink-2);margin-top:8px;max-width:360px}
.legend i{flex:1;height:10px}
.legend.sun i{background:linear-gradient(90deg,#2b3a67,#3f5e8c,#5f8fa3,#9dbb9a,#e8d27c,#f2a541,#e0612c,#b8312f)}
.legend.temp i{background:linear-gradient(90deg,#313695,#74add1,#fee090,#f46d43,#a50026)}
.legend.hot i{background:linear-gradient(90deg,#fff5eb,#fdd0a2,#fd8d3c,#d94801,#8c2d04)}
.legend.frost i{background:linear-gradient(90deg,#f7fbff,#c6dbef,#6baed6,#2171b5,#08306b)}
.legend.dev i{background:linear-gradient(90deg,#2c4a7a,#5b82b4,#a9c3dc,#f1ece1,#f3c37a,#e48a3c,#b9481f)}
.mapgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:0 28px}

/* side column on home */
.keyfig{border-top:2px solid var(--ink);border-bottom:1px solid var(--rule);padding:14px 0}
.keyfig p{margin:0;color:var(--ink-2)}
.keyfig b{display:block;font:600 3rem/1.1 var(--serif);color:var(--sun);margin:4px 0}
.side h2{margin-top:1.2em}
.bars-list{list-style:none;margin:0;padding:0}
.bars-list li{display:grid;grid-template-columns:minmax(0,1fr) 90px 44px;gap:8px;align-items:center;padding:5px 0;border-bottom:1px solid var(--rule-2);font-size:.92rem}
.bars-list b{text-align:right;font-weight:600}
.meter{display:inline-block;width:70px;height:6px;background:var(--rule-2);vertical-align:middle;margin-right:8px}
.meter i{display:block;height:100%;background:var(--sun)}
.bars-list .meter{width:100%;margin:0}

.latest{margin:30px 0;padding:18px 20px;background:var(--sheet);border-left:4px solid var(--sun)}
.latest h2{border:0;padding:0;margin:.2em 0}

/* tiles and cards */
.tiles{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:0 24px}
.tiles li{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--rule)}
.tiles b{font-family:var(--serif)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;margin:30px 0}
.card{display:block;padding:16px;background:var(--sheet);border:1px solid var(--rule);color:var(--ink);text-decoration:none}
.card:hover{border-color:var(--sun)}
.card b{display:block;font:600 1.15rem/1.25 var(--serif);margin-bottom:4px}
.card span{font-size:.88rem;color:var(--ink-2)}

/* tables */
.tablewrap{overflow-x:auto;margin:10px 0;-webkit-overflow-scrolling:touch}
table.data{border-collapse:collapse;width:100%;font-size:.94rem}
table.data th{font:600 .72rem/1.3 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);text-align:left;padding:8px 10px 8px 0;border-bottom:2px solid var(--ink);vertical-align:bottom}
table.data td{padding:8px 10px 8px 0;border-bottom:1px solid var(--rule-2)}
table.data .n{text-align:right;white-space:nowrap}
table.data td small{font-size:.8em}
table.data tbody tr:hover{background:var(--sheet)}
td.pos{color:var(--pos)}td.neg{color:var(--neg)}

/* charts */
.chart{width:100%;height:auto;display:block;margin:8px 0;overflow:visible}
.chart .b{fill:var(--sun-2)}
.chart .b:hover{fill:var(--sun)}
.chart .o{fill:var(--sky);stroke:var(--sheet);stroke-width:2}
.chart text{font:12px var(--sans);fill:var(--ink-2);text-anchor:middle}
.chart text.v{font-size:11px;fill:var(--ink)}
.chart text.v.in{fill:#3a2412;font-weight:600}
.chart .grid{stroke:var(--rule-2);stroke-width:1}
.chart text.ax.t{text-anchor:end}.chart text.ax.r{text-anchor:start}
.climate .sun{fill:var(--sun-soft);stroke:var(--sun-2);stroke-width:.6}
.climate .prec{fill:var(--sky-soft);stroke:var(--sky);stroke-width:.6}
.climate polyline.temp{fill:none;stroke:var(--sun);stroke-width:2.5}
.climate circle.temp{fill:var(--sun);stroke:var(--sheet);stroke-width:1.5}
.mini rect{fill:var(--sun)}
.pair .pa{fill:var(--sky)}.pair .pb{fill:var(--sun-2)}
.k.pa{background:var(--sky)}.k.pb{background:var(--sun-2)}
.mini text{text-anchor:start}
.chartkey{font-size:.84rem;color:var(--ink-2);display:flex;flex-wrap:wrap;gap:4px 16px;margin:0}
.chartkey .k{display:inline-block;width:12px;height:12px;margin-right:6px;vertical-align:-1px}
.k.b{background:var(--sun-2)}.k.o{background:var(--sky);border-radius:50%}
.k.t{background:var(--sun);height:3px;vertical-align:3px}.k.s{background:var(--sun-soft);border:1px solid var(--sun-2)}.k.p{background:var(--sky-soft);border:1px solid var(--sky)}
.stripes{width:100%;height:90px;display:block;margin:12px 0 2px}
.stripeaxis{display:flex;justify-content:space-between;font-size:.8rem;color:var(--ink-2);margin-bottom:12px}

/* calculator */
.calc{margin:18px 0;padding:16px 18px;background:var(--sheet);border:1px solid var(--rule);display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px 18px}
.calc h3{grid-column:1/-1;margin:0}
.calc label{display:flex;flex-direction:column;font-size:.84rem;color:var(--ink-2);gap:4px}
.calc label span{display:flex;align-items:center;gap:6px;color:var(--ink)}
.calc input{font:inherit;width:100%;max-width:120px;padding:7px 8px;border:1px solid var(--rule);background:var(--paper);color:var(--ink)}
.calc output{grid-column:1/-1;font:1.1rem/1.5 var(--serif)}
.calc output:empty{display:none}

/* lists */
.near{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:0 24px}
.near li{display:flex;flex-wrap:wrap;gap:2px 10px;padding:8px 0;border-bottom:1px solid var(--rule-2);align-items:baseline}
.near li a{flex:1 1 auto;min-width:0}
.near span{font-family:var(--serif);white-space:nowrap}
.near small{min-width:46px;text-align:right;white-space:nowrap}
.cols{columns:3 220px;column-gap:24px;padding-left:1.1em}
.cols li{break-inside:avoid;margin:2px 0}
.places{list-style:none;padding:0}
.places small{margin-left:6px}
.az{display:flex;flex-wrap:wrap;gap:4px;margin:12px 0}
.az a{display:inline-block;min-width:34px;text-align:center;padding:6px;border:1px solid var(--rule);text-decoration:none;color:var(--ink)}
.az a:hover{border-color:var(--sun)}
.pager{display:flex;justify-content:space-between;gap:12px;margin:14px 0;font-size:.95rem}
.downloads li{margin:8px 0}

/* faq, cite */
.faq details{border-bottom:1px solid var(--rule);padding:12px 0}
.faq summary{cursor:pointer;font:600 1.05rem/1.4 var(--serif);list-style-position:outside}
.faq details p{margin:.6em 0 0}
.cite blockquote{margin:10px 0;padding:12px 16px;background:var(--sheet);border-left:3px solid var(--ink);font:.95rem/1.5 var(--serif)}

/* ads */
.ad{margin:26px 0;min-height:100px;text-align:center}
.ad.placeholder{display:flex;align-items:center;justify-content:center;border:1px dashed var(--rule);color:var(--ink-2)}
.adlabel{display:block;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2)}

/* footer */
.colophon{margin-top:60px;border-top:3px double var(--rule);padding:26px 0 40px;font-size:.88rem;color:var(--ink-2)}
.colophon .cols{columns:auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;padding:0}
.colophon b{color:var(--ink);font-family:var(--serif);font-size:1.02rem}
.colophon a{color:var(--ink-2)}
.fine{margin-top:18px;font-size:.8rem}

@media (max-width:560px){
  body{font-size:16px}
  .facts dd b{font-size:1.6rem}
  .chart text.v{display:none}
  .meter{display:none}
  .topnav{flex-wrap:nowrap;overflow-x:auto;width:calc(100% + 16px);-webkit-overflow-scrolling:touch}
  .topnav a{white-space:nowrap}
  .pin span{font-size:.66rem}
}
