/* =========================================================================
   QUADRONET Layout - Weitere Website-Checks (qn_page_audit, 26.10.2026)
   -------------------------------------------------------------------------
   Rohrpost (Domain & E-Mail), Sicherungskasten (Sicherheit), Schleuse
   (Datenschutz-Technik), Rueckenetikett (E-Label).

   Markup: Resources/Private/Overrides/QnPageAudit/Templates/<Plugin>/Index.html
   (ersetzt die Vorlagen der Extension). Die Ergebnisse kommen als HTML aus
   den Partials Kurzcheck/* der Extension (Klassen qnkc-*) und werden hier
   eingefaerbt; der Abschluss mit Garagentoren kommt aus
   Overrides/QnPageAudit/Partials/Kurzcheck/Abschluss.html.
   Die neutrale kurzcheck.css der Extension wird NICHT geladen.

   Geschwister von Echolot (90), Pruefstand (92), Leuchtfeuer (93):
   gleiches Pult, gleiche Nische, gleiche Palette, Knoepfe als Garagentor.
   BEWUSST OHNE @layer und alles unter .lq-kurz - wie 90/92/93.

   Kontraste auf der Karte (hellster Punkt #22384A): Text #EAF4FF 10,9:1,
   leise #9FC0D8 6,3:1, Kritisch #FF8A7A 5,3:1, Wichtig #FFA94D 6,4:1,
   Hinweis #79B0C0 5,1:1, Gut #4FBE8B 5,2:1, Info #9FC0D8 6,3:1.
   ========================================================================= */

