/* CJump Sub-Tab-Leiste — geteilte Komponente für die 5-Tab-IA
 * (Mein Tag / Mein Plan / Mein Fortschritt / Mein Wissen). Extrahiert + generalisiert
 * aus progress.html (.cj-prog-toptabs, Carlo 24.06.). Generische Klassen:
 *   .cj-subtabs  (nav, role=tablist)  ·  .cj-subtab  (button, role=tab)  ·  .cj-subpane (section)
 * Spaltenzahl setzt cj_subtabs.js via data-count automatisch.
 */
/* EINE Picker-Leisten-Quelle fuer ALLE 4 Screens (Carlo 24.07.: "etablier einen Standard, wir haben
 * doch einen Baukasten"). .cj-prog-toptabs (Fortschritt) + .cj-trainingsplan-sub (Plan) waren private
 * Kopien im Seiten-<style> und drifteten (Tag/Wissen anthrazit, Plan/Fortschritt glasig). Jetzt hier
 * mitgestylt, die privaten Bloecke sind geloescht -> kein Drift mehr moeglich. Markup-Klassen bleiben
 * (workout.html entfernt den Container per .cj-trainingsplan-sub-Selektor). */
.cj-subtabs,
.cj-prog-toptabs,
.cj-trainingsplan-sub {
  /* Carlo 06.07. (R5): NICHT sticky — die Leiste soll beim Scrollen wegscrollen (nicht oben gepinnt). */
  margin: 0 16px 14px;
  padding: 4px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
  /* App-Standard (Carlo 06.07.): transparent-frosted statt solid Anthrazit — leichter, premium.
   * Sticky bleibt; der Frosted-Blur haelt darunter scrollenden Text lesbar. Kanonische Werte fuer
   * ALLE Sub-Tab-Leisten (Plan/Fortschritt/Tag/Wissen) — private Kopien in workout.html
   * (.cj-trainingsplan-sub, .cj-wk-subnav) + progress.html (.cj-prog-toptabs) hierauf syncen. */
  /* GLAS ZURUECKGESETZT 24.07. (Carlo: "Picker sofort im Endzustand, nicht erst nach 1s"): backdrop-filter
     malt auf iOS-WKWebView verzoegert (Glas erschien ~1s spaeter, weil die 0.05-Basis fast unsichtbar ist)
     -> solide, frosted-dunkle Leiste, die von Frame 0 an steht. Blur auskommentiert erhalten. */
  /* L1-Track = kanonischer Baukasten-Glas-Fill (Ebene 0: Segment-Picker = Blau-Glas, "nie solides
     Anthrazit", Carlo-Wahl 24.07.). --cj-card-bg = rgba(22,25,31,0.55) ist ein SICHTBARER Fill ->
     kein Invisible-Pop wie die alten rgba(255,255,255,0.05)-Leisten (die "nach 1s"-Glas). Mein
     solides Anthrazit rgba(30,32,38,0.82) war ein Fehler (Carlo 24.07.: "richtiges Level-1-Element?").
     !important: aeltere Clients bekommen workout.html/progress.html noch mit der ALTEN Inline-Glas-
     Kopie aus dem SW-Cache serviert (network-first _shared laedt diese Regel frisch) -> hier gewinnen. */
  background: var(--cj-card-bg) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  backdrop-filter: blur(12px) !important;
  border: 1px solid var(--cj-white-10);
  border-radius: 12px;
}
.cj-subtabs[data-count="2"],
.cj-trainingsplan-sub[data-count="2"] { grid-template-columns: repeat(2, 1fr); }
.cj-subtabs[data-count="3"] { grid-template-columns: repeat(3, 1fr); }
.cj-subtabs[data-count="4"] { grid-template-columns: repeat(4, 1fr); }
/* L1-Segment-Control (Seiten-Top-Tabs). Kanonische Quelle fuer .cj-subtab (mein-tag/wissen),
 * .cj-prog-toptab (progress) und .cj-trainingsplan-sub__btn (workout) — Baukasten 15.07.
 * Universelle weight-Regel: aktiv fett (800) / inaktiv normal (500). */
