/* studioniemeyer.de
   Zwei Instanzen unter einem Namen:
   – Architekturbüro (Svenja): hell, aufrecht, Work Sans Regular, ruhig.
   – Labor (Julius): Sternfeld, kursiv Work Sans Thin, Etikett LAB·05 in Kontur, Telemetrie in Mono.
   Schriften selbst gehostet (DSGVO). */

@font-face{font-family:"Work Sans";src:url("../fonts/work-sans-wght.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Work Sans";src:url("../fonts/work-sans-wght-italic.woff2") format("woff2");font-weight:100 900;font-style:italic;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url("../fonts/jetbrains-mono-wght.woff2") format("woff2");font-weight:100 800;font-style:normal;font-display:swap}

:root{
  --sans:"Work Sans","Helvetica Neue",Arial,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  /* Architekturbüro */
  --sv-bg:#fff; --sv-fg:#000; --sv-mu:#767676; --sv-ln:#e0e0e0; --sv-img:#eee;
  /* Labor */
  --jx-bg:#050608; --jx-fg:#e6e8ec; --jx-mu:#6d737d; --jx-ln:#1d2027; --jx-ac:#8a95ff; --jx-ac2:#3a48ff;
  --seam:#000;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font-family:var(--sans);font-size:15px;line-height:1.45;background:var(--jx-bg);color:var(--jx-fg);-webkit-font-smoothing:antialiased}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid var(--jx-ac);outline-offset:3px}
[hidden]{display:none!important}
.view{min-height:100%}

/* ---------- Wortmarke + Etikett ---------- */
.wm{white-space:nowrap;letter-spacing:-.02em;line-height:.95}
.wm.up{font-weight:400}
.wm.it{font-style:italic;font-weight:100}
.tag{position:relative;display:inline-flex;align-items:center;gap:.4em;font-family:var(--mono);font-style:normal;font-weight:400;font-size:.26em;letter-spacing:.14em;text-transform:uppercase;line-height:1.2;
  padding:.38em .6em;margin-left:1.15em;top:-1.6em;vertical-align:baseline;color:var(--jx-ac);box-shadow:inset 0 0 0 1px var(--jx-ac)}
.caret{display:inline-block;width:.62em;height:1.05em;background:currentColor;animation:blink 1.05s steps(1) infinite}
@keyframes blink{50%{opacity:0}}

/* Sternfeld */
.sky{position:relative;isolation:isolate;background:var(--jx-bg)}
.sky > canvas.stars{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}

/* ======================================================
   START
   ====================================================== */
.home{display:grid;grid-template-columns:1fr 1px 1fr;min-height:100svh}
.half{padding:clamp(18px,3vw,40px);display:flex;flex-direction:column;gap:16px;min-width:0;overflow:hidden;container-type:inline-size}
.spine{background:var(--seam);position:relative;z-index:2}
.spine span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-90deg);white-space:nowrap;font-family:var(--mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;background:var(--seam);color:var(--jx-fg);padding:4px 10px}

/* Architekturbüro */
.hs{background:var(--sv-bg);color:var(--sv-fg)}
.hs .top{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:var(--sv-mu)}
.hs .wm{font-size:clamp(28px,11cqi,96px);text-align:right;margin-top:clamp(36px,12cqi,130px)}
.hs .role{text-align:right;font-size:14px}
.hs .body{margin-top:auto;display:grid;gap:14px;justify-items:end;text-align:right}
.hs .body p{margin:0;max-width:36ch;color:var(--sv-mu);font-size:14px}
.hs ul{list-style:none;padding:0;margin:0;width:100%;max-width:420px}
.hs li{display:flex;justify-content:space-between;gap:12px;border-top:1px solid var(--sv-ln);padding:8px 0;font-size:14px}
.hs li span{color:var(--sv-mu)}
.hs .proj{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%;max-width:420px}
.hs .proj a{display:block;aspect-ratio:4/3;background:var(--sv-img);overflow:hidden}
.hs .proj img{display:block;width:100%;height:100%;object-fit:cover}
.hs li a{text-decoration:none}
.hs li a:hover{text-decoration:underline}

/* Labor */
.hj{color:var(--jx-fg)}
.hj .top,.rg .hd .nav{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--jx-mu)}
.hj .top{display:flex;justify-content:space-between;gap:10px}
.hj .top b{color:var(--jx-fg);font-weight:400}
.hj .wm{font-size:clamp(28px,11cqi,96px);margin-top:clamp(36px,12cqi,130px)}
.hj .role{font-family:var(--mono);font-size:12px;letter-spacing:.04em;color:var(--jx-ac)}
.hj .foot{margin-top:auto;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-family:var(--mono);font-size:10.5px;color:var(--jx-mu);letter-spacing:.05em}
.hj .foot a{color:var(--jx-ac);text-decoration:none}

