/* Climate Almanac — shared styles for the per-place pages. */
:root{--paper:#F3EBDD;--ink:#22302A;--ink2:#4A564E;--rule:#C8BA9E;--link:#245a7c;--panel:#fff8ec}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);
 font-family:Georgia,"Times New Roman",serif;line-height:1.55}
.wrap{max-width:820px;margin:0 auto;padding:28px 20px 80px}
a{color:var(--link)}
a:focus-visible{outline:2px solid var(--link);outline-offset:3px;border-radius:2px}
.crumb{font-family:ui-monospace,Menlo,monospace;font-size:.75rem;letter-spacing:.08em;
 text-transform:uppercase;color:var(--ink2);margin-bottom:20px}
.crumb span{opacity:.5;margin:0 4px}
h1{font-size:2.1rem;line-height:1.15;margin:0 0 .3em;text-wrap:balance}
h2{font-size:1.25rem;margin:0 0 .5em}
section{margin-top:34px}
.lede{font-size:1.12rem;max-width:62ch;margin:0 0 .6em}
.note{color:var(--ink2);font-style:italic;margin:0 0 4px;max-width:62ch}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
 gap:1px;background:var(--rule);border:1px solid var(--rule);margin:26px 0 0}
.facts>div{background:var(--panel);padding:11px 13px}
.facts dt{font-family:ui-monospace,Menlo,monospace;font-size:.66rem;letter-spacing:.12em;
 text-transform:uppercase;color:var(--ink2)}
.facts dd{margin:2px 0 0;font-size:1rem;font-weight:600}
.scroll{overflow-x:auto;border:1px solid var(--rule)}
table{border-collapse:collapse;width:100%;background:var(--panel);font-size:.9rem}
caption{text-align:left;font-size:.78rem;color:var(--ink2);padding:8px 9px;
 font-family:ui-monospace,Menlo,monospace;letter-spacing:.06em;text-transform:uppercase}
th,td{padding:6px 9px;border-bottom:1px solid #eadfc7;text-align:left}
thead th{background:var(--ink);color:var(--paper);font-weight:600;white-space:nowrap;
 font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}
tbody th{font-weight:600}
td.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
td.v{font-family:ui-monospace,Menlo,monospace;font-size:.72rem;letter-spacing:.07em;
 text-transform:uppercase;white-space:nowrap}
tr.best th{position:relative}
tr.best th::before{content:"\2713";color:#2f5d24;font-weight:700;margin-right:6px}
tr:last-child td,tr:last-child th{border-bottom:0}
.key{font-size:.82rem;color:var(--ink2);margin:10px 0 0;max-width:64ch}
ul.related{list-style:none;padding:0;margin:0;display:grid;
 grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px 20px}
ul.related li{border-bottom:1px solid var(--rule);padding-bottom:7px}
ul.related .why{display:block;font-size:.76rem;color:var(--ink2);
 font-family:ui-monospace,Menlo,monospace;letter-spacing:.04em}
ul.index{list-style:none;padding:0;margin:0;column-width:250px;column-gap:26px}
ul.index li{break-inside:avoid;padding:5px 0;border-bottom:1px solid var(--rule)}
ul.index .when{display:block;font-size:.74rem;color:var(--ink2);
 font-family:ui-monospace,Menlo,monospace;letter-spacing:.04em}
h2 .count{font-family:ui-monospace,Menlo,monospace;font-size:.7rem;color:var(--ink2);
 letter-spacing:.1em;vertical-align:middle;margin-left:6px}
footer{margin-top:44px;padding-top:16px;border-top:1px solid var(--rule);
 font-size:.85rem;color:var(--ink2)}
footer p{max-width:70ch}
footer .links{font-family:ui-monospace,Menlo,monospace;font-size:.76rem;letter-spacing:.05em}
@media(max-width:520px){h1{font-size:1.7rem}.wrap{padding:20px 16px 60px}}