.cj-subtab, .cj-prog-toptab, .cj-trainingsplan-sub__btn {
  appearance: none;
  border: none;
  background: transparent;
  color: var(--cj-white-70);
  font-family: var(--cj-font-body);
  font-size: 13px;
  font-weight: 500;
  padding: 10px 8px;
  border-radius: 9px;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background var(--cj-trans-fast), color var(--cj-trans-fast);
  min-height: 40px;
  text-align: center;
  letter-spacing: 0.01em;
}
.cj-subtab:hover, .cj-prog-toptab:hover, .cj-trainingsplan-sub__btn:hover { color: var(--cj-white-70); }
.cj-subtab[aria-selected="true"], .cj-prog-toptab[aria-selected="true"], .cj-trainingsplan-sub__btn--active {
  background: var(--cj-grad-primary);
  color: var(--cj-white);
  font-weight: 800;
  box-shadow: 0 2px 10px rgba(26, 140, 255, 0.40);
}
.cj-subtab:focus-visible, .cj-prog-toptab:focus-visible, .cj-trainingsplan-sub__btn:focus-visible {
  outline: 2px solid var(--cj-electric-light);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  .cj-subtab, .cj-prog-toptab, .cj-trainingsplan-sub__btn { transition: none; }
}
.cj-subpane { display: block; }
.cj-subpane[hidden] { display: none; }

/* CJump Filter-Strip — geteilte Komponente für alle Listen-Tabs (Fortschritt: Medaillen/Trophäen,
 * Wissen: Übungen/Theorie/Hilfe). IA-Re-Design 08.07. (R4/R7, Option A): ersetzt die divergierenden
 * privaten Kopien .cj-prog-pane-filter (progress.html) + .cj-st-saeule-filter__pill (wissen.html).
 * Ein Klassensatz, eine Pflege-Stelle.
 *   .cj-filterbar (nav/div, role=tablist)  ·  .cj-filter-pill (button, role=tab)
 * ponytail: Aktiv-State über [aria-selected="true"] ODER .is-active — akzeptiert beide bestehenden
 * Konventionen (progress nutzt aria-selected, wissen rendert .is-active), spart JS-Refactor an 2 Screens. */
.cj-filterbar {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 16px 12px;
  overflow-x: auto;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  min-width: 0;
}
.cj-filterbar::-webkit-scrollbar { display: none; }
.cj-filter-pill {
  appearance: none;
  -webkit-tap-highlight-color: transparent;
  flex-shrink: 0;
  border: 1px solid var(--cj-white-10);
  background: transparent;
  color: var(--cj-white-70);
  font-family: var(--cj-font-body);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  padding: 0 10px;
  border-radius: 999px;
  cursor: pointer;
  white-space: nowrap;
  transition: background var(--cj-trans-fast), color var(--cj-trans-fast), border-color var(--cj-trans-fast); min-height: var(--cj-pill-h-tippen); display: inline-flex; align-items: center; justify-content: center; }
.cj-filter-pill:hover:not([aria-selected="true"]):not(.is-active):not([aria-pressed="true"]) {
  color: var(--cj-white);
  border-color: var(--cj-white-30);
}
/* aria-pressed = Mehrfachauswahl (ein Umschalt-Knopf), aria-selected = eine Wahl je Leiste.
   Beide sehen gleich aus - der Unterschied liegt in der Bedeutung, nicht in der Optik. */
.cj-filter-pill[aria-selected="true"],
.cj-filter-pill[aria-pressed="true"],
.cj-filter-pill.is-active {
  /* Carlo 10.07. (R10): der „Rand oben/unten" war ein Chromium-Bleed. Mit background-clip:border-box
     malt der Gradient in die 1px transparente Border-Zone und alpha-composited ihn dort an der runden
     Kante mit dem dunklen Grund → heller Halbtransparenz-Halo. Fix: background-clip:padding-box → der
     Gradient endet scharf an der Padding-Kante, die Border-Zone bleibt leer, kein Bleed. Border bleibt
     1px transparent (auf dunklem Grund unsichtbar) → Außengröße identisch zur inaktiven Pille, kein
     Layout-Shift beim Umschalten (border-width:0 würde die Pille um 2px schrumpfen). */
  background: var(--cj-grad-primary);
  background-clip: padding-box;
  color: var(--cj-white);
  border-color: transparent;
  /* Keine fettere Schrift im gewaehlten Zustand (app_bauregeln Nr. 11, 10.10.2026): 800 statt 700
     machte jede gewaehlte Pille ~1 px breiter, im Filter-Blatt (flex-wrap) rueckten die Nachbarn
     nach - gemessen bis 1,5 px. Gewaehlt zeigt sich ueber Verlauf + Weiss, die Stärke bleibt 700.
     Test: athlete/tests/tippen_aendert_nichts/. */
  box-shadow: none;
}
.cj-filter-pill:focus-visible {
  outline: 2px solid var(--cj-electric-light);
  outline-offset: 2px;
}
/* Die untergeordnete Unterstrich-Leiste (.cj-filterbar--sub, Carlo 10.07.) ist am 15.08.2026
 * entfallen: ihr einziger Nutzer war die zweite Ebene der Uebungs-Bibliothek, und die ist mit
 * der Mehrfachauswahl weg - dort steht jetzt jede Achse als eigener Abschnitt im Blatt.
 * Bewusst geloescht statt liegengelassen: eine Regel ohne Nutzer wird irgendwann wieder
 * angefasst und belebt ein Aussehen, das ersetzt wurde. */
