.ab-seite {
  --ab-nacht: #05080c;
  --ab-tinte: #eaf3ee;
  --ab-nacht-2: color-mix(in oklch, var(--ab-nacht) 92%, var(--ab-tinte));
  --ab-text-aa: color-mix(in srgb, var(--ab-tinte) 76%, var(--ab-nacht));
  --ab-weiss: var(--ab-tinte);
  --ab-schwarz: var(--ab-nacht);
  --ab-klar: transparent;
  --ab-licht: oklch(from var(--akzent) .78 calc(c * .72) h);
  --ab-licht-2: oklch(from var(--akzent) .66 calc(c * .82) calc(h + 86));
  --ab-licht-3: oklch(from var(--akzent) .6 calc(c * .7) calc(h - 48));
  --ab-auf-akzent: var(--akzent-text);
  --ab-warn: var(--warn);
  --ab-fehler: var(--gefahr);
  --ab-glas-flaeche: linear-gradient(180deg, color-mix(in oklch, var(--ab-weiss) 8.5%, var(--ab-klar)), color-mix(in oklch, var(--ab-weiss) 2.8%, var(--ab-klar)));
  --ab-glas-hoch: linear-gradient(180deg, color-mix(in oklch, var(--ab-weiss) 13%, var(--ab-klar)), color-mix(in oklch, var(--ab-weiss) 5%, var(--ab-klar)));
  --ab-kante: color-mix(in oklch, var(--ab-weiss) 11%, var(--ab-klar));
  --ab-kante-hell: color-mix(in oklch, var(--ab-weiss) 23%, var(--ab-klar));
  --ab-fluester: color-mix(in oklch, var(--ab-tinte) 8%, var(--ab-klar));
  --ab-scanlinie: color-mix(in oklch, var(--ab-tinte) 7%, var(--ab-klar));
  --ab-eckmarke: color-mix(in oklch, var(--ab-licht) 38%, var(--ab-klar));
  --ab-warn-glut: color-mix(in oklch, var(--ab-warn) 18%, var(--ab-klar));
  --ab-fehler-glut: color-mix(in oklch, var(--ab-fehler) 22%, var(--ab-klar));
  --ab-ok: oklch(from var(--akzent) .76 calc(c * .7) h);
  --ab-schatten: 0 1px 0 color-mix(in oklch, var(--ab-weiss) 7%, var(--ab-klar)) inset, 0 24px 60px -24px color-mix(in oklch, var(--ab-schwarz) 76%, var(--ab-klar)), 0 3px 10px color-mix(in oklch, var(--ab-schwarz) 30%, var(--ab-klar));
  --ab-mono: ui-monospace, "Cascadia Mono", "SFMono-Regular", Menlo, Consolas, monospace;
  --ab-rund: 20px;
  --ab-rund-klein: 12px;
  --ab-aus: cubic-bezier(.16, 1, .3, 1);
  --ab-feder: cubic-bezier(.2, .9, .25, 1);
  --ab-px-fern: 0px;
  --ab-py-fern: 0px;
  --ab-px-mitte: 0px;
  --ab-py-mitte: 0px;
  --ab-px-nah: 0px;
  --ab-py-nah: 0px;
  color-scheme: dark;
  min-height: 100dvh;
  margin: 0;
  color: var(--ab-tinte);
  background: var(--ab-nacht);
  font-variant-numeric: tabular-nums;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

.ab-seite ::selection { background: color-mix(in oklch, var(--ab-licht) 55%, var(--ab-klar)); color: var(--ab-tinte); }
.ab-seite { scrollbar-color: var(--ab-kante-hell) var(--ab-klar); }
.ab-seite ::-webkit-scrollbar { width: 10px; height: 10px; }
.ab-seite ::-webkit-scrollbar-thumb { background: var(--ab-kante-hell); border-radius: 10px; border: 3px solid var(--ab-klar); background-clip: padding-box; }
.ab-seite input { caret-color: var(--ab-licht); }
.ab-seite[data-pausiert="true"] *,
.ab-seite[data-pausiert="true"] *::before,
.ab-seite[data-pausiert="true"] *::after { animation-play-state: paused !important; }

 
.ab-himmel { position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; background: linear-gradient(180deg, var(--ab-nacht), var(--ab-nacht-2)); }
.ab-nebel { position: absolute; border-radius: 50%; filter: blur(70px); will-change: transform; }
.ab-nebel-a { width: 62vmax; height: 42vmax; inset-inline-start: -14vmax; inset-block-start: -18vmax; opacity: .34; background: radial-gradient(closest-side, var(--ab-licht), var(--ab-klar) 72%); animation: ab-drift-a 38s var(--ab-aus) infinite alternate; }
.ab-nebel-b { width: 54vmax; height: 38vmax; inset-inline-end: -16vmax; inset-block-start: 8vmax; opacity: .22; background: radial-gradient(closest-side, var(--ab-licht-2), var(--ab-klar) 70%); animation: ab-drift-b 46s ease-in-out infinite alternate; }
.ab-nebel-c { width: 48vmax; height: 30vmax; inset-inline-start: 18vmax; inset-block-end: -20vmax; opacity: .18; background: radial-gradient(closest-side, var(--ab-licht-3), var(--ab-klar) 70%); animation: ab-drift-c 52s ease-in-out infinite alternate; }
.ab-nebelband { position: absolute; width: 130vw; height: 34vh; inset-inline-start: -15vw; inset-block-start: 30vh; opacity: .07; filter: blur(34px); transform: rotate(-9deg); background: linear-gradient(90deg, var(--ab-klar), var(--ab-licht-2), var(--ab-licht), var(--ab-klar)); }
.ab-raumraster { position: absolute; width: 160vw; height: 70vh; inset-inline-start: -30vw; inset-block-end: -45vh; opacity: .07; transform: perspective(520px) rotateX(62deg) translate3d(0, 0, 0); transform-origin: 50% 0; background-image: linear-gradient(var(--ab-licht) 1px, var(--ab-klar) 1px), linear-gradient(90deg, var(--ab-licht) 1px, var(--ab-klar) 1px); background-size: 46px 34px; }
.ab-sterne { position: absolute; inset: -5%; will-change: transform; background-repeat: repeat; }
.ab-sterne-fern { opacity: .38; transform: translate3d(var(--ab-px-fern), var(--ab-py-fern), 0); background-image: radial-gradient(circle at center, var(--ab-text-aa) 0 1px, var(--ab-klar) 1.4px); background-size: 83px 79px; }
.ab-sterne-mitte { opacity: .5; transform: translate3d(var(--ab-px-mitte), var(--ab-py-mitte), 0); background-image: radial-gradient(circle at center, var(--ab-tinte) 0 1px, var(--ab-klar) 1.6px); background-size: 151px 137px; background-position: 41px 29px; }
.ab-sterne-nah { opacity: .58; transform: translate3d(var(--ab-px-nah), var(--ab-py-nah), 0); background-image: radial-gradient(circle at center, var(--ab-licht) 0 1.4px, var(--ab-klar) 1.9px); background-size: 263px 229px; background-position: 113px 71px; }
.ab-seite::after { content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none; background: radial-gradient(120% 90% at 50% 0%, var(--ab-klar) 40%, color-mix(in oklch, var(--ab-schwarz) 56%, var(--ab-klar)) 100%); }
@keyframes ab-drift-a { to { transform: translate3d(22vmax, 10vmax, 0) scale(1.15) rotate(12deg); } }
@keyframes ab-drift-b { to { transform: translate3d(-18vmax, 14vmax, 0) scale(.9) rotate(-10deg); } }
@keyframes ab-drift-c { to { transform: translate3d(-10vmax, -16vmax, 0) scale(1.2); } }

 
.ab-systemstart { position: fixed; inset: 0; z-index: 30; display: grid; place-content: center; justify-items: center; gap: 10px; color: var(--ab-tinte); background: color-mix(in oklch, var(--ab-nacht) 94%, var(--ab-klar)); backdrop-filter: blur(14px); animation: ab-start-ein .24s var(--ab-aus) both; }
.ab-systemstart[data-fertig="true"] { opacity: 0; transform: scale(1.025); transition: opacity .18s var(--ab-aus), transform .18s var(--ab-aus); }
.ab-systemstart-marke { display: grid; place-items: center; width: 56px; height: 56px; color: var(--ab-auf-akzent); border-radius: 18px; background: var(--ab-licht); box-shadow: 0 18px 44px -18px var(--ab-licht); }
.ab-systemstart-marke .sym { width: 28px; height: 28px; }
.ab-systemstart strong { font-size: 1.08rem; letter-spacing: .03em; }
.ab-systemstart small { color: var(--ab-text-aa); font: .76rem var(--ab-mono); letter-spacing: .14em; text-transform: uppercase; }
.ab-systemstart > i { width: 112px; height: 1px; overflow: hidden; background: var(--ab-kante); }
.ab-systemstart > i::after { content: ""; display: block; width: 42px; height: 100%; background: var(--ab-licht); transform: translate3d(-42px, 0, 0); animation: ab-start-linie .7s linear both; }
@keyframes ab-start-ein { from { opacity: 0; transform: scale(.985); } }
@keyframes ab-start-linie { to { transform: translate3d(112px, 0, 0); } }

 
.ab-seite .ab-huelle { position: relative; z-index: 1; max-width: 1180px; margin: 0 auto; padding: max(28px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) max(56px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left)); }
.ab-seite h1, .ab-seite h2, .ab-seite h3 { color: var(--ab-tinte); letter-spacing: -.02em; }
.ab-glas { position: relative; isolation: isolate; background: var(--ab-glas-flaeche); border: 1px solid var(--ab-kante); border-radius: var(--ab-rund); box-shadow: var(--ab-schatten); backdrop-filter: blur(22px) saturate(165%); -webkit-backdrop-filter: blur(22px) saturate(165%); }
.ab-glas::before { content: ""; position: absolute; inset: 0; border-radius: inherit; z-index: -1; pointer-events: none; opacity: 0; background: radial-gradient(160px circle at var(--mx, 50%) var(--my, 0%), color-mix(in oklch, var(--ab-licht) 10%, var(--ab-klar)), var(--ab-klar) 70%); transition: opacity .5s var(--ab-aus); }
.ab-glas:hover::before { opacity: 1; }
.ab-glas::after { content: ""; position: absolute; inset: 0; border-radius: inherit; z-index: 3; pointer-events: none; opacity: .34; background-image: repeating-linear-gradient(180deg, var(--ab-scanlinie) 0 1px, var(--ab-klar) 1px 4px), linear-gradient(var(--ab-eckmarke) 0 0), linear-gradient(var(--ab-eckmarke) 0 0), linear-gradient(var(--ab-eckmarke) 0 0), linear-gradient(var(--ab-eckmarke) 0 0), linear-gradient(var(--ab-eckmarke) 0 0), linear-gradient(var(--ab-eckmarke) 0 0), linear-gradient(var(--ab-eckmarke) 0 0), linear-gradient(var(--ab-eckmarke) 0 0); background-repeat: repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat; background-size: auto, 18px 1px, 1px 18px, 18px 1px, 1px 18px, 18px 1px, 1px 18px, 18px 1px, 1px 18px; background-position: 0 0, 12px 12px, 12px 12px, calc(100% - 12px) 12px, calc(100% - 12px) 12px, 12px calc(100% - 12px), 12px calc(100% - 12px), calc(100% - 12px) calc(100% - 12px), calc(100% - 12px) calc(100% - 12px); }
.ab-scan { overflow: hidden; }
.ab-scan > .ab-strahl { position: absolute; inset: 0; pointer-events: none; z-index: 4; border-radius: inherit; overflow: hidden; }
.ab-scan > .ab-strahl::before { content: ""; position: absolute; inset-block: 0; inset-inline-start: 0; width: 38%; background: linear-gradient(90deg, var(--ab-klar), color-mix(in oklch, var(--ab-weiss) 14%, var(--ab-klar)), color-mix(in oklch, var(--ab-licht) 26%, var(--ab-klar)), var(--ab-klar)); transform: translate3d(-120%, 0, 0) skewX(-18deg); animation: ab-strahl 1.6s var(--ab-aus) .45s both; }
@keyframes ab-strahl { to { transform: translate3d(340%, 0, 0) skewX(-18deg); } }

 
.ab-seite .ab-kopf { position: sticky; inset-block-start: 0; z-index: 8; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin: 0 -20px 28px; padding: 14px 20px; border-radius: 0 0 var(--ab-rund) var(--ab-rund); }
.ab-seite .ab-kopf[data-schwebt="true"] { background: color-mix(in oklch, var(--ab-nacht-2) 72%, var(--ab-klar)); box-shadow: 0 1px 0 var(--ab-kante), 0 18px 40px -20px color-mix(in oklch, var(--ab-schwarz) 80%, var(--ab-klar)); backdrop-filter: blur(20px) saturate(160%); -webkit-backdrop-filter: blur(20px) saturate(160%); }
.ab-marke { display: flex; align-items: center; gap: 14px; min-width: 0; }
.ab-siegel { position: relative; width: 46px; height: 46px; flex: none; border-radius: 14px; display: grid; place-items: center; color: var(--ab-auf-akzent); background: radial-gradient(circle at 30% 25%, color-mix(in oklch, var(--ab-weiss) 68%, var(--ab-licht)), var(--ab-licht) 48%, var(--akzent) 100%); box-shadow: 0 0 0 1px var(--ab-kante-hell) inset, 0 10px 30px -8px color-mix(in oklch, var(--ab-licht) 70%, var(--ab-klar)); }
.ab-siegel::after { content: ""; position: absolute; inset: -8px; z-index: -1; border-radius: inherit; background: color-mix(in oklch, var(--ab-licht) 22%, var(--ab-klar)); opacity: .22; animation: ab-atmen 5s ease-in-out infinite; }
.ab-siegel .sym { width: 24px; height: 24px; }
@keyframes ab-atmen { 50% { opacity: .62; transform: scale(1.16); } }
.ab-marke h1 { margin: 0; font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.1rem); font-weight: 650; line-height: 1.1; }
.ab-stand { margin: 4px 0 0; color: var(--ab-text-aa); font: .82rem var(--ab-mono); letter-spacing: .025em; }
.ab-kopf-knoepfe { display: flex; gap: 10px; }
.ab-knopf { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 18px; font: inherit; font-weight: 600; font-size: .9rem; color: var(--ab-tinte); text-decoration: none; cursor: pointer; background: var(--ab-glas-hoch); border: 1px solid var(--ab-kante-hell); border-radius: 999px; backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); transition: transform .28s var(--ab-feder), opacity .2s var(--ab-aus); }
.ab-knopf:hover { border-color: color-mix(in oklch, var(--ab-licht) 70%, var(--ab-klar)); transform: translateY(-1px); }
.ab-knopf:active { transform: translateY(1px) scale(.98); }
.ab-knopf .sym { width: 18px; height: 18px; }
.ab-knopf-voll { color: var(--ab-nacht); background: linear-gradient(180deg, color-mix(in oklch, var(--ab-licht) 82%, var(--ab-weiss)), var(--ab-licht)); border-color: var(--ab-klar); box-shadow: 0 10px 30px -10px color-mix(in oklch, var(--ab-licht) 80%, var(--ab-klar)); }
.ab-knopf-leise { background: var(--ab-fluester); }
.ab-knopf-gefahr { color: var(--ab-tinte); background: var(--ab-fehler-glut); border-color: var(--ab-fehler); }
.ab-knopf-voll:hover { border-color: var(--ab-klar); }
.ab-knopf[disabled] { opacity: .58; cursor: progress; }
.ab-knopf-voll[disabled] { opacity: 1; filter: saturate(.55); }

 
.ab-lage { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; margin: 0 0 24px; }
.ab-orbit { display: grid; place-items: center; align-content: center; height: 340px; box-sizing: border-box; grid-template-columns: minmax(0, 290px) minmax(0, 1fr); gap: 12px 24px; padding: 20px 30px; overflow: hidden; }
.ab-orbit svg { grid-row: 1 / 3; width: 100%; height: auto; max-width: 290px; overflow: visible; }
.ab-bahn { fill: none; stroke: var(--ab-kante); stroke-width: 1; }
.ab-bahn-test { stroke-dasharray: 2 6; stroke: color-mix(in oklch, var(--ab-text-aa) 52%, var(--ab-klar)); }
.ab-radar { transform-origin: 200px 200px; opacity: .34; }
.ab-radar path { fill: url(#abRadarVerlauf); }
.ab-kern-glut { fill: url(#abKernGlut); transform-origin: 200px 200px; animation: ab-kern 5s ease-in-out infinite; }
@keyframes ab-kern { 50% { transform: scale(1.1); opacity: .74; } }
.ab-kern { fill: color-mix(in oklch, var(--ab-licht) 78%, var(--ab-weiss)); }
.ab-kern-text { fill: var(--ab-auf-akzent); font: 800 11px var(--ab-mono); letter-spacing: .08em; text-anchor: middle; dominant-baseline: central; }
.ab-umlauf { transform-box: view-box; transform-origin: 200px 200px; will-change: transform; }
.ab-umlauf-echt { animation: ab-orbit-vor 44s linear infinite; }
.ab-umlauf-test { animation: ab-orbit-zurueck 61s linear infinite; }
.ab-umlauf-echt .ab-knoten-ausgleich { animation: ab-orbit-zurueck 44s linear infinite; }
.ab-umlauf-test .ab-knoten-ausgleich { animation: ab-orbit-vor 61s linear infinite; }
 
.ab-seite svg:is(:hover, :focus-within) :is(.ab-umlauf, .ab-knoten-ausgleich) { animation-play-state: paused; }
@keyframes ab-orbit-vor { to { transform: rotate(360deg); } }
@keyframes ab-orbit-zurueck { to { transform: rotate(-360deg); } }
.ab-knoten-treffer { fill: var(--ab-klar); pointer-events: all; }
.ab-orbit[data-beruehrt="true"] :is(.ab-umlauf, .ab-knoten-ausgleich) { animation-play-state: paused; }
.ab-knoten { cursor: pointer; outline: none; }
.ab-knoten-ausgleich { transform-box: fill-box; transform-origin: center; will-change: transform; }
.ab-knoten-halo { fill: url(#abKnotenGlut); opacity: .62; }
.ab-knoten-punkt { fill: color-mix(in oklch, var(--ab-licht) 76%, var(--ab-weiss)); stroke: var(--ab-kante-hell); stroke-width: 1; transform-box: fill-box; transform-origin: center; transition: transform .38s var(--ab-feder); }
.ab-knoten-aktivbogen { fill: none; stroke: var(--ab-licht); stroke-width: 1.8; stroke-linecap: round; stroke-dasharray: 27 73; transform-box: fill-box; transform-origin: center; animation: ab-aktivbogen 3.8s linear infinite; }
@keyframes ab-aktivbogen { to { transform: rotate(360deg); } }
.ab-knoten-fehlerkontur { fill: none; stroke: var(--ab-fehler); stroke-width: 2; filter: drop-shadow(0 0 5px var(--ab-fehler-glut)); }
.ab-knoten:hover .ab-knoten-punkt, .ab-knoten:focus-visible .ab-knoten-punkt { transform: scale(1.45); }
.ab-knoten:focus-visible .ab-knoten-halo { opacity: 1; }
.ab-knoten-name { fill: var(--ab-tinte); font: 650 10.5px "IBM Plex Sans", sans-serif; paint-order: stroke; stroke: var(--ab-nacht); stroke-width: 4px; stroke-linejoin: round; text-anchor: middle; pointer-events: none; }
.ab-orbit-legende, .ab-orbit-daten { grid-column: 2; display: flex; justify-content: center; flex-wrap: wrap; gap: 8px 16px; margin: 2px 0 0; color: var(--ab-text-aa); font-size: .74rem; }
.ab-orbit-legende span, .ab-orbit-daten span { display: inline-flex; align-items: center; gap: 7px; }
.ab-orbit-legende i { width: 8px; height: 8px; border-radius: 50%; background: var(--ab-licht); box-shadow: 0 0 10px var(--ab-licht); }
.ab-orbit-legende i.ab-test { background: var(--ab-klar); border: 1px dashed var(--ab-text-aa); box-shadow: none; }
.ab-orbit-daten { align-self: start; margin-block-start: 8px; font: .68rem var(--ab-mono); }
.ab-orbit-daten span::before { content: ""; width: 12px; height: 1px; background: var(--ab-kante-hell); }

.ab-instrumente { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; padding: 0; overflow: hidden; }
.ab-push-zaehlung { grid-column: 1 / -1; margin: 0; padding: 14px 26px; border-block-start: 1px solid var(--ab-kante); color: var(--ab-text-aa); font: .78rem/1.5 var(--ab-mono); }
.ab-instrument { position: relative; display: grid; align-content: center; gap: 8px; min-width: 0; padding: 26px 26px 30px; font: inherit; text-align: start; color: inherit; background-color: var(--ab-klar); background-image: repeating-linear-gradient(90deg, var(--ab-kante-hell) 0 1px, var(--ab-klar) 1px 8px); background-repeat: no-repeat; background-size: calc(100% - 52px) 5px; background-position: 26px calc(100% - 15px); border: 0; border-inline-start: 1px solid var(--ab-kante); cursor: pointer; perspective: 900px; transition: transform .32s var(--ab-feder), opacity .2s var(--ab-aus); }
.ab-instrument:first-child { border-inline-start: 0; }
.ab-instrument-oeffnen { display: flex; align-items: center; gap: 6px; color: var(--ab-licht); font-size: .8rem; }
.ab-instrument:hover { background-color: var(--ab-fluester); }
.ab-instrument-name { color: var(--ab-text-aa); font: 600 .75rem var(--ab-mono); letter-spacing: .075em; text-transform: uppercase; }
.ab-instrument-wert { display: inline-block; font: 650 clamp(2rem, 1.4rem + 2.2vw, 3rem)/1 var(--ab-mono); letter-spacing: -.03em; transform: translateZ(0); }
.ab-instrument-kontext { color: var(--ab-text-aa); font-size: .8rem; display: flex; align-items: center; gap: 6px; min-height: 1.2em; }
.ab-instrument-kontext .sym { width: 14px; height: 14px; }
.ab-instrument.ab-warnung .ab-instrument-wert { color: var(--ab-warn); text-shadow: 0 0 28px var(--ab-warn-glut); }
.ab-instrument.ab-warnung .ab-instrument-kontext { color: color-mix(in oklch, var(--ab-warn) 76%, var(--ab-tinte)); }
.ab-instrument.ab-warnung::before { content: ""; position: absolute; inset: 0; background: radial-gradient(80% 90% at 20% 0%, var(--ab-warn-glut), var(--ab-klar) 70%); pointer-events: none; }
.ab-neigen { transform: perspective(1000px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transform-style: preserve-3d; transition: transform .5s var(--ab-aus); }

 
.ab-seite .ab-reiter { position: relative; display: inline-grid; grid-auto-flow: column; grid-auto-columns: minmax(7.5rem, 1fr); padding: 5px; margin: 0 0 22px; border: 1px solid var(--ab-kante); border-radius: 999px; background: var(--ab-fluester); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.ab-seite .ab-reiter button { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 18px; min-width: 0; font: inherit; font-size: .92rem; font-weight: 600; color: var(--ab-text-aa); background: none; border: 0; border-radius: 999px; cursor: pointer; }
.ab-seite .ab-reiter button[aria-selected="true"] { color: var(--ab-tinte); font-weight: 650; }
.ab-reiter-zahl { font: 700 .72rem var(--ab-mono); min-width: 22px; padding: 2px 7px; border-radius: 999px; background: color-mix(in oklch, var(--ab-weiss) 10%, var(--ab-klar)); color: var(--ab-tinte); }
.ab-reiter-zahl.ab-warn { background: var(--ab-warn-glut); color: var(--ab-warn); }
.ab-schieber { position: absolute; inset-block-start: 5px; inset-inline-start: 0; height: calc(100% - 10px); border-radius: 999px; background: var(--ab-glas-hoch); border: 1px solid var(--ab-kante-hell); box-shadow: 0 8px 24px -10px color-mix(in oklch, var(--ab-licht) 60%, var(--ab-klar)), inset 0 1px 0 var(--ab-kante); transition: transform .48s var(--ab-feder); }
.ab-bereich-kopf { display: flex; align-items: end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin: 0 0 14px; }
.ab-bereich-kopf h2 { margin: 0; font-size: 1.35rem; font-weight: 650; }
.ab-suche { position: relative; flex: 0 1 20rem; min-width: 12rem; }
.ab-suche .sym { position: absolute; inset-inline-start: 14px; inset-block-start: 50%; width: 18px; height: 18px; transform: translateY(-50%); color: var(--ab-text-aa); pointer-events: none; }
.ab-seite .ab-feld { width: 100%; min-height: 44px; padding: 0 16px 0 42px; box-sizing: border-box; font: inherit; color: var(--ab-tinte); background: color-mix(in oklch, var(--ab-schwarz) 28%, var(--ab-klar)); border: 1px solid var(--ab-kante); border-radius: 999px; outline: none; }
.ab-seite .ab-feld::placeholder { color: var(--ab-text-aa); }
.ab-seite .ab-feld:focus { border-color: color-mix(in oklch, var(--ab-licht) 75%, var(--ab-klar)); box-shadow: 0 0 0 4px color-mix(in oklch, var(--ab-licht) 18%, var(--ab-klar)); background: color-mix(in oklch, var(--ab-schwarz) 40%, var(--ab-klar)); }
.ab-seite .ab-feld-schlicht { padding-inline-start: 16px; border-radius: var(--ab-rund-klein); }
.ab-seite select.ab-feld { padding: 0 38px 0 16px; appearance: none; background-image: linear-gradient(45deg, var(--ab-klar) 50%, var(--ab-text-aa) 50%), linear-gradient(135deg, var(--ab-text-aa) 50%, var(--ab-klar) 50%); background-position: calc(100% - 20px) 50%, calc(100% - 14px) 50%; background-size: 6px 6px; background-repeat: no-repeat; }

 
.ab-tabelle { overflow: hidden; }
.ab-zeilenkopf, .ab-zeile-knopf { display: grid; grid-template-columns: minmax(0, 2.4fr) .8fr .7fr 1.3fr .8fr 28px; align-items: center; gap: 12px; padding: 0 22px; }
.ab-zeilenkopf { min-height: 44px; color: var(--ab-text-aa); font: 600 .76rem var(--ab-mono); letter-spacing: .035em; border-block-end: 1px solid var(--ab-kante); }
.ab-zeile { border-block-end: 1px solid var(--ab-kante); }
.ab-zeile:last-child { border-block-end: 0; }
.ab-zeile-knopf { width: 100%; min-height: 64px; font: inherit; color: inherit; text-align: start; background: none; border: 0; cursor: pointer; }
.ab-zeile-knopf:hover { background: var(--ab-fluester); }
.ab-zeile[data-offen="true"] > .ab-zeile-knopf { background: linear-gradient(90deg, color-mix(in oklch, var(--ab-licht) 10%, var(--ab-klar)), var(--ab-klar) 70%); }
.ab-name { display: flex; align-items: center; gap: 12px; min-width: 0; font-weight: 600; }
.ab-name-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ab-status { position: relative; width: 10px; height: 10px; flex: none; border-radius: 50%; background: var(--ab-kante-hell); }
.ab-status[data-aktiv="true"] { background: var(--ab-ok); box-shadow: 0 0 12px color-mix(in oklch, var(--ab-ok) 80%, var(--ab-klar)); }
.ab-status[data-aktiv="true"]::after { content: ""; position: absolute; inset: -5px; border-radius: 50%; border: 1px solid var(--ab-ok); opacity: 0; animation: ab-ring 2.8s var(--ab-aus) infinite; }
@keyframes ab-ring { 0% { transform: scale(.4); opacity: .9; } 100% { transform: scale(1.6); opacity: 0; } }
.ab-abzeichen { flex: none; font-size: .68rem; font-weight: 700; letter-spacing: .04em; padding: 3px 9px; border-radius: 999px; color: var(--ab-warn); background: var(--ab-warn-glut); border: 1px solid color-mix(in oklch, var(--ab-warn) 35%, var(--ab-klar)); }
.ab-zahl-zelle { font-family: var(--ab-mono); font-weight: 550; }
.ab-zahl-zelle.ab-warn { color: var(--ab-warn); }
.ab-leise-zelle { color: var(--ab-text-aa); font-size: .9rem; }
.ab-pfeil { width: 20px; height: 20px; color: var(--ab-text-aa); justify-self: end; transition: transform .5s var(--ab-feder); }
.ab-fehler-gruppe[open] > summary .ab-pfeil { transform: rotate(90deg); color: var(--ab-tinte); }
.ab-zelle-mobil { display: none; }
.ab-detail { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 26px; }
.ab-gruppe h3 { display: flex; align-items: baseline; gap: 10px; margin: 0 0 12px; font-size: .95rem; font-weight: 650; }
.ab-gruppe h3 small { color: var(--ab-text-aa); font: 600 .76rem var(--ab-mono); }
.ab-gruppe-erkl { margin: -4px 0 12px; color: var(--ab-text-aa); font-size: .8rem; line-height: 1.45; max-width: 60ch; }
.ab-raster { display: grid; grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr)); gap: 8px; }
.ab-raster[aria-busy="true"] { opacity: .6; pointer-events: none; }
.ab-fuss { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px 22px; padding-block-start: 14px; border-block-start: 1px solid var(--ab-kante); color: var(--ab-text-aa); font-size: .8rem; }
.ab-fuss b { color: var(--ab-tinte); font: 600 .78rem var(--ab-mono); }
.ab-meldung { grid-column: 1 / -1; margin: 0; min-height: 1.2em; color: var(--ab-text-aa); font-size: .82rem; }
.ab-meldung:empty { display: none; }

 
.ab-seite label.ab-schalter { position: relative; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; flex: none; gap: 12px; min-height: 48px; padding: 8px 14px; border-radius: 14px; cursor: pointer; text-align: start; color: var(--ab-tinte); font-size: inherit; font-weight: inherit; background: color-mix(in oklch, var(--ab-weiss) 3.5%, var(--ab-klar)); border: 1px solid var(--ab-kante); }
.ab-seite label.ab-suche, .ab-seite label.ab-zeitraum-feld { flex-direction: row; }
.ab-seite .ab-code-form label { flex-direction: column; }
.ab-schalter:hover { background: color-mix(in oklch, var(--ab-weiss) 6%, var(--ab-klar)); }
.ab-schalter input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.ab-spur { position: relative; flex: none; width: 42px; height: 24px; border-radius: 8px; background: color-mix(in oklch, var(--ab-weiss) 14%, var(--ab-klar)); box-shadow: inset 0 1px 3px color-mix(in oklch, var(--ab-schwarz) 46%, var(--ab-klar)); }
.ab-spur::before { content: ""; position: absolute; inset: 5px 7px; border-block: 1px solid var(--ab-kante-hell); }
.ab-spur::after { content: ""; position: absolute; inset-block-start: 3px; inset-inline-start: 3px; width: 18px; height: 18px; border-radius: 6px; background: var(--ab-text-aa); box-shadow: 0 2px 6px color-mix(in oklch, var(--ab-schwarz) 42%, var(--ab-klar)); transition: transform .38s var(--ab-feder); }
.ab-schalter-text { font-size: .88rem; font-weight: 550; line-height: 1.25; }
.ab-schalter input:checked + .ab-spur { background: color-mix(in oklch, var(--ab-licht) 76%, var(--ab-klar)); box-shadow: inset 0 1px 2px color-mix(in oklch, var(--ab-schwarz) 25%, var(--ab-klar)), 0 0 18px -2px color-mix(in oklch, var(--ab-licht) 70%, var(--ab-klar)); }
.ab-schalter input:checked + .ab-spur::after { transform: translateX(18px); background: var(--ab-weiss); }
.ab-schalter:has(input:checked) { border-color: color-mix(in oklch, var(--ab-licht) 34%, var(--ab-klar)); background: color-mix(in oklch, var(--ab-licht) 7%, var(--ab-klar)); }
.ab-schalter:has(input:disabled) { cursor: default; opacity: .55; }
.ab-schalter input:focus-visible + .ab-spur { outline: 2px solid var(--ab-licht); outline-offset: 3px; }
.ab-schalter-weit { grid-column: 1 / -1; }

 
.ab-code-form { display: flex; align-items: end; flex-wrap: wrap; gap: 12px; padding: 20px 22px; margin: 0 0 18px; }
.ab-code-form label { flex: 1 1 18rem; display: grid; gap: 8px; color: var(--ab-text-aa); font-size: .85rem; font-weight: 600; }
.ab-code-form label.ab-gueltigkeit { flex: 0 1 11rem; }
.ab-ki-form { padding: 0; margin: 8px 0 0; }
.ab-ki-gesamt { margin: 0 4px 10px; }
.ab-reiter { scroll-margin-top: 96px; }  
.ab-ki-form label { flex: 0 1 12rem; }
.ab-code-ergebnis { width: 100%; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding-block-start: 16px; border-block-start: 1px solid var(--ab-kante); }
.ab-code-ergebnis p { margin: 0; color: var(--ab-text-aa); font-size: .85rem; }
.ab-seite .ab-code { font-family: var(--ab-mono); letter-spacing: .06em; overflow-wrap: anywhere; user-select: text; }
.ab-seite .ab-code-gross { font-size: clamp(1.2rem, 4vw, 1.7rem); font-weight: 650; color: var(--ab-licht); text-shadow: 0 0 24px color-mix(in oklch, var(--ab-licht) 45%, var(--ab-klar)); }
.ab-liste-glas { overflow: hidden; }
.ab-code-zeile { display: grid; grid-template-columns: minmax(0, 1.1fr) auto minmax(0, 1.4fr) minmax(0, 1.3fr); gap: 14px; align-items: center; padding: 14px 22px; border-block-end: 1px solid var(--ab-kante); }
.ab-code-zeile:last-child { border-block-end: 0; }
.ab-code-zeile[data-offen="false"] { opacity: .68; }
.ab-marke-status { font-size: .72rem; font-weight: 700; padding: 3px 10px; border-radius: 999px; background: color-mix(in oklch, var(--ab-ok) 16%, var(--ab-klar)); color: var(--ab-ok); justify-self: start; }
.ab-code-zeile[data-offen="false"] .ab-marke-status { background: var(--ab-fluester); color: var(--ab-text-aa); }
.ab-code-zeile[data-abgelaufen="true"] .ab-marke-status { background: var(--ab-warn-glut); color: var(--ab-warn); }
.ab-code-zeile .ab-code { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.ab-code-zeile small { display: block; color: var(--ab-text-aa); font-size: .78rem; }
.ab-fehler-gruppe { border-block-end: 1px solid var(--ab-kante); }
.ab-fehler-zeile { display: grid; grid-template-columns: 54px minmax(0, 1fr); border-block-end: 1px solid var(--ab-kante); }
.ab-fehler-zeile:last-child, .ab-fehler-zeile .ab-fehler-gruppe { border-block-end: 0; }
.ab-seite .ab-fehler-auswahl { display: grid; place-items: center; cursor: pointer; }
.ab-fehler-auswahl { min-width: 44px; min-height: 44px; }
.ab-fehler-auswahl input { width: 20px; height: 20px; accent-color: var(--ab-licht); }
.ab-fehler-auswahl span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.ab-fehler-auswahl input:focus-visible { outline: 2px solid var(--ab-licht); outline-offset: 3px; }
.ab-fehler-sammelform { position: sticky; inset-block-end: max(12px, env(safe-area-inset-bottom)); z-index: 7; background-color: var(--ab-nacht-2); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 9px; justify-items: start; padding: 18px 22px; margin-block: 14px; }
.ab-fehler-sammelform[hidden] { display: none; }
.ab-fehler-sammelform > p { grid-column: 1 / -1; }
.ab-fehler-sammelform > .ab-sammel-knoepfe { grid-column: 2; grid-row: 2; align-self: center; display: flex; flex-wrap: wrap; gap: 10px; }
.ab-fehler-sammelform p { margin: 0; }
.ab-fehler-sammelform label { display: grid; gap: 7px; width: min(100%, 36rem); color: var(--ab-text-aa); font-size: .84rem; font-weight: 600; }
.ab-fehler-sammelform textarea.ab-feld { min-height: 44px; padding: 12px 14px; resize: vertical; border-radius: var(--ab-rund-klein); }
.ab-filterzeile { display: flex; flex-wrap: wrap; gap: 12px 24px; align-items: center; }
.ab-seite .ab-fehler-alle { display: flex; flex-direction: row; align-items: center; gap: 12px; min-height: 44px; padding: 8px 18px; cursor: pointer; }
.ab-fehler-alle input { width: 20px; height: 20px; accent-color: var(--ab-licht); }
.ab-ladefehler { padding: 18px 22px; }
.ab-ladefehler p { margin: 0 0 12px; }
.ab-dialog-overlay { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 16px; background: color-mix(in oklch, var(--ab-nacht) 72%, var(--ab-klar)); backdrop-filter: blur(12px); }
.ab-dialog { width: min(100%, 32rem); box-sizing: border-box; max-height: calc(100dvh - 32px); overflow: auto; padding: 26px; background-color: var(--ab-nacht-2); }
.ab-dialog h2 { margin: 0 0 12px; }
.ab-dialog p { line-height: 1.6; margin: 0 0 24px; }
.ab-dialog-knoepfe { display: flex; flex-wrap: wrap; justify-content: end; gap: 10px; }
.ab-fehler-mehr { margin-block-start: 14px; }
.ab-fehler-gruppe:last-child { border-block-end: 0; }
.ab-fehler-gruppe > summary { list-style: none; display: grid; grid-template-columns: auto minmax(0, 1fr) auto 20px; gap: 14px; align-items: center; min-height: 58px; padding: 0 22px; cursor: pointer; }
.ab-fehler-gruppe > summary::-webkit-details-marker { display: none; }
 
.ab-fehler-gruppe > summary > .ab-pfeil { grid-column: -2 / -1; grid-row: 1; }
.ab-fehler-gruppe > summary:hover { background: var(--ab-fluester); }
.ab-fehler-anteil { width: 54px; height: 6px; border-radius: 99px; background: var(--ab-fluester); overflow: hidden; }
.ab-fehler-anteil span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--ab-warn), var(--ab-fehler)); }
.ab-fehler-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 550; }
.ab-fehler-zahl { white-space: nowrap; font: 700 .76rem var(--ab-mono); padding: 3px 10px; border-radius: 999px; background: var(--ab-warn-glut); color: var(--ab-warn); }
.ab-fall { padding: 16px 22px 18px 44px; border-block-start: 1px dashed var(--ab-kante); }
.ab-fall-klartext { display: grid; gap: 6px; margin-block-end: 14px; line-height: 1.5; }
.ab-fall-klartext > strong { font-size: .95rem; }
.ab-fall-klartext p { margin: 0; overflow-wrap: anywhere; }
.ab-fall-klartext b { color: var(--ab-text-aa); }
.ab-fall-version { color: var(--ab-text-aa); font-size: .84rem; }
.ab-fall-technisch { display: block; color: var(--ab-text-aa); font: .78rem/1.5 var(--ab-mono); overflow-wrap: anywhere; }
.ab-fall dl { display: grid; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); gap: 10px 20px; margin: 0 0 10px; }
.ab-fall dt { color: var(--ab-text-aa); font-size: .74rem; font-weight: 600; }
.ab-fall dd { margin: 2px 0 0; font-size: .86rem; overflow-wrap: anywhere; }
.ab-fall pre { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font: .78rem/1.5 var(--ab-mono); max-height: 18rem; overflow: auto; padding: 12px 14px; color: var(--ab-text-aa); background: color-mix(in oklch, var(--ab-schwarz) 35%, var(--ab-klar)); border: 1px solid var(--ab-kante); border-radius: var(--ab-rund-klein); }
.ab-hinweis { margin: 0 0 14px; color: var(--ab-text-aa); font-size: .82rem; }
.ab-fehler-schon-behoben { margin: 0; padding: 12px 22px 0; color: var(--ab-text-aa); font-size: .82rem; }
.ab-fehler-hilfe { margin: 0; color: var(--ab-text-aa); font-size: .76rem; }
.ab-fehler-historie { margin-block-start: 28px; }
.ab-fehler-historie h3 { margin: 0 0 12px; font-size: 1.05rem; }
.ab-behoben-zeile { padding: 16px 22px; border-block-end: 1px solid var(--ab-kante); }
.ab-behoben-zeile:last-child { border-block-end: 0; }
.ab-behoben-zeile dl { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: 12px 20px; margin: 0; }
.ab-behoben-zeile dt { color: var(--ab-text-aa); font-size: .74rem; font-weight: 600; }
.ab-behoben-zeile dd { margin: 2px 0 0; font-size: .86rem; overflow-wrap: anywhere; }
.ab-seite .ab-leer { margin: 0; padding: 38px 22px; text-align: center; color: var(--ab-text-aa); }
.ab-zeitraum-feld { display: flex; align-items: center; gap: 10px; color: var(--ab-text-aa); font-size: .85rem; font-weight: 600; }
.ab-seite .ab-zeitraum-feld { flex: none; }
.ab-seite .ab-zeitraum-feld select.ab-feld { width: auto; min-width: 9rem; }

 
.ab-seite .ab-zugang { max-width: 34rem; margin: 14vh auto 0; padding: 30px 30px 26px; }
.ab-seite .ab-zugang h1 { margin: 0 0 10px; font-size: 1.5rem; }
.ab-seite .ab-zugang p { color: var(--ab-text-aa); line-height: 1.55; margin: 0 0 22px; }
.ab-laden { display: flex; align-items: center; gap: 14px; }
.ab-laden::before { content: ""; width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--ab-kante-hell); border-block-start-color: var(--ab-licht); animation: ab-dreh .9s linear infinite; }
@keyframes ab-dreh { to { transform: rotate(360deg); } }
.ab-seite .ab-toast { color: var(--ab-tinte); background: color-mix(in oklch, var(--ab-nacht-2) 86%, var(--ab-klar)); border: 1px solid var(--ab-kante-hell); border-radius: 16px; backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); box-shadow: var(--ab-schatten); inset-block-start: auto; inset-block-end: max(24px, env(safe-area-inset-bottom)); }
.ab-seite :is(button, a, summary):focus-visible, .ab-instrument:focus-visible { outline: 2px solid var(--ab-licht); outline-offset: 3px; }
.ab-seite .sym { width: 1.1em; height: 1.1em; }

 
.ab-auftritt { animation: ab-auftritt .72s var(--ab-aus) both; animation-delay: calc(var(--i, 0) * 55ms); }
@keyframes ab-auftritt { from { opacity: 0; transform: translateY(12px) scale(.988); } }

 
@media (max-width: 860px) {
  .ab-lage { grid-template-columns: 1fr; }
  .ab-orbit { height: 260px; grid-template-columns: minmax(0, 190px) minmax(0, 1fr); padding: 14px; gap: 8px; }
  .ab-orbit svg { max-width: 190px; }
  .ab-instrumente { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ab-instrument:nth-child(3) { border-inline-start: 0; }
  .ab-instrument:nth-child(n + 3) { border-block-start: 1px solid var(--ab-kante); }
  .ab-zeilenkopf { display: none; }
  .ab-zeile-knopf { grid-template-columns: minmax(0, 1fr) 24px; min-height: 72px; padding: 12px 18px; }
  .ab-zeile-knopf > .ab-zahl-zelle, .ab-zeile-knopf > .ab-leise-zelle { display: none; }
  .ab-zelle-mobil { display: block; grid-column: 1; color: var(--ab-text-aa); font-size: .8rem; margin-block-start: -6px; }
  .ab-pfeil { grid-row: 1; grid-column: 2; }
  .ab-detail { grid-template-columns: 1fr; padding: 4px 18px 20px; }
  .ab-code-zeile { grid-template-columns: minmax(0, 1fr) auto; }
  .ab-code-zeile > :nth-child(n + 3) { grid-column: 1 / -1; }
  .ab-fall { padding-inline-start: 22px; }
  .ab-seite .ab-reiter { display: grid; width: 100%; grid-auto-columns: minmax(0, 1fr); }
  .ab-seite .ab-reiter button { padding: 0 8px; }
  .ab-suche { flex: 1 1 100%; }
}

@media (max-width: 620px) {
  .ab-seite .ab-huelle { padding-inline: max(12px, env(safe-area-inset-left)); }
  .ab-seite .ab-kopf { margin-inline: -12px; padding-inline: 12px; }
  .ab-instrument { padding: 20px 16px 26px; background-size: calc(100% - 32px) 5px; background-position: 16px calc(100% - 13px); }
  .ab-instrument-name { font-size: .68rem; letter-spacing: .04em; }
  .ab-instrument-kontext { font-size: .74rem; }
  .ab-orbit-daten { justify-content: flex-start; }
}

@media (max-width: 460px) {
  .ab-nebelband, .ab-raumraster { opacity: .04; }
  .ab-glas::after { opacity: .18; }
  .ab-scan > .ab-strahl { opacity: .34; }
  .ab-kopf-knoepfe { width: 100%; }
  .ab-kopf-knoepfe .ab-knopf { flex: 1; padding-inline: 10px; }
  .ab-marke { gap: 10px; }
  .ab-siegel { width: 42px; height: 42px; }
  .ab-orbit { grid-template-columns: minmax(0, 170px) minmax(0, 1fr); padding: 8px; }
  .ab-orbit svg { max-width: 170px; }
  .ab-orbit-legende { justify-content: start; }
  .ab-fehler-sammelform { grid-template-columns: minmax(0, 1fr); padding: 14px; }
  .ab-fehler-sammelform > .ab-sammel-knoepfe { grid-column: 1; grid-row: auto; }
  .ab-filterzeile label { flex-wrap: wrap; }
  .ab-orbit-daten { display: grid; grid-template-columns: 1fr; width: 100%; padding-inline: 0; }
  .ab-seite .ab-reiter button { gap: 4px; padding-inline: 4px; font-size: .8rem; }
  .ab-reiter-zahl { min-width: 19px; padding-inline: 5px; }
  .ab-detail { padding-inline: 12px; }
  .ab-raster { grid-template-columns: 1fr; }
  .ab-code-form { padding-inline: 14px; }
  .ab-code-form label { flex-basis: 100%; min-width: 0; }
  .ab-code-form label.ab-gueltigkeit { flex-basis: 100%; }
  .ab-ki-form { padding-inline: 0; }
  .ab-code-zeile { padding-inline: 14px; }
  .ab-fehler-gruppe > summary { grid-template-columns: minmax(0, 1fr) max-content 20px; padding-inline: 14px; gap: 8px; }
  .ab-fehler-anteil { display: none; }
  .ab-fall { padding-inline: 14px; }
  .ab-fehler-schon-behoben { padding-inline: 14px; }
  .ab-behoben-zeile { padding-inline: 14px; }
}

 
@media (prefers-reduced-motion: reduce) {
  .ab-nebel, .ab-sterne, .ab-umlauf, .ab-knoten-ausgleich, .ab-knoten-aktivbogen, .ab-kern-glut, .ab-siegel::after, .ab-status::after, .ab-laden::before, .ab-auftritt { animation: none !important; }
  .ab-sterne, .ab-neigen, .ab-umlauf, .ab-knoten-ausgleich, .ab-knoten-aktivbogen, .ab-auftritt { transform: none !important; }
  .ab-auftritt { opacity: 1 !important; }
  .ab-scan > .ab-strahl { display: none; }
  .ab-seite * { scroll-behavior: auto !important; }
}
.ab-speicher { padding: 20px; margin-block: 18px; }
.ab-speicher .ab-bereich-kopf { margin-block-start: 0; flex-wrap: wrap; }
.ab-speicher-summen { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.ab-speicher-summen h3, .ab-speicher-detail h3 { margin: 0 0 12px; font-size: .95rem; }
.ab-speicher-summe { display: block; margin-block-end: 14px; font-size: 1.2rem; font-variant-numeric: tabular-nums; }
.ab-speicher-werte { margin: 0 0 14px; font-variant-numeric: tabular-nums; }
.ab-speicher-werte > div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; padding-block: 8px; border-block-end: 1px solid var(--ab-kante); }
.ab-speicher-werte dt { color: var(--ab-text-aa); }
.ab-speicher-werte dd { margin: 0; overflow-wrap: anywhere; }
.ab-speicher-detail { grid-column: 1 / -1; }
 

.ab-speicher-summen { padding-block-end: 14px; margin-block-end: 12px; border-block-end: 1px solid var(--ab-kante); }
.ab-speicher-summen .ab-gruppe-erkl { margin-block: 2px; }
.ab-speicher-detail .ab-speicher-werte { max-width: 30rem; }
.ab-schalter-text { min-width: 0; overflow-wrap: anywhere; hyphens: auto; }
@media (max-width: 700px) { .ab-speicher-summen { grid-template-columns: 1fr; gap: 20px; } }
 
.ab-karl-wochen { width: 100%; border-collapse: collapse; font-size: .86rem; }
.ab-karl-wochen caption { padding: 14px 22px 6px; text-align: start; color: var(--ab-text-aa); font-size: .78rem; }
.ab-karl-wochen th, .ab-karl-wochen td { padding: 8px 22px; text-align: end; border-block-end: 1px solid var(--ab-kante); font-variant-numeric: tabular-nums; }
.ab-karl-wochen th:first-child, .ab-karl-wochen td:first-child { text-align: start; }
.ab-karl-wochen th { color: var(--ab-text-aa); font-size: .74rem; font-weight: 600; }
.ab-karl-runter { margin: 0; padding: 18px 22px 4px; font-size: .95rem; }

 
 
.ab-knoten-ki { fill: none; stroke: var(--ab-licht-2); stroke-width: 2.2; stroke-linecap: round; transform-box: fill-box; transform-origin: center; transform: rotate(-90deg); }
.ab-knoten-ki-spur { fill: none; stroke: var(--ab-kante); stroke-width: 1; }
.ab-knoten-puls { fill: none; stroke: var(--ab-fehler); stroke-width: 1.5; transform-box: fill-box; transform-origin: center; animation: ab-puls 2.6s ease-in-out infinite; }
@keyframes ab-puls { 0% { transform: scale(1); opacity: .8; } 100% { transform: scale(1.9); opacity: 0; } }
.ab-orbit-legende i.ab-ki { background: var(--ab-klar); border: 1.5px solid var(--ab-licht-2); box-shadow: none; }
@media (prefers-reduced-motion: reduce) { .ab-knoten-puls { animation: none; opacity: 0; } .ab-seitenfenster { animation: none !important; } }
.ab-zeile[data-gewaehlt="true"] > .ab-zeile-knopf { background: linear-gradient(90deg, color-mix(in oklch, var(--ab-licht) 14%, var(--ab-klar)), var(--ab-klar) 80%); box-shadow: inset 3px 0 0 var(--ab-licht); }
.ab-seitenfenster { position: fixed; inset: 20px 20px 20px auto; z-index: 19; width: min(66vw, 960px); max-height: calc(100dvh - 40px); box-sizing: border-box; overflow: auto; padding: 18px 22px 22px; background-color: color-mix(in oklch, var(--ab-nacht-2) 70%, var(--ab-klar)); animation: ab-fenster-ein .55s var(--ab-aus) both; }
@keyframes ab-fenster-ein { from { opacity: 0; transform: translateX(48px); } }
.ab-fenster-kopf { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 16px; padding-block-end: 14px; border-block-end: 1px solid var(--ab-kante); }
.ab-fenster-kopf .ab-name { font-size: 1.15rem; }
.ab-fenster-zu { width: 44px; padding: 0; }
.ab-seitenfenster .ab-detail { opacity: 1; transform: none; padding: 0; }
.ab-ganz { grid-column: 1 / -1; }
.ab-schalter-text small { display: block; margin-top: 2px; color: var(--ab-text-aa); font-size: .76rem; font-weight: 400; }
.ab-dialog-eingabe { display: grid; gap: 8px; margin: 0 0 24px; color: var(--ab-text-aa); font-size: .85rem; }
.ab-blatt-griff { display: none; }
.ab-blatt-schirm { position: fixed; inset: 0; z-index: 18; background: var(--ab-klar); }
@media (max-width: 620px) {
  .ab-blatt-schirm { background: color-mix(in oklch, var(--ab-nacht) 62%, var(--ab-klar)); backdrop-filter: blur(6px); }
  .ab-seitenfenster { inset: auto 0 0; width: 100%; max-height: 86dvh; padding: 10px 14px max(28px, env(safe-area-inset-bottom)); border-radius: 22px 22px 0 0; animation-name: ab-blatt-ein; }
  @keyframes ab-blatt-ein { from { opacity: 0; transform: translateY(60px); } }
  .ab-blatt-griff { display: block; width: 44px; height: 5px; margin: 0 auto 10px; border-radius: 99px; background: var(--ab-kante-hell); }
}

 

.ab-messwerte { display: grid; grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr)); gap: 8px; }
.ab-messwert { display: grid; gap: 4px; padding: 10px 14px; border-radius: 14px; border: 1px solid var(--ab-kante); background: color-mix(in oklch, var(--ab-weiss) 3.5%, var(--ab-klar)); }
.ab-messwert span { color: var(--ab-text-aa); font: 600 .68rem var(--ab-mono); letter-spacing: .07em; text-transform: uppercase; }
.ab-messwert b { font: 650 .98rem var(--ab-mono); }
.ab-messwert small { color: var(--ab-text-aa); font-size: .76rem; line-height: 1.35; }
.ab-detail .ab-karl-wochen th, .ab-detail .ab-karl-wochen td { padding: 7px 10px; }
.ab-karl-tage { margin: 0 0 12px; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--ab-kante); }
.ab-karl-tage-kopf { display: flex; justify-content: space-between; margin: 0 0 8px; color: var(--ab-text-aa); font: 600 .72rem var(--ab-mono); letter-spacing: .06em; text-transform: uppercase; }
.ab-karl-tage-kopf b { color: var(--ab-tinte); }
.ab-balken14 { display: grid; grid-template-columns: repeat(14, minmax(0, 1fr)); gap: 3px; align-items: end; height: 48px; }
.ab-balken14 i { border-radius: 3px 3px 0 0; background: linear-gradient(180deg, var(--ab-licht), color-mix(in oklch, var(--ab-licht) 45%, var(--ab-klar))); box-shadow: 0 0 10px -2px color-mix(in oklch, var(--ab-licht) 60%, var(--ab-klar)); }
.ab-balken14 i.ab-null { background: var(--ab-kante); box-shadow: none; }
.ab-balken-achse { display: flex; justify-content: space-between; margin: 4px 0 8px; color: var(--ab-text-aa); font: .68rem var(--ab-mono); }
 
