/* ==========================================================================
   dispolotse.de - LIVE: the tabs of the public dealer map, drawn like the app
   lane HPA-R (29.09.2026) - belongs to karte-reiter.js. Every selector starts
   with .lkr (no collision with karte.css). Colours only from the existing
   tokens of hp.css / karte.css (--karte --mulde --rand --text --matt --frei
   --lk-*), so light AND dark both work without an own theme block.
   Motion only when the visitor allows it (prefers-reduced-motion).
   ========================================================================== */
.lkr { --lkr-gut: var(--frei); --lkr-weg: var(--lk-haendler); --lkr-bau: var(--lk-trupp);
       --lkr-ruhe: var(--lk-spieler); --lkr-aus: var(--lk-eilig); --lkr-bald: var(--matt);
       --lkr-roh: color-mix(in srgb, var(--matt) 80%, var(--mulde));
       min-width: 0; }
.lkr * { box-sizing: border-box; }
.lkr-klein { font-size: 12.5px; line-height: 1.35; }
.lkr-matt { color: var(--matt); }
.lkr-satz { color: var(--matt); font-size: 13.5px; margin: 0 0 12px; }
.lkr-unter { color: var(--matt); font-size: 13.5px; margin: 2px 0 12px; }
.lkr-leer { color: var(--matt); padding: 18px; text-align: center; border: 1px dashed var(--rand); border-radius: 12px; margin: 0; }
.lkr-h4 { margin: 16px 0 8px; font-size: 14px; color: var(--matt); font-weight: 600; letter-spacing: .02em; }
.lkr-gross { display: block; font-size: 26px; line-height: 1.1; font-variant-numeric: tabular-nums; }

/* N-HPKURZ 04.10.2026: no endless list — summary row + search + „Alle anzeigen" (karte-reiter.js langeListe) */
.lkr-listenleiste { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 12px;
                    padding: 10px 14px; background: var(--karte); border: 1px solid var(--rand); border-radius: 12px;
                    box-shadow: inset 0 1px 0 var(--glanz, rgba(255,255,255,.12)); }
.lkr-ll-summe { font-weight: 650; font-size: 14px; margin-right: auto; }
.lkr-ll-suche { font: inherit; font-size: 14px; min-height: 36px; padding: 6px 12px; width: min(240px, 100%);
                color: var(--text); background: var(--mulde); border: 1px solid var(--rand); border-radius: 8px; }
