:root{
  --ink:#0e2530; --ink-2:#31505e; --muted:#6a8290;
  --paper:#eef2f0; --card:#fff; --line:#d2ded9;
  --north:#1f6f9c; --north-soft:#e7f0f6;
  --south:#2f7f5f; --south-soft:#e6f2ec;
  --signal:#c07722;
  --accent:var(--north); --accent-soft:var(--north-soft);
  --display:"Bricolage Grotesque",Georgia,serif;
  --body:"Public Sans",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;
}
body.v-south{--accent:var(--south);--accent-soft:var(--south-soft)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);
     font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
.wrap{max-width:1000px;margin:0 auto;padding:0 20px}

.masthead{padding:44px 0 20px;border-bottom:1px solid var(--line)}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;
         color:var(--muted);margin:0 0 12px}
h1{font-family:var(--display);font-weight:800;font-size:clamp(30px,6vw,52px);line-height:1.04;
   letter-spacing:-.02em;margin:0 0 14px}
h1 .hl{color:var(--accent);transition:color .35s ease}
.lede{font-size:clamp(16px,2.2vw,19px);color:var(--ink-2);max-width:62ch;margin:0}

.switcher{position:sticky;top:0;z-index:30;background:rgba(238,242,240,.94);
          backdrop-filter:blur(8px);border-bottom:1px solid var(--line);padding:12px 0}
.seg{display:flex;gap:6px;background:var(--card);border:1px solid var(--line);
     border-radius:999px;padding:5px;max-width:520px}
.seg button{flex:1;border:0;background:transparent;cursor:pointer;font-family:var(--body);
     font-size:14px;font-weight:600;color:var(--ink-2);padding:10px 12px;border-radius:999px;
     transition:background .25s,color .25s;line-height:1.2}
.seg button .km{display:block;font-family:var(--mono);font-size:11px;font-weight:400;
     opacity:.72;margin-top:3px}
.seg button[aria-selected="true"]{background:var(--accent);color:#fff}
.seg button:focus-visible{outline:3px solid var(--signal);outline-offset:2px}

.gauge{margin:26px 0 8px;padding:20px;background:var(--card);border:1px solid var(--line);
       border-radius:14px}
.gauge h2{font-family:var(--display);font-size:15px;font-weight:600;margin:0 0 16px;border:0;padding:0}
.bar{display:grid;grid-template-columns:88px 1fr;gap:12px;align-items:center;margin-bottom:12px}
.bar .lbl{font-family:var(--mono);font-size:12px;color:var(--muted)}
.bar .track{background:var(--paper);border-radius:6px;height:30px;overflow:hidden}
.bar .fill{height:100%;border-radius:6px;display:flex;align-items:center;justify-content:flex-end;
     padding-right:10px;color:#fff;font-family:var(--mono);font-size:12px;font-weight:600;
     transition:width .6s cubic-bezier(.4,0,.2,1),opacity .3s}
.bar.n .fill{background:var(--north);width:100%}
.bar.s .fill{background:var(--south);width:63%}
body.v-north .bar.s .fill,body.v-south .bar.n .fill{opacity:.34}
.gauge p{margin:10px 0 0;font-size:13.5px;color:var(--ink-2)}

.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:1px;
       background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden;
       margin:22px 0 26px}
.facts div{background:var(--card);padding:16px 14px}
.facts dt{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
          color:var(--muted);margin:0 0 6px}
.facts dd{margin:0;font-family:var(--display);font-size:24px;font-weight:600;color:var(--accent);
          transition:color .35s}

.mapcard{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px;
         margin:0 0 34px;overflow:hidden}
.mapcard svg{display:block;width:100%;height:auto}

h2{font-family:var(--display);font-weight:600;font-size:clamp(20px,3.4vw,27px);
   letter-spacing:-.01em;margin:44px 0 14px;padding-bottom:8px;border-bottom:2px solid var(--accent);
   transition:border-color .35s}
h3{font-family:var(--display);font-size:18px;font-weight:600;margin:0;color:var(--ink)}
p{margin:0 0 14px}
strong{color:var(--ink)}

.toc{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:8px;
     margin:28px 0}
.toc ol{list-style:none;margin:0;padding:0;display:grid;
        grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:2px;counter-reset:t}
.toc li{counter-increment:t}
.toc a{display:block;padding:11px 13px;border-radius:9px;text-decoration:none;color:var(--ink);
       font-weight:600;font-size:14.5px;transition:background .2s}