@media (max-width: 390px) {
  .cj-filterbar { gap: 5px; }
  .cj-filter-pill { padding: 6px 8px; font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  .cj-filter-pill { transition: none; }
}

/* ─── cj-searchbar — EINE Quelle für Listen-Suchleisten (Baukasten 14.07.) ───
 * Kanonisch: .cj-searchbar (Wrapper) / __icon / __input / __clear.
 * Bestand-Aliase cj-medal-search (progress.html) + cj-faq-search (wissen.html)
 * + cj-ex-search (Übungs-Bibliothek) ziehen aus derselben Quelle — HTML/JS
 * unverändert, kein CSS-Drift mehr. Neue Suchleisten nutzen nur .cj-searchbar.
 * Border auf Token --cj-white-10 normalisiert (medal war 0.12, unsichtbar).
 * cj-ex-search kam am 15.08.2026 dazu: sie war beim Baukasten-Lauf vergessen
 * worden und hatte als einzige eine eigene Kopie in cj_exercise_library.css —
 * 14px-Rechteck statt Pille, Lupe 38 statt 46 px von links. Carlo hat an der
 * Werkbank „ueberall Pille" gewaehlt, die Kopie ist geloescht. */
.cj-searchbar, .cj-medal-search, .cj-faq-search, .cj-ex-search { position: relative; margin: 0 16px 12px; }
.cj-searchbar[hidden], .cj-medal-search[hidden], .cj-faq-search[hidden], .cj-ex-search[hidden] { display: none; }
.cj-searchbar__icon, .cj-medal-search__icon, .cj-faq-search__icon, .cj-ex-search__icon { position: absolute; left: 18px; top: 50%; transform: translateY(-50%); width: 17px; height: 17px; color: var(--cj-white-50); pointer-events: none; }
.cj-searchbar__input, .cj-medal-search__input, .cj-faq-search__input, .cj-ex-search__input { width: 100%; box-sizing: border-box; padding: 11px 42px 11px 46px; font-size: 15px; font-weight: 600; color: var(--cj-white); font-family: inherit; background: rgba(255,255,255,0.05); border: 1px solid var(--cj-white-10); border-radius: 999px; -webkit-appearance: none; appearance: none; }
.cj-searchbar__input::placeholder, .cj-medal-search__input::placeholder, .cj-faq-search__input::placeholder, .cj-ex-search__input::placeholder { color: var(--cj-white-50); font-weight: 500; }
.cj-searchbar__input:focus-visible, .cj-medal-search__input:focus-visible, .cj-faq-search__input:focus-visible, .cj-ex-search__input:focus-visible { outline: none; border-color: var(--cj-electric); background: rgba(26,140,255,0.06); }
.cj-searchbar__input::-webkit-search-cancel-button, .cj-medal-search__input::-webkit-search-cancel-button, .cj-faq-search__input::-webkit-search-cancel-button, .cj-ex-search__input::-webkit-search-cancel-button { display: none; }
.cj-searchbar__clear, .cj-medal-search__clear, .cj-faq-search__clear, .cj-ex-search__clear { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); display: none; width: 28px; height: 28px; align-items: center; justify-content: center; background: none; border: none; color: var(--cj-white-50); cursor: pointer; border-radius: 8px; padding: 0; }
.cj-searchbar__clear svg, .cj-medal-search__clear svg, .cj-faq-search__clear svg, .cj-ex-search__clear svg { width: 15px; height: 15px; }
.cj-searchbar[data-has-value="1"] .cj-searchbar__clear, .cj-medal-search[data-has-value="1"] .cj-medal-search__clear, .cj-faq-search[data-has-value="1"] .cj-faq-search__clear, .cj-ex-search[data-has-value="1"] .cj-ex-search__clear { display: flex; }

