:root{
  --p-grund:#F6F2E9; --p-papier:#FAF7F0; --p-karte:#F8F4EC;
  --p-linie:#D8D0BE; --p-navy:#1E314F; --p-gruen:#3F6B57;
  --p-gold-tinte:#8A5D22; --p-gold-flaeche:#D0AA63; --p-kennz:#4F4B42; --p-fehler:#A8342A;
  --d-grund:#16243A; --d-karte:#233045; --d-tinte:#EFEADD; --d-gold:#D0AA63;
  --d-gruen:#85C1A6; --d-fehler:#F0938A; --d-muted:#8FA2BE; --d-linie:#4A5A72;
  --glas-blur-sm:12px; --glas-blur-md:18px;
  --glas-tint-light:rgba(248,244,236,.82); --glas-tint-dark:rgba(15,26,42,.75);
  --glas-schweb-light:rgba(250,247,240,.74); --glas-schweb-dark:rgba(24,39,60,.76);
  --glas-fest-light:rgba(249,246,239,.93); --glas-fest-dark:rgba(19,32,50,.93);
  --glas-edge-light:rgba(255,255,255,.55); --glas-edge-dark:rgba(255,255,255,.10);
  --t-instant:120ms; --t-fast:150ms; --t-base:200ms; --t-enter:320ms;
  --ease-state:cubic-bezier(.4,0,.2,1); --ease-enter:cubic-bezier(0,0,.2,1);
  --feder-auf:linear(0,.12 5%,.42 13%,.72 23%,.92 33%,1.02 43%,1.035 52%,1.02 64%,1.005 78%,1);
  --r-flaeche:22px; --r-karte:16px; --r-knopf:12px; --r-feld:10px; --r-chip:8px;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:44px; --s8:64px;
  --sans:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
}