.tele{display:flex;flex-wrap:wrap;border-top:1px solid var(--jx-ln);border-bottom:1px solid var(--jx-ln)}
.tele div{padding:8px 14px 8px 0;margin-right:14px;display:grid;gap:2px}
.tele b{font-family:var(--mono);font-weight:300;font-size:22px;font-variant-numeric:tabular-nums;line-height:1}
.tele span{font-family:var(--mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--jx-mu)}
.mapwrap{overflow-x:auto}
.mapwrap svg{display:block;width:100%;min-width:560px;height:auto}
.readout{font-family:var(--mono);font-size:11px;color:var(--jx-mu);min-height:1.5em;letter-spacing:.03em}
.readout b{color:var(--jx-fg);font-weight:400}
.legend{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:6px;font-family:var(--mono);font-size:11px;color:var(--jx-mu)}
.legend span{display:inline-flex;align-items:center;gap:6px;color:var(--jx-fg)}

.term{font-family:var(--mono);font-variant-ligatures:none;font-size:14px;line-height:1.5;border-top:1px solid var(--jx-ln);border-bottom:1px solid var(--jx-ln);padding:10px 0 12px;min-height:calc(11 * 2.1em)}
.term .tl{padding:5px 0;color:var(--jx-fg)}
.term .p{color:var(--jx-ac)}
.term .caret{height:1em;vertical-align:-.15em;width:.55em;color:var(--jx-ac)}
.term .tr{display:grid;grid-template-columns:2.6em minmax(0,1fr) auto auto 5.6em;gap:14px;align-items:baseline;padding:5px 0 5px .9em;text-decoration:none;color:var(--jx-fg);transition:background .15s}
.term .tr:hover,.term .tr:focus-visible{background:rgba(58,72,255,.14);outline:none}
.term .c{color:var(--jx-mu)}
.term .tr.sub .n{color:var(--jx-mu);padding-left:.4em}
.term .tr.sub:hover .n{color:var(--jx-fg)}
.term .m{color:var(--jx-mu);font-variant-numeric:tabular-nums}
.term .go{color:var(--jx-ac);opacity:0;transition:opacity .15s;text-align:right;padding-right:.5em}
.term .tr:hover .go,.term .tr:focus-visible .go{opacity:1}
@media (max-width:560px){.term .tr{grid-template-columns:2.4em minmax(0,1fr) auto;padding-left:0}.term .m.a,.term .go{display:none}}

/* Strangkarte */
.map text{font-family:var(--mono);fill:var(--jx-mu);font-size:10px;letter-spacing:.06em}
.map .lt{fill:var(--jx-fg);font-size:10.5px;text-transform:uppercase;cursor:pointer}
.map .lt:hover{fill:var(--jx-ac)}
.map .lane{stroke:var(--jx-ln);stroke-width:1;fill:none}
.map .lane.on{stroke:var(--jx-mu)}
.map .node{cursor:pointer;outline:none}
.map .nl{font-size:9.5px;letter-spacing:0;fill:var(--jx-mu)}
.map g.hl .nl{fill:var(--jx-fg)}
.map .origin{fill:var(--jx-fg)}
.map .fork{fill:var(--jx-mu)}
.map .trunk.on{stroke:var(--jx-mu)}
.map .gt{fill:var(--jx-fg)}

