/* Malna — Feinschliff nach dem Handy-Audit vom 24.09.2026. Nur Tokens, keine neuen Farben. */

/* Ich: Icons in Bordeaux, Text bleibt dunkel (Entscheidung 24.09.2026, siehe AGENTS.md). */
.me-list-row .bo-icon:first-child {
  color: var(--accent);
}

/* Profil: Erfolgsmeldungen brauchen keine Anzeige, fester Speichern-Fuss mit Trennlinie. */
#profile .profile-save-status.good {
  display: none;
}

.ui-shell-enabled #profile .profile-actions {
  border-top: 1px solid var(--border);
}

/* Hinweis «Zielbewertung pausiert» als eigene Zeile, nie in eine Spalte gequetscht. */
.os-scope-note {
  width: 100%;
}

/* Ältere Formulare (Supplements, Schlaf, Cardio) auf den Baustein «Eingabefeld». */
.product-form label {
  display: grid;
  gap: var(--space-1);
  color: var(--text-3);
  font: var(--font-weight-regular) var(--font-size-label) / 1.4 var(--font-system);
}

.product-form label > span {
  display: inline;
  margin-left: var(--space-1);
  color: var(--text-3);
}

.product-form input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.product-form select,
.product-form textarea {
  box-sizing: border-box;
  width: 100%;
  min-height: var(--control-height);
  padding: 0 var(--space-3);
  color: var(--text);
  font: var(--font-weight-regular) var(--font-size-value) / 1.4 var(--font-system);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-button);
  outline: none;
  appearance: none;
}

.product-form textarea {
  padding: var(--space-3);
}

.product-form input:focus,
.product-form select:focus,
.product-form textarea:focus {
  border-color: var(--accent);
}

/* Alte Karten in Daten und Backup, Finanzen und Supplements auf die neuen Tokens. */
#data .card {
  padding: var(--space-3);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  box-shadow: none;
}

#data .card + .card {
  margin-top: var(--space-2);
}

#data .cardtitle {
  color: var(--text);
  font: var(--font-weight-medium) var(--font-size-value) / 1.4 var(--font-system);
}

#data .subtle,
#data .notice {
  color: var(--text-2);
  font: var(--font-weight-regular) var(--font-size-list) / 1.5 var(--font-system);
}

#data .notice {
  margin-top: var(--space-3);
  padding: var(--space-3);
  background: var(--page);
  border: 0;
  border-radius: var(--radius-button);
}

#data .actions {
  display: grid;
  gap: var(--space-2);
  margin-top: var(--space-3);
}

#data .actions button,
#data button.secondary,
#data button.primary {
  width: 100%;
  min-height: var(--control-height);
  padding-block: var(--space-2);
  font: var(--font-weight-medium) var(--font-size-value) / 1.3 var(--font-system);
  border-radius: var(--radius-button);
}

#data button.secondary,
#data .actions button:not(.primary) {
  color: var(--text);
  background: var(--card);
  border: 1px solid var(--border);
}

#data button.primary {
  color: var(--card);
  background: var(--accent);
  border: 0;
}

/* «Als CSV exportieren» (Stand 28.09.2026): vier Bereiche als zweite Aktionen in zwei Spalten, darunter die Rückmeldung. */
#data .csv-export-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

#csvExportStatus {
  margin: var(--space-2) 0 0;
}

#csvExportStatus:empty {
  display: none;
}

/* Browser-Standardknöpfe, die nirgends gestaltet waren, bekommen den Baustein «zweite Aktion». */
.medication-manual-open {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: var(--control-height);
  padding: var(--space-2) var(--space-4);
  color: var(--text);
  font: var(--font-weight-regular) var(--font-size-value) / 1.3 var(--font-system);
  text-align: center;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-button);
  cursor: pointer;
}

#money strong,
#money b {
  font-weight: var(--font-weight-medium);
}

/* Labor: Marker-Auswahl als Blatt mit Suche statt 243er-Dropdown. */
.lab-marker-native {
  display: none !important;
}

.lab-marker-picker {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: var(--control-height);
  padding: 0 var(--space-3);
  color: var(--text);
  font: var(--font-weight-regular) var(--font-size-value) / 1.4 var(--font-system);
  text-align: left;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-button);
  cursor: pointer;
}

.lab-marker-picker::after {
  content: "";
  width: var(--space-2);
  height: var(--space-2);
  margin-left: var(--space-2);
  border-right: 1.5px solid var(--text-3);
  border-bottom: 1.5px solid var(--text-3);
  transform: rotate(45deg) translateY(-2px);
}

.lab-marker-sheet .ui-bottom-sheet__body {
  display: grid;
  gap: var(--space-2);
}

.lab-marker-sheet__list {
  display: grid;
  max-height: 60dvh;
  overflow-y: auto;
}

.lab-marker-sheet__group {
  margin: var(--space-3) 0 var(--space-1);
  color: var(--text-3);
  font: var(--font-weight-regular) var(--font-size-section) / 1.4 var(--font-system);
}

.lab-marker-sheet__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  min-height: var(--control-height);
  padding: 0;
  color: var(--text);
  font: var(--font-weight-regular) var(--font-size-list) / 1.4 var(--font-system);
  text-align: left;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
}

.lab-marker-sheet__row small {
  color: var(--text-3);
  font-size: var(--font-size-label);
}

.lab-marker-sheet__row.is-selected span {
  font-weight: var(--font-weight-medium);
}

.lab-marker-sheet__empty,
.lab-range-hint {
  margin: var(--space-2) 0 0;
  color: var(--text-2);
  font: var(--font-weight-regular) var(--font-size-list) / 1.4 var(--font-system);
}

/* Einheitliche Kartentitel ohne 600/700. */
#labs .cardtitle,
#health .cardtitle,
#medications .cardtitle {
  font-weight: var(--font-weight-medium);
}

/* Globale Suche: Titel bleibt in der Mitte, auch wenn der Zurück-Pfeil verborgen ist; Suchsymbol im Feld. Bei 320 px
   bricht «Suchen und erfassen» auf zwei Zeilen um, statt mit «…» gekürzt zu werden. */
.global-capture-header #commandDialogTitle {
  grid-column: 2;
  overflow-wrap: break-word;
}