/* ─── Suchzeile + Filter-Knopf + Filter-Blatt (Baukasten 15.08.2026) ───
 * Carlo an der Werkbank: statt einer dauerhaft sichtbaren Knopf-Reihe steht neben
 * der Suche EIN Knopf, der die aktive Wahl als Text traegt („Knie" statt „Filter").
 * Die Wahl selbst liegt in einem Blatt von unten. Gewinn in der Bibliothek: der
 * erste Eintrag ruecht von 254 auf 210 px und bleibt beim Filtern dort (vorher 306).
 * Verdrahtung: _shared/cj_filterknopf.js — die 5 Stellen rufen nur eine Funktion.
 *
 * Der Knopf steht NEBEN der Suchleiste, nicht darin: das Kreuz zum Leeren sitzt
 * absolut am rechten Rand der Leiste und muesste sonst per gemessener Breite
 * ausweichen. Eine Zeile drumherum loest das ohne eine einzige Zahl. */
.cj-suchzeile { display: flex; align-items: center; gap: 8px; margin: 0 16px 12px; }
.cj-suchzeile > .cj-searchbar, .cj-suchzeile > .cj-medal-search,
.cj-suchzeile > .cj-faq-search, .cj-suchzeile > .cj-ex-search { flex: 1 1 auto; min-width: 0; margin: 0; }

.cj-filterknopf {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; padding: 0 16px; max-width: 170px;
  border: 1px solid var(--cj-white-10); border-radius: 999px;
  background: rgba(255,255,255,0.05); color: var(--cj-white-70);
  font-family: inherit; font-size: 15px; font-weight: 600;
  white-space: nowrap; overflow: hidden; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background var(--cj-trans-fast), color var(--cj-trans-fast), border-color var(--cj-trans-fast);
}
.cj-filterknopf > span { overflow: hidden; text-overflow: ellipsis; }
.cj-filterknopf svg { width: 17px; height: 17px; flex: 0 0 auto; }
/* Aktiv = dieselbe Optik wie eine aktive Filter-Pille (background-clip wegen Bleed, s.o.) */
.cj-filterknopf[data-aktiv="1"] {
  background: var(--cj-grad-primary); background-clip: padding-box;
  border-color: transparent; color: var(--cj-white); font-weight: 800;
}
.cj-filterknopf:focus-visible { outline: 2px solid var(--cj-electric-light); outline-offset: 2px; }

/* Bottom-Sheet nach navigation.md: nur ✕, kein Pfeil, kein „Fertig". Topbar und
 * Tab-Leiste bleiben sichtbar — ein Sheet ueberlagert nur teilweise. */
.cj-filterblatt {
  display: none;
  /* Der main-Ast wird beim Oeffnen auf z-index 60 gehoben (s.u.) und ist damit ein
   * eigener Stapel - die Zahlen hier gelten nur ZUEINANDER. Bewusst auf Overlay-Hoehe:
   * ein echtes Modal (--cj-z-modal 10000, z.B. die Uebungs-Detailkarte) legt sich weiter
   * darueber, das Blatt ist die leichtere Ebene. */
  position: fixed; left: 0; right: 0; bottom: 0; z-index: calc(var(--cj-z-overlay) + 1); margin: 0;
  padding: 16px 0 calc(env(safe-area-inset-bottom) + 16px);
  max-height: 70vh; overflow-y: auto;
  background: var(--cj-anthrazit-darker); border-top: 1px solid var(--cj-white-10);
  border-radius: var(--cj-r-sheet) var(--cj-r-sheet) 0 0;
  box-shadow: 0 -12px 40px rgba(0,0,0,0.5);
}
.cj-filterblatt.is-auf { display: block; }
/* Der Verdunkler gehoert NEBEN das Blatt, nicht an den body: das Blatt liegt im
 * gehobenen main-Ast (z-index 60), ein Verdunkler am body laege mit z-index 1324
 * ueber dem ganzen Ast — und wuerde damit sein eigenes Blatt zudecken (gemessen). */
.cj-filterblatt__grund { display: none; position: fixed; inset: 0; z-index: var(--cj-z-overlay); background: rgba(0,0,0,0.55); }
.cj-filterblatt__grund.is-auf { display: block; }
/* Die Tab-Leiste liegt bei z-index 50 am Wurzel-Stapel, das Blatt tief im Seitenbaum:
 * ein z-index am Blatt allein verliert immer, also wird der ganze Ast gehoben. */
