@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap");:root{--gold:#be9c67;--gold-hell:#d8bd92;--anthrazit:#181818;--flaeche:#1f1f1f;--flaeche-hoch:#262626;--linie:#333;--text:#f4f2ef;--text-leise:#a3a09b;--gut:#7bbf82;--schlecht:#d97a6c;--radius:14px;color-scheme:dark}*{box-sizing:border-box}body,html{margin:0;padding:0;background:var(--anthrazit);color:var(--text);font-family:Poppins,system-ui,-apple-system,sans-serif;font-weight:400;-webkit-font-smoothing:antialiased}a{color:var(--gold)}.huelle{max-width:980px;margin:0 auto;padding:28px 20px 96px}.kopf{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:22px;border-bottom:1px solid var(--linie);margin-bottom:32px}.marke{font-weight:600;letter-spacing:.02em;font-size:17px}.marke span{color:var(--gold)}.guthaben{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--text-leise)}.guthaben b{color:var(--gold);font-size:15px}.schritt{margin-bottom:34px}.schritt-kopf{display:flex;align-items:baseline;gap:12px;margin-bottom:6px}.schritt-nr{width:26px;height:26px;flex:none;border-radius:50%;border:1px solid var(--gold);color:var(--gold);font-size:13px;display:grid;place-items:center;transform:translateY(3px)}.schritt h2{font-size:20px;font-weight:600;margin:0}.schritt p.leise{color:var(--text-leise);font-size:13.5px;margin:0 0 16px 38px;line-height:1.55}.schritt-koerper{margin-left:38px}@media (max-width:640px){.schritt p.leise,.schritt-koerper{margin-left:0}}.ablage{border:1.5px dashed var(--linie);border-radius:var(--radius);background:var(--flaeche);padding:44px 24px;text-align:center;cursor:pointer;transition:border-color .18s ease,background .18s ease}.ablage.aktiv,.ablage:hover{border-color:var(--gold);background:var(--flaeche-hoch)}.ablage strong{display:block;font-weight:500;margin-bottom:6px}.ablage small{color:var(--text-leise)}.datei{display:flex;align-items:center;gap:14px;padding:13px 16px;background:var(--flaeche);border:1px solid var(--linie);border-radius:10px;margin-top:10px}.datei .name{flex:1 1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}.datei .meta{color:var(--text-leise);font-size:12.5px;flex:none}.balken{height:3px;background:var(--linie);border-radius:2px;overflow:hidden;width:90px;flex:none}.balken i{display:block;height:100%;width:100%;background:var(--gold);transform-origin:left center;transition:transform .25s ease}.karten{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));grid-gap:10px;gap:10px}.karte{text-align:left;background:var(--flaeche);border:1px solid var(--linie);border-radius:12px;padding:14px 16px;cursor:pointer;color:var(--text);font:inherit;transition:border-color .15s ease,background .15s ease}.karte:hover{border-color:#4a4a4a}.karte.gewaehlt{border-color:var(--gold);background:var(--flaeche-hoch)}.karte b{display:block;font-weight:500;font-size:14.5px;margin-bottom:4px}.karte small{color:var(--text-leise);font-size:12.5px;line-height:1.5}.schalter{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;background:var(--flaeche);border:1px solid var(--linie);border-radius:10px;cursor:pointer;transition:border-color .15s ease}.schalter.an{border-color:var(--gold)}.schalter .kasten{width:18px;height:18px;flex:none;border:1.5px solid #555;border-radius:5px;margin-top:2px;display:grid;place-items:center;font-size:11px;color:var(--anthrazit)}.schalter.an .kasten{background:var(--gold);border-color:var(--gold)}.schalter b{display:block;font-weight:500;font-size:14px}.schalter small{color:var(--text-leise);font-size:12.5px;line-height:1.45}label.feld{display:block;margin-bottom:14px}label.feld span{display:block;font-size:13px;color:var(--text-leise);margin-bottom:6px}input,select,textarea{width:100%;background:var(--flaeche);border:1px solid var(--linie);border-radius:9px;color:var(--text);font:inherit;font-size:14px;padding:10px 12px}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold)}textarea{min-height:78px;resize:vertical}.knopf{background:var(--gold);color:var(--anthrazit);border:none;border-radius:10px;font:inherit;font-weight:600;font-size:15px;padding:14px 26px;cursor:pointer;transition:background .15s ease}.knopf:hover:not(:disabled){background:var(--gold-hell)}.knopf:disabled{opacity:.4;cursor:not-allowed}.knopf.leise{background:transparent;color:var(--text-leise);border:1px solid var(--linie);font-weight:400;font-size:13.5px;padding:9px 16px}.knopf.leise:hover{color:var(--text);background:var(--flaeche)}.hinweis{padding:12px 15px;background:var(--flaeche);border:1px solid var(--linie);border-radius:10px;font-size:13.5px;color:var(--text-leise);line-height:1.55}.hinweis b{color:var(--text);font-weight:500}.fehler{border-color:color-mix(in srgb,var(--schlecht) 45%,var(--linie))}.fehler,.fehler b{color:var(--schlecht)}.punkt{width:8px;height:8px;border-radius:50%;flex:none}.punkt.wartet{background:#555}.punkt.laeuft{background:var(--gold);animation:pulsieren 1.4s ease-in-out infinite}.punkt.fertig{background:var(--gut)}.punkt.fehler{background:var(--schlecht)}@keyframes pulsieren{0%,to{opacity:.35}50%{opacity:1}}.knopf.aufladen{font-size:13px;font-weight:500;padding:9px 15px;border-radius:8px}.feedback-raster{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,1fr);grid-gap:24px;gap:24px;align-items:start}@media (max-width:860px){.feedback-raster{grid-template-columns:1fr}}.zeitleiste{position:relative;height:26px;margin-top:10px;background:var(--flaeche);border:1px solid var(--linie);border-radius:7px}.zeitleiste .marke{position:absolute;top:5px;width:4px;height:14px;margin-left:-2px;padding:0;border:none;border-radius:2px;background:var(--gold);cursor:pointer}.zeitleiste .marke:hover{background:var(--gold-hell);transform:scaleY(1.25)}.zeitleiste .marke.vorliebe{background:var(--text-leise)}.zeitleiste .kopfmarke{position:absolute;top:0;bottom:0;width:1px;background:var(--text);opacity:.55;pointer-events:none}.anmerkung{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;background:var(--flaeche);border:1px solid var(--linie);border-radius:10px}.anmerkung.vorliebe{opacity:.75}.anmerkung .sprung{flex:none;background:var(--flaeche-hoch);border:1px solid var(--linie);color:var(--gold);border-radius:6px;font:inherit;font-size:12px;padding:3px 7px;cursor:pointer}.anmerkung .sprung:hover{border-color:var(--gold)}.chip{background:var(--flaeche-hoch);border:1px solid var(--linie);color:var(--text-leise);border-radius:999px;font:inherit;font-size:12.5px;padding:5px 12px;cursor:pointer;margin-right:6px}.chip:hover{color:var(--text)}.chip.an{border-color:var(--gold);color:var(--gold)}.modulzeile{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13.5px;padding:4px 0}.diff{width:0;min-width:100%;overscroll-behavior-x:contain;background:#141414;border:1px solid var(--linie);border-radius:8px;padding:12px 14px;font-family:Space Mono,ui-monospace,monospace;font-size:11.5px;line-height:1.6;overflow-x:auto;margin:0;color:var(--text-leise);white-space:pre}.diff .plus{color:var(--gut)}.diff .minus{color:var(--schlecht)}.diff .stelle{color:var(--gold)}.kostenband{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));grid-gap:1px;gap:1px;background:var(--linie);border:1px solid var(--linie);border-radius:12px;overflow:hidden;margin-bottom:30px}.kostenband>div{background:var(--flaeche);padding:16px 18px}.kostenband b{display:block;font-size:21px;font-weight:600;color:var(--gold);margin-bottom:3px}.kostenband span{font-size:12.5px;color:var(--text-leise)}.ausgabe{border:1px solid var(--linie);border-radius:11px;background:var(--flaeche);margin-top:10px;overflow:hidden}.ausgabe.reaction{border-color:#4a4033}.ausgabe-kopf{display:flex;align-items:center;gap:12px;padding:12px 14px}.ausgabe-kopf .name{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ausgabe-kopf .meta{color:var(--text-leise);font-size:12.5px;margin-top:2px}.ausgabe-titel{flex:1 1;min-width:0}.ausgabe-taten{display:flex;align-items:center;gap:8px;flex:none}.ausgabe-kopf .kasten{width:19px;height:19px;flex:none;border:1.5px solid #555;border-radius:5px;background:none;color:var(--anthrazit);font-size:11px;cursor:pointer;display:grid;place-items:center;padding:0}.ausgabe-kopf .kasten.an{background:var(--gold);border-color:var(--gold)}.clipliste{list-style:none;margin:0;padding:0 14px 12px 46px;display:grid;grid-gap:6px;gap:6px}.clipliste li{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--text-leise)}.clipliste .nr{width:19px;height:19px;flex:none;border-radius:50%;border:1px solid var(--linie);display:grid;place-items:center;font-size:11px}.clipliste .name{flex:1 1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text)}.ausgabe-einstellungen,.reaktionsfeld{border-top:1px solid var(--linie);margin-top:4px;padding:16px 14px}.ablage.klein{display:block;padding:22px 18px}.sammelband{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 14px;margin-top:12px;border:1px solid var(--gold);border-radius:10px;background:var(--flaeche-hoch);font-size:13.5px}.sammelband .knopf{font-size:13.5px;padding:8px 16px}@media (max-width:640px){.huelle{padding:16px 14px 72px}.kopf{flex-wrap:wrap;gap:10px;padding-bottom:16px;margin-bottom:22px}.guthaben{width:100%;justify-content:space-between;flex-wrap:wrap}.schritt{margin-bottom:26px}.schritt h2{font-size:18px}.ablage{padding:30px 16px}.ablage strong{font-size:15px}.ablage small{font-size:12px}.karten{grid-template-columns:1fr}.ausgabe-kopf,.datei{flex-wrap:wrap;gap:10px}.datei .name{flex:1 1 100%;order:-1}.ausgabe-kopf .name,.datei .name{white-space:normal;overflow-wrap:anywhere}.ausgabe-kopf>.weg{order:1}.ausgabe-taten{order:2;flex:1 0 100%;flex-wrap:wrap}.clipliste{padding-left:16px}.anmerkung .sprung,.ausgabe-kopf .kasten,.chip,.knopf{min-height:44px}.knopf.leise{padding:11px 14px}.chip{display:inline-flex;align-items:center;margin-bottom:6px}.ausgabe-kopf .kasten{min-width:44px}input,select,textarea{font-size:16px;padding:12px}.schalter{padding:14px}.sammelband{flex-direction:column;align-items:stretch}.sammelband .knopf{width:100%}.zeitleiste{height:40px}.zeitleiste .marke{width:10px;margin-left:-5px;height:26px;top:7px;border-radius:3px}.anmerkung,.modulzeile{flex-wrap:wrap}.modulzeile{gap:6px}.kostenband{grid-template-columns:1fr 1fr}.diff{font-size:10.5px}}@media (max-width:380px){.huelle{padding:14px 10px 72px}.kostenband{grid-template-columns:1fr}.schritt-nr{display:none}}@media (hover:none){.karte:hover{border-color:var(--linie)}.karte.gewaehlt:hover{border-color:var(--gold)}}