.ab-schalter-text small { display: block; margin-top: 2px; color: var(--ab-text-aa); font-size: .76rem; font-weight: 400; }
.ab-registrierung { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 18px; padding: 16px 22px; margin: 0 0 18px; }
.ab-registrierung .ab-gruppe-erkl { margin: 0; flex: 1 1 22rem; }
.ab-code-zeile .ab-code .ab-knopf { min-height: 38px; padding-inline: 14px; }
.ab-fehler-sammelform > .ab-sammel-knoepfe { grid-column: 2; grid-row: 2; align-self: center; display: flex; flex-wrap: wrap; gap: 10px; }
 
.ab-gesund-raster { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.ab-gesund { padding: 20px 22px; overflow: hidden; }
.ab-gesund h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 6px; font-size: .95rem; font-weight: 650; }
.ab-gesund-wert { margin: 0 0 12px; font: 650 1.5rem/1.15 var(--ab-mono); letter-spacing: -.02em; }
.ab-gesund .ab-karl-wochen th, .ab-gesund .ab-karl-wochen td { padding: 7px 8px; }
.ab-haengt { border-color: color-mix(in oklch, var(--ab-warn) 48%, var(--ab-klar)); background: radial-gradient(90% 100% at 15% 0%, var(--ab-warn-glut), var(--ab-klar) 70%), var(--ab-glas-flaeche); }
.ab-haengt .ab-gesund-wert, .ab-haengt h3 .sym { color: var(--ab-warn); text-shadow: 0 0 24px var(--ab-warn-glut); }
.ab-ruhig .ab-gesund-wert { color: var(--ab-text-aa); }
.ab-anteile { display: grid; gap: 10px; margin: 0 0 10px; }
.ab-anteil { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr) 3rem; gap: 10px; align-items: center; font: .82rem var(--ab-mono); }
.ab-anteil i { height: 6px; border-radius: 99px; background: var(--ab-fluester); overflow: hidden; }
.ab-anteil i span { display: block; height: 100%; border-radius: inherit; background: var(--ab-licht); box-shadow: 0 0 10px var(--ab-licht); }
.ab-anteil b { text-align: end; font-weight: 600; }
 