body.cj-filterblatt-offen main { position: relative; z-index: 60; }
body.cj-filterblatt-offen { overflow: hidden; }

.cj-filterblatt__kopf { display: flex; align-items: center; justify-content: space-between; margin: 0 16px 16px; }
.cj-filterblatt__kopf span { font-size: 15px; font-weight: 800; color: var(--cj-white); }
.cj-filterblatt__zu {
  /* padding:0 gegen den Browser-Default eines <button> (1px 6px) - unsichtbar, weil Flex
     zentriert, aber es faellt in der Raster-Messung auf. Das negative margin-right ist
     dagegen Absicht: es holt die 44-px-Trefferflaeche des Icons auf die 16-px-Kante der
     uebrigen Bloecke (Ink-Kante statt Box-Kante, design_principles Regel 9). */
  width: 44px; height: 44px; padding: 0; margin-right: -10px; border: none; background: transparent;
  color: var(--cj-white-70); cursor: pointer; border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
}
.cj-filterblatt__zu svg { width: 18px; height: 18px; }
.cj-filterblatt__zu:focus-visible { outline: 2px solid var(--cj-electric-light); outline-offset: 2px; }
/* Im Blatt ist Platz — die Werte duerfen umbrechen statt seitlich wegzurutschen. */
.cj-filterblatt .cj-filterbar { flex-wrap: wrap; overflow: visible; margin: 0 16px; gap: 8px; }
.cj-filterblatt .cj-ex-filterwrap,
/* Board #441: derselbe Wrapper-Fall bei Medaillen und Trophaeen - mehrere Achsen
   untereinander in EINEM Behaelter, der selbst keinen eigenen Rand mitbringt. */
.cj-filterblatt .cj-filterwrap { margin: 0; }
/* Im Blatt sind die Pillen echte Tipp-Ziele: 44 px statt 32 (Carlo 15.08. — „da ist ja
 * jetzt definitiv Platz vorhanden"). Die 32 px der Leisten-Fassung waren ein Zugestaendnis
 * an den Fluss: jede Zeile dort schob die Liste nach unten. Im Blatt kostet Hoehe nichts,
 * also gilt hier das Apple-Mindestmass --cj-pill-touch — sichtbar, nicht als unsichtbares
 * ::after. */
.cj-filterblatt .cj-filter-pill {
  min-height: var(--cj-pill-touch);
  padding: 0 16px;
  font-size: 13px;
}

/* ─── Mehrfachauswahl im Blatt (Carlo-Frage 15.08.) ────────────────────────────
 * Eine Achse je Abschnitt, Ueberschrift darueber. Nur im Blatt sinnvoll - in einer
 * Leiste im Fluss haette das nie Platz gehabt, genau das war der Grund fuer den Knopf. */
/* Alle Masse hier auf dem 8er-Raster (design_principles Regel 15) und die Ueberschrift auf
   dem 12-px-Label-Floor - meine erste Fassung hatte 18/20/14 px Abstaende und 11 px Schrift,
   das faengt die Pre-Build-Checkliste. Proximity (Regel 17): 8 px zwischen Ueberschrift und
   ihren Werten (verwandt), 24 px zwischen zwei Achsen (unverwandt). */
.cj-filterblatt__achse + .cj-filterblatt__achse { margin-top: 24px; }
.cj-filterblatt__achse-titel {
  margin: 0 16px 8px; font-family: var(--cj-font-body); font-size: 12px; font-weight: 800;
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--cj-white-70);
}
/* Beim Waehlen liegt die Liste hinter dem Blatt - der Fuss sagt darum laufend, wie viele
 * Uebungen die Wahl gerade uebrig laesst. Ohne ihn waehlt man ins Blinde.
 *
 * Er KLEBT am unteren Rand des Blattes (Carlo 15.08.: „ich muss immer noch scrollen").
 * Vorher stand er als letztes Element hinter den fuenf Achsen — sichtbar erst, wenn man
 * ganz nach unten gescrollt hatte, also genau dann nicht, wenn man waehlt. Sitz unten
 * statt oben, weil er die BILANZ der Wahl ist: erst waehlen, dann das Ergebnis lesen
 * (und weil „Zuruecksetzen" ein Ausstieg ist, kein Einstieg — oben laege es auf dem Weg).
 * Full-bleed statt 16-px-Rand: die Achsen scrollen darunter durch und wuerden sonst
 * seitlich hervorlugen. */
