/* EFD-Ablauf sanierungsfahrplan: eingefrorener Stand 06.11.2026 (isfp-animiert.html), abgegrenzt auf #was-ich-mache. Erzeugt von pruefung/ablaeufe-live-20261106/werkzeuge/ablaeufe_einsetzen.py */ #was-ich-mache :where(h2,h3,p,ul,ol,li,dl,dt,dd,figure,button,summary,details,aside,small,strong,b,i){all:revert} #was-ich-mache{--bg:#FFFFFF;--bg-alt:#FAFAFA;--bg-deep:#F2F2F2; --border:#E0E0E0;--border-soft:#EBEBEB;--border-strong:#77746D; --text:#1F1F1F;--text-2:#56534D; --akzent:#E3B11A;--akzent-text:#7D5D00; --papier:#FFFFFF;--schatten:rgba(31,31,31,.10); --sk:#2B2A27;--poche:#E6E4DF; --mono:"IBM Plex Mono",ui-monospace,monospace; color-scheme:light;} #was-ich-mache *,#was-ich-mache *::before,#was-ich-mache *::after{box-sizing:border-box} #was-ich-mache{-webkit-text-size-adjust:100%} #was-ich-mache{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif;font-size:17px;line-height:1.55;-webkit-font-smoothing:antialiased} #was-ich-mache :focus-visible{outline:2px solid var(--text);outline-offset:3px} #was-ich-mache a{color:inherit} #was-ich-mache .huelle{max-width:1440px;margin:0 auto;padding-inline:clamp(16px,5vw,72px)} #was-ich-mache .ic{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1;stroke-linecap:round;stroke-linejoin:round} #was-ich-mache .kopf{height:64px;border-bottom:1px solid var(--border-soft)} #was-ich-mache .kopf .huelle{display:flex;align-items:center;height:100%} #was-ich-mache .kopf__logo{display:flex;align-items:center;min-height:44px} #was-ich-mache .kopf__logo svg{height:32px;width:auto;display:block} #was-ich-mache .symbol .cls-1{fill:var(--text)} #was-ich-mache .symbol .cls-2{fill:#E3B11A} #was-ich-mache .raster{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:64px;align-items:start} #was-ich-mache h2{margin:0;font-size:34px;line-height:1.12;letter-spacing:-.02em;font-weight:750;text-wrap:balance} #was-ich-mache .antwort{margin:14px 0 0;max-width:560px;font-size:18px;line-height:1.5;color:var(--text-2)} #was-ich-mache figure{margin:0} #was-ich-mache .haus{display:block;width:100%;height:auto} #was-ich-mache .schritte{list-style:none;margin:0;padding:0} #was-ich-mache .schritte li{min-width:0} #was-ich-mache .s-nr{display:inline-grid;place-items:center;width:30px;height:30px;flex:none;border:1px solid var(--akzent);border-radius:6px;font:600 12.5px/1 var(--mono);color:var(--akzent-text)} #was-ich-mache .s-titel{margin:0;font-size:17px;line-height:1.3;font-weight:650} #was-ich-mache .s-meta{margin:4px 0 0;display:flex;flex-wrap:wrap;gap:4px 12px;font:500 12.5px/1.35 var(--mono);color:var(--text-2)} #was-ich-mache .s-zeit{color:var(--akzent-text)} #was-ich-mache .s-txt{margin:8px 0 0;font-size:14.5px;line-height:1.5;color:var(--text-2)} #was-ich-mache .mk rect{fill:#E3B11A} #was-ich-mache .mk text{font:600 12px var(--mono);fill:#1F1F1F;text-anchor:middle} #was-ich-mache .mk--plan rect{fill:#FFFFFF;stroke:#2B2A27;stroke-width:1.2} #was-ich-mache .gold{fill:rgba(227,177,26,.35);stroke:#B8890A;stroke-width:1.2} #was-ich-mache .gold-voll{fill:#E3B11A;stroke:#B8890A;stroke-width:1} #was-ich-mache .brief rect{fill:#FFFFFF;stroke:#2B2A27;stroke-width:1.2} #was-ich-mache .brief path{fill:none;stroke:#2B2A27;stroke-width:1.2;stroke-linejoin:round} #was-ich-mache .brief--gold rect{fill:rgba(227,177,26,.35);stroke:#B8890A} #was-ich-mache .sk-label{font:500 10.5px var(--mono);fill:#56534D;text-anchor:middle;letter-spacing:.06em} #was-ich-mache .huelle-auf{fill:none;stroke:#C9980E;stroke-width:1.4;stroke-dasharray:5 5} #was-ich-mache .leit,#was-ich-mache .leit5 path{fill:none;stroke:#77746D;stroke-width:1} #was-ich-mache .quittung-ort{position:relative;padding-top:10px} #was-ich-mache .quittung-ort::before{content:"";position:absolute;left:-8px;right:-8px;top:0;height:10px;border-radius:5px;background:var(--text);z-index:2} #was-ich-mache .quittung-papier{margin-inline:4px;filter:drop-shadow(0 1px 0 var(--border)) drop-shadow(0 10px 18px var(--schatten))} #was-ich-mache .quittung{--zz:7px;background:var(--papier);padding:16px 18px calc(18px + var(--zz));font-size:14px;line-height:1.45; -webkit-mask:linear-gradient(#000 0 0) top/100% calc(100% - var(--zz)) no-repeat,conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(2*var(--zz)) var(--zz) repeat-x; mask:linear-gradient(#000 0 0) top/100% calc(100% - var(--zz)) no-repeat,conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(2*var(--zz)) var(--zz) repeat-x} #was-ich-mache .quittung h3{display:flex;align-items:center;gap:10px;margin:0;font:600 11.5px/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;padding-bottom:12px;border-bottom:1px dashed var(--border-strong)} #was-ich-mache .quittung h3 .ic{color:var(--akzent-text)} #was-ich-mache .quittung dl,#was-ich-mache .quittung ul{margin:0;padding:0} #was-ich-mache .q-block{padding-block:10px;border-bottom:1px dashed var(--border-strong)} #was-ich-mache .q-block:last-child{border-bottom:0;padding-bottom:0} #was-ich-mache .q-abschnitt{margin:0 0 6px;font:500 10.5px/1.3 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--text-2)} #was-ich-mache .q-zeile{display:flex;align-items:baseline;gap:8px} #was-ich-mache .q-zeile + .q-zeile{margin-top:3px} #was-ich-mache .q-zeile dt{flex:0 1 auto} #was-ich-mache .q-zeile::after{content:"";order:2;flex:1 1 10px;border-bottom:1px dotted var(--border-strong);transform:translateY(-4px);min-width:10px} #was-ich-mache .q-zeile dd{order:3;flex:none;margin:0;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap} #was-ich-mache .q-zeile--summe{font-size:16px} #was-ich-mache .q-zeile--summe dd{font-weight:800;font-size:19px} #was-ich-mache .q-liste{display:grid;gap:4px;list-style:none} #was-ich-mache .q-liste li{display:grid;grid-template-columns:14px 1fr;gap:9px;align-items:start} #was-ich-mache .q-liste li::before{content:"";width:12px;height:12px;margin-top:4px;border:1px solid var(--border-strong);border-radius:3px} #was-ich-mache .q-liste--haken li::before{background:var(--akzent);border-color:var(--akzent)} #was-ich-mache .q-zeit{font-family:var(--mono);font-size:13px} #was-ich-mache .q-text{margin:0} #was-ich-mache .q-fuss{font-weight:600} #was-ich-mache .q-zeile--lang dd{flex:0 1 auto;white-space:normal;text-align:right} #was-ich-mache .isfp{padding-block:40px 72px} #was-ich-mache .vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0} #was-ich-mache .zs-kopf{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-top:30px} #was-ich-mache .zs-gesamt{margin:0;font-size:19px;line-height:1.3;color:var(--text-2);text-wrap:balance} #was-ich-mache .zs-gesamt strong{font-size:24px;font-weight:750;letter-spacing:-.01em;color:var(--text)} #was-ich-mache .zs-wahl{display:flex;flex:none;margin-right:-8px} #was-ich-mache .zs-wahl[hidden]{display:none} #was-ich-mache .zs-wahl button{display:grid;place-items:center;width:44px;height:44px;margin:0;padding:0;border:0;background:none;cursor:pointer} #was-ich-mache .zs-wahl span{display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--border-strong);border-radius:6px;background:var(--bg);font:600 12px/1 var(--mono);color:var(--text-2)} #was-ich-mache .zs-wahl button:hover span{border-color:var(--akzent)} #was-ich-mache .zs-wahl button[aria-current="true"] span{border-color:var(--akzent);background:var(--akzent);color:#1F1F1F} #was-ich-mache .zs-wahl button:focus-visible{outline:2px solid var(--text);outline-offset:-2px} #was-ich-mache .zs-phase{min-width:0;margin-top:22px} #was-ich-mache .zs-titel{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:0;font-size:15px;line-height:1.3} #was-ich-mache .zs-pnr{font:600 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--akzent-text)} #was-ich-mache .zs-meta{font-size:13px;color:var(--text-2)} #was-ich-mache .zs-scroll{margin-top:4px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin} #was-ich-mache .zs{position:relative;padding:6px 30px 0} @media (max-width:980px){#was-ich-mache #sfp-phase-1 .zs{min-width:900px}} #was-ich-mache .zs-marken{position:relative;height:56px} #was-ich-mache .ab-schritt{position:absolute;bottom:10px;isolation:isolate;display:block;padding:7px;border-radius:10px;color:var(--text);text-decoration:none;transform:translateX(-50%);transition:transform .45s ease} #was-ich-mache .ab-schritt::before{content:"";position:absolute;inset:0;z-index:-1;border:1px solid var(--border);border-radius:10px;background:var(--bg);box-shadow:0 8px 20px rgba(31,31,31,.08);opacity:0;transition:opacity .45s ease} #was-ich-mache .ab-schritt::after{content:"";position:absolute;left:50%;top:100%;width:1px;height:10px;background:var(--border-strong)} #was-ich-mache .ab-schritt:focus-visible{outline:2px solid var(--text);outline-offset:3px} #was-ich-mache .ab-nr{position:relative;isolation:isolate;display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--akzent);border-radius:6px;background:var(--bg);font:600 12.5px/1 var(--mono);color:#1F1F1F} #was-ich-mache .ab-nr::before{content:"";position:absolute;inset:-1px;z-index:-1;border-radius:6px;background:var(--akzent);transition:opacity .35s ease} #was-ich-mache .ab-haken{position:absolute;inset:0;margin:auto;width:20px;height:20px;fill:none;stroke:#1F1F1F;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;transition:opacity .35s ease} #was-ich-mache .ab-zahl{opacity:0;transition:opacity .25s ease} #was-ich-mache .ab-schritt:hover .ab-nr{border-color:var(--akzent)} #was-ich-mache .anim .ab-schritt:not(.ist-fertig) .ab-haken{opacity:0} #was-ich-mache .anim .ab-schritt:not(.ist-fertig) .ab-zahl{opacity:1} #was-ich-mache .anim .ab-schritt:not(.ist-fertig):not(.ist-aktiv) .ab-nr{border-color:var(--border-strong);color:var(--text-2)} #was-ich-mache .anim .ab-schritt:not(.ist-fertig):not(.ist-aktiv) .ab-nr::before{opacity:0} #was-ich-mache .anim .ab-schritt:not(.ist-fertig):not(.ist-aktiv):hover .ab-nr{border-color:var(--akzent)} #was-ich-mache .anim .ab-schritt.ist-aktiv{transform:translate(-50%,-3px)} #was-ich-mache .anim .ab-schritt.ist-aktiv::before{opacity:1} #was-ich-mache .zs-oben,#was-ich-mache .zs-unten{position:relative;font:500 11px/1.3 var(--mono);color:var(--akzent-text)} #was-ich-mache .zs-oben{height:20px} #was-ich-mache .zs-oben span{position:absolute;top:2px;display:flex;justify-content:center;white-space:nowrap} #was-ich-mache .zs-achse{position:relative;height:16px;overflow-x:clip} #was-ich-mache .zs-achse>*{position:absolute;top:0;height:16px} #was-ich-mache .zs-seg{background:#E0E0E0;border-left:2px solid var(--bg)} #was-ich-mache .zs-gold{background:var(--akzent);border-left:2px solid var(--bg);transform-origin:left center} #was-ich-mache .zs-duenn{top:7px!important;height:2px!important;border-left:0} #was-ich-mache .zs-spanne.zs-seg{background:repeating-linear-gradient(135deg,#D3D1CC 0 2px,transparent 2px 6px);box-shadow:inset 0 0 0 1px #E0E0E0} #was-ich-mache .zs-spanne.zs-gold{background:repeating-linear-gradient(135deg,#E3B11A 0 2px,#F6E4AC 2px 6px)} #was-ich-mache .zs-bahn{inset:0;width:100%;pointer-events:none;display:none} #was-ich-mache .anim .zs-bahn{display:block} #was-ich-mache .zs-laeufer{position:absolute;left:-1px;top:-7px;width:2px;height:30px;background:#1F1F1F} #was-ich-mache .zs-unten{height:36px;color:var(--text-2)} #was-ich-mache .zs-unten span{position:absolute;top:5px;display:flex;justify-content:center;padding-top:9px;white-space:nowrap} #was-ich-mache .zs-unten span::before{content:"";position:absolute;left:2px;right:2px;top:0;height:5px;border:1px solid var(--border-strong);border-top:0} #was-ich-mache .anim .zs-phasen{display:grid;grid-template-columns:minmax(0,1fr);overflow-x:clip} #was-ich-mache .anim .zs-phase{grid-area:1/1;opacity:0;visibility:hidden;transform:translateX(64px);transition:opacity .6s ease,transform .6s ease,visibility 0s linear .6s} #was-ich-mache .anim .zs-phase.weg-links{transform:translateX(-64px)} #was-ich-mache .anim .zs-phase.ist-phase{opacity:1;visibility:visible;transform:none;transition-delay:0s} @media (max-width:760px){#was-ich-mache .zs-kopf{flex-direction:column;align-items:flex-start;gap:6px} #was-ich-mache .zs-jahr:not(.zs-jahr5){color:transparent}} #was-ich-mache .zs .l0_0{left:0.0%} #was-ich-mache .zs .l100_0{left:100.0%} #was-ich-mache .zs .l13_333{left:13.333%} #was-ich-mache .zs .l17_949{left:17.949%} #was-ich-mache .zs .l20_0{left:20.0%} #was-ich-mache .zs .l23_077{left:23.077%} #was-ich-mache .zs .l26_667{left:26.667%} #was-ich-mache .zs .l28_205{left:28.205%} #was-ich-mache .zs .l33_333{left:33.333%} #was-ich-mache .zs .l35_897{left:35.897%} #was-ich-mache .zs .l40_0{left:40.0%} #was-ich-mache .zs .l46_154{left:46.154%} #was-ich-mache .zs .l46_667{left:46.667%} #was-ich-mache .zs .l53_333{left:53.333%} #was-ich-mache .zs .l53_846{left:53.846%} #was-ich-mache .zs .l5_128{left:5.128%} #was-ich-mache .zs .l60_0{left:60.0%} #was-ich-mache .zs .l66_667{left:66.667%} #was-ich-mache .zs .l6_667{left:6.667%} #was-ich-mache .zs .l71_795{left:71.795%} #was-ich-mache .zs .l73_333{left:73.333%} #was-ich-mache .zs .l80_0{left:80.0%} #was-ich-mache .zs .l82_051{left:82.051%} #was-ich-mache .zs .l86_667{left:86.667%} #was-ich-mache .zs .l89_744{left:89.744%} #was-ich-mache .zs .l93_333{left:93.333%} #was-ich-mache .zs .w100_0{width:100.0%} #was-ich-mache .zs .w10_256{width:10.256%} #was-ich-mache .zs .w17_949{width:17.949%} #was-ich-mache .zs .w33_333{width:33.333%} #was-ich-mache .zs .w35_897{width:35.897%} #was-ich-mache .zs .w5_128{width:5.128%} #was-ich-mache .zs .w66_667{width:66.667%} #was-ich-mache .zs .w6_667{width:6.667%} #was-ich-mache .buehne{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,380px);gap:40px;align-items:start;margin-top:28px} #was-ich-mache .i1-bild{margin:0 auto;width:100%;max-width:420px} #was-ich-mache .erkl{padding:20px 22px;border-radius:10px;background:var(--bg-alt)} #was-ich-mache .erkl-liste li{display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:14px;padding-block:14px;border-top:1px solid var(--border)} #was-ich-mache .erkl-liste li:first-child{padding-top:0;border-top:0} #was-ich-mache .erkl-liste li:last-child{padding-bottom:0} #was-ich-mache .erkl-liste .s-nr{grid-row:1/4} #was-ich-mache .erkl-liste .s-txt{margin-top:6px;font-size:14.5px} #was-ich-mache .s-wer{color:var(--text)} #was-ich-mache .anim .erkl-liste{display:grid} #was-ich-mache .anim .erkl-liste{overflow-x:clip} #was-ich-mache .anim .erkl-liste li{grid-area:1/1;align-content:start;padding:0;border-top:0;opacity:0;visibility:hidden;transform:translateX(28px);transition:opacity .35s ease,transform .35s ease,visibility 0s linear .35s} #was-ich-mache .anim .erkl-liste li.weg-links{transform:translateX(-28px)} #was-ich-mache .anim .erkl-liste li.ist-zeige{opacity:1;visibility:visible;transform:none;transition-delay:0s} #was-ich-mache .anim .ohne-uebergang,#was-ich-mache .anim .ohne-uebergang *{transition:none!important} #was-ich-mache .anim .erkl-liste .s-nr{background:var(--akzent);border-color:var(--akzent);color:#1F1F1F} #was-ich-mache .nochmal{display:inline-flex;align-items:center;gap:8px;min-height:44px;margin-top:22px;padding:0 14px;border:1px solid var(--border);border-radius:6px;background:var(--bg);color:var(--text-2);font:500 14px/1 Inter,system-ui,sans-serif;cursor:pointer;transition:opacity .35s ease} #was-ich-mache .nochmal:hover{border-color:var(--akzent)} #was-ich-mache .nochmal[hidden]{display:none} #was-ich-mache .nochmal.wartet{visibility:hidden;opacity:0} #was-ich-mache .ps{--ps-strich:#2E2E2E;--ps-strich2:#9C9A95;--ps-grund:#FFFFFF;--ps-decke:#B3B1AB;--ps-dach:#C4C1BA;--ps-erde:#E4D9C6;--ps-warm:#FFFFFF;--ps-kalt:#F1F0EC; --ps-glas:#8FA3AB;--ps-glas-neu:#3F5F6A;--ps-dm-f:#FAF9F6;--ps-dm-z:#4A4A4A;--ps-mass:#6E6E6E;--ps-text:#3D3D3D;--ps-text2:#5A5A5A;--ps-akzent:#006E55;--ps-akzent-f:#118568; --ps-xw:#EDE8DE;--ps-xd:#D8D1C3;--ps-xf:#F6F3EC;--ps-karte:#FFFFFF;--ps-tuer:#CAC5BB;--ps-himmel:#FFFFFF} :root[data-theme=dark] #was-ich-mache .ps:not(.ps-hell){--ps-strich:#D6D4CE;--ps-strich2:#6E6C67;--ps-grund:#3A3B38;--ps-decke:#7E7B74;--ps-dach:#706E69;--ps-erde:#3B3428;--ps-warm:#33342F;--ps-kalt:#292A28; --ps-glas:#7F939B;--ps-glas-neu:#BFD5DC;--ps-dm-f:#3A3B38;--ps-dm-z:#D0CEC8;--ps-mass:#A3A19C;--ps-text:#B4B2AC;--ps-text2:#A3A19C;--ps-akzent:#6CD5B3;--ps-akzent-f:#6CD5B3; --ps-xw:#5A564D;--ps-xd:#4A463F;--ps-xf:#3A3731;--ps-karte:#262626;--ps-tuer:#6A665D;--ps-himmel:#262626} @media (prefers-color-scheme:dark){:root:not([data-theme=light]) #was-ich-mache .ps:not(.ps-hell){--ps-strich:#D6D4CE;--ps-strich2:#6E6C67;--ps-grund:#3A3B38;--ps-decke:#7E7B74;--ps-dach:#706E69;--ps-erde:#3B3428;--ps-warm:#33342F;--ps-kalt:#292A28; --ps-glas:#7F939B;--ps-glas-neu:#BFD5DC;--ps-dm-f:#3A3B38;--ps-dm-z:#D0CEC8;--ps-mass:#A3A19C;--ps-text:#B4B2AC;--ps-text2:#A3A19C;--ps-akzent:#6CD5B3;--ps-akzent-f:#6CD5B3; --ps-xw:#5A564D;--ps-xd:#4A463F;--ps-xf:#3A3731;--ps-karte:#262626;--ps-tuer:#6A665D;--ps-himmel:#262626}} #was-ich-mache .ps text{font:500 11px Inter,system-ui,sans-serif;fill:var(--ps-text2)} #was-ich-mache .ps .rn{fill:var(--ps-text2)} #was-ich-mache .ps .klein{font-size:10px} #was-ich-mache .ps .erde{fill:var(--ps-erde)} #was-ich-mache .ps .warm{fill:var(--ps-warm)} #was-ich-mache .ps .kalt{fill:var(--ps-kalt)} #was-ich-mache .ps .gelaende{stroke:var(--ps-strich);stroke-width:1.5} #was-ich-mache .ps .b{stroke:var(--ps-strich);stroke-width:.7;stroke-linejoin:miter;vector-effect:non-scaling-stroke} #was-ich-mache .ps .wand{fill:url(#ps-schraffur)} #was-ich-mache .ps .decke{fill:var(--ps-decke)} #was-ich-mache .ps .dach-f{fill:var(--ps-dach)} #was-ich-mache .ps .putz{fill:var(--ps-grund)} #was-ich-mache .ps.zoom .wand,#was-ich-mache .ps .zoom .wand{fill:url(#ps-schraffur-d)} #was-ich-mache .ps .kst{fill:none;stroke:var(--ps-strich);stroke-width:.7;vector-effect:non-scaling-stroke} #was-ich-mache .ps .glas{stroke:var(--ps-glas);stroke-width:1;stroke-linecap:round} #was-ich-mache .ps .glas.neu{stroke:var(--ps-glas-neu);stroke-width:1.2} #was-ich-mache .ps .dm-f{fill:var(--ps-dm-f);stroke:var(--ps-strich);stroke-width:.8;vector-effect:non-scaling-stroke} #was-ich-mache .ps .dm-z{fill:none;stroke:var(--ps-dm-z);stroke-width:.8;stroke-linejoin:miter;vector-effect:non-scaling-stroke} #was-ich-mache .ps .pl2{stroke:var(--ps-strich);stroke-width:.8;vector-effect:non-scaling-stroke} #was-ich-mache .ps .st{stroke:var(--ps-strich);stroke-width:.8;vector-effect:non-scaling-stroke} #was-ich-mache .ps .mk line,#was-ich-mache .ps .mk path{stroke:var(--ps-mass);stroke-width:1;fill:none} #was-ich-mache .ps .mk text{font:600 10px Inter,system-ui,sans-serif;fill:var(--ps-text)} #was-ich-mache .ps .mk .mk-n{font:500 9px Inter,system-ui,sans-serif;fill:var(--ps-text2)} #was-ich-mache .ps .kote path{fill:none;stroke:var(--ps-mass);stroke-width:1} #was-ich-mache .ps .kote text{font:600 10px Inter,system-ui,sans-serif;fill:var(--ps-text)} #was-ich-mache .ps .lab{font:600 11px Inter,system-ui,sans-serif;fill:var(--ps-akzent)} #was-ich-mache .ps .lab-g line{stroke:var(--ps-akzent);stroke-width:1} #was-ich-mache .ps .wo{fill:none;stroke:var(--ps-strich);stroke-width:2;vector-effect:non-scaling-stroke} #was-ich-mache .ps .wf{fill:url(#ps-schraffur)} #was-ich-mache .ps .wv{fill:none;stroke:var(--ps-strich);stroke-width:.8;vector-effect:non-scaling-stroke} #was-ich-mache .ps .fl{stroke:var(--ps-strich);stroke-width:.7;vector-effect:non-scaling-stroke} #was-ich-mache .ps .hk{fill:var(--ps-grund);stroke:var(--ps-strich);stroke-width:.8;vector-effect:non-scaling-stroke} #was-ich-mache .ps .hkl{stroke:var(--ps-strich2);stroke-width:.6} #was-ich-mache .ps .tuer{fill:none;stroke:var(--ps-strich);stroke-width:.8;vector-effect:non-scaling-stroke} #was-ich-mache .ps .mb{fill:none;stroke:var(--ps-strich2);stroke-width:.9;vector-effect:non-scaling-stroke} #was-ich-mache .ps .dmo{fill:none;stroke:var(--ps-strich);stroke-width:2;stroke-linejoin:bevel;vector-effect:non-scaling-stroke} #was-ich-mache .ps .dmf{fill:var(--ps-dm-f);stroke:none} #was-ich-mache .ps .rg{font:600 12px Inter,system-ui,sans-serif;fill:var(--ps-text)} #was-ich-mache .ps .stp{fill:none;stroke:var(--ps-strich);stroke-width:1;vector-effect:non-scaling-stroke} #was-ich-mache .ps .st2{stroke:var(--ps-strich2);stroke-width:.8;stroke-dasharray:3 2;vector-effect:non-scaling-stroke} #was-ich-mache .ps .arw,#was-ich-mache .ps .cut{fill:none;stroke:var(--ps-strich);stroke-width:1;vector-effect:non-scaling-stroke} #was-ich-mache .ps .luke{fill:none;stroke:var(--ps-strich);stroke-width:1;stroke-dasharray:4 3;vector-effect:non-scaling-stroke} #was-ich-mache .ps .sl{stroke:var(--ps-strich);stroke-width:1.2;stroke-dasharray:10 3 2 3} #was-ich-mache .ps .schnitt-m path{stroke:var(--ps-strich);stroke-width:1.2;fill:none} #was-ich-mache .ps .sm{font:700 13px Inter,system-ui,sans-serif;fill:var(--ps-text)} #was-ich-mache .ps .dachf{fill:var(--ps-kalt);stroke:none} #was-ich-mache .ps .dachk{fill:none;stroke:var(--ps-strich);stroke-width:1;stroke-dasharray:6 3;vector-effect:non-scaling-stroke} #was-ich-mache .ps .sp{stroke:var(--ps-strich2);stroke-width:.6;vector-effect:non-scaling-stroke} #was-ich-mache .ps .ln2{stroke:var(--ps-strich2);stroke-width:.8;stroke-dasharray:3 3;vector-effect:non-scaling-stroke} #was-ich-mache .ps .first{stroke:var(--ps-strich);stroke-width:1.1;stroke-dasharray:10 3 2 3;vector-effect:non-scaling-stroke} #was-ich-mache .ps .fass{fill:var(--ps-karte);stroke:var(--ps-strich);stroke-width:1.1;vector-effect:non-scaling-stroke} #was-ich-mache .ps .ortg,#was-ich-mache .ps .traufk{fill:var(--ps-dach);stroke:var(--ps-strich);stroke-width:.9;vector-effect:non-scaling-stroke} #was-ich-mache .ps .dachan{fill:var(--ps-kalt);stroke:var(--ps-strich);stroke-width:1;vector-effect:non-scaling-stroke} #was-ich-mache .ps .ziegel{stroke:var(--ps-strich2);stroke-width:.5;vector-effect:non-scaling-stroke} #was-ich-mache .ps .firstl{stroke:var(--ps-strich);stroke-width:1.6;vector-effect:non-scaling-stroke} #was-ich-mache .ps .sockel{stroke:var(--ps-strich2);stroke-width:.8;vector-effect:non-scaling-stroke} #was-ich-mache .ps .kg{fill:none;stroke:var(--ps-strich2);stroke-width:.8;stroke-dasharray:5 3;vector-effect:non-scaling-stroke} #was-ich-mache .ps .afw{fill:var(--ps-glas);fill-opacity:.25;stroke:var(--ps-strich);stroke-width:.9;vector-effect:non-scaling-stroke} #was-ich-mache .ps .afr{fill:none;stroke:var(--ps-strich);stroke-width:.6;vector-effect:non-scaling-stroke} #was-ich-mache .ps .afb{fill:var(--ps-strich);stroke:none} #was-ich-mache .ps .a3g{fill:var(--ps-xf);stroke:none} #was-ich-mache .ps .a3s{fill:var(--ps-karte);stroke:var(--ps-strich);stroke-width:1;stroke-linejoin:round;vector-effect:non-scaling-stroke} #was-ich-mache .ps .a3e{fill:var(--ps-xw);stroke:var(--ps-strich);stroke-width:1;stroke-linejoin:round;vector-effect:non-scaling-stroke} #was-ich-mache .ps .a3f{fill:var(--ps-glas);fill-opacity:.3;stroke:var(--ps-strich);stroke-width:.9;vector-effect:non-scaling-stroke} #was-ich-mache .ps .a3t{fill:var(--ps-tuer);stroke:var(--ps-strich);stroke-width:.9;vector-effect:non-scaling-stroke} #was-ich-mache .ps .a3b{stroke:var(--ps-strich);stroke-width:2;vector-effect:non-scaling-stroke} #was-ich-mache .ps .a3r{fill:var(--ps-kalt);stroke:var(--ps-strich);stroke-width:1;stroke-linejoin:round;vector-effect:non-scaling-stroke} #was-ich-mache .ps .a3k{fill:var(--ps-dach);stroke:var(--ps-strich);stroke-width:.9;stroke-linejoin:round;vector-effect:non-scaling-stroke} #was-ich-mache .ps{--ps-akzent:#7D5D00;--ps-akzent-f:#E3B11A} :root[data-theme=dark] #was-ich-mache .ps:not(.ps-hell){--ps-akzent:#E3B11A;--ps-akzent-f:#E3B11A} @media (prefers-color-scheme:dark){:root:not([data-theme=light]) #was-ich-mache .ps:not(.ps-hell){--ps-akzent:#E3B11A;--ps-akzent-f:#E3B11A}} #was-ich-mache .ps .geraet{fill:var(--ps-grund);stroke:var(--ps-strich);stroke-width:.8;vector-effect:non-scaling-stroke} #was-ich-mache .ps .geraet-l{fill:none;stroke:var(--ps-strich2);stroke-width:.6;vector-effect:non-scaling-stroke} #was-ich-mache .ps .geraet-s{fill:none;stroke:var(--ps-strich);stroke-width:.8;vector-effect:non-scaling-stroke} #was-ich-mache .ps .moebel{fill:none;stroke:var(--ps-strich2);stroke-width:.9;vector-effect:non-scaling-stroke} #was-ich-mache .ps .leitung{fill:none;stroke:var(--ps-strich);stroke-width:.75} #was-ich-mache .ps .deckel{fill:var(--ps-kalt)} #was-ich-mache .ps .fen-deck{fill:var(--ps-grund)} #was-ich-mache .haus [data-bis]{opacity:0} #was-ich-mache .anim .haus [data-ab]{opacity:0;transition:opacity .35s ease} #was-ich-mache .anim .haus [data-ab].an{opacity:1} #was-ich-mache .t1,#was-ich-mache .p2s,#was-ich-mache .p4b,#was-ich-mache .p4s,#was-ich-mache .t6>*,#was-ich-mache .p6>*,#was-ich-mache .t7d,#was-ich-mache .p9e{transform-box:fill-box;transform-origin:center} #was-ich-mache .t1 rect,#was-ich-mache .blatt rect{fill:#FFFFFF;stroke:#2B2A27;stroke-width:1} #was-ich-mache .t1 path{fill:none;stroke:#2B2A27;stroke-width:1;stroke-linejoin:round} #was-ich-mache .blatt path{fill:none;stroke:#77746D;stroke-width:1;stroke-linecap:round} #was-ich-mache .unterschrift{fill:none;stroke:#B8890A;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0} #was-ich-mache .stempel rect{fill:#FFFFFF;stroke:#7D5D00;stroke-width:1.2} #was-ich-mache .stempel text{font:700 7.5px var(--mono);fill:#7D5D00;text-anchor:middle;letter-spacing:.06em} #was-ich-mache .p5-zug{fill:none;stroke:#FFFFFF;stroke-width:8;stroke-dasharray:1;stroke-dashoffset:0} #was-ich-mache .t5>*{opacity:0} #was-ich-mache .t6 path{fill:none;stroke:#56534D;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round} #was-ich-mache .t6>*{opacity:0} #was-ich-mache .pk rect{fill:#E3B11A} #was-ich-mache .pk text{font:600 8px var(--mono);fill:#1F1F1F;text-anchor:middle} #was-ich-mache .t7d{fill:#FFFFFF;stroke:#2B2A27;stroke-width:1} #was-ich-mache .t7s{fill:none;stroke:#B8890A;stroke-width:1.2;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0} #was-ich-mache .hoch{fill:none;stroke:#B8890A;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0} #was-ich-mache .kontur{fill:none;stroke:#C9980E;stroke-width:2;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0} #was-ich-mache .geld rect{fill:#E3B11A;stroke:#B8890A;stroke-width:1} #was-ich-mache .geld text{font:700 11px Inter,system-ui,sans-serif;fill:#1F1F1F;text-anchor:middle} #was-ich-mache .bonus-linie{fill:none;stroke:#C9980E;stroke-width:1.6;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0} #was-ich-mache .t1.laeuft{animation:abl-post 1.7s .2s ease-in-out both} #was-ich-mache .p1.laeuft{animation:abl-ein .4s 1.35s ease both} #was-ich-mache .p2.laeuft .p2s{animation:abl-heraus .8s .1s ease-out both} #was-ich-mache .p3.laeuft .unterschrift{animation:abl-zug .9s .4s ease-in-out both} #was-ich-mache .p4l.laeuft{animation:abl-ein .4s ease both} #was-ich-mache .p4.laeuft .p4b{animation:abl-bescheid 1.1s .1s ease-in-out both} #was-ich-mache .p4.laeuft .p4s{animation:abl-stempel .3s .35s cubic-bezier(.5,0,.75,0) both} #was-ich-mache .p5.laeuft .p5-zug{animation:abl-zug 1.2s ease-in-out both} #was-ich-mache .t5.laeuft>*{animation:abl-ein .5s ease both} #was-ich-mache .t5.laeuft>:nth-child(1){animation-delay:.6s} #was-ich-mache .t5.laeuft>:nth-child(2){animation-delay:1s} #was-ich-mache .t5.laeuft>:nth-child(3){animation-delay:1.4s} #was-ich-mache .t5.laeuft>:nth-child(4){animation-delay:1.8s} #was-ich-mache .t5.laeuft>:nth-child(5){animation-delay:2.2s} #was-ich-mache .t6>:nth-child(1){--dx:4px;--dy:4px} #was-ich-mache .t6>:nth-child(2){--dx:-4px;--dy:4px} #was-ich-mache .t6>:nth-child(3){--dx:6px;--dy:0px} #was-ich-mache .t6>:nth-child(4){--dx:-6px;--dy:0px} #was-ich-mache .t6>:nth-child(5){--dx:-6px;--dy:0px} #was-ich-mache .t6.laeuft>*{animation:abl-bilanz 1.6s ease-out both} #was-ich-mache .t6.laeuft>:nth-child(2){animation-delay:.05s} #was-ich-mache .t6.laeuft>:nth-child(3){animation-delay:.1s} #was-ich-mache .t6.laeuft>:nth-child(4){animation-delay:.15s} #was-ich-mache .t6.laeuft>:nth-child(5){animation-delay:.2s} #was-ich-mache .p6.laeuft>*{animation:abl-tag .5s ease-out both} #was-ich-mache .p6.laeuft>:nth-child(1),#was-ich-mache .p6.laeuft>:nth-child(2){animation-delay:1.5s} #was-ich-mache .p6.laeuft>:nth-child(3){animation-delay:2.4s} #was-ich-mache .p6.laeuft>:nth-child(4){animation-delay:3.3s} #was-ich-mache .p6d.laeuft .dm,#was-ich-mache .p6d.laeuft .fen-neu{animation:abl-dm-ein .6s ease-out both} #was-ich-mache .p6d.laeuft .pk-d1 .dm{animation-delay:1.5s} #was-ich-mache .p6d.laeuft .pk-d2 .dm,#was-ich-mache .p6d.laeuft .pk-d2 .fen-neu{animation-delay:2.4s} #was-ich-mache .p6d.laeuft .pk-d3 .dm{animation-delay:3.3s} #was-ich-mache .t7.laeuft .t7d{animation:abl-ablegen .9s .2s ease-out both} #was-ich-mache .t7.laeuft .t7s{animation:abl-zug .6s 1.3s ease-in-out both} #was-ich-mache .p8.laeuft .p8d{animation:abl-ein .5s .1s ease both} #was-ich-mache .p8.laeuft .hoch{animation:abl-zug .7s .7s ease-in-out both} #was-ich-mache .t8.laeuft{animation:abl-kontur 1.5s .2s ease-in-out both} #was-ich-mache .p9.laeuft .p9e{animation:abl-tag .7s .4s ease-out both} #was-ich-mache .p10.laeuft .bonus-linie{animation:abl-zug 1.4s .2s ease-in-out both} #was-ich-mache .p10.laeuft .p10t{animation:abl-ein .5s 1.3s ease both} #was-ich-mache .pausiert *,#was-ich-mache .pausiert *::before{animation-play-state:paused!important} @keyframes abl-ein{from{opacity:0}to{opacity:1}} @keyframes abl-post{0%{opacity:0;transform:translate(-18px,-30px) rotate(-14deg)}20%{opacity:1}55%{opacity:1;transform:none}80%,100%{opacity:0;transform:translateY(9px)}} @keyframes abl-heraus{0%{opacity:0;transform:translateY(16px)}30%{opacity:1}100%{opacity:1;transform:none}} @keyframes abl-bescheid{0%{opacity:0;transform:translate(30px,-18px)}15%{opacity:1;transform:translate(30px,-18px)}55%{transform:translate(30px,-18px)}100%{opacity:1;transform:none}} @keyframes abl-stempel{0%{opacity:0;transform:scale(1.8)}60%{opacity:1;transform:scale(.94)}100%{opacity:1;transform:none}} @keyframes abl-zug{from{stroke-dashoffset:1}to{stroke-dashoffset:0}} @keyframes abl-bilanz{0%{opacity:0;transform:translate(var(--dx),var(--dy))}20%{opacity:1;transform:none}70%{opacity:1}100%{opacity:0}} @keyframes abl-tag{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}} @keyframes abl-dm-ein{from{opacity:0;transform:translate(var(--sx,0px),var(--sy,0px))}to{opacity:1;transform:none}} @keyframes abl-ablegen{0%{opacity:0;transform:translateY(-26px) rotate(-12deg)}60%{opacity:1;transform:translateY(1px) rotate(2deg)}100%{opacity:1;transform:none}} @keyframes abl-kontur{0%{opacity:1;stroke-dashoffset:1}45%{opacity:1;stroke-dashoffset:0}80%{opacity:1;stroke-dashoffset:0}100%{opacity:0;stroke-dashoffset:0}} #was-ich-mache .anim .haus:has(.t5.an) .b.wand,#was-ich-mache .anim .haus:has(.t5.an) .b.dach-f{stroke:#7D5D00;stroke-width:2.5} #was-ich-mache .anim .haus:has(.p10.an) .dm-f{stroke:#7D5D00;stroke-width:2.5} @media (prefers-reduced-motion:reduce){#was-ich-mache .isfp *,#was-ich-mache .isfp *::before{animation:none!important;transition:none!important}} @media (max-width:1180px){#was-ich-mache .raster{grid-template-columns:minmax(0,1fr);gap:48px} #was-ich-mache .quittung-ort{max-width:400px}} @media (max-width:860px){#was-ich-mache .buehne{grid-template-columns:minmax(0,1fr);gap:24px}} @media (max-width:520px){#was-ich-mache h2{font-size:27px} #was-ich-mache .antwort{font-size:16.5px} #was-ich-mache .kopf__logo svg{height:28px} #was-ich-mache .erkl{padding:16px} #was-ich-mache .quittung-ort{max-width:none}} #was-ich-mache .erkl-nav{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:16px;padding-top:12px;border-top:1px solid var(--border)} #was-ich-mache .erkl-nav[hidden]{display:none} #was-ich-mache .erkl-nav button{display:inline-flex;align-items:center;gap:4px;min-height:44px;padding:0 12px;border:1px solid var(--border);border-radius:6px;background:var(--bg);color:var(--text);font:500 14px/1 Inter,system-ui,sans-serif;cursor:pointer} #was-ich-mache .erkl-nav button .ic{width:18px;height:18px} #was-ich-mache .erkl-nav button:hover:not(:disabled){border-color:var(--akzent)} #was-ich-mache .erkl-nav button:disabled{opacity:.4;cursor:default} #was-ich-mache .erkl-nav button:focus-visible{outline:2px solid var(--text);outline-offset:3px} #was-ich-mache .erkl-pos{font:500 13px/1 var(--mono);color:var(--text-2);white-space:nowrap} #was-ich-mache .anim .buehne{touch-action:pan-y} #was-ich-mache .angehalten .erkl-pos::after{content:"ยท angehalten";margin-left:8px;font:500 11px/1 var(--mono);letter-spacing:.04em;color:var(--text-2)} #was-ich-mache .zs-rand{display:none} #was-ich-mache .reiter-name{display:none;font-style:normal} #was-ich-mache .zs-wahl span b{font-weight:inherit} #was-ich-mache .quittung{padding:14px 18px calc(14px + var(--zz))} #was-ich-mache .quittung h3{padding-bottom:9px} #was-ich-mache .q-block{padding-block:7px} #was-ich-mache .q-abschnitt{margin-bottom:4px} #was-ich-mache .q-klein{margin:2px 0 0} #was-ich-mache .q-zeile--lang dt{flex:none} #was-ich-mache .q-zeile--unter{flex-wrap:wrap} #was-ich-mache .q-zeile--unter .q-unter{order:4;flex:1 0 100%;margin:0;font-size:12.5px;font-weight:400;line-height:1.35;text-align:right;color:var(--text-2)} #was-ich-mache .quittung-ort::before{display:none} #was-ich-mache .quittung-ort .quittung-papier{margin-inline:0;filter:none} #was-ich-mache .quittung.q3{position:relative;-webkit-mask:none;mask:none;background:#fff;color:#1F1F1F;padding:22px 22px 26px;font:15px/1.45 Inter,system-ui,sans-serif;box-shadow:0 8px 24px rgba(31,31,31,.12)} #was-ich-mache .quittung.q3::after{content:"";position:absolute;left:0;right:0;bottom:-9px;height:10px;background:linear-gradient(-45deg,transparent 7px,#fff 0) 0 0/14px 10px,linear-gradient(45deg,transparent 7px,#fff 0) 0 0/14px 10px;background-repeat:repeat-x} #was-ich-mache .q3 .ic{flex:none;color:#7D5D00} #was-ich-mache .q3 .kopfzeile{display:flex;gap:8px;align-items:center;margin:0;padding:0;border:0;font:600 12px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#7D5D00} #was-ich-mache .q3 .oben{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-top:14px;padding-bottom:14px;border-bottom:1px dashed #CFCBC2} #was-ich-mache .q3 .was{margin:0;font-weight:600;font-size:17px} #was-ich-mache .q3 .klein,#was-ich-mache .q3 .zeile{color:#5F5C55;font-size:13.5px;margin:2px 0 0} #was-ich-mache .q3 .preis{margin:0;font-size:34px;font-weight:800;line-height:1;white-space:nowrap;text-align:right} #was-ich-mache .q3 .preis small{display:block;margin-top:5px;font-size:12.5px;font-weight:500;line-height:1.2;color:#5F5C55} #was-ich-mache .q3 .wann{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:0;position:relative} #was-ich-mache .q3 .wann li{display:grid;grid-template-columns:var(--zb,72px) 1fr;gap:12px;padding:6px 0;position:relative} #was-ich-mache .q3 .wann li::before{content:"";position:absolute;left:calc(var(--zb,72px) + 6px);top:13px;width:8px;height:8px;background:#E3B11A} #was-ich-mache .q3 .wann li:not(:last-child)::after{content:"";position:absolute;left:calc(var(--zb,72px) + 9.5px);top:21px;bottom:-7px;border-left:1px solid #D9D6CF} #was-ich-mache .q3 .wann span:last-child{padding-left:14px} #was-ich-mache .q3 .z{font:600 12.5px var(--mono);color:#7D5D00;text-align:right;padding-top:2px;white-space:nowrap} #was-ich-mache .q3 .haken{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:6px} #was-ich-mache .q3 .haken li{display:flex;gap:8px;align-items:center} #was-ich-mache .q3 .zeile{margin-top:10px;font-size:12.5px} #was-ich-mache .q3 .mehr{margin-top:16px;border-top:1px dashed #CFCBC2;padding-top:12px} #was-ich-mache .q3 .mehr summary{cursor:pointer;display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 12px;border:1px solid #D9D6CF;border-radius:6px;font-weight:600;font-size:14px;list-style:none} #was-ich-mache .q3 .mehr summary::-webkit-details-marker{display:none} #was-ich-mache .q3 .mehr summary:hover{border-color:#E3B11A} #was-ich-mache .q3 .mehr summary:focus-visible{outline:2px solid #1F1F1F;outline-offset:2px} #was-ich-mache .q3 .mehr[open] summary{margin-bottom:6px} #was-ich-mache .q3 .q-block:last-child{padding-bottom:0} @media (min-width:1181px){#was-ich-mache .isfp{padding-block:24px 28px} #was-ich-mache .raster{grid-template-columns:minmax(0,1fr) 372px;gap:52px} #was-ich-mache .antwort{max-width:none;margin-top:8px} #was-ich-mache .zs-kopf{margin-top:14px} #was-ich-mache .zs-phase{margin-top:8px} #was-ich-mache .buehne{margin-top:16px} #was-ich-mache .buehne .haus{max-height:max(240px,calc(100vh - 440px))} #was-ich-mache .i1{position:relative} #was-ich-mache .nochmal{position:absolute;right:0;bottom:0;margin:0}} @media (max-width:760px){#was-ich-mache .anim .zs-scroll{overflow:visible} #was-ich-mache .anim .zs,#was-ich-mache .anim #sfp-phase-1 .zs,#was-ich-mache .anim #sfp-phase-2 .zs,#was-ich-mache .anim #sfp-phase-3 .zs{min-width:0!important;padding:2px 14px 0} #was-ich-mache .anim .zs-titel{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap} #was-ich-mache .anim .zs-marken{height:36px} #was-ich-mache .anim .ab-schritt{padding:3px;bottom:8px} #was-ich-mache .anim .ab-schritt::before{display:none} #was-ich-mache .anim .ab-schritt::after{height:8px} #was-ich-mache .anim .ab-schritt.ist-aktiv{z-index:2;transform:translateX(-50%)} #was-ich-mache .anim .ab-schritt.verdeckt{opacity:0;pointer-events:none} #was-ich-mache .anim .ab-nr{width:10px;height:10px;border-radius:2px;font-size:0} #was-ich-mache .anim .ab-nr::before{border-radius:2px} #was-ich-mache .anim .ab-haken{display:none} #was-ich-mache .anim .ab-schritt.ist-aktiv .ab-nr{width:22px;height:22px;border-radius:5px;font-size:10px} #was-ich-mache .anim .ab-schritt.ist-aktiv .ab-nr::before{border-radius:5px} #was-ich-mache .anim .ab-schritt.wichtig .ab-nr{box-shadow:none} #was-ich-mache .anim .zs-oben{height:18px} #was-ich-mache .anim .zs-laeufer{top:-2px;height:20px} #was-ich-mache .anim .zs-oben span{opacity:0;white-space:nowrap;transition:opacity .3s ease} #was-ich-mache .anim .zs-oben span.ist-aktiv{opacity:1} #was-ich-mache .anim .zs-unten{display:none} #was-ich-mache .anim .zs-rand{display:flex;justify-content:space-between;gap:12px;height:18px;padding-top:4px;font:500 10.5px/1.2 var(--mono);color:var(--text-2)} #was-ich-mache .anim .zs-phase{margin-top:6px} #was-ich-mache .zs-kopf{margin-top:18px} #was-ich-mache .zs-gesamt{font-size:15px;line-height:1.35} #was-ich-mache .zs-gesamt strong{font-size:18px;line-height:1.3} #was-ich-mache .haus{max-height:27vh;max-height:27svh} #was-ich-mache .buehne{gap:8px;margin-top:8px} #was-ich-mache .erkl{padding:12px 14px} #was-ich-mache .erkl-nav{margin-top:10px;padding-top:8px} #was-ich-mache .anim .erkl-liste{position:relative} #was-ich-mache .anim .erkl-liste li:not(.ist-zeige){position:absolute;left:0;right:0;top:0} #was-ich-mache .zs-wahl{display:flex;flex-wrap:nowrap;gap:0 2px;margin:6px 0 0 -2px} #was-ich-mache .zs-wahl button{width:auto;height:44px;padding:0 2px} #was-ich-mache .zs-wahl span{display:inline-flex;align-items:center;width:auto;height:30px;padding:0 8px;gap:5px;border-color:var(--border);font:600 12px/1 Inter,system-ui,sans-serif} #was-ich-mache .zs-wahl span b{font:600 11px/1 var(--mono)} #was-ich-mache .reiter-name{display:inline}} @media (max-width:360px){#was-ich-mache .erkl-nav button{padding:0 9px}} /* --- Einpassen in die Live-Seite --- */ #was-ich-mache.efd-ablauf{padding-block:clamp(40px,5vw,72px);-webkit-hyphens:manual;hyphens:manual;overflow-wrap:normal;word-break:normal;letter-spacing:normal} #was-ich-mache > .isfp{padding-block:0} #was-ich-mache .huelle{max-width:none;width:min(var(--ef-container,1440px),100% - 2 * var(--ef-gutter,16px));padding-inline:0} #was-ich-mache .abl-dachzeile{all:revert;margin:0 0 14px;font:500 12px/1.3 "IBM Plex Mono",ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--text-2)} #was-ich-mache .abl-dachzeile__nummer{margin-right:1.2em;color:var(--akzent-text)} /* --- Dunkelmodus: Abschnitt dunkel; Zeichnung und Quittung bleiben helles Papier (Plan-Stil: Papier und Fotos bleiben hell) --- */ :root[data-theme=dark] #was-ich-mache{--bg:var(--ef-bg,#1f1f1f);--bg-alt:var(--ef-surface,#272727);--bg-deep:var(--ef-bg-deep,#191919);--border:var(--ef-border,#3a3a3a);--border-soft:var(--ef-border-soft,#2e2e2e);--border-strong:#77746D;--text:var(--ef-text,#e8e6e1);--text-2:var(--ef-text-muted,#b4b2ac);--akzent-text:#E3B11A;--schatten:rgba(0,0,0,.45);color-scheme:dark} :root[data-theme=dark] #was-ich-mache :is(.quittung-ort,.i1-bild){--bg:#FFFFFF;--bg-alt:#FAFAFA;--bg-deep:#F2F2F2;--border:#E0E0E0;--border-soft:#EBEBEB;--border-strong:#77746D;--text:#1F1F1F;--text-2:#56534D;--akzent-text:#7D5D00;--schatten:rgba(31,31,31,.10);color-scheme:light;color:var(--text)} :root[data-theme=dark] #was-ich-mache .i1-bild{background:#FFFFFF;padding:12px;border:1px solid #E0E0E0} :root[data-theme=dark] #was-ich-mache .zs-seg{background:#3F3E3B} :root[data-theme=dark] #was-ich-mache .zs-spanne.zs-seg{background:repeating-linear-gradient(135deg,#55534E 0 2px,transparent 2px 6px);box-shadow:inset 0 0 0 1px #3F3E3B} :root[data-theme=dark] #was-ich-mache .zs-laeufer{background:var(--text)} :root[data-theme=dark] #was-ich-mache .ab-schritt::before{box-shadow:0 8px 20px rgba(0,0,0,.35)} :root[data-theme=dark] #was-ich-mache .ab-schritt:focus-visible,:root[data-theme=dark] #was-ich-mache :focus-visible{outline-color:var(--text)}