.ab-protokoll-zeile { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.4fr) 6rem; gap: 14px; align-items: center; padding: 13px 22px; border-block-end: 1px solid var(--ab-kante); font-size: .88rem; }
.ab-protokoll-zeile:last-child { border-block-end: 0; }
.ab-protokoll-kopf { color: var(--ab-text-aa); font: 600 .74rem var(--ab-mono); letter-spacing: .035em; min-height: 44px; padding-block: 0; }
.ab-protokoll-zeit { font: .8rem var(--ab-mono); color: var(--ab-text-aa); }
.ab-protokoll-was { font-weight: 600; }
.ab-alt { color: var(--ab-text-aa); }
.ab-wird { font-family: var(--ab-mono); font-weight: 600; }
.ab-akteur { justify-self: start; font-size: .72rem; font-weight: 700; padding: 3px 10px; border-radius: 999px; background: var(--ab-fluester); color: var(--ab-text-aa); }
.ab-filterzeile + .ab-glas { margin-top: 14px; }
 
.ab-systemlage { position: relative; z-index: 9; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 22px; margin: -28px -20px 0; padding: 9px 20px; color: var(--ab-text-aa); font: .72rem var(--ab-mono); letter-spacing: .05em; border-block-end: 1px solid var(--ab-kante); background: color-mix(in oklch, var(--ab-nacht) 60%, var(--ab-klar)); }
.ab-lagepunkt { display: inline-flex; align-items: center; gap: 8px; text-transform: uppercase; }
.ab-lagepunkt b { color: var(--ab-tinte); font-weight: 600; text-transform: none; letter-spacing: .01em; }
.ab-lagepunkt i { width: 7px; height: 7px; flex: none; border-radius: 50%; background: color-mix(in oklch, var(--ab-ok) 72%, var(--ab-klar)); box-shadow: 0 0 9px color-mix(in oklch, var(--ab-ok) 60%, var(--ab-klar)); }
.ab-lagepunkt[data-zustand="haengt"] i { background: var(--ab-warn); box-shadow: 0 0 12px var(--ab-warn); }
.ab-lagepunkt[data-zustand="haengt"] b { color: var(--ab-warn); }
.ab-lagepunkt[data-zustand="aus"] i { background: var(--ab-klar); border: 1px solid var(--ab-text-aa); box-shadow: none; }
.ab-lagepunkt[data-zustand="aus"] b { color: var(--ab-text-aa); }
.ab-systemlage + .ab-kopf { margin-top: 0; }
 