.lq-kurz {
  --l-text:     var(--hell, #EAF4FF);
  --l-leise:    var(--hell-2, #9FC0D8);
  --l-orange:   var(--orange, #FF8800);
  --l-akzent:   var(--orange-hell, #FFA94D);
  --l-auf:      var(--auf-orange, #141A1F);
  --l-linie:    var(--qn-linie-fein, rgba(190, 215, 235, .18));
  --l-linie-2:  var(--qn-linie, rgba(190, 215, 235, .28));
  --l-fokus:    var(--qn-fokus, #FFD9A8);
  --l-schrift:  var(--qn-schriftfamilie, "IBM Plex Sans", system-ui, sans-serif);
  --l-titel:    var(--qn-schriftfamilie-ueberschrift, "Bebas Neue", sans-serif);
  --l-karte:    linear-gradient(160deg, #22384A 0%, #1B2B38 60%, #17242F 100%);
  --l-kritisch: #FF8A7A;
  --l-wichtig:  #FFA94D;
  --l-hinweis:  #79B0C0;
  --l-gut:      #4FBE8B;
  --l-info:     #9FC0D8;
  --l-wand-rgb: 52 82 103;
  --l-feld-rgb: 20 26 31;
  --l-osd:      500 .64rem/1.2 var(--l-schrift);

  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(1.4rem, 3vw, 2.2rem);
  max-width: 64rem;
  color: var(--l-text);
  font-family: var(--l-schrift);
}
.lq-kurz *,
.lq-kurz *::before,
.lq-kurz *::after { box-sizing: border-box; }
@media (max-width: 30rem) {
  .lq-kurz .gt { --gt-luft-x: 1.1em; }
  .lq-kurz .gt__mass,
  .lq-kurz .gt__tor-schild { white-space: normal; text-align: center; }
}
.lq-kurz :is(.qnkc-bericht, .qnkc-abschluss) :is(p, ol, ul, li, dl) { max-width: none; }

.lq-kurz .qnkc-nur-vorlesen {
  position: absolute !important;
  width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%);
  white-space: nowrap; border: 0;
}
.lq-kurz .qnkc-honig { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.lq-kurz > [data-qnkc-abschluss]:empty { display: none; }

.lq-kurz a { color: var(--l-akzent); text-underline-offset: .2em; }
.lq-kurz a:hover { color: #fff; }
.lq-kurz a:focus-visible,
.lq-kurz summary:focus-visible,
.lq-kurz [tabindex]:focus-visible { outline: 3px solid var(--l-fokus); outline-offset: 2px; border-radius: 2px; }
.lq-kurz .qnkc-bericht__titel:focus { outline: none; }
.lq-kurz .qnkc-bericht__titel:focus-visible { outline: 3px solid var(--l-fokus); outline-offset: 4px; }

.lq-kurz__kicker {
  display: inline-flex; align-items: center; gap: .7em;
  margin: 0 0 .7rem;
  font: 500 .72rem/1.5 var(--l-schrift);
  letter-spacing: .19em; text-transform: uppercase;
  color: var(--l-leise);
}
.lq-kurz__kicker::before { content: ""; width: .6em; height: .6em; background: var(--l-orange); transform: rotate(8deg); }
.lq-kurz__lead { max-width: 62ch; margin: 0; font-size: clamp(1rem, .96rem + .25vw, 1.12rem); line-height: 1.65; text-wrap: pretty; }


/* ===================================================================
   1. Pult
   =================================================================== */
.lq-kurz__pult {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.4rem;
  padding: clamp(1.2rem, 3vw, 2rem);
  border: 1px solid var(--l-linie);
  border-left: 3px solid var(--l-orange);
  border-radius: 3px;
  background: var(--l-karte);
  box-shadow: var(--sch-blatt, 0 10px 30px -14px rgba(0, 0, 0, .66));
}
@media (min-width: 56rem) {
  .lq-kurz__pult { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: stretch; gap: 2rem; }
}
.lq-kurz__passer {
  position: absolute; top: .9rem; right: .9rem;
  width: 1.1rem; height: 1.1rem;
  border: 1px solid rgba(255, 169, 77, .7); border-radius: 50%;
  background:
    linear-gradient(rgba(255, 169, 77, .7), rgba(255, 169, 77, .7)) center / 1px 160% no-repeat,
    linear-gradient(rgba(255, 169, 77, .7), rgba(255, 169, 77, .7)) center / 160% 1px no-repeat;
  pointer-events: none;
}
.lq-kurz__form { align-self: center; min-width: 0; margin: 0; }
.lq-kurz__label {
  display: block; margin: 0 0 .55rem; padding: 0;
  font: 600 .78rem/1.3 var(--l-schrift);
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--l-text);
}
.lq-kurz__zeile { display: flex; flex-wrap: wrap; gap: .8rem; align-items: stretch; }
.lq-kurz__nische { position: relative; display: flex; flex: 1 1 13rem; min-width: 0; }
.lq-kurz__nische::before,
.lq-kurz__nische::after {
  content: ""; position: absolute; z-index: 1;
  width: .9rem; height: .9rem;
  border: 0 solid var(--l-akzent);
  pointer-events: none; transition: border-color .2s ease;
}
.lq-kurz__nische::before { top: -.4rem; left: -.4rem; border-width: 2px 0 0 2px; }
.lq-kurz__nische::after  { bottom: -.4rem; right: -.4rem; border-width: 0 2px 2px 0; }
.lq-kurz__nische:focus-within::before,
.lq-kurz__nische:focus-within::after { border-color: var(--l-orange); }
.lq-kurz__eingabe {
  display: block; flex: 1 1 auto; width: 100%; min-height: 3.1rem; height: auto; margin: 0;
  padding: .8em 1em;
  font: 400 1.05rem/1.4 var(--l-schrift); color: #fff;
  background: linear-gradient(180deg, rgb(var(--l-feld-rgb) / .95), rgb(var(--l-feld-rgb) / .8));
  border: 6px solid;
  border-top-color: rgba(15, 20, 24, .95);
  border-left-color: rgba(22, 28, 33, .95);
  border-right-color: rgb(var(--l-wand-rgb) / .55);
  border-bottom-color: rgb(var(--l-wand-rgb) / .7);
  border-radius: 2px;
  box-shadow: inset 0 3px 12px rgba(0, 0, 0, .75), inset 0 0 0 1px rgba(0, 0, 0, .6), 0 1px 0 rgba(255, 255, 255, .05);
  transition: border-color .22s ease, box-shadow .22s ease;
}
.lq-kurz__eingabe::placeholder { color: rgba(234, 244, 255, .5); font-style: italic; opacity: 1; }
.lq-kurz__eingabe:focus,
.lq-kurz__eingabe:focus-visible {
  outline: none; border-color: var(--l-orange);
  box-shadow: inset 0 3px 12px rgba(0, 0, 0, .45), 0 0 0 3px rgb(255 136 0 / .28), 0 0 22px -4px rgb(255 136 0 / .55);
}
.lq-kurz__eingabe:-webkit-autofill,
.lq-kurz__eingabe:-webkit-autofill:focus {
  -webkit-text-fill-color: #fff;
  -webkit-box-shadow: inset 0 0 0 1000px rgb(var(--l-feld-rgb)) !important;
  caret-color: #fff;
}
.lq-kurz__eingabe[readonly] { opacity: .7; cursor: progress; }
.lq-kurz__zeile .gt { flex: 0 0 auto; --gt-luft-y: 1em; --gt-luft-x: 1.9em; --gt-tiefe: 80px; }
@media (max-width: 30rem) {
  .lq-kurz__zeile .gt { flex: 1 1 100%; }
  .lq-kurz__zeile .gt .gt__buehne { width: 100%; }
}
.lq-kurz__hinweis { margin: .9rem 0 0; font-size: .84rem; line-height: 1.5; color: var(--l-leise); }
.lq-kurz__hinweis--leise { margin-top: .35rem; font-size: .78rem; }
.lq-kurz__hinweis strong { color: var(--l-akzent); font-weight: 600; font-variant-numeric: tabular-nums; }


/* ===================================================================
   2. Instrument (Rahmen, Anzeigen) - die Motive stehen unten in 8.
   =================================================================== */
.lq-kurz__instrument {
  position: relative;
  align-self: center;
  aspect-ratio: 5 / 3;
  min-height: 12rem;
  overflow: hidden;
  border: 1px solid var(--l-linie);
  border-radius: 3px;
  background: linear-gradient(180deg, #0F1820 0%, #14222D 70%, #0F1C26 100%);
}
.lq-kurz__svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.lq-kurz__osd {
  position: absolute;
  display: flex; align-items: center; gap: .5em;
  font: var(--l-osd);
  letter-spacing: .16em; text-transform: uppercase;
  color: var(--l-text);
  text-shadow: 0 1px 2px rgba(0, 0, 0, .8);
}
.lq-kurz__osd--ol { top: .9rem; left: 1rem; }
.lq-kurz__osd--or { top: .9rem; right: 1rem; color: var(--l-akzent); }
.lq-kurz__osd--ul { bottom: .8rem; left: 1rem; color: var(--l-leise); letter-spacing: .08em; }
.lq-kurz__osd--ur { bottom: .8rem; right: 1rem; color: var(--l-leise); letter-spacing: .08em; }
.lq-kurz__punkt { width: .5rem; height: .5rem; border-radius: 50%; background: var(--l-gut); box-shadow: 0 0 8px var(--l-gut); }
.lq-kurz__lauf { display: none; }
.lq-kurz.is-busy .lq-kurz__punkt { background: var(--l-orange); box-shadow: 0 0 8px var(--l-orange); }
.lq-kurz.is-busy .lq-kurz__bereit { display: none; }
.lq-kurz.is-busy .lq-kurz__lauf { display: inline; }
@media (max-width: 26rem) {
  .lq-kurz__osd--ur { display: none; }
}


/* ===================================================================
   3. Fehler
   =================================================================== */
.lq-kurz__fehler {
  display: grid; gap: .3rem;
  padding: 1rem 1.2rem;
  border: 1px solid rgba(255, 138, 122, .45);
  border-left: 3px solid var(--l-kritisch);
  border-radius: 3px;
  background: rgba(229, 55, 44, .08);
  line-height: 1.5;
}
.lq-kurz__fehler[hidden],
.lq-kurz__ergebnis[hidden] { display: none; }
.lq-kurz__fehler-titel {
  font: 600 .72rem/1.4 var(--l-schrift);
  letter-spacing: .16em; text-transform: uppercase;
  color: var(--l-kritisch);
}


/* ===================================================================
   4. Bericht (Partials Kurzcheck/* der Extension)
   =================================================================== */
.lq-kurz .qnkc-stufe--kritisch { --_s: var(--l-kritisch); }
.lq-kurz .qnkc-stufe--wichtig  { --_s: var(--l-wichtig); }
.lq-kurz .qnkc-stufe--hinweis  { --_s: var(--l-hinweis); }
.lq-kurz .qnkc-stufe--info     { --_s: var(--l-info); }
.lq-kurz .qnkc-stufe--gut      { --_s: var(--l-gut); }
.lq-kurz .qnkc-ampel--kritisch   { --_a: var(--l-kritisch); }
.lq-kurz .qnkc-ampel--verbessern { --_a: var(--l-wichtig); }
.lq-kurz .qnkc-ampel--gut        { --_a: var(--l-gut); }

.lq-kurz .qnkc-bericht { display: grid; gap: clamp(1.1rem, 2.6vw, 1.6rem); min-width: 0; }
.lq-kurz .qnkc-bericht__kopf {
  padding: clamp(1.1rem, 2.6vw, 1.6rem);
  border: 1px solid var(--l-linie);
  border-top: 3px solid var(--l-orange);
  border-radius: 3px;
  background: var(--l-karte);
  box-shadow: var(--sch-tief, 0 26px 60px -26px rgba(0, 0, 0, .78));
}
.lq-kurz .qnkc-bericht__titel {
  margin: 0;
  font: 400 clamp(1.8rem, 1.4rem + 1.4vw, 2.6rem)/1 var(--l-titel);
  font-synthesis: none; letter-spacing: .02em; text-transform: uppercase;
  color: var(--l-text);
  overflow-wrap: anywhere;
}
.lq-kurz .qnkc-bericht__meta { margin: .5rem 0 0; font-size: .86rem; line-height: 1.55; color: var(--l-leise); overflow-wrap: anywhere; }

.lq-kurz .qnkc-zaehler { display: grid; grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr)); gap: 4px; margin: 1.1rem 0 0; padding: 0; list-style: none; }
.lq-kurz .qnkc-zaehler__eintrag { display: grid; gap: .1rem; margin: 0; padding: .7rem .8rem .65rem; border-top: 3px solid var(--_s); background: rgba(10, 16, 21, .32); }
.lq-kurz .qnkc-zaehler__eintrag::before { content: none; }
.lq-kurz .qnkc-zaehler__zahl { font: 400 2.2rem/1 var(--l-titel); font-variant-numeric: tabular-nums; color: var(--_s); }
.lq-kurz .qnkc-zaehler__label { font: 600 .66rem/1.35 var(--l-schrift); letter-spacing: .08em; text-transform: uppercase; color: var(--l-leise); hyphens: auto; }

.lq-kurz .qnkc-uebersicht { display: grid; grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr)); gap: 4px; margin: 0; padding: 0; list-style: none; }
.lq-kurz .qnkc-uebersicht__eintrag { margin: 0; }
.lq-kurz .qnkc-uebersicht__eintrag::before { content: none; }
.lq-kurz .qnkc-uebersicht__link {
  display: grid; gap: .2rem; height: 100%;
  padding: .75rem .85rem;
  border: 1px solid var(--l-linie);
  border-top: 3px solid var(--_a);
  background: var(--l-karte);
  color: var(--l-text); text-decoration: none;
  transition: border-color .2s ease;
}
.lq-kurz .qnkc-uebersicht__link:hover { border-color: var(--_a); color: var(--l-text); }
.lq-kurz .qnkc-uebersicht__titel { font-weight: 600; font-size: .92rem; }
.lq-kurz .qnkc-uebersicht__ampel { font: 400 1.35rem/1 var(--l-titel); letter-spacing: .04em; text-transform: uppercase; color: var(--_a); }
.lq-kurz .qnkc-uebersicht__zahlen { font-size: .76rem; color: var(--l-leise); font-variant-numeric: tabular-nums; }

.lq-kurz .qnkc-bereiche { display: grid; gap: clamp(.9rem, 2vw, 1.2rem); }
.lq-kurz .qnkc-bereich {
  min-width: 0;
  padding: clamp(1rem, 2.4vw, 1.4rem);
  border: 1px solid var(--l-linie);
  border-top: 3px solid var(--_a);
  border-radius: 3px;
  background: var(--l-karte);
  scroll-margin-top: calc(var(--kopf, 7.5rem) + 1rem);
}
.lq-kurz .qnkc-bereich__kopf { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .2rem 1rem; }
.lq-kurz .qnkc-bereich__titel,
.lq-kurz .qnkc-tabelle-teil__titel {
  margin: 0;
  font: 400 clamp(1.35rem, 1.15rem + .7vw, 1.75rem)/1.05 var(--l-titel);
  font-synthesis: none; letter-spacing: .03em; text-transform: uppercase;
  color: var(--l-text);
}
.lq-kurz .qnkc-bereich__ampel {
  margin: 0; padding: .25rem .55rem;
  border: 1px dashed var(--_a); border-radius: 3px;
  font: 600 .7rem/1.2 var(--l-schrift); letter-spacing: .12em; text-transform: uppercase;
  color: var(--_a);
  transform: rotate(-2deg);
}
.lq-kurz .qnkc-bereich__kurz { flex: 1 1 100%; margin: .15rem 0 0; font-size: .84rem; color: var(--l-leise); }

.lq-kurz .qnkc-befunde { display: grid; gap: 4px; margin: .9rem 0 0; padding: 0; list-style: none; }
.lq-kurz .qnkc-befund { margin: 0; padding: .75rem .9rem .8rem; border-left: 3px solid var(--_s); background: rgba(10, 16, 21, .32); }
.lq-kurz .qnkc-befund::before { content: none; }
.lq-kurz .qnkc-befund__kopf { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .75rem; margin: 0; }
.lq-kurz .qnkc-befund__stufe { font: 600 .66rem/1.3 var(--l-schrift); letter-spacing: .14em; text-transform: uppercase; color: var(--_s); }
.lq-kurz .qnkc-befund__titel { font-weight: 600; font-size: .95rem; line-height: 1.4; color: var(--l-text); }
.lq-kurz .qnkc-befund__detail { margin: .35rem 0 0; font: 400 .78rem/1.5 ui-monospace, "Cascadia Mono", Consolas, monospace; color: var(--l-leise); overflow-wrap: anywhere; }
.lq-kurz .qnkc-befund__text { margin: .4rem 0 0; font-size: .88rem; line-height: 1.55; color: var(--l-text); }
.lq-kurz .qnkc-befund__tipp { margin: .4rem 0 0; font-size: .86rem; line-height: 1.55; color: var(--l-leise); }
.lq-kurz .qnkc-befund__tipp strong { color: var(--l-akzent); font-weight: 600; }

.lq-kurz .qnkc-bestanden { margin-top: .9rem; }
.lq-kurz .qnkc-bestanden > summary {
  display: inline-flex; align-items: center; gap: .5em;
  min-height: 2.25rem;
  font-size: .84rem; font-weight: 600;
  color: var(--l-gut);
  cursor: pointer; list-style: none;
}
.lq-kurz .qnkc-bestanden > summary::-webkit-details-marker { display: none; }
.lq-kurz .qnkc-bestanden > summary::before {
  content: ""; width: .45rem; height: .45rem;
  border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
  transform: rotate(-45deg); transition: transform .2s ease;
}
.lq-kurz .qnkc-bestanden[open] > summary::before { transform: rotate(45deg); }
.lq-kurz .qnkc-bestanden__liste { display: grid; gap: .3rem; margin: .4rem 0 0; padding: 0; list-style: none; }
.lq-kurz .qnkc-bestanden__eintrag { position: relative; margin: 0; padding-left: 1.2rem; font-size: .86rem; line-height: 1.5; }
.lq-kurz .qnkc-bestanden__eintrag::before {
  content: ""; position: absolute; left: .1rem; top: .5em;
  width: .45rem; height: .45rem; border-radius: 50%;
  background: var(--l-gut);
}
.lq-kurz .qnkc-bestanden__detail { display: block; font: .76rem/1.45 ui-monospace, Consolas, monospace; color: var(--l-leise); overflow-wrap: anywhere; }
.lq-kurz .qnkc-bestanden__text { display: block; font-size: .8rem; color: var(--l-leise); }

/* Tabellen; am Telefon als Karten (data-label je Zelle) */
.lq-kurz .qnkc-tabelle-teil { display: grid; gap: .7rem; min-width: 0; }
.lq-kurz .qnkc-tabelle-teil__intro,
.lq-kurz .qnkc-tabelle-teil__hinweis { margin: 0; font-size: .84rem; line-height: 1.5; color: var(--l-leise); }
.lq-kurz .qnkc-tabelle-huelle { border: 1px solid var(--l-linie); border-radius: 3px; background: var(--l-karte); }
.lq-kurz .qnkc-tabelle { width: 100%; border-collapse: collapse; font-size: .86rem; table-layout: auto; }
.lq-kurz .qnkc-tabelle :is(th, td) { padding: .5rem .75rem; border-bottom: 1px solid var(--l-linie); text-align: left; vertical-align: top; overflow-wrap: anywhere; word-break: normal; }
.lq-kurz .qnkc-tabelle thead th { font: 600 .68rem/1.3 var(--l-schrift); letter-spacing: .12em; text-transform: uppercase; color: var(--l-leise); background: rgba(10, 16, 21, .45); }
.lq-kurz .qnkc-tabelle td { color: var(--l-text); }
.lq-kurz .qnkc-tabelle td.is-mono { font: .78rem/1.5 ui-monospace, "Cascadia Mono", Consolas, monospace; color: var(--l-leise); }
.lq-kurz .qnkc-tabelle td.is-stufe { color: var(--_s); font-weight: 600; }
.lq-kurz .qnkc-tabelle tbody tr:last-child td { border-bottom: 0; }
@media (max-width: 40rem) {
  /* Ergebnis-Karten laufen am Telefon randlos - Titel und Texte der Tabellen einruecken */
  .lq-kurz .qnkc-tabelle-teil > :is(.qnkc-tabelle-teil__titel, .qnkc-tabelle-teil__intro, .qnkc-tabelle-teil__hinweis) { padding-inline: 1rem; }
  .lq-kurz .qnkc-tabelle thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .lq-kurz .qnkc-tabelle,
  .lq-kurz .qnkc-tabelle tbody,
  .lq-kurz .qnkc-tabelle tr,
  .lq-kurz .qnkc-tabelle td { display: block; width: 100%; }
  .lq-kurz .qnkc-tabelle tr { padding: .55rem .75rem; border-bottom: 1px solid var(--l-linie); }
  .lq-kurz .qnkc-tabelle tbody tr:last-child { border-bottom: 0; }
  .lq-kurz .qnkc-tabelle td { padding: .12rem 0; border: 0; }
  .lq-kurz .qnkc-tabelle td::before {
    content: attr(data-label); display: block;
    font: 600 .62rem/1.4 var(--l-schrift); letter-spacing: .12em; text-transform: uppercase;
    color: var(--l-leise);
  }
}


/* ===================================================================
   5. Abschluss (Override Kurzcheck/Abschluss.html mit Garagentoren)
   =================================================================== */
.lq-kurz .qnkc-abschluss {
  display: grid; gap: 1.2rem;
  margin-top: clamp(1rem, 2.4vw, 1.6rem);
  padding: clamp(1.1rem, 2.6vw, 1.6rem);
  border: 1px solid var(--l-linie);
  border-left: 3px solid var(--l-orange);
  border-radius: 3px;
  background: rgba(10, 16, 21, .32);
}
.lq-kurz .qnkc-abschluss__einordnung { display: grid; gap: .45rem; margin: 0; padding: 0; list-style: none; }
.lq-kurz .qnkc-abschluss__einordnung li { position: relative; margin: 0; padding-left: 1.3rem; font-size: .9rem; line-height: 1.55; }
.lq-kurz .qnkc-abschluss__einordnung li::before {
  content: ""; position: absolute; left: 0; top: .6em;
  width: .45rem; height: .45rem;
  background: var(--l-orange); transform: rotate(8deg);
}
.lq-kurz .lq-kurz__tore { display: flex; flex-wrap: wrap; align-items: stretch; gap: .7rem .8rem; margin: 0; padding: 0; list-style: none; }
/* Garagentore im Abschluss kompakt - wie beim Leuchtfeuer (25.10.2026). */
.lq-kurz .qnkc-abschluss .gt {
  --gt-schrift: .78rem;
  --gt-luft-y: .55em;
  --gt-luft-x: 1.35em;
  --gt-wand: 6px;
  --gt-tiefe: 46px;
}
.lq-kurz .lq-kurz__tore > li { display: flex; margin: 0; }
.lq-kurz .lq-kurz__tore > li::before { content: none; }
.lq-kurz .lq-kurz__tor { display: flex; }
.lq-kurz .qnkc-bericht-aktionen { padding-bottom: 1.2rem; border-bottom: 1px solid var(--l-linie); }
.lq-kurz :is(.qnkc-bericht-aktionen__hinweis, .qnkc-bericht-aktionen__status) { flex: 1 1 100%; margin: 0; font-size: .84rem; line-height: 1.5; color: var(--l-leise); }
.lq-kurz .qnkc-bericht-aktionen__hinweis strong { color: var(--l-text); font-weight: 600; overflow-wrap: anywhere; }
.lq-kurz .qnkc-bericht-aktionen__status { color: var(--l-text); }
.lq-kurz .qnkc-bericht-aktionen__status:empty { display: none; }
.lq-kurz .qnkc-bericht-aktionen__status.is-error { padding-left: .8rem; border-left: 3px solid var(--l-kritisch); color: var(--l-kritisch); }
.lq-kurz .gt.is-loading { cursor: progress; }
@media (max-width: 30rem) {
  .lq-kurz .lq-kurz__tore > li,
  .lq-kurz .lq-kurz__tor { flex: 1 1 100%; }
  .lq-kurz .lq-kurz__tore .gt { width: 100%; }
}
.lq-kurz .qnkc-weg {
  display: inline-flex; align-items: center;
  min-height: 2.75rem; padding: .55rem 1rem;
  border: 1px solid var(--l-linie-2); border-radius: 2px;
  background: transparent;
  font: 600 .88rem/1.3 var(--l-schrift); color: var(--l-text);
  text-decoration: none; cursor: pointer;
}
.lq-kurz .qnkc-weg:hover { border-color: var(--l-akzent); color: var(--l-akzent); }
.lq-kurz .qnkc-weg--haupt { border-color: var(--l-orange); background: var(--l-orange); color: var(--l-auf); }


/* ===================================================================
   6. Erklaerung
   =================================================================== */
.lq-kurz__info { border: 1px solid var(--l-linie); border-radius: 3px; background: rgba(10, 16, 21, .25); }
.lq-kurz__info > summary { position: relative; padding: .95rem 3rem .95rem 1.2rem; font-weight: 600; cursor: pointer; list-style: none; }
.lq-kurz__info > summary::-webkit-details-marker { display: none; }
.lq-kurz__info > summary::after {
  content: ""; position: absolute; right: 1.2rem; top: 50%;
  width: .55rem; height: .55rem;
  border-right: 2px solid var(--l-akzent); border-bottom: 2px solid var(--l-akzent);
  transform: translateY(-70%) rotate(45deg); transition: transform .2s ease;
}
.lq-kurz__info[open] > summary::after { transform: translateY(-30%) rotate(225deg); }
.lq-kurz__info-text { padding: 0 1.2rem 1.1rem; }
.lq-kurz__info-text p { margin: 0 0 .8rem; max-width: 70ch; line-height: 1.6; color: var(--l-text); }
.lq-kurz__info-text p:last-child { margin-bottom: 0; color: var(--l-leise); }


/* ===================================================================
   7. Rohrpost: Stationen im Ergebnis (Partial Kurzcheck/Extra/domain)
   =================================================================== */
.lq-kurz .lq-rohrpost-stationen {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(6.5rem, 1fr));
  gap: 4px; margin: 0; padding: .9rem; list-style: none;
  border: 1px solid var(--l-linie); border-radius: 3px;
  background:
    linear-gradient(180deg, transparent calc(50% - 3px), rgba(159, 192, 216, .22) calc(50% - 3px), rgba(159, 192, 216, .22) calc(50% + 3px), transparent calc(50% + 3px)),
    rgba(10, 16, 21, .32);
}
.lq-kurz .lq-rohrpost-station { position: relative; display: grid; justify-items: center; gap: .35rem; margin: 0; padding: .6rem .3rem; text-align: center; }
.lq-kurz .lq-rohrpost-station::before { content: none; }
.lq-kurz .lq-rohrpost-station__lampe {
  width: 1.5rem; height: 1.5rem; border-radius: 50%;
  border: 3px solid #2E4A5C;
  background: var(--_l, #2E4A5C);
  box-shadow: 0 0 0 2px #0F1820, 0 0 14px -2px var(--_l, transparent);
}
.lq-kurz .lq-rohrpost-station--gut   { --_l: var(--l-gut); }
.lq-kurz .lq-rohrpost-station--warn  { --_l: var(--l-wichtig); }
.lq-kurz .lq-rohrpost-station--fehlt { --_l: var(--l-kritisch); }
.lq-kurz .lq-rohrpost-station--aus   { --_l: #2E4A5C; }
.lq-kurz .lq-rohrpost-station__name { font: 400 1.15rem/1 var(--l-titel); letter-spacing: .05em; color: var(--l-text); }
.lq-kurz .lq-rohrpost-station__zustand { font: 600 .62rem/1.3 var(--l-schrift); letter-spacing: .12em; text-transform: uppercase; color: var(--l-leise); }


/* ===================================================================
   8. Motive der Instrumente
   =================================================================== */
/* --- Rohrpost (Domain & E-Mail) --- */
.lq-rohrpost__wand { fill: #12202B; }
.lq-rohrpost__rohr { fill: none; stroke: #3B5263; stroke-width: 14; stroke-linecap: round; }
.lq-rohrpost__rohr-glanz { fill: none; stroke: rgba(234, 244, 255, .18); stroke-width: 2; }
.lq-rohrpost__muffe { fill: #2E4A5C; }
.lq-rohrpost__station { fill: #1B2B38; stroke: #3B5263; stroke-width: 2; }
.lq-rohrpost__schlitz { fill: #0B1218; }
.lq-rohrpost__kapsel { fill: var(--l-orange, #FF8800); }
.lq-rohrpost__kapsel-band { fill: #141A1F; }
.lq-rohrpost__lampe { fill: #2E4A5C; stroke: #0F1820; stroke-width: 2; }
.lq-rohrpost__lampe--an { fill: var(--l-gut, #4FBE8B); }
.lq-rohrpost__schild { fill: var(--l-leise, #9FC0D8); font: 600 9px var(--l-schrift); letter-spacing: .1em; text-anchor: middle; }
.lq-rohrpost__brief { fill: #EAF4FF; }
.lq-rohrpost__brief-linie { fill: none; stroke: #9FC0D8; stroke-width: 1.4; }
.lq-rohrpost__boden { stroke: var(--l-akzent, #FFA94D); stroke-width: 1.2; opacity: .6; }
.lq-rohrpost__flug { transform-box: view-box; }

/* --- Sicherungskasten (Sicherheit) --- */
.lq-sicherung__kasten { fill: #1B2B38; stroke: #3B5263; stroke-width: 2; }
.lq-sicherung__schiene { fill: #3B5263; }
.lq-sicherung__automat { fill: #EAF4FF; }
.lq-sicherung__schalter { fill: #2E4A5C; }
.lq-sicherung__hebel { fill: var(--l-orange, #FF8800); transform-box: fill-box; transform-origin: center; }
.lq-sicherung__led { fill: var(--l-gut, #4FBE8B); }
.lq-sicherung__schild { fill: var(--l-leise, #9FC0D8); font: 600 7.5px var(--l-schrift); letter-spacing: .06em; text-anchor: middle; }
.lq-sicherung__haupt { fill: #E8651A; }
.lq-sicherung__warn { fill: #FFD9A8; }
.lq-sicherung__warn-blitz { fill: #141A1F; }
.lq-sicherung__boden { stroke: var(--l-akzent, #FFA94D); stroke-width: 1.2; opacity: .6; }

/* --- Schleuse (Datenschutz-Technik) --- */
.lq-schleuse__himmel { fill: #0F1820; }
.lq-schleuse__mauer { fill: #2E4A5C; }
.lq-schleuse__kammer { fill: #12202B; }
.lq-schleuse__wasser { fill: #1F4D63; }
.lq-schleuse__wasser-oben { fill: #245A73; }
.lq-schleuse__kammerwasser { fill: #1F4D63; transform-box: fill-box; transform-origin: bottom; }
.lq-schleuse__tor { fill: #E8651A; transform-box: fill-box; transform-origin: top; }
.lq-schleuse__tor-strebe { stroke: #141A1F; stroke-width: 1.5; }
.lq-schleuse__boot { fill: #EAF4FF; }
.lq-schleuse__boot-ladung { fill: var(--l-orange, #FF8800); }
.lq-schleuse__fremd { fill: #3B5263; }
.lq-schleuse__fremd-auge { fill: var(--l-kritisch, #FF8A7A); }
.lq-schleuse__ampel { fill: #141A1F; }
.lq-schleuse__ampel-rot { fill: var(--l-kritisch, #FF8A7A); }
.lq-schleuse__ampel-gruen { fill: #2E4A5C; }
.lq-schleuse__welle { fill: none; stroke: rgba(159, 192, 216, .25); stroke-width: 1.2; }
.lq-schleuse__boden { stroke: var(--l-akzent, #FFA94D); stroke-width: 1.2; opacity: .6; }

/* --- Rueckenetikett (E-Label) --- */
.lq-etikett__flasche { fill: #1E3A2E; }
.lq-etikett__glanz { fill: rgba(234, 244, 255, .12); }
.lq-etikett__kapsel { fill: #7A1E2C; }
.lq-etikett__papier { fill: #F4EEDF; }
.lq-etikett__qr { fill: #141A1F; }
.lq-etikett__text { fill: #6B5E45; }
.lq-etikett__strahl { fill: var(--l-orange, #FF8800); opacity: .85; }
.lq-etikett__strahl-glow { fill: url(#lq-et-glow); }
.lq-etikett__karte { fill: #1B2B38; stroke: #3B5263; stroke-width: 1.5; }
.lq-etikett__zeile { fill: #9FC0D8; opacity: .55; }
.lq-etikett__zeile--kopf { fill: #EAF4FF; opacity: .9; }
.lq-etikett__haken { fill: none; stroke: var(--l-gut, #4FBE8B); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; opacity: 0; }
.lq-etikett__boden { stroke: var(--l-akzent, #FFA94D); stroke-width: 1.2; opacity: .6; }
.lq-etikett__scan { transform-box: view-box; }


/* ===================================================================
   9. Bewegung - nur mit Bewegungswunsch
   =================================================================== */
@media (prefers-reduced-motion: no-preference) {
  @keyframes lq-kurz-punkt { 50% { opacity: .25; } }
  @keyframes lq-kurz-ein { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
  .lq-kurz.is-busy .lq-kurz__punkt { animation: lq-kurz-punkt .8s steps(1) infinite; }
  .lq-kurz .qnkc-bericht { animation: lq-kurz-ein .45s ease-out both; }

  /* Rohrpost: Ruhe = Kapsel wippt in der Station; Lauf = Kapsel saust durchs Rohr,
     die Stationslampen leuchten nacheinander auf */
  @keyframes lq-rp-wippen { 50% { transform: translateX(3px); } }
  @keyframes lq-rp-flug { 0% { transform: translateX(0); } 70%, 100% { transform: translateX(262px); } }
  @keyframes lq-rp-lampe { 0%, 100% { fill: #2E4A5C; } 10%, 40% { fill: var(--l-gut, #4FBE8B); } }
  .lq-rohrpost__flug { animation: lq-rp-wippen 3s ease-in-out infinite; }
  .lq-kurz.is-busy .lq-rohrpost__flug { animation: lq-rp-flug 1.6s cubic-bezier(.55, 0, .35, 1) infinite; }
  .lq-kurz.is-busy .lq-rohrpost__lampe { animation: lq-rp-lampe 1.6s linear infinite; }
  .lq-kurz.is-busy .lq-rohrpost__lampe:nth-of-type(2) { animation-delay: .25s; }
  .lq-kurz.is-busy .lq-rohrpost__lampe:nth-of-type(3) { animation-delay: .5s; }

  /* Sicherungskasten: Lauf = Hebel kippen nacheinander, LEDs blinken */
  @keyframes lq-si-hebel { 0%, 60%, 100% { transform: translateY(0); } 20%, 40% { transform: translateY(9px); } }
  @keyframes lq-si-led { 0%, 100% { fill: var(--l-gut, #4FBE8B); } 30%, 50% { fill: var(--l-orange, #FF8800); } }
  .lq-kurz.is-busy .lq-sicherung__hebel { animation: lq-si-hebel 1.8s ease-in-out infinite; }
  .lq-kurz.is-busy .lq-sicherung__led { animation: lq-si-led 1.8s ease-in-out infinite; }
  .lq-kurz.is-busy .lq-sicherung__reihe > g:nth-child(2) :is(.lq-sicherung__hebel, .lq-sicherung__led) { animation-delay: .2s; }
  .lq-kurz.is-busy .lq-sicherung__reihe > g:nth-child(3) :is(.lq-sicherung__hebel, .lq-sicherung__led) { animation-delay: .4s; }
  .lq-kurz.is-busy .lq-sicherung__reihe > g:nth-child(4) :is(.lq-sicherung__hebel, .lq-sicherung__led) { animation-delay: .6s; }
  .lq-kurz.is-busy .lq-sicherung__reihe > g:nth-child(5) :is(.lq-sicherung__hebel, .lq-sicherung__led) { animation-delay: .8s; }
  .lq-kurz.is-busy .lq-sicherung__reihe > g:nth-child(6) :is(.lq-sicherung__hebel, .lq-sicherung__led) { animation-delay: 1s; }

  /* Schleuse: Ruhe = Wellen; Lauf = Kammer fuellt sich, Tor hebt sich, Boot faehrt ein */
  @keyframes lq-sl-welle { to { transform: translateX(-30px); } }
  @keyframes lq-sl-kammer { 0%, 100% { transform: scaleY(.55); } 50%, 80% { transform: scaleY(1); } }
  @keyframes lq-sl-tor { 0%, 45% { transform: scaleY(1); } 60%, 85% { transform: scaleY(.15); } 100% { transform: scaleY(1); } }
  @keyframes lq-sl-boot { 0%, 50% { transform: translateX(0); } 80%, 100% { transform: translateX(96px); } }
  @keyframes lq-sl-ampel { 0%, 55% { fill: var(--l-kritisch, #FF8A7A); } 60%, 85% { fill: #2E4A5C; } }
  @keyframes lq-sl-gruen { 0%, 55% { fill: #2E4A5C; } 60%, 85% { fill: var(--l-gut, #4FBE8B); } }
  .lq-schleuse__welle { animation: lq-sl-welle 5s linear infinite; }
  .lq-kurz.is-busy .lq-schleuse__kammerwasser { animation: lq-sl-kammer 3.2s ease-in-out infinite; }
  .lq-kurz.is-busy .lq-schleuse__tor--rechts { animation: lq-sl-tor 3.2s ease-in-out infinite; }
  .lq-kurz.is-busy .lq-schleuse__fahrt { animation: lq-sl-boot 3.2s ease-in-out infinite; }
  .lq-kurz.is-busy .lq-schleuse__ampel-rot { animation: lq-sl-ampel 3.2s steps(1) infinite; }
  .lq-kurz.is-busy .lq-schleuse__ampel-gruen { animation: lq-sl-gruen 3.2s steps(1) infinite; }

  /* Rueckenetikett: Ruhe = sanfter Glanz; Lauf = Scanstrahl ueber den QR-Code,
     auf der Karte erscheinen die Haken */
  @keyframes lq-et-scan { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(44px); } }
  @keyframes lq-et-haken { 0%, 30% { opacity: 0; } 45%, 90% { opacity: 1; } 100% { opacity: 0; } }
  .lq-etikett__scan { opacity: 0; }
  .lq-kurz.is-busy .lq-etikett__scan { opacity: 1; animation: lq-et-scan 1.4s ease-in-out infinite; }
  .lq-kurz.is-busy .lq-etikett__haken { animation: lq-et-haken 2.8s ease-in-out infinite; }
  .lq-kurz.is-busy .lq-etikett__haken:nth-of-type(2) { animation-delay: .4s; }
  .lq-kurz.is-busy .lq-etikett__haken:nth-of-type(3) { animation-delay: .8s; }
}
@media (prefers-reduced-motion: reduce) {
  .lq-kurz.is-busy .lq-etikett__scan { opacity: 1; }
  .lq-kurz.is-busy .lq-etikett__haken { opacity: 1; }
}