/* ---------- Logo: Kochmütze statt der drei Punkte (Seitenleiste, Anmeldung, geteilte Rezepte) ---------- */
.nav-brand .dots, .brand .dots, .pub-bar .brand .dots {
  width: 32px; height: 32px; padding: 0; border-radius: 9px; flex: none;
  background: url(/logo.svg) center / cover no-repeat;
}
.nav-brand .dots i, .brand .dots i { display: none; }

/* Abgleich-Punkt oben rechts: nicht bei jedem kurzen Abgleich aufblinken (z. B. direkt nach dem Aktualisieren),
   erst wenn es länger als 2 Sekunden dauert. Offline/Fehler bleiben sofort sichtbar. */
.sync.busy { background: transparent; animation: sync-zeigen 0s linear 2s forwards, pulse 1s ease 2s infinite; }
@keyframes sync-zeigen { to { background: var(--accent-ink); } }

/* Rezepte-Startseite: „Kategorien“ links, Knöpfe rechts in derselben Zeile, Hinweis darunter (feinschliff.js) */
.toolbar.kt-head { margin-bottom: 2px; }
.toolbar.kt-head .kt-actions { margin: 0 0 0 auto; }
#tiles > .kt-tip { display: block; margin: 0 0 12px; }
@media (max-width: 699px) {
  .toolbar.kt-head .kt-actions { order: -1; width: 100%; margin: 0 0 16px; }
}

/* iPad/iPhone: kein Gummiband-Federn der ganzen App mehr – gescrollt wird nur, wenn es mehr Inhalt gibt.
   Blätter und waagerechte Reihen geben das Ziehen nicht an die Seite dahinter weiter. */
html, body { overscroll-behavior: none; }
.sheet, .scroller { overscroll-behavior: contain; }
/* Die unsichtbare Symbol-Sammlung unten in index.html machte die Seite 20 px länger (Anmeldung am iPad ließ sich schieben) */
body > svg { top: 0; left: 0; width: 0; height: 0; overflow: hidden; }
/* Safari zählt bei 100vh die Adressleiste mit – die Seite war genau um die Leiste zu hoch und ließ sich schieben.
   100dvh ist die wirklich sichtbare Höhe. */
@supports (height: 100dvh) {
  .book, .page, .auth { min-height: 100dvh; }
  @media (min-width: 900px) {
    .book { min-height: auto; }
    .page, body.out .page, .auth { min-height: calc(100dvh - 56px); }
  }
}

/* Hinweis „Als App aufs iPad/Handy“ unten (feinschliff.js); über der Leiste, auf der Anmeldung ganz unten */
.app-tipp {
  position: fixed; left: 50%; transform: translateX(-50%); z-index: 59;
  bottom: calc(var(--nav-h, 66px) + 16px + env(safe-area-inset-bottom));
  width: max-content; max-width: calc(100% - 32px); box-sizing: border-box;
  display: flex; align-items: center; gap: 10px; padding: 8px 8px 8px 10px; border-radius: 18px;
  background: var(--card, #fff); border: 1px solid var(--line); box-shadow: var(--shadow); font-size: 14px; line-height: 1.4;
}
body.out .app-tipp { bottom: calc(16px + env(safe-area-inset-bottom)); }
.app-tipp svg { width: 16px; height: 16px; vertical-align: -3px; }
.app-tipp .at-ic { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--tint); color: var(--accent-ink); }
.app-tipp .at-ic svg { width: 18px; height: 18px; }
.app-tipp .btn { flex: none; min-height: 38px; }
.app-tipp .icon-btn { flex: none; }
@media (min-width: 900px) { .app-tipp { bottom: 24px; } }

/* „Was ist neu?“ nach einem Update (feinschliff.js) */
.neu-liste { margin: 4px 0 14px; padding-left: 20px; line-height: 1.5; }
.neu-liste li + li { margin-top: 6px; }

/* Einstellungen ganz unten: App-Version und „Nach Updates suchen“ (feinschliff.js) */
.app-version { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 14px; margin: 18px 0 8px; color: var(--muted); font-size: 14px; text-align: center; }
.app-version > span { width: 100%; }
.app-version .btn svg { width: 16px; height: 16px; }
.app-version .panel { width: 100%; margin: 6px 0 0; text-align: left; color: var(--ink, inherit); font-size: 15px; }
.app-version .panel h3 { margin-top: 0; }
.app-version .neu-liste { margin-bottom: 0; }