/* ══════════════════════════════════════════════════════════════════════════
   ENTWURF (27.08.2026, 2. Fassung) – die Statusseite in der Bauform von
   „Mein Konto“. Gehoert zu `index-entwurf.html`, wird NUR von dort geladen.

   ⚠️ VERSUCH, KEIN PRODUKT. Nicht in `build/build-frontend.sh` eingetragen,
   wandert in kein Buendel. Rueckweg: `bash build/entwurf-menue.sh --weg`.

   ══ REINES CSS, KEIN SKRIPT ══
   `status.js` rendert exakt wie bisher – nur die Gestalt der fertigen Zeilen
   ist eine andere. Ohne Skript gibt es keine Reihenfolge, die schiefgehen
   kann, und keinen zweiten Schreiber auf der Adresse (die zwei Fehlerquellen
   aus dem Konto-Entwurf desselben Tages).

   ══ DREI ANSAGEN DES BETREIBERS (27.08.2026, am Bild) ══
   1. „genauso klar und vom Layout her wie Mein Konto“
   2. „das Geöffnet könnte rechts neben Platz stehen und einen RECHTECKIGEN
      Bereich haben“
   3. „der Pfeil rechts bitte auch im Design von Mein Konto“
   Die erste Fassung hatte den Wert frei schweben lassen und den runden
   Aufklapp-Knopf behalten – beides ist damit vom Tisch.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Die Liste: BIS AN DEN RAND ───────────────────────────────────────────
   Vierte Ansage des Betreibers: „wir wollen auch den Rand links und rechts
   loswerden“. `.wrap` polstert die ganze Seite mit `--jg-gutter` (18 px); die
   Liste hebt das mit einem negativen Rand wieder auf.

   DER INNENABSTAND DER ZEILEN BLEIBT – nur der Kasten waechst nach aussen.
   Sonst klebten Name und Wert am Bildschirmrand, und das ist auf dem Handy
   unangenehm zu lesen. Damit laufen die Trennlinien durch, ohne dass der
   Inhalt es tut: genau die Bauform aus dem Vorbild.

   `--jg-gutter` und nicht 18 px: Aendert die Seite ihre Polsterung, geht die
   Liste von selbst mit. Eine hier eingetragene Zahl waere beim ersten
   Layoutwechsel falsch, ohne dass es jemandem auffiele. */
