/* Plan-Baustein, hausweit (ADR-250, Raimund 18.09.2026) — Tokens, Ebenen, Bewegung an EINER Stelle.
 * CI-Farben (--tinte, --papier, --gelb, --gold …) kommen aus pms/_journal_stil.html. Hier nur die
 * Bildfarben der Zeichnung (freigegeben 18.09.2026) und die Plan-Maße. Stil „WH-Kombi“:
 * CAD-Linie oben · extrudierte Wände mit Schlagschatten · Render-Ebene (Material + Licht) darunter.
 */
:root{
  --plan-holz:#DCC29C; --plan-holz-fuge:#C7A97F; --plan-holz-maser:#CDB086; --plan-holz-dunkel:#A8845A;
  --plan-parkett:#E4CFAE; --plan-stein:#ECE8E1; --plan-fuge:#DAD4C9; --plan-fliese:#F3F1EC; --plan-kies:#E6E1D6;
  --plan-asphalt:#D9D6CF; --plan-wasser-hell:#BCD4D8; --plan-wasser-tief:#6F98A4; --plan-rasen:#C3CEA6;
  --plan-rasen-tief:#9AAB7C; --plan-baum:#7F9366; --plan-glut:#E8A23C;
  --plan-poche:var(--tinte); --plan-linie:var(--tinte); --plan-linie-stark:.5; --plan-linie-fein:.25;
  --plan-render-uebersicht:.38;   /* Render-Ebene in der Übersicht: gedämpft unter der Linie */
  --plan-dauer:.8s;
}
.abend{
  --plan-holz:#5A4833; --plan-holz-fuge:#4A3B2A; --plan-holz-maser:#52412F; --plan-holz-dunkel:#8C6B45;
  --plan-parkett:#4E4030; --plan-stein:#2B2823; --plan-fuge:#3A362F; --plan-fliese:#302D28; --plan-kies:#34302a;
  --plan-asphalt:#2a2723; --plan-wasser-hell:#35525A; --plan-wasser-tief:#4F7F8C; --plan-rasen:#34402A;
  --plan-rasen-tief:#56683F; --plan-baum:#46573A;
}
.plan-sprite{position:absolute;width:0;height:0;overflow:hidden}

/* ── Rahmen ──────────────────────────────────────────────────────────── */
.plan{margin:0;position:relative}
.plan-buehne{position:relative;overflow:hidden;border-radius:6px;background:var(--papier)}
.plan-buehne > svg{display:block;width:100%;height:auto;transform-origin:0 0;transition:transform var(--plan-dauer) cubic-bezier(.3,.7,.2,1)}
.plan-rollen{position:relative;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
@media (max-width:599px){.plan-breit .plan-buehne{min-width:760px}.plan-nur-quer{display:none}}
@media (min-width:600px){.plan-nur-hoch{display:none}}
.plan-ganz{position:absolute;right:64px;bottom:12px;cursor:pointer;z-index:2;background:var(--papier)}
.plan-ganz[hidden]{display:none}
.plan-zoom{position:absolute;right:10px;bottom:10px;z-index:2;display:flex;flex-direction:column;gap:6px}
.plan-zoom[hidden]{display:none}
.plan-szenen{margin-top:8px;font-family:var(--serif);font-size:15px;color:var(--mut)}
.plan-szenen summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-family:var(--sans);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--tinte)}
.plan-szenen ul{margin:0 0 0 1.1em;padding:0}
.plan-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.plan-zoom-k{width:44px;height:44px;border-radius:50%;border:1px solid var(--linie2);background:var(--papier);color:var(--tinte);font:500 22px/1 var(--sans);cursor:pointer;box-shadow:0 1px 2px rgba(20,20,20,.12)}
.plan-zoom-k:focus-visible{outline:2px solid var(--tinte);outline-offset:2px}
/* Ein Finger scrollt die Seite, zwei Finger zoomen; im Zoom verschiebt ein Finger den Plan. */
.plan-buehne{touch-action:pan-x pan-y}
.plan-gezoomt .plan-buehne{touch-action:none;cursor:grab}
/* Detailstufe: Faktzeilen der Mehrzeilen-Bänder erst, wenn sie lesbar sind (plan.js setzt plan-nah). */
.plan-js:not(.plan-nah) .plan-band-block .zeile{display:none}
.plan-js:not(.plan-nah) .plan-band-block rect{display:none}
.plan-band-block .kurz{display:none}
.plan-js:not(.plan-nah) .plan-band-block .kurz{display:inline}
.plan-kopf{display:grid;grid-template-columns:auto 1fr;gap:10px 18px;align-items:center;border-top:1.5px solid var(--tinte);margin-top:10px;padding-top:8px}
.plan-kopf .marke{display:flex;flex-direction:column;gap:3px;align-items:flex-start}
.plan-kopf .marke img{width:96px;height:auto}
.abend .plan-kopf .marke img{filter:brightness(0) invert(1)}
.plan-kopf .marke span,.plan-kopf dt{font-family:var(--sans);font-size:8.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--mut)}
.plan-kopf dl{display:flex;flex-wrap:wrap;gap:6px 18px;margin:0}
.plan-kopf dd{margin:0;font-family:var(--sans);font-size:11px;font-weight:600;color:var(--tinte)}
.plan-kopf dd svg path{fill:var(--tinte)}
@media (max-width:599px){.plan-kopf{grid-template-columns:1fr}}
.plan figcaption{font-family:var(--sans);font-size:10px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);margin-top:8px}