.global-capture-header__actions {
  grid-column: 3;
}

.global-capture-search {
  align-content: start;
}

.global-capture-query {
  position: sticky;
}

.global-capture-query > .bo-icon {
  position: absolute;
  left: var(--space-3);
  top: calc(var(--control-height) / 2);
  transform: translateY(-50%);
  pointer-events: none;
}

.global-capture-query .ui-input {
  padding-left: calc(var(--space-3) * 2 + var(--icon-size) - var(--space-1));
}

/* Löschen-Kreuz in Suchfeldern nicht in Systemblau. */
input[type="search"]::-webkit-search-cancel-button {
  filter: grayscale(1);
  opacity: 0.6;
}

/* Today: alle Kacheln sind Knöpfe; sieben Tage passen ohne Scrollen. */
button.ui-metric-tile {
  width: 100%;
  text-align: left;
  cursor: pointer;
  font: inherit;
}

/* Wochenleiste (Today und Ernährung): Die Tage stossen ohne Zwischenraum aneinander, so hat jeder Tag mindestens 44 px
   Trefferfläche (auf Handys siehe unten). Die Pille bleibt durch den seitlichen Innenabstand so schmal wie bisher.
   Die Pfeile sind schmaler und nutzen den Seitenrand als Trefferfläche: 28 px sichtbar plus 16 px Seitenrand = 44 px
   (Stand 28.09.2026, vorher 24 + 16 px). Der Zeitraum der Woche erscheint nur auf schmalen Handys (siehe unten). */
.nutrition-week-shell {
  grid-template-columns: calc(var(--control-height) - var(--space-4)) minmax(0, 1fr) calc(var(--control-height) - var(--space-4));
  gap: 0;
}

.nutrition-week-range {
  display: none;
}

.nutrition-week-shift {
  position: relative;
  width: 100%;
}

.nutrition-week-shift::after {
  position: absolute;
  inset: 0;
  content: "";
}

.nutrition-week-shift:first-child::after {
  left: calc(var(--space-4) * -1);
}

.nutrition-week-shift:last-child::after {
  right: calc(var(--space-4) * -1);
}

.nutrition-week {
  gap: 0;
  overflow: hidden;
}

.nutrition-week .nutrition-day {
  flex: 1 1 0;
  min-width: 0;
  padding: 0 var(--space-1);
  background-clip: content-box;
}

/* Handys bis 479 px (Stand 27.09.2026): Die Wochenleiste reicht bis in den Seitenrand von 16 px. Ab 396 px Breite
   (9 × 44 px) stehen Pfeile und Tage in einer Zeile, jeder Pfeil 44 px breit, jeder Tag mindestens 44 px, das Symbol der
   Pfeile zu den Tagen hin. */
@media (max-width: 479px) {
  .nutrition-week-shell {
    grid-template-columns: var(--control-height) minmax(0, 1fr) var(--control-height);
    margin-right: calc(var(--space-4) * -1);
    margin-left: calc(var(--space-4) * -1);
  }

  .nutrition-week-shift::after {
    content: none;
  }

  .nutrition-week-shift:first-child {
    justify-items: end;
  }

  .nutrition-week-shift:last-child {
    justify-items: start;
  }
}

/* Schmale Handys unter 396 px (Stand 28.09.2026, z. B. 360, 375 und 390 px): Sieben Tage und zwei Pfeile mit je 44 px
   passen nicht in eine Zeile (vorher waren die Pfeile dort 26 bis 40 px breit). Die Pfeile stehen darum mit dem Zeitraum
   der Woche in einer eigenen Zeile über den Tagen, je 44 × 44 px; die Tage teilen sich darunter die Breite innerhalb des
   Seitenrands, der nur so weit schmaler wird, dass jeder Tag mindestens 44 px behält (auch unter 360 px). Die Pille bleibt
   36 px breit: Der Innenabstand rechnet mit der Breite der Leiste. */
@media (max-width: 395.98px) {
  .nutrition-week-shell {
    grid-template-areas:
      "previous range next"
      "days days days";
    padding-inline: clamp(0px, calc(50vw - var(--control-height) * 3.5), var(--space-4));
  }

  .nutrition-week-shift:first-child {
    grid-area: previous;
    justify-items: center;
  }

  .nutrition-week-shift:last-child {
    grid-area: next;
    justify-items: center;
  }

  .nutrition-week-range {
    display: block;
    grid-area: range;
    margin: 0;
    color: var(--text-2);
    font: var(--font-weight-regular) var(--font-size-list) / 1.4 var(--font-system);
    font-variant-numeric: tabular-nums;
    text-align: center;
  }

  .nutrition-week {
    grid-area: days;
    container-type: inline-size;
  }

  .nutrition-week .nutrition-day {
    padding: 0 max(var(--space-1), calc(100cqi / 14 - (var(--control-height) - var(--space-2)) / 2));
  }
}

.hydration-sheet__body {
  display: grid;
  gap: var(--space-3);
}

.hydration-sheet__quick {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-2);
}

.hydration-sheet__quick .ui-pill {
  min-height: var(--control-height);
  color: var(--text);
  background: var(--page);
  border: 1px solid var(--border);
}

.hydration-sheet__list {
  display: grid;
  border-top: 1px solid var(--border);
}

.hydration-sheet__row {
  display: flex;
  justify-content: space-between;
  padding: var(--space-2) 0;
  color: var(--text-2);
  font: var(--font-weight-regular) var(--font-size-list) / 1.4 var(--font-system);
  border-bottom: 1px solid var(--border);
}

.hydration-sheet__row strong {
  color: var(--text);
  font-weight: var(--font-weight-medium);
}

/* Präparate: Suchart als Pillenreihe, «Suche leeren» als Textlink. */
.search-mode-switch {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
  align-items: center;
}

.search-mode-switch [data-med-search-mode] {
  min-height: var(--pill-height);
  padding: 0 var(--space-3);
  color: var(--text-2);
  font: var(--font-weight-regular) var(--font-size-list) / 1 var(--font-system);
  background: var(--page);
  border: 0;
  border-radius: var(--radius-pill);
}

