:root{--farbe-text:#2d2d36;--farbe-text-leise:#555;--farbe-text-sehr-leise:#7a7a82;--farbe-rand:#e4e4e4;--farbe-rand-mittel:#ccc;--farbe-akzent:#c36;--farbe-akzent-dunkel:#b02d57;--farbe-flaeche:#fff;--farbe-flaeche-leise:#efefef;--farbe-leinwand:#f7f7f5;--farbe-hinweis-flaeche:#f6f6f6;--farbe-hinweis-rand:#ccc;--farbe-warnung-flaeche:#fdf1f4;--farbe-warnung-rand:#e6b7c6;--radius:0px;--radius-klein:0px;--schrift:Mulish, system-ui, -apple-system, "Segoe UI", sans-serif;--spalte-links:288px;--spalte-rechts:320px;--inhalt-breite:1280px}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--schrift);color:var(--farbe-text);background:var(--farbe-flaeche);-webkit-font-smoothing:antialiased}button{cursor:pointer;font-family:inherit}input,select,textarea{color:var(--farbe-text);font-family:inherit;font-size:13px}.hero{background:var(--farbe-flaeche);max-width:var(--inhalt-breite);margin:0 auto;padding:44px 40px 30px;position:relative;overflow:hidden}.hero-blob{filter:blur(10px);pointer-events:none;background:radial-gradient(circle at 30% 30%,#cc336647,#0000 60%),radial-gradient(circle at 70% 40%,#238ec242,#0000 60%),radial-gradient(circle at 50% 80%,#c6d32a4d,#0000 60%);width:420px;height:340px;position:absolute;top:-60px;right:-60px}.hero-body{flex-wrap:wrap;align-items:center;gap:30px;display:flex;position:relative}.hero-photo{object-fit:cover;flex-shrink:0;width:190px;height:190px}.hero-text{flex:1;min-width:240px}.hero h1{letter-spacing:-.01em;text-transform:uppercase;color:var(--farbe-text);margin:0 0 12px;font-size:38px;font-weight:700}.hero p{max-width:420px;color:var(--farbe-text-leise);margin:0;font-size:15.5px;line-height:1.5}@media (max-width:640px){.hero-photo{aspect-ratio:1;width:100%;max-width:280px;height:auto}}@media (max-width:600px){.hero{padding:32px 20px 24px}.hero h1{font-size:28px}}.raster{grid-template-columns:var(--spalte-links) minmax(0, 1fr) var(--spalte-rechts);max-width:var(--inhalt-breite);border:1px solid var(--farbe-rand);align-items:start;margin:0 auto;display:grid}.raster>*{min-width:0}.spalte-links{border-right:1px solid var(--farbe-rand);padding:20px}.spalte-rechts{border-left:1px solid var(--farbe-rand);padding:20px}.abschnitt{margin-bottom:26px}.abschnitt-titel{letter-spacing:.13em;text-transform:uppercase;align-items:center;gap:9px;margin-bottom:11px;font-size:11px;font-weight:900;display:flex}.abschnitt-nummer{background:var(--farbe-akzent);color:#fff;letter-spacing:0;flex:none;justify-content:center;align-items:center;width:19px;height:19px;font-size:10px;font-weight:700;display:inline-flex}.kacheln{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.kacheln-3{grid-template-columns:repeat(3,1fr)}.kachel{background:var(--farbe-flaeche);border:1px solid var(--farbe-rand);border-radius:var(--radius-klein);text-align:center;min-height:74px;color:var(--farbe-text);flex-direction:column;justify-content:flex-start;align-items:center;gap:6px;padding:10px 4px 8px;font-size:10px;line-height:1.25;transition:border-color .12s,box-shadow .12s;display:flex}.kachel:hover{border-color:#b8b8b8}.kachel[aria-pressed=true]{border-color:var(--farbe-akzent);box-shadow:inset 0 0 0 1px var(--farbe-akzent)}.kachel-symbol{height:30px;color:var(--farbe-text);justify-content:center;align-items:center;display:flex}.kachel-name{font-weight:500}.kachel-zusatz{color:var(--farbe-text-sehr-leise);font-size:9px}.kachel-material{background-position:50%;background-size:cover;border:1px solid #0000001f;width:34px;height:34px}.kachel-mehr{border:1px solid var(--farbe-rand);width:34px;height:34px;color:var(--farbe-text-leise);letter-spacing:.1em;justify-content:center;align-items:center;display:flex}.groesse-zeile{align-items:center;gap:8px;margin-bottom:8px;display:flex}.groesse-beschriftung{width:42px;color:var(--farbe-text-leise);font-size:12px}.zahlenfeld{border:1px solid var(--farbe-rand);border-radius:var(--radius-klein);flex:1;align-items:center;display:flex;overflow:hidden}.zahlenfeld button{background:var(--farbe-flaeche);width:28px;height:30px;color:var(--farbe-text-leise);border:0;font-size:15px;line-height:1}.zahlenfeld button:hover:not(:disabled){background:var(--farbe-flaeche-leise);color:var(--farbe-text)}.zahlenfeld button:disabled{opacity:.3;cursor:not-allowed}.zahlenfeld input{border:0;border-left:1px solid var(--farbe-rand);border-right:1px solid var(--farbe-rand);text-align:center;background:0 0;flex:1;min-width:0;height:30px;font-size:13px}.zahlenfeld input:focus{outline:2px solid var(--farbe-text);outline-offset:-2px}.verknuepfung{width:100%;color:var(--farbe-text-leise);text-underline-offset:3px;background:0 0;border:0;margin-top:4px;padding:4px;font-size:11px;text-decoration:underline;display:block}.verknuepfung:hover{color:var(--farbe-text)}.schwellwert{border:1px solid var(--farbe-rand);background:var(--farbe-flaeche-leise);margin-top:12px;padding:11px 12px}.schwellwert label{color:var(--farbe-text-leise);justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:6px;font-size:11px;display:flex}.schwellwert-wert{color:var(--farbe-text);font-weight:700}.schwellwert input[type=range]{width:100%;accent-color:var(--farbe-akzent)}.schwellwert-skala{color:var(--farbe-text-sehr-leise);justify-content:space-between;font-size:9.5px;display:flex}.schwellwert .feld-hinweis{margin-top:7px}.werkzeugleiste{border-bottom:1px solid var(--farbe-rand);align-items:center;gap:4px;padding:10px 20px;display:flex}.werkzeug{border-radius:var(--radius-klein);color:var(--farbe-text);background:0 0;border:0;flex-direction:column;align-items:center;gap:4px;padding:6px 12px;font-size:10px;display:flex}.werkzeug:hover:not(:disabled){background:var(--farbe-flaeche-leise)}.werkzeug:disabled{color:var(--farbe-text-sehr-leise);cursor:not-allowed}.werkzeug-abstand{flex:1}.leinwand-flaeche{background-color:var(--farbe-leinwand);overscroll-behavior:contain;background-image:radial-gradient(#d8d8d4 1px,#0000 1px);background-size:18px 18px;min-height:min(520px,60vh);padding:34px 20px;display:flex;position:relative;overflow:auto}.schild-buehne{transform-origin:50%;margin:auto;position:relative}.schild{isolation:isolate;background-position:50%;background-size:cover;position:relative;overflow:hidden;box-shadow:0 18px 40px #00000038,0 3px 8px #0000001f}.schild-rund,.schild-oval{border-radius:50%}.schild-rechteckig,.schild-quadratisch{border-radius:3px}.schild:after{content:"";pointer-events:none;background:radial-gradient(120% 100% at 30% 15%,#ffffff2e,#0000000d 55%,#00000029 100%);position:absolute;inset:0}.ebene{transform-origin:50%;cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none;mix-blend-mode:multiply;position:absolute}.ebene:active{cursor:grabbing}.ebene-gesperrt{cursor:default}.ebene-text{white-space:pre;color:#34200edb;text-shadow:0 1px #ffffff38}.griffe-huelle{z-index:5;transform-origin:50%;pointer-events:none;position:absolute}.griffe-huelle:before{content:"";border:1px dashed var(--farbe-akzent);pointer-events:none;position:absolute;inset:-7px}.griffe-huelle .griff{pointer-events:auto}.griff{border:1px solid var(--farbe-akzent);width:18px;height:18px;color:var(--farbe-akzent);z-index:5;touch-action:none;background:#fff;justify-content:center;align-items:center;padding:0;display:flex;position:absolute;box-shadow:0 1px 3px #00000047}.griff:hover{background:var(--farbe-akzent);color:#fff}.griff-groesse{cursor:nwse-resize;bottom:-16px;right:-16px}.griff-entfernen{cursor:pointer;top:-16px;right:-16px}.griff-drehen{cursor:grab;margin-left:-9px;top:-34px;left:50%}.griff-drehen:active{cursor:grabbing}.griff-linie{background:var(--farbe-akzent);pointer-events:none;width:1px;height:18px;position:absolute;top:-25px;left:50%}.zoomleiste{justify-content:center;align-items:center;gap:6px;padding:14px;display:flex}.zoomleiste-innen{border:1px solid var(--farbe-rand);background:var(--farbe-flaeche);align-items:center;gap:4px;padding:5px 8px;display:flex}.zoomleiste-innen button{width:28px;height:28px;color:var(--farbe-text-leise);background:0 0;border:0;font-size:15px;line-height:1}.zoomleiste-innen button:hover{background:var(--farbe-flaeche-leise);color:var(--farbe-text)}.zoomleiste-wert{text-align:center;min-width:46px;color:var(--farbe-text-leise);font-size:12px}.hinweis{border:1px solid var(--farbe-hinweis-rand);border-radius:var(--radius);background:var(--farbe-hinweis-flaeche);gap:11px;margin:18px 20px;padding:13px 15px;font-size:12px;line-height:1.5;display:flex}.hinweis-warnung{border-color:var(--farbe-warnung-rand);background:var(--farbe-warnung-flaeche)}.hinweis-symbol{color:var(--farbe-text-leise);flex:none}.hinweis strong{margin-bottom:2px;font-size:12px;display:block}.hinweis p{color:var(--farbe-text-leise);margin:0}.karte{border:1px solid var(--farbe-rand);border-radius:var(--radius);padding:18px}.karte-titel{letter-spacing:.13em;text-transform:uppercase;margin:0 0 14px;font-size:11px;font-weight:900}.vorschaubild{border:1px solid var(--farbe-rand);border-radius:var(--radius-klein);background:var(--farbe-flaeche-leise);justify-content:center;align-items:center;height:190px;margin-bottom:16px;display:flex;overflow:hidden}.daten-zeile{border-bottom:1px solid #f1f1f1;justify-content:space-between;gap:12px;padding:7px 0;font-size:12px;display:flex}.daten-zeile:last-of-type{border-bottom:0}.daten-name{color:var(--farbe-text-leise);flex:none}.daten-wert{text-align:right;font-weight:500}.preisblock{border-top:1px solid var(--farbe-rand);text-align:center;margin-top:16px;padding-top:16px}.preis-beschriftung{color:var(--farbe-text-leise);font-size:11px}.preis-betrag{letter-spacing:-.01em;margin:6px 0 2px;font-size:24px;font-weight:700}.preis-zusatz{color:var(--farbe-text-sehr-leise);font-size:11px;line-height:1.5}.preis-rabatt{color:var(--farbe-akzent-dunkel);background:#f4e6ec;margin-top:8px;padding:3px 9px;font-size:11px;font-weight:600;display:inline-block}.knopf{border:1px solid var(--farbe-akzent);background:var(--farbe-akzent);color:#fff;letter-spacing:.02em;justify-content:center;align-items:center;gap:8px;width:100%;padding:15px 34px;font-size:13.5px;font-weight:800;display:inline-flex}.knopf:hover{background:var(--farbe-akzent-dunkel);border-color:var(--farbe-akzent-dunkel)}.knopf-zweit{background:var(--farbe-flaeche);color:var(--farbe-text);border-color:var(--farbe-rand-mittel)}.knopf-zweit:hover{background:var(--farbe-flaeche-leise);border-color:var(--farbe-text)}.knopf-klein{width:auto;padding:9px 14px;font-size:12px;font-weight:700}.knopf-reihe{flex-direction:column;gap:9px;margin-top:16px;display:flex}.werkzeugbereich{border-top:1px solid var(--farbe-rand);grid-template-columns:1fr 1fr;gap:22px;padding:20px;display:grid}@media (max-width:820px){.werkzeugbereich{grid-template-columns:1fr;gap:26px}}.ebenen-liste{flex-direction:column;gap:6px;display:flex}.ebenen-eintrag{border:1px solid var(--farbe-rand);border-radius:var(--radius-klein);background:var(--farbe-flaeche);text-align:left;align-items:center;gap:8px;width:100%;padding:8px 10px;font-size:12px;display:flex}.ebenen-eintrag[aria-pressed=true]{border-color:var(--farbe-akzent);box-shadow:inset 0 0 0 1px var(--farbe-akzent)}.ebenen-eintrag-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.symbolknopf{border:1px solid var(--farbe-rand);background:var(--farbe-flaeche);width:26px;height:26px;color:var(--farbe-text-leise);flex:none;justify-content:center;align-items:center;display:inline-flex}.symbolknopf:hover:not(:disabled){color:var(--farbe-text);border-color:#b8b8b8}.symbolknopf:disabled{opacity:.3;cursor:not-allowed}.ebenen-eintrag{gap:5px}.feld{margin-bottom:12px}.feld label{color:var(--farbe-text-leise);margin-bottom:5px;font-size:11px;display:block}.feld input[type=text],.feld textarea,.feld select{border:1px solid var(--farbe-rand);border-radius:var(--radius-klein);background:var(--farbe-flaeche);width:100%;padding:8px 10px}.feld textarea{resize:vertical;min-height:66px;line-height:1.45}.feld input[type=range]{width:100%}.feld-hinweis{color:var(--farbe-text-sehr-leise);margin:6px 0 0;font-size:11px;line-height:1.45}.feld-hinweis-warnung{border:1px solid var(--farbe-warnung-rand);background:var(--farbe-warnung-flaeche);color:var(--farbe-text);padding:7px 9px}.ki-hinweis{border:1px solid var(--farbe-akzent);color:var(--farbe-text);background:#faf0f4;align-items:flex-start;gap:8px;margin-top:12px;padding:10px 11px;font-size:11.5px;line-height:1.45;display:flex}.ki-hinweis-symbol{color:var(--farbe-akzent);flex:none;margin-top:1px}.ki-hinweis strong{color:var(--farbe-akzent-dunkel);margin-bottom:3px;display:block}.farbwahl{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.farbwahl input[type=color]{border:1px solid var(--farbe-rand-mittel);background:var(--farbe-flaeche);cursor:pointer;width:38px;height:26px;padding:2px}.farbmuster{border:1px solid var(--farbe-rand-mittel);width:22px;height:22px;padding:0}.farbmuster:hover{border-color:var(--farbe-text)}.farbmuster[aria-pressed=true]{box-shadow:0 0 0 2px var(--farbe-flaeche), 0 0 0 3px var(--farbe-akzent)}.feld-reihe{grid-template-columns:1fr 1fr;gap:10px;display:grid}.schalter-reihe{gap:6px;display:flex}.schalter{border:1px solid var(--farbe-rand);background:var(--farbe-flaeche);flex:1;padding:7px;font-size:12px}.schalter[aria-pressed=true]{border-color:var(--farbe-akzent);box-shadow:inset 0 0 0 1px var(--farbe-akzent);font-weight:600}.dialog-hintergrund{z-index:50;background:#2d2d368c;justify-content:center;align-items:flex-start;padding:24px 16px;display:flex;position:fixed;inset:0;overflow-y:auto}.dialog{background:var(--farbe-flaeche);border:1px solid var(--farbe-rand);width:100%;max-width:520px;box-shadow:0 20px 50px #00000040}.dialog-kopf{border-bottom:1px solid var(--farbe-rand);justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;display:flex}.dialog-kopf h2{letter-spacing:.1em;text-transform:uppercase;margin:0;font-size:13px;font-weight:900}.dialog-inhalt{padding:20px}.dialog-einleitung{color:var(--farbe-text-leise);margin:0 0 16px;font-size:13px;line-height:1.55}.dialog-vorschau{background:var(--farbe-leinwand);border:1px solid var(--farbe-rand);justify-content:center;align-items:center;margin-bottom:18px;padding:24px;display:flex}.dialog-fuss{border-top:1px solid var(--farbe-rand);flex-wrap:wrap;gap:10px;padding:16px 20px;display:flex}.dialog-fuss .knopf{flex:180px;padding:12px 16px}.dialog-fehler{border:1px solid var(--farbe-warnung-rand);background:var(--farbe-warnung-flaeche);margin-bottom:12px;padding:11px 13px;font-size:12.5px;line-height:1.5}.knopf:disabled{opacity:.55;cursor:not-allowed}@media (max-width:1040px){.raster{grid-template-columns:minmax(0,1fr)}.spalte-links,.spalte-rechts{border:0;border-bottom:1px solid var(--farbe-rand)}.spalte-rechts{border-bottom:0}}@media (max-width:560px){.spalte-links,.spalte-rechts,.werkzeugbereich,.dialog-inhalt,.dialog-fuss,.dialog-kopf{padding-left:14px;padding-right:14px}.kacheln{grid-template-columns:repeat(3,1fr)}.werkzeugleiste{padding:8px 14px}.hinweis{margin:14px}.feld-reihe{grid-template-columns:1fr}.leinwand-flaeche{padding:20px 14px}.dialog-hintergrund{padding:12px 8px}}