.status-liste {
  /* ⚠️ 0 UND NICHT 20 – HIER SASS DER BEMAENGELTE „ZU HOHE“ BLOCK.
     Zweimal hatte ich `.sub` selbst kleiner gemacht und es blieb, wie es war:
     Die Zeile ist 24 px hoch und ihr Text mittig – aber DANACH klafften 32 px
     bis zur Liste. Optisch ist beides ein Streifen, in dem der Text oben
     klebt. Ich hatte die Zeile gemessen und nicht den Raum darunter.

     Merke: Wenn „zu hoch“ bemaengelt wird, ist der Abstand DANEBEN genauso
     verdaechtig wie das Element selbst. */
  margin-top: 0;
  margin-left: calc(var(--jg-gutter, 18px) * -1);
  margin-right: calc(var(--jg-gutter, 18px) * -1);
  background: var(--jg-card, #fff);
  border-top: 1px solid var(--linie, #e4eae7);
  border-bottom: 1px solid var(--linie, #e4eae7);
}

/* Die Indoor-Anlage steht als eigener Block direkt darunter und sieht aus wie
   ein Zustand – sie muss dieselbe Kante UND dieselbe Flaeche halten.

   ⚠️ DIE FLAECHE HAT GEFEHLT (Befund des Betreibers, 27.08.2026: „hat immer
   noch einen anderen Hintergrund"). Gemessen: `.status-liste` ist weiss,
   `.indoor-bereich` war transparent – dort schien der graue Seitengrund durch.
   Der Unterschied faellt nur auf, WEIL beide Zeilen sonst gleich aussehen;
   solange die Indoor-Zeile eine eigene Bauform hatte, war er unsichtbar. */
.indoor-bereich {
  /* ⚠️ `border-top` ERGAENZT (27.08.2026): „die Trennlinie ueber ‚Indoor‘
     fehlt nun.“ Sie fiel weg, als die Liste ihre Unterkante verlor
     (`.status-liste { border-bottom: 0 }`) – und die letzte Zustandszeile hat
     per `:last-child` auch keine. Zwischen Restaurant und Indoor stand damit
     gar nichts. Die Linie gehoert an den Indoor-Block: So ist sie unabhaengig
     davon, ob die Liste darueber eine Unterkante fuehrt. */
  border-top: 1px solid var(--linie, #e4eae7);

  /* ⚠️ `margin-top: 0` IST DIE ANSAGE, NICHT KOSMETIK: „Wir setzen die
     Indoor-Anlage nicht mehr von den Zustaenden ab. Es wird nachher zu einem
     echten Zustand.“ Der Block trug 22 px Abstand nach oben und stand damit
     als eigene Gruppe da – genau die Trennung, die es kuenftig nicht mehr
     geben soll. Jetzt schliesst er nahtlos an die Liste an und ist von einer
     Zustandszeile nicht mehr zu unterscheiden. */
  margin: 0 calc(var(--jg-gutter, 18px) * -1);
  background: var(--jg-card, #fff);
  border-bottom: 1px solid var(--linie, #e4eae7);
}
/* Die Liste verliert ihre Unterkante – die Indoor-Zeile fuehrt sie fort. */
.status-liste { border-bottom: 0; }

/* ── Die Zeile als RASTER ─────────────────────────────────────────────────
   Drei feste Spalten: Name | Wert | Pfeil. Das ist der Kern von Ansage 1 –
   in „Mein Konto“ sitzen Titel, Wert und Chevron auf einer Achse, und genau
   diese Achse hat der Liste hier gefehlt: Der Wert stand mal weiter links,
   mal weiter rechts, je nachdem wie lang er war.

   Die Pfeilspalte ist IMMER da, auch ohne Aufklapper (nicht jede Zeile hat
   Details). Sonst ruecken Werte in Zeilen ohne Pfeil nach rechts aus der
   Flucht – der Fehler waere unauffaellig und genau deshalb aergerlich. */
.jg-item {
  display: grid;
  /* `minmax(0, 1fr)` statt `1fr`: VORSORGE, nicht die Ursache des Ueberlaufs
     vom 27.08.2026 – der sass in geerbten negativen Raendern (siehe unten bei
     `.jg-details`). Ich hatte es zuerst dafuer gehalten und es half nicht.

     Trotzdem richtig so: `1fr` ist die Kurzform von `minmax(auto, 1fr)`, und
     dieses `auto`-Minimum ist die Inhaltsbreite – eine Spalte kann damit nie
     unter ihren breitesten Inhalt schrumpfen. Derselbe Griff steht seit 1.17.2
     in `runde.css`, dort mit derselben Begruendung. */
  /* ⚠️ DREI SPALTEN, KEINE VIER. Am 27.08.2026 stand hier kurz eine
     Symbolspalte (Flagge, Cart, Besteck …). Befund des Betreibers im Bild:
     „das stoert tatsaechlich die Ruhe“ – zurueckgenommen. Die Nebenwirkung
     war messbar: Die 26 px fehlten dem Text, und die Zeitangaben bei Range
     und Restaurant brachen zweizeilig um. */
  grid-template-columns: minmax(0, 1fr) auto 22px;
  align-items: center;
  column-gap: 14px;
  row-gap: 2px;

  border: 0;
  border-bottom: 1px solid var(--linie, #e4eae7);
  border-radius: 0;
  background: none;
  box-shadow: none;
  padding: 14px 18px;
  min-height: 66px;                 /* bequem am Finger, wie die Menue-Zeile */

  /* ⚠️ ERBSTUECK DER KACHEL: `margin-bottom: 10px` trennte frueher zwei
     Kaesten voneinander. In einer Liste mit Trennlinien ist es eine Luecke –
     sichtbar wurde sie erst zwischen letzter Zustandszeile und Indoor-Block
     (gemessen: 10 px, wo 0 sein sollten). Schon der zweite Fund dieser Art
     heute; die negativen Raender des Aufklappers waren der erste. */
  margin: 0;
}
.jg-item:last-child { border-bottom: 0; }

/* `display: contents` loest den rechten Behaelter auf, damit seine Kinder
   direkte Rasterfelder werden. Nur so laesst sich der Wert in Spalte 2
   stellen und der Zusatztext darunter in Spalte 1 – ohne `status.js`
   anzufassen. (Wird von allen aktuellen Browsern getragen; Safari hatte bis
   15.4 einen Zugaenglichkeitsfehler damit. Fuer einen Entwurf tragbar, vor
   einer Auslieferung noch einmal zu pruefen.) */
.jg-rechts { display: contents; }

.jg-name {
  grid-column: 1;
  grid-row: 1;
  flex: none;
  font-size: 16px;
  font-weight: 500;
  padding-top: 0;
}

/* ── Der Statuswert: rechteckige Flaeche, feste Breite ────────────────────
   Ansage 2. Rechteckig heisst hier 3 px Radius, nicht 0: Eine harte Ecke ist
   im ganzen Projekt sonst nirgends, und der Unterschied zur alten Pille
   (8 px) ist so schon deutlich.

   FESTE BREITE, damit die Spalte ruhig steht – „Geöffnet“ und „Nicht erlaubt“
   sind verschieden lang, und ohne feste Breite wackelt die Kante von Zeile zu
   Zeile. Der Text steht mittig: bei gleicher Breite wirkt linksbuendig wie
   ein Fehler, wenn das kurze Wort viel Luft rechts hat.

   KEIN PUNKT MEHR – die Begruendung aus `index.html` gilt wieder, sobald die
   Flaeche da ist: „auf farbigem Grund sagt er nichts mehr aus.“ */
.jg-item[data-status] .jg-anzeige {
  grid-column: 2;
  grid-row: 1;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 132px;
  max-width: 100%;
  box-sizing: border-box;
  padding: 7px 10px;
  border-radius: 3px;
  font-size: 14px;
  font-weight: 600;
  color: #fff;
  background: var(--jg-green, #0f6e56);
}
.jg-item[data-status="false"] .jg-anzeige { background: var(--jg-red, #c0392b); }

/* Zeilen ohne Statuswert (Indoor-Anlage: dort steht rechts der Anlagenname)
   behalten die Spalte, damit die Flucht stimmt. */
.jg-item .jg-anzeige { grid-column: 2; grid-row: 1; }

/* ── Die Zusatzzeilen wandern UNTER DEN NAMEN ─────────────────────────────
   Genau die Bauform von „Mein Konto“: Titel oben, kleine Zeile darunter. Vor
   der Aenderung standen sie unter dem WERT und schoben die Zeile auseinander –
   im Bild des Betreibers der Grund, warum „Range“ und „Restaurant“ doppelt so
   hoch waren wie „Carts“. */
.jg-seit,
.jg-wechsel,
.jg-anlass,
.jg-turnierhinweis {
  grid-column: 1;
  font-size: 12.5px;
  line-height: 1.45;
  text-align: left;
}

/* ── DIE PFEILE: SCHWARZ, OHNE KREIS, GROESSER ────────────────────────────
   Ansage des Betreibers (27.08.2026): „der Pfeil rechts muss schwarz sein,
   ohne Kreis darum und etwas groesser – in etwa so wie im allerersten
   Screenshot“ (die fremde App mit den kraeftigen schwarzen Chevrons).

   ⚠️ `.aufklapp-pfeil` IST DIE GEMEINSAME KLASSE aller runden gruenen Pfeile
   dieses Projekts – Club-Auswahl (`cselect.js`) und Handicap-Block holen sie
   aus derselben Regel in `kopfmenue.css`. Sie hier mitzunehmen ist deshalb
   kein Beiwerk, sondern die Umsetzung von „es soll alles im neuen Design
   sein“: Ohne sie blieben genau die zwei Stellen gruen und rund, die im Bild
   direkt ueber der Liste stehen.

   24 px im 24er-Zeichenraum ergeben 2 px Strich – die volle Staerke, die das
   SVG vorsieht. Zum Vergleich: vorher 10 px, also 0,83 px.

   DIE PULS-ANIMATION FAELLT WEG. `kopfmenue.css` laesst beide Pfeile alle
   2,6 s aufleuchten – ein Blickfang, der zum Kasten gehoerte. In einer ruhigen
   Liste ist ein pulsierendes Element das Gegenteil dessen, was sie leisten
   soll. */
/* ⚠️ ZWEI KLASSEN FUER DENSELBEN PFEIL: `cselect.js` vergibt
   `class="aufklapp-pfeil cselect-pfeil"`. Regeln, die nur auf die erste
   zielen, verlieren gegen `.cselect.offen .cselect-pfeil` (drei Bestandteile)
   in `kopfmenue.css:771` – deshalb blieb der Pfeil der Club-Auswahl im
   GEOEFFNETEN Zustand ein gruener Kasten (Befund des Betreibers, 27.08.2026).

   Das ist derselbe Fehler wie beim Handicap-Hover eine Stunde zuvor, nur an
   einem anderen Zustand. Diesmal sind ALLE Zustaende gegreppt: `:hover`,
   `.offen`, `[open]` – ueber `index.html`, `kopfmenue.css` und `cselect.js`. */
.jg-toggle,
.aufklapp-pfeil,
.cselect-pfeil {
  width: 28px;
  height: 28px;
  min-width: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: var(--jg-ink, #15211c);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  animation: none;
  box-shadow: none;
}
.jg-toggle { grid-column: 3; grid-row: 1; }

.jg-toggle svg,
.aufklapp-pfeil svg,
.cselect-pfeil svg { width: 24px; height: 24px; }

/* `.cselect-pfeil` traegt `flex: 0 0 34px` – ohne diese Zeile bleibt die alte
   Breite stehen, auch wenn `width` gesetzt ist. */
.cselect-pfeil { flex: 0 0 28px; }

/* ⚠️ ALLE HOVER-REGELN, DIE ES GIBT – GEGREPPT, NICHT GERATEN.
   Befund des Betreibers (27.08.2026): „warum ist der Pfeil da grün beim
   Mouse-over?“ Beim Handicap-Block blieb die gefuellte gruene Form stehen.

   Die Ursache war ein VERGESSENER Selektor: `index.html:562` setzt
   `.hcp-kopf:hover > .aufklapp-pfeil` – zwei Klassen plus Pseudoklasse, also
   spezifischer als mein `.aufklapp-pfeil:hover` mit zweien. Er gewinnt
   unabhaengig davon, wie spaet mein Stylesheet geladen wird.

   Die vier Fundstellen stammen aus einem `grep` ueber `index.html` und
   `kopfmenue.css`; die Regel „nach jedem Umbau nach weiteren Fundstellen
   greppen – die zweite ist die Regel“ gilt fuer Hover-Zustaende ganz
   besonders: Sie sind im ruhenden Bild UNSICHTBAR und fallen erst auf, wenn
   jemand mit der Maus darueberfaehrt. */
.jg-toggle:hover,
.aufklapp-pfeil:hover,
.aufklapp-kopf:hover .aufklapp-pfeil,
.cselect-btn:hover .aufklapp-pfeil,
.cselect-btn:hover .cselect-pfeil,
.hcp-kopf:hover > .aufklapp-pfeil,
.karte.aufklapp.offen .aufklapp-pfeil,
.cselect.offen .cselect-pfeil,
.cselect.offen .aufklapp-pfeil {
  background: none;
  border: 0;
  color: var(--jg-green, #0f6e56);
}

.jg-item.offen .jg-toggle,
.hcp-klapp[open] > .hcp-kopf > .aufklapp-pfeil {
  transform: rotate(180deg);
  background: none;
  border: 0;
  color: var(--jg-ink, #15211c);
}

/* ── Der Aufklappbereich nimmt die volle Zeilenbreite ─────────────────────
   `min-width: 0` gehoert zu `grid-column: 1 / -1`, damit ein Rasterfeld unter
   seine Inhaltsbreite schrumpfen darf. Auch das ist Vorsorge – die Ursache des
   Ueberlaufs stand woanders, siehe die Raender unten. */
.jg-item.offen .jg-details {
  grid-column: 1 / -1;
  min-width: 0;
  padding-top: 12px;

  /* ⚠️ HIER SASS DER FEHLER, UND ZWAR ALS ERBSTUECK DER ALTEN BAUFORM.
     Der inline-Stil gibt `.jg-details` die Raender `8px -48px 0 -112px`. Das
     war in der KACHEL richtig: Dort stand der Name in einer festen 130-px-
     Spalte, und der Aufklapper sollte darunter durchlaufen – die -112 px
     glichen genau diese Einrueckung aus.

     In der Rasterzeile hier gibt es diese Einrueckung nicht mehr. Die
     negativen Raender zogen den Bereich stattdessen 94 px aus dem Bildschirm
     (gemessen: -94..530 bei 500 px Fenster, und zwar bei allen fuenf
     Aufklappern). Im Bild sah es aus wie ein Knopf ohne Rand und wie links
     abgeschnittener Text – zwei Symptome, eine Ursache.

     MERKE: Wer ein Layout umbaut, sucht die negativen Raender des alten. Sie
     sind unsichtbar, solange die alte Geometrie stimmt, und ergeben in der
     neuen sofort Unsinn. */
  margin-left: 0;
  margin-right: 0;
}

/* Die Knoepfe im Aufklapper gehoeren zu „alles eckig“ – Klassen aus dem DOM
   gelesen (`jg-k-btn`, Zusatz `jg-k-extra`), nicht geraten. */
.jg-details .jg-k-btn,
.jg-k-btn { border-radius: 3px; }

/* Der Entwurfs-Hinweis – dieselbe Bauform wie im Konto-Entwurf, damit man die
   beiden Versuchsseiten auf einen Blick als solche erkennt. */
.mn-fahne {
  display: block;
  background: #fdf1e7;
  border: 1px solid #eccfb4;
  border-radius: var(--jg-r, 10px);
  padding: 9px 13px;
  margin: 0 0 16px;
  font-size: 12.5px;
  line-height: 1.5;
  color: #a34d0b;
}
.mn-fahne b { font-weight: 600; }
.mn-fahne a { color: inherit; }

/* ausgeliefert 16:55:22 */


/* ══════════════════════════════════════════════════════════════════════════
   „ES SOLL ALLES IM NEUEN DESIGN SEIN“ (Ansage vom 27.08.2026)
   Bis hierher war nur die Zustandsliste umgestellt. Im Bild fielen dadurch
   die Bloecke DARUEBER und DARUNTER auf – Club-Auswahl, Handicap, Club-Infos
   und Webcams standen weiter als gerundete Kaesten mit Rahmen mitten in einer
   Seite, die sonst mit Linien arbeitet.
   ══════════════════════════════════════════════════════════════════════════ */

/* Die Club-Auswahl: flache Zeile statt Kasten, buendig mit der Liste. */
/* ⚠️ DIE LAYOUT-REGELN FUERS AUSWAHLFELD TRAGEN `.wrap` – und das ist der
   Unterschied zwischen „im Inhalt" und „in der System-Admin-Leiste".
   Die `.sysbar` haengt direkt am `<body>`, nicht im `.wrap`. Ohne das Praefix
   traf `min-height: 62px` auch ihr kleines „Ansicht"-Feld: Die flache Leiste
   wurde 81 px hoch und das Feld schob sich UEBER die Beschriftung „Ansicht:".
   ⚠️ DIESE DATEI WURDE BEIM ERSTEN ANLAUF VERGESSEN – korrigiert war nur
   `entwurf-basis.css`, und die Regeln stehen ZWEIMAL. Der Fehler blieb im Bild
   unveraendert, obwohl „behoben". Erst die Frage, WELCHE Regel den Wert setzt
   (ueber `document.styleSheets`), zeigte die zweite Fundstelle.
   ══════════════════════════════════════════════════════════ */
.wrap .cselect-btn {
  border-radius: 0;
  border-left: 0;
  border-right: 0;
  border-top: 1px solid var(--linie, #e4eae7);
  border-bottom: 1px solid var(--linie, #e4eae7);
  padding: 15px 18px;
  min-height: 62px;
}
.wrap .cselect {
  margin-left: calc(var(--jg-gutter, 18px) * -1);
  margin-right: calc(var(--jg-gutter, 18px) * -1);
}
/* Die aufgeklappte Liste haelt dieselbe Kante. */
.wrap .cselect-liste {
  border-radius: 0;
  border-left: 0;
  border-right: 0;
}

/* Der Handicap-Block: derselbe Griff. */
.hcp {
  margin-left: calc(var(--jg-gutter, 18px) * -1);
  margin-right: calc(var(--jg-gutter, 18px) * -1);
  border-radius: 0;
  border-left: 0;
  border-right: 0;
}
/* ⚠️ DIESELBE ZEILE WIE DIE ANDEREN (Befund des Betreibers: „‚Mein Course
   Handicap‘ ist anders als alles andere“). Er stand hoeher, sein Text weiter
   innen und seine Flaeche abgesetzt – drei Abweichungen auf einmal, und jede
   fuer sich klein genug, um sie einzeln zu uebersehen.

   Die Werte sind WOERTLICH die der Zustandszeile (`.jg-item` oben): 14/18 px
   Polsterung, 66 px Mindesthoehe, 16 px Schrift in 500. Eine Zeile, die
   „ungefaehr wie“ die anderen aussieht, faellt genau dadurch auf. */
.hcp-kopf {
  padding: 14px 18px;
  min-height: 66px;
  background: var(--jg-card, #fff);
}
.hcp-titel { font-size: 16px; font-weight: 500; }
/* ⚠️ ZWEI POLSTERUNGEN LAGEN UEBEREINANDER: `.hcp-klapp` 16 px, darin
   `.hcp-kopf` nochmal 18 px – macht 34 plus Rahmen, und der Titel stand bei
   35 statt 18. Im Bild sah das aus wie „der Block ist anders“, gemessen war
   es eine schlichte Addition. Die aeussere faellt weg, die innere traegt. */
.hcp-klapp { padding: 0; }
.hcp-inhalt { padding: 0 18px 14px; }

/* ⚠️ NICHT ALLES GEHOERT AN DEN RAND – und das ist die Korrektur eines
   eigenen Fehlgriffs (im Bild gesehen, 27.08.2026): Erst bekamen auch die
   Club-Aktionen negative Raender. Ergebnis: vier KNOEPFE, deren Rahmen am
   Bildschirmrand klebten. Technisch tadellos (kein Ueberlauf, Scrollbreite
   blieb 500), optisch sahen sie abgeschnitten aus.

   Die Regel, die daraus folgt: **Bis an den Rand gehoert, was mit einer
   TRENNLINIE arbeitet** – Listen, Zeilen, Reihen. **Was einen eigenen Rahmen
   traegt, braucht Luft**: Knoepfe, Karten, Eingabefelder. Der Rahmen ist die
   Form; klebt er an der Kante, fehlt ihm eine Seite.

   Die Aktionen behalten deshalb ihren Abstand. Nur die Rundung faellt, damit
   sie zur eckigeren Formsprache passen. */
.club-info,
.club-aktionen,
.indoor-bereich > * {
  border-radius: 0;
}

/* ⚠️ ZURUECKGENOMMEN (Befund des Betreibers im Bild, 27.08.2026): „das mit
   ‚kein Rand mehr‘ war so nicht gemeint. Natürlich brauchen wir einen Abstand
   zum Rand, siehe ‚Aktuelle Webcam-Bilder‘.“

   Hier klebten Ueberschrift UND Bilder an der Kante – die Bilder liefen sogar
   sichtbar darueber hinaus. Ich hatte „bis an den Rand“ auf ALLES angewandt.

   DIE PRAEZISIERTE REGEL, und sie gilt fuer die ganze Seite:
   **Bis an den Rand geht die TRENNLINIE, nie der INHALT.** Eine Liste gewinnt
   an durchlaufenden Linien; ein Bild, eine Ueberschrift oder ein Knopf am
   Bildschirmrand sieht angeschnitten aus. Wo es keine Trennlinien gibt, gibt
   es auch keinen Grund fuer den negativen Rand. */
.webcams { border-radius: 0; }

/* Der Handicap-Block ist eine aufklappbare ZEILE, keine Karte: weisse Flaeche
   und Trennlinien wie in der Liste darueber. Die gruene Toenung liess ihn im
   Bild als einzigen Kasten stehenbleiben. */
.hcp,
.hcp-klapp,
.hcp-kopf {
  background: var(--jg-card, #fff);
}
/* Der innere Behaelter traegt die Rundung, nicht `.hcp` – gemessen im Browser,
   nicht geraten: 12 px auf `.hcp-klapp`. Ohne diese Zeile bleibt der Block als
   einziger gerundeter Kasten in einer Seite aus Linien stehen. */
/* ⚠️ VIERTER FUND DESSELBEN KACHEL-ERBSTUECKS (27.08.2026). Das innere
   `.hcp-klapp` traegt `margin-bottom: 10px` UND einen eigenen Rahmen. Die
   aeussere `.hcp` hat aber auch einen – Ergebnis: zwei Linien mit 10 px
   Zwischenraum, sichtbar als Abstand zwischen „Mein Course Handicap“ und
   „Webcams“.

   ⚠️ UND MEIN MESSFEHLER DAZU: Ich hatte `hcp.bottom` gegen `cam.top`
   gemessen – das ergab 0 und ich meldete „kein Abstand“, waehrend im Bild
   einer stand. Die ELEMENTE waren buendig, der Leerraum lag INNERHALB des
   einen. Merke: Bei einem sichtbaren Abstand die sichtbaren FLAECHEN messen
   (Rahmen, Hintergrund, letztes Kind), nicht die Elementkanten. */
.hcp-klapp {
  border-radius: 0;
  margin-bottom: 0;
}
/* Nur das INNERE verliert den Rahmen – beim Webcam-Klapper ist `.hcp-klapp`
   selbst das aeussere Element und braucht ihn. */
.hcp > .hcp-klapp { border: 0; }
.hcp {
  border-top: 1px solid var(--linie, #e4eae7);
  border-bottom: 1px solid var(--linie, #e4eae7);
}

/* Die Entwurfsfahne behaelt ihre Form: Sie ist ausdruecklich ein Fremdkoerper
   und soll als solcher auffallen. */


/* ── DIE KNOEPFE WERDEN ECKIG ─────────────────────────────────────────────
   Ansage des Betreibers: „da wir nun eh alles eckig haben, bauen wir auch die
   Buttons bitte so“.

   3 px – dieselbe Zahl wie die Statusflaeche in der Liste. Nicht 0: Eine harte
   Ecke kommt im Projekt sonst nirgends vor, und der Unterschied zu den alten
   8 px ist so schon deutlich. Eine einzige Zahl fuer alles Eckige heisst, dass
   spaeter EINE Stelle zu aendern ist, wenn sie doch nicht passt. */
/* ⚠️ DIE KLASSEN SIND GEMESSEN, NICHT GERATEN – der erste Versuch hatte
   `.club-aktionen a` und `.knopf` und traf damit nichts: Die Knoepfe heissen
   `.ci-mehr` und `.ci-call` (die Mail-Variante zusaetzlich `.ci-mail`). Genau
   der Punkt aus der Kurzliste – Namen kommen aus der Quelle.

   Und sie brauchen die Elternklasse: Die bestehende Regel steht als
   `.club-info .ci-call` (zwei Klassen) im inline-Stil; ein blosses `.ci-call`
   ist weniger spezifisch und verliert, egal wie spaet es geladen wird. */
.club-info .ci-mehr,
.club-info .ci-call,
.club-aktionen .ci-mehr,
.club-aktionen .ci-call,
.club-info .reload-btn,
.wrap .reload-btn,
.wrap .nah-btn {
  border-radius: 3px;
}


/* ══════════════════════════════════════════════════════════════════════════
   DIE INDOOR-ANLAGE HAT KEINEN STATUS – UND ZEIGT DESHALB KEINEN

   Ansage des Betreibers vom 27.08.2026 war: „a) genauso darstellen wie alle
   anderen Zustaende b) ist im Augenblick einfach immer ‚geöffnet‘.“ Genau so
   stand hier ein `content: "Geöffnet"`.

   ⚠️ DAS IST BEIM AUSROLLEN NACH DEV GESTRICHEN WORDEN (Ansage: „den
   Indoor-Platzhalter raus“). Der Grund ist die Projektregel zum Rueckfalltext:
   Ein getippter Status misst nichts, fragt nichts ab und wird nie
   „geschlossen“ – er macht jeden Ausfall unsichtbar und den Einbau
   unpruefbar. Auf einer Seite, deren einziger Zweck es ist, den WIRKLICHEN
   Zustand zu zeigen, ist ein erfundener der teuerste Fehler.
   (Zweiter Grund: `content` steht nicht im DOM – Vorlesesoftware behandelt es
   uneinheitlich.)

   FOLGE IM BILD: Die Indoor-Zeile traegt rechts keine Statusflaeche. Sie
   zeigt „Indoor-Anlage“, darunter die Kennzahlen, den Anlagennamen im
   Aufklapper – und keinen Wert, weil es keinen gibt.

   WAS ES BRAUCHT, DAMIT SIE EINEN BEKOMMT: ein echtes Zustandsfeld an der
   Indoor-Anlage in CAPCOM. Eigener Arbeitsgang, hier nicht zu loesen.

   Die Regel, die den Anlagennamen als Unterzeile zeigte, ist mitgegangen: Sie
   war schon vorher wirkungslos – weiter unten blendet
   `.jg-indoor .jg-anzeige { display: none }` dasselbe Element aus, und das
   Entwurfs-Skript haengt den Namen in den Aufklapper.
   ══════════════════════════════════════════════════════════════════════════ */


/* ══════════════════════════════════════════════════════════════════════════
   DER KOPF WIRD LEISER (Ansagen des Betreibers, 27.08.2026)
   „‚Aktueller Platzstatus‘ und ‚Aktualisieren‘ kommt weg. Dafuer kommt ein
   kleiner Link ‚Aktualisieren‘ gleich neben ‚Club auswaehlen‘. Das ‚zuletzt
   aktualisiert‘ nehmen wir zwischen die Clubauswahl und die Zustaende, etwas
   kleinere Schrift.“
   ══════════════════════════════════════════════════════════════════════════ */

/* Die Ueberschrift faellt weg – der Seitenkopf nennt den Club bereits, und
   „Aktueller Platzstatus“ ueber einer Liste von Zustaenden sagt nichts, was
   die Liste nicht selbst zeigt. */
#seiten-titel { display: none; }

/* Der Kopf wird zum Stapel, damit sich die Reihenfolge per `order` aendern
   laesst – OHNE das Markup anzufassen. Der Frische-Stempel (`.sub`) rutscht
   damit UNTER die Clubauswahl, direkt vor die Zustaende. */
.kopf {
  display: flex;
  flex-direction: column;

  /* ⚠️ HIER SASS DER „ZU HOHE“ BLOCK – IM DRITTEN ANLAUF GEFUNDEN.
     Der Betreiber hat ihn zweimal bemaengelt, und ich habe zweimal am
     falschen Element gedreht: erst `.sub` selbst (die war nie das Problem –
     24 px hoch, Text mittig), dann `margin-top` der Liste (0, half nicht).
     Die 32 px kamen vom `<header>`: `margin-bottom: 32px`.

     WAS ICH DARAUS MITNEHME: Bei „zu viel Abstand“ misst man die KETTE, nicht
     ein Element – Zeile, Nachbar, Elternteil, Nachfolger in einem Zug. Ich
     habe dreimal einen Kandidaten geraten statt einmal alle vier abzufragen;
     der dritte Versuch mit vollstaendiger Messung brauchte dreissig Sekunden. */
  margin-bottom: 0;
}
.titelzeile { order: 1; }
.auswahl    { order: 2; }
.sub        { order: 3; }

/* ⚠️ DER FRISCHE-STEMPEL WIRD KLEINER, NICHT UNWICHTIGER. Er ist der
   eigentliche Wert des Produkts – eine Statusangabe ohne „wann zuletzt“ ist
   eine Behauptung. Deshalb 13 px und gedaempft, aber weiter in voller Zeile
   und ueber allem, was er datiert. */
.sub {
  /* Ansage: „Text vertikal mittig und das Feld so klein, dass es noch gut
     aussieht (ein paar Pixel)“. Flex statt Zeilenhoehe: `line-height` zum
     Zentrieren zu missbrauchen bricht, sobald der Text zweizeilig wird – und
     genau das tut er, wenn ein Stempel lang ausfaellt. */
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 0;
  padding: 7px 0;
  margin: 0;
  font-size: 12.5px;
  line-height: 1.25;
  color: var(--jg-muted, #5c6b64);
}
.sub:empty { display: none; }
.jg-stand { min-width: 0; }

/* ⚠️ `display: none` UND NICHT `:empty` – DIE FALLE IST DAS WORT „LEER“.
   `:empty` verlangt, dass gar KEIN Kindknoten da ist. Die Titelzeile enthaelt
   aber einen HTML-Kommentar und Zeilenumbrueche, und beides zaehlt. Sie war
   also nie „leer“ im Sinne des Selektors und stand weiter im Fluss: 24 px,
   die niemand sah und die sich zum Polster des `.wrap` addierten.

   Inhaltlich ist sie leer – die Ueberschrift ist ausgeblendet, der
   Aktualisieren-Knopf in die Stempelzeile umgezogen. */
.titelzeile { display: none; }

/* Der Abstand zwischen Kopfleiste und Club-Auswahl. 18 px statt 40 – Vorgabe
   war das Bild des Betreibers vom 27.08.2026 („so sollte der Abstand oben in
   etwa aussehen“), nachgemessen: dort rund 20 px. Vorher waren es 64. */
/* ⚠️ KORRIGIERT (27.08.2026): „der Platz oberhalb der Clubauswahl soll
   aussehen wie eine Trennlinie – egal wie du das machst.“

   Der erste Versuch (1 px Seitengrund) war KEINE Linie, sondern drei
   Schichten uebereinander: die `border-bottom` der Kopfleiste bei 57, ein
   grauer Pixel, dann die `border-top` der Club-Auswahl bei 58. Zusammen las
   sich das als schmaler Abstand – genau das, was weg sollte.

   Jetzt traegt GENAU EIN Element die Linie: die Kopfleiste, die ohnehin eine
   hat. Der Rest wird auf null gesetzt. Das ist zugleich der Punkt aus meinem
   eigenen Hinweis, den der Betreiber aufgegriffen hat: Eine Trennung, die nur
   dadurch entsteht, dass der Seitengrund grau ist, verschwindet lautlos,
   sobald jemand ihn auf Weiss stellt. Eine echte Linie tut das nicht. */
.wrap { padding-top: 0; }
.wrap .cselect-btn { border-top: 0; }

/* ⚠️ DREI QUELLEN, NICHT EINE – deshalb brauchte es zwei Anlaeufe: 40 px
   `.wrap`-Polster, 24 px versteckte `.titelzeile` und 24 px `margin-top` der
   `.auswahl`. Jede fuer sich unauffaellig, zusammen 64. Wieder die Lehre von
   heute Mittag: bei Abstaenden die KETTE messen, nicht ein Element. */
.auswahl { margin-top: 0; }

/* ── Ein Luftraum vor dem Handicap, keiner zwischen den Aufklappern ───────
   Ansage des Betreibers: „die gleiche Breite des Abstands oben (Stand…) bauen
   wir unten vor ‚Mein Course Handicap‘ ein und entfernen den Abstand zwischen
   ‚Mein Course…‘ und ‚Webcams‘.“

   30 px ist die GEMESSENE Hoehe der Stempelzeile – dieselbe Zahl, nicht eine
   geschaetzte. Der Seitengrund ist grau, der Abstand sieht damit aus wie jener
   Streifen und trennt die Zustaende von dem, was der Nutzer selbst tut.

   Die beiden Aufklapper darunter bleiben nahtlos aneinander – sie gehoeren
   zusammen. */
/* 5 px statt 30 – Ansage: „der Block unten (Mein Course… Webcams) soll
   genauso aussehen wie der Status-Block darueber, aber ueber Course… um die
   5 Pixel.“ Damit sitzt der untere Block so eng an den Zustaenden wie die
   Zeilen untereinander, bleibt aber als eigene Gruppe erkennbar. */
.hcp { margin-top: 5px; }
.jg-cam-klapp { margin-top: 0; }

/* Der Aktualisieren-Knopf wird ein LINK: schlicht, gruen, ohne Rahmen und
   ohne Flaeche – dieselbe Bauform wie „In meiner Naehe“ daneben, damit die
   Zeile eine Formsprache hat und nicht zwei. */
.sub .reload-btn,
.auswahl-kopf .reload-btn {
  border: 0;
  background: none;
  padding: 0;
  min-height: 0;
  font-size: 13px;
  font-weight: 500;
  color: var(--jg-green, #0f6e56);
  text-decoration: underline;
  gap: 5px;
}
.sub .reload-btn:hover,
.auswahl-kopf .reload-btn:hover { background: none; color: var(--jg-green-dark, #0c5b47); }
.sub .reload-btn svg,
.auswahl-kopf .reload-btn svg { width: 14px; height: 14px; }

/* Die Kopfzeile der Auswahl traegt jetzt bis zu drei Dinge: Beschriftung,
   „Aktualisieren“ und „In meiner Naehe“. Umbrechen statt quetschen. */
.auswahl-kopf {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 14px;
}
.auswahl-kopf label { margin-right: auto; }

/* Der Anlagenname wandert in den Aufklapper (Ansage: „den Namen der Anlage
   nehmen wir in Aufklapper“) – das Entwurfs-Skript haengt ihn um. Die Regel
   von vorhin, die ihn als Unterzeile zeigte, entfaellt damit. */
.jg-indoor .jg-anzeige { display: none; }
.jg-indoor .jg-anlagenname {
  font-size: 14px;
  font-weight: 600;
  color: var(--jg-ink, #15211c);
  margin-bottom: 6px;
}


/* ══════════════════════════════════════════════════════════════════════════
   APP-MENUE AM UNTEREN RAND (nur Telefon)
   Ansage des Betreibers (27.08.2026): „In der Mobi-Ansicht wollen wir unten
   ein App-Menue einbauen. Dort sollen erstmal Status, Club, Turniere, Runde
   und Konto stehen.“

   ⚠️ DIE ZIELE WERDEN NICHT NEU ERFUNDEN. `kopfmenue.js` baut sie bereits –
   samt Slug-Ermittlung (Adresse → Lieblingsplatz → zuletzt gewaehlter Club)
   und samt Unterscheidung live/lokal. Das Entwurfs-Skript SPIEGELT diese
   Links. Zwei Regelwerke fuer dieselben fuenf Ziele liefen beim ersten neuen
   Pfad auseinander, und der Fehler faende sich in der Leiste, die niemand
   pflegt.

   NUR UNTER 768 px: Am Rechner gibt es das Kopfmenue, und zwei Navigationen
   gleichzeitig sind eine zu viel.
   ══════════════════════════════════════════════════════════════════════════ */
@media (max-width: 767px) {
  .jg-tabbar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 40;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr;
    background: var(--jg-card, #fff);
    border-top: 1px solid var(--linie, #e4eae7);

    /* ⚠️ SAFE-AREA IST PFLICHT, NICHT FEINSCHLIFF. Auf jedem iPhone ohne
       Home-Knopf liegt unten der Home-Indikator ueber der Seite; ohne diese
       Zeile sitzt die unterste Beschriftung darunter und die Flaeche laesst
       sich nicht zuverlaessig antippen. Dieselbe Familie wie `100dvh` bei
       Dialogen (Kurzliste 3). */
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }

  .jg-menue-tab {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 7px 2px 6px;
    min-height: 52px;            /* bequem am Finger */
    text-decoration: none;
    color: var(--jg-muted, #5c6b64);
    font-size: 11px;
    font-weight: 500;
    line-height: 1.2;
  }
  .jg-menue-tab svg { width: 23px; height: 23px; }
  .jg-menue-tab:hover { color: var(--jg-ink, #15211c); }

  /* Der aktive Eintrag traegt die Markenfarbe – Farbe UND Fuellung, nicht nur
     Farbe: Auf einem hellen Grund ist ein Gruen gegen ein Grau fuer manche
     Augen kaum zu unterscheiden. */
  .jg-menue-tab.aktiv { color: var(--jg-green, #0f6e56); font-weight: 600; }

  .jg-menue-tab:focus-visible {
    outline: 2px solid var(--jg-green, #0f6e56);
    outline-offset: -2px;
  }

  /* ⚠️ DER SEITE UNTEN PLATZ MACHEN. Eine fixierte Leiste liegt UEBER dem
     Inhalt – ohne diesen Abstand ist die letzte Zeile der Seite dauerhaft
     verdeckt, und zwar genau die, die man beim Scrollen erreichen will. */
  body { padding-bottom: calc(58px + env(safe-area-inset-bottom, 0px)); }
}

/* Am Rechner gibt es sie nicht. */
@media (min-width: 768px) {
  .jg-tabbar { display: none; }
}


/* ══════════════════════════════════════════════════════════════════════════
   WAS AUF DER STATUSSEITE WEGFAELLT (Ansagen des Betreibers, 27.08.2026)
   ══════════════════════════════════════════════════════════════════════════ */

/* „Der Adressblock des Clubs kann bei Status raus.“ Er steht vollstaendig auf
   der Club-Detailseite, und die ist aus dem App-Menue einen Tipp entfernt. */
#club-info { display: none; }

/* „Den Block mit ‚Powered by…‘ bitte erstmal ausblenden“ – NACHGESCHAERFT
   wenige Minuten spaeter: „bei der Desktop-Ansicht bitte bleiben“.

   Also nur auf dem Telefon. Das passt zum Rest: Dort traegt die App-Leiste
   unten die Navigation, und ein zweiter Fussblock darueber waere Ballast auf
   dem knappsten Bildschirm. Am Rechner gibt es die Leiste nicht – dort ist
   der Markenfuss der einzige Ort, an dem Telefon und E-Mail des Betreibers
   stehen.

   AUSGEBLENDET, NICHT ENTFERNT – „erstmal“ steht so in der Ansage. */
@media (max-width: 767px) {
  .markenfuss { display: none; }
}

/* „Impressum usw. verschieben wir in das Menue unter ‚Abmelden‘“ – und kurz
   darauf: „die Fusszeile am Desktop bitte behalten“.

   Also nur auf dem Telefon. Dort ist der Platz knapp und die App-Leiste unten
   uebernimmt die Navigation; am Rechner bleibt der Fuss, wo er ueberall im
   Projekt steht.

   ⚠️ AM RECHNER STEHEN DIE DREI LINKS DAMIT ZWEIMAL – im Fuss und im
   Konto-Menue. Das ist KEIN Versehen, sondern der Grundsatz, den
   `kopfmenue.js` selbst formuliert: „Dieselben Wege stehen ueberall an.“ Wer
   das Menue offen hat, soll nicht erst schliessen muessen, um ans Impressum zu
   kommen. Sollte es doch stoeren, ist es eine Zeile. */
@media (max-width: 767px) {
  .sitefoot { display: none; }
}

/* Die Rechts-Eintraege im Menue etwas abgesetzt: Sie gehoeren nicht zum
   Konto, sondern zur Seite – eine duenne Linie sagt das, ohne ein Wort. */
.jg-konto-eintrag.jg-recht:first-of-type {
  border-top: 1px solid var(--linie, #e4eae7);
  margin-top: 4px;
  padding-top: 10px;
}

/* Der Webcam-Aufklapper traegt die Bauform des Handicap-Blocks (das Skript
   uebernimmt sie woertlich). Hier nur, was die Bilder darin brauchen: Sie
   duerfen bis an die Kante, der Rest der Zeile nicht. */
/* ⚠️ DIE GEOMETRIE KOMMT BEIM HANDICAP VON DER AEUSSEREN `.hcp`-SECTION,
   NICHT VOM `<details>` DARIN. Der Webcam-Klapper hat kein solches
   Aussenteil – er erbte deshalb nur die `.hcp-klapp`-Regeln (Rahmen rundum,
   10 px Abstand unten) und stand als eingerueckter Kasten neben einer
   buendigen Zeile.

   GEMESSEN (Befund des Betreibers im Bild, 27.08.2026):
     Handicap  links 0,  margin 0 -18px, Seitenrahmen 0
     Webcams   links 18, margin 0 0 10px, Seitenrahmen 1px

   Hier stehen jetzt dieselben Werte. Und `margin-bottom: 0` ist – zum dritten
   Mal heute – ein Erbstueck der Kachel-Bauform. */
.jg-cam-klapp {
  background: var(--jg-card, #fff);
  margin: 0 calc(var(--jg-gutter, 18px) * -1);

  /* ⚠️ KEINE eigene Oberkante (27.08.2026): „die Trennlinie zwischen ‚Mein
     Course…‘ und ‚Webcams‘ passt nicht – das soll genauso aussehen wie der
     Bereich darueber.“ Beide Bloecke trugen je eine 1-px-Linie an derselben
     Stelle, macht 2 px – doppelt so dick wie zwischen zwei Zustandszeilen.
     Die Unterkante von `.hcp` traegt sie allein. */
  border-top: 0;
  border-bottom: 1px solid var(--linie, #e4eae7);
  border-left: 0;
  border-right: 0;
  border-radius: 0;
}
.jg-cam-klapp .hcp-inhalt { padding-bottom: 14px; }
.jg-cam-klapp .webcams { margin: 0; padding-top: 0; }


/* ══════════════════════════════════════════════════════════════════════════
   ABSOLUT MINIMALISTISCH (Ansagen des Betreibers, 27.08.2026)
   ══════════════════════════════════════════════════════════════════════════ */

/* „Damit ersparen wir uns die komplette obere Zeile ‚Club auswaehlen…‘“.
   Beide Knoepfe daraus haben ein neues Zuhause (Skript): „Aktualisieren“ in
   der Stempelzeile, „In meiner Naehe“ im Aufklapper der Club-Suche. Was
   bleibt, ist die Beschriftung – und die sagt einem Auswahlfeld mit dem
   Clubnamen darin nichts, was es nicht selbst zeigt. */
.auswahl-kopf { display: none; }

/* Der Nahe-Knopf in der Clubliste: volle Zeile, wie eine Option – nur gruen,
   damit er als AKTION erkennbar bleibt und nicht wie ein Club aussieht. */
.cselect-list .jg-nah-in-liste {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 12px 14px;
  border: 0;
  border-bottom: 1px solid var(--linie, #e4eae7);
  background: none;
  font: inherit;
  font-weight: 500;
  color: var(--jg-green, #0f6e56);
  text-align: left;
  cursor: pointer;
}
.cselect-list .jg-nah-in-liste:hover { background: var(--jg-hover, #eef2f0); }
.cselect-list .jg-nah-in-liste svg { width: 16px; height: 16px; flex: none; }

/* „‚Aktuelle Webcam-Bilder‘ sparen wir uns nun“ – der Aufklapper darueber
   heisst bereits „Webcams“. Zweimal dasselbe Wort in zwei Zeilen ist genau
   die Art Wiederholung, die eine Seite unruhig macht. */
.webcams-titel { display: none; }


/* ── Der Clubname im Kopf faellt weg ──────────────────────────────────────
   Ansage des Betreibers (27.08.2026): „wenn die Auswahl des Clubs immer als
   erstes ganz oben erscheint (auf den Seiten, auf denen es Sinn macht), dann
   koennen wir uns den Namen des Clubs im Header sparen.“

   Auf DIESER Seite ist er doppelt entbehrlich: Der Name steht direkt darunter
   im Auswahlfeld, und der Link fuehrt auf `index.html?club=…` – also auf die
   Seite, auf der man schon steht.

   ⚠️ DAS GILT NUR, SOLANGE DIE AUSWAHL DA IST. Auf Club-Detailseite,
   Turnierkalender, Runde und Konto gibt es sie NICHT – dort ist `.kopf-club`
   der einzige Hinweis, um welchen Club es ueberhaupt geht. Wer dieses Muster
   uebernimmt, braucht auf jeder Seite das eine ODER das andere; beides
   wegzunehmen laesst den Nutzer raten. Deshalb steht die Regel hier im
   Entwurfs-Stylesheet der Statusseite und nicht in `kopfmenue.css`, wo sie
   alle Seiten auf einmal traefe. */
.kopf-club { display: none; }


/* ── Die Entwurfsfahne ausgeblendet (auf Wunsch, 27.08.2026) ──────────────
   ⚠️ SIE WAR KEIN BEIWERK: Diese Seite sieht dem echten „Status" jetzt zum
   Verwechseln aehnlich, und beide sind gleichzeitig offen. Was als
   Unterscheidung BLEIBT:
     – der Tab-Titel „JETZT.GOLF – Platzstatus (Entwurf)"
     – die Adresse `index-entwurf.html`
   Beides steht nicht im Bild, sondern darueber. Wer einen Screenshot ohne
   Adresszeile weitergibt, kann Entwurf und Produkt nicht unterscheiden.

   `display: none` und nicht geloescht – ein Wort im CSS holt sie zurueck. */
.mn-fahne { display: none; }


/* ══════════════════════════════════════════════════════════════════════════
   NACHLESE: ALLE GEERBTEN ABSTAENDE AUF EINMAL (27.08.2026)

   Nach dem vierten Einzelfund derselben Sorte einmal systematisch: ein
   CSS-Parser ueber `index.html` und `kopfmenue.css`, alle `margin`-Regeln auf
   den 34 Klassen, die dieser Entwurf umgestaltet. Ergebnis: 34 Regeln, davon
   sieben zum Zeitpunkt der Pruefung noch wirksam.

   Das haette die vier Einzelsuchen ersetzt. **Bei einem Layoutumbau gehoert
   dieser Durchlauf AN DEN ANFANG, nicht ans Ende.**
   ══════════════════════════════════════════════════════════════════════════ */

/* ⚠️ LATENT, NICHT SICHTBAR: Die negativen Raender des Aufklappers wurden
   bisher nur an `.jg-item.offen .jg-details` aufgehoben. Im ZUGEKLAPPTEN
   Zustand stand der alte Wert (-112 / -48) weiter da – harmlos allein
   deshalb, weil das Element dann `display: none` ist. Wer die Faltung spaeter
   anders steuert, haette den Ueberlauf sofort zurueck, ohne etwas geaendert
   zu haben. Deshalb hier ohne Zustandsbedingung. */
.jg-details {
  margin-left: 0;
  margin-right: 0;
  margin-top: 0;          /* der Abstand kommt aus `padding-top`, nicht aus beidem */
}

/* 1 px Versatz aus der Kachel-Zeit: Dort stand der Knopf neben einem Text mit
   anderer Grundlinie. Im Raster zentriert `align-items` selbst. */
.jg-toggle { margin-top: 0; }

/* NICHT angetastet, weil bewusst und unschaedlich:
     `.club-aktionen` margin-top 24px  – der Abstand vor den Club-Knoepfen
     `.kopfnav`       margin-top  6px  – gehoert zur Kopfleiste, nicht hierher
     `.titelzeile`    margin-bottom    – das Element ist `display: none` */