[data-theme=hell]{
  --grund:var(--p-grund); --flaeche:var(--p-papier); --karte:var(--p-karte);
  --tinte:var(--p-navy); --tinte-2:#414C5E; --kennz:var(--p-kennz);
  --linie:var(--p-linie); --linie-zart:rgba(30,49,79,.11);
  --akzent:var(--p-gold-tinte); --akzent-flaeche:var(--p-gold-flaeche);
  --akzent-schrift:#7A521C;
  --akzent-tint:rgba(208,170,99,.18); --ja:var(--p-gruen); --fehler:var(--p-fehler);
  --glas:var(--glas-tint-light); --glas-schweb:var(--glas-schweb-light); --glas-fest:var(--glas-fest-light);
  --kante:var(--glas-edge-light); --kante-innen:rgba(255,255,255,.85);
  --schatten:0 24px 60px -34px rgba(16,29,48,.38), 0 1px 2px rgba(16,29,48,.05);
  --schatten-kopf:0 12px 32px -28px rgba(16,29,48,.4);
  --spekular:rgba(255,255,255,.62); --spekular-2:rgba(255,255,255,.28);
  --schatten-lift:0 30px 70px -30px rgba(16,29,48,.45), 0 1px 2px rgba(16,29,48,.06);
  --feld:#FFFFFF; --feld-linie:#B9AF98;
  --lichtkante:rgba(255,255,255,.72);
  --senke:inset 0 1px 2px rgba(16,29,48,.07);
  --schatten-karte:0 1px 1px rgba(16,29,48,.04), 0 10px 24px -20px rgba(16,29,48,.34);
  --aufsetz:0 18px 34px -26px rgba(16,29,48,.42);
  --tiefe-a:rgba(112,156,214,.26); --tiefe-b:rgba(208,170,99,.22); --tiefe-c:rgba(63,107,87,.14);
  --knopf-tinte:#16243A; --raster-linie:rgba(30,49,79,.055); color-scheme:light;
}
[data-theme=dunkel] .knopf--haupt{box-shadow:0 10px 26px -18px rgba(0,0,0,.85)}
[data-theme=dunkel]{
  --grund:var(--d-grund); --flaeche:#1B2C44; --karte:var(--d-karte);
  --tinte:var(--d-tinte); --tinte-2:#BCCBE1; --kennz:#D5CFC0;
  --linie:var(--d-linie); --linie-zart:rgba(239,234,221,.13);
  --akzent:var(--d-gold); --akzent-flaeche:var(--d-gold); --akzent-schrift:var(--d-gold);
  --akzent-tint:rgba(208,170,99,.15); --ja:var(--d-gruen); --fehler:var(--d-fehler);
  --glas:var(--glas-tint-dark); --glas-schweb:var(--glas-schweb-dark); --glas-fest:var(--glas-fest-dark);
  --kante:var(--glas-edge-dark); --kante-innen:rgba(255,255,255,.14);
  --schatten:0 28px 70px -34px rgba(0,0,0,.75), 0 1px 2px rgba(0,0,0,.35);
  --schatten-kopf:0 12px 32px -26px rgba(0,0,0,.8);
  --spekular:rgba(255,255,255,.13); --spekular-2:rgba(255,255,255,.05);
  --schatten-lift:0 34px 80px -30px rgba(0,0,0,.8), 0 1px 2px rgba(0,0,0,.4);
  --feld:#101D30; --feld-linie:#5D6E88;
  --lichtkante:rgba(255,255,255,.065);
  --senke:inset 0 1px 3px rgba(0,0,0,.38);
  --schatten-karte:0 1px 1px rgba(0,0,0,.28), 0 12px 28px -20px rgba(0,0,0,.62);
  --aufsetz:0 20px 38px -26px rgba(0,0,0,.72);
  --tiefe-a:rgba(143,162,190,.20); --tiefe-b:rgba(208,170,99,.13); --tiefe-c:rgba(133,193,166,.11);
  --knopf-tinte:#16243A; --raster-linie:rgba(239,234,221,.055); color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
svg{width:1.05em;height:1.05em;flex:none;display:inline-block;vertical-align:-.15em}
html,body{margin:0;padding:0}
body{background:var(--grund);color:var(--tinte);font:400 16px/1.55 var(--sans);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.buehne{position:relative;min-height:100%;isolation:isolate}
.tiefe{position:absolute;pointer-events:none;border-radius:50%;filter:blur(90px);z-index:0}
.tiefe.a{background:var(--tiefe-a)} .tiefe.b{background:var(--tiefe-b)} .tiefe.c{background:var(--tiefe-c)}
.tiefenfeld{position:absolute;inset:0;overflow:hidden;z-index:0;pointer-events:none}
.linie{position:absolute;background:var(--raster-linie)}
.linie.v{width:1px;top:-5%;height:110%}
.linie.h{height:1px;left:-5%;width:110%}
.linie.rahmen{background:none;border:1px solid var(--raster-linie)}
@media (prefers-reduced-transparency:reduce){.tiefenfeld{display:none}}
:where(.linienfrei,
  .d2, .h1, .h2, .txt, p.klein, span.klein, .titel-abschnitt, h3.uz, .kasse-gruppe, .wechselnote, .abstand > a.link,
  .rueckweg-links, .erz__fuss, .om-zurueck, .vo-akte__satz, .oa-unten .link, .pdf-katalog > .link, .gespraech__expose, p.gespraech__expose-leise,
  .ek-kopf, .ek-kennz, .gz-kopf, .gz-label, .gz-hilfe, .rn-kopf, .rn-bruecke, .sw-kopf, .sw-h2, .sw-schritt, .ex-kopf,
  .werbesatz, .adressstart__satz, .start-zusagen, .start-vertrauen, .start-held__zusatz, .wow-kopfzeile, .vf-fuss,
  .handy-kopf__knopf, .wl-kopf, .wa__reihen, .werkzeugliste
):where(:not(:is(.glas, .glas--schweb, .papier, .lesekern) *)){position:relative;isolation:isolate}
:where(.linienfrei,
  .d2, .h1, .h2, .txt, p.klein, span.klein, .titel-abschnitt, h3.uz, .kasse-gruppe, .wechselnote, .abstand > a.link,
  .rueckweg-links, .erz__fuss, .om-zurueck, .vo-akte__satz, .oa-unten .link, .pdf-katalog > .link, .gespraech__expose, p.gespraech__expose-leise,
  .ek-kopf, .ek-kennz, .gz-kopf, .gz-label, .gz-hilfe, .rn-kopf, .rn-bruecke, .sw-kopf, .sw-h2, .sw-schritt, .ex-kopf,
  .werbesatz, .adressstart__satz, .start-zusagen, .start-vertrauen, .start-held__zusatz, .wow-kopfzeile, .vf-fuss,
  .handy-kopf__knopf, .wl-kopf, .wa__reihen, .werkzeugliste
):where(:not(:is(.glas, .glas--schweb, .papier, .lesekern) *))::before{
  content:"";position:absolute;inset:-12px;z-index:-1;pointer-events:none;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12px,#000 calc(100% - 12px),transparent),linear-gradient(180deg,transparent,#000 12px,#000 calc(100% - 12px),transparent);
  mask-image:linear-gradient(90deg,transparent,#000 12px,#000 calc(100% - 12px),transparent),linear-gradient(180deg,transparent,#000 12px,#000 calc(100% - 12px),transparent);
  -webkit-mask-composite:source-in;mask-composite:intersect}

.glas{position:relative;isolation:isolate;background:var(--glas);border:1px solid var(--kante);
  border-radius:var(--r-flaeche);
  box-shadow:var(--schatten), var(--aufsetz), inset 0 1px 0 var(--kante-innen),
             inset 0 -1px 0 var(--spekular-2)}
.glas::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;
  background:linear-gradient(122deg,var(--spekular) 0%,transparent 38%,transparent 62%,var(--spekular-2) 100%)}
.glas--schweb{background:var(--glas-schweb);border-radius:var(--r-karte)}
@supports (backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px)){
  .glas{-webkit-backdrop-filter:blur(var(--glas-blur-md)) saturate(1.35);
        backdrop-filter:blur(var(--glas-blur-md)) saturate(1.35)}
  .glas--schweb{-webkit-backdrop-filter:blur(var(--glas-blur-sm)) saturate(1.3);
        backdrop-filter:blur(var(--glas-blur-sm)) saturate(1.3)}
}
.lesekern{background:var(--flaeche);border-radius:var(--r-karte);border:1px solid var(--linie-zart)}
.papier{background:var(--karte);border:1px solid var(--linie-zart);border-radius:var(--r-karte);
  box-shadow:var(--schatten-karte), inset 0 1px 0 var(--lichtkante)}
[data-theme=dunkel] .papier{box-shadow:var(--schatten-karte), inset 0 1px 0 var(--lichtkante)}
@media (prefers-reduced-transparency:reduce){
  .glas,.glas--schweb{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--flaeche)}
  .tiefe{display:none}
}
@media (prefers-contrast:more){
  .glas,.glas--schweb{background:var(--flaeche);border-color:var(--tinte)}
}