.search-mode-switch [data-med-search-mode].primary {
  color: var(--card);
  background: var(--accent);
}

.search-mode-switch #labMedicationSearchClear {
  margin-left: auto;
  padding: 0 var(--space-2);
  color: var(--text-2);
  font: var(--font-weight-regular) var(--font-size-list) / 1 var(--font-system);
  background: transparent;
  border: 0;
}

/* Der Pausen-Hinweis war immer sichtbar, weil display:block das hidden-Attribut überstimmte. */
.os-scope-note[hidden] {
  display: none;
}

/* Ernährung: Seitenrand 16 px, Outline-Chevrons, Makros direkt unter den Kalorien. */
@media (max-width: 560px) {
  .nutrition-screen {
    padding: var(--space-4);
  }
}

.nutrition-screen svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.nutrition-macros {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-3);
  margin-top: var(--space-3);
}

.nutrition-macro {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}

.nutrition-macro span {
  color: var(--text-3);
  font: var(--font-weight-regular) var(--font-size-label) / 1.3 var(--font-system);
}

.nutrition-macro strong {
  color: var(--text);
  font: var(--font-weight-medium) var(--font-size-list) / 1.3 var(--font-system);
  white-space: nowrap;
}

.nutrition-goal-link {
  padding: 0;
  color: var(--accent);
  font: var(--font-weight-regular) var(--font-size-list) / 1.4 var(--font-system);
  background: transparent;
  border: 0;
  cursor: pointer;
}

/* Einträge sind Knöpfe: antippen = ändern. */
button.nutrition-item {
  width: calc(100% - var(--space-3) * 2);
  grid-template-columns: minmax(0, 1fr) auto;
  color: inherit;
  font: inherit;
  text-align: left;
  background: transparent;
  border-right: 0;
  border-bottom: 0;
  border-left: 0;
  cursor: pointer;
}

.nutrition-item__text {
  display: grid;
  min-width: 0;
}

/* Erfassungsblatt: vier Reiter (AGENTS: höchstens vier Pills), Scan-Knopf im Suchfeld. Jeder Reiter ist mindestens so
   breit wie sein Wort (vorher «Mahlzeit…» bei 320 px); die übrigen teilen sich den Rest gleichmässig. */
.nutrition-search-tabs {
  grid-template-columns: repeat(4, minmax(max-content, 1fr));
}

.nutrition-search-tabs button {
  padding: 0 var(--space-2);
  font-size: var(--font-size-list);
  white-space: nowrap;
}

.nutrition-search-tabs button.active {
  color: var(--card);
  background: var(--accent);
}

.nutrition-search-wrap .ui-input {
  padding-right: calc(var(--control-height) + var(--space-1));
}

.nutrition-search-wrap .nutrition-scan-button {
  position: absolute;
  top: 0;
  right: 0;
  display: grid;
  width: var(--control-height);
  height: var(--control-height);
  padding: 0;
  place-items: center;
  color: var(--accent);
  background: transparent;
  border: 0;
  cursor: pointer;
}

.nutrition-search-wrap .nutrition-scan-button svg {
  position: static;
}

.nutrition-search-head .ui-search-list__loading {
  margin-top: calc(var(--space-2) * -1);
}

.nutrition-online-button {
  width: 100%;
  margin: var(--space-2) 0;
}

.nutrition-result-row.selected strong {
  color: var(--text);
  font-weight: var(--font-weight-medium);
}

.nutrition-result-row.selected {
  box-shadow: inset 3px 0 0 var(--accent);
  padding-left: var(--space-2);
}

.nutrition-capture-preview,
.nutrition-capture-notice {
  margin: 0 0 var(--space-3);
  color: var(--text-2);
  font: var(--font-weight-regular) var(--font-size-label) / 1.4 var(--font-system);
}

.nutrition-capture-notice {
  color: var(--text);
}

.nutrition-capture-actions {
  display: grid;
  gap: var(--space-2);
}

.nutrition-capture-footer[hidden] {
  display: none;
}

.nutrition-meal-tools {
  margin: 0 calc(var(--space-4) * -1) var(--space-2);
}

.nutrition-template-save {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-4);
}

.nutrition-entry-form {
  display: grid;
  gap: var(--space-3);
}

/* Barcode-Kamera: Blatt mit Live-Bild und Zielrahmen. */
dialog.barcode-scanner {
  box-sizing: border-box;
  width: min(100%, 520px);
  max-width: none;
  max-height: 100dvh;
  margin: auto auto 0;
  padding: 0 0 max(var(--space-4), env(safe-area-inset-bottom));
  overflow: auto;
  color: var(--text);
  background: var(--card);
  border: 0;
  border-radius: var(--radius-sheet) var(--radius-sheet) 0 0;
}

dialog.barcode-scanner::backdrop {
  background: var(--scrim-strong);
}

.barcode-scanner__header {
  display: grid;
  grid-template-columns: var(--control-height) minmax(0, 1fr) var(--control-height);
  align-items: center;
  padding: var(--space-2) var(--space-2) var(--space-2) var(--space-4);
}

.barcode-scanner__header h2 {
  grid-column: 2;
  margin: 0;
  font: var(--font-weight-medium) var(--font-size-value) / 1.3 var(--font-system);
  text-align: center;
}

.barcode-scanner__close {
  grid-column: 3;
  display: grid;
  width: var(--control-height);
  height: var(--control-height);
  padding: 0;
  place-items: center;
  color: var(--text-2);
  background: transparent;
  border: 0;
}

.barcode-scanner__close svg {
  width: var(--icon-size);
  height: var(--icon-size);
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
}

.barcode-scanner__stage {
  position: relative;
  aspect-ratio: 4 / 3;
  margin: 0 var(--space-4);
  overflow: hidden;
  background: var(--dark-page); /* dunkel wie ein Kamerabild, auch im dunklen Erscheinungsbild (dort wäre --text hell) */
  border-radius: var(--radius-card);
}

.barcode-scanner__stage video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.barcode-scanner__frame {
  position: absolute;
  inset: 27.5% 10%;
  border: 2px solid var(--dark-text); /* hell auf dem Kamerabild, auch im dunklen Erscheinungsbild */
  border-radius: var(--radius-button);
  box-shadow: 0 0 0 100vmax var(--scrim);
}