/* ── Ebenen ──────────────────────────────────────────────────────────── */
.plan-svg pattern[id^="plan-raster"] path{fill:none;stroke:var(--linie);stroke-width:.3}
.plan-lage pattern[id^="plan-raster"] path{stroke-width:1.2}
.plan-cm pattern[id^="plan-raster"] path{stroke-width:1.5}
.plan-ly-achsen path{fill:none;stroke:var(--gold);stroke-width:.35;stroke-dasharray:6 2 1 2;opacity:.3;transform-box:fill-box;transform-origin:center}
.plan-cm .plan-ly-achsen path{stroke-width:2;stroke-dasharray:30 10 5 10}
.plan-lage .plan-ly-achsen{display:none}
/* Render-Ebene: Material gedämpft; der gewählte Raum voll (Linie → Render) */
.plan-ly-render [data-plan-g]{opacity:var(--plan-render-uebersicht);transition:opacity .6s}
.plan-ly-render [data-plan-g].an{opacity:1}
.plan-pt .m-holz{fill:url(#pm-holz-pt)}.plan-pt .m-parkett{fill:url(#pm-parkett-pt)}.plan-pt .m-stein{fill:url(#pm-stein-pt)}
.plan-pt .m-fliese{fill:url(#pm-fliese-pt)}.plan-pt .m-rasen{fill:url(#pm-rasen-pt)}.plan-pt .m-kies{fill:url(#pm-kies-pt)}
.plan-cm .m-holz{fill:url(#pm-holz-cm)}.plan-cm .m-parkett{fill:url(#pm-parkett-cm)}.plan-cm .m-stein{fill:url(#pm-stein-cm)}
.plan-cm .m-fliese{fill:url(#pm-fliese-cm)}.plan-cm .m-rasen{fill:url(#pm-rasen-cm)}.plan-cm .m-kies{fill:url(#pm-kies-cm)}
.plan-lage .m-holz{fill:url(#pm-holz-lage)}.plan-lage .m-rasen{fill:url(#pm-rasen-lage)}.plan-lage .m-kies{fill:url(#pm-kies-lage)}
.plan-lage .m-stein{fill:url(#pm-stein-lage)}.plan-lage .m-asphalt{fill:url(#pm-asphalt-lage)}.plan-lage .m-parkett{fill:url(#pm-parkett-lage)}
.plan-wasser{fill:url(#pw-tiefe);stroke:var(--papier);stroke-width:1;stroke-opacity:.8}
circle.plan-wasser{fill:url(#pw-tiefe-rund)}
/* Wände: Umgebungsverschattung am Wandfuß, Poché mit Schlagschatten, CAD-Strich */
.plan-ly-ao{fill:none;stroke:#141414;stroke-width:2.6;opacity:.16;filter:url(#pf-ao)}
.plan-ly-ao path,.plan-ly-ao polygon{fill:none;stroke:#141414}
.plan-cm .plan-ly-ao{stroke-width:22;filter:url(#pf-ao-cm)}
.plan-ly-poche{fill:var(--plan-poche);stroke:none;filter:url(#pf-schatten)}
.plan-ly-poche path,.plan-ly-poche polygon{fill:var(--plan-poche)}
.plan-cm .plan-ly-poche{filter:url(#pf-schatten-cm)}
.plan-lage .plan-ly-poche{filter:url(#pf-schatten-lage)}
.plan-ly-strich{fill:none;stroke:var(--plan-linie);stroke-width:var(--plan-linie-stark);stroke-dasharray:1;stroke-dashoffset:0}
.plan-ly-strich path,.plan-ly-strich polygon{fill:none}
.plan-cm .plan-ly-strich{stroke-width:2.5}
.plan-lage .plan-ly-strich{stroke-width:2.2}
.plan-ly-moebel{color:var(--plan-linie);opacity:.72}
.plan-ly-moebel path{stroke-width:var(--plan-linie-fein)}
.plan-ly-symbole{filter:url(#pf-moebel)}
.plan-ly-symbole [data-plan-g]{transition:opacity .5s}
/* Möbel-Bibliothek (ps-*): feine Umrisslinie über hellem Volumen */
.pm{fill:var(--papier);stroke:var(--plan-linie);stroke-width:2}
.pm-hell{fill:url(#pw-decke);stroke:var(--plan-linie);stroke-width:1.2}
.pm-kissen{fill:var(--papier);stroke:var(--plan-linie);stroke-width:1.2}
.pm-linie{fill:none;stroke:var(--plan-linie);stroke-width:1.4}
.pm-dunkel{fill:var(--plan-linie)}
.pm-stuhl{fill:var(--papier);stroke:var(--plan-linie);stroke-width:1.6}
.pm-fliese{fill:url(#pm-fliese-cm)}.pm-holz{fill:url(#pm-holz-cm)}
.pm-gelaender{stroke:var(--plan-linie);stroke-width:4}
.pm-wand{stroke:var(--plan-linie)}.pm-fenster{fill:none;stroke:var(--plan-linie);stroke-width:2}
.pm-blick{fill:none;stroke:var(--gold);stroke-width:2;stroke-dasharray:6 6}
.pm-berg{fill:none;stroke:var(--gold);stroke-width:3;stroke-linejoin:round}
.pm-buehne{fill:var(--plan-linie);opacity:.85}
.pm-tanz{fill:var(--plan-parkett)}.pm-tanz-feld{fill:var(--plan-holz-fuge)}
.pm-glut{opacity:.4}
.pm-zeichen{font-family:var(--sans);font-weight:600;font-size:40px;fill:var(--plan-linie);text-anchor:middle}
/* Effekte der Übersicht */
.plan-welle{fill:none;stroke:var(--papier);stroke-width:.7;stroke-opacity:.55;pointer-events:none}
.plan-glut{opacity:.35}
.plan-dampf path{fill:none;stroke:var(--mut);stroke-width:.7;stroke-linecap:round;opacity:0;pointer-events:none}
/* Detailstufe (lazy): voll, mit Licht */
.plan-ly-detail > [data-g]{opacity:0;transition:opacity .6s;pointer-events:none}
.plan-ly-detail > [data-g].an{opacity:1}

/* ── Maßketten, Maßstab, Beschriftung ────────────────────────────────── */
.plan-mass .linie,.plan-mass .strich{fill:none;stroke:var(--gold);stroke-width:.5}
.plan-cm .plan-mass .linie,.plan-cm .plan-mass .strich{stroke-width:2}
.plan-mass text{font-family:var(--sans);font-weight:600;letter-spacing:.04em;fill:var(--gold);text-anchor:middle;paint-order:stroke;stroke:var(--papier);stroke-width:2px;font-variant-numeric:tabular-nums}
.plan-mass{transform-box:fill-box;transform-origin:center}
.plan-massstab rect{fill:var(--tinte)}.plan-massstab rect.leer{fill:var(--papier);stroke:var(--tinte);stroke-width:.4}
.plan-massstab text{font-family:var(--sans);font-weight:600;fill:var(--tinte);text-anchor:middle}
.plan-name{font-family:var(--sans);font-weight:600;letter-spacing:.12em;text-transform:uppercase;fill:var(--tinte);text-anchor:middle;dominant-baseline:hanging;paint-order:stroke;stroke:var(--papier);stroke-width:1.6px;pointer-events:none}
.plan-cm .plan-name{stroke-width:6px}
@media (max-width:599px){.plan:not(.plan-breit) .plan-name{display:none}.plan .plan-raum.an .plan-name{display:inline}
  .plan .plan-name.plan-name-immer{display:inline}}
.plan-punkt .treffer{fill:transparent;stroke:none}

/* ── Räume, Punkte, Arten ────────────────────────────────────────────── */
.plan-raum{cursor:pointer;outline:none}
.plan-raum .flaeche{fill:var(--gelb);fill-opacity:0;stroke:var(--gelb);stroke-opacity:0;stroke-width:2;transition:fill-opacity .25s,stroke-opacity .25s}
.plan-cm .plan-raum .flaeche{stroke-width:8}
.plan-raum:hover .flaeche{fill-opacity:.08;stroke-opacity:.7}
.plan-raum:focus-visible .flaeche{stroke:var(--tinte);stroke-opacity:1}
.plan-raum.an .flaeche{fill-opacity:0;stroke-opacity:1;stroke-width:2.4}
.plan-cm .plan-raum.an .flaeche{stroke-width:9}
.plan-hat-wahl .plan-raum:not(.an) .plan-punkt{opacity:.5}
.plan-punkt .p{stroke:var(--papier);stroke-width:1.2}
.plan-punkt text{font-family:var(--sans);font-weight:600;text-anchor:middle;dominant-baseline:central;pointer-events:none}
.plan-punkt .ring{fill:none;stroke:var(--gelb);stroke-width:1.6;opacity:0}
.plan-cm .plan-punkt .p{stroke-width:4}.plan-cm .plan-punkt .ring{stroke-width:5}
.art-wasser .p,.plan-nr.art-wasser{fill:var(--plan-wasser-tief);background:var(--plan-wasser-tief);color:#fff}.art-wasser .plan-punkt text{fill:#fff}
.art-waerme .p,.plan-nr.art-waerme{fill:var(--gelb);background:var(--gelb);color:#141414}.art-waerme .plan-punkt text{fill:#141414}
.art-ruhe .p,.plan-nr.art-ruhe{fill:var(--papier);background:var(--papier);color:var(--tinte);box-shadow:inset 0 0 0 1.5px var(--tinte)}
.art-ruhe .p{stroke:var(--tinte)}.art-ruhe .plan-punkt text{fill:var(--tinte)}
.art-behandlung .p,.plan-nr.art-behandlung{fill:var(--tinte);background:var(--tinte);color:var(--papier)}.art-behandlung .plan-punkt text{fill:var(--papier)}
.art-genuss .p,.plan-nr.art-genuss{fill:var(--plan-holz-dunkel);background:var(--plan-holz-dunkel);color:#fff}.art-genuss .plan-punkt text{fill:#fff}
.art-tisch .p,.plan-nr.art-tisch{fill:var(--papier);background:var(--papier);color:var(--tinte);box-shadow:inset 0 0 0 1.5px var(--plan-holz-dunkel)}
.art-tisch .p{stroke:var(--plan-holz-dunkel)}.art-tisch .plan-punkt text{fill:var(--tinte)}
.art-draussen .p,.plan-nr.art-draussen{fill:var(--plan-rasen-tief);background:var(--plan-rasen-tief);color:#fff}.art-draussen .plan-punkt text{fill:#fff}
.art-service .p,.plan-nr.art-service{fill:var(--linie2);background:var(--linie2);color:var(--tinte)}.art-service .plan-punkt text{fill:var(--tinte)}
.plan-nr{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;font-family:var(--sans);font-size:10px;font-weight:600;font-variant-numeric:tabular-nums}
.plan-nr.art-tisch{border-radius:6px}

/* ── Fabelwesen und Lageplan ─────────────────────────────────────────── */
.plan-fuehrer{transition:transform .9s cubic-bezier(.3,1.25,.5,1);pointer-events:none}
.plan-blase{font-family:var(--sans);font-weight:600;letter-spacing:.1em;text-transform:uppercase;text-anchor:middle;fill:var(--tinte);paint-order:stroke;stroke:var(--papier);stroke-width:2px}
.abend .plan-svg .j-wesen,.abend .plan-lage image.doodle{filter:invert(.92) sepia(.35)}
.plan-band rect{fill:var(--gelb)}
.plan-band-block .zeile{font-weight:500;letter-spacing:.1em}
.plan-band text{font-family:var(--sans);font-weight:600;letter-spacing:.12em;text-transform:uppercase;fill:#141414;text-anchor:middle;dominant-baseline:middle}
.plan-strasse{fill:none;stroke:var(--plan-asphalt);stroke-linecap:round;stroke-linejoin:round}
.plan-strasse-rand{fill:none;stroke:var(--linie2);stroke-linecap:round;stroke-linejoin:round}
.plan-strasse-mitte{fill:none;stroke:var(--papier);stroke-dasharray:22 20;stroke-width:2.2}
.plan-bach{fill:none;stroke:var(--plan-wasser-hell);stroke-linecap:round}
.plan-bach-ufer{fill:none;stroke:var(--plan-rasen-tief);stroke-linecap:round;opacity:.45}
.plan-bach-fluss{fill:none;stroke:var(--papier);stroke-width:2.5;stroke-opacity:.8;stroke-dasharray:14 30;stroke-linecap:round}
.plan-baum{fill:var(--plan-baum);opacity:.85}
.plan-baum2{fill:var(--plan-rasen-tief)}
.plan-gelaende{fill:url(#pm-rasen-lage)}
.plan-hoehe{fill:none;stroke:var(--plan-rasen-tief);stroke-width:1.4;opacity:.35}
.plan-weg{fill:none;stroke:var(--papier);stroke-width:5;stroke-dasharray:2 9;stroke-linecap:round}
.plan-steg{fill:none;stroke:var(--tinte);stroke-width:12}.plan-steg2{fill:none;stroke:var(--papier);stroke-width:7}
.plan-dach{fill:var(--papier)}
.plan-dach-first{fill:none;stroke:var(--linie2);stroke-width:2}
.plan-schraffur{fill:url(#pm-parkett-lage);opacity:.35}
.plan-schematisch{fill:none;stroke:var(--gold);stroke-width:2.5;stroke-dasharray:10 8}
.plan-marke{cursor:pointer}
.plan-marke .punkt{fill:var(--gelb);stroke:var(--tinte);stroke-width:3}
.plan-marke .ring{fill:none;stroke:var(--gelb);stroke-width:5;opacity:0;transform-box:fill-box;transform-origin:center}
.plan-marke:hover .punkt,.plan-marke:focus-visible .punkt{fill:var(--tinte);stroke:var(--gelb)}
.plan-marke:focus-visible{outline:none}
.plan-marke text{font-family:var(--sans);font-weight:600;letter-spacing:.12em;text-transform:uppercase;fill:var(--tinte);paint-order:stroke;stroke:var(--papier);stroke-width:8px;stroke-linejoin:round}
.plan-marke .unter{fill:var(--gold);font-weight:500}
.plan-egg{cursor:pointer}
.plan-glas{fill:none;stroke:var(--plan-wasser-tief);stroke-width:2}
.plan-cm .plan-mass text{stroke-width:6px}.plan-cm .plan-massstab rect.leer{stroke-width:1.5}
.plan-cm .plan-blase{stroke-width:8px}.plan-lage .plan-blase{stroke-width:9px}
.plan-seil{fill:none;stroke:var(--mut);stroke-width:2;opacity:.6}
.plan-platz{stroke:var(--papier);stroke-width:4}
.plan-haus{filter:url(#pf-schatten-lage)}
.plan-dach{stroke:var(--tinte);stroke-width:3;stroke-linejoin:round}
.plan-lage .plan-raum .flaeche{stroke-width:8}
.plan-lage .plan-punkt .p{stroke-width:5}.plan-lage .plan-punkt .ring{stroke-width:7}
.plan-lage-klein{font-family:var(--sans);font-weight:500;letter-spacing:.1em;text-transform:uppercase;fill:var(--tinte);text-anchor:middle;paint-order:stroke;stroke:var(--papier);stroke-width:7px;stroke-linejoin:round}

/* ── Aufbau (CAD-Präsentation, ca. 3,4 s) und Auswahl ─────────────────── */
.plan-auf,.plan-punkt .ring,.plan-punkt .p,.plan-marke .ring,.plan-egg{transform-box:fill-box;transform-origin:center}
.plan-egg-fahrt{transform-box:view-box;transform-origin:0 0;offset-rotate:auto}
/* Blick der Datei gegen die Fahrtrichtung: vor dem Offset-Pfad spiegeln (transform wirkt davor, scale danach). */
.plan-egg-fahrt.spiegel{transform:scaleX(-1)}
/* Gäste (Stück 5): bleiben aufrecht (kein Mitdrehen am Weg), hin blicken sie nach Westen. */
.plan-egg-gehen{transform-box:view-box;transform-origin:0 0;offset-rotate:0deg;transform:scaleX(-1)}
@media (prefers-reduced-motion:reduce){.plan-buehne > svg,.plan-fuehrer,[data-plan-g],.plan-ly-detail > [data-g]{transition:none}}
@media (prefers-reduced-motion:no-preference){
  .plan-zeigt .plan-ly-raster{animation:plan-ein .5s ease-out both}
  .plan-zeigt .plan-ly-achsen path:first-child{animation:plan-achse-x .7s .1s ease-out both}
  .plan-zeigt .plan-ly-achsen path:last-child{animation:plan-achse-y .7s .2s ease-out both}
  .plan-zeigt .plan-ly-gelaende{animation:plan-ein .8s ease-out both}
  .plan-zeigt .plan-ly-strich{animation:plan-zeichnen 1.3s .25s ease-in-out both}
  .plan-zeigt .plan-ly-poche,.plan-zeigt .plan-ly-ao{animation:plan-heben .7s 1.2s ease-out both}
  .plan-zeigt .plan-ly-moebel,.plan-zeigt .plan-ly-symbole{animation:plan-ein .6s 1.55s ease-out both}
  .plan-zeigt .plan-ly-render{animation:plan-ein .8s 1.7s ease-out both}
  .plan-zeigt .plan-auf{animation:plan-auf 1.1s 1.6s cubic-bezier(.2,.7,.2,1) both}
  .plan-zeigt .plan-ly-oben{animation:plan-ein .7s 2s ease-out both}
  .plan-zeigt .plan-mass{animation:plan-mass-x .6s both;animation-delay:calc(2.1s + var(--i) * .15s)}
  .plan-zeigt .plan-mass.senkrecht{animation-name:plan-mass-y}
  .plan-zeigt .plan-massstab{animation:plan-ein .5s 2.1s both}
  .plan-zeigt .plan-punkt,.plan-zeigt .plan-name{animation:plan-rein .5s cubic-bezier(.3,1.4,.5,1) both;animation-delay:calc(2.35s + var(--i) * 70ms)}
  .plan-zeigt .plan-ly-marken{animation:plan-ein .6s 2.4s both}
  .plan-zeigt .plan-fuehrer .j-wesen{animation:plan-ein .5s 3s both}
  .plan-raum.an .plan-punkt .ring,.plan-marke .ring{animation:plan-puls 2.2s ease-out infinite}
  .plan-raum.an .plan-punkt .p{animation:plan-hueb .35s ease-out both}
  .plan-fuehrer.huepft .j-wesen{animation:plan-huepf .9s ease-out}
  .plan-welle{animation:plan-welle 3.2s linear infinite}
  .plan-glut{animation:plan-glut 1.7s ease-in-out infinite alternate}
  .plan-dampf path{animation:plan-dampf 3.6s ease-in-out infinite}
  .plan-dampf path:nth-child(2){animation-delay:1.2s}.plan-dampf path:nth-child(3){animation-delay:2.4s}
  .plan-bach-fluss{animation:plan-fluss 3s linear infinite}
  /* Easter Eggs (Lageplan): dosiert, nur ohne reduzierte Bewegung */
  .plan-egg-gondel{animation:plan-gondel 26s ease-in-out infinite alternate}
  .plan-egg-fahrt{animation:plan-fahrt var(--takt,34s) linear infinite;animation-delay:var(--vorsprung,0s)}
  .plan-egg-fahrt.west{animation-direction:reverse}
  .plan-egg-gehen{animation:plan-fahrt var(--takt,70s) linear infinite,plan-blick var(--takt,70s) linear infinite;
    animation-delay:var(--vorsprung,0s),var(--vorsprung,0s)}
  /* Gassi: der Mensch geht gleichmäßig, der Hund läuft am Bach davon und wird wieder eingeholt. */
  .plan-egg-gehen.gassi{animation:plan-fahrt var(--takt) linear infinite,plan-blick-gassi var(--takt) linear infinite}
  .plan-egg-gehen.gassi-hund{animation:plan-hund var(--takt) linear infinite,plan-blick-gassi var(--takt) linear infinite}
  .plan-egg-gehen.reiten{animation:plan-fahrt var(--takt) linear infinite,plan-blick-reiten var(--takt) linear infinite}
  .plan-egg-pfote{animation:plan-pfote 7s ease-in-out infinite;opacity:0}
  .plan-egg-pferd{animation:plan-trab 1.1s ease-in-out infinite alternate}
  .plan-egg.hallo{animation:plan-hallo .8s cubic-bezier(.3,1.6,.5,1)}
}
@keyframes plan-ein{from{opacity:0}}
@keyframes plan-heben{from{opacity:0;transform:translate(-1px,-1px)}}
@keyframes plan-zeichnen{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes plan-achse-x{from{transform:scaleX(0);opacity:.9}}
@keyframes plan-achse-y{from{transform:scaleY(0);opacity:.9}}
@keyframes plan-mass-x{from{transform:scaleX(0);opacity:0}}
@keyframes plan-mass-y{from{transform:scaleY(0);opacity:0}}
@keyframes plan-auf{from{transform:scale(0)}to{transform:scale(1)}}
@keyframes plan-rein{from{opacity:0;transform:scale(.3)}to{opacity:1;transform:none}}
@keyframes plan-puls{0%{opacity:.9;transform:scale(.8)}100%{opacity:0;transform:scale(2.4)}}
@keyframes plan-hueb{from{transform:scale(1)}to{transform:scale(1.25)}}
@keyframes plan-huepf{0%,100%{transform:translateY(0)}40%{transform:translateY(-6px)}}
@keyframes plan-welle{to{transform:translateX(20px)}}
@keyframes plan-glut{from{opacity:.2}to{opacity:.6}}
@keyframes plan-dampf{0%{opacity:0;transform:translateY(4px)}35%{opacity:.6}100%{opacity:0;transform:translateY(-14px)}}
@keyframes plan-fluss{to{stroke-dashoffset:-88}}
@keyframes plan-gondel{from{transform:translate(0,0)}to{transform:translate(var(--gx,120px),var(--gy,-60px))}}
@keyframes plan-fahrt{from{offset-distance:0%}to{offset-distance:100%}}
@keyframes plan-blick{0%,49.9%{transform:scaleX(-1)}50%,100%{transform:none}}
/* Gassi-Runde (lageplan.GASSI_WEG): bis 18 % nach Süden, am Bach nach Westen, zurück nach Osten. */
@keyframes plan-blick-gassi{0%,17.9%{transform:none}18%,56.9%{transform:scaleX(-1)}57%,100%{transform:none}}
@keyframes plan-hund{0%{offset-distance:3%}25%{offset-distance:28%}40%{offset-distance:52%}55%{offset-distance:58%}100%{offset-distance:103%}}
/* Reitplatz-Runde: erst Ost und Süd (Blick rechts), dann West und Nord. */
@keyframes plan-blick-reiten{0%,50.4%{transform:none}50.5%,100%{transform:scaleX(-1)}}
@keyframes plan-pfote{0%,100%{opacity:0}20%,60%{opacity:.9}}
@keyframes plan-hallo{0%{transform:scale(1)}40%{transform:scale(1.25)}100%{transform:scale(1)}}
@keyframes plan-trab{from{transform:translateY(0)}to{transform:translateY(-4px)}}