.toc a::before{content:counter(t);font-family:var(--mono);font-size:11px;color:var(--accent);
       display:inline-block;min-width:20px}
.toc a em{display:block;font-style:normal;font-family:var(--mono);font-size:11px;
       color:var(--muted);font-weight:400;margin-left:20px;margin-top:2px}
.toc a:hover{background:var(--accent-soft)}

.leg{margin:0 0 12px;scroll-margin-top:90px}
.leg-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:44px 0 16px;
          padding-bottom:8px;border-bottom:2px solid var(--accent);transition:border-color .35s}
.leg-head h2{margin:0;border:0;padding:0}
.leg-head .meta{font-family:var(--mono);font-size:12px;color:var(--muted);
          background:var(--accent-soft);padding:3px 9px;border-radius:999px;transition:background .35s}

.pois{display:grid;gap:16px}
@media(min-width:760px){.pois{grid-template-columns:repeat(2,1fr)}
  .poi:has(.shot){grid-column:1/-1}}
.poi{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px 18px 14px;
     scroll-margin-top:90px}
.poi-head{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.tag{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;
     color:var(--muted);border:1px solid var(--line);padding:2px 8px;border-radius:999px}
.poi p{font-size:15.2px;color:var(--ink-2);margin:0 0 12px}
.prakt{font-size:13.5px !important;color:var(--ink) !important;background:var(--accent-soft);
       border-radius:9px;padding:10px 12px;margin:0 !important;transition:background .35s}
.prakt span{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;
       text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.shot{margin:0 0 14px}
.shot img{width:100%;height:clamp(200px,32vw,380px);object-fit:cover;border-radius:10px;
       background:var(--paper);display:block}
.shot figcaption{font-family:var(--mono);font-size:10.5px;color:var(--muted);margin-top:6px}
.shot.missing{display:none}

.shared h2{margin-top:52px}
.tw{overflow-x:auto;margin:0 0 22px;-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;min-width:480px;font-size:14.5px;background:var(--card)}
th{background:var(--accent-soft);text-align:left;padding:10px 12px;border-bottom:2px solid var(--line);
   font-weight:600;transition:background .35s}
td{padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:top}
tbody tr:last-child td{border-bottom:0}
.kms td:nth-child(n+2){font-family:var(--mono);font-size:13px}
.shared ul,.kms ul{margin:0 0 18px;padding-left:0;list-style:none}
.shared li,.kms li{position:relative;padding-left:20px;margin-bottom:7px}
.shared li::before,.kms li::before{content:"";position:absolute;left:2px;top:.62em;width:7px;
   height:7px;border-radius:50%;background:var(--accent);transition:background .35s}
.shared li em{color:var(--muted)}
blockquote{margin:18px 0;padding:14px 18px;background:#fdf6ea;border-left:4px solid var(--signal);
   border-radius:0 8px 8px 0}
blockquote p{margin:0;font-size:15px;color:#6d4d21}
hr{border:0;border-top:1px solid var(--line);margin:38px 0}
h3+ul{margin-top:8px}
.shared h3{font-family:var(--display);font-size:17px;margin:24px 0 8px;color:var(--ink-2)}

footer{margin:60px 0 40px;padding-top:22px;border-top:1px solid var(--line);font-size:13px;
   color:var(--muted)}
footer code{font-family:var(--mono);font-size:12px}

.totop{position:fixed;right:16px;bottom:16px;width:44px;height:44px;border-radius:50%;
   border:1px solid var(--line);background:var(--card);color:var(--accent);font-size:18px;
   cursor:pointer;opacity:0;pointer-events:none;transition:opacity .3s;z-index:40}
.totop.on{opacity:1;pointer-events:auto}
.totop:focus-visible{outline:3px solid var(--signal);outline-offset:2px}

@media(max-width:620px){
  .masthead{padding:30px 0 16px}
  .seg button{font-size:13px;padding:9px 6px}
  .bar{grid-template-columns:70px 1fr}
  .poi{padding:15px}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;transition-duration:.001ms!important}
  html{scroll-behavior:auto}
}
@media print{
  .switcher,.totop,.toc{display:none}
  [hidden]{display:block!important}
  body{background:#fff}
  .poi{break-inside:avoid;border-color:#bbb}
  .shot img{height:200px}
}