.barcode-scanner__status {
  margin: var(--space-3) var(--space-4);
  color: var(--text-2);
  font: var(--font-weight-regular) var(--font-size-list) / 1.4 var(--font-system);
  text-align: center;
}

.barcode-scanner__manual {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-4) 0;
  border-top: 1px solid var(--border);
}

/* Baustein «zweite Aktion»: Rahmen, dunkler Text. Wurde an vielen Stellen benutzt, war aber nie gestaltet. */
.ui-secondary-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: var(--control-height);
  padding: var(--space-2) var(--space-4);
  color: var(--text);
  font: var(--font-weight-regular) var(--font-size-value) / 1.3 var(--font-system);
  text-align: center;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-button);
  cursor: pointer;
}

.ui-secondary-button:disabled {
  color: var(--text-3);
  cursor: default;
}

/* Fokusring nur bei Tastaturbedienung, nicht nach einem Tipp. */
dialog button:focus:not(:focus-visible),
.nutrition-sheet button:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}

.nutrition-results .ui-empty,
.nutrition-results .ui-empty p {
  color: var(--text-2);
  font: var(--font-weight-regular) var(--font-size-list) / 1.5 var(--font-system);
}

.nutrition-results .ui-empty {
  padding: var(--space-3) 0;
}

/* Auswertung im Blatt: kein doppelter Titel. Makro- und Mikronährstoffe stehen als Liste (css/nutrition.css) und
   blättern auch bei 320 px nicht seitlich; die frühere Tabelle war dort breiter als ihr Platz. */
#nutritionAnalysisSlot .nutrition-analysis-title,
#nutritionAnalysisSlot .nutrition-analysis-subtitle {
  display: none;
}

/* Laufendes Training: alle Übungen auf einem Screen, Sätze als kompakte Tabellenzeilen. */
.workout-screen--list {
  gap: var(--space-2);
}

.workout-screen--list .workout-progress {
  margin-bottom: var(--space-1);
}

.workout-exercise {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-3);
}

.workout-exercise__head {
  display: grid;
  gap: var(--space-1);
}

.workout-exercise__head h2 {
  margin: 0;
  color: var(--text);
  font: var(--font-weight-medium) var(--font-size-value) / 1.3 var(--font-system);
}

.workout-exercise__head small {
  color: var(--text-3);
  font-size: var(--font-size-label);
}

.workout-set-head,
.workout-screen--list .workout-set-row {
  display: grid;
  grid-template-columns: var(--space-5) minmax(0, 1fr) minmax(52px, 64px) minmax(44px, 52px) minmax(38px, 44px) var(--control-height);
  gap: var(--space-1);
  align-items: center;
}

.workout-set-head--hold,
.workout-screen--list .workout-set-row--hold {
  grid-template-columns: var(--space-5) minmax(0, 1fr) minmax(96px, 136px) var(--control-height);
}

.workout-set-head {
  color: var(--text-3);
  font-size: var(--font-size-label);
  text-align: center;
}

.workout-set-head > :nth-child(2) {
  text-align: left;
}

.workout-screen--list .workout-set-list {
  gap: var(--space-1);
}

.workout-screen--list .workout-set-row {
  padding: var(--space-1) 0;
  background: transparent;
  border: 0;
  border-radius: var(--radius-button);
}

.workout-screen--list .workout-set-row.is-complete {
  background: color-mix(in srgb, var(--accent-light) 40%, var(--card));
}

.workout-set-row__index {
  color: var(--text-2);
  font-size: var(--font-size-list);
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.workout-set-row__previous {
  overflow: hidden;
  color: var(--text-3);
  font-size: var(--font-size-label);
  white-space: nowrap;
  text-overflow: ellipsis;
  font-variant-numeric: tabular-nums;
}

.workout-set-input {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  height: 36px;
  padding: 0 var(--space-1);
  color: var(--text);
  font: var(--font-weight-medium) var(--font-size-value) / 1 var(--font-system);
  text-align: center;
  font-variant-numeric: tabular-nums;
}

.workout-set-input::placeholder {
  color: var(--text-3);
  font-weight: var(--font-weight-regular);
}

.workout-set-check {
  position: relative;
  display: grid;
  width: var(--control-height);
  height: var(--control-height);
  place-items: center;
  cursor: pointer;
}

.workout-set-check input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

.workout-set-check span {
  display: grid;
  width: 32px;
  height: 32px;
  color: var(--text-3);
  background: var(--page);
  border: 1px solid var(--border);
  border-radius: var(--radius-button);
  place-items: center;
}

.workout-set-check span .bo-icon {
  width: 18px;
  height: 18px;
}

.workout-set-check input:checked + span {
  color: var(--card);
  background: var(--accent);
  border-color: var(--accent);
}

.workout-set-check input:focus-visible + span {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.workout-set-error {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--error-color);
  font-size: var(--font-size-error);
}

/* «+ Satz» im laufenden Training: Tippfläche 44 px wie jeder Knopf (DESIGN-SYSTEM). */
.workout-add-set {
  min-height: var(--control-height);
  color: var(--text-2);
  background: var(--page);
  border: 0;
  border-radius: var(--radius-button);
  font: var(--font-weight-regular) var(--font-size-list) / 1 var(--font-system);
}

.workout-screen--list .workout-finish {
  margin-top: var(--space-2);
}

.workout-rest-timer small {
  color: var(--text-3);
  font-size: var(--font-size-label);
}

.workout-rest-timer.is-over strong {
  color: var(--accent);
}

/* Abschluss: Rekord-Hinweis und Vergleich zum letzten Mal. */
.workout-complete-row {
  display: flex;
  gap: var(--space-2);
  align-items: center;
  justify-content: space-between;
}

.workout-complete-row small {
  display: block;
  color: var(--text-2);
  font-size: var(--font-size-label);
}

.workout-record {
  flex: none;
  padding: var(--space-1) var(--space-2);
  color: var(--accent);
  border: 1px solid var(--accent-light);
  border-radius: var(--radius-pill);
  font-size: var(--font-size-label);
}

.training-kpi__delta {
  display: block;
  margin-top: var(--space-1);
  color: var(--accent);
  font-size: var(--font-size-label);
}

.training-empty {
  display: grid;
  gap: var(--space-2);
}

.training-template-list {
  display: grid;
}

.training-template-row small {
  display: block;
  color: var(--text-3);
  font-size: var(--font-size-label);
}

/* Plan-Editor: Karten je Übung, Satztabelle, Geräte-Details eingeklappt. */
#training-plan-editor .training-editor .plan-editor {
  padding: 0;
  background: transparent;
  border: 0;
}