.cj-filterblatt__fuss {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  position: sticky; bottom: 0;
  background: var(--cj-anthrazit-darker);
  margin: 24px 0 0;
  padding: 16px 16px calc(env(safe-area-inset-bottom) + 16px);
  border-top: 1px solid var(--cj-white-10);
}
/* Den unteren Innenabstand traegt jetzt der Fuss selbst — bliebe er am Blatt, klebte der
 * Fuss 16 px ueber dessen Rand und die Achsen liefen darunter durch. */
.cj-filterblatt:has(.cj-filterblatt__fuss) { padding-bottom: 0; }
/* Der Abschluss-Knopf. Er traegt die Trefferzahl, damit er sagt, WAS danach dasteht -
 * „Fertig" allein laesst das offen. Derselbe Verlauf wie eine aktive Pille, also bleibt es
 * EIN Akzent im Blatt (nicht zwei). Das ✕ oben bleibt: navigation.md verlangt genau ein
 * Schliessen-Element, und dieser Knopf schliesst nicht „weg", sondern schliesst AB. */
.cj-filterblatt__fertig {
  appearance: none; border: 0; cursor: pointer;
  background: var(--cj-grad-primary); background-clip: padding-box;
  color: var(--cj-white); font-family: var(--cj-font-body); font-size: 13px; font-weight: 800;
  min-height: var(--cj-pill-touch); padding: 0 16px; border-radius: 999px; white-space: nowrap;
}
.cj-filterblatt__fertig:focus-visible { outline: 2px solid var(--cj-electric-light); outline-offset: 2px; }

/* „Zuruecksetzen" im Kopf (Fassung A) - der Kopf wird dafuer zum Drei-Spalten-Raster,
 * damit der Titel optisch mittig bleibt (dasselbe Muster wie die Push-View-Leiste). */
.cj-filterblatt__kopfreset {
  appearance: none; border: 0; background: transparent; padding: 0; cursor: pointer;
  font-family: var(--cj-font-body); font-size: 13px; font-weight: 700;
  color: var(--cj-electric-light); text-align: left; justify-self: start;
}
.cj-filterblatt__kopfreset:disabled { opacity: 0.35; cursor: default; }
.cj-filterblatt__kopfreset:focus-visible { outline: 2px solid var(--cj-electric-light); outline-offset: 2px; }

/* Carlo hat den Fuss am 17.08.2026 an der Werkbank entschieden: „Zuruecksetzen" oben im
 * Kopf, unten EIN blauer Knopf ueber die volle Breite. Verworfen und geloescht (nicht
 * abgeschaltet): beides unten in einer Zeile - dort schrumpfte der blaue Knopf von 396 auf
 * 143 px - und der Stand davor ganz ohne Abschluss-Knopf.
 *
 * Das Drei-Spalten-Raster greift nur, wo der Kopf-Knopf wirklich steht: die anderen vier
 * Blaetter haben keinen Reset und behalten ihren Flex-Kopf (Titel links, ✕ rechts). Aussen
 * 1fr/1fr, damit der Titel mittig bleibt, egal wie lang „Zuruecksetzen (3)" gerade ist. */
.cj-filterblatt__kopf:has(.cj-filterblatt__kopfreset) {
  display: grid; grid-template-columns: 1fr auto 1fr; gap: 16px;
}
.cj-filterblatt__kopf:has(.cj-filterblatt__kopfreset) > span { justify-self: center; }
.cj-filterblatt__kopf:has(.cj-filterblatt__kopfreset) .cj-filterblatt__zu { justify-self: end; }
.cj-filterblatt__fertig { flex: 1; }

/* Carlo hat den Sitz des Fusses am 15.08.2026 an der Werkbank .entwurf/fuss_werkbank.html
 * entschieden: „unten, klebt fest". Zur Wahl standen ausserdem „oben, klebt fest" (sofort
 * sichtbar, legt sich beim Scrollen aber ueber die Achsen-Ueberschrift, und Zuruecksetzen
 * liegt auf dem Weg zur ersten Wahl) und der alte Stand „unten, scrollt mit" (Fuss erst
 * nach 181 px Scrollen zu sehen). Die beiden Varianten sind geloescht, nicht abgeschaltet. */