.lkr-ll-suche:focus-visible { outline: 2px solid var(--ton, #f0a02a); outline-offset: 1px; }
.lkr-ll-alle, .lkr-ll-zu { font: inherit; font-size: 13.5px; font-weight: 600; min-height: 36px; padding: 6px 14px; cursor: pointer;
                           color: var(--ton, #f0a02a); background: transparent; border: 1px solid var(--ton, #f0a02a); border-radius: 8px; }
.lkr-ll-zu { color: var(--matt); border-color: var(--rand); }
.lkr-ll-alle:hover { background: var(--ton, #f0a02a); color: var(--auf-ton, #1a1200); }
.lkr-ll-keine { color: var(--matt); font-size: 13.5px; flex-basis: 100%; }
.lkr-ll-keine[hidden], .lkr-ll-alle[hidden] { display: none; }

.lkr-raster { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; min-width: 0; }
.lkr-karte { position: relative; background: var(--karte); border: 1px solid var(--rand); border-radius: 14px;
             padding: 16px; min-width: 0; overflow: hidden; margin: 0 0 12px; }
.lkr-raster > .lkr-karte { margin: 0; }
.lkr-karte h3 { margin: 0; font-size: 16.5px; line-height: 1.3; }
.lkr-bildrahmen { background: var(--mulde); border: 1px solid var(--rand); border-radius: 10px; overflow: hidden; margin: 6px 0 10px; }
.lkr-bildrahmen svg { display: block; width: 100%; height: auto; }

/* chips + bars */
.lkr-chip { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; line-height: 1;
            padding: 5px 9px 6px; border-radius: 99px; white-space: nowrap;
            border: 1px solid var(--c, var(--rand)); color: var(--c, var(--matt));
            background: color-mix(in srgb, var(--c, transparent) 11%, transparent); }
.lkr-c-gut { --c: var(--frei); } .lkr-c-bau { --c: var(--lk-trupp); } .lkr-c-plan { --c: var(--matt); }
.lkr-c-haupt { --c: var(--lk-haendler); } .lkr-c-boerse { --c: var(--lk-boerse); } .lkr-c-eilig { --c: var(--lk-eilig); }
.lkr-c-spieler, .lkr-c-blau { --c: var(--lk-spieler); }
.lkr-zc.lkr-z-gut { --c: var(--lkr-gut); } .lkr-zc.lkr-z-weg { --c: var(--lkr-weg); } .lkr-zc.lkr-z-bau { --c: var(--lkr-bau); }
.lkr-zc.lkr-z-ruhe { --c: var(--lkr-ruhe); } .lkr-zc.lkr-z-aus { --c: var(--lkr-aus); } .lkr-zc.lkr-z-bald { --c: var(--lkr-bald); }
.lkr-balken { display: block; height: 7px; border-radius: 99px; background: var(--mulde); border: 1px solid var(--rand); overflow: hidden; margin: 5px 0; }
.lkr-balken i { display: block; height: 100%; border-radius: 99px; background: var(--c, var(--frei)); }
.lkr-b-gut { --c: var(--frei); } .lkr-b-gelb { --c: var(--lk-gelb, #f2c531); } .lkr-b-haendler { --c: var(--lk-haendler); }
.lkr-b-blau { --c: var(--lk-spieler); } .lkr-b-bau { --c: var(--lk-trupp); }

/* show more (native <details>) */
.lkr-mehr { margin-top: 10px; }
.lkr-mehr > summary { cursor: pointer; list-style: none; display: inline-flex; align-items: center; gap: 8px;
  font-size: 13.5px; font-weight: 600; color: var(--text); padding: 8px 14px; border-radius: 99px;
  border: 1px solid var(--rand); background: var(--mulde); }
.lkr-mehr > summary::-webkit-details-marker { display: none; }
.lkr-mehr > summary::before { content: ""; width: 7px; height: 7px; border-right: 2px solid var(--matt); border-bottom: 2px solid var(--matt); transform: rotate(45deg) translateY(-2px); }
.lkr-mehr[open] > summary { margin-bottom: 10px; }
.lkr-mehr[open] > summary::before { transform: rotate(-135deg) translateY(-1px); }

/* ── Aufbau ── */
.lkr-ort { background: var(--karte); border: 1px solid var(--rand); border-radius: 14px; margin: 0 0 12px; overflow: hidden; }
.lkr-ort > summary { cursor: pointer; list-style: none; padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; }
.lkr-ort > summary::-webkit-details-marker { display: none; }
.lkr-ortkopf { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.lkr-ortkopf::after { content: ""; margin-left: auto; width: 9px; height: 9px; border-right: 2px solid var(--matt); border-bottom: 2px solid var(--matt); transform: rotate(45deg); }
.lkr-ort[open] .lkr-ortkopf::after { transform: rotate(-135deg); }
.lkr-ortname { font-size: 17px; }
.lkr-ortkoerper { padding: 0 16px 16px; }
.lkr-fakten { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 6px 16px; margin: 0 0 12px; font-size: 13px; color: var(--matt); }
.lkr-gbraster { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.lkr-gb { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 10px; align-items: start; padding: 10px;
          border: 1px solid var(--rand); border-radius: 12px; background: var(--mulde); min-width: 0; }
.lkr-gb-z-bau, .lkr-gb-z-ausbau { border-color: color-mix(in srgb, var(--lk-trupp) 55%, var(--rand)); }
.lkr-gb-bild svg { width: 64px; height: 48px; display: block; }
.lkr-gb-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.lkr-gb-name { font-size: 14px; line-height: 1.25; overflow-wrap: anywhere; }
.lkr-gb-fuss { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 2px; }

/* the app's yard seen from above (port of web seiten/hof/seite.css .h-lp-*, tokens of this page) */
.lkr-lpbild { border-radius: 12px; border: 1px solid var(--rand); overflow: hidden; background: var(--mulde); margin: 0 0 12px; }
.lkr-lp { display: block; width: 100%; height: auto; max-height: 560px; }
.lkr-lp-grund { fill: color-mix(in srgb, var(--matt) 12%, var(--karte)); stroke: var(--lk-haendler); stroke-width: 1.6; stroke-dasharray: 5 4; }
.lkr-lp-weg { fill: var(--mulde); opacity: .75; }
.lkr-lp-mitte { stroke: var(--matt); stroke-width: 1.5; stroke-dasharray: 3 3; opacity: .8; fill: none; }
.lkr-lp-torein { fill: var(--lk-haendler); }
.lkr-lp-block { --lp: var(--matt); }
.lkr-lp-k-lager { --lp: var(--lk-haendler); } .lkr-lp-k-werkstatt_halle { --lp: var(--lk-spieler); }
.lkr-lp-k-tankstelle { --lp: var(--frei); } .lkr-lp-k-bautrupphaus { --lp: var(--lk-gelb, #f2c531); }
.lkr-lp-k-buero { --lp: color-mix(in srgb, var(--lk-spieler) 50%, var(--lk-eilig)); } .lkr-lp-k-fahrerhaus { --lp: var(--lk-boerse); }
.lkr-lp-k-hof { --lp: var(--matt); } .lkr-lp-k-stellplatz { --lp: var(--text); }
.lkr-lp-dach { fill: color-mix(in srgb, var(--lp) 62%, var(--karte)); stroke: color-mix(in srgb, var(--lp) 80%, var(--text)); stroke-width: 1.2; stroke-linejoin: round; }
.lkr-lp-wand-r { fill: color-mix(in srgb, var(--lp) 42%, var(--mulde)); stroke: color-mix(in srgb, var(--lp) 55%, var(--mulde)); stroke-width: 1; }
.lkr-lp-wand-l { fill: color-mix(in srgb, var(--lp) 28%, var(--mulde)); stroke: color-mix(in srgb, var(--lp) 45%, var(--mulde)); stroke-width: 1; }
.lkr-lp-tor { fill: var(--mulde); stroke: var(--rand); stroke-width: 1; }
.lkr-lp-first { stroke: color-mix(in srgb, var(--lp) 40%, var(--mulde)); stroke-width: 2; fill: none; }
.lkr-lp-fenster { fill: color-mix(in srgb, var(--lk-spieler) 55%, #fff); opacity: .85; }
.lkr-lp-zapf { --lp: var(--frei); }
.lkr-lp-feld { fill: color-mix(in srgb, var(--matt) 22%, var(--karte)); }
.lkr-lp-bucht { stroke: var(--text); stroke-width: 2; opacity: .55; fill: none; }
.lkr-lp-baufeld { fill: color-mix(in srgb, var(--lk-gelb, #f2c531) 14%, transparent); stroke: var(--lk-gelb, #f2c531); stroke-width: 2; stroke-dasharray: 7 5; }
.lkr-lp-roh.lkr-lp-dach, .lkr-lp-roh.lkr-lp-wand-l, .lkr-lp-roh.lkr-lp-wand-r { fill: color-mix(in srgb, var(--lk-gelb, #f2c531) 22%, var(--mulde)); stroke: var(--lk-gelb, #f2c531); stroke-dasharray: 4 3; }
.lkr-lp-kran { stroke: var(--lk-gelb, #f2c531); stroke-width: 2.4; fill: none; stroke-linecap: round; }
.lkr-lp-tafel { fill: var(--karte); stroke: var(--rand); stroke-width: 1.4; opacity: .96; }
.lkr-lp-schild-imbau .lkr-lp-tafel { stroke: var(--lk-gelb, #f2c531); }
.lkr-lp-punkt { fill: var(--frei); } .lkr-lp-schild-imbau .lkr-lp-punkt { fill: var(--lk-gelb, #f2c531); }
.lkr-lp-name { fill: var(--text); font-size: 17px; font-weight: 700; }
.lkr-lp-zeile { fill: var(--matt); font-size: 15px; font-weight: 600; }
.lkr-lplegende { display: inline-flex; flex-wrap: wrap; gap: 4px 16px; margin: 0 0 8px; padding: 4px 12px; border-radius: 999px;
                 border: 1px solid var(--rand); background: var(--karte); font-size: 12px; color: var(--matt); }
.lkr-lpleg { display: inline-flex; align-items: center; gap: 6px; }
.lkr-lpleg i { width: 9px; height: 9px; border-radius: 50%; background: var(--frei); }
.lkr-lpleg-imbau i { background: var(--lk-gelb, #f2c531); }
@media (max-width: 560px) { .lkr-lp-schild { display: none; } }

/* the drawn signs */
.lkr-grund { fill: var(--rand); } .lkr-wand { fill: color-mix(in srgb, var(--lk-haendler) 26%, var(--karte)); stroke: var(--lk-haendler); stroke-width: 1.2; }
.lkr-regal { fill: var(--matt); opacity: .6; } .lkr-kiste { fill: var(--lk-haendler2); }
.lkr-glas { fill: color-mix(in srgb, var(--lk-spieler) 45%, var(--karte)); } .lkr-schlauch { fill: none; stroke: var(--matt); stroke-width: 2; }
.lkr-tankk { fill: color-mix(in srgb, var(--lk-haendler) 55%, var(--karte)); }
.lkr-tor { fill: var(--mulde); stroke: var(--matt); stroke-width: .8; } .lkr-lamelle { fill: var(--matt); opacity: .45; }
.lkr-lampe { fill: var(--rand); } .lkr-lampe-an { fill: var(--lk-gelb, #f2c531); }
.lkr-asphalt { fill: color-mix(in srgb, var(--matt) 35%, var(--karte)); } .lkr-markierung { fill: var(--text); opacity: .7; }
.lkr-schild { fill: var(--lk-spieler); } .lkr-schildzeichen { fill: none; stroke: #fff; stroke-width: 2; }
.lkr-dachlinie { fill: none; stroke: var(--lk-haendler); stroke-width: 2.4; stroke-linejoin: round; }
.lkr-kran { fill: var(--lk-gelb, #f2c531); } .lkr-kranarm { fill: none; stroke: var(--lk-gelb, #f2c531); stroke-width: 2; } .lkr-seil { stroke: var(--matt); stroke-width: 1; }
.lkr-zaun { fill: var(--matt); opacity: .7; }

/* the build-up band */
.lkr-ab h3 { margin: 0 0 12px; font-size: 17px; }
.lkr-abreihe { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 14px 22px; align-items: center; }
.lkr-abring, .lkr-abwerke { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; min-width: 110px; }
.lkr-ring { width: 92px; height: 92px; }
.lkr-ringbahn { fill: none; stroke: var(--rand); stroke-width: 9; }
.lkr-ringwert { fill: none; stroke: var(--lk-haendler); stroke-width: 9; stroke-linecap: round; }
.lkr-ringzahl { fill: var(--text); font-size: 22px; font-weight: 700; } .lkr-ringvon { fill: var(--matt); font-size: 11px; }
.lkr-abfeld { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 6px; }
.lkr-abart { display: flex; gap: 7px; align-items: center;
             padding: 5px 10px 5px 6px; border: 1px solid var(--rand); border-radius: 10px; background: var(--mulde); min-width: 0; }
.lkr-abart svg { width: 34px; height: 26px; flex: none; }
.lkr-abtext { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.lkr-abart b { font-size: 15px; font-variant-numeric: tabular-nums; }
.lkr-abart em { font-style: normal; font-size: 11.5px; color: var(--lk-trupp); font-weight: 700; margin-left: 5px; }
.lkr-abart small { font-size: 11px; color: var(--matt); white-space: nowrap; max-width: 150px; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 560px) {
  .lkr-abfeld { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  .lkr-abart small { max-width: none; }
  .lkr-gbraster { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .lkr-gb { grid-template-columns: 1fr; gap: 4px; padding: 8px; }
  .lkr-gb-bild svg { width: 48px; height: 36px; }
  .lkr-gb-name { font-size: 13px; }
  .lkr-ortkoerper { padding: 0 10px 12px; }
  .lkr-ort > summary { padding: 12px 10px; }
}
.lkr-werkmini { width: 96px; height: 56px; }
@media (max-width: 760px) {
  .lkr-abreihe { grid-template-columns: 1fr 1fr; }
  .lkr-abarten { grid-column: 1 / -1; grid-row: 2; }
  .lkr-abring, .lkr-abwerke { min-width: 0; }
}

/* ── vehicles (all drawings) ── */
.lkr-lack { fill: var(--lk-haendler); } .lkr-roh { fill: var(--lkr-roh, #7d8793); }
.lkr-fenster { fill: color-mix(in srgb, var(--lk-spieler) 40%, #0c1117); } .lkr-rahmen { fill: #2a3039; }
.lkr-rad { fill: #1b1f25; } .lkr-nabe { fill: var(--matt); } .lkr-chrom { fill: #c8d0da; } .lkr-licht { fill: #ffd257; }
.lkr-glanz { fill: #fff; opacity: .55; } .lkr-plane { fill: var(--lk-haendler2); } .lkr-dach { fill: #fff; opacity: .25; }
.lkr-rippe { fill: rgba(0, 0, 0, .18); stroke: rgba(0, 0, 0, .18); stroke-width: 1; }
.lkr-umriss { fill: none; stroke: var(--matt); stroke-width: 1.4; stroke-dasharray: 4 3; }
.lkr-schein { fill: var(--lk-haendler); opacity: .12; }
.lkr-alt .lkr-lack { fill: color-mix(in srgb, var(--lk-haendler) 55%, var(--matt)); }
.lkr-alt .lkr-plane { fill: color-mix(in srgb, var(--lk-haendler2) 50%, var(--matt)); }
.lkr-fzbild { width: 100%; height: auto; display: block; }

/* ── Werke ── */
.lkr-werkraster { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.lkr-himmel { fill: var(--mulde); } .lkr-strasse { fill: color-mix(in srgb, var(--matt) 30%, var(--karte)); }
.lkr-mittellinie { stroke: var(--text); stroke-width: 1.5; stroke-dasharray: 14 10; opacity: .5; }
.lkr-hallendach { fill: color-mix(in srgb, var(--matt) 30%, var(--karte)); stroke: var(--matt); stroke-width: 1.2; }
.lkr-oberlicht { stroke: var(--lk-spieler); stroke-width: 2; opacity: .6; }
.lkr-hallenwand { fill: color-mix(in srgb, var(--matt) 22%, var(--karte)); }
.lkr-halleninnen { fill: var(--karte); } .lkr-akzent { fill: var(--lk-haendler); opacity: .8; }
.lkr-bandschild { fill: var(--mulde); stroke: var(--rand); } .lkr-bandnr { fill: var(--text); font-size: 12px; font-weight: 700; }
.lkr-foerder { fill: #2a3039; } .lkr-foerderruhe { stroke: var(--matt); stroke-width: 1; stroke-dasharray: 3 6; opacity: .5; }
.lkr-foerderlauf { stroke: var(--lk-gelb, #f2c531); stroke-width: 1.4; stroke-dasharray: 6 6; }
.lkr-rolle { fill: var(--matt); }
.lkr-roboterfuss { fill: var(--matt); } .lkr-roboterarm { fill: none; stroke: var(--lk-gelb, #f2c531); stroke-width: 3.5; stroke-linecap: round; stroke-linejoin: round; }
.lkr-funke { fill: #ffd257; }
.lkr-spur { fill: var(--rand); } .lkr-fortschritt { fill: var(--frei); }
.lkr-bandliste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: 13.5px; }
.lkr-bandliste li { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; }
.lkr-bandnr2 { font-size: 12px; color: var(--matt); }
.lkr-pz { font-variant-numeric: tabular-nums; color: var(--frei); font-weight: 700; }

/* ── Bestand ── */
.lkr-breit { grid-column: 1 / -1; }
.lkr-fzreihe { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 10px 0 14px; }
.lkr-fzkachel { background: var(--mulde); border: 1px solid var(--rand); border-radius: 12px; padding: 8px 10px 10px; text-align: center; min-width: 0; }
.lkr-fzkachel svg { max-width: 150px; margin: 0 auto; }
.lkr-tanks { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; margin: 0 0 6px; }
.lkr-tank { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 12px; align-items: center; padding: 10px;
            background: var(--mulde); border: 1px solid var(--rand); border-radius: 12px; }
.lkr-tank > span { display: flex; flex-direction: column; min-width: 0; }
.lkr-tankwert { font-size: 17px; font-weight: 700; font-variant-numeric: tabular-nums; }
.lkr-tankbild { width: 40px; height: 56px; }
.lkr-tankhuelle { fill: var(--karte); stroke: var(--rand); stroke-width: 2; }
.lkr-tf-diesel { fill: var(--lk-haendler); } .lkr-tf-adblue { fill: var(--lk-spieler); } .lkr-skala { fill: var(--matt); }
.lkr-teileraster { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px; }
.lkr-teil { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; grid-template-rows: auto auto; column-gap: 10px; align-items: center;
            padding: 8px 10px; background: var(--mulde); border: 1px solid var(--rand); border-radius: 10px; min-width: 0; }
.lkr-teil svg { width: 32px; height: 32px; grid-row: 1 / 3; }
.lkr-teilname { font-size: 13.5px; overflow-wrap: anywhere; }
.lkr-teil .lkr-balken { grid-column: 2; margin: 2px 0 0; }
.lkr-teil em { grid-column: 3; grid-row: 1 / 3; font-style: normal; font-weight: 700; font-variant-numeric: tabular-nums; font-size: 13.5px; }
.lkr-kistendeckel { fill: color-mix(in srgb, var(--lk-haendler2) 70%, #000); } .lkr-kistenband { fill: rgba(0, 0, 0, .25); }
.lkr-zahnrad { fill: none; stroke: #2a3039; stroke-width: 2.4; }
@media (max-width: 560px) { .lkr-fzreihe { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ── Werkstatt (like the dealer's own portal) ── */
.lkr-hallen { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 560px)); gap: 10px; }
@media (max-width: 560px) { .lkr-hallen { grid-template-columns: minmax(0, 1fr); } }
.lkr-hallebox { margin: 0; background: var(--mulde); border: 1px solid var(--rand); border-radius: 12px; overflow: hidden; }
.lkr-halle { display: block; width: 100%; height: auto; }
.lkr-halle-schmal { display: none; }
@media (max-width: 560px) { .lkr-halle-breit { display: none; } .lkr-halle-schmal { display: block; } }
.lkr-wdach { fill: color-mix(in srgb, var(--matt) 18%, var(--karte)); stroke: var(--matt); stroke-width: 1.5; stroke-linejoin: round; }
.lkr-winnen { fill: var(--karte); stroke: var(--rand); }
.lkr-whalle { fill: var(--matt); font-size: 15px; font-weight: 700; letter-spacing: .06em; }
.lkr-wfeld { fill: var(--mulde); stroke: var(--rand); stroke-width: 1.2; }
.lkr-wfeld-bau { fill: color-mix(in srgb, var(--lk-trupp) 10%, var(--mulde)); stroke: var(--lk-trupp); stroke-dasharray: 6 4; }
.lkr-bucht-nichtda { opacity: .28; }
.lkr-wnr { fill: var(--matt); font-size: 15px; font-weight: 700; }
.lkr-wkran { fill: none; stroke: var(--lk-trupp); stroke-width: 3; stroke-linejoin: round; }
.lkr-saeule { fill: color-mix(in srgb, var(--matt) 70%, var(--karte)); }
.lkr-arm { fill: var(--lk-haendler); } .lkr-bucht-frei .lkr-arm { fill: var(--rand); }
.lkr-stempel { fill: var(--matt); opacity: .7; }
.lkr-wpz { fill: var(--frei); font-size: 14px; font-weight: 700; }
.lkr-wboden { stroke: var(--rand); stroke-width: 3; }
.lkr-auftraege { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; }
.lkr-auftrag { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 12px; align-items: center; padding: 10px;
               background: var(--mulde); border: 1px solid var(--rand); border-radius: 12px; min-width: 0; }
.lkr-auftragtext { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.lkr-auftragkopf { display: flex; flex-wrap: wrap; gap: 5px; }
.lkr-auftragkopf:empty { display: none; }
.lkr-arbeiten { font-size: 13px; overflow-wrap: anywhere; }
.lkr-pzzeile { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px; align-items: center; }
.lkr-pzzeile .lkr-balken { margin: 0; }
.lkr-schild { display: inline-block; font: 600 12px/1 ui-monospace, monospace; padding: 3px 6px; border-radius: 4px; background: #f4f4f0; color: #111; border: 1px solid #333; width: max-content; }
.lkr-fussleiste { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-top: 12px; }
.lkr-vorhof { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.lkr-mini { width: 34px; height: 18px; }
.lkr-mkasten { fill: var(--lk-haendler2); } .lkr-mkabine { fill: var(--lk-haendler); } .lkr-mrad { fill: #1b1f25; }
@media (prefers-reduced-motion: no-preference) {
  .lkr-lift { animation: lkrHeben 3.2s ease-in-out infinite alternate; }
  .lkr-foerderlauf { animation: lkrBand 1.2s linear infinite; }
  .lkr-roboter { animation: lkrNicken 2.4s ease-in-out infinite alternate; transform-box: fill-box; transform-origin: 100% 100%; }
  .lkr-arm + g .lkr-arm, .lkr-trupp .lkr-arm { animation: lkrNicken 2s ease-in-out infinite alternate; transform-box: fill-box; transform-origin: 100% 100%; }
}
@keyframes lkrHeben { from { transform: translateY(0); } to { transform: translateY(-3px); } }
@keyframes lkrBand { to { stroke-dashoffset: -12; } }
@keyframes lkrNicken { from { transform: rotate(0); } to { transform: rotate(-5deg); } }
@media (max-width: 560px) { .lkr-auftrag { grid-template-columns: 90px minmax(0, 1fr); } }

/* ── Personal ── */
.lkr-personalraster { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.lkr-rollenkopf { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.lkr-rollenkopf svg { width: 48px; height: 56px; }
.lkr-segment { display: flex; height: 10px; border-radius: 99px; overflow: hidden; gap: 2px; margin: 0 0 8px; background: var(--mulde); }
.lkr-segment i { display: block; }
.lkr-segment .lkr-z-gut { background: var(--lkr-gut); } .lkr-segment .lkr-z-weg { background: var(--lkr-weg); }
.lkr-segment .lkr-z-bau { background: var(--lkr-bau); } .lkr-segment .lkr-z-ruhe { background: var(--lkr-ruhe); }
.lkr-segment .lkr-z-aus { background: var(--lkr-aus); } .lkr-segment .lkr-z-bald { background: var(--lkr-bald); }
.lkr-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; }
.lkr-leute { display: grid; grid-template-columns: repeat(auto-fill, minmax(76px, 1fr)); gap: 8px; }
.lkr-leut { margin: 0; text-align: center; font-size: 12px; line-height: 1.25; min-width: 0; }
.lkr-leut svg { width: 40px; height: 46px; display: block; margin: 0 auto 2px; }
.lkr-leut small { display: block; color: var(--matt); font-size: 11px; }
.lkr-pgrund { fill: var(--mulde); stroke: var(--zf, var(--matt)); stroke-width: 2; }
.lkr-pkoerper { fill: var(--zf, var(--matt)); } .lkr-pkopf { fill: #e8c8a8; }
.lkr-pmuetze { fill: #2a3039; } .lkr-phelm { fill: var(--lk-gelb, #f2c531); } .lkr-pwerkzeug { fill: none; stroke: var(--text); stroke-width: 2.2; stroke-linecap: round; }
.lkr-pkrawatte { fill: var(--lk-eilig); } .lkr-ptisch { fill: var(--matt); } .lkr-ppunkt { fill: var(--zf, var(--matt)); stroke: var(--karte); stroke-width: 1.5; }
.lkr-person.lkr-z-gut { --zf: var(--lkr-gut); } .lkr-person.lkr-z-weg { --zf: var(--lkr-weg); } .lkr-person.lkr-z-bau { --zf: var(--lkr-bau); }
.lkr-person.lkr-z-ruhe { --zf: var(--lkr-ruhe); } .lkr-person.lkr-z-aus { --zf: var(--lkr-aus); } .lkr-person.lkr-z-bald { --zf: var(--lkr-bald); }

/* ── Bautrupps ── */
.lkr-truppraster { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; }
.lkr-truppkarte { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 12px; align-items: center; padding: 10px;
                  background: var(--karte); border: 1px solid var(--rand); border-radius: 12px; font-size: 13.5px; min-width: 0; }
.lkr-truppkarte > div { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.lkr-truppkopf { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.lkr-trupp { width: 110px; height: auto; }
.lkr-erde { fill: color-mix(in srgb, #8a6a3c 40%, var(--mulde)); } .lkr-kette { fill: #2a3039; } .lkr-bagger { fill: var(--lk-gelb, #f2c531); }
.lkr-baggerhaus { fill: color-mix(in srgb, var(--lk-gelb, #f2c531) 70%, #000); } .lkr-armlinie { fill: none; stroke: var(--lk-gelb, #f2c531); stroke-width: 3.5; stroke-linejoin: round; }
.lkr-schaufel { fill: #2a3039; } .lkr-haufen { fill: color-mix(in srgb, #8a6a3c 70%, var(--karte)); }
.lkr-geruest { fill: none; stroke: var(--matt); stroke-width: 1.6; } .lkr-geruestlinie { fill: none; stroke: var(--matt); stroke-width: 1; }
.lkr-strich { fill: none; stroke: var(--text); stroke-width: 1.5; opacity: .5; }
.lkr-haus { fill: color-mix(in srgb, var(--lk-trupp) 22%, var(--karte)); stroke: var(--lk-trupp); stroke-width: 1.2; }
.lkr-dach2 { fill: var(--lk-trupp); } .lkr-tuer { fill: var(--mulde); stroke: var(--matt); } .lkr-bank { fill: var(--matt); }
.lkr-kreuz { fill: var(--lk-eilig); } .lkr-sonne { fill: var(--lk-gelb, #f2c531); }
.lkr-truppfahrt .lkr-mkasten { fill: var(--lk-trupp); } .lkr-truppfahrt .lkr-mkabine { fill: color-mix(in srgb, var(--lk-trupp) 70%, #000); }
@media (max-width: 560px) { .lkr-truppkarte { grid-template-columns: 86px minmax(0, 1fr); } .lkr-trupp { width: 86px; } }

/* ── rows: Touren · Börse · Spieler ── */
.lkr-zeilen { display: flex; flex-direction: column; gap: 8px; }
.lkr-zeile { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 12px;
             background: var(--karte); border: 1px solid var(--rand); border-left: 3px solid var(--c, var(--rand)); border-radius: 12px; min-width: 0; }
.lkr-zeile[data-schluessel] { cursor: pointer; }
.lkr-sym svg { width: 56px; height: auto; display: block; }
.lkr-sym .lkr-kistebild, .lkr-sym .lkr-spielerbild { width: 36px; margin: 0 auto; }
.lkr-zmitte { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: 14px; overflow-wrap: anywhere; }
.lkr-rechts { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 5px; }
.lkr-kistenstreifen { fill: rgba(0, 0, 0, .25); } .lkr-sp1 { fill: var(--lk-spieler); }
@media (max-width: 560px) {
  .lkr-zeile { grid-template-columns: 44px minmax(0, 1fr); }
  .lkr-sym svg { width: 44px; }
  .lkr-rechts { grid-column: 2; justify-content: flex-start; }
}

/* ── Fahrer unterwegs ── */
.lkr-fhreihe { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: center; margin: 10px 0 4px; }
.lkr-fhring { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; }
.lkr-fhbild { margin: 0; }
.lkr-fhbild svg { max-height: 150px; }
.lkr-fahrtraster { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 10px; }
.lkr-fahrt { display: flex; flex-direction: column; gap: 4px; padding: 12px; background: var(--karte); border: 1px solid var(--rand);
             border-radius: 12px; cursor: pointer; min-width: 0; font-size: 14px; }
.lkr-fkopf { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }
.lkr-fahrt svg { width: 100%; height: auto; display: block; }
.lkr-forte { display: flex; justify-content: space-between; font-size: 12px; color: var(--matt); }
.lkr-zweck { font-style: normal; font-weight: 600; color: var(--lk-haendler); }
@media (max-width: 560px) { .lkr-fhreihe { grid-template-columns: 1fr; } }

/* ── „Wie reich ist der Händler?" (inside .live-reich of the page) ── */
.lkr-tacho { width: 100%; height: auto; display: block; overflow: visible; }
.lkr-tbahn { fill: none; stroke: var(--rand); stroke-width: 16; stroke-linecap: round; }
.lkr-tzone { fill: none; stroke-width: 6; stroke-opacity: .55; }
.lkr-tglut { fill: none; stroke-width: 12; stroke-linecap: round; stroke-opacity: .9; }
.lkr-tstrich { stroke: var(--matt); stroke-width: 1.4; opacity: .7; }
.lkr-tnull { stroke: var(--text); stroke-width: 2.4; }
.lkr-tnullwort { fill: var(--matt); font-size: 11px; font-weight: 700; }
.lkr-tnadel { stroke: var(--text); stroke-width: 3.2; stroke-linecap: round; }
.lkr-tnabe { fill: var(--grund, #0f1318); stroke: var(--text); stroke-width: 2; }
.lkr-rtext h3 { margin: 0 0 4px; font-size: 15px; color: var(--matt); font-weight: 600; }
.lkr-rzahl { display: block; font-size: clamp(1.6rem, 4.2vw, 2.4rem); line-height: 1.1; font-variant-numeric: tabular-nums; }
.lkr-rpfeil { margin: 6px 0 0; font-weight: 700; font-size: 14px; display: flex; align-items: center; gap: 6px; }
.lkr-rpfeil svg { width: 11px; height: 11px; }
.lkr-rstand { margin: 6px 0 0; color: var(--matt); font-size: 13px; }
.lkr-rlinie span { display: block; color: var(--matt); font-size: 12px; margin-bottom: 4px; }
.lkr-rlinie svg { width: 100%; height: 72px; display: block; overflow: visible; }
.lkr-rstrecke { fill: none; stroke-width: 2.4; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.lkr-rflaeche { opacity: .14; }
.lkr-rnull { stroke: var(--matt); stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; }
@media (max-width: 760px) {
  .lkr-tacho { max-width: 240px; margin: 0 auto; }
  .lkr-rpfeil { justify-content: center; }
  .lkr-rlinie { text-align: left; }
}

/* ── rueck2 01.10.2026 (lane B-RUECK2-hp): the teardown made visible — a building site in reverse.
   Colour = the page's own --lk-eilig token (light + dark come with it); the build stays yellow/--lk-trupp. ── */
.lkr-c-rueck { --c: var(--lk-eilig); }
.lkr-b-rueck { --c: var(--lk-eilig); }
.lkr-gb-z-rueck, .lkr-gb-mitrueck { border-color: color-mix(in srgb, var(--lk-eilig) 55%, var(--rand)); }
.lkr-gb-z-rueck { border-style: dashed; }
.lkr-rb-pz { font-size: 13px; color: var(--lk-eilig); font-variant-numeric: tabular-nums; white-space: nowrap; }
.lkr-gb .lkr-pzzeile, .lkr-rbkarte .lkr-pzzeile { display: flex; align-items: center; gap: 8px; align-self: stretch; }
.lkr-gb .lkr-pzzeile .lkr-balken, .lkr-rbkarte .lkr-pzzeile .lkr-balken { flex: 1 1 auto; min-width: 36px; }
.lkr-abarten .lkr-c-rueck { margin-left: 8px; }
.lkr-rbbild .lkr-rb-rest { opacity: .9; }
.lkr-rb-weg { fill: var(--mulde); }
.lkr-rb-kante { fill: none; stroke: var(--lk-eilig); stroke-width: 1.4; stroke-dasharray: 3 2; }
.lkr-rb-schutt { fill: color-mix(in srgb, #8a6a3c 55%, var(--matt)); stroke: color-mix(in srgb, #8a6a3c 70%, #000); stroke-width: .8; }
.lkr-rb-arm { fill: none; stroke: var(--lk-gelb, #f2c531); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.lkr-rb-meissel { fill: var(--text); }
.lkr-rueckbau { margin: 0 0 12px; padding: 12px; border: 1px dashed color-mix(in srgb, var(--lk-eilig) 60%, var(--rand)); border-radius: 12px;
                background: color-mix(in srgb, var(--lk-eilig) 6%, var(--karte)); }
.lkr-rueckbau .lkr-h4 { margin: 0 0 4px; color: var(--lk-eilig); }
.lkr-rueckbau .lkr-unter { margin: 0 0 10px; }
.lkr-rbraster { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 10px; }
.lkr-rbkarte { display: grid; grid-template-columns: 132px minmax(0, 1fr); gap: 10px; align-items: center; padding: 10px;
               border: 1px solid var(--rand); border-radius: 12px; background: var(--mulde); min-width: 0; }
.lkr-rbszene { width: 132px; height: auto; display: block; }
.lkr-rbtext { display: flex; flex-direction: column; gap: 4px; min-width: 0; align-items: flex-start; }
.lkr-rbtext .lkr-pzzeile { align-self: stretch; }
.lkr-rb-wand { fill: color-mix(in srgb, var(--lk-haendler) 26%, var(--karte)); stroke: var(--lk-haendler); stroke-width: 1.2; }
.lkr-rb-fuge { fill: var(--lk-haendler); opacity: .35; }
.lkr-rb-geist { fill: none; stroke: var(--matt); stroke-width: 1.2; stroke-dasharray: 4 3; opacity: .8; }
.lkr-rb-bruch { fill: none; stroke: var(--lk-eilig); stroke-width: 1.6; stroke-linejoin: round; }
.lkr-rb-mulde { fill: color-mix(in srgb, var(--lk-eilig) 70%, #000); }
.lkr-lpleg-rueck i { background: var(--lk-eilig); }
.lkr-wsabriss { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -6px 0 12px; }
.lkr-wsabrisse { margin: 0 0 12px; padding: 10px 12px; border: 1px dashed color-mix(in srgb, var(--lk-eilig) 60%, var(--rand)); border-radius: 12px;
                 background: color-mix(in srgb, var(--lk-eilig) 6%, var(--karte)); }
.lkr-wsabriss .lkr-pzzeile { display: flex; align-items: center; gap: 6px; flex: 1 1 140px; min-width: 140px; max-width: 280px; }
.lkr-wsabriss .lkr-pzzeile .lkr-balken { flex: 1 1 auto; min-width: 60px; }
.lkr-wsabrisse .lkr-wsabriss { margin: 0; }
.lkr-wsabrisse .lkr-wsabriss + .lkr-wsabriss { margin-top: 6px; }
@media (max-width: 420px) { .lkr-rbkarte { grid-template-columns: 1fr; } .lkr-rbszene { width: 100%; max-width: 220px; } }
@media (prefers-reduced-motion: no-preference) {
  .lkr-rb-arm2 { transform-box: fill-box; transform-origin: 0% 100%; animation: lkrMeissel 0.9s ease-in-out infinite alternate; }
}
@keyframes lkrMeissel { from { transform: rotate(0deg); } to { transform: rotate(-4deg); } }