#training-plan-editor .training-editor .plan-editor__basics {
  display: grid;
  gap: var(--space-3);
  padding: var(--space-3);
}

#training-plan-editor .training-editor .plan-editor .exercise-card {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-3);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
}

#training-plan-editor .training-editor .exercise-card__head {
  display: grid;
  grid-template-columns: var(--space-5) minmax(0, 1fr) var(--control-height);
  gap: var(--space-2);
  align-items: center;
}

#training-plan-editor .training-editor .exercise-card__head .exercise-index {
  display: block;
  color: var(--text-3);
  font-size: var(--font-size-list);
  text-align: center;
}

#training-plan-editor .training-editor .exercise-card__remove,
#training-plan-editor .training-editor .planned-set-remove {
  display: grid;
  width: var(--control-height);
  height: var(--control-height);
  min-height: 0;
  padding: 0;
  color: var(--text-3);
  background: transparent;
  border: 0;
  place-items: center;
}

#training-plan-editor .training-editor .exercise-card__remove .bo-icon,
#training-plan-editor .training-editor .planned-set-remove .bo-icon {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#training-plan-editor .training-editor .planned-set-remove:disabled {
  visibility: hidden;
}

#training-plan-editor .training-editor .plan-editor .planned-set-head,
#training-plan-editor .training-editor .plan-editor .planned-set-row {
  grid-template-columns: var(--space-5) repeat(3, minmax(0, 1fr)) var(--control-height);
}

#training-plan-editor .training-editor .plan-editor .planned-set-head {
  color: var(--text-3);
  text-align: center;
}

#training-plan-editor .training-editor .plan-editor .planned-set-head > :last-child {
  display: block;
}

#training-plan-editor .training-editor .planned-set-number {
  color: var(--text-2);
  font-size: var(--font-size-list);
  text-align: center;
}

#training-plan-editor .training-editor .planned-set-row input {
  padding: 0 var(--space-1);
  text-align: center;
}

#training-plan-editor .training-editor .add-set-btn,
#training-plan-editor .training-editor .plan-text-button {
  justify-self: start;
  min-height: var(--control-height);
  padding: 0 var(--space-2);
  color: var(--text-2);
  background: transparent;
  border: 0;
  font: var(--font-weight-regular) var(--font-size-list) / 1 var(--font-system);
}

#training-plan-editor .training-editor .exercise-details {
  border-top: 1px solid var(--border);
  padding-top: var(--space-2);
}

#training-plan-editor .training-editor .exercise-details > summary {
  min-height: 36px;
  color: var(--text-2);
  font-size: var(--font-size-list);
  line-height: 36px;
  list-style: none;
  cursor: pointer;
}

#training-plan-editor .training-editor .exercise-details > summary::-webkit-details-marker {
  display: none;
}

#training-plan-editor .training-editor .exercise-details[open] {
  display: grid;
  gap: var(--space-2);
}

#training-plan-editor .training-editor .plan-editor .machine-card {
  padding: 0;
  background: transparent;
  border: 0;
}

#training-plan-editor .training-editor .plan-editor .plan-actions {
  position: sticky;
  z-index: 5;
  bottom: var(--tab-bar-clearance);
  display: block;
  padding: var(--space-2) 0;
  background: var(--page);
}

#training-plan-editor .training-editor .plan-editor .plan-actions .ui-primary-button {
  width: 100%;
}

#training-plan-editor .training-editor .plan-delete-link {
  justify-self: center;
  min-height: var(--control-height);
  color: var(--error-color);
  background: transparent;
  border: 0;
  font: var(--font-weight-regular) var(--font-size-list) / 1 var(--font-system);
}

#training-plan-editor .training-editor .plan-editor__hint {
  margin: 0;
  color: var(--text-2);
  font-size: var(--font-size-list);
}

#training-plan-editor .training-editor .training-subheader button {
  background: transparent;
  border: 0;
}

#training-plan-editor .training-editor .exercise-card .training-exercise-picker {
  margin: 0;
  background: var(--page);
  border: 0;
  border-radius: var(--radius-button);
}

#training-plan-editor .training-editor .exercise-card .training-exercise-picker > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 36px;
  padding: 0 var(--space-3);
  color: var(--text-2);
  font-size: var(--font-size-list);
}

#training-plan-editor .training-editor .exercise-change-label {
  color: var(--text-3);
  font-size: var(--font-size-list);
}

#training-plan-editor .training-editor .sport-exercise-picker .training-exercise-picker > summary {
  font: var(--font-weight-medium) var(--font-size-value) / 1.4 var(--font-system);
}

.workout-complete-row strong,
.training-template-row strong,
.workout-exercise strong {
  font-weight: var(--font-weight-medium);
}

/* Body · Fortschritt: Gewicht in zwei Tipps, Kennzahlen als 2×2-Raster. */
.body-progress-actions {
  display: grid;
  gap: var(--space-2);
}

@media (max-width: 760px) {
  #body .body-overview-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

#body .body-overview-grid .ui-metric-tile small {
  overflow-wrap: anywhere;
}

.body-text-link {
  justify-self: center;
  min-height: var(--control-height);
  padding: 0 var(--space-3);
  color: var(--text-2);
  background: transparent;
  border: 0;
  font: var(--font-weight-regular) var(--font-size-list) / 1 var(--font-system);
}

.body-weight-sheet__body {
  display: grid;
  gap: var(--space-3);
}

.body-weight-sheet__last {
  margin: 0;
  color: var(--text-3);
  font-size: var(--font-size-label);
}

/* Feld mit Einheit: nur der äussere Rahmen zeigt den Fokus, kein zweiter Kasten innen. */
body .ui-field__control > input:focus-visible {
  outline: 0 !important;
}

