@layer components{.configurator{grid-template-columns:minmax(0,1fr);align-items:start;gap:16px clamp(32px,4vw,48px);padding-block:16px 7rem;display:grid}.config-stage{aspect-ratio:1}@media (width>=64rem){.configurator{grid-template-columns:minmax(0,1fr) minmax(0,34rem);padding-block:24px 72px}.config-aside-inner{top:calc(var(--header-h) + 24px);position:sticky}}@media (width<64rem){.config-aside{top:var(--header-h);z-index:5;margin-inline:calc(-1 * var(--rand));padding:8px var(--rand);background:var(--color-grund);position:sticky}.configurator:has(:is(input,textarea,select):focus) .config-aside{position:static}.config-stage{aspect-ratio:auto;height:clamp(200px,34svh,320px)}.config-stage-hint{display:none}}.config-poster{width:min(64%,360px);height:auto;position:absolute;top:46%;left:50%;transform:translate(-50%,-50%)}.config-floor{width:46%;height:8%;bottom:12%;left:50%;transform:translate(-50%)}.config-stage:has(canvas) .config-floor{display:none}.config-preview-open{inset-inline:0;background:var(--color-flaeche);width:fit-content;margin-inline:auto;position:absolute;bottom:16px}.config-stage-hint{font-size:var(--text-label);color:var(--color-nebentext);text-align:center;margin-top:12px}.config-total{border-top:1px solid var(--color-linie);flex-wrap:wrap;align-items:baseline;gap:6px 16px;margin-top:16px;padding-top:16px}.config-total-label{font-size:var(--text-label);color:var(--color-nebentext);font-weight:700}.config-total-amount{font-size:var(--text-preis);font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:800;line-height:1.1}.config-total a{font-size:var(--text-label);margin-inline-start:auto}.config-form{border-radius:var(--radius-kachel);background:var(--color-flaeche);box-shadow:var(--shadow-erhoeht);padding:clamp(20px,3vw,32px)}.config-title{font-size:var(--text-h1);line-height:1.08}.config-lede{font-size:var(--text-lead);color:var(--color-nebentext);margin-top:8px;line-height:1.5}.step{border-top:1px solid var(--color-linie);margin-top:32px;padding-top:24px}.step-title{font-size:var(--text-h3);align-items:center;gap:12px;font-weight:500;line-height:1.2;display:flex}.step-no{width:32px;height:32px;box-shadow:inset 0 0 0 1.5px var(--color-tinte);font-family:var(--font-sans);font-size:var(--text-label);font-variant-numeric:tabular-nums;border-radius:999px;flex:none;place-items:center;font-weight:800;line-height:1;display:inline-grid}.step-body,.step-body>:not(template)~:not(template){margin-top:20px}.step-intro{color:var(--color-nebentext);margin-top:8px}.choice-row{flex-wrap:wrap;gap:8px;display:flex}.swatch{border-radius:50%;flex:none;width:20px;height:20px;box-shadow:inset 0 0 0 1px #1b244040}.swatch-rainbow{background:conic-gradient(#e8364a,#ffd23f,#3cc7c4,#5b8def,#a98bff,#ff5e93,#e8364a)}.chip[aria-checked=true] .swatch{box-shadow:0 0 0 2px var(--color-grund), inset 0 0 0 1px #1b244040}.chip-extra{font-size:var(--text-klein);font-variant-numeric:tabular-nums;opacity:.85;font-weight:600}.counter{font-size:var(--text-klein);font-variant-numeric:tabular-nums;color:var(--color-nebentext);margin-top:4px}.field-hint{font-size:var(--text-klein);color:var(--color-nebentext);margin-top:6px}.card-preview-label{font-size:var(--text-label);color:var(--color-nebentext);margin-bottom:8px;font-weight:700}.card-preview{max-width:none;font-size:var(--text-body);padding:30px 24px 24px}.card-preview .card-headline{font-family:var(--font-display);font-size:1.375rem;font-weight:600;line-height:1.2}.card-preview-message{white-space:pre-line;margin-top:10px}.upgrade{padding-block:16px}.upgrade+.upgrade{border-top:1px solid var(--color-linie)}.upgrade-head{justify-content:space-between;align-items:center;gap:12px 16px;display:flex}.upgrade-title{font-family:var(--font-sans);font-size:var(--text-body);font-weight:800;line-height:1.3}.upgrade-text{font-size:var(--text-label);color:var(--color-nebentext);margin-top:2px}.upgrade-switch{min-height:44px;color:var(--color-tinte);cursor:pointer;background:0 0;border:0;border-radius:999px;flex:none;align-items:center;gap:12px;padding:0 4px;display:inline-flex}.upgrade-price{font-size:var(--text-label);font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--color-nebentext);font-weight:700}.upgrade-switch[aria-pressed=true] .upgrade-price{color:var(--color-tinte)}.switch-track{background:var(--color-flaeche);width:44px;height:26px;box-shadow:inset 0 0 0 1.5px var(--color-tinte);transition:background-color .18s var(--ease-vitrine);border-radius:999px;flex:none;display:inline-block;position:relative}.switch-track>span{top:5px;background:var(--color-tinte);width:16px;height:16px;transition:transform .18s var(--ease-vitrine), background-color .18s var(--ease-vitrine);border-radius:999px;position:absolute;inset-inline-start:5px}.upgrade-switch[aria-pressed=true] .switch-track{background:var(--color-tinte)}.upgrade-switch[aria-pressed=true] .switch-track>span{background:var(--color-grund);transform:translate(18px)}:where([dir=rtl]) .upgrade-switch[aria-pressed=true] .switch-track>span{transform:translate(-18px)}.upgrade-body>*+*{margin-top:12px}.recorder-time{font-variant-numeric:tabular-nums;font-size:1.125rem;font-weight:800}.meter{background:var(--color-linie);border-radius:999px;height:4px;overflow:hidden}.meter>div{background:var(--color-tinte);height:100%}.pad{aspect-ratio:3;border:1.5px solid var(--color-feldrand);border-radius:var(--radius-feld);touch-action:none;background:#fffaf2;width:100%}.pen{width:32px;height:32px;box-shadow:0 0 0 1.5px var(--color-feldrand);cursor:pointer;border:0;border-radius:50%}.pen[aria-pressed=true]{box-shadow:0 0 0 2px var(--color-flaeche), 0 0 0 4px var(--color-tinte)}.time-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.chip-time{font-variant-numeric:tabular-nums;white-space:nowrap}.chip-time small{font-size:.85em}.when{margin-top:4px}.when-rows{border-radius:var(--radius-feld);background:var(--color-grund);box-shadow:inset 0 0 0 1px var(--color-linie);gap:4px;padding:12px 16px;display:grid}.when-row{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:2px 16px;padding-block:4px;display:flex}.when-row+.when-row{border-top:1px solid var(--color-linie);padding-top:8px}.when-name{overflow-wrap:anywhere;font-weight:700;line-height:1.3}.when-name small{font-size:var(--text-klein);color:var(--color-nebentext);font-weight:600}.when-name small:empty{display:none}.when-value{font-variant-numeric:tabular-nums;font-weight:800}.when-summary{font-size:var(--text-label);color:var(--color-nebentext);margin-top:12px}.summary{border-radius:var(--radius-karte);background:var(--color-grund);box-shadow:inset 0 0 0 1px var(--color-linie);padding:clamp(16px,3vw,24px)}.summary dl>div{justify-content:space-between;gap:16px;padding-block:5px;display:flex}.summary dt{color:var(--color-nebentext)}.summary dd{text-align:end}.summary-facts{border-bottom:1px solid var(--color-linie);font-size:var(--text-label);padding-bottom:14px}.summary .summary-facts>div{grid-template-columns:minmax(0,8.5rem) minmax(0,1fr);gap:12px;display:grid}.summary-facts dd{text-align:start}.summary-prices{padding-top:12px;font-size:1rem}.summary-prices dt{color:var(--color-tinte)}.summary-prices dd{font-variant-numeric:tabular-nums;white-space:nowrap}.summary-prices>div:last-child{border-top:1px solid var(--color-linie);align-items:baseline;margin-top:8px;padding-top:12px}.summary-prices>div:last-child dt{font-weight:800}.summary-prices>div:last-child dd{font-size:var(--text-preis);font-weight:800;line-height:1.1}.summary-note{font-size:var(--text-klein);color:var(--color-nebentext);margin-top:12px}.check{font-size:var(--text-label);align-items:flex-start;gap:10px;display:flex}.check input{flex:none;width:20px;height:20px;margin-top:2px}.check-note{font-size:var(--text-klein);color:var(--color-nebentext);margin-top:6px;padding-inline-start:30px}.price-bar{inset-inline:0;z-index:20;padding:10px var(--rand);border-top:1px solid var(--color-linie);background:var(--color-grund);position:fixed;bottom:0}.price-bar-inner{justify-content:space-between;align-items:center;gap:16px;max-width:1200px;margin-inline:auto;display:flex}.price-bar-amount{font-size:var(--text-preis);font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:800;line-height:1.1}@media (width>=64rem){.price-bar{display:none}}}