/* ======================================================
   LABOR-REGISTER
   ====================================================== */
.rg{padding:clamp(18px,3vw,40px);min-height:100svh;container-type:inline-size}
.rg .hd{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:18px;border-bottom:1px solid var(--jx-ln);padding-bottom:16px}
.rg .hd .wm{font-size:clamp(26px,4cqi,44px);text-decoration:none}
.rg .hd .nav{display:flex;flex-wrap:wrap;gap:4px 18px}
.rg .hd .nav a{text-decoration:none}
.rg .hd .nav a[aria-current="page"]{color:var(--jx-fg)}
.rg .intro{font-family:var(--mono);font-size:13px;color:var(--jx-mu);margin:clamp(24px,4cqi,44px) 0 14px}
.rg .tele{margin-bottom:14px}
.rg .mapwrap{max-width:1120px}
.rg .mapwrap svg{min-width:520px}
.lanes{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 12px}
.lanes button{font-family:var(--mono);font-size:12.5px;font-variant-ligatures:none;border:1px solid var(--jx-ln);padding:5px 9px;color:var(--jx-mu);display:flex;gap:8px;background:rgba(5,6,8,.6)}
.lanes button em{font-style:normal;color:var(--jx-fg)}
.lanes button[aria-pressed="true"]{border-color:var(--jx-ac);color:var(--jx-fg);background:rgba(58,72,255,.18)}
.tw{overflow-x:auto}
.term.reg{min-width:820px;min-height:0;background:rgba(5,6,8,.55)}
.reg .flag{color:var(--jx-ac)}
.reg .row{display:grid;grid-template-columns:5.2em minmax(11em,1.1fr) minmax(0,2fr) 9.5em 9.5em 16.5em;gap:14px;align-items:baseline;padding:4px 0 4px .9em;transition:background .15s}
.reg .row.th{color:var(--jx-mu);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid var(--jx-ln);padding-bottom:6px;margin-bottom:4px}
.reg .row.it:hover,.reg .row.it.hl{background:rgba(58,72,255,.14)}
.reg .row .n{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.reg .m{color:var(--jx-mu)}
.reg .st{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.reg .row a{color:var(--jx-ac);text-decoration:none}
.reg .row a:hover{text-decoration:underline}
.reg .cm{color:var(--jx-mu);padding:14px 0 4px .9em}
.reg .cm.gh{color:var(--jx-fg);padding-top:18px}
.reg .cm.gh + .cm.sub{padding-top:4px}
.reg .pv{color:var(--jx-ac);font-family:inherit;font-size:inherit;display:inline-flex;gap:6px;align-items:baseline}
.reg .pv i{font-style:normal;display:inline-block;transition:transform .15s}
.reg .pv[aria-expanded="true"] i{transform:rotate(90deg)}
.reg .pv:hover{text-decoration:underline}
.reg .pvrow{display:none;padding:6px 0 14px .9em}
.reg .pvrow.open{display:block}
.reg .row.it{cursor:default}
.reg .row.it.has-pv{cursor:pointer}
.reg .pvrow img{cursor:zoom-in}
.reg .pvrow .tx{margin:6px 0 10px;max-width:72ch;font-family:var(--sans);font-size:15px;line-height:1.5;color:var(--jx-fg)}
.reg .pvrow .pvlink img{cursor:pointer}
.reg .pvrow .pvlink:hover img{border-color:var(--jx-ac)}
.reg .row.it[data-st="abgeschlossen"] .n{color:var(--jx-mu)}
.map .node{cursor:pointer}
/* Großansicht der Vorschau */
.lb{position:fixed;inset:0;z-index:50;background:rgba(5,6,8,.94);display:grid;place-items:center;padding:clamp(12px,4vw,48px);cursor:zoom-out}
.lb img{max-width:100%;max-height:calc(100svh - 80px);width:auto;height:auto;border:1px solid var(--jx-ln)}
.lb span{position:absolute;left:0;right:0;bottom:16px;text-align:center;font-family:var(--mono);font-size:11px;color:var(--jx-mu)}
.reg .pvrow img{display:block;width:100%;max-width:640px;height:auto;margin:6px 0 4px;border:1px solid var(--jx-ln)}
.reg .pvrow .cm{padding:4px 0 0}
.reg .pvs.two{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:960px}
.reg .pvs.two img{max-width:none}
@media (max-width:700px){.reg .pvs.two{grid-template-columns:1fr;gap:0}}
.reg .cm.lg{display:flex;flex-wrap:wrap;gap:4px 16px;padding-top:18px}
.reg .cm.lg span{display:inline-flex;align-items:center;gap:6px;color:var(--jx-fg)}
.rg .foot{margin-top:40px;padding-top:12px;border-top:1px solid var(--jx-ln);display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-family:var(--mono);font-size:10.5px;color:var(--jx-mu)}

/* ======================================================
   IMPRESSUM, DATENSCHUTZ (gemeinsamer Träger: aufrecht, hell)
   ====================================================== */
body.legal{background:var(--sv-bg);color:var(--sv-fg)}
body.legal :focus-visible{outline-color:var(--sv-fg)}
.lp{max-width:720px;margin:0 auto;padding:clamp(18px,3vw,40px) 16px 40px}
.lp-hd{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px 24px;border-bottom:1px solid var(--sv-ln);padding-bottom:14px}
.lp-hd .wm{font-size:28px;text-decoration:none}
.lp-hd nav{display:flex;gap:16px;font-size:13px}
.lp-hd nav a{text-decoration:none;color:var(--sv-mu)}
.lp-hd nav a[aria-current="page"]{color:var(--sv-fg)}
.lp h1{font-weight:400;font-size:clamp(32px,6vw,52px);letter-spacing:-.02em;margin:clamp(32px,6vw,64px) 0 12px}
.lp h2{font-weight:500;font-size:15px;margin:0 0 8px}
.lp .lede{color:var(--sv-mu);max-width:56ch;margin:0 0 28px}
.lp section{border-top:1px solid var(--sv-ln);padding:18px 0 6px}
.lp p{margin:0 0 12px;max-width:62ch}
.lp a{text-underline-offset:2px}
.lp dl{display:grid;grid-template-columns:10em 1fr;gap:6px 16px;margin:0 0 12px;font-size:14px}
.lp dt{color:var(--sv-mu)}
.lp dd{margin:0}
.lp mark{background:#fff3a8;color:inherit;padding:0 2px}
.lp-ft{margin-top:32px;padding-top:12px;border-top:1px solid var(--sv-ln);display:flex;justify-content:space-between;gap:10px;font-size:12px;color:var(--sv-mu)}
@media (max-width:560px){.lp dl{grid-template-columns:1fr;gap:0}.lp dd{margin-bottom:8px}}

/* Über (#labor-ueber) */
.ab{margin-top:clamp(48px,7cqi,96px);scroll-margin-top:24px}
.ab-cmd{min-height:0;border-bottom:0;padding-bottom:4px}
.ab-grid{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:clamp(24px,4cqi,56px);padding-top:18px;align-items:start}
.ab-pic{margin:0}
.ab-pic img{display:block;width:100%;height:auto;border:1px solid var(--jx-ln)}
.ab-pic figcaption{font-family:var(--mono);font-size:11px;color:var(--jx-mu);padding-top:8px}
.ab-txt{display:grid;gap:14px;max-width:62ch}
.ab-txt p{margin:0;color:var(--jx-mu);font-size:15px}
.ab-txt .ab-lead{font-style:italic;font-weight:200;font-size:clamp(22px,2.6cqi,32px);line-height:1.2;color:var(--jx-fg);letter-spacing:-.01em}
.ab-dl{display:grid;grid-template-columns:7em 1fr;margin:12px 0 0;font-family:var(--mono);font-size:12.5px}
.ab-dl dt,.ab-dl dd{margin:0;padding:7px 0;border-top:1px solid var(--jx-ln)}
.ab-dl dt{color:var(--jx-ac)}
.ab-dl a{color:var(--jx-ac);text-decoration:none}
.ab-dl a:hover{text-decoration:underline}
.hj .top a.who{color:inherit;text-decoration:none}
.hj .top a.who:hover{color:var(--jx-fg)}
@media (max-width:700px){.ab-grid{grid-template-columns:1fr}.ab-pic{max-width:280px}}

/* ======================================================
   ARCHITEKTURBÜRO (#buero): schwarz-weiß, aufrecht, ruhig
   ====================================================== */
body.light{background:var(--sv-bg)}
.bu{background:var(--sv-bg);color:var(--sv-fg);font-weight:400}
.bu :focus-visible{outline-color:var(--sv-fg)}
.bu a{text-decoration:none}
.bu a:hover{text-decoration:underline}
.bu-hd{position:sticky;top:0;z-index:4;background:var(--sv-bg);display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:12px 24px;padding:18px clamp(16px,3vw,40px) 14px;border-bottom:1px solid var(--sv-ln)}
.bu-hd .wm{font-size:22px;line-height:1}
.bu-hd .wm:hover{text-decoration:none}
.bu-hd nav{display:flex;flex-wrap:wrap;gap:4px 18px;font-size:13px;color:var(--sv-mu)}
.bu-hd nav a:hover{color:var(--sv-fg);text-decoration:none}
.bu-main{padding:0 clamp(16px,3vw,40px)}
.bu-intro{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:24px;padding:clamp(32px,5vw,72px) 0 clamp(28px,3vw,44px)}
.bu-intro h1{margin:0;font-weight:400;font-size:clamp(30px,5vw,64px);letter-spacing:-.02em;line-height:1}
.bu-intro .who{margin:12px 0 0;font-size:15px}
.bu-intro > p{margin:0;align-self:end;max-width:40ch;color:var(--sv-mu)}
.bu-label{display:flex;justify-content:space-between;font-size:12px;color:var(--sv-mu);border-top:1px solid var(--sv-fg);padding-top:8px;margin-bottom:24px}

/* Bilder: Fotos beschnitten, Pläne eingepasst */
.bu .ph{margin:0;background:var(--sv-img);position:relative;overflow:hidden}
.bu .ph img{display:block;width:100%;height:100%;object-fit:cover}
.bu .ph.plan{background:#fff;box-shadow:inset 0 0 0 1px var(--sv-ln)}
.bu .ph.plan img{object-fit:contain;padding:4%}
.bu .ph figcaption{position:absolute;left:10px;bottom:8px;font-size:11px;color:var(--sv-mu);background:var(--sv-bg);padding:1px 5px}

/* Projekte: schlanker Block (Bilder nur so groß, wie die Auflösung trägt), links das Register, bleibt stehen */
.bu-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,760px) minmax(0,1fr);gap:clamp(24px,3vw,48px)}
.bu-list{grid-column:2;display:grid;gap:clamp(56px,8vw,104px)}
.bu-list article{scroll-margin-top:84px}
.bu-list article > .ph{aspect-ratio:3/2}
.bu .more-img{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.6vw,20px);margin-top:clamp(12px,1.6vw,20px)}
.bu .more-img .ph{aspect-ratio:4/3}
.bu .meta{display:grid;grid-template-columns:3ch 1fr 1.3fr;gap:6px 24px;padding-top:12px;font-size:14px}
.bu .meta .n,.bu .meta .d{color:var(--sv-mu)}
.bu .meta p{grid-column:3;margin:0;color:var(--sv-mu);max-width:44ch}
.bu-reg{grid-column:1;grid-row:1;position:sticky;top:84px;align-self:start}
.bu-reg table{width:100%;border-collapse:collapse;font-size:13px}
.bu-reg th{font-weight:400;color:var(--sv-mu);font-size:11px;text-align:left;padding:0 10px 6px 0;border-bottom:1px solid var(--sv-fg)}
.bu-reg td{padding:8px 10px 8px 0;border-bottom:1px solid var(--sv-ln);vertical-align:top;color:var(--sv-mu)}
.bu-reg td a{display:block;color:inherit}
.bu-reg td a:hover{text-decoration:none}
.bu-reg tr:hover td,.bu-reg tr.on td{color:var(--sv-fg)}
.bu-reg tr.on td:first-child{box-shadow:inset 2px 0 0 var(--sv-fg);padding-left:8px}

/* Büro, Kontakt */
.bu-block{padding-top:clamp(72px,10vw,140px)}
.bu-two{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.bu-side{display:grid;gap:clamp(24px,3vw,40px);align-content:start}
.bu-side .lead{margin:0;font-size:clamp(20px,2.4vw,28px);line-height:1.25;letter-spacing:-.01em;max-width:24ch}
.bu-portrait{margin:0;max-width:280px}
.bu-portrait img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover}
.bu-portrait figcaption{font-size:12px;color:var(--sv-mu);padding-top:6px}
.bu-txt{display:grid;gap:14px;align-content:start;max-width:52ch}
.bu-txt p{margin:0}
.bu-txt dl{margin:20px 0 0;display:grid;grid-template-columns:9em 1fr;font-size:14px}
.bu-txt dt,.bu-txt dd{margin:0;padding:8px 0;border-top:1px solid var(--sv-ln)}
.bu-txt dt{color:var(--sv-mu)}
.bu-mail{font-size:clamp(24px,4vw,52px);letter-spacing:-.02em;line-height:1.05;word-break:break-word}
.bu-ft{margin-top:clamp(72px,10vw,140px);padding:12px clamp(16px,3vw,40px) 28px;border-top:1px solid var(--sv-ln);display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:12px;color:var(--sv-mu)}
.bu-ft a{color:inherit}

@media (max-width:1180px){
  .bu-wrap{display:block}
  .bu-reg{display:none}
  .bu-list{max-width:760px;margin-inline:auto}
}
@media (max-width:760px){
  .bu-intro,.bu-two{grid-template-columns:1fr}
  .bu .meta{grid-template-columns:3ch 1fr}
  .bu .meta p{grid-column:2}
  .bu-txt dl{grid-template-columns:7em 1fr}
}

/* ---------- Rechtliches in Start und Register ---------- */
.hs .legal-links{font-size:12px;color:var(--sv-mu)}
.hs .legal-links a,.rg .foot a{color:inherit;text-decoration:none}
.hs .legal-links a:hover,.rg .foot a:hover{text-decoration:underline}

/* ---------- schmal ---------- */
@media (max-width:820px){
  .home{grid-template-columns:1fr;grid-template-rows:auto 1px auto;min-height:0}
  .hs .body{margin-top:24px}
  .hs .wm,.hs .role{text-align:left}
  .hs .body{justify-items:start;text-align:left}
  .hs .wm,.hj .wm{margin-top:28px}
  .spine span{transform:translate(-50%,-50%)}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ======================================================
   SCROLLBALKEN: schmal, kantig, passend zur jeweiligen Seite
   ====================================================== */
html{scrollbar-width:thin;scrollbar-color:#2a2e37 var(--jx-bg)}
html:has(body.light),html:has(body.legal){scrollbar-color:#000 #fff}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:var(--jx-bg)}
::-webkit-scrollbar-thumb{background:#2a2e37}
::-webkit-scrollbar-thumb:hover{background:var(--jx-ac)}
body.light ::-webkit-scrollbar-track,body.legal ::-webkit-scrollbar-track{background:#fff}
body.light ::-webkit-scrollbar-thumb,body.legal ::-webkit-scrollbar-thumb{background:#000}

/* ======================================================
   HANDY
   ====================================================== */
.entry,.mtabs,.mapv{display:none}
@media (max-width:700px){
  /* Start: zwei gleich große Hälften, kein Scrollen. Jede Hälfte ist ein Einstieg. */
  .home{height:100svh;min-height:0;grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) 1px minmax(0,1fr);overflow:hidden}
  .half{position:relative;min-height:0;padding:18px 18px 16px;gap:10px}
  .hs .wm,.hj .wm{margin-top:clamp(16px,6svh,56px);font-size:clamp(34px,12.5cqi,64px)}
  .hj .wm{font-size:clamp(30px,10.5cqi,56px)}
  .hs .wm{text-align:left}
  .hs .body,.hj .tele,.hj .mapwrap,.hj .readout,.hj .term,.hj .foot{display:none}
  .entry{display:flex;margin-top:auto;justify-content:space-between;align-items:baseline;gap:12px;font-size:13px;padding-top:10px}
  .entry a{text-decoration:none;white-space:nowrap}
  .entry a::after{content:"";position:absolute;inset:0;z-index:1}
  .hs .entry{border-top:1px solid var(--sv-ln);color:var(--sv-mu)}
  .hs .entry a{color:var(--sv-fg)}
  .hj .entry{border-top:1px solid var(--jx-ln);font-family:var(--mono);font-size:11px;color:var(--jx-mu)}
  .hj .entry a{color:var(--jx-ac)}
  .hj .top a.who{position:relative;z-index:2}
  .spine span{font-size:9px;padding:3px 8px}

  /* Labor: Reiter Strang / Register, Karte hochkant */
  .mtabs{display:flex;gap:6px;margin:14px 0 6px}
  .mtabs button{flex:1;font-family:var(--mono);font-size:12.5px;border:1px solid var(--jx-ln);padding:8px 9px;color:var(--jx-mu);background:rgba(5,6,8,.6)}
  .mtabs button[aria-selected="true"]{border-color:var(--jx-ac);color:var(--jx-fg);background:rgba(58,72,255,.18)}
  .rg .mapwrap{display:none}
  .mapv{display:block;margin-top:6px}
  .mapv svg{display:block;width:100%;height:auto}
  .mapv .nl{font-size:13px;fill:var(--jx-fg)}
  .mapv .lane{stroke:#3a3f4a;stroke-width:1.2}
  .mapv .lane.on{stroke:var(--jx-ac)}
  .mapv .fork,.mapv .origin{fill:var(--jx-fg)}
  .mapv .lt{font-size:11.5px;letter-spacing:.08em}
  .mapv text{font-size:11px}
  .rg[data-tab="map"] .lanes,.rg[data-tab="map"] .tw,.rg[data-tab="map"] .ab{display:none}
  .rg[data-tab="reg"] .mapv,.rg[data-tab="reg"] .readout,.rg[data-tab="reg"] .legend{display:none}
  .lanes{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px;margin-inline:calc(-1 * clamp(18px,3vw,40px));padding-inline:clamp(18px,3vw,40px)}
  .lanes::-webkit-scrollbar{display:none}
  .lanes button{flex:none}
  /* Register: jede Zeile eine kleine Karte – Kennung, Name, Stand / Was / Rolle, Ort */
  .tw{overflow:visible}
  .term.reg{min-width:0;font-size:13px}
  .reg .row.th{display:none}
  .reg .row.it{grid-template-columns:3.6em minmax(0,1fr) auto;grid-template-areas:"id n st" ". was was" ". ro ln";gap:2px 10px;padding:9px 0 9px .5em;border-bottom:1px solid var(--jx-ln)}
  .reg .row.it > :nth-child(1){grid-area:id}
  .reg .row.it > :nth-child(2){grid-area:n;white-space:normal}
  .reg .row.it > :nth-child(3){grid-area:was}
  .reg .row.it > :nth-child(4){grid-area:ro;font-size:12px}
  .reg .row.it > :nth-child(5){grid-area:st;font-size:12px}
  .reg .row.it > :nth-child(6){grid-area:ln;font-size:12px;text-align:right;overflow-wrap:anywhere}
  .reg .cm{padding-left:.5em}
  .reg .pvrow{padding-left:.5em}
  .ab-dl{grid-template-columns:5.5em 1fr}
}
@media (max-width:760px){
  /* Büro: Nummer links, alles andere untereinander rechts davon */
  .bu .meta{grid-template-columns:3ch minmax(0,1fr)}
  .bu .meta .t,.bu .meta .d,.bu .meta p{grid-column:2}
}