h1,h2,h3,p,ul,ol,figure{margin:0}
ul,ol{padding:0;list-style:none}
.d1{font:600 clamp(30px,4.6vw,46px)/1.06 var(--serif);letter-spacing:-.018em}
.d2{font:600 clamp(26px,3.6vw,38px)/1.12 var(--serif);letter-spacing:-.016em}
.h1{font:600 20px/1.28 var(--sans);letter-spacing:-.006em}
.h2{font:600 16px/1.35 var(--sans);letter-spacing:-.002em}
.uz{font:600 12.5px/1.3 var(--sans);letter-spacing:.07em;text-transform:uppercase;color:var(--tinte-2)}
.txt{font-size:15px;line-height:1.6}
.klein{font-size:13.5px;line-height:1.5;color:var(--tinte-2)}
.mini{font-size:12.5px;line-height:1.45;color:var(--tinte-2)}
.zahl{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
.kennzeichnung{color:var(--kennz);font-size:13px;line-height:1.5}
.notfall{max-width:34rem;min-height:100vh;box-sizing:border-box;margin:0 auto;padding:18vh 16px 0;text-align:center}
.notfall p{margin:0 0 12px}.notfall .notfall__satz{font-size:18px;margin-bottom:8px}
[data-theme=hell] .kennzeichnung{color:#3C3930}
[data-theme=dunkel] .kennzeichnung{color:#DED9CC}
b,strong{font-weight:600}

.knopf{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);white-space:nowrap;
  min-height:48px;padding:0 22px;border-radius:var(--r-knopf);border:1px solid transparent;
  font:600 16px/1 var(--sans);cursor:pointer;text-decoration:none;color:var(--tinte);
  background:transparent;transform:none;position:relative;overflow:hidden;
  transition:background-color var(--t-instant) var(--ease-state),
             border-color var(--t-fast) var(--ease-state),
             box-shadow var(--t-fast) var(--ease-state)}
.knopf svg{width:18px;height:18px}
.knopf--klein svg{width:16px;height:16px}
.link svg{width:16px;height:16px}
.chip svg{width:14px;height:14px}
.knopf > .inhalt{display:inline-flex;align-items:center;gap:var(--s2);
  transition:transform var(--t-instant) var(--ease-state)}
.knopf:active > .inhalt{transform:scale(.98)}
.knopf--haupt{background:var(--akzent-flaeche);color:var(--knopf-tinte);
  border-color:#B8913F;box-shadow:0 10px 26px -16px rgba(138,93,34,.7)}
.knopf--haupt:hover{box-shadow:0 14px 30px -14px rgba(138,93,34,.8)}
.knopf--zweit{border-color:var(--linie);background:var(--flaeche)}
.knopf--zweit:hover{border-color:var(--tinte-2)}
.knopf--klein{min-height:44px;padding:0 16px;font-size:14.5px}
.link{color:var(--tinte);font-weight:600;text-decoration:none;position:relative;
  padding:11px 2px;min-height:44px;display:inline-flex;align-items:center;gap:6px;
  cursor:pointer;background:none;border:0;font-size:15px}
.link::after{content:"";position:absolute;left:2px;right:2px;bottom:9px;height:1.5px;
  background:var(--akzent-flaeche);transform:scaleX(0);transform-origin:left center;
  transition:transform var(--t-base) var(--ease-enter)}
.link:hover::after,.link:focus-visible::after{transform:scaleX(1)}
.link--an::after{transform:scaleX(1)}
.link--leise{color:var(--tinte-2);font-weight:500;font-size:14px;min-width:44px}
:where(.knopf,.link,button,a,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:2px solid var(--akzent-flaeche);outline-offset:2px;border-radius:var(--r-feld)}
@media (hover:none){.knopf:hover,.link:hover::after{box-shadow:none}}

.feld{display:flex;flex-direction:column;gap:var(--s2);min-width:0}
.feld > label,.feld > .lbl{font:500 14.5px/1.3 var(--sans);color:var(--tinte)}
.feld input,.feld select,.feld textarea{width:100%;min-height:46px;padding:0 13px;
  border:1px solid var(--feld-linie);border-radius:var(--r-feld);background:var(--feld);
  color:var(--tinte);font:400 16px/1.4 var(--sans);box-shadow:var(--senke);
  transition:border-color var(--t-base) var(--ease-state),box-shadow var(--t-base) var(--ease-state)}
.feld input:hover,.feld select:hover{border-color:var(--tinte-2)}
.feld input:focus,.feld select:focus,.feld textarea:focus{border-color:var(--akzent-flaeche);
  box-shadow:0 0 0 3px var(--akzent-tint), var(--senke);outline:none}
.feld select{-webkit-appearance:none;appearance:none;padding-right:40px;background-repeat:no-repeat;
  background-image:linear-gradient(45deg,#0000 calc(50% - 1px),var(--tinte-2) 0 calc(50% + 1px),#0000 0),
    linear-gradient(-45deg,#0000 calc(50% - 1px),var(--tinte-2) 0 calc(50% + 1px),#0000 0);
  background-size:8px 8px;background-position:right 22px center,right 15px center}
.feld .hinweis{font-size:13px;line-height:1.45;color:var(--tinte-2)}
.feld--pflicht > label::after{content:none}
.feld--kann > label::after{content:"optional";float:right;font:400 13px/1.3 var(--sans);
  letter-spacing:0;color:var(--tinte-2);text-transform:none}
.nur-vorlesen{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

.seg{position:relative;display:grid;gap:4px;padding:5px;--seg-n:4;
  background:var(--flaeche);border:1px solid var(--linie-zart);border-radius:14px}
.seg > .ind{position:absolute;top:5px;bottom:5px;left:5px;
  width:calc((100% - 10px - 4px * (var(--seg-n) - 1)) / var(--seg-n));
  border-radius:10px;background:var(--akzent-tint);border:1px solid var(--akzent-flaeche);
  box-shadow:inset 0 1px 0 var(--kante-innen);
  transform:translate(calc(var(--seg-sp,0) * (100% + 4px)), calc(var(--seg-ze,0) * (100% + 4px)));
  transition:transform var(--t-base) var(--ease-enter)}
.seg > button{position:relative;z-index:1;min-height:44px;padding:0 12px;border:0;
  background:transparent;color:var(--tinte);font:500 14.5px/1.2 var(--sans);cursor:pointer;
  border-radius:10px;transition:font-weight var(--t-fast) var(--ease-state)}
.seg > button[aria-selected=true]{font-weight:700}

.klapp{border-top:1px solid var(--linie-zart)}
.klapp > summary{list-style:none;cursor:pointer;display:grid;
  grid-template-columns:1fr auto;align-items:center;gap:var(--s3);
  min-height:56px;padding:var(--s3) var(--s4);
  transition:background-color var(--t-fast) var(--ease-state)}
.klapp > summary::-webkit-details-marker{display:none}
.klapp > summary:hover{background:var(--akzent-tint)}
.klapp .kopfzeile{display:flex;flex-direction:column;gap:2px;min-width:0}
.klapp .pfeil{width:22px;height:22px;color:var(--tinte-2);flex:none;
  transition:transform var(--t-base) var(--ease-state)}
.klapp[open] > summary .pfeil{transform:rotate(90deg)}
.klapp > .inhalt{padding:0 var(--s4) var(--s5);
  animation:klappEin var(--t-enter) var(--ease-enter) both}
@keyframes klappEin{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

.chip{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:0 10px;
  border-radius:var(--r-chip);border:1px solid var(--linie);color:var(--tinte-2);
  font:600 12.5px/1 var(--sans);letter-spacing:.02em;white-space:nowrap}
.chip--beleg{border-color:var(--akzent-flaeche);background:var(--akzent-tint);color:var(--tinte)}
.chip--ja{border-color:var(--ja);color:var(--tinte)}
.chip--offen{border-style:dashed}

.logo-quelle{position:absolute;width:0;height:0;overflow:hidden}
.wortmarke{display:inline-flex;align-items:center;justify-content:center;gap:0;
  min-height:44px;min-width:44px;padding:0 4px;margin-left:-4px;
  color:var(--tinte);text-decoration:none;border-radius:var(--r-knopf);
  transition:opacity var(--t-fast) var(--ease-state)}
.wortmarke:hover{opacity:.82}
.marke-bild{width:auto;height:24px;display:block;vertical-align:middle}
.marke-zeichen{width:auto;height:28px;display:none;vertical-align:middle}
@media (max-width:760px){.marke-bild{display:none}.marke-zeichen{display:block}}
.blatt-marke{display:inline-flex;align-items:center}
.blatt-lockup{width:auto;height:14px;display:block;vertical-align:middle}

@keyframes hakenZug{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.hakenwisch{transform-box:fill-box;transform-origin:left center;
  animation:hakenZug var(--t-enter) var(--ease-enter) 120ms both}

.ein{animation:einTritt var(--t-enter) var(--ease-enter) backwards;
  animation-delay:calc(var(--i,0) * 40ms)}
@keyframes einTritt{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:1ms!important;animation-delay:0ms!important;
    animation-iteration-count:1!important;transition-duration:1ms!important}
  .knopf:active > .inhalt{transform:none}
}

.abstand > *{--i:0;animation:einTritt var(--t-enter) var(--ease-enter) backwards;
  animation-delay:calc(var(--i) * 40ms)}
.abstand > :nth-child(2){--i:1} .abstand > :nth-child(3){--i:2}
.abstand > :nth-child(4){--i:3} .abstand > :nth-child(5){--i:4}
.abstand > :nth-child(n+6){--i:5}

@supports (animation-timeline:scroll()){
  @media (prefers-reduced-motion:no-preference){
    .kopf{animation:kopfSetztAuf var(--t-base) linear both;
      animation-timeline:scroll();animation-range:0 120px}
    .tiefe{animation:tiefeZieht var(--t-base) linear both;animation-timeline:scroll()}
  }
}
@keyframes kopfSetztAuf{
  from{box-shadow:0 0 0 0 rgba(0,0,0,0);background:var(--glas)}
  to{box-shadow:var(--schatten-kopf);background:var(--glas-fest)}}
@keyframes tiefeZieht{to{transform:translate3d(0,-8%,0)}}

.zahl,.ergebniszahl,.blatt-z,.wert,.z-gross{font-variant-numeric:tabular-nums lining-nums}
.zahltausch{display:inline-grid;grid-template-areas:"z";vertical-align:baseline}
.zahltausch > *{grid-area:z}
.zahltausch > .alt{animation:zahlRaus var(--t-fast) var(--ease-state) both}
.zahltausch > .neu{animation:zahlRein var(--t-base) var(--ease-enter) both;animation-delay:120ms}
@keyframes zahlRaus{to{opacity:0;transform:translateY(-4px)}}
@keyframes zahlRein{from{opacity:0;transform:translateY(4px)}}

.skelett{display:block;border-radius:6px;background:var(--linie-zart);position:relative;
  overflow:hidden;min-height:12px}
.skelett::after{content:"";position:absolute;inset:0;transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,var(--lichtkante),transparent)}
@media (prefers-reduced-motion:no-preference){
  .skelett::after{animation:schimmer calc(var(--t-enter) * 4) var(--ease-state) infinite;
    animation-delay:calc(var(--i,0) * 40ms)}
}
@keyframes schimmer{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
.skelett--zeile{height:12px} .skelett--titel{height:17px;width:44%}
.skelett--zahl{height:40px;width:52%;border-radius:10px}

.knopf[data-arbeitet]{pointer-events:none}
.knopf[data-arbeitet] > .inhalt{visibility:hidden}
.knopf > .laeuft{position:absolute;inset:0;display:none;align-items:center;justify-content:center;
  gap:var(--s2);font:600 16px/1 var(--sans);color:inherit}
.knopf[data-arbeitet] > .laeuft{display:flex}
.kreisel{width:18px;height:18px;border-radius:50%;flex:none;
  border:2px solid currentColor;border-top-color:transparent;opacity:.85}
@media (prefers-reduced-motion:no-preference){
  .kreisel{animation:kreiselt calc(var(--t-enter) * 4) linear infinite}
}
@keyframes kreiselt{to{transform:rotate(360deg)}}

.leer{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s3);
  padding:var(--s5);border:1px dashed var(--linie);border-radius:var(--r-karte);
  background:var(--flaeche)}
.leer > .zeichen{width:34px;height:34px;color:var(--tinte-2);opacity:.75}
.leer > .t{font:600 16px/1.3 var(--sans)}
.leer > .z{font-size:14px;line-height:1.5;color:var(--tinte-2);max-width:52ch}

.quittung{display:inline-flex;align-items:center;gap:var(--s2);min-height:44px;padding:0 var(--s3);
  border-radius:var(--r-chip);background:var(--akzent-tint);color:var(--tinte);
  font:600 14px/1 var(--sans);animation:quittungEin var(--t-base) var(--ease-enter) both}
.quittung svg{width:16px;height:16px;color:var(--ja)}
@keyframes quittungEin{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

:root[data-ruhe] *,:root[data-ruhe] *::before,:root[data-ruhe] *::after{animation-duration:0s!important;animation-delay:0s!important;transition-duration:0s!important}