/* The one stylesheet of ladepark.app (design round 1, direction "Kartentisch"):
   a working tool on the app's map grounds, white and the map's own blue-black
   #171A21 in dark. The city opens with every site as a dot; the real map
   (MapLibre, own spec) goes into the hidden .map-slot elements later. One
   grotesk with a width axis (Archivo): condensed for titles and figures,
   normal for reading. On wide screens the head of the page stays in a left
   pane while the content scrolls. Colour stays with the live status.
   Linked by the blog builder's pages and by the location pages alike. */
@font-face{font-family:"Ladepark Grotesk";src:url(/assets/fonts/archivo.woff2) format("woff2");font-weight:400 800;font-stretch:75% 100%;font-style:normal;font-display:swap}
:root{color-scheme:light dark;
  --ground:#FFFFFF;--panel:#F2F2F7;--ink:#0B0F14;--muted:#5F6673;--line:rgba(11,15,20,.13);--grid:rgba(11,15,20,.055);
  --dot:#6E747E;--dot-hp:#0B0F14;--nb:#5F6673;--on-nb:#FFFFFF;--bar:#0B0F14;--bar-other:#7D828C;
  --face:"Ladepark Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif}
@media (prefers-color-scheme:dark){:root{
  --ground:#171A21;--panel:#0B0F14;--ink:#ECEEF2;--muted:#A0A6B1;--line:rgba(236,238,242,.14);--grid:rgba(236,238,242,.06);
  --dot:#8E95A1;--dot-hp:#ECEEF2;--nb:#A0A6B1;--on-nb:#0B0F14;--bar:#ECEEF2;--bar-other:#858A94}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:64px}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--ground);color:var(--ink);font:400 1rem/1.55 var(--face);overflow-wrap:break-word;font-variant-numeric:tabular-nums}
.skip{position:absolute;left:-999px}
.skip:focus{left:16px;top:16px;background:var(--ground);padding:4px 8px;z-index:3}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-radius:3px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Frame: a toolbar that stays at the top */
header{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:10px 16px;background:var(--ground);border-bottom:1px solid var(--line);font-size:.9375rem}
header a{text-decoration:none}
header a:not(.brand):hover{text-decoration:underline}
.brand{display:inline-flex;align-items:center;gap:8px;font:750 1.125rem/1 var(--face);font-stretch:85%}
.mark{width:26px;height:26px;flex:none}
main,footer{max-width:46rem;margin:0 auto;padding:0 16px}
footer{font-size:.8125rem;color:var(--muted);padding-top:20px;padding-bottom:40px;border-top:1px solid var(--line);margin-top:40px}
footer ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px 20px}

/* Type */
h1{font:780 clamp(2rem,1.55rem + 2.2vw,2.875rem)/1.02 var(--face);font-stretch:76%;letter-spacing:-.005em;margin:10px 0 8px;text-wrap:balance}
h2{font:720 1.1875rem/1.25 var(--face);font-stretch:82%;margin:0 0 8px}
p{margin:0 0 10px}
.meta{color:var(--muted);font-size:.8125rem;line-height:1.45}
.live:empty{display:none}
nav.crumbs ol{list-style:none;padding:0;margin:14px 0 0;font-size:.8125rem;color:var(--muted)}
nav.crumbs li{display:inline}
nav.crumbs li+li::before{content:" / "}
.lede>p:not(.meta,.cta){color:var(--muted);font-size:.9375rem}
.lede>p:not(.meta,.cta) a{color:var(--ink)}
.kind-article .lede>.meta:first-child{margin:18px 0 0}

/* Sections: rows on the ground, divided like a tool's panels */
main>section{border-top:1px solid var(--line);padding-top:18px;margin-top:26px}
main>h2{border-top:1px solid var(--line);padding-top:18px;margin-top:30px}

/* Maps: grid paper, sites as dots, fast chargers larger as in the app */
.map{margin:14px 0;border:1px solid var(--line);border-radius:12px;overflow:hidden;
  background-color:var(--ground);background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:20px 20px}
.map svg{display:block;width:100%;height:auto}
.map path{fill:none;stroke-linecap:round}
.map .dots{stroke:var(--dot);stroke-width:3px}
.map .dots-hp{stroke:var(--dot-hp);stroke-width:6px}

/* Figures and the inline chart */
figure{margin:18px 0;background:var(--panel);border-radius:12px;padding:14px}
figure img{width:100%;height:auto;display:block}
img{max-width:100%}
figcaption{color:var(--muted);font-size:.8125rem;margin-top:10px;display:flex;flex-wrap:wrap;gap:4px 16px;align-items:baseline}
figcaption details{flex-basis:100%;margin:4px 0}
svg.chart{width:100%;height:auto;display:block}
svg.swatch{width:auto;display:inline;vertical-align:middle;margin:0 6px 0 0}
.chart .wd{stroke:var(--ink);stroke-width:2.25;fill:none;stroke-linejoin:round}
.chart .we{stroke:var(--muted);stroke-width:1.75;fill:none;stroke-dasharray:5 3}
.chart .dot-wd{fill:var(--ink)}.chart .dot-we{fill:var(--muted)}
.chart .grid{stroke:var(--line);stroke-width:1}
.chart text{fill:var(--muted);font:500 11px var(--face)}
@media (min-width:30rem){.chart text{font-size:8.5px}}
@media (min-width:40rem){.chart text{font-size:6.5px}}
.legend{font-size:.8125rem;color:var(--muted);margin:0 0 6px}
.legend span{display:inline-block;white-space:nowrap}
.legend span+span{margin-left:16px}

details{margin:10px 0}
summary{cursor:pointer;color:var(--muted);font-size:.875rem}
table{border-collapse:collapse;font-size:.875rem;margin-top:8px;width:100%}
caption{text-align:left;color:var(--muted);font-size:.8125rem;padding-bottom:4px}
th,td{padding:6px 8px 6px 0;text-align:right;border-bottom:1px solid var(--line);vertical-align:top;hyphens:auto;overflow-wrap:anywhere}
th:first-child,td:first-child{text-align:left}
thead th{font-weight:650;font-stretch:85%}
tbody th{font-weight:400}
table.figures td{white-space:nowrap}
.scroll{overflow-x:auto;max-width:100%}
code{font-size:.75rem;word-break:break-all}
table.prose th,table.prose td{text-align:left;padding:8px 12px 8px 0}
@media (max-width:640px){table.prose thead{display:none}table.prose tr{display:block;padding:10px 0;border-bottom:1px solid var(--line)}table.prose td{display:block;padding:2px 0;border:0}table.prose td:first-child{font-weight:600}}

/* Lists of places: dense rows; the bullet is the map's dot */
ul.sites{list-style:none;padding:0;margin:4px 0 0}
ul.sites li{position:relative;padding:8px 0 8px 22px;border-bottom:1px solid var(--line);line-height:1.35}
ul.sites li::before{content:"";position:absolute;left:3px;top:15px;width:7px;height:7px;border-radius:50%;background:var(--dot)}
ul.sites li.hp::before{left:1px;top:13px;width:11px;height:11px;background:var(--dot-hp)}
ul.sites li>a{font-weight:600}
ul.sites .meta{display:block;margin-top:1px}
[aria-labelledby=h-nearby] ul.sites{counter-reset:nb}
[aria-labelledby=h-nearby] ul.sites li{counter-increment:nb;padding-left:34px}
[aria-labelledby=h-nearby] ul.sites li::before,[aria-labelledby=h-nearby] ul.sites li.hp::before{content:counter(nb);left:0;top:9px;width:24px;height:24px;background:var(--nb);color:var(--on-nb);font:700 13px/24px var(--face);text-align:center}
ul.sources{padding-left:18px;font-size:.8125rem;color:var(--muted)}
ul.sources li{margin-bottom:6px}
nav.pages ul{list-style:none;padding:0;margin:16px 0 0;display:flex;flex-wrap:wrap;border:1px solid var(--line);border-radius:10px;overflow:hidden;width:fit-content;max-width:100%}
nav.pages li{border-right:1px solid var(--line)}
nav.pages li:last-child{border-right:0}
nav.pages a{display:block;padding:6px 12px;text-decoration:none;font-weight:600}
nav.pages a[aria-current]{background:var(--ink);color:var(--ground)}
ul.list{list-style:none;padding:0;margin:20px 0 0;border-top:1px solid var(--line)}
ul.list li{display:grid;gap:2px;padding:12px 0;border-bottom:1px solid var(--line)}
ul.list a{font:700 1.125rem/1.3 var(--face);font-stretch:85%;text-decoration:none}
ul.list a:hover{text-decoration:underline}
ul.list time{grid-row:1}
.method{border-top:1px solid var(--line);margin-top:28px;padding-top:10px}
.app{margin-top:32px;padding:14px 16px;background:var(--panel);border-radius:12px}

/* City: four figures as a compact strip, the jump links as a segmented control */
dl.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:12px 0 6px;border:1px solid var(--line);border-radius:12px;overflow:hidden}
dl.tiles div{padding:8px 10px;border-left:1px solid var(--line)}
dl.tiles div:first-child{border-left:0}
dl.tiles dt{font-size:.75rem;color:var(--muted);line-height:1.25;font-stretch:85%}
dl.tiles dd{margin:2px 0 0;font:760 clamp(1.25rem,1rem + 1.2vw,1.625rem)/1.1 var(--face);font-stretch:78%}
nav.jump ul{list-style:none;padding:0;margin:14px 0 0;display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:10px;overflow:hidden}
nav.jump li{border-top:1px solid var(--line);border-left:1px solid var(--line);margin:-1px 0 0 -1px}
nav.jump a{display:block;padding:8px 10px;text-decoration:none;font-size:.875rem;font-weight:600;line-height:1.25;height:100%}
nav.jump a:hover{background:var(--panel)}
ul.bars{list-style:none;padding:0;margin:12px 0}
ul.bars li{display:grid;grid-template-columns:1fr auto;column-gap:8px;margin:0 0 9px;font-size:.875rem}
ul.bars .val{font-weight:650}
ul.bars .track{grid-column:1/-1;height:8px;margin-top:3px;background:var(--panel);border-radius:2px}
ul.bars .fill{display:block;height:100%;min-width:2px;border-radius:2px;background:var(--bar)}
ul.bars .fill.other{background:var(--bar-other)}

/* Home: name, claim and the action on the left, the numbers on the right */
.kind-home .lede h1{font-size:clamp(2.75rem,2rem + 3.6vw,4rem);margin-top:22px}
.claim{font-size:1.125rem;line-height:1.45;color:var(--ink);max-width:34ch}
.kind-home .lede>p.claim{color:var(--ink);font-size:1.125rem}
.cta{margin:18px 0}
.button{display:inline-block;padding:12px 18px;border-radius:10px;background:var(--ink);color:var(--ground);font:650 1rem/1.2 var(--face);text-decoration:none}
.button:hover{text-decoration:underline}
.coverage td{font-weight:650;font-size:.9375rem}
.stories ul.list{margin-top:8px}
.data{color:var(--muted);margin-top:24px}
.data a{color:var(--ink)}

/* Wide screens: the head of the page stays in a left pane */
@media (min-width:64rem){
  header{padding:12px 32px}
  main{max-width:80rem;padding:0 32px;display:grid;grid-template-columns:minmax(0,25rem) minmax(0,46rem);column-gap:56px;justify-content:center;align-items:start}
  main>*{grid-column:2}
  main>nav.crumbs{grid-column:1/-1}
  main>.lede{grid-column:1;grid-row:1/span 80;position:sticky;top:76px;padding-bottom:24px}
  .kind-location main>.lede,.kind-city main>.lede,.kind-country main>.lede,.kind-root main>.lede{grid-row:2/span 80}
  main>.lede>h1{margin-top:20px}
  main>.lede+*{margin-top:22px}
  main>section:first-of-type{border-top:0;padding-top:0}
  .kind-article main>.lede+*,.kind-page main>h1+*{margin-top:36px}
  .kind-page main>h1,.kind-legal main>h1,.kind-notfound main>h1{grid-column:1;grid-row:1/span 80;position:sticky;top:76px;margin-top:28px}
  .kind-legal main>h1+*,.kind-notfound main>h1+*{margin-top:30px}
  .kind-home main>.lede{grid-row:1/span 80;top:64px}
  .kind-home main>.lede+*{margin-top:40px}
  .kind-index main>h1{grid-column:1;grid-row:1;margin-top:28px}
  .kind-index main>ul.list{grid-row:1;margin-top:36px}
  ul.list li{grid-template-columns:9rem 1fr;column-gap:16px}
  ul.list time{grid-row:auto;grid-column:1;padding-top:3px}
  ul.list a{grid-column:2;grid-row:1}
  footer{max-width:calc(25rem + 46rem + 56px + 64px);padding-left:32px;padding-right:32px}
}