/* Fortschritt: Zeitraum-Pills unter der Überschrift statt daneben gequetscht. */
@media (max-width: 760px) {
  #body .body-progress-card .body-card-head {
    display: grid;
    gap: var(--space-2);
  }
}

/* Body · Insights: Vergleichszeile vorher ↔ jetzt, Kacheln als Knöpfe. */
.body-compare {
  display: grid;
  gap: var(--space-3);
  padding: var(--space-3);
}

.body-compare__head {
  display: flex;
  justify-content: space-between;
  color: var(--text-3);
  font-size: var(--font-size-label);
}

.body-compare-row {
  display: grid;
  grid-template-columns: minmax(56px, auto) minmax(0, 1fr) minmax(56px, auto);
  gap: var(--space-1) var(--space-2);
  align-items: center;
}

.body-compare-row__name {
  grid-column: 1 / -1;
  color: var(--text);
  font-size: var(--font-size-list);
}

.body-compare-row__value {
  color: var(--text-2);
  font-size: var(--font-size-list);
  font-variant-numeric: tabular-nums;
}

.body-compare-row__value--now {
  color: var(--text);
  font-weight: var(--font-weight-medium);
  text-align: right;
}

.body-compare-row__bars {
  display: grid;
  gap: 2px;
}

.body-compare-bar {
  height: var(--progress-height-small);
}

.body-compare-bar--before .ui-progress__fill {
  background: var(--accent-light);
}

.body-compare-row__change {
  grid-column: 1 / -1;
  color: var(--accent);
  font-size: var(--font-size-label);
  text-align: right;
}

button.body-compare-row {
  width: 100%;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.body-compare-row__name {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.body-compare-row__name svg {
  width: 16px;
  height: 16px;
  color: var(--text-3);
}

button.body-insight-card {
  width: 100%;
  text-align: left;
  cursor: pointer;
  font: inherit;
}

@media (max-width: 760px) {
  #body .body-insight-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.body-compare-bar,
.body-compare-bar .ui-progress__fill {
  display: block;
}

.body-compare-row__change.is-empty {
  color: var(--text-3);
}

/* Infos und Quellen: Menüliste mit aufklappbaren Einträgen. */
#info .info-group {
  margin: var(--space-5) 0 var(--space-2);
  color: var(--text-3);
  font: var(--font-weight-regular) var(--font-size-section) / 1.4 var(--font-system);
}

#info .info-list {
  display: grid;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
}

#info .info-item + .info-item,
#info .info-link + .info-link {
  border-top: 1px solid var(--border);
}

/* Zweizeilige Titel («GLP-1: Protein je kg und Krafttrainings» bei 320 px) behalten oben und unten Abstand. */
#info .info-item > summary,
#info .info-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  min-height: var(--control-height);
  padding: var(--space-2) var(--space-3);
  color: var(--text);
  font: var(--font-weight-regular) var(--font-size-value) / 1.4 var(--font-system);
  text-decoration: none;
  list-style: none;
  cursor: pointer;
}

#info .info-item > summary::-webkit-details-marker {
  display: none;
}

#info .info-item > summary::after,
#info .info-link::after {
  flex: none;
  content: "";
  width: var(--space-2);
  height: var(--space-2);
  border-right: 1.5px solid var(--text-3);
  border-bottom: 1.5px solid var(--text-3);
  transform: rotate(-45deg);
}

#info .info-item[open] > summary::after {
  transform: rotate(45deg);
}

#info .info-item p {
  margin: 0;
  padding: 0 var(--space-3) var(--space-3);
  color: var(--text-2);
  font: var(--font-weight-regular) var(--font-size-list) / 1.5 var(--font-system);
}

#info .info-item a {
  color: var(--text);
}

/* Hinweis «nur auf Deutsch» unter einem Eintrag: gleicher Einzug wie der Text darüber, nicht am Rahmen. */
#info .info-item > .i18n-german-only {
  margin: 0;
  padding: 0 var(--space-3) var(--space-3);
}

#info .info-note {
  margin: var(--space-4) 0 0;
  color: var(--text-3);
  font: var(--font-weight-regular) var(--font-size-label) / 1.5 var(--font-system);
}

/* Mengenformular erscheint erst nach der Auswahl eines Lebensmittels. */
.nutrition-capture-form[hidden],
.nutrition-capture-footer[hidden],
#nutritionCaptureSubmit[hidden] {
  display: none;
}

/* Erfassungsblatt: Kopf fest, Liste scrollt, Mengenformular schliesst bündig am unteren Rand ab. */
dialog#nutritionSheet[open] {
  display: flex;
  flex-direction: column;
}

#nutritionSheet .nutrition-sheet__body {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
}

#nutritionSheet .nutrition-sheet__body.no-pad {
  padding-bottom: 0;
}

#nutritionSheet .nutrition-capture-footer {
  padding-bottom: calc(var(--space-3) + env(safe-area-inset-bottom, 0px));
}

/* Profil und Einstellungen: Der feste Speichern-Knopf verdeckt nie das Feld, in dem man gerade tippt. */
#profileForm input,
#profileForm select,
#profileForm textarea,
#settingsFields input,
#settingsFields select,
#settingsFields textarea {
  scroll-margin-bottom: calc(var(--control-height) * 2 + var(--space-5) * 3);
}

.settings-actions {
  bottom: var(--tab-bar-clearance);
  border-top: 1px solid var(--border);
}

/* Today: Laborwerte-Karte; Einnahmen von heute (Today und Supplements) als Liste zum Abhaken. */
.today-lab-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: var(--space-3);
  align-items: center;
  width: 100%;
  text-align: left;
  cursor: pointer;
}

.today-lab-card > span {
  display: grid;
  gap: var(--space-1);
  min-width: 0;
}

.today-lab-card small {
  color: var(--text-3);
  font: var(--font-weight-regular) var(--font-size-label) / 1.4 var(--font-system);
}

.today-lab-card strong {
  color: var(--text);
  font: var(--font-weight-medium) var(--font-size-value) / 1.3 var(--font-system);
}

.today-routine {
  display: grid;
  gap: 0;
}

.today-routine header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding-bottom: var(--space-2);
}

