:root { --sz-frame: #FFFFFF; --sz-edge: color-mix(in srgb, #1B2B5A 15%, transparent); --sz-karten-schatten: 0 18px 40px -16px color-mix(in srgb, #1B2B5A 50%, transparent); --weg-strich: rgba(255, 255, 255, .8); }
html[data-theme="dark"] { --sz-frame: #1B2B5A; --sz-edge: color-mix(in srgb, #F3EFE3 20%, transparent); --sz-karten-schatten: 0 18px 40px -14px rgba(3, 7, 20, .85); --weg-strich: rgba(15, 23, 48, .55); }
@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) { --sz-frame: #1B2B5A; --sz-edge: color-mix(in srgb, #F3EFE3 20%, transparent); --sz-karten-schatten: 0 18px 40px -14px rgba(3, 7, 20, .85); --weg-strich: rgba(15, 23, 48, .55); }
}
.weg figcaption { margin-top: 14px; font-size: .86rem; line-height: 1.45; color: var(--ink-2); }
.weg figcaption .illu { margin-right: 8px; padding: 3px 8px; border-radius: 999px; border: 1px solid var(--control-line, var(--ink-2)); color: var(--ink); }
.weg { margin: 0; min-width: 0; }
.weg-karte { container-type: inline-size; max-width: 600px; padding: 22px 20px; border-radius: 18px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-lg); }
.weg-feld { position: relative; }
.weg-linie { display: none; }
.weg-liste { position: relative; display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.weg-liste::before { content: ""; position: absolute; left: 17px; top: 22px; bottom: 22px; width: 10px; border-radius: 5px; background: var(--accent); }
.weg-liste li { position: relative; display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: 14px; align-items: center; min-height: 44px; padding-bottom: 16px; }
.weg-liste li:last-child { padding-bottom: 0; }
.weg-ic { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--sz-frame); border: 2.5px solid var(--ink); color: var(--ink); }
.weg-ic svg { width: 56%; height: 56%; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.weg-aktiv .weg-ic { background: var(--accent); border-color: var(--ink); color: var(--on-accent); }
.weg-wahl .weg-ic { border-style: dashed; }
.weg-txt { display: grid; gap: 1px; min-width: 0; }
.weg-txt small { font-size: .7rem; font-weight: 700; letter-spacing: .14em; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.weg-txt b { font-size: 1.02rem; line-height: 1.2; font-weight: 800; letter-spacing: -0.012em; color: var(--ink); }
.weg-txt i { font-style: normal; font-size: .82rem; line-height: 1.3; color: var(--ink-2); }
@container (min-width: 460px) {
  .weg-feld { height: 70cqw; }
  .weg-linie { display: block; position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
  .weg-linie .bahn { fill: none; stroke: var(--accent); stroke-width: 2.3; stroke-linecap: round; }
  .weg-linie .mitte { fill: none; stroke: var(--weg-strich); stroke-width: .34; stroke-dasharray: 1.5 1.5; }
  .weg-liste { position: static; display: block; }
  .weg-liste::before { display: none; }
  .weg-liste li { position: absolute; display: block; width: 35cqw; min-height: 0; padding: 0; left: calc(var(--x) * 1cqw - 4.5cqw); top: calc(var(--y) * 1cqw - 4.5cqw); }
  .weg-ic { width: 9cqw; height: 9cqw; margin-bottom: 1.6cqw; }
  .weg-1 { --x: 20; --y: 7; } .weg-2 { --x: 60; --y: 7; }
  .weg-3 { --x: 60; --y: 31; } .weg-4 { --x: 20; --y: 31; }
  .weg-5 { --x: 20; --y: 55; } .weg-6 { --x: 60; --y: 55; }
}
@media (forced-colors: active) { .weg-ic { border: 1px solid CanvasText; } }
.wg { margin: 0; min-width: 0; }
.wg-karte { container-type: inline-size; max-width: 600px; padding: 14px; border-radius: 18px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-lg); }
.wg-feld { position: relative; aspect-ratio: 100 / 76; --f: max(10px, 2.15cqw); font-size: var(--f); line-height: 1.25; color: var(--ink); }
.wg-feld svg { fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; }
.wg figcaption { margin-top: 14px; font-size: .86rem; line-height: 1.45; color: var(--ink-2); }
.wg figcaption .illu { margin-right: 8px; padding: 3px 8px; border-radius: 999px; border: 1px solid var(--control-line, var(--ink-2)); color: var(--ink); }
.wg-k { position: absolute; z-index: 2; padding: 1.8cqw 2cqw; border-radius: 2cqw; background: var(--sz-frame); border: 1px solid var(--sz-edge); box-shadow: var(--sz-karten-schatten); }
.wg-kt { display: flex; align-items: center; gap: 1.2cqw; margin: 0; font-weight: 700; white-space: nowrap; }
.wg-kt svg { flex: none; width: 1.5em; height: 1.5em; stroke-width: 1.8; color: var(--accent-ink); }
.wg-zahl { margin-left: auto; min-width: 1.7em; padding: .1em .4em; border-radius: .5em; text-align: center; font-weight: 800; background: var(--accent); color: var(--on-accent); }
.wg-chip { display: inline-block; padding: .22em .7em; border-radius: 999px; font-weight: 700; white-space: nowrap; color: var(--ink); background: color-mix(in srgb, var(--accent) 22%, var(--sz-frame)); border: 1px solid color-mix(in srgb, var(--accent) 55%, var(--sz-frame)); }
.wg-chip-akt { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.wg-kl { display: block; font-size: .86em; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-2); }
.wg-auto .karo { stroke-width: 1.5; }
.wg-auto .fein { stroke-width: 1; opacity: .62; }
.wg-auto .boden { stroke-width: 1; stroke-dasharray: 2 3; opacity: .5; }
.wg-auto .mk { fill: var(--accent); stroke: var(--sz-frame); stroke-width: 1.2; }
.wg-auto .mk-ring { stroke: var(--accent); stroke-width: 1; opacity: .7; }
.wg1 .wg-feld { background-image: radial-gradient(circle, color-mix(in srgb, var(--ink) 16%, transparent) 1px, transparent 1.4px); background-size: 4cqw 4cqw; background-position: 2cqw 2cqw; border-radius: 10px; }
.wg1 .wg-auto { position: absolute; left: 12%; top: 13cqw; width: 76%; height: auto; overflow: visible; }
.wg1 .wg-linien { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; color: var(--accent-ink); stroke-width: .4; }
.wg1 .wg-l-schmal { display: none; }
.wg1 .wg-k-stand { left: 3cqw; top: 3cqw; display: grid; gap: .9cqw; justify-items: start; }
.wg1 .wg-tag { position: absolute; right: 3cqw; top: 4cqw; font-size: .86em; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-2); background: var(--surface); padding: .1em .5em; border-radius: .4em; }
.wg1 .wg-k-fotos { left: 3cqw; top: 52cqw; width: 30.5cqw; }
.wg1 .wg-k-fotos .wg-kt { gap: .9cqw; }
.wg1 .wg-k-kva { left: 34.5cqw; top: 52cqw; width: 31cqw; display: grid; gap: 1.2cqw; justify-items: start; }
.wg1 .wg-k-rech { left: 66.5cqw; top: 52cqw; width: 30.5cqw; display: grid; gap: .6cqw; justify-items: start; }
.wg-kt-um { white-space: normal; align-items: flex-start; }
.wg-th { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5cqw; margin-top: 1.5cqw; }
.wg-th img { width: 100%; height: auto; border-radius: 1.2cqw; }
.wg-bl { margin-top: .6cqw; font-size: .9em; color: var(--ink-2); }
.wg-betrag { font-size: 1.45em; font-weight: 800; letter-spacing: -0.01em; font-variant-numeric: tabular-nums; white-space: nowrap; }
@container (max-width: 459px) {
  .wg1 .wg-feld { aspect-ratio: 100 / 88; }
  .wg1 .wg-l-breit { display: none; } .wg1 .wg-l-schmal { display: block; }
  .wg1 .wg-k-fotos { width: 45cqw; }
  .wg1 .wg-k-kva { left: 51cqw; width: 46cqw; }
  .wg1 .wg-k-kva .wg-chip { display: none; }
  .wg1 .wg-k-rech { left: 51cqw; width: 46cqw; top: auto; bottom: 2cqw; }
}
@container (max-width: 459px) { .wg1 .wg-auto { top: 15cqw; } }
.wg-ic { flex: none; width: 1.5em; height: 1.5em; stroke-width: 1.8; }
.wg-sub { font-size: .9em; color: var(--ink-2); }
.wg-gross { font-size: 1.9em; line-height: 1; font-weight: 800; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.wg-ab .wg-feld { border-radius: 10px; overflow: hidden; background: color-mix(in srgb, var(--accent) 7%, var(--surface)); }
.wg-ab .wg-plan { position: absolute; inset: 0; width: 100%; height: 100%; }
.wg-ab .wg-plan .str { stroke: var(--surface); stroke-width: 3.4; stroke-linecap: butt; }
.wg-ab .wg-plan .blk { stroke: none; fill: color-mix(in srgb, var(--ink) 7%, transparent); }
.wg-ab .wg-plan .weg1 { stroke: var(--accent); stroke-width: 1.5; }
.wg-ab .wg-plan .weg2 { stroke: var(--ink); stroke-width: .7; stroke-dasharray: 1.4 1.6; opacity: .75; }
.wg-pt { position: absolute; z-index: 2; display: flex; align-items: center; gap: 1.2cqw; transform: translate(-4cqw, -50%); white-space: nowrap; font-weight: 700; }
.wg-pt > span:first-child { display: grid; place-items: center; width: 8cqw; height: 8cqw; border-radius: 50%; background: var(--sz-frame); border: 2px solid var(--ink); color: var(--ink); }
.wg-pt > span:first-child svg { width: 58%; height: 58%; stroke-width: 1.8; }
.wg-pt-lkw > span:first-child { background: var(--accent); color: var(--on-accent); }
.wg-pt-klein > span:first-child { width: 4.4cqw; height: 4.4cqw; border-width: 2px; }
.wg-pt-lkw { left: 13cqw; top: 60cqw; }
.wg-pt-ort { left: 58cqw; top: 26cqw; }
.wg-pt-klein { left: 84cqw; top: 52cqw; flex-direction: row-reverse; transform: translate(calc(-100% + 2.2cqw), -50%); }
.wg-pt .wg-name { padding: .2em .6em; border-radius: .5em; background: var(--sz-frame); border: 1px solid var(--sz-edge); }
.wg-ab .wg-k-uhr { left: 3cqw; top: 3cqw; display: grid; grid-template-columns: 13cqw auto; align-items: center; gap: 2cqw; }
.wg-uhr { width: 100%; height: auto; color: var(--ink); }
.wg-uhr .rand { stroke-width: 1.6; fill: var(--sz-frame); }
.wg-uhr .strich { stroke-width: 1; opacity: .55; }
.wg-uhr .std { stroke-width: 2.2; }
.wg-uhr .min { stroke-width: 1.5; stroke: var(--accent-ink); }
.wg-uhr .mitte { fill: currentColor; stroke: none; }
.wg-ab .wg-uhr-txt { display: grid; gap: .5cqw; justify-items: start; }
.wg-ab .wg-k-stand { right: 3cqw; bottom: 3cqw; display: grid; gap: .9cqw; justify-items: start; }
.wg-gu .wg-feld { --qx: 3cqw; --qw: 33cqw; --bx: 46cqw; }
.wg-gu .wg-q { left: var(--qx); width: var(--qw); transform: translateY(-50%); display: flex; align-items: center; gap: 1.2cqw; font-weight: 700; white-space: nowrap; }
.wg-gu .wg-q svg { color: var(--accent-ink); }
.wg-gu .wg-pf { position: absolute; z-index: 1; left: calc(var(--qx) + var(--qw)); width: calc(var(--bx) - var(--qx) - var(--qw)); height: 0; border-top: 2px dashed var(--accent-ink); }
.wg-gu .wg-pf::after { content: ""; position: absolute; right: -1px; top: -1px; width: 1.6cqw; height: 1.6cqw; border-top: 2px solid var(--accent-ink); border-right: 2px solid var(--accent-ink); transform: translateY(-50%) rotate(45deg); transform-origin: center; margin-top: -1px; }
.wg-gu .r1 { top: 24.5cqw; } .wg-gu .r2 { top: 40.5cqw; } .wg-gu .r3 { top: 55cqw; }
.wg-blatt { position: absolute; z-index: 2; left: var(--bx); right: 4cqw; top: 3cqw; bottom: 3cqw; padding: 2.4cqw; border-radius: 1.6cqw; background: var(--sz-frame); border: 1px solid var(--sz-edge); box-shadow: var(--sz-karten-schatten); }
.wg-blatt-kopf { display: flex; flex-wrap: wrap; align-items: center; gap: 1cqw 1.6cqw; height: 11cqw; align-content: center; border-bottom: 1px solid var(--line); }
.wg-blatt-kopf b { font-size: 1.2em; font-weight: 800; letter-spacing: -0.01em; }
.wg-fach { position: absolute; left: 2.4cqw; right: 2.4cqw; border-radius: 1.2cqw; border: 1.5px dashed color-mix(in srgb, var(--accent-ink) 60%, transparent); background: color-mix(in srgb, var(--accent) 7%, var(--sz-frame)); display: flex; align-items: center; gap: 1.6cqw; padding: 1.2cqw 1.6cqw; }
.wg-fach.f1 { top: 16cqw; height: 11cqw; } .wg-fach.f2 { top: 29cqw; height: 17cqw; } .wg-fach.f3 { top: 48cqw; height: 8cqw; }
.wg-kachel { flex: none; height: 100%; aspect-ratio: 4 / 3; border-radius: .9cqw; display: grid; place-items: center; background: color-mix(in srgb, var(--ink) 12%, var(--sz-frame)); color: var(--ink-2); }
.wg-kachel svg { width: 46%; height: 46%; stroke-width: 1.6; }
.wg-fach .wg-auto { height: 100%; width: auto; max-width: 100%; margin-inline: auto; overflow: visible; }
.wg-balken { display: grid; gap: .9cqw; flex: 1; }
.wg-balken i { display: block; height: 1.1cqw; border-radius: 1cqw; background: color-mix(in srgb, var(--ink) 16%, var(--sz-frame)); }
.wg-balken i:last-child { width: 62%; }
.wg-stempel { position: absolute; right: 2.4cqw; bottom: 2.6cqw; transform: rotate(-5deg); padding: .35em .8em; border-radius: .6em; border: 2px solid var(--accent-ink); color: var(--ink); font-weight: 800; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; background: var(--sz-frame); }
@container (max-width: 459px) { .wg-gu .wg-feld { --qx: 1cqw; --qw: 41cqw; --bx: 48cqw; } .wg-gu .wg-blatt { right: 1cqw; padding: 2cqw; } .wg-gu .wg-q svg { display: none; } .wg-fach { left: 2cqw; right: 2cqw; } .wg-stempel { right: 2cqw; font-size: .92em; } }
.wg-ka .wg-ruecken { position: absolute; left: 6cqw; right: 6cqw; top: 25cqw; bottom: 3cqw; border-radius: 2cqw; background: color-mix(in srgb, var(--accent) 34%, var(--surface)); }
.wg-ka .wg-ruecken::before { content: ""; position: absolute; right: 0; top: -5cqw; width: 20cqw; height: 7cqw; border-radius: 2cqw 2cqw 0 0; background: inherit; }
.wg-dok { position: absolute; z-index: 1; width: 35cqw; height: 40cqw; padding: 1.8cqw 2cqw; border-radius: 1.4cqw; background: var(--sz-frame); border: 1px solid var(--sz-edge); box-shadow: 0 6px 16px -8px color-mix(in srgb, #0F1730 55%, transparent); display: grid; align-content: start; gap: 1.1cqw; }
.wg-dok b { font-weight: 800; white-space: nowrap; }
.wg-dok .wg-frei { justify-self: start; display: inline-flex; align-items: center; gap: .4em; font-size: .9em; color: var(--ink-2); white-space: nowrap; }
.wg-dok .wg-frei svg { width: 1.3em; height: 1.3em; stroke-width: 2; color: var(--accent-ink); }
.wg-dok .wg-balken { margin-top: .6cqw; width: 42%; }
.wg-dok.d1 { left: 8cqw; top: 4cqw; transform: rotate(-3deg); }
.wg-dok.d2 { left: 27cqw; top: 9cqw; }
.wg-dok.d3 { left: 46cqw; top: 14cqw; transform: rotate(3deg); }
.wg-ka .wg-front { position: absolute; z-index: 2; left: 4cqw; right: 4cqw; top: 37cqw; bottom: 2cqw; padding: 2.6cqw 3cqw; border-radius: 2cqw; background: var(--sz-frame); border: 1px solid var(--sz-edge); border-top: 3px solid var(--accent); box-shadow: var(--sz-karten-schatten); display: grid; align-content: space-between; gap: 1cqw; }
.wg-ka .wg-front p { margin: 0; font-weight: 600; text-wrap: balance; }
.wg-ka .wg-zst { display: flex; align-items: center; gap: 1.6cqw; }
.wg-leiste { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1cqw; }
.wg-leiste i { height: 1.4cqw; border-radius: 1cqw; background: color-mix(in srgb, var(--ink) 16%, var(--sz-frame)); }
.wg-leiste i.voll { background: var(--accent); }
.wg-enden { display: flex; justify-content: space-between; font-size: .9em; color: var(--ink-2); }
@container (max-width: 459px) { .wg-dok .wg-frei { display: none; } .wg-ka .wg-front { top: 36cqw; padding: 2cqw 2.4cqw; } }
@container (max-width: 459px) { .wg-stempel { font-size: .82em; letter-spacing: 0; padding: .3em .5em; transform: rotate(-3deg); } }
@container (max-width: 459px) { .wg-dok { padding-top: 1.3cqw; } .wg-dok.d1 { top: 1.5cqw; } .wg-dok.d2 { top: 9cqw; } .wg-dok.d3 { top: 16.5cqw; } }
.wg-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.wg-kz { display: inline-block; padding: .08em .5em; border-radius: .35em; border: 1.5px solid var(--ink); font-weight: 800; letter-spacing: .03em; font-variant-numeric: tabular-nums; white-space: nowrap; background: var(--sz-frame); }
.wg-zeile { display: flex; flex-wrap: wrap; align-items: center; gap: .5em .7em; }
.wg-stark { font-weight: 800; letter-spacing: -0.005em; }
.wg-pers { display: inline-flex; align-items: center; gap: .35em; padding: .22em .65em .22em .3em; border-radius: 999px; font-weight: 700; white-space: nowrap; border: 1px solid color-mix(in srgb, var(--accent) 55%, var(--sz-frame)); background: color-mix(in srgb, var(--accent) 22%, var(--sz-frame)); }
.wg-pers svg { flex: none; width: 1.35em; height: 1.35em; stroke-width: 2; }
.wg-pers-offen { background: transparent; border: 1px dashed var(--control-line, var(--ink-2)); color: var(--ink-2); }
.wg-fp .wg-feld { aspect-ratio: auto; --f: max(11px, 2.15cqw); }
.wg-fp .fp-linie, .wg-fp .wg-tag { display: none; }
.fp-liste { position: relative; display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.fp-liste::before { content: ""; position: absolute; left: 15px; top: 20px; bottom: 14px; width: 6px; border-radius: 3px; background: var(--accent); }
.fp-liste li { position: relative; display: grid; grid-template-columns: 36px minmax(0, 1fr); column-gap: 10px; align-items: center; }
.fp-ic { position: relative; z-index: 1; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--sz-frame); border: 2.5px solid var(--ink); color: var(--ink); }
.fp-ic svg { width: 56%; height: 56%; stroke-width: 1.9; }
.fp-aktiv .fp-ic { background: var(--accent); color: var(--on-accent); }
.fp-offen .fp-ic { border-style: dashed; }
.wg-fp .wg-k { position: static; display: grid; gap: .4em; justify-items: start; padding: 8px 11px; border-radius: 10px; }
.wg-fp .fp-aktiv .wg-k { border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink), var(--sz-karten-schatten); }
.fp-betrag { display: flex; align-items: baseline; justify-content: space-between; gap: .8em; width: 100%; }
.fp-ziel { font-weight: 700; color: var(--ink-2); }
@container (min-width: 460px) {
  .wg-fp .wg-feld { aspect-ratio: 100 / 76; }
  .wg-fp .fp-linie { display: block; position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
  .fp-linie .rest { stroke: color-mix(in srgb, var(--accent) 34%, var(--surface)); stroke-width: 2.3; }
  .fp-linie .bahn { stroke: var(--accent); stroke-width: 2.3; }
  .fp-linie .mitte { stroke: var(--weg-strich); stroke-width: .34; stroke-dasharray: 1.5 1.5; }
  .fp-linie .stiel { stroke: var(--ink); stroke-width: .45; }
  .wg-fp .wg-tag { display: block; position: absolute; right: 2cqw; top: 2cqw; font-size: .86em; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-2); }
  .fp-liste { position: static; display: block; }
  .fp-liste::before { display: none; }
  .fp-liste li { position: static; display: block; }
  .fp-ic { position: absolute; z-index: 2; width: 9cqw; height: 9cqw; left: calc(var(--x) * 1cqw - 4.5cqw); top: calc(var(--y) * 1cqw - 4.5cqw); }
  .wg-fp .wg-k { position: absolute; left: calc(var(--kx) * 1cqw); top: calc(var(--ky) * 1cqw); width: calc(var(--kw) * 1cqw); padding: 1.7cqw 2cqw; border-radius: 2cqw; gap: .7cqw; }
  .fp-1 { --x: 14; --y: 14; --kx: 3; --ky: 21; --kw: 34; }
  .fp-2 { --x: 52; --y: 14; --kx: 40; --ky: 21; --kw: 38; }
  .fp-3 { --x: 72; --y: 51; --kx: 50; --ky: 58; --kw: 47; }
  .fp-4 { --x: 36; --y: 51; --kx: 17; --ky: 58; --kw: 31; }
  .fp-5 { --x: 8; --y: 51; }
  .fp-5 .fp-ic { width: 6.4cqw; height: 6.4cqw; left: calc(var(--x) * 1cqw - 3.2cqw); top: calc(var(--y) * 1cqw - 3.2cqw); border-width: 2px; }
  .fp-ziel { position: absolute; left: 2.4cqw; top: 57cqw; font-size: .92em; }
}
@media (forced-colors: active) { .fp-ic { border: 1px solid CanvasText; } }
.wg-as .wg-feld { aspect-ratio: auto; --f: max(10.5px, 2.15cqw); display: grid; gap: 0; }
.as-flotten { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2cqw; }
.wg-as .as-f { position: static; display: grid; gap: .45em; justify-items: start; align-content: start; padding: 7px 8px; border-radius: 10px; min-width: 0; }
.as-f .wg-kt { gap: .4em; }
.as-f .wg-sub { white-space: nowrap; }
.as-lang { display: none; }
.as-aktiv { border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink), var(--sz-karten-schatten); }
.wg-chip-leer { background: transparent; border: 1px solid var(--control-line, var(--ink-2)); color: var(--ink-2); }
.as-zug { justify-self: start; margin-left: 15cqw; width: 0; height: 16px; border-left: 2px dashed var(--accent-ink); }
.wg-as .wg-blatt { position: static; padding: 10px; border-radius: 10px; display: grid; gap: 8px; }
.wg-as .wg-blatt-kopf { height: auto; padding-bottom: 8px; gap: .4em .7em; }
.as-fach { display: grid; gap: .55em; justify-items: start; padding: 8px 9px; border-radius: 8px; border: 1px solid var(--sz-edge); background: color-mix(in srgb, var(--accent) 7%, var(--sz-frame)); }
.as-fach .fp-betrag { align-items: baseline; }
.as-titel { display: none; }
.as-entsch { position: relative; display: grid; gap: .6em; justify-items: start; padding: 8px 9px; border-radius: 8px; border: 1.5px dashed color-mix(in srgb, var(--accent-ink) 60%, transparent); }
.as-entsch .wg-balken { width: 70%; gap: 5px; } .as-entsch .wg-balken i { height: 4px; }
.as-prot { display: flex; align-items: center; gap: .45em; }
.as-prot svg { flex: none; width: 1.3em; height: 1.3em; stroke-width: 1.9; color: var(--accent-ink); }
.wg-as .wg-stempel { position: static; display: inline-block; font-size: .92em; }
@container (min-width: 460px) {
  .wg-as .wg-feld { aspect-ratio: 100 / 76; display: block; }
  .as-flotten { display: block; }
  .as-lang { display: inline; }
  .wg-as .as-f { position: absolute; left: 3cqw; width: 34cqw; padding: 1.8cqw 2cqw; border-radius: 2cqw; gap: .8cqw; }
  .as-titel { position: absolute; left: 3cqw; top: 3cqw; }
  .as-f1 { top: 9cqw; } .as-f2 { top: 32cqw; } .as-f3 { top: 55cqw; }
  .as-zug { position: absolute; z-index: 1; margin: 0; left: 37cqw; top: 17cqw; width: 9cqw; height: 0; border-left: 0; border-top: 2px dashed var(--accent-ink); }
  .as-zug::after { content: ""; position: absolute; right: -1px; top: -1px; width: 1.6cqw; height: 1.6cqw; border-top: 2px solid var(--accent-ink); border-right: 2px solid var(--accent-ink); transform: translateY(-50%) rotate(45deg); margin-top: -1px; }
  .wg-as .wg-blatt { position: absolute; left: 46cqw; right: 3cqw; top: 3cqw; bottom: 3cqw; padding: 2.4cqw; border-radius: 1.6cqw; gap: 2cqw; grid-template-rows: auto auto 1fr auto; }
  .as-titel { display: block; }
  .wg-as .wg-blatt-kopf { padding-bottom: 2cqw; gap: 1cqw 1.6cqw; }
  .as-fach { padding: 2cqw; border-radius: 1.2cqw; gap: 1.3cqw; }
  .as-entsch { align-content: start; gap: 1.5cqw; padding: 2cqw; border-radius: 1.2cqw; }
  .as-entsch .wg-balken { gap: .9cqw; } .as-entsch .wg-balken i { height: 1.1cqw; }
  .wg-as .wg-stempel { position: absolute; right: 2cqw; bottom: 2.2cqw; transform: rotate(-4deg); }
}
.wg-ve .wg-feld { aspect-ratio: auto; --f: max(10.5px, 2.15cqw); display: grid; gap: 12px; }
.ve-akte { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 44%; gap: 8px 10px; align-items: center; padding: 10px; border-radius: 10px; background: var(--sz-frame); border: 1px solid var(--sz-edge); border-top: 3px solid var(--accent); box-shadow: var(--sz-karten-schatten); }
.ve-kopf { display: grid; gap: .45em; justify-items: start; }
.ve-kopf b { font-size: 1.25em; font-weight: 800; letter-spacing: -0.01em; }
.ve-skizze { padding: 6px; border-radius: 8px; background-color: color-mix(in srgb, var(--ink) 4%, var(--sz-frame)); background-image: radial-gradient(circle, color-mix(in srgb, var(--ink) 18%, transparent) 1px, transparent 1.4px); background-size: 12px 12px; background-position: 6px 6px; }
.ve-skizze .wg-auto { display: block; width: 100%; height: auto; overflow: visible; }
.ve-inhalt { grid-column: 1 / -1; display: grid; gap: .5em; }
.ve-faecher { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; }
.ve-faecher span { padding: .4em .2em; border-radius: 6px; border: 1px solid var(--sz-edge); text-align: center; font-weight: 700; font-size: .92em; white-space: nowrap; }
.ve-zug { display: none; }
.ve-liste { position: relative; margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.ve-liste::before { content: ""; position: absolute; left: 14px; top: 30px; bottom: 30px; width: 2px; margin-left: -1px; background: var(--accent-ink); }
.ve-liste li { display: grid; grid-template-columns: 28px minmax(0, 1fr); column-gap: 10px; align-items: center; }
.ve-kn { position: relative; z-index: 1; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--sz-frame); border: 2px solid var(--ink); color: var(--ink); }
.ve-kn svg { width: 60%; height: 60%; stroke-width: 1.9; }
.wg-ve .ve-liste .wg-k { position: static; display: grid; gap: .4em; justify-items: start; padding: 8px 11px; border-radius: 10px; }
@container (min-width: 460px) {
  .wg-ve .wg-feld { aspect-ratio: 100 / 76; display: block; }
  .ve-akte { position: absolute; left: 2cqw; top: 3cqw; bottom: 3cqw; width: 37cqw; grid-template-columns: minmax(0, 1fr); align-content: space-between; gap: 2cqw; padding: 2.6cqw; border-radius: 2cqw; }
  .ve-skizze { padding: 2.4cqw 1.6cqw; border-radius: 1.4cqw; background-size: 3cqw 3cqw; background-position: 1.5cqw 1.5cqw; }
  .ve-faecher { grid-template-columns: 1fr 1fr; gap: 1.2cqw; }
  .ve-faecher span { padding: .5em .3em; border-radius: 1.2cqw; }
  .ve-zug { display: block; position: absolute; z-index: 1; left: 39cqw; top: 38cqw; width: 7.6cqw; height: 0; border-top: 2px dashed var(--accent-ink); }
  .ve-liste { position: absolute; left: 45cqw; right: 2cqw; top: 3cqw; bottom: 3cqw; gap: 0; align-content: space-between; }
  .ve-liste::before { left: 3.4cqw; top: 9.8cqw; bottom: 9.8cqw; }
  .ve-liste li { grid-template-columns: 6.8cqw minmax(0, 1fr); column-gap: 2.4cqw; }
  .ve-kn { width: 6.8cqw; height: 6.8cqw; }
  .wg-ve .ve-liste .wg-k { padding: 1.9cqw 2.2cqw; border-radius: 2cqw; gap: .9cqw; min-height: 19.6cqw; align-content: center; }
}