.ab-verlauf { display: block; width: 100%; height: 26px; overflow: visible; }
.ab-verlauf polyline { fill: none; stroke: var(--ab-licht); stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; filter: drop-shadow(0 0 4px color-mix(in oklch, var(--ab-licht) 70%, var(--ab-klar))); }
.ab-verlauf polygon { fill: color-mix(in oklch, var(--ab-licht) 10%, var(--ab-klar)); }
.ab-warnung .ab-verlauf polyline { stroke: var(--ab-warn); filter: drop-shadow(0 0 4px var(--ab-warn-glut)); }
.ab-warnung .ab-verlauf polygon { fill: var(--ab-warn-glut); }

.ab-seite .ab-reiter-fuenf { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.ab-anteil small { grid-column: 1 / -1; color: var(--ab-text-aa); line-height: 1.5; }
.ab-protokoll-hinweis { display: block; color: var(--ab-text-aa); margin-block-start: 4px; }
.ab-tabelle-scroll { overflow-x: auto; }
.ab-code { flex-wrap: wrap; }
#abVerlaufFehler { grid-column: 1 / -1; }
@media (max-width: 620px) {
  .ab-systemlage { margin: -28px -12px 0; padding: 8px 12px; gap: 6px 14px; }
  .ab-seite .ab-reiter-fuenf { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: max-content; overflow-x: auto; scrollbar-width: none; }
  .ab-gesund-raster { grid-template-columns: 1fr; }
  .ab-protokoll-zeile { grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; padding-inline: 14px; }
  .ab-protokoll-zeile > :nth-child(n + 3):not(.ab-akteur) { grid-column: 1 / -1; }
  .ab-protokoll-zeile > .ab-akteur { grid-column: 2; grid-row: 1; }
  .ab-protokoll-kopf { display: none; }
  .ab-registrierung { padding-inline: 14px; }
}