.today-routine h2,
.today-routine h3 {
  margin: 0;
  color: var(--text-3);
  font: var(--font-weight-regular) var(--font-size-label) / 1.4 var(--font-system);
}

.today-routine header span {
  color: var(--text-2);
  font: var(--font-weight-medium) var(--font-size-list) / 1 var(--font-system);
  font-variant-numeric: tabular-nums;
}

/* Innenabstand oben und unten: Bei einem zweizeiligen Namen stand die Menge sonst direkt auf der Trennlinie darunter. */
.today-routine__row {
  display: grid;
  grid-template-columns: var(--control-height) minmax(0, 1fr);
  align-items: center;
  min-height: var(--control-height);
  padding-block: var(--space-1);
  border-top: 1px solid var(--border);
  cursor: pointer;
}

.today-routine__row input {
  width: 20px;
  height: 20px;
  margin: 0;
  accent-color: var(--accent);
}

.today-routine__row span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.today-routine__row strong {
  color: var(--text);
  font: var(--font-weight-regular) var(--font-size-list) / 1.3 var(--font-system);
}

.today-routine__row small {
  color: var(--text-3);
  font-size: var(--font-size-label);
  line-height: 1.4;
}

.today-routine__row.is-done strong {
  color: var(--text-2);
}

/* Übungsdetail: Unterscreen im Training, Verlauf als Linie in Bordeaux. */
#exercise-detail {
  box-sizing: border-box;
  width: min(100%, 560px);
  min-height: 100dvh;
  margin: 0 auto;
  padding: var(--space-4) var(--space-4) calc(var(--space-5) * 4 + env(safe-area-inset-bottom));
  color: var(--text);
  background: var(--page);
  font-family: var(--font-system);
}

.exercise-detail-meta {
  margin: 0;
  color: var(--text-2);
  font: var(--font-weight-regular) var(--font-size-list) / 1.4 var(--font-system);
  text-align: center;
}

.exercise-detail-chart,
.exercise-detail-history {
  display: grid;
  gap: var(--space-2);
}

.exercise-detail-chart h2,
.exercise-detail-history h2 {
  margin: 0;
  color: var(--text-3);
  font: var(--font-weight-regular) var(--font-size-section) / 1.4 var(--font-system);
}

.exercise-detail-chart svg {
  width: 100%;
  height: 96px;
  overflow: visible;
}

.exercise-detail-chart polyline {
  fill: none;
  stroke: var(--accent);
  stroke-width: 2px;
  vector-effect: non-scaling-stroke;
  stroke-linejoin: round;
  stroke-linecap: round;
}

.exercise-detail-chart p {
  margin: 0;
  color: var(--text-3);
  font-size: var(--font-size-label);
}

.exercise-detail-history .ui-list-row span {
  display: grid;
  gap: 2px;
}

.exercise-detail-history .ui-list-row strong {
  color: var(--text);
  font: var(--font-weight-regular) var(--font-size-list) / 1.4 var(--font-system);
}

.exercise-detail-history .ui-list-row small {
  color: var(--text-3);
  font-size: var(--font-size-label);
}

/* Trainingsübersicht: Plan bearbeiten als eigene Zeile; Verlauf: Filter mit sichtbarer Beschriftung. */
.training-edit-link {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: var(--space-3);
  align-items: center;
  min-height: var(--control-height);
  padding: 0 var(--space-3);
  color: var(--text-2);
  background: transparent;
  border: 0;
  font: var(--font-weight-regular) var(--font-size-list) / 1 var(--font-system);
  text-align: left;
  cursor: pointer;
}

.training-history-filters .ui-field {
  min-width: 0;
}

.training-progress-open {
  justify-self: start;
  width: auto;
  min-height: 36px;
  padding: 0;
  color: var(--text);
  background: transparent;
  border: 0;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Laufendes Training: Übung hinzufügen, Pausenleiste erst nach dem ersten Satz. */
.workout-rest-timer[hidden] {
  display: none;
}

.workout-add-exercise {
  min-height: var(--control-height);
  color: var(--text);
  background: var(--card);
  border: 1px dashed var(--border);
  border-radius: var(--radius-button);
  font: var(--font-weight-regular) var(--font-size-list) / 1.3 var(--font-system);
  cursor: pointer;
}

.workout-picker__body {
  display: grid;
  gap: var(--space-2);
}

.workout-picker__list {
  display: grid;
  max-height: 55dvh;
  overflow-y: auto;
}

.workout-picker__row {
  display: grid;
  gap: 2px;
  min-height: var(--control-height);
  padding: var(--space-2) 0;
  color: var(--text);
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--border);
  text-align: left;
  cursor: pointer;
}

.workout-picker__row strong {
  font: var(--font-weight-regular) var(--font-size-list) / 1.4 var(--font-system);
}

.workout-picker__row small,
.workout-picker__empty {
  margin: 0;
  color: var(--text-3);
  font-size: var(--font-size-label);
}

/* Regeneration erscheint auf Today nur mit Wert; der Schlaf nimmt dann die ganze Breite. */
.today-pair-grid > :only-child {
  grid-column: 1 / -1;
}

/* Labor: kleines Verlaufsdiagramm beim Antippen eines Werts. */
.lab-trend-chart {
  margin: 0 0 var(--space-3);
}

.lab-trend-chart svg {
  display: block;
  width: 100%;
  height: auto;
}

.lab-trend-chart__band {
  fill: var(--accent-light);
  opacity: 0.45;
}

.lab-trend-chart__line {
  fill: none;
  stroke: var(--accent);
  stroke-width: 2;
  stroke-linejoin: round;
  stroke-linecap: round;
}

.lab-trend-chart__dot {
  fill: var(--accent);
  stroke: var(--accent);
  stroke-width: 2;
}

/* Wert aus anderem Labor oder mit anderer Methode als der letzte: hohler Punkt, nicht verbunden. */
.lab-trend-chart__dot--other,
.lab-trend-chart__key-dot {
  fill: var(--card);
  stroke: var(--accent);
  stroke-width: 1.5;
}

.lab-trend-chart__legend {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1) var(--space-3);
  margin: var(--space-1) 0 0;
  color: var(--text-3);
  font-size: var(--font-size-label);
}

.lab-trend-chart__key {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
}

.lab-trend-chart .lab-trend-chart__key svg {
  width: 10px;
  height: 10px;
  flex: none;
}

.lab-trend-chart figcaption {
  display: flex;
  justify-content: space-between;
  gap: var(--space-2);
  color: var(--text-3);
  font-size: var(--font-size-label);
}

/* Übungsdetail: Umschaltung der Kennzahl im Diagramm. */
.exercise-detail-metrics {
  margin-bottom: var(--space-3);
}

.exercise-detail-chart h2 strong {
  float: right;
  color: var(--text);
  font-weight: var(--font-weight-medium);
}

/* Insights: Kalorien je Woche, Einnahme dunkel, geschätzter Verbrauch hell, beide halbdurchsichtig übereinander. */
.body-kcal {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-3);
  margin-bottom: var(--space-2);
}

.body-kcal__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-2);
}

.body-kcal__head h2 {
  margin: 0;
  color: var(--text);
  font-size: var(--font-size-value);
  font-weight: var(--font-weight-medium);
}

.body-kcal__head span,
.body-kcal__legend,
.body-kcal__hint {
  margin: 0;
  color: var(--text-3);
  font-size: var(--font-size-label);
}

.body-kcal-chart {
  display: block;
  width: 100%;
  height: auto;
}

.body-kcal-chart__area--intake {
  fill: var(--accent);
  opacity: 0.18;
}

.body-kcal-chart__area--burn {
  fill: var(--accent-light);
  opacity: 0.6;
}

.body-kcal-chart__line {
  fill: none;
  stroke-width: 2;
  stroke-linejoin: round;
  stroke-linecap: round;
}

.body-kcal-chart__line--intake {
  stroke: var(--accent);
}

.body-kcal-chart__line--burn {
  stroke: var(--accent-mid);
}

.body-kcal-chart__dot {
  fill: var(--card);
  stroke-width: 2;
}

.body-kcal-chart__dot--intake {
  stroke: var(--accent);
}

.body-kcal-chart__dot--burn {
  stroke: var(--accent-mid);
}

.body-kcal__weeks {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
}

.body-kcal__weeks button {
  min-height: var(--control-height);
  padding: 0;
  color: var(--text-2);
  font: var(--font-weight-regular) var(--font-size-label) / 1.2 var(--font-system);
  background: none;
  border: 0;
  cursor: pointer;
}

.body-kcal__weeks button:disabled {
  color: var(--text-3);
  cursor: default;
}

.body-kcal__legend {
  display: flex;
  align-items: center;
  gap: var(--space-1);
}

.body-kcal__key {
  display: inline-block;
  width: var(--space-3);
  height: 3px;
  border-radius: 3px;
}

.body-kcal__key--intake {
  background: var(--accent);
}

.body-kcal__key--burn {
  margin-left: var(--space-2);
  background: var(--accent-mid);
}

.body-week-sheet__body {
  display: grid;
}

.body-week-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  min-height: var(--control-height);
  padding: var(--space-2) 0;
  border-top: 1px solid var(--border);
  font-size: var(--font-size-list);
}

.body-week-row:first-child {
  border-top: 0;
}

.body-week-row[hidden] {
  display: none;
}

.body-week-row span {
  display: grid;
  gap: 2px;
  color: var(--text);
}

.body-week-row small {
  color: var(--text-3);
  font-size: var(--font-size-label);
}

.body-week-row strong {
  flex: none;
  color: var(--text);
  font-weight: var(--font-weight-medium);
  text-align: right;
}

#info .info-sources {
  margin: 0;
  padding: 0 var(--space-3) var(--space-3) calc(var(--space-3) + var(--space-4));
  color: var(--text-2);
  font: var(--font-weight-regular) var(--font-size-list) / 1.5 var(--font-system);
}

/* Feste Speichern-Füsse: .main hält unten schon Platz für die Tab-Leiste frei, deshalb sitzen sie bei 0 direkt darüber
   (vorher doppelter Abstand, dazwischen schoben sich Formularteile durch). */
.ui-shell-enabled #profile .profile-actions,
.ui-shell-enabled .settings-actions,
#training-plan-editor .training-editor .plan-editor .plan-actions {
  bottom: 0;
}

.today-weight-card__trend {
  grid-row: 2;
  grid-column: 1;
  color: var(--text-3);
  font-size: var(--font-size-label);
}

/* Apple-Health-Datenquellen erst mit nativer App zeigen (funktionslose Einträge werden nicht angezeigt). */
#settings details[data-no-native-app],
#profile details[data-no-native-app] {
  display: none;
}

/* Präparate: 8px zwischen Pillenreihe und Karte. */
#medications .ui-pill-row {
  margin-bottom: var(--space-2);
}

/* Paket D-b2: Schutzhinweise, Kalorien ausblenden, Plausibilitäts-Rückfrage, Muskelkarten-Regel. */
.settings-check {
  display: flex;
  gap: var(--space-3);
  align-items: flex-start;
  min-height: 44px;
  padding: var(--space-2) 0;
  cursor: pointer;
}
.settings-check input {
  flex: none;
  width: 20px;
  height: 20px;
  margin-top: 2px;
  accent-color: var(--accent);
}
.settings-check span {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}
.settings-check strong {
  font-weight: 500;
  color: var(--text);
}
.settings-check small {
  font-size: 12px;
  color: var(--text-2);
}
.nutrition-support-notice {
  margin-top: var(--space-3);
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--card);
  color: var(--text-2);
  font-size: 13px;
  line-height: 1.45;
}
.nutrition-support-notice p {
  margin: 0 0 var(--space-2);
}
.nutrition-support-notice a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--accent);
}
.nutrition-support-notice__close {
  min-height: 44px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--accent);
  font: inherit;
  font-weight: 500;
  cursor: pointer;
}
.malna-hide-kcal .nutrition-result-value {
  visibility: hidden;
}
.workout-set-confirm {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-top: var(--space-2);
}
.workout-set-confirm button {
  min-height: 44px;
}
.mm-load-legend {
  flex-wrap: wrap;
}
.mm-load-legend .mm-load-rule {
  flex-basis: 100%;
}
