/* ============================================
   FAMILIE WEBSITE - GLOBALES DESIGN SYSTEM
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,600;0,9..144,800;1,9..144,400&family=Inter:wght@300;400;500;600;700&display=swap');

:root {
  /* Farben - Grün mit Holz-Akzenten */
  --green-deep: #1f3a2e;
  --green-primary: #2d5a3d;
  --green-medium: #4a7c59;
  --green-soft: #8ab894;
  --green-mint: #c5e0cc;
  --green-pale: #e8f2ea;

  --wood-dark: #6b4423;
  --wood-medium: #a0703d;
  --wood-light: #d4a574;
  --wood-cream: #f5ebdc;

  --bg-base: #faf7f2;
  --bg-card: #ffffff;
  --bg-dark: #1f2a24;

  --text-dark: #1f2a24;
  --text-medium: #4a5a50;
  --text-light: #7a8a80;
  --text-white: #faf7f2;

  --accent-teal: #5ab5a8;
  --accent-warning: #d4896b;
  --accent-danger: #c05555;

  /* Schatten */
  --shadow-sm: 0 2px 8px rgba(31, 42, 36, 0.06);
  --shadow-md: 0 8px 24px rgba(31, 42, 36, 0.1);
  --shadow-lg: 0 20px 50px rgba(31, 42, 36, 0.15);

  /* Radius */
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;

  /* Fonts */
  --font-display: 'Fraunces', Georgia, serif;
  --font-body: 'Inter', system-ui, sans-serif;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-body);
  background: var(--bg-base);
  color: var(--text-dark);
  line-height: 1.6;
  min-height: 100vh;
  overflow-x: hidden;
}

/* Hintergrund-Textur */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image:
    radial-gradient(circle at 20% 10%, rgba(138, 184, 148, 0.08), transparent 40%),
    radial-gradient(circle at 80% 80%, rgba(212, 165, 116, 0.08), transparent 40%);
  pointer-events: none;
  z-index: -1;
}

/* Typografie */
h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 600;
  color: var(--text-dark);
  letter-spacing: -0.02em;
  line-height: 1.2;
}

h1 { font-size: clamp(2rem, 5vw, 3.5rem); }
h2 { font-size: clamp(1.5rem, 3vw, 2.25rem); }
h3 { font-size: clamp(1.2rem, 2vw, 1.5rem); }

.display-font {
  font-family: var(--font-display);
  font-style: italic;
}

/* Layout */
.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

.page-wrapper {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.main-content {
  flex: 1;
  padding: 2rem 0 4rem;
}

/* Navigation */
.navbar {
  background: var(--bg-card);
  border-bottom: 1px solid var(--green-pale);
  padding: 1rem 0;
  position: sticky;
  top: 0;
  z-index: 100;
  box-shadow: var(--shadow-sm);
}

.navbar-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}

.navbar-brand {
  font-family: var(--font-display);
  color: var(--green-deep);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  min-width: 0;
}

.navbar-brand-logo {
  width: 54px;
  height: 54px;
  flex: 0 0 54px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.navbar-brand-logo svg {
  width: 100%;
  height: 100%;
  display: block;
}

.navbar-brand-wordmark {
  display: inline-flex;
  align-items: baseline;
  gap: 0.45rem;
  min-width: 0;
}

.navbar-brand-main {
  color: var(--green-deep);
  font-style: normal;
  font-weight: 800;
  font-size: clamp(1.95rem, 4vw, 2.55rem);
  line-height: 0.95;
}

.navbar-brand-accent {
  color: var(--green-medium);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.8rem, 3.6vw, 2.35rem);
  line-height: 0.95;
}

.nav-user-name {
  font-weight: 600;
  font-size: 0.92rem;
}

.nav-user-subtitle {
  color: var(--text-light);
  font-size: 0.75rem;
}

.nav-links {
  display: flex;
  gap: 0.25rem;
  list-style: none;
  flex-wrap: wrap;
}

.nav-links a {
  color: var(--text-medium);
  text-decoration: none;
  padding: 0.5rem 1rem;
  border-radius: var(--radius-sm);
  font-weight: 500;
  font-size: 0.95rem;
  transition: all 0.2s;
}

.nav-links a:hover,
.nav-links a.active {
  background: var(--green-pale);
  color: var(--green-deep);
}

.nav-links a.active {
  border: 1px solid rgba(74, 124, 89, 0.45);
  box-shadow: inset 0 0 0 1px rgba(74, 124, 89, 0.18), var(--shadow-sm);
  font-weight: 700;
}

.nav-user {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 0.9rem;
}

.nav-user-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--green-medium), var(--green-soft));
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
}

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  border: none;
  border-radius: var(--radius-sm);
  font-family: var(--font-body);
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  text-decoration: none;
}

.btn-primary {
  background: var(--green-deep);
  color: white;
}

.btn-primary:hover {
  background: var(--green-primary);
  transform: translateY(-1px);
  box-shadow: var(--shadow-md);
}

.btn-secondary {
  background: var(--green-pale);
  color: var(--green-deep);
}

.btn-secondary:hover {
  background: var(--green-mint);
}

.btn-outline {
  background: transparent;
  color: var(--green-deep);
  border: 1.5px solid var(--green-medium);
}

.btn-outline:hover {
  background: var(--green-pale);
}

.btn-danger {
  background: var(--accent-danger);
  color: white;
}

.btn-danger:hover {
  background: #a03333;
}

.btn-sm {
  padding: 0.5rem 1rem;
  font-size: 0.85rem;
}

.btn-block {
  width: 100%;
}

/* Cards */
.card {
  background: var(--bg-card);
  border-radius: var(--radius-md);
  padding: 1.5rem;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--green-pale);
  transition: all 0.2s;
}

.card:hover {
  box-shadow: var(--shadow-md);
}

/* Form Elemente */
.form-group {
  margin-bottom: 1.25rem;
}

.form-group label {
  display: block;
  font-weight: 500;
  font-size: 0.9rem;
  color: var(--text-medium);
  margin-bottom: 0.4rem;
}

.form-control {
  width: 100%;
  padding: 0.75rem 1rem;
  border: 1.5px solid var(--green-pale);
  border-radius: var(--radius-sm);
  font-family: var(--font-body);
  font-size: 1rem;
  background: var(--bg-card);
  color: var(--text-dark);
  transition: all 0.2s;
}

.form-control:focus {
  outline: none;
  border-color: var(--green-medium);
  box-shadow: 0 0 0 3px rgba(74, 124, 89, 0.15);
}

textarea.form-control {
  resize: vertical;
  min-height: 100px;
  font-family: var(--font-body);
}

/* Alerts */
.alert {
  padding: 0.85rem 1rem;
  border-radius: 14px;
  margin-bottom: 0.85rem;
  font-size: 0.92rem;
  box-shadow: var(--shadow-md);
}

.toast-root {
  position: fixed;
  left: 50%;
  bottom: max(18px, env(safe-area-inset-bottom, 0px) + 10px);
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.65rem;
  width: min(92vw, 520px);
  z-index: 9999;
  pointer-events: none;
}

.toast-root .alert {
  width: fit-content;
  max-width: 100%;
  min-width: min(340px, 92vw);
  margin-bottom: 0;
  pointer-events: auto;
  text-align: center;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.page-alerts-top {
  margin: 0 0 1rem;
}

.page-alerts-top .alert {
  margin-bottom: 0.85rem;
}

.alert-success {
  background: var(--green-pale);
  color: var(--green-deep);
  border-left: 3px solid var(--green-medium);
}

.alert-error {
  background: #fce8e8;
  color: var(--accent-danger);
  border-left: 3px solid var(--accent-danger);
}

.alert-info {
  background: #e8f4f2;
  color: #2d5a55;
  border-left: 3px solid var(--accent-teal);
}

/* Page Header */
.page-header {
  margin-bottom: 2.5rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--green-pale);
}

.page-header h1 {
  margin-bottom: 0.5rem;
}

.page-header .subtitle {
  color: var(--text-light);
  font-size: 1.1rem;
}

.page-header .subtitle em {
  font-family: var(--font-display);
  color: var(--green-medium);
}

.page-header.page-header-with-action {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
}

.page-header-actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
}

.page-header-add {
  white-space: nowrap;
  box-shadow: var(--shadow-sm);
}

/* Footer */
.footer {
  background: var(--bg-dark);
  color: var(--text-white);
  padding: 2rem 0;
  margin-top: auto;
  text-align: center;
  font-size: 0.9rem;
}

.footer p {
  opacity: 0.7;
}

.footer .heart {
  color: var(--green-soft);
}

/* Grids */
.grid {
  display: grid;
  gap: 1.5rem;
}

.grid-2 { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.grid-3 { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
.grid-4 { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }

/* Utilities */
.text-center { text-align: center; }
.text-muted { color: var(--text-light); }
.mt-1 { margin-top: 0.5rem; }
.mt-2 { margin-top: 1rem; }
.mt-3 { margin-top: 1.5rem; }
.mt-4 { margin-top: 2rem; }
.mb-1 { margin-bottom: 0.5rem; }
.mb-2 { margin-bottom: 1rem; }
.mb-3 { margin-bottom: 1.5rem; }
.mb-4 { margin-bottom: 2rem; }

.hidden { display: none !important; }

/* Badges */
.badge {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 500;
  background: var(--green-pale);
  color: var(--green-deep);
}

.badge-admin {
  background: var(--wood-light);
  color: var(--wood-dark);
}

.badge-member {
  background: var(--green-mint);
  color: var(--green-deep);
}

/* Loader */
.loader {
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 3px solid rgba(74, 124, 89, 0.2);
  border-top-color: var(--green-medium);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

/* Fade in animations */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fade-in {
  animation: fadeInUp 0.5s ease-out;
}

/* Responsive */
@media (max-width: 768px) {
  .navbar {
    padding: 0.8rem 0 0.7rem;
  }

  .navbar-inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "brand user"
      "links links";
    align-items: center;
    column-gap: 0.65rem;
    row-gap: 0.75rem;
  }

  .navbar-brand {
    grid-area: brand;
    min-width: 0;
    font-size: 1.02rem;
    gap: 0.28rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .navbar-brand-main,
  .navbar-brand-accent {
    font-size: inherit;
  }

  .nav-user {
    grid-area: user;
    justify-self: end;
    min-width: 0;
    padding: 0.32rem 0.55rem;
    border: 1px solid var(--green-pale);
    background: var(--bg-base);
  }

  .nav-user-text {
    display: flex;
    min-width: 0;
  }

  .nav-user-name {
    max-width: 74px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.86rem;
  }

  .nav-user-subtitle {
    display: none;
  }

  .nav-links {
    grid-area: links;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-content: stretch;
    align-items: start;
    gap: 0.6rem 0.7rem;
    padding: 0.2rem 0 0;
  }

  .nav-links li {
    min-width: 0;
    list-style: none;
  }

  .nav-links li:nth-child(odd) {
    transform: translateX(-7px);
  }

  .nav-links li:nth-child(even) {
    transform: translateX(7px) translateY(8px);
  }

  .nav-links a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    text-align: center;
    white-space: normal;
    line-height: 1.15;
    min-height: 50px;
    padding: 0.72rem 0.9rem;
    font-size: 0.93rem;
    background: var(--bg-card);
    border: 1px solid var(--green-pale);
    border-radius: 18px;
    box-shadow: var(--shadow-sm);
  }

  .nav-links a.active {
    background: linear-gradient(180deg, #eef6f0 0%, #e1efe5 100%);
    border-color: rgba(74, 124, 89, 0.55);
    box-shadow: inset 0 0 0 1px rgba(74, 124, 89, 0.16), var(--shadow-sm);
  }

  .page-header.page-header-with-action {
    flex-direction: row;
    align-items: flex-start;
    gap: 1rem;
  }

  .page-header-actions {
    justify-content: flex-end;
    flex-shrink: 0;
  }

  .container {
    padding: 0 1rem;
  }
}

@media (max-width: 420px) {
  .navbar-brand {
    font-size: 0.96rem;
  }

  .nav-links {
    gap: 0.52rem 0.6rem;
  }

  .nav-links li:nth-child(odd) {
    transform: translateX(-5px);
  }

  .nav-links li:nth-child(even) {
    transform: translateX(5px) translateY(6px);
  }

  .nav-links a {
    min-height: 47px;
    font-size: 0.87rem;
    padding: 0.64rem 0.8rem;
  }
}


/* ============================================
   SYNC-STATUS-BANNER
   ============================================ */
.sync-banner {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  padding: 0.6rem 1rem;
  text-align: center;
  font-size: 0.88rem;
  font-weight: 500;
  animation: slideDown 0.3s ease-out;
}

.sync-banner-offline {
  background: #fff3e0;
  color: #8a4a0c;
  border-bottom: 1px solid #d4896b;
}

@keyframes slideDown {
  from { transform: translateY(-100%); }
  to { transform: translateY(0); }
}

/* Loading-Screen beim Seitenstart */
.page-loading {
  position: fixed;
  inset: 0;
  background: var(--bg-base);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  transition: opacity 0.3s;
}

.page-loading.hidden {
  opacity: 0;
  pointer-events: none;
}

.page-loading-content {
  text-align: center;
  color: var(--text-light);
}

.page-loading-content .loader {
  width: 32px;
  height: 32px;
  border-width: 3px;
  margin-bottom: 0.75rem;
}

/* ============================================
   PASSWORT-FELD MIT TOGGLE (global)
   ============================================ */
.password-field {
  position: relative;
}

.password-field .form-control {
  padding-right: 3rem;
}

.password-toggle {
  position: absolute;
  right: 0.5rem;
  top: 50%;
  transform: translateY(-50%);
  background: transparent;
  border: none;
  cursor: pointer;
  font-size: 1.2rem;
  padding: 0.5rem;
  border-radius: 6px;
  color: var(--text-light);
  transition: background 0.15s;
  z-index: 2;
}

.password-toggle:hover {
  background: rgba(74, 124, 89, 0.15);
}

/* ============================================
   NAVBAR 2026-04-19b – kompakter & ausklappbar
   ============================================ */
.navbar-toprow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
}

.nav-categories {
  width: 100%;
}

.nav-categories-summary {
  display: none;
}


/* v173 compact mobile category sheet + notification inbox */
.mobile-nav-sheet-head.compact { margin-bottom: .7rem; }
.mobile-nav-sheet-head.compact h2 { margin-bottom: 0; }
.mobile-nav-sheet-head.compact .text-muted { display: none; }
.category-sheet .mobile-category-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: .52rem;
}
.category-sheet .mobile-category-link {
  min-height: 58px;
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .62rem .68rem;
  border-radius: 17px;
  text-decoration: none;
  color: var(--text-main);
  background: rgba(74,124,89,.07);
  border: 1px solid rgba(74,124,89,.13);
  box-shadow: 0 8px 20px rgba(30,70,44,.06);
}
.category-sheet .mobile-category-link span { font-size: 1.28rem; line-height: 1; }
.category-sheet .mobile-category-link strong {
  font-weight: 900;
  line-height: 1.05;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.notification-inbox-list {
  display: grid;
  gap: .62rem;
}
.notification-inbox-item {
  display: flex;
  gap: .72rem;
  align-items: flex-start;
  padding: .78rem;
  border-radius: 19px;
  text-decoration: none;
  color: var(--text-main);
  background: rgba(74,124,89,.07);
  border: 1px solid rgba(74,124,89,.14);
}
.notification-inbox-item-icon {
  width: 40px;
  height: 40px;
  border-radius: 15px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  background: rgba(133,188,32,.14);
}
.notification-inbox-item strong,
.notification-inbox-item small,
.notification-inbox-item time { display: block; }
.notification-inbox-item strong { font-weight: 900; line-height: 1.18; }
.notification-inbox-item small { color: var(--text-light); margin-top: .12rem; line-height: 1.3; }
.notification-inbox-item time { color: var(--text-light); opacity: .78; margin-top: .25rem; font-size: .78rem; font-weight: 750; }
.notification-inbox-empty {
  padding: 1rem;
  border-radius: 20px;
  text-align: center;
  background: rgba(74,124,89,.07);
  border: 1px dashed rgba(74,124,89,.18);
  color: var(--text-light);
}
.notification-inbox-empty span,
.notification-inbox-empty strong,
.notification-inbox-empty small { display: block; }
.notification-inbox-empty span { font-size: 1.6rem; margin-bottom: .25rem; }
.notification-inbox-empty strong { color: var(--text-main); }
:root[data-theme="dark"] .category-sheet .mobile-category-link,
:root[data-theme="dark"] .notification-inbox-item,
:root[data-theme="dark"] .notification-inbox-empty {
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.11);
  color: #f6fff8;
}
:root[data-theme="dark"] .category-sheet .mobile-category-link strong,
:root[data-theme="dark"] .notification-inbox-item strong,
:root[data-theme="dark"] .notification-inbox-empty strong { color: #f6fff8; }
:root[data-theme="dark"] .notification-inbox-item small,
:root[data-theme="dark"] .notification-inbox-item time { color: rgba(237,247,239,.70); }

@media (max-width: 900px) {
  .navbar {
    padding: 0.9rem 0 1rem;
  }

  .navbar-inner {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    align-items: stretch;
  }

  .navbar-toprow {
    align-items: center;
  }

  .nav-user {
    margin-left: auto;
    padding: 0.35rem 0.65rem;
  }

  .nav-user-name {
    max-width: 90px;
  }

  .nav-user-subtitle {
    display: none;
  }

  .nav-categories-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    list-style: none;
    cursor: pointer;
    user-select: none;
    background: var(--bg-card);
    border: 1px solid var(--green-pale);
    border-radius: 18px;
    padding: 0.8rem 0.95rem;
    box-shadow: var(--shadow-sm);
  }

  .nav-categories-summary::-webkit-details-marker {
    display: none;
  }

  .nav-categories-current {
    font-weight: 700;
    color: var(--green-deep);
  }

  .nav-categories-toggle {
    color: var(--text-light);
    font-size: 0.9rem;
    white-space: nowrap;
  }

  .nav-categories:not([open]) .nav-links {
    display: none;
  }

  .nav-categories[open] .nav-links {
    display: grid;
  }

  .nav-links {
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    padding: 0.8rem 0 0;
  }

  .nav-links li {
    list-style: none;
    min-width: 0;
    transform: none !important;
  }

  .nav-links a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 56px;
    width: 100%;
    text-align: center;
    white-space: normal;
    line-height: 1.2;
    padding: 0.85rem 0.9rem;
    font-size: 0.96rem;
    background: var(--bg-card);
    border: 1px solid var(--green-pale);
    border-radius: 22px;
    box-shadow: var(--shadow-sm);
  }

  .nav-links a.active {
    background: linear-gradient(180deg, #eef6f0 0%, #e1efe5 100%);
    border-color: rgba(74, 124, 89, 0.55);
    box-shadow: inset 0 0 0 1px rgba(74, 124, 89, 0.16), var(--shadow-sm);
  }
}

@media (max-width: 520px) {
  .navbar-brand {
    gap: 0.55rem;
  }

  .navbar-brand-logo {
    width: 42px;
    height: 42px;
    flex-basis: 42px;
  }

  .navbar-brand-wordmark {
    gap: 0.3rem;
  }

  .navbar-brand-main {
    font-size: 1.2rem;
  }

  .navbar-brand-accent {
    font-size: 1.08rem;
  }

  .nav-user-avatar {
    width: 34px;
    height: 34px;
  }

  .nav-links a {
    min-height: 52px;
    font-size: 0.92rem;
    padding: 0.75rem 0.8rem;
  }

  .nav-categories-summary {
    padding: 0.72rem 0.88rem;
  }

  .nav-categories-toggle {
    font-size: 0.86rem;
  }
}

/* ============================================
   EIGENES CONFIRM-MODAL (ersetzt browser confirm())
   ============================================ */
.confirm-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(20, 32, 26, 0.55);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 300;
  padding: 1rem;
  animation: confirmFadeIn 0.18s ease-out;
}

.confirm-backdrop.confirm-closing {
  animation: confirmFadeOut 0.15s ease-in forwards;
}

@keyframes confirmFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes confirmFadeOut {
  from { opacity: 1; }
  to { opacity: 0; }
}

.confirm-box {
  background: var(--bg-card);
  border-radius: var(--radius-lg);
  padding: 2rem 1.75rem 1.5rem;
  max-width: 420px;
  width: 100%;
  box-shadow: 0 24px 60px rgba(20, 32, 26, 0.35);
  text-align: center;
  animation: confirmPopIn 0.22s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
}

@keyframes confirmPopIn {
  from { transform: scale(0.9) translateY(10px); opacity: 0; }
  to { transform: scale(1) translateY(0); opacity: 1; }
}

.confirm-icon {
  font-size: 3rem;
  line-height: 1;
  margin-bottom: 0.75rem;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: var(--green-pale);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.confirm-icon-danger {
  background: #fce8e8;
}

.confirm-title {
  font-family: var(--font-display);
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--text-dark);
  margin: 0 0 0.5rem;
  line-height: 1.2;
}

.confirm-message {
  color: var(--text-medium);
  font-size: 0.98rem;
  line-height: 1.5;
  margin: 0 0 1.5rem;
}

.confirm-actions {
  display: flex;
  gap: 0.6rem;
  justify-content: center;
}

.confirm-actions .btn {
  flex: 1;
  max-width: 180px;
  padding: 0.7rem 1rem;
  font-weight: 600;
}

@media (max-width: 420px) {
  .confirm-actions {
    flex-direction: column-reverse;
  }
  .confirm-actions .btn {
    max-width: none;
    width: 100%;
  }
}


.navbar { --member-color: var(--green-medium); }
.nav-color-dot { width: 0.7rem; height: 0.7rem; border-radius: 50%; display: inline-block; margin-right: 0.45rem; box-shadow: 0 0 0 3px rgba(255,255,255,0.75); }
.nav-links a.active { border-color: color-mix(in srgb, var(--member-color) 60%, white 40%) !important; }

/* v173 compact mobile category sheet + notification inbox */
.mobile-nav-sheet-head.compact { margin-bottom: .7rem; }
.mobile-nav-sheet-head.compact h2 { margin-bottom: 0; }
.mobile-nav-sheet-head.compact .text-muted { display: none; }
.category-sheet .mobile-category-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: .52rem;
}
.category-sheet .mobile-category-link {
  min-height: 58px;
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .62rem .68rem;
  border-radius: 17px;
  text-decoration: none;
  color: var(--text-main);
  background: rgba(74,124,89,.07);
  border: 1px solid rgba(74,124,89,.13);
  box-shadow: 0 8px 20px rgba(30,70,44,.06);
}
.category-sheet .mobile-category-link span { font-size: 1.28rem; line-height: 1; }
.category-sheet .mobile-category-link strong {
  font-weight: 900;
  line-height: 1.05;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.notification-inbox-list {
  display: grid;
  gap: .62rem;
}
.notification-inbox-item {
  display: flex;
  gap: .72rem;
  align-items: flex-start;
  padding: .78rem;
  border-radius: 19px;
  text-decoration: none;
  color: var(--text-main);
  background: rgba(74,124,89,.07);
  border: 1px solid rgba(74,124,89,.14);
}
.notification-inbox-item-icon {
  width: 40px;
  height: 40px;
  border-radius: 15px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  background: rgba(133,188,32,.14);
}
.notification-inbox-item strong,
.notification-inbox-item small,
.notification-inbox-item time { display: block; }
.notification-inbox-item strong { font-weight: 900; line-height: 1.18; }
.notification-inbox-item small { color: var(--text-light); margin-top: .12rem; line-height: 1.3; }
.notification-inbox-item time { color: var(--text-light); opacity: .78; margin-top: .25rem; font-size: .78rem; font-weight: 750; }
.notification-inbox-empty {
  padding: 1rem;
  border-radius: 20px;
  text-align: center;
  background: rgba(74,124,89,.07);
  border: 1px dashed rgba(74,124,89,.18);
  color: var(--text-light);
}
.notification-inbox-empty span,
.notification-inbox-empty strong,
.notification-inbox-empty small { display: block; }
.notification-inbox-empty span { font-size: 1.6rem; margin-bottom: .25rem; }
.notification-inbox-empty strong { color: var(--text-main); }
:root[data-theme="dark"] .category-sheet .mobile-category-link,
:root[data-theme="dark"] .notification-inbox-item,
:root[data-theme="dark"] .notification-inbox-empty {
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.11);
  color: #f6fff8;
}
:root[data-theme="dark"] .category-sheet .mobile-category-link strong,
:root[data-theme="dark"] .notification-inbox-item strong,
:root[data-theme="dark"] .notification-inbox-empty strong { color: #f6fff8; }
:root[data-theme="dark"] .notification-inbox-item small,
:root[data-theme="dark"] .notification-inbox-item time { color: rgba(237,247,239,.70); }

@media (max-width: 900px) {
  .nav-links a.active {
    background: color-mix(in srgb, var(--member-color) 12%, white 88%) !important;
  }
}


.nav-user {
  background: rgba(255,255,255,0.88);
  border: 1px solid var(--green-pale);
  border-radius: 18px;
  padding: 0.45rem 0.75rem;
  box-shadow: var(--shadow-sm);
}

.nav-categories-summary {
  background: linear-gradient(180deg, #ffffff 0%, #f8fbf9 100%);
}

.nav-categories-current {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}


@media (max-width: 768px) {
  .toast-root {
    width: min(94vw, 420px);
    bottom: max(14px, env(safe-area-inset-bottom, 0px) + 8px);
  }
}


/* v36: Bestätigungsfenster muss über Chat-/Bild-Menüs liegen */
.confirm-backdrop {
  z-index: 1200 !important;
}

/* ============================================
   V50 - Dark Mode
   ============================================ */
:root[data-theme="dark"] {
  --green-deep: #d7f2df;
  --green-primary: #9bd0a8;
  --green-medium: #7ab889;
  --green-soft: #4e765c;
  --green-mint: #294638;
  --green-pale: #1c3027;

  --wood-dark: #f0c998;
  --wood-medium: #d3a76f;
  --wood-light: #8f6944;
  --wood-cream: #2d241d;

  --bg-base: #101813;
  --bg-card: #18241d;
  --bg-dark: #0b120e;

  --text-dark: #eff8f1;
  --text-medium: #c1d1c7;
  --text-light: #94a69b;
  --text-white: #f8fff9;

  --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.22);
  --shadow-md: 0 10px 28px rgba(0, 0, 0, 0.28);
  --shadow-lg: 0 24px 58px rgba(0, 0, 0, 0.36);
}

:root[data-theme="dark"] body::before {
  background-image:
    radial-gradient(circle at 20% 10%, rgba(90, 181, 168, 0.10), transparent 40%),
    radial-gradient(circle at 80% 80%, rgba(212, 165, 116, 0.10), transparent 40%);
}

:root[data-theme="dark"] .navbar,
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .modal-content,
:root[data-theme="dark"] .nav-user-dropdown,
:root[data-theme="dark"] .auth-card {
  background: rgba(24, 36, 29, 0.96);
  border-color: rgba(197, 224, 204, 0.12);
}

:root[data-theme="dark"] input,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] select,
:root[data-theme="dark"] .form-control {
  background: #101813;
  border-color: rgba(197, 224, 204, 0.18);
  color: var(--text-dark);
}

:root[data-theme="dark"] .btn-outline {
  background: rgba(255,255,255,0.03);
}

.nav-user-dropdown-button {
  width: 100%;
  border: 0;
  background: transparent;
  cursor: pointer;
  font: inherit;
  text-align: left;
}

/* ============================================
   V51 - Dark Mode Kontrast-Fix global
   ============================================ */
:root[data-theme="dark"] {
  --green-deep: #e9fff0;
  --green-primary: #bce7c5;
  --green-medium: #86c995;
  --green-soft: #355c46;
  --green-mint: #243d30;
  --green-pale: #1d3228;
  --wood-dark: #ffe1b3;
  --wood-medium: #d7aa73;
  --wood-light: #7d5d3d;
  --wood-cream: #2a221b;
  --bg-base: #0d1712;
  --bg-card: #16231b;
  --bg-dark: #08100c;
  --surface-1: #16231b;
  --surface-2: #1b2b22;
  --surface-3: #22372b;
  --border-soft: rgba(206, 237, 215, 0.16);
  --text-dark: #f0fbf3;
  --text-medium: #c7d8cd;
  --text-light: #9db2a5;
  --text-white: #ffffff;
  --shadow-sm: 0 2px 12px rgba(0,0,0,0.28);
  --shadow-md: 0 12px 32px rgba(0,0,0,0.34);
  --shadow-lg: 0 26px 64px rgba(0,0,0,0.45);
}

:root[data-theme="dark"] body {
  background:
    radial-gradient(circle at 22% 8%, rgba(93, 170, 114, 0.13), transparent 32%),
    radial-gradient(circle at 86% 78%, rgba(212, 165, 116, 0.10), transparent 36%),
    var(--bg-base);
  color: var(--text-dark);
}

:root[data-theme="dark"] h1,
:root[data-theme="dark"] h2,
:root[data-theme="dark"] h3,
:root[data-theme="dark"] h4,
:root[data-theme="dark"] strong {
  color: var(--text-dark);
}

:root[data-theme="dark"] .navbar,
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .auth-card,
:root[data-theme="dark"] .modal-content,
:root[data-theme="dark"] .confirm-box,
:root[data-theme="dark"] .nav-user-dropdown {
  background: color-mix(in srgb, var(--surface-1) 94%, black 6%);
  border-color: var(--border-soft);
  color: var(--text-dark);
}

:root[data-theme="dark"] .navbar {
  box-shadow: 0 12px 34px rgba(0,0,0,0.28);
}

:root[data-theme="dark"] .navbar-brand-main,
:root[data-theme="dark"] .navbar-brand,
:root[data-theme="dark"] .nav-user-name,
:root[data-theme="dark"] .nav-categories-current,
:root[data-theme="dark"] .nav-links a.active {
  color: var(--text-dark);
}

:root[data-theme="dark"] .navbar-brand-accent,
:root[data-theme="dark"] .nav-categories-toggle,
:root[data-theme="dark"] .nav-user-subtitle,
:root[data-theme="dark"] .text-muted,
:root[data-theme="dark"] small {
  color: var(--text-light) !important;
}

:root[data-theme="dark"] .nav-user,
:root[data-theme="dark"] .nav-categories-summary,
:root[data-theme="dark"] .nav-links a,
:root[data-theme="dark"] .form-control,
:root[data-theme="dark"] input,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] select {
  background: rgba(255,255,255,0.055) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-dark) !important;
}

:root[data-theme="dark"] .nav-links a:hover,
:root[data-theme="dark"] .nav-links a.active,
:root[data-theme="dark"] .btn-outline:hover,
:root[data-theme="dark"] .nav-user-dropdown-item:hover {
  background: rgba(134, 201, 149, 0.14) !important;
}

:root[data-theme="dark"] .btn-primary {
  background: linear-gradient(135deg, #7fc28c, #aee0b8);
  color: #0d1712;
}

:root[data-theme="dark"] .btn-outline,
:root[data-theme="dark"] .btn-secondary {
  background: rgba(255,255,255,0.04);
  border-color: rgba(174, 224, 184, 0.42);
  color: var(--text-dark);
}

:root[data-theme="dark"] .alert-success,
:root[data-theme="dark"] .alert-info,
:root[data-theme="dark"] .badge,
:root[data-theme="dark"] .badge-member {
  background: rgba(134, 201, 149, 0.16);
  color: var(--text-dark);
  border-color: rgba(134, 201, 149, 0.34);
}

:root[data-theme="dark"] .alert-error,
:root[data-theme="dark"] .confirm-icon-danger {
  background: rgba(192, 85, 85, 0.18);
  color: #ffb8b8;
}

:root[data-theme="dark"] .footer {
  background: #08100c;
  color: var(--text-medium);
  border-top: 1px solid var(--border-soft);
}

:root[data-theme="dark"] .page-loading {
  background: rgba(8,16,12,0.92);
  color: var(--text-dark);
}

/* ============================================
   V52 - Dark Mode Grundfarben sauber nachgezogen
   ============================================ */
:root[data-theme="dark"] {
  --green-deep: #f3fff6;
  --green-primary: #b9eac3;
  --green-medium: #86cd96;
  --green-soft: #345944;
  --green-mint: #263f31;
  --green-pale: #1b3025;
  --wood-dark: #ffe0af;
  --wood-medium: #e0b57b;
  --wood-light: #9a744a;
  --wood-cream: #2b241b;
  --bg-base: #07110c;
  --bg-card: #132118;
  --bg-dark: #050b08;
  --surface-1: #101d15;
  --surface-2: #17271d;
  --surface-3: #203427;
  --border-soft: rgba(213, 245, 222, 0.18);
  --text-dark: #f4fff7;
  --text-medium: #d4e7da;
  --text-light: #aabdaf;
  --text-white: #ffffff;
  --text-muted: #aabdaf;
  --text-color: #f4fff7;
  --border-color: rgba(213, 245, 222, 0.18);
  --primary-dark: #f4fff7;
  --danger: #ff8f8f;
  --shadow-soft: 0 16px 40px rgba(0,0,0,0.35);
}

:root[data-theme="dark"] body {
  background:
    radial-gradient(circle at 20% -10%, rgba(97, 190, 126, 0.16), transparent 34%),
    radial-gradient(circle at 100% 76%, rgba(255, 205, 133, 0.10), transparent 36%),
    linear-gradient(180deg, #07110c 0%, #0b1711 46%, #06100b 100%);
  color: var(--text-dark);
}

:root[data-theme="dark"] body::before {
  background-image:
    radial-gradient(circle at 15% 12%, rgba(134, 205, 150, 0.10), transparent 38%),
    radial-gradient(circle at 85% 84%, rgba(255, 214, 151, 0.08), transparent 42%);
}

:root[data-theme="dark"] .navbar,
:root[data-theme="dark"] .card,
:root[data-theme="dark"] .auth-card,
:root[data-theme="dark"] .modal-content,
:root[data-theme="dark"] .confirm-box,
:root[data-theme="dark"] .nav-user-dropdown {
  background: rgba(16, 29, 21, 0.96) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-dark) !important;
  box-shadow: 0 18px 46px rgba(0,0,0,0.32);
}

:root[data-theme="dark"] .navbar {
  border-bottom-color: rgba(213, 245, 222, 0.13) !important;
  backdrop-filter: blur(18px);
}

:root[data-theme="dark"] h1,
:root[data-theme="dark"] h2,
:root[data-theme="dark"] h3,
:root[data-theme="dark"] h4,
:root[data-theme="dark"] strong,
:root[data-theme="dark"] label,
:root[data-theme="dark"] .navbar-brand-main,
:root[data-theme="dark"] .navbar-brand,
:root[data-theme="dark"] .nav-user-name,
:root[data-theme="dark"] .nav-categories-current,
:root[data-theme="dark"] .nav-links a.active {
  color: var(--text-dark) !important;
}

:root[data-theme="dark"] p,
:root[data-theme="dark"] .subtitle,
:root[data-theme="dark"] .text-muted,
:root[data-theme="dark"] small,
:root[data-theme="dark"] .nav-categories-toggle,
:root[data-theme="dark"] .navbar-brand-accent,
:root[data-theme="dark"] .nav-user-subtitle {
  color: var(--text-light) !important;
}

:root[data-theme="dark"] a {
  color: #bff0c9;
}

:root[data-theme="dark"] input,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] select,
:root[data-theme="dark"] .form-control,
:root[data-theme="dark"] .nav-user,
:root[data-theme="dark"] .nav-categories-summary,
:root[data-theme="dark"] .nav-links a {
  background: rgba(255,255,255,0.065) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-dark) !important;
}

:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder {
  color: rgba(214, 231, 220, 0.58) !important;
}

:root[data-theme="dark"] .btn-primary {
  background: linear-gradient(135deg, #93d9a1, #c6f4ce) !important;
  border-color: rgba(198,244,206,0.55) !important;
  color: #07110c !important;
  box-shadow: 0 12px 28px rgba(40, 155, 75, 0.22);
}

:root[data-theme="dark"] .btn-outline,
:root[data-theme="dark"] .btn-secondary,
:root[data-theme="dark"] .btn {
  border-color: rgba(190, 235, 202, 0.42);
}

:root[data-theme="dark"] .btn-outline,
:root[data-theme="dark"] .btn-secondary {
  background: rgba(255,255,255,0.045) !important;
  color: var(--text-dark) !important;
}

:root[data-theme="dark"] .btn-outline:hover,
:root[data-theme="dark"] .btn-secondary:hover,
:root[data-theme="dark"] .nav-links a:hover,
:root[data-theme="dark"] .nav-links a.active,
:root[data-theme="dark"] .nav-user-dropdown-item:hover {
  background: rgba(147, 217, 161, 0.15) !important;
  color: var(--text-dark) !important;
}

:root[data-theme="dark"] .btn-danger {
  background: rgba(205, 83, 83, 0.9) !important;
  color: #fff !important;
  border-color: rgba(255, 160, 160, 0.35) !important;
}

:root[data-theme="dark"] .badge,
:root[data-theme="dark"] .badge-member,
:root[data-theme="dark"] .alert-info,
:root[data-theme="dark"] .alert-success {
  background: rgba(147, 217, 161, 0.16) !important;
  border-color: rgba(147, 217, 161, 0.32) !important;
  color: var(--text-dark) !important;
}

:root[data-theme="dark"] .alert-error,
:root[data-theme="dark"] .tibber-error {
  color: #ffb8b8 !important;
}

:root[data-theme="dark"] .footer {
  background: #050b08 !important;
  color: var(--text-light) !important;
  border-top: 1px solid var(--border-soft);
}

/* ============================================
   V55 - Navbar/Userfeld im Dark Mode ruhiger
   ============================================ */
:root[data-theme="dark"] .nav-user {
  background: linear-gradient(145deg, rgba(14, 36, 24, 0.98), rgba(8, 24, 15, 0.98)) !important;
  border-color: rgba(162, 224, 177, 0.24) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

:root[data-theme="dark"] .nav-categories-summary {
  background: linear-gradient(145deg, rgba(15, 37, 25, 0.98), rgba(9, 25, 16, 0.98)) !important;
  border-color: rgba(162, 224, 177, 0.20) !important;
}

:root[data-theme="dark"] .nav-user-name,
:root[data-theme="dark"] .nav-categories-current {
  color: #f4fff6 !important;
}

:root[data-theme="dark"] .nav-color-dot {
  box-shadow: 0 0 0 4px rgba(255,255,255,0.08) !important;
}

/* v88 PWA: app-ähnliches Verhalten ohne sichtbares Redesign */
html.pwa-ready-shell {
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

body {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

.pwa-standalone body,
body.pwa-standalone {
  overscroll-behavior-y: contain;
}

@supports (padding: max(0px)) {
  body.pwa-standalone {
    padding-top: max(0px, env(safe-area-inset-top));
    padding-bottom: max(0px, env(safe-area-inset-bottom));
  }
}

.pwa-standalone .page-wrapper {
  min-height: 100dvh;
}

.pwa-standalone input,
.pwa-standalone textarea,
.pwa-standalone select,
.pwa-standalone button {
  -webkit-tap-highlight-color: transparent;
}


/* ============================================
   V90 - Desktop-Kategorien wieder ausklappbar
   ============================================ */
.nav-categories {
  width: 100%;
}

.nav-categories-summary {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  list-style: none;
  cursor: pointer;
  user-select: none;
  background: linear-gradient(180deg, rgba(255,255,255,0.94) 0%, rgba(248,251,249,0.9) 100%);
  border: 1px solid var(--green-pale);
  border-radius: 22px;
  padding: 0.82rem 1rem;
  box-shadow: var(--shadow-sm);
}

.nav-categories-summary::-webkit-details-marker {
  display: none;
}

.nav-categories:not([open]) .nav-links {
  display: none !important;
}

.nav-categories[open] .nav-links {
  display: grid !important;
}

.nav-categories-toggle {
  margin-left: auto;
}

@media (min-width: 901px) {
  .navbar {
    padding: 0.95rem 0 1rem;
  }

  .navbar-inner {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.85rem;
  }

  .navbar-toprow {
    width: 100%;
  }

  .nav-categories[open] .nav-links {
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 0.7rem;
    padding: 0.85rem 0 0;
  }

  .nav-links li {
    list-style: none;
    min-width: 0;
  }

  .nav-links a {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    width: 100%;
    text-align: center;
    white-space: normal;
    line-height: 1.15;
    padding: 0.72rem 0.9rem;
    background: var(--bg-card);
    border: 1px solid var(--green-pale);
    border-radius: 18px;
    box-shadow: var(--shadow-sm);
  }
}

:root[data-theme="dark"] .nav-categories-summary {
  background: linear-gradient(180deg, rgba(18,48,31,0.96) 0%, rgba(12,38,24,0.92) 100%) !important;
  border-color: rgba(174, 239, 188, 0.18) !important;
}


/* ============================================
   V91 - Desktop-Kategorien kompakt rechts
   ============================================ */
@media (min-width: 901px) {
  .navbar-inner {
    position: relative;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 1rem !important;
  }
  .navbar-toprow {
    width: auto !important;
    flex: 1 1 auto;
    min-width: 0;
    padding-right: 14rem;
  }
  .nav-categories {
    width: auto !important;
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    z-index: 130;
  }
  .nav-categories-summary {
    min-width: 12rem;
    max-width: 17rem;
    padding: 0.55rem 0.75rem !important;
    border-radius: 999px !important;
    box-shadow: 0 10px 22px rgba(20, 60, 38, 0.12) !important;
  }
  .nav-categories-current {
    max-width: 8.5rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 0.92rem;
  }
  .nav-categories-toggle {
    font-size: 0.84rem;
    font-weight: 700;
  }
  .nav-categories[open] .nav-links {
    position: absolute;
    right: 0;
    top: calc(100% + 0.65rem);
    width: min(520px, calc(100vw - 2rem));
    max-height: min(72vh, 620px);
    overflow: auto;
    padding: 0.75rem !important;
    border: 1px solid var(--green-pale);
    border-radius: 22px;
    background: rgba(255,255,255,0.96);
    box-shadow: 0 20px 50px rgba(20, 60, 38, 0.24);
    backdrop-filter: blur(18px);
  }
}

:root[data-theme="dark"] .nav-categories[open] .nav-links {
  background: rgba(8, 30, 20, 0.97);
  border-color: rgba(174, 239, 188, 0.18);
  box-shadow: 0 24px 60px rgba(0,0,0,0.42);
}

/* V91 QR-Zugänge */
.member-admin-actions { display: inline-flex; gap: 0.6rem; flex-wrap: wrap; align-items: center; }
.temp-qr-preview { margin-top: 1rem; }
.temp-qr-print-sheet {
  width: min(100%, 420px);
  margin: 0 auto;
  padding: 1.35rem;
  border: 1px solid var(--green-pale);
  border-radius: 24px;
  background: var(--bg-card);
  text-align: center;
  box-shadow: var(--shadow-md);
}
.temp-qr-img {
  width: min(76vw, 260px);
  height: min(76vw, 260px);
  border-radius: 18px;
  background: white;
  padding: 0.6rem;
  margin: 0.75rem auto;
  display: block;
}
.temp-qr-url {
  font-size: 0.72rem;
  color: var(--text-light);
  word-break: break-all;
}
@media print {
  body * { visibility: hidden !important; }
  #temp-qr-print, #temp-qr-print * { visibility: visible !important; }
  #temp-qr-print { position: fixed; inset: 0; display: grid; place-items: center; background: white; }
  .temp-qr-print-sheet { width: 148mm; min-height: 210mm; box-shadow: none; border: 0; border-radius: 0; padding: 18mm 14mm; color: #12251a; }
  .temp-qr-img { width: 96mm; height: 96mm; }
}

/* V92 QR-Druck, Smart-Life-Geräteeinstellungen, Mitglieder-Zugänge */
.temp-qr-print-sheet {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 20% 12%, rgba(151, 236, 166, 0.32), transparent 30%),
    linear-gradient(145deg, rgba(244, 251, 243, 0.98), rgba(223, 247, 226, 0.98));
  color: #12251a;
}
.temp-qr-print-sheet::before,
.temp-qr-print-sheet::after {
  content: '';
  position: absolute;
  border-radius: 999px;
  pointer-events: none;
}
.temp-qr-print-sheet::before {
  width: 170px;
  height: 170px;
  right: -56px;
  top: -52px;
  background: rgba(76, 165, 96, 0.18);
}
.temp-qr-print-sheet::after {
  width: 120px;
  height: 120px;
  left: -46px;
  bottom: -42px;
  background: rgba(143, 232, 162, 0.22);
}
.temp-qr-print-brand,
.temp-qr-print-hero,
.temp-qr-code-frame,
.temp-qr-print-pills,
.temp-qr-steps,
.temp-qr-url,
.temp-qr-print-foot {
  position: relative;
  z-index: 1;
}
.temp-qr-print-brand {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.5rem 0.75rem;
  border: 1px solid rgba(24, 78, 45, 0.14);
  border-radius: 999px;
  background: rgba(255,255,255,0.7);
  margin-bottom: 0.9rem;
  font-size: 0.88rem;
}
.temp-qr-print-hero h2 { margin: 0.25rem 0 0.45rem; }
.temp-qr-print-icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  margin: 0 auto 0.55rem;
  border-radius: 18px;
  background: linear-gradient(135deg, #9bf0a9, #dff7e2);
  box-shadow: 0 14px 30px rgba(45, 130, 70, 0.22);
  font-size: 1.6rem;
}
.temp-qr-print-kicker {
  margin: 0;
  color: #2f6e45;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.75rem;
}
.temp-qr-code-frame {
  width: fit-content;
  padding: 0.65rem;
  margin: 0.8rem auto;
  border-radius: 28px;
  background: white;
  box-shadow: inset 0 0 0 1px rgba(22, 75, 43, 0.08), 0 18px 36px rgba(28, 85, 48, 0.18);
}
.temp-qr-code-frame .temp-qr-img {
  margin: 0;
  padding: 0;
  border-radius: 18px;
  box-shadow: none;
}
.temp-qr-print-pills {
  display: flex;
  justify-content: center;
  gap: 0.45rem;
  flex-wrap: wrap;
  margin: 0.7rem 0;
}
.temp-qr-print-pills span {
  padding: 0.35rem 0.6rem;
  border-radius: 999px;
  background: rgba(31, 89, 52, 0.09);
  color: #1a4a2e;
  font-weight: 800;
  font-size: 0.78rem;
}
.temp-qr-steps {
  display: grid;
  gap: 0.35rem;
  text-align: left;
  max-width: 310px;
  margin: 0.75rem auto;
  padding-left: 1.35rem;
  font-weight: 700;
  color: #193e29;
}
.temp-qr-print-foot {
  font-size: 0.78rem;
  color: #48624f;
  margin-top: 0.8rem;
}
.smartlife-admin-device-card { gap: 0.8rem; }
.smartlife-admin-device-head { align-items: center; }
.smartlife-device-config {
  border: 1px solid rgba(180, 236, 190, 0.2);
  border-radius: 20px;
  padding: 0.85rem;
  background: rgba(255,255,255,0.035);
}
.smartlife-device-config summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  font-weight: 900;
}
.smartlife-device-config summary::-webkit-details-marker { display: none; }
.smartlife-device-config summary small {
  padding: 0.28rem 0.55rem;
  border-radius: 999px;
  background: rgba(143, 232, 162, 0.12);
  color: var(--text-light);
  font-size: 0.78rem;
  font-weight: 800;
}
.smartlife-device-config[open] summary { margin-bottom: 0.85rem; }
.smartlife-device-config .form-row { margin-top: 0.65rem; }
.smartlife-device-config .is-muted {
  opacity: 0.58;
}
.smartlife-capability-row .permission-item input:disabled + span,
.smartlife-capability-row .permission-item:has(input:disabled) span {
  opacity: 0.55;
}
:root[data-theme="light"] .smartlife-device-config {
  background: rgba(255,255,255,0.72);
  border-color: rgba(43, 102, 62, 0.14);
}

@media print {
  @page { size: A5 portrait; margin: 0; }
  .temp-qr-print-sheet {
    width: 148mm !important;
    min-height: 210mm !important;
    padding: 16mm 14mm !important;
    background: linear-gradient(145deg, #f5fff5, #e6f8e9) !important;
    border-radius: 0 !important;
  }
  .temp-qr-code-frame { box-shadow: none !important; border: 1px solid rgba(24, 78, 45, 0.12); }
  .temp-qr-img { width: 88mm !important; height: 88mm !important; }
  .temp-qr-url { font-size: 8.5pt !important; }
}

/* V93 QR-Gerätefreigaben + Wartungshinweise */
.qr-smartlife-access {
  margin: 1rem 0;
  border: 1px solid rgba(143, 232, 162, 0.22);
  border-radius: 22px;
  padding: 0.85rem;
  background: rgba(14, 41, 27, 0.42);
}
.qr-smartlife-access summary {
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  align-items: center;
  font-weight: 800;
}
.qr-smartlife-access summary small { color: var(--text-muted); font-weight: 700; }
.qr-smartlife-list { margin-top: 0.75rem; max-height: 260px; overflow: auto; padding-right: 0.25rem; }
.qr-device-choice .permission-desc { font-size: 0.8rem; word-break: break-all; }
@media print {
  .temp-qr-print-pills span { color: #1f3a27 !important; }
}

.footer-inner {
  position: relative;
}
.footer-version {
  position: absolute;
  right: 0.8rem;
  bottom: 0.65rem;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: rgba(74, 124, 89, 0.42);
}
:root[data-theme="dark"] .footer-version {
  color: rgba(230, 245, 233, 0.42);
}
@media (max-width: 640px) {
  .footer-version { right: 1rem; bottom: 0.55rem; font-size: 0.68rem; }
}

/* v100 Footer-Version sichtbar halten */
.app-footer, .footer, footer { position: relative; }
.footer-version { position: absolute; right: max(1rem, env(safe-area-inset-right)); bottom: .7rem; max-width: 5rem; font-size: .72rem; opacity: .7; white-space: nowrap; overflow: visible; z-index: 2; }
@media (max-width: 680px) { .footer-version { right: .85rem; bottom: .45rem; font-size: .68rem; } }

/* v102 QR-PDF wirklich DIN A5 */
.temp-qr-print-sheet { aspect-ratio: 148 / 210; }
.temp-qr-welcome-line {
  font-size: .95rem;
  font-weight: 800;
  color: #245335;
  margin: .25rem 0 .2rem;
}
@media print {
  @page { size: 148mm 210mm; margin: 0; }
  #temp-qr-print { width: 148mm !important; height: 210mm !important; inset: auto !important; }
  .temp-qr-print-sheet {
    width: 148mm !important;
    height: 210mm !important;
    min-height: 210mm !important;
    max-height: 210mm !important;
    box-sizing: border-box !important;
  }
}

/* v106 Push-Hinweis + Gast-Kacheln */
.push-activation-card {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 0.85rem;
  margin: -0.35rem 0 1rem;
  border-color: rgba(133, 188, 32, 0.24);
  background: linear-gradient(135deg, rgba(236, 250, 232, 0.92), rgba(255,255,255,0.82));
}
.push-activation-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: rgba(133, 188, 32, 0.14);
  font-size: 1.35rem;
}
.push-activation-text strong { display: block; font-weight: 900; color: var(--text-dark); }
.push-activation-text p { margin: .15rem 0 0; color: var(--text-light); }
.push-activation-actions { display: inline-flex; gap: .45rem; flex-wrap: wrap; justify-content: flex-end; }
:root[data-theme="dark"] .push-activation-card { background: linear-gradient(135deg, rgba(25, 66, 39, 0.86), rgba(12, 30, 20, 0.88)); }
.home-guestbook-tile {
  background: linear-gradient(145deg, rgba(255,255,255,0.92), rgba(239, 251, 235, 0.96));
}
.home-guestbook-tile.needs-attention {
  border-color: rgba(133, 188, 32, 0.58);
  box-shadow: 0 18px 42px rgba(94, 148, 48, 0.22);
  transform: translateY(-1px);
}
.home-guestbook-tile.needs-attention .home-summary-icon { animation: softPulse 1.9s ease-in-out infinite; }
:root[data-theme="dark"] .home-guestbook-tile { background: linear-gradient(145deg, rgba(15, 44, 27, 0.96), rgba(23, 69, 39, 0.82)); }
@media (max-width: 720px) {
  .push-activation-card { grid-template-columns: auto 1fr; }
  .push-activation-actions { grid-column: 1 / -1; justify-content: stretch; }
  .push-activation-actions .btn { flex: 1; }
}

/* v106 QR-PDF: wirklich A5 und nicht mehr abgeschnitten */
.temp-qr-print-sheet {
  box-sizing: border-box;
  max-width: min(100%, 420px);
}
.temp-qr-print-hero h2 {
  font-size: clamp(1.25rem, 4.6vw, 1.75rem);
  line-height: 1.12;
}
.temp-qr-print-hero p {
  margin: .35rem auto .2rem;
  max-width: 32ch;
}
@media print {
  @page { size: A5 portrait; margin: 0; }
  html, body { width: 148mm !important; height: 210mm !important; overflow: hidden !important; background: #fff !important; }
  body * { visibility: hidden !important; }
  #temp-qr-print, #temp-qr-print * { visibility: visible !important; }
  #temp-qr-print {
    position: fixed !important;
    left: 0 !important;
    top: 0 !important;
    width: 148mm !important;
    height: 210mm !important;
    display: block !important;
    background: #fff !important;
    overflow: hidden !important;
  }
  .temp-qr-print-sheet {
    width: 148mm !important;
    height: 210mm !important;
    min-height: 0 !important;
    max-height: 210mm !important;
    margin: 0 !important;
    padding: 9mm 10mm 8mm !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 2.2mm !important;
    overflow: hidden !important;
  }
  .temp-qr-print-brand { margin-bottom: 1mm !important; padding: 2.4mm 4mm !important; font-size: 8.6pt !important; }
  .temp-qr-print-icon { width: 14mm !important; height: 14mm !important; margin-bottom: 1.8mm !important; border-radius: 4mm !important; font-size: 14pt !important; box-shadow: none !important; }
  .temp-qr-print-kicker { font-size: 7.2pt !important; }
  .temp-qr-print-hero h2 { font-size: 17pt !important; line-height: 1.06 !important; margin: 1mm 0 1.5mm !important; }
  .temp-qr-print-hero p { font-size: 9pt !important; line-height: 1.25 !important; margin: 0 auto !important; max-width: 105mm !important; }
  .temp-qr-code-frame { margin: 2mm auto 1mm !important; padding: 3mm !important; border-radius: 7mm !important; box-shadow: none !important; }
  .temp-qr-img, .temp-qr-code-frame .temp-qr-img { width: 74mm !important; height: 74mm !important; border-radius: 4mm !important; }
  .temp-qr-print-pills { margin: 1mm 0 !important; gap: 2mm !important; }
  .temp-qr-print-pills span { padding: 1.8mm 3mm !important; font-size: 7.5pt !important; }
  .temp-qr-steps { max-width: 104mm !important; margin: 1.5mm auto !important; gap: 1.2mm !important; padding-left: 6mm !important; font-size: 8.2pt !important; line-height: 1.25 !important; }
  .temp-qr-url { max-width: 112mm !important; font-size: 6.8pt !important; line-height: 1.15 !important; margin: 1mm 0 !important; }
  .temp-qr-print-foot { margin-top: auto !important; font-size: 7.4pt !important; line-height: 1.25 !important; max-width: 110mm !important; }
}
@keyframes softPulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.07); } }

/* v108 – Infofenster für Push beim App-Start */
.push-permission-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: end center;
  padding: 1rem;
  background: rgba(11, 23, 16, .24);
  backdrop-filter: blur(10px);
}
.push-permission-dialog {
  width: min(560px, 100%);
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .9rem;
  align-items: start;
  border: 1px solid rgba(133, 188, 32, .28);
  border-radius: 28px;
  padding: 1rem;
  background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(241,251,236,.94));
  box-shadow: 0 24px 70px rgba(14, 40, 24, .24);
}
.push-permission-icon {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 20px;
  background: rgba(133,188,32,.16);
  box-shadow: inset 0 0 0 1px rgba(133,188,32,.22);
  font-size: 1.45rem;
}
.push-permission-copy strong {
  display: block;
  color: var(--text-dark);
  font-size: 1.08rem;
  font-weight: 950;
  margin-bottom: .2rem;
}
.push-permission-copy p {
  margin: 0;
  color: var(--text-medium);
  line-height: 1.45;
}
.push-permission-copy small {
  display: block;
  margin-top: .45rem;
  color: var(--text-light);
  line-height: 1.35;
}
.push-permission-actions {
  grid-column: 1 / -1;
  display: flex;
  gap: .55rem;
  justify-content: flex-end;
  flex-wrap: wrap;
}
:root[data-theme="dark"] .push-permission-modal {
  background: rgba(3, 10, 6, .42);
}
:root[data-theme="dark"] .push-permission-dialog {
  background: linear-gradient(135deg, rgba(24, 57, 36, .96), rgba(11, 27, 18, .94));
  border-color: rgba(133,188,32,.25);
}
:root[data-theme="dark"] .push-permission-copy strong { color: rgba(241,255,238,.96); }
:root[data-theme="dark"] .push-permission-copy p { color: rgba(236,248,236,.84); }
:root[data-theme="dark"] .push-permission-copy small { color: rgba(236,248,236,.68); }
@media (max-width: 640px) {
  .push-permission-modal { place-items: end center; padding: .75rem; }
  .push-permission-dialog { border-radius: 24px; padding: .9rem; }
  .push-permission-actions { flex-direction: column; }
  .push-permission-actions .btn { width: 100%; justify-content: center; }
}

/* v109 – Push-Hinweis kürzer und ruhiger */
.push-permission-dialog {
  max-width: 520px;
  gap: .8rem;
  padding: .95rem;
}
.push-permission-copy small {
  margin-top: .35rem;
}
@media (max-width: 640px) {
  .push-permission-dialog {
    padding: .85rem;
    gap: .72rem;
  }
  .push-permission-icon {
    width: 46px;
    height: 46px;
    border-radius: 18px;
    font-size: 1.28rem;
  }
  .push-permission-copy strong {
    font-size: 1rem;
  }
  .push-permission-copy p,
  .push-permission-copy small {
    font-size: .9rem;
    line-height: 1.38;
  }
}


/* v116 nav long labels */
@media (min-width: 901px) {
  .navbar-toprow { padding-right: clamp(16rem, 28vw, 22rem) !important; }
  .nav-categories-summary { min-width: clamp(13rem, 18vw, 18.5rem) !important; max-width: min(22rem, 38vw) !important; }
  .nav-categories-current { min-width: 0 !important; max-width: clamp(7.5rem, 16vw, 14rem) !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
}


/* v116 Header, globaler Nach-oben-Pfeil und Onboarding */
.navbar-toprow { gap: .85rem; }
.navbar-actions { margin-left: auto; display:flex; align-items:center; justify-content:flex-end; gap:.65rem; min-width:0; }
.navbar-actions .nav-user { flex:0 0 auto; }
.navbar-actions .nav-categories { flex:1 1 auto; min-width:0; }
.navbar-actions .nav-categories-summary { display:flex; align-items:center; justify-content:space-between; gap:.55rem; }
.navbar-actions .nav-categories-current { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@media (min-width:901px){ .navbar-inner{display:block!important;} .navbar-toprow{display:flex!important;align-items:center!important;justify-content:space-between!important;width:100%!important;padding-right:0!important;} .navbar-actions{flex:0 1 min(50vw,42rem);} .navbar-actions .nav-categories{position:relative!important;right:auto!important;top:auto!important;transform:none!important;width:auto!important;z-index:130;} .navbar-actions .nav-categories-summary{min-width:clamp(11.5rem,17vw,18rem)!important;max-width:min(22rem,30vw)!important;} .navbar-actions .nav-categories[open] .nav-links{right:0!important;left:auto!important;top:calc(100% + .65rem)!important;} }
@media (max-width:900px){ .navbar-toprow{display:grid!important;grid-template-columns:auto minmax(0,1fr);align-items:center;} .navbar-actions{min-width:0;width:100%;} .navbar-actions .nav-categories-summary{min-width:0;padding:.62rem .7rem;border-radius:16px;} .navbar-actions .nav-categories-toggle{display:none;} .navbar-actions .nav-categories-current{max-width:clamp(6.8rem,31vw,12rem);} .navbar-actions .nav-categories[open] .nav-links{position:absolute;right:.75rem;left:.75rem;top:calc(100% + .55rem);z-index:160;max-height:min(70vh,520px);overflow:auto;background:rgba(255,255,255,.96);border:1px solid var(--green-pale);border-radius:22px;padding:.75rem;box-shadow:0 22px 52px rgba(20,60,38,.23);backdrop-filter:blur(18px);} :root[data-theme="dark"] .navbar-actions .nav-categories[open] .nav-links{background:rgba(10,33,23,.97);border-color:rgba(143,211,168,.22);} .nav-user{padding:.34rem .48rem;} }
.global-back-to-top{position:fixed;right:max(1rem,env(safe-area-inset-right));bottom:calc(1.05rem + env(safe-area-inset-bottom));z-index:900;width:48px;height:48px;border:1px solid rgba(116,176,92,.42);border-radius:18px;display:grid;place-items:center;cursor:pointer;font-size:1.35rem;font-weight:900;color:#10251a;background:linear-gradient(135deg,rgba(185,244,194,.97),rgba(228,246,183,.97));box-shadow:0 16px 36px rgba(18,62,38,.26);opacity:0;pointer-events:none;transform:translateY(16px) scale(.92);transition:opacity .18s ease,transform .18s ease,box-shadow .18s ease}.global-back-to-top.is-visible{opacity:1;pointer-events:auto;transform:translateY(0) scale(1)}.global-back-to-top:hover{box-shadow:0 20px 46px rgba(18,62,38,.34);transform:translateY(-2px) scale(1.02)}:root[data-theme="dark"] .global-back-to-top{color:#eaffee;background:linear-gradient(135deg,rgba(27,82,52,.98),rgba(63,102,50,.98));border-color:rgba(147,219,164,.28);box-shadow:0 18px 42px rgba(0,0,0,.44)}
.onboarding-modal{width:min(640px,calc(100vw - 2rem))}.onboarding-head{display:flex;gap:1rem;align-items:center;margin-bottom:.9rem}.onboarding-icon{width:58px;height:58px;border-radius:22px;display:grid;place-items:center;font-size:1.8rem;background:linear-gradient(135deg,rgba(170,235,178,.86),rgba(239,245,196,.9));box-shadow:0 14px 32px rgba(20,70,42,.18)}.onboarding-step{margin:0 0 .2rem;color:var(--text-light);font-weight:800;letter-spacing:.04em;text-transform:uppercase;font-size:.78rem}.onboarding-modal h2{margin:0;color:var(--green-deep);line-height:1.12}.onboarding-progress{height:9px;border-radius:999px;background:rgba(76,124,89,.12);overflow:hidden;margin:.4rem 0 1.1rem}.onboarding-progress span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--green-medium),#b7e88a);transition:width .2s ease}.onboarding-step-panel{display:none}.onboarding-step-panel.is-active{display:block;animation:fadeIn .18s ease}.onboarding-step-panel h3{margin:.2rem 0 .4rem;color:var(--green-deep)}.onboarding-step-panel p{color:var(--text-light);line-height:1.45;margin:.2rem 0 1rem}.onboarding-color-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.65rem;margin:.8rem 0}.onboarding-color{min-height:52px;border-radius:18px;border:2px solid transparent;background:var(--onboarding-color);cursor:pointer;box-shadow:inset 0 0 0 1px rgba(255,255,255,.28),0 12px 24px rgba(16,58,35,.15)}.onboarding-color.is-selected{border-color:#fff;outline:3px solid rgba(102,176,87,.42);transform:translateY(-1px)}.onboarding-color-custom{display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:18px;background:rgba(74,124,89,.08);color:var(--text-light);font-weight:700}.onboarding-color-custom input{width:52px;height:42px;border:0;background:transparent}.onboarding-notification-list{max-height:min(42vh,360px);overflow:auto;display:grid;gap:.55rem;padding-right:.15rem}.onboarding-theme-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem}.onboarding-theme{border:1px solid var(--green-pale);border-radius:22px;padding:1rem;background:var(--bg-card);cursor:pointer;display:grid;gap:.25rem;text-align:left;font-size:1.6rem;box-shadow:var(--shadow-sm);color:var(--text-main)}.onboarding-theme strong{font-size:1.05rem;color:var(--green-deep)}.onboarding-theme span{font-size:.9rem;color:var(--text-light)}.onboarding-theme.is-selected{outline:3px solid rgba(102,176,87,.28);border-color:var(--green-medium)}.onboarding-tutorial-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.onboarding-tutorial-grid div{padding:.9rem;border-radius:20px;background:rgba(74,124,89,.08);border:1px solid rgba(74,124,89,.12);display:grid;gap:.25rem}.onboarding-tutorial-grid span{color:var(--text-light);font-size:.92rem;line-height:1.38}.onboarding-actions{margin-top:1.1rem;display:flex;justify-content:flex-end;gap:.65rem;flex-wrap:wrap}:root[data-theme="dark"] .onboarding-icon{background:linear-gradient(135deg,rgba(47,124,75,.88),rgba(105,122,58,.88))}:root[data-theme="dark"] .onboarding-color-custom,:root[data-theme="dark"] .onboarding-tutorial-grid div{background:rgba(141,211,166,.08);border-color:rgba(141,211,166,.14)}.smartlife-blind-actions-v116{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem;margin-top:.85rem}.smartlife-blind-actions-v116 .btn{min-height:46px;border-radius:16px}@media(max-width:560px){.onboarding-modal{width:min(94vw,640px)}.onboarding-head{align-items:flex-start}.onboarding-theme-grid,.onboarding-tutorial-grid{grid-template-columns:1fr}.onboarding-actions .btn{flex:1 1 auto}}


/* v117 Mobile-Header und Onboarding-Feinschliff */

/* v173 compact mobile category sheet + notification inbox */
.mobile-nav-sheet-head.compact { margin-bottom: .7rem; }
.mobile-nav-sheet-head.compact h2 { margin-bottom: 0; }
.mobile-nav-sheet-head.compact .text-muted { display: none; }
.category-sheet .mobile-category-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: .52rem;
}
.category-sheet .mobile-category-link {
  min-height: 58px;
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .62rem .68rem;
  border-radius: 17px;
  text-decoration: none;
  color: var(--text-main);
  background: rgba(74,124,89,.07);
  border: 1px solid rgba(74,124,89,.13);
  box-shadow: 0 8px 20px rgba(30,70,44,.06);
}
.category-sheet .mobile-category-link span { font-size: 1.28rem; line-height: 1; }
.category-sheet .mobile-category-link strong {
  font-weight: 900;
  line-height: 1.05;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.notification-inbox-list {
  display: grid;
  gap: .62rem;
}
.notification-inbox-item {
  display: flex;
  gap: .72rem;
  align-items: flex-start;
  padding: .78rem;
  border-radius: 19px;
  text-decoration: none;
  color: var(--text-main);
  background: rgba(74,124,89,.07);
  border: 1px solid rgba(74,124,89,.14);
}
.notification-inbox-item-icon {
  width: 40px;
  height: 40px;
  border-radius: 15px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  background: rgba(133,188,32,.14);
}
.notification-inbox-item strong,
.notification-inbox-item small,
.notification-inbox-item time { display: block; }
.notification-inbox-item strong { font-weight: 900; line-height: 1.18; }
.notification-inbox-item small { color: var(--text-light); margin-top: .12rem; line-height: 1.3; }
.notification-inbox-item time { color: var(--text-light); opacity: .78; margin-top: .25rem; font-size: .78rem; font-weight: 750; }
.notification-inbox-empty {
  padding: 1rem;
  border-radius: 20px;
  text-align: center;
  background: rgba(74,124,89,.07);
  border: 1px dashed rgba(74,124,89,.18);
  color: var(--text-light);
}
.notification-inbox-empty span,
.notification-inbox-empty strong,
.notification-inbox-empty small { display: block; }
.notification-inbox-empty span { font-size: 1.6rem; margin-bottom: .25rem; }
.notification-inbox-empty strong { color: var(--text-main); }
:root[data-theme="dark"] .category-sheet .mobile-category-link,
:root[data-theme="dark"] .notification-inbox-item,
:root[data-theme="dark"] .notification-inbox-empty {
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.11);
  color: #f6fff8;
}
:root[data-theme="dark"] .category-sheet .mobile-category-link strong,
:root[data-theme="dark"] .notification-inbox-item strong,
:root[data-theme="dark"] .notification-inbox-empty strong { color: #f6fff8; }
:root[data-theme="dark"] .notification-inbox-item small,
:root[data-theme="dark"] .notification-inbox-item time { color: rgba(237,247,239,.70); }

@media (max-width: 900px) {
  .navbar {
    padding: max(.7rem, env(safe-area-inset-top)) 0 .74rem !important;
  }

  .navbar-inner {
    display: block !important;
  }

  .navbar-toprow {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: .65rem !important;
    width: 100% !important;
  }

  .navbar-brand {
    justify-self: start !important;
    min-width: 0 !important;
    max-width: calc(100vw - 190px) !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    gap: .48rem !important;
  }

  .navbar-brand-logo {
    width: 42px !important;
    height: 42px !important;
    flex: 0 0 42px !important;
  }

  .navbar-brand-wordmark {
    min-width: 0 !important;
    overflow: hidden !important;
    gap: .28rem !important;
  }

  .navbar-brand-main {
    font-size: clamp(1.15rem, 5vw, 1.55rem) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .navbar-brand-accent {
    font-size: clamp(1.02rem, 4.4vw, 1.35rem) !important;
  }

  .navbar-actions {
    justify-self: end !important;
    width: auto !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: .48rem !important;
  }

  .navbar-actions .nav-categories {
    order: 1 !important;
    width: auto !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    position: relative !important;
  }

  .navbar-actions .nav-user {
    order: 2 !important;
    flex: 0 0 auto !important;
    min-width: 0 !important;
    max-width: min(42vw, 165px) !important;
    padding: .38rem .5rem !important;
    border-radius: 18px !important;
  }

  .navbar-actions .nav-categories-summary {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    padding: 0 !important;
    border-radius: 17px !important;
    display: grid !important;
    place-items: center !important;
    box-shadow: var(--shadow-sm) !important;
  }

  .navbar-actions .nav-categories-summary::before {
    content: '☰';
    display: grid;
    place-items: center;
    font-size: 1.25rem;
    font-weight: 900;
    line-height: 1;
    color: var(--green-deep);
  }

  .navbar-actions .nav-categories-current,
  .navbar-actions .nav-categories-toggle {
    display: none !important;
  }

  .navbar-actions .nav-categories[open] .nav-links {
    position: fixed !important;
    left: .85rem !important;
    right: .85rem !important;
    top: calc(env(safe-area-inset-top) + 4.85rem) !important;
    z-index: 180 !important;
    max-height: min(72vh, 520px) !important;
    overflow: auto !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .7rem !important;
    padding: .85rem !important;
    border-radius: 24px !important;
    background: rgba(255,255,255,.96) !important;
    border: 1px solid var(--green-pale) !important;
    box-shadow: 0 24px 56px rgba(20,60,38,.25) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
  }

  :root[data-theme="dark"] .navbar-actions .nav-categories[open] .nav-links {
    background: rgba(8, 27, 18, .97) !important;
    border-color: rgba(143,211,168,.22) !important;
    box-shadow: 0 24px 56px rgba(0,0,0,.46) !important;
  }
}

@media (max-width: 420px) {
  .navbar-brand { max-width: calc(100vw - 172px) !important; }
  .navbar-brand-logo { width: 38px !important; height: 38px !important; flex-basis: 38px !important; }
  .navbar-brand-accent { display: none !important; }
  .navbar-actions { gap: .38rem !important; }
  .navbar-actions .nav-categories-summary { width: 42px !important; height: 42px !important; min-width: 42px !important; }
  .navbar-actions .nav-user { max-width: 128px !important; padding: .32rem .42rem !important; }
  .nav-user-avatar { width: 34px !important; height: 34px !important; }
  .nav-user-name { max-width: 66px !important; font-size: .86rem !important; }
}

.modal-backdrop-onboarding {
  z-index: 1250 !important;
}

.modal-content-onboarding,
.modal-content:has(.onboarding-modal) {
  width: min(640px, calc(100vw - 1.4rem)) !important;
  max-width: 640px !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  padding: 1.25rem !important;
}

.modal-content-onboarding .modal-close,
.modal-content:has(.onboarding-modal) .modal-close {
  top: .85rem !important;
  right: .85rem !important;
  z-index: 4 !important;
}

.onboarding-modal {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  max-height: min(82vh, 720px) !important;
  overflow: hidden !important;
}

.onboarding-body {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-right: .1rem !important;
  -webkit-overflow-scrolling: touch !important;
}

.onboarding-actions {
  flex: 0 0 auto !important;
  margin-top: .9rem !important;
  padding-top: .85rem !important;
  border-top: 1px solid rgba(116,176,92,.16) !important;
  background: linear-gradient(180deg, rgba(255,255,255,0), var(--bg-card) 28%) !important;
}

:root[data-theme="dark"] .onboarding-actions {
  background: linear-gradient(180deg, rgba(24,36,29,0), var(--bg-card) 28%) !important;
  border-top-color: rgba(143,211,168,.14) !important;
}

@media (max-width: 640px) {
  .modal-backdrop-onboarding,
  .modal-backdrop:has(.onboarding-modal) {
    padding: 0 !important;
    align-items: flex-end !important;
    justify-content: center !important;
  }

  .modal-content-onboarding,
  .modal-content:has(.onboarding-modal) {
    width: 100vw !important;
    max-width: 100vw !important;
    max-height: min(89dvh, 760px) !important;
    border-radius: 30px 30px 0 0 !important;
    padding: 1rem .95rem max(1rem, env(safe-area-inset-bottom)) !important;
    box-shadow: 0 -22px 58px rgba(0,0,0,.34) !important;
  }

  .onboarding-modal {
    max-height: calc(min(89dvh, 760px) - 1.2rem) !important;
  }

  .onboarding-head {
    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr) !important;
    gap: .8rem !important;
    align-items: center !important;
    margin: .2rem 3.2rem .72rem 0 !important;
  }

  .onboarding-icon {
    width: 46px !important;
    height: 46px !important;
    border-radius: 18px !important;
    font-size: 1.45rem !important;
  }

  .onboarding-step {
    font-size: .68rem !important;
    letter-spacing: .05em !important;
    margin-bottom: .12rem !important;
  }

  .onboarding-modal h2 {
    font-size: clamp(1.45rem, 7vw, 2.05rem) !important;
    line-height: 1.02 !important;
    letter-spacing: -.02em !important;
  }

  .onboarding-progress {
    height: 7px !important;
    margin: .2rem 0 .85rem !important;
  }

  .onboarding-step-panel h3 {
    font-size: 1.1rem !important;
    margin: 0 0 .25rem !important;
  }

  .onboarding-step-panel p {
    font-size: .94rem !important;
    line-height: 1.38 !important;
    margin: 0 0 .75rem !important;
  }

  .onboarding-color-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: .55rem !important;
    margin: .65rem 0 !important;
  }

  .onboarding-color {
    min-height: 42px !important;
    border-radius: 16px !important;
  }

  .onboarding-color-custom {
    padding: .62rem .7rem !important;
    border-radius: 16px !important;
    gap: .55rem !important;
    font-size: .92rem !important;
  }

  .onboarding-color-custom input {
    width: 44px !important;
    height: 34px !important;
  }

  .onboarding-notification-list {
    max-height: min(40dvh, 310px) !important;
    gap: .5rem !important;
  }

  .notification-toggle-card {
    padding: .72rem .78rem !important;
    border-radius: 17px !important;
  }

  .notification-toggle-card strong {
    font-size: .94rem !important;
  }

  .notification-toggle-card small {
    font-size: .8rem !important;
    line-height: 1.25 !important;
  }

  .onboarding-theme-grid,
  .onboarding-tutorial-grid {
    grid-template-columns: 1fr !important;
    gap: .58rem !important;
  }

  .onboarding-theme,
  .onboarding-tutorial-grid div {
    padding: .72rem .78rem !important;
    border-radius: 17px !important;
  }

  .onboarding-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: .55rem !important;
  }

  .onboarding-actions .btn {
    width: 100% !important;
    min-height: 48px !important;
    padding: .74rem .8rem !important;
    border-radius: 16px !important;
  }

  #onboarding-prev[style*="display: inline-flex"] ~ #onboarding-next,
  #onboarding-prev:not([style*="display: none"]) {
    grid-column: auto !important;
  }
}

/* v117 fallback ohne :has für ältere WebViews */
.modal-content-onboarding { width: min(640px, calc(100vw - 1.4rem)) !important; max-width: 640px !important; overflow: hidden !important; box-sizing: border-box !important; padding: 1.25rem !important; }
.modal-content-onboarding .modal-close { top: .85rem !important; right: .85rem !important; z-index: 4 !important; }
@media (max-width:640px){ .modal-backdrop-onboarding { padding:0 !important; align-items:flex-end !important; justify-content:center !important; } .modal-content-onboarding { width:100vw !important; max-width:100vw !important; max-height:min(89dvh,760px) !important; border-radius:30px 30px 0 0 !important; padding:1rem .95rem max(1rem, env(safe-area-inset-bottom)) !important; box-shadow:0 -22px 58px rgba(0,0,0,.34) !important; } }

/* v118 Mobile-Header: Logo links, Kategorien + Profil rechts, kompakter */

/* v173 compact mobile category sheet + notification inbox */
.mobile-nav-sheet-head.compact { margin-bottom: .7rem; }
.mobile-nav-sheet-head.compact h2 { margin-bottom: 0; }
.mobile-nav-sheet-head.compact .text-muted { display: none; }
.category-sheet .mobile-category-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: .52rem;
}
.category-sheet .mobile-category-link {
  min-height: 58px;
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .62rem .68rem;
  border-radius: 17px;
  text-decoration: none;
  color: var(--text-main);
  background: rgba(74,124,89,.07);
  border: 1px solid rgba(74,124,89,.13);
  box-shadow: 0 8px 20px rgba(30,70,44,.06);
}
.category-sheet .mobile-category-link span { font-size: 1.28rem; line-height: 1; }
.category-sheet .mobile-category-link strong {
  font-weight: 900;
  line-height: 1.05;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.notification-inbox-list {
  display: grid;
  gap: .62rem;
}
.notification-inbox-item {
  display: flex;
  gap: .72rem;
  align-items: flex-start;
  padding: .78rem;
  border-radius: 19px;
  text-decoration: none;
  color: var(--text-main);
  background: rgba(74,124,89,.07);
  border: 1px solid rgba(74,124,89,.14);
}
.notification-inbox-item-icon {
  width: 40px;
  height: 40px;
  border-radius: 15px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  background: rgba(133,188,32,.14);
}
.notification-inbox-item strong,
.notification-inbox-item small,
.notification-inbox-item time { display: block; }
.notification-inbox-item strong { font-weight: 900; line-height: 1.18; }
.notification-inbox-item small { color: var(--text-light); margin-top: .12rem; line-height: 1.3; }
.notification-inbox-item time { color: var(--text-light); opacity: .78; margin-top: .25rem; font-size: .78rem; font-weight: 750; }
.notification-inbox-empty {
  padding: 1rem;
  border-radius: 20px;
  text-align: center;
  background: rgba(74,124,89,.07);
  border: 1px dashed rgba(74,124,89,.18);
  color: var(--text-light);
}
.notification-inbox-empty span,
.notification-inbox-empty strong,
.notification-inbox-empty small { display: block; }
.notification-inbox-empty span { font-size: 1.6rem; margin-bottom: .25rem; }
.notification-inbox-empty strong { color: var(--text-main); }
:root[data-theme="dark"] .category-sheet .mobile-category-link,
:root[data-theme="dark"] .notification-inbox-item,
:root[data-theme="dark"] .notification-inbox-empty {
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.11);
  color: #f6fff8;
}
:root[data-theme="dark"] .category-sheet .mobile-category-link strong,
:root[data-theme="dark"] .notification-inbox-item strong,
:root[data-theme="dark"] .notification-inbox-empty strong { color: #f6fff8; }
:root[data-theme="dark"] .notification-inbox-item small,
:root[data-theme="dark"] .notification-inbox-item time { color: rgba(237,247,239,.70); }

@media (max-width: 900px) {
  .navbar {
    padding: max(.42rem, env(safe-area-inset-top)) 0 .48rem !important;
    min-height: 0 !important;
  }

  .navbar .container,
  .navbar-inner {
    padding-left: .82rem !important;
    padding-right: .82rem !important;
  }

  .navbar-inner {
    display: block !important;
  }

  .navbar-toprow {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: .55rem !important;
    width: 100% !important;
    min-height: 48px !important;
    padding-right: 0 !important;
    direction: ltr !important;
  }

  .navbar-brand {
    order: 1 !important;
    flex: 0 1 auto !important;
    justify-self: auto !important;
    margin-right: auto !important;
    max-width: min(41vw, 150px) !important;
    min-width: 0 !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    gap: .36rem !important;
  }

  .navbar-brand-logo {
    width: 34px !important;
    height: 34px !important;
    flex: 0 0 34px !important;
  }

  .navbar-brand-wordmark {
    min-width: 0 !important;
    overflow: hidden !important;
    gap: .18rem !important;
  }

  .navbar-brand-main {
    font-size: clamp(1.08rem, 4.4vw, 1.32rem) !important;
    line-height: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .navbar-brand-accent {
    display: none !important;
  }

  .navbar-actions {
    order: 2 !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    margin-left: auto !important;
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: .42rem !important;
  }

  .navbar-actions .nav-categories {
    order: 1 !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    position: relative !important;
  }

  .navbar-actions .nav-user {
    order: 2 !important;
    flex: 0 0 auto !important;
    min-width: 0 !important;
    max-width: min(43vw, 142px) !important;
    min-height: 42px !important;
    padding: .28rem .42rem !important;
    border-radius: 16px !important;
  }

  .navbar-actions .nav-categories-summary {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    border-radius: 16px !important;
    display: grid !important;
    place-items: center !important;
  }

  .navbar-actions .nav-categories-summary::before {
    content: '☰' !important;
    display: grid !important;
    place-items: center !important;
    font-size: 1.12rem !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    color: var(--green-deep) !important;
  }

  .nav-user-avatar {
    width: 34px !important;
    height: 34px !important;
    flex: 0 0 34px !important;
  }

  .nav-user-text {
    min-width: 0 !important;
  }

  .nav-user-name {
    max-width: 72px !important;
    font-size: .84rem !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .nav-user-subtitle {
    display: none !important;
  }

  .navbar-actions .nav-categories-current,
  .navbar-actions .nav-categories-toggle {
    display: none !important;
  }

  .navbar-actions .nav-categories[open] .nav-links {
    position: fixed !important;
    left: .75rem !important;
    right: .75rem !important;
    top: calc(env(safe-area-inset-top) + 3.65rem) !important;
    z-index: 180 !important;
  }
}

@media (max-width: 380px) {
  .navbar .container,
  .navbar-inner {
    padding-left: .68rem !important;
    padding-right: .68rem !important;
  }
  .navbar-brand {
    max-width: 42px !important;
  }
  .navbar-brand-wordmark {
    display: none !important;
  }
  .navbar-actions {
    gap: .34rem !important;
  }
  .navbar-actions .nav-categories-summary {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
  }
  .navbar-actions .nav-user {
    max-width: 132px !important;
  }
}

/* v118 Onboarding bleibt auf Mobile sauber innerhalb des Bildschirms */
@media (max-width: 640px) {
  .modal-content-onboarding,
  .modal-content:has(.onboarding-modal) {
    width: min(100vw, 100%) !important;
    max-width: 100vw !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  .onboarding-modal {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .onboarding-body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  .onboarding-color-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .onboarding-actions {
    position: sticky !important;
    bottom: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
}


/* v121 Mobile-Header: FamilieZuhause sichtbar, Hamburger exakt mittig, Profilpunkt im Darkmode ruhiger */

/* v173 compact mobile category sheet + notification inbox */
.mobile-nav-sheet-head.compact { margin-bottom: .7rem; }
.mobile-nav-sheet-head.compact h2 { margin-bottom: 0; }
.mobile-nav-sheet-head.compact .text-muted { display: none; }
.category-sheet .mobile-category-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: .52rem;
}
.category-sheet .mobile-category-link {
  min-height: 58px;
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .62rem .68rem;
  border-radius: 17px;
  text-decoration: none;
  color: var(--text-main);
  background: rgba(74,124,89,.07);
  border: 1px solid rgba(74,124,89,.13);
  box-shadow: 0 8px 20px rgba(30,70,44,.06);
}
.category-sheet .mobile-category-link span { font-size: 1.28rem; line-height: 1; }
.category-sheet .mobile-category-link strong {
  font-weight: 900;
  line-height: 1.05;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.notification-inbox-list {
  display: grid;
  gap: .62rem;
}
.notification-inbox-item {
  display: flex;
  gap: .72rem;
  align-items: flex-start;
  padding: .78rem;
  border-radius: 19px;
  text-decoration: none;
  color: var(--text-main);
  background: rgba(74,124,89,.07);
  border: 1px solid rgba(74,124,89,.14);
}
.notification-inbox-item-icon {
  width: 40px;
  height: 40px;
  border-radius: 15px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  background: rgba(133,188,32,.14);
}
.notification-inbox-item strong,
.notification-inbox-item small,
.notification-inbox-item time { display: block; }
.notification-inbox-item strong { font-weight: 900; line-height: 1.18; }
.notification-inbox-item small { color: var(--text-light); margin-top: .12rem; line-height: 1.3; }
.notification-inbox-item time { color: var(--text-light); opacity: .78; margin-top: .25rem; font-size: .78rem; font-weight: 750; }
.notification-inbox-empty {
  padding: 1rem;
  border-radius: 20px;
  text-align: center;
  background: rgba(74,124,89,.07);
  border: 1px dashed rgba(74,124,89,.18);
  color: var(--text-light);
}
.notification-inbox-empty span,
.notification-inbox-empty strong,
.notification-inbox-empty small { display: block; }
.notification-inbox-empty span { font-size: 1.6rem; margin-bottom: .25rem; }
.notification-inbox-empty strong { color: var(--text-main); }
:root[data-theme="dark"] .category-sheet .mobile-category-link,
:root[data-theme="dark"] .notification-inbox-item,
:root[data-theme="dark"] .notification-inbox-empty {
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.11);
  color: #f6fff8;
}
:root[data-theme="dark"] .category-sheet .mobile-category-link strong,
:root[data-theme="dark"] .notification-inbox-item strong,
:root[data-theme="dark"] .notification-inbox-empty strong { color: #f6fff8; }
:root[data-theme="dark"] .notification-inbox-item small,
:root[data-theme="dark"] .notification-inbox-item time { color: rgba(237,247,239,.70); }

@media (max-width: 900px) {
  .navbar {
    padding: max(.34rem, env(safe-area-inset-top)) 0 .38rem !important;
  }

  .navbar .container,
  .navbar-inner {
    padding-left: .7rem !important;
    padding-right: .7rem !important;
  }

  .navbar-toprow {
    min-height: 42px !important;
    gap: .44rem !important;
  }

  .navbar-brand {
    max-width: clamp(142px, 41vw, 210px) !important;
    gap: .34rem !important;
  }

  .navbar-brand-logo {
    width: 32px !important;
    height: 32px !important;
    flex: 0 0 32px !important;
  }

  .navbar-brand-wordmark {
    display: inline-flex !important;
    align-items: baseline !important;
    gap: 0 !important;
    min-width: 0 !important;
    overflow: hidden !important;
    white-space: nowrap !important;
  }

  .navbar-brand-main,
  .navbar-brand-accent {
    display: inline-block !important;
    font-family: var(--font-display) !important;
    font-style: normal !important;
    font-weight: 800 !important;
    font-size: clamp(1.04rem, 4.1vw, 1.34rem) !important;
    line-height: .96 !important;
    letter-spacing: -0.03em !important;
    color: var(--green-deep) !important;
  }

  .navbar-brand-accent {
    color: var(--green-deep) !important;
  }

  :root[data-theme="dark"] .navbar-brand-main,
  :root[data-theme="dark"] .navbar-brand-accent {
    color: #f6fff5 !important;
    text-shadow: 0 1px 12px rgba(179, 244, 187, .10) !important;
  }

  .navbar-actions {
    gap: .36rem !important;
  }

  .navbar-actions .nav-categories-summary {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    border-radius: 15px !important;
    display: block !important;
    position: relative !important;
    overflow: hidden !important;
    line-height: 0 !important;
    color: transparent !important;
  }

  .navbar-actions .nav-categories-summary::-webkit-details-marker {
    display: none !important;
  }

  .navbar-actions .nav-categories-summary::marker {
    content: '' !important;
  }

  .navbar-actions .nav-categories-summary > span {
    display: none !important;
  }

  .navbar-actions .nav-categories-summary::before {
    content: '' !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: 18px !important;
    height: 14px !important;
    transform: translate(-50%, -50%) !important;
    display: block !important;
    color: var(--green-deep) !important;
    background:
      linear-gradient(currentColor, currentColor) 0 0 / 100% 3px no-repeat,
      linear-gradient(currentColor, currentColor) 0 50% / 100% 3px no-repeat,
      linear-gradient(currentColor, currentColor) 0 100% / 100% 3px no-repeat !important;
    border-radius: 999px !important;
  }

  :root[data-theme="dark"] .navbar-actions .nav-categories-summary::before {
    color: rgba(248, 255, 246, .95) !important;
    filter: drop-shadow(0 0 5px rgba(197, 224, 204, .12)) !important;
  }

  .navbar-actions .nav-user {
    max-width: min(43vw, 146px) !important;
    min-height: 40px !important;
    padding: .24rem .4rem !important;
    border-radius: 15px !important;
  }

  .nav-user-avatar {
    width: 32px !important;
    height: 32px !important;
    flex: 0 0 32px !important;
  }

  .nav-user-name {
    max-width: 70px !important;
    font-size: .84rem !important;
  }
}

@media (max-width: 430px) {
  .navbar-brand {
    max-width: clamp(128px, 38vw, 170px) !important;
  }

  .navbar-brand-logo {
    width: 30px !important;
    height: 30px !important;
    flex-basis: 30px !important;
  }

  .navbar-brand-main,
  .navbar-brand-accent {
    font-size: clamp(.98rem, 3.9vw, 1.18rem) !important;
  }

  .navbar-actions .nav-user {
    max-width: min(42vw, 132px) !important;
  }
}

@media (max-width: 360px) {
  .navbar-brand {
    max-width: 116px !important;
  }
  .navbar-brand-main,
  .navbar-brand-accent {
    font-size: .92rem !important;
  }
  .navbar-actions .nav-user {
    max-width: 116px !important;
  }
  .nav-user-name {
    max-width: 55px !important;
  }
}

.nav-color-dot {
  box-shadow: none !important;
  border: 1px solid rgba(255,255,255,.32) !important;
}

:root[data-theme="dark"] .nav-color-dot {
  box-shadow: 0 0 0 1px rgba(153, 227, 177, .16), 0 0 12px color-mix(in srgb, var(--member-color) 36%, transparent) !important;
  border: 1px solid rgba(178, 245, 197, .10) !important;
}

:root[data-theme="dark"] .nav-user-name .nav-color-dot {
  background: var(--member-color) !important;
}

/* v122 Mobile-Header: schöneres Kategorien-Symbol + FamilieZuhause ohne unschöne Auslassung */

/* v173 compact mobile category sheet + notification inbox */
.mobile-nav-sheet-head.compact { margin-bottom: .7rem; }
.mobile-nav-sheet-head.compact h2 { margin-bottom: 0; }
.mobile-nav-sheet-head.compact .text-muted { display: none; }
.category-sheet .mobile-category-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: .52rem;
}
.category-sheet .mobile-category-link {
  min-height: 58px;
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .62rem .68rem;
  border-radius: 17px;
  text-decoration: none;
  color: var(--text-main);
  background: rgba(74,124,89,.07);
  border: 1px solid rgba(74,124,89,.13);
  box-shadow: 0 8px 20px rgba(30,70,44,.06);
}
.category-sheet .mobile-category-link span { font-size: 1.28rem; line-height: 1; }
.category-sheet .mobile-category-link strong {
  font-weight: 900;
  line-height: 1.05;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.notification-inbox-list {
  display: grid;
  gap: .62rem;
}
.notification-inbox-item {
  display: flex;
  gap: .72rem;
  align-items: flex-start;
  padding: .78rem;
  border-radius: 19px;
  text-decoration: none;
  color: var(--text-main);
  background: rgba(74,124,89,.07);
  border: 1px solid rgba(74,124,89,.14);
}
.notification-inbox-item-icon {
  width: 40px;
  height: 40px;
  border-radius: 15px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  background: rgba(133,188,32,.14);
}
.notification-inbox-item strong,
.notification-inbox-item small,
.notification-inbox-item time { display: block; }
.notification-inbox-item strong { font-weight: 900; line-height: 1.18; }
.notification-inbox-item small { color: var(--text-light); margin-top: .12rem; line-height: 1.3; }
.notification-inbox-item time { color: var(--text-light); opacity: .78; margin-top: .25rem; font-size: .78rem; font-weight: 750; }
.notification-inbox-empty {
  padding: 1rem;
  border-radius: 20px;
  text-align: center;
  background: rgba(74,124,89,.07);
  border: 1px dashed rgba(74,124,89,.18);
  color: var(--text-light);
}
.notification-inbox-empty span,
.notification-inbox-empty strong,
.notification-inbox-empty small { display: block; }
.notification-inbox-empty span { font-size: 1.6rem; margin-bottom: .25rem; }
.notification-inbox-empty strong { color: var(--text-main); }
:root[data-theme="dark"] .category-sheet .mobile-category-link,
:root[data-theme="dark"] .notification-inbox-item,
:root[data-theme="dark"] .notification-inbox-empty {
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.11);
  color: #f6fff8;
}
:root[data-theme="dark"] .category-sheet .mobile-category-link strong,
:root[data-theme="dark"] .notification-inbox-item strong,
:root[data-theme="dark"] .notification-inbox-empty strong { color: #f6fff8; }
:root[data-theme="dark"] .notification-inbox-item small,
:root[data-theme="dark"] .notification-inbox-item time { color: rgba(237,247,239,.70); }

@media (max-width: 900px) {
  .navbar {
    padding: max(.34rem, env(safe-area-inset-top)) 0 .38rem !important;
  }

  .navbar-toprow {
    min-height: 42px !important;
    gap: .42rem !important;
  }

  .navbar-brand {
    flex: 0 1 clamp(138px, 39vw, 190px) !important;
    max-width: clamp(138px, 39vw, 190px) !important;
    min-width: 0 !important;
    gap: .32rem !important;
    overflow: visible !important;
  }

  .navbar-brand-logo {
    width: 31px !important;
    height: 31px !important;
    flex: 0 0 31px !important;
  }

  .navbar-brand-wordmark {
    display: inline-flex !important;
    align-items: baseline !important;
    min-width: 0 !important;
    max-width: none !important;
    overflow: visible !important;
    white-space: nowrap !important;
    flex: 0 1 auto !important;
  }

  .navbar-brand-main,
  .navbar-brand-accent {
    display: inline-block !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    font-size: clamp(.9rem, 3.45vw, 1.12rem) !important;
    letter-spacing: -0.045em !important;
    line-height: .96 !important;
  }

  .navbar-actions {
    flex: 0 0 auto !important;
    gap: .34rem !important;
  }

  .navbar-actions .nav-categories-summary {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    border-radius: 16px !important;
    display: grid !important;
    place-items: center !important;
    position: relative !important;
    overflow: hidden !important;
    line-height: 0 !important;
    color: transparent !important;
    background: linear-gradient(145deg, rgba(255,255,255,.78), rgba(226,246,218,.62)) !important;
    border: 1px solid rgba(92, 143, 35, .22) !important;
    box-shadow: 0 10px 24px rgba(45, 91, 35, .12), inset 0 1px 0 rgba(255,255,255,.72) !important;
  }

  :root[data-theme="dark"] .navbar-actions .nav-categories-summary {
    background: linear-gradient(145deg, rgba(14, 48, 32, .96), rgba(19, 70, 45, .82)) !important;
    border-color: rgba(162, 230, 176, .18) !important;
    box-shadow: 0 14px 30px rgba(0,0,0,.24), inset 0 1px 0 rgba(234,255,238,.08) !important;
  }

  .navbar-actions .nav-categories-summary::-webkit-details-marker { display: none !important; }
  .navbar-actions .nav-categories-summary::marker { content: '' !important; }
  .navbar-actions .nav-categories-summary > span { display: none !important; }

  .navbar-actions .nav-categories-summary::before {
    content: '' !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: 18px !important;
    height: 3px !important;
    transform: translate(-50%, -50%) !important;
    display: block !important;
    border-radius: 999px !important;
    background: var(--green-deep) !important;
    box-shadow: 0 -6px 0 var(--green-deep), 0 6px 0 var(--green-deep) !important;
    opacity: .96 !important;
  }

  :root[data-theme="dark"] .navbar-actions .nav-categories-summary::before {
    background: rgba(247,255,245,.96) !important;
    box-shadow: 0 -6px 0 rgba(247,255,245,.96), 0 6px 0 rgba(247,255,245,.96), 0 0 10px rgba(179,244,187,.12) !important;
  }

  .navbar-actions .nav-user {
    max-width: min(41vw, 142px) !important;
  }

  .nav-user-name {
    max-width: 66px !important;
  }
}

@media (max-width: 430px) {
  .navbar .container,
  .navbar-inner {
    padding-left: .62rem !important;
    padding-right: .62rem !important;
  }

  .navbar-brand {
    flex-basis: clamp(126px, 37vw, 152px) !important;
    max-width: clamp(126px, 37vw, 152px) !important;
    gap: .26rem !important;
  }

  .navbar-brand-logo {
    width: 28px !important;
    height: 28px !important;
    flex-basis: 28px !important;
  }

  .navbar-brand-main,
  .navbar-brand-accent {
    font-size: clamp(.78rem, 3.22vw, .96rem) !important;
    letter-spacing: -0.052em !important;
  }

  .navbar-actions .nav-categories-summary {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    border-radius: 15px !important;
  }

  .navbar-actions .nav-categories-summary::before {
    width: 17px !important;
    height: 2.5px !important;
    box-shadow: 0 -5.5px 0 var(--green-deep), 0 5.5px 0 var(--green-deep) !important;
  }

  :root[data-theme="dark"] .navbar-actions .nav-categories-summary::before {
    box-shadow: 0 -5.5px 0 rgba(247,255,245,.96), 0 5.5px 0 rgba(247,255,245,.96), 0 0 10px rgba(179,244,187,.12) !important;
  }

  .navbar-actions .nav-user {
    max-width: min(40vw, 130px) !important;
  }

  .nav-user-name {
    max-width: 60px !important;
  }
}

@media (max-width: 360px) {
  .navbar-brand {
    flex-basis: 112px !important;
    max-width: 112px !important;
  }

  .navbar-brand-logo {
    width: 24px !important;
    height: 24px !important;
    flex-basis: 24px !important;
  }

  .navbar-brand-main,
  .navbar-brand-accent {
    font-size: .68rem !important;
    letter-spacing: -0.055em !important;
  }

  .navbar-actions {
    gap: .26rem !important;
  }

  .navbar-actions .nav-user {
    max-width: 112px !important;
  }

  .nav-user-name {
    max-width: 50px !important;
  }
}


/* v123 Lucy & Phillip link card */
.lucy-link-card code {
  padding: .15rem .35rem;
  border-radius: .45rem;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.12);
}
[data-theme="light"] .lucy-link-card code { background: rgba(23,86,55,.08); border-color: rgba(23,86,55,.12); }

/* v130 - externe Webseiten als PWA-Kategorien */
.external-website-tile {
  position: relative;
  overflow: hidden;
}
.external-website-tile::after {
  content: 'PWA';
  position: absolute;
  top: 0.85rem;
  right: 0.85rem;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  padding: 0.22rem 0.48rem;
  border-radius: 999px;
  background: rgba(133, 188, 32, 0.14);
  border: 1px solid rgba(133, 188, 32, 0.24);
  color: var(--primary-dark, #4f7413);
}
.external-site-body {
  margin: 0;
  min-height: 100vh;
  overflow: hidden;
  background: var(--bg, #f5f8ef);
}
.external-site-shell,
.external-site-shell iframe {
  width: 100vw;
  height: 100vh;
  border: 0;
}
.external-site-shell iframe {
  display: none;
  background: #fff;
}
.external-site-back {
  position: fixed;
  left: max(0.9rem, env(safe-area-inset-left));
  bottom: max(0.9rem, env(safe-area-inset-bottom));
  z-index: 9999;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.72rem 1rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(133, 188, 32, 0.28);
  box-shadow: 0 14px 35px rgba(44, 74, 20, 0.18);
  color: var(--text, #1e2b16);
  text-decoration: none;
  font-weight: 800;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.external-site-back:hover { transform: translateY(-1px); }
.external-site-error {
  position: fixed;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
  width: min(92vw, 520px);
  z-index: 4;
}
.external-site-admin-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
  gap: 1rem;
}
.external-site-form,
.external-site-list {
  border: 1px solid rgba(133, 188, 32, 0.16);
  background: rgba(255,255,255,0.55);
  border-radius: 1.25rem;
  padding: 1rem;
}
.external-site-list { display: grid; gap: 0.75rem; }
.external-site-row {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  align-items: center;
  padding: 0.8rem;
  border-radius: 1rem;
  background: rgba(133, 188, 32, 0.08);
  border: 1px solid rgba(133, 188, 32, 0.14);
}
.external-site-row p { margin: 0.25rem 0; color: var(--muted, #6f7c65); }
html[data-theme="dark"] .external-site-back {
  background: rgba(20, 28, 18, 0.78);
  color: #eef8e7;
  border-color: rgba(133, 188, 32, 0.34);
}
html[data-theme="dark"] .external-site-form,
html[data-theme="dark"] .external-site-list {
  background: rgba(16, 24, 16, 0.72);
}
@media (max-width: 780px) {
  .external-site-admin-grid { grid-template-columns: 1fr; }
  .external-site-row { align-items: flex-start; flex-direction: column; }
  .external-site-back { padding: 0.68rem 0.9rem; font-size: 0.92rem; }
}


/* v131: externe Webseiten Adminbereich schöner + direkte Nutzerfreigabe */
.external-site-admin-hero {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  margin-bottom: 1rem;
  border-radius: 1.35rem;
  border: 1px solid rgba(133, 188, 32, 0.18);
  background: linear-gradient(135deg, rgba(133,188,32,0.16), rgba(255,255,255,0.66));
  box-shadow: 0 16px 40px rgba(44, 74, 20, 0.08);
}
.external-site-admin-hero-icon {
  width: 3rem;
  height: 3rem;
  display: grid;
  place-items: center;
  border-radius: 1rem;
  background: rgba(133, 188, 32, 0.18);
  font-size: 1.5rem;
}
.external-site-admin-hero p { margin: 0.2rem 0 0; color: var(--muted, #6f7c65); }
.external-site-count-pill {
  margin-left: auto;
  white-space: nowrap;
  padding: 0.42rem 0.7rem;
  border-radius: 999px;
  background: rgba(133, 188, 32, 0.16);
  border: 1px solid rgba(133, 188, 32, 0.2);
  font-weight: 800;
  color: var(--primary-dark, #4f7413);
}
.external-site-admin-grid.enhanced { align-items: start; }
.external-site-form-pretty,
.external-site-list-pretty {
  background: rgba(255,255,255,0.72);
  box-shadow: 0 18px 50px rgba(44, 74, 20, 0.08);
}
.external-site-form-head h3 { margin: 0.25rem 0; }
.external-site-form-head p { margin: 0 0 0.8rem; }
.external-site-form-badge {
  display: inline-flex;
  padding: 0.25rem 0.55rem;
  border-radius: 999px;
  background: rgba(133,188,32,0.14);
  border: 1px solid rgba(133,188,32,0.2);
  font-size: 0.75rem;
  font-weight: 800;
  color: var(--primary-dark, #4f7413);
}
.external-site-enabled-card { background: rgba(133,188,32,0.08); border-radius: 1rem; }
.external-site-member-box {
  margin-top: 0.9rem;
  padding: 0.9rem;
  border-radius: 1.1rem;
  border: 1px dashed rgba(133,188,32,0.28);
  background: rgba(133,188,32,0.06);
}
.external-site-member-box-head { display:flex; justify-content:space-between; gap:0.75rem; align-items:flex-start; margin-bottom:0.7rem; }
.external-site-member-box-head small { color: var(--muted, #6f7c65); }
.external-site-member-grid { display:flex; flex-wrap:wrap; gap:0.5rem; }
.external-site-member-chip {
  display:inline-flex;
  align-items:center;
  gap:0.4rem;
  padding:0.48rem 0.65rem;
  border-radius:999px;
  border:1px solid rgba(133,188,32,0.22);
  background:rgba(255,255,255,0.68);
  font-weight:700;
  cursor:pointer;
}
.external-site-member-chip input { accent-color: var(--primary, #85bc20); }
.external-site-list-head { display:flex; justify-content:space-between; gap:0.7rem; align-items:flex-start; margin-bottom:0.7rem; }
.external-site-list-head small { color: var(--muted, #6f7c65); }
.external-site-row.is-disabled { opacity: 0.72; filter: grayscale(0.25); }
.external-site-row-main { display:flex; gap:0.75rem; align-items:flex-start; min-width:0; }
.external-site-row-icon { width:2.4rem; height:2.4rem; border-radius:0.9rem; display:grid; place-items:center; background:rgba(255,255,255,0.66); font-size:1.25rem; flex:0 0 auto; }
.external-site-row-actions { display:flex; align-items:center; gap:0.45rem; flex-wrap:wrap; justify-content:flex-end; }
.external-site-mini-toggle { display:inline-flex; align-items:center; gap:0.35rem; padding:0.42rem 0.55rem; border-radius:999px; border:1px solid rgba(133,188,32,0.2); background:rgba(255,255,255,0.7); font-weight:800; }
.external-site-mini-toggle input { accent-color: var(--primary, #85bc20); }
.external-site-back span { font-size: 1.05rem; line-height: 1; }
html[data-theme="dark"] .external-site-admin-hero,
html[data-theme="dark"] .external-site-form-pretty,
html[data-theme="dark"] .external-site-list-pretty,
html[data-theme="dark"] .external-site-member-chip,
html[data-theme="dark"] .external-site-mini-toggle {
  background: rgba(16, 24, 16, 0.78);
  border-color: rgba(133,188,32,0.24);
}
html[data-theme="dark"] .external-site-member-box { background: rgba(133,188,32,0.09); }
html[data-theme="dark"] .external-site-row-icon { background: rgba(255,255,255,0.08); }
@media (max-width: 780px) {
  .external-site-admin-hero { align-items:flex-start; flex-wrap:wrap; }
  .external-site-count-pill { margin-left:0; }
  .external-site-member-box-head, .external-site-list-head { flex-direction:column; }
  .external-site-row-actions { justify-content:flex-start; }
  .external-site-back { max-width: calc(100vw - 1.8rem); }
}

/* v133: Externe-Webseiten Zurück-Button kleiner, nur Icon */
.external-site-back {
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  min-height: 46px !important;
  padding: 0 !important;
  justify-content: center !important;
  gap: 0 !important;
  border-radius: 999px !important;
  font-size: 0 !important;
  background: rgba(255,255,255,0.72) !important;
  border: 1px solid rgba(133,188,32,0.32) !important;
  box-shadow: 0 10px 26px rgba(20, 48, 23, 0.20) !important;
}
.external-site-back span {
  font-size: 1.25rem !important;
  line-height: 1 !important;
  transform: translateY(-1px);
}
.external-site-back:hover,
.external-site-back:focus-visible {
  transform: translateY(-2px) scale(1.03) !important;
}
@media (max-width: 780px) {
  .external-site-back {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    left: max(0.75rem, env(safe-area-inset-left)) !important;
    bottom: max(0.75rem, env(safe-area-inset-bottom)) !important;
  }
  .external-site-back span { font-size: 1.15rem !important; }
}
html[data-theme="dark"] .external-site-back {
  background: rgba(14, 28, 18, 0.74) !important;
  border-color: rgba(133,188,32,0.38) !important;
}


/* v143: Zurück-Button auf externen Webseiten höher setzen, damit er keine Inhalte/Gestenleiste blockiert */
.external-site-back {
  bottom: calc(max(0.9rem, env(safe-area-inset-bottom)) + 3.2rem) !important;
}
@media (max-width: 780px) {
  .external-site-back {
    bottom: calc(max(0.75rem, env(safe-area-inset-bottom)) + 4.6rem) !important;
  }
}

/* v145: Externe Webseiten werden vor dem Anzeigen serverseitig geprüft; die alte Lucy-Seite leitet nur noch weiter. */
.external-site-loading-note {
  font-size: 0.9rem;
  opacity: 0.8;
}

/* v161: Onboarding ohne Später-Button + Profilbild/Beschreibung + verschiebbarer Home-Button */
.onboarding-actions-clean {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  align-items: center !important;
}
.onboarding-actions-clean.is-first-step {
  grid-template-columns: 1fr !important;
}
.onboarding-actions-clean.is-first-step #onboarding-next {
  width: 100% !important;
}
.onboarding-profile-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: .85rem;
  align-items: center;
  padding: .85rem;
  border-radius: 22px;
  border: 1px solid rgba(74,124,89,.14);
  background: rgba(74,124,89,.07);
  margin: .75rem 0 .85rem;
}
.onboarding-avatar-preview {
  width: 74px;
  height: 74px;
  border-radius: 26px;
  display: grid;
  place-items: center;
  overflow: hidden;
  color: #fff;
  font-weight: 900;
  font-size: 1.6rem;
  background: var(--member-color, #4a7c59);
  box-shadow: 0 16px 34px rgba(20,60,38,.16);
}
.onboarding-avatar-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.onboarding-profile-actions {
  display: flex;
  gap: .55rem;
  flex-wrap: wrap;
}
.onboarding-profile-actions .btn {
  min-height: 42px;
}
.onboarding-about-field {
  margin-top: .4rem;
}
.onboarding-about-field textarea {
  resize: vertical;
  min-height: 104px;
}
.external-site-back {
  bottom: calc(max(0.9rem, env(safe-area-inset-bottom)) + 3.9rem) !important;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
}
.external-site-back.is-dragging {
  cursor: grabbing !important;
  transform: scale(1.08) !important;
  box-shadow: 0 20px 46px rgba(20, 48, 23, 0.32) !important;
  opacity: .96;
}
@media (max-width: 640px) {
  .onboarding-profile-card {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
    border-radius: 19px;
    padding: .8rem;
  }
  .onboarding-profile-actions {
    justify-content: center;
    width: 100%;
  }
  .onboarding-profile-actions .btn {
    flex: 1 1 160px;
  }
  .external-site-back {
    bottom: calc(max(0.75rem, env(safe-area-inset-bottom)) + 5.2rem) !important;
  }
}
:root[data-theme="dark"] .onboarding-profile-card {
  background: rgba(141,211,166,.08);
  border-color: rgba(141,211,166,.14);
}


/* v162: Externes Haus als echter Touch-/Drag-Button, ohne Chrome-Linkmenü beim langen Drücken */
.external-site-back {
  appearance: none !important;
  -webkit-appearance: none !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  touch-action: none !important;
  user-select: none !important;
  -webkit-user-select: none !important;
  -webkit-touch-callout: none !important;
  -webkit-tap-highlight-color: transparent !important;
  line-height: 1 !important;
}
.external-site-back:active {
  transform: scale(.98) !important;
}
.external-site-back.is-dragging {
  cursor: grabbing !important;
  transform: scale(1.08) !important;
}


/* v177-sheet-inbox-fix */
.toast-root .alert { max-width: min(92vw, 560px); }
.alert-stack-count { display: inline-flex; align-items: center; justify-content: center; min-width: 1.8rem; margin-left: .55rem; padding: .12rem .45rem; border-radius: 999px; background: rgba(255,255,255,.22); font-weight: 800; }
.alert-stacked-bump { animation: toastStackBump .22s ease; }
@keyframes toastStackBump { 0% { transform: translateY(0) scale(1); } 50% { transform: translateY(-2px) scale(1.025); } 100% { transform: translateY(0) scale(1); } }
.quick-status-choice.selected, .quick-status-choice[aria-pressed="true"] { background: linear-gradient(145deg, rgba(133,188,32,.28), rgba(74,124,89,.30)); border-color: rgba(133,188,32,.85) !important; box-shadow: 0 16px 40px rgba(21, 70, 45, .22), inset 0 0 0 1px rgba(255,255,255,.22); transform: translateY(-2px); }
.quick-status-choice.selected strong::after, .quick-status-choice[aria-pressed="true"] strong::after { content: ' ✓'; color: #85bc20; font-weight: 900; }
.navbar .navbar-brand, .navbar-brand { min-width: 0; max-width: clamp(142px, 42vw, 260px); overflow: hidden; }
.navbar-brand-main, .navbar-brand-accent { white-space: nowrap; line-height: 1; }
@media (max-width: 640px) { .navbar { gap: .45rem; } .navbar-brand { gap: .38rem !important; flex: 1 1 auto; max-width: calc(100vw - 215px); } .navbar-brand-icon { font-size: 1.25rem !important; } .navbar-brand-main { font-size: clamp(1.02rem, 4.2vw, 1.35rem) !important; letter-spacing: -.04em; } .navbar-brand-accent { display: inline !important; font-size: clamp(.9rem, 3.4vw, 1.15rem) !important; letter-spacing: -.04em; opacity: .95; } .navbar-actions { gap: .35rem; flex-shrink: 0; } .navbar-user .user-name { max-width: 62px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } }
@media (max-width: 380px) { .navbar-brand { max-width: calc(100vw - 198px); } .navbar-brand-accent { display: none !important; } }
.guest-welcome-card { border: 0; background: transparent; }
.guest-welcome-decorated { position: relative; overflow: hidden; align-items: stretch; gap: 1rem; padding: clamp(1.2rem, 4vw, 2rem); border-radius: 2rem; background: radial-gradient(circle at 92% 16%, rgba(133,188,32,.28), transparent 28%), radial-gradient(circle at 6% 92%, rgba(255,255,255,.38), transparent 30%), linear-gradient(145deg, rgba(10,51,32,.94), rgba(28,92,55,.86)); color: #fff; border: 1px solid rgba(255,255,255,.18); box-shadow: 0 24px 60px rgba(14,48,31,.24); }
.guest-welcome-decorated h2 { color:#fff; margin-bottom:.45rem; }
.guest-welcome-decorated p { color: rgba(255,255,255,.82); }
.guest-welcome-decorated .eyebrow { color: rgba(217,255,216,.92); }
.guest-welcome-copy { position: relative; z-index: 2; flex: 1 1 280px; }
.guest-welcome-orb { position:absolute; right: 1.1rem; top: 1rem; width: 4.2rem; height: 4.2rem; display:grid; place-items:center; border-radius: 50%; background: rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.18); font-size: 2rem; }
.guest-welcome-sparkle { position:absolute; left: 1.2rem; bottom: .7rem; opacity: .28; font-size: 5rem; transform: rotate(-12deg); }
.guest-access-chips { display:flex; flex-wrap:wrap; gap:.45rem; margin-top:.9rem; }
.guest-access-chips span { padding:.38rem .7rem; border-radius:999px; background:rgba(255,255,255,.13); border:1px solid rgba(255,255,255,.16); font-weight:700; color:#fff; }
.guest-welcome-decorated .btn { align-self:center; position:relative; z-index:2; }
@media (max-width: 720px) { .guest-welcome-decorated { flex-direction: column; } .guest-welcome-orb { opacity:.35; } }
.poll-option i { transform-origin: left center; animation: pollBarFill .62s cubic-bezier(.2,.9,.2,1) both; }
@keyframes pollBarFill { from { transform: scaleX(0); opacity: .38; } to { transform: scaleX(1); opacity: 1; } }
.temp-welcome-back-box { background: linear-gradient(135deg, rgba(133,188,32,.16), rgba(74,124,89,.14)); border-color: rgba(74,124,89,.35); }
.temp-qr-credentials { display: grid; gap: .4rem; margin: 1rem auto; max-width: 320px; padding: .9rem 1rem; border-radius: 1rem; background: rgba(15,42,28,.08); border: 1px dashed rgba(74,124,89,.45); text-align: center; }
.temp-qr-credentials strong { font-size: 1.15rem; }
.temp-qr-credentials span { font-size: 1.4rem; font-weight: 900; letter-spacing: .05em; }


/* v164-fine-polish: ruhige Mobile-Header, Gastmodus, Status und Toasts */
@media (max-width: 720px) {
  .navbar-toprow { gap: .42rem !important; }
  .navbar-brand { flex: 1 1 auto !important; min-width: 0 !important; max-width: calc(100vw - 238px) !important; gap: .34rem !important; overflow: hidden !important; }
  .navbar-brand-logo { width: 31px !important; min-width: 31px !important; height: 31px !important; flex: 0 0 31px !important; }
  .navbar-brand-wordmark { min-width: 0 !important; max-width: 100% !important; overflow: hidden !important; display: inline-flex !important; align-items: baseline !important; gap: .18rem !important; white-space: nowrap !important; }
  .navbar-brand-main { font-family: var(--font-display) !important; font-size: clamp(.92rem, 3.65vw, 1.12rem) !important; line-height: .95 !important; letter-spacing: -.045em !important; }
  .navbar-brand-accent { display: inline !important; font-family: var(--font-display) !important; font-style: italic !important; font-size: clamp(.86rem, 3.25vw, 1.02rem) !important; line-height: .95 !important; letter-spacing: -.05em !important; opacity: .95 !important; }
  .navbar-actions { flex: 0 0 auto !important; min-width: 0 !important; gap: .32rem !important; }
  .nav-categories-summary { width: 3.05rem !important; height: 3.05rem !important; padding: 0 !important; justify-content: center !important; }
  .nav-categories-current, .nav-categories-toggle { display: none !important; }
  .nav-user { min-width: 0 !important; padding: .35rem .46rem !important; }
  .nav-user-text { max-width: 4.7rem !important; overflow: hidden !important; }
  .nav-user-name { overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
}
@media (max-width: 390px) {
  .navbar-brand { max-width: calc(100vw - 207px) !important; }
  .navbar-brand-accent { display: none !important; }
}
.quick-status-choice.selected,
.quick-status-choice[aria-pressed="true"] { background: linear-gradient(145deg, rgba(133,188,32,.34), rgba(104,166,80,.28)) !important; border-color: rgba(133,188,32,.9) !important; box-shadow: 0 0 0 2px rgba(133,188,32,.26), 0 18px 44px rgba(21,70,45,.28), inset 0 0 0 1px rgba(255,255,255,.24) !important; }
.toast-root .alert[data-stack-count]:not([data-stack-count="1"]) { padding-right: .9rem; }
.guest-welcome-decorated::before { content:''; position:absolute; inset: .85rem; border:1px dashed rgba(255,255,255,.18); border-radius: 1.55rem; pointer-events:none; }
.guest-welcome-decorated::after { content:'✦'; position:absolute; right: 5rem; bottom: 1.2rem; font-size: 2.6rem; opacity:.18; transform: rotate(10deg); }
.guest-access-chips span:empty { display:none; }
.poll-option i { transition: transform .5s cubic-bezier(.2,.9,.2,1), width .5s ease !important; }
.meal-readonly-note, #no-permission-banner { display:none !important; }


/* v166 Feinschliff: Header, Gäste, Toasts, Push-Historie */
.toast-root { max-height: min(42vh, 320px); overflow: hidden; }
.toast-root .alert { box-shadow: 0 16px 42px rgba(30, 80, 48, .22); }
.home-now-item.is-link { text-decoration: none; color: inherit; transition: transform .18s ease, border-color .18s ease, background .18s ease; }
.home-now-item.is-link:hover, .home-now-item.is-link:active { transform: translateY(-1px); border-color: rgba(143, 211, 168, .62); background: rgba(133,188,32,.10); }
.guest-focus-home-card .home-overview-actions { display:none; }
.guest-welcome-v166 { min-height: 220px; }
.guest-action-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(135px, 1fr)); gap:.7rem; margin-top:1rem; }
.guest-action-card { display:flex; flex-direction:column; gap:.18rem; padding:.82rem .9rem; border-radius:1.1rem; background:rgba(255,255,255,.12); color:#fff; text-decoration:none; border:1px solid rgba(255,255,255,.18); backdrop-filter:blur(12px); }
.guest-action-card span { font-size:1.35rem; }
.guest-action-card strong { color:#fff; line-height:1.1; }
.guest-action-card small { color:rgba(255,255,255,.72); }
.guest-action-card:hover { background:rgba(255,255,255,.18); transform:translateY(-1px); }
.guest-main-action { margin-top: .5rem; }
.push-history-list { display:grid; gap:.65rem; }
.push-history-card { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.8rem; align-items:center; padding:.9rem; border-radius:1.15rem; border:1px solid rgba(72,124,89,.16); background:rgba(255,255,255,.72); }
.push-history-card p { margin:.16rem 0 .25rem; color:var(--text-muted); }
.push-history-card small { color:var(--text-muted); }
.push-history-card.is-success { border-color:rgba(74,124,89,.22); }
.push-history-card.is-error { border-color:rgba(150,70,70,.28); }
.push-history-result { display:flex; flex-direction:column; gap:.18rem; align-items:flex-end; font-size:.86rem; color:var(--text-muted); }
.push-history-result span:first-child { color:var(--green-deep); font-weight:700; }
@media (max-width:640px){
  .navbar-brand { max-width: calc(100vw - 205px) !important; }
  .navbar-brand-logo { width: 29px !important; min-width: 29px !important; height: 29px !important; }
  .navbar-brand-main { font-size: clamp(.88rem, 3.45vw, 1.05rem) !important; }
  .navbar-brand-accent { font-size: clamp(.82rem, 3.05vw, .96rem) !important; }
  .guest-action-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .push-history-card { grid-template-columns:1fr; }
  .push-history-result { align-items:flex-start; }
}
@media (max-width:380px){ .navbar-brand-accent{display:none!important;} .navbar-brand{max-width:calc(100vw - 190px)!important;} }
:root[data-theme="dark"] .push-history-card { background:rgba(11,35,24,.78); border-color:rgba(143,211,168,.18); }

/* v177-sheet-inbox-fix: ruhiger Start, Essensplan-Fix, Umfragen, Hausinfos */
@media (max-width: 720px) {
  .navbar-brand { max-width: calc(100vw - 198px) !important; gap: .28rem !important; }
  .navbar-brand-logo { width: 27px !important; min-width: 27px !important; height: 27px !important; flex: 0 0 27px !important; }
  .navbar-brand-wordmark { display: inline-flex !important; align-items: baseline !important; gap: .13rem !important; white-space: nowrap !important; overflow: visible !important; max-width: none !important; }
  .navbar-brand-main { display: inline !important; font-family: var(--font-display) !important; font-size: clamp(.8rem, 3.35vw, 1rem) !important; letter-spacing: -.05em !important; }
  .navbar-brand-accent { display: inline !important; font-family: var(--font-display) !important; font-style: italic !important; font-size: clamp(.76rem, 3.05vw, .94rem) !important; letter-spacing: -.055em !important; opacity: .96 !important; }
  .nav-user-text { max-width: 4.45rem !important; }
}
@media (max-width: 390px) {
  .navbar-brand { max-width: calc(100vw - 184px) !important; }
  .navbar-brand-logo { width: 25px !important; min-width: 25px !important; height: 25px !important; flex-basis: 25px !important; }
  .navbar-brand-main { font-size: clamp(.72rem, 3.05vw, .9rem) !important; }
  .navbar-brand-accent { display: inline !important; font-size: clamp(.68rem, 2.78vw, .84rem) !important; }
}

.hero #hero-date, .hero p#hero-date { margin-top: .75rem; max-width: 54rem; font-size: clamp(.98rem, 2.4vw, 1.18rem); color: rgba(255,255,255,.78); }
:root:not([data-theme="dark"]) .hero #hero-date { color: rgba(255,255,255,.82); }
.home-overview-card { overflow: hidden; }
.home-now-card { border-radius: clamp(1.35rem, 4vw, 2.2rem); }
.home-summary-grid-only { align-items: stretch; }
.home-summary-tile.home-deco-tile { min-height: 142px; text-decoration: none; }
.home-summary-tile.needs-attention { border-color: rgba(157, 226, 145, .55); box-shadow: 0 18px 46px rgba(60, 135, 78, .2); }
.guest-focus-home-card .home-now-card { margin-bottom: .9rem; }
.guest-focus-home-card .home-summary-grid-only { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }

.week-planner { gap: clamp(.85rem, 2vw, 1.2rem); }
.day-card { position: relative; overflow: hidden; background: linear-gradient(160deg, rgba(255,255,255,.94), rgba(248,253,247,.86)); }
.day-card::before { content:''; position:absolute; inset:0; pointer-events:none; background: radial-gradient(circle at 12% 8%, rgba(133,188,32,.10), transparent 30%), radial-gradient(circle at 92% 92%, rgba(74,124,89,.10), transparent 34%); opacity:.9; }
.day-card > * { position: relative; z-index: 1; }
.meal-slot { padding: .18rem 0 .35rem; background: transparent !important; border: 0 !important; }
.meal-slot-label { letter-spacing: .07em; font-weight: 900; opacity: .82; background: transparent !important; }
.meal-slot-value { border-radius: 18px !important; border: 1px solid rgba(74,124,89,.14) !important; background: rgba(244,251,243,.74) !important; box-shadow: inset 0 0 0 1px rgba(255,255,255,.55); transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease; }
.meal-slot-value.empty { color: rgba(42,70,52,.72) !important; font-style: normal !important; background: linear-gradient(135deg, rgba(133,188,32,.13), rgba(74,124,89,.07)) !important; }
.meal-slot-value[role="button"]:hover, .meal-slot-value[role="button"]:active { border-color: rgba(74,124,89,.38) !important; background: rgba(225,245,222,.78) !important; box-shadow: 0 12px 28px rgba(25,70,42,.12), inset 0 0 0 1px rgba(255,255,255,.5); }
.meal-edit-modal .form-control, .meal-poll-modal .form-control, .home-info-editor-v166 .form-control { border-radius: 18px; }
.meal-edit-modal .modal-sticky-submit:disabled { opacity:.72; cursor: wait; }
:root[data-theme="dark"] .day-card { background: linear-gradient(160deg, rgba(11,32,22,.92), rgba(13,54,33,.72)); border-color: rgba(143,211,168,.16); }
:root[data-theme="dark"] .meal-slot-value { background: rgba(255,255,255,.055) !important; border-color: rgba(143,211,168,.13) !important; box-shadow: inset 0 0 0 1px rgba(255,255,255,.035); }
:root[data-theme="dark"] .meal-slot-value.empty { background: linear-gradient(135deg, rgba(133,188,32,.12), rgba(143,211,168,.055)) !important; color: rgba(235,255,238,.78) !important; }
:root[data-theme="dark"] .meal-slot-value[role="button"]:hover, :root[data-theme="dark"] .meal-slot-value[role="button"]:active { background: rgba(143,211,168,.11) !important; border-color: rgba(143,211,168,.35) !important; }

.polls-list { display:grid; gap: 1rem; }
.polls-list-closed { margin-top: .85rem; }
.closed-polls-box { margin-top: 1.25rem; border: 1px solid rgba(143,211,168,.22); border-radius: 24px; padding: .85rem; background: rgba(255,255,255,.08); }
.closed-polls-box > summary { cursor:pointer; list-style:none; display:flex; align-items:center; justify-content:space-between; gap:.8rem; font-weight:900; color: var(--green-deep); }
.closed-polls-box > summary::-webkit-details-marker { display:none; }
.closed-polls-box > summary span { padding:.2rem .55rem; border-radius:999px; background:rgba(133,188,32,.18); }
.polls-open-empty { padding: 1rem 1.1rem; border-radius: 20px; border: 1px dashed rgba(143,211,168,.25); color: var(--text-light); background: rgba(255,255,255,.06); }
.poll-card.is-closed { opacity:.76; }
.poll-card-updated { animation: pollCardPulse .28s ease both; }
@keyframes pollCardPulse { 0% { transform: scale(.992); } 60% { transform: scale(1.006); } 100% { transform: scale(1); } }
.poll-option.is-clicked-now { animation: pollOptionTap .28s ease; }
@keyframes pollOptionTap { 0%{ transform: scale(.985); } 100%{ transform: scale(1); } }
.poll-option i { width: var(--poll-pct) !important; transform-origin: left center; }
:root[data-theme="dark"] .closed-polls-box { background: rgba(10,31,21,.62); border-color: rgba(143,211,168,.16); }
:root[data-theme="dark"] .closed-polls-box > summary { color: rgba(246,255,248,.92); }

.home-info-grid-v166 { display:grid; grid-template-columns: repeat(auto-fit, minmax(245px, 1fr)); gap:1rem; }
.home-info-card-v166 { position:relative; overflow:hidden; }
.home-info-card-v166::after { content:''; position:absolute; inset:auto -18% -30% 38%; height:110px; border-radius:999px; background: radial-gradient(circle, rgba(133,188,32,.12), transparent 70%); pointer-events:none; }
.home-info-wifi-box, .home-info-address-box { position:relative; z-index:1; margin-top:.85rem; padding:.8rem; border-radius:18px; border:1px solid rgba(74,124,89,.18); background:rgba(133,188,32,.08); display:flex; justify-content:space-between; align-items:center; gap:.8rem; }
.home-info-wifi-box span { display:block; font-size:.78rem; color:var(--text-light); font-weight:800; text-transform:uppercase; letter-spacing:.07em; }
.home-info-wifi-box strong, .home-info-address-box strong { display:block; color:var(--green-deep); }
.home-info-wifi-box small, .home-info-address-box small { display:block; color:var(--text-light); overflow-wrap:anywhere; }
.home-info-address-box > span { font-size:1.35rem; }
.home-info-extra-grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:.75rem; }
.wifi-secret-card, .wifi-code-box { padding: .9rem 1rem; border-radius: 18px; border:1px solid rgba(74,124,89,.18); background: rgba(133,188,32,.08); overflow-wrap:anywhere; }
.wifi-secret-card small { display:block; color:var(--text-light); font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.wifi-secret-card strong { color:var(--green-deep); font-size:1.15rem; }
.wifi-code-box { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color:var(--text-light); }
@media (max-width:640px){ .home-info-extra-grid { grid-template-columns:1fr; } }
:root[data-theme="dark"] .home-info-wifi-box, :root[data-theme="dark"] .home-info-address-box, :root[data-theme="dark"] .wifi-secret-card, :root[data-theme="dark"] .wifi-code-box { background: rgba(143,211,168,.08); border-color: rgba(143,211,168,.17); }
:root[data-theme="dark"] .home-info-wifi-box strong, :root[data-theme="dark"] .home-info-address-box strong, :root[data-theme="dark"] .wifi-secret-card strong { color: rgba(244,255,246,.95); }


/* v173 mobile bottom navigation + notification mailbox */
.nav-notification-button {
  display: none;
  position: relative;
  width: 46px;
  height: 46px;
  border: 1px solid rgba(74, 124, 89, .16);
  border-radius: 17px;
  background: rgba(255,255,255,.84);
  color: var(--green-deep);
  box-shadow: var(--shadow-sm);
  font-size: 1.18rem;
  cursor: pointer;
  place-items: center;
}
.nav-notification-button i {
  position: absolute;
  right: 10px;
  top: 10px;
  width: 8px;
  height: 8px;
  border-radius: 99px;
  background: var(--green-soft);
  box-shadow: 0 0 0 3px rgba(138,184,148,.18);
}
.mobile-bottom-nav { display: none; }
.mobile-nav-sheet-head { margin-bottom: 1rem; }
.mobile-nav-sheet-head h2 { margin: .15rem 0 .25rem; }
.mobile-nav-sheet-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .72rem;
}
.mobile-nav-sheet-grid.single { grid-template-columns: 1fr; }
.mobile-nav-sheet-link {
  border: 1px solid rgba(74,124,89,.16);
  border-radius: 22px;
  padding: .9rem;
  background: rgba(74,124,89,.07);
  text-decoration: none;
  color: var(--text-dark);
  display: grid;
  gap: .18rem;
  text-align: left;
  font: inherit;
  cursor: pointer;
  box-shadow: var(--shadow-sm);
}
.mobile-nav-sheet-link span { font-size: 1.35rem; line-height: 1; }
.mobile-nav-sheet-link strong { color: var(--green-deep); font-weight: 900; }
.mobile-nav-sheet-link small { color: var(--text-light); font-weight: 700; }
.notification-inbox-card {
  display: flex;
  align-items: center;
  gap: .8rem;
  padding: .95rem;
  border-radius: 22px;
  margin: .7rem 0 1rem;
  background: linear-gradient(135deg, rgba(138,184,148,.16), rgba(197,224,204,.16));
  border: 1px solid rgba(74,124,89,.14);
}
.notification-inbox-card > span {
  width: 48px;
  height: 48px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.66);
  font-size: 1.35rem;
}
.notification-inbox-card strong { display: block; color: var(--green-deep); }
.notification-inbox-card small { display: block; color: var(--text-light); line-height: 1.35; }

/* v173 compact mobile category sheet + notification inbox */
.mobile-nav-sheet-head.compact { margin-bottom: .7rem; }
.mobile-nav-sheet-head.compact h2 { margin-bottom: 0; }
.mobile-nav-sheet-head.compact .text-muted { display: none; }
.category-sheet .mobile-category-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: .52rem;
}
.category-sheet .mobile-category-link {
  min-height: 58px;
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .62rem .68rem;
  border-radius: 17px;
  text-decoration: none;
  color: var(--text-main);
  background: rgba(74,124,89,.07);
  border: 1px solid rgba(74,124,89,.13);
  box-shadow: 0 8px 20px rgba(30,70,44,.06);
}
.category-sheet .mobile-category-link span { font-size: 1.28rem; line-height: 1; }
.category-sheet .mobile-category-link strong {
  font-weight: 900;
  line-height: 1.05;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.notification-inbox-list {
  display: grid;
  gap: .62rem;
}
.notification-inbox-item {
  display: flex;
  gap: .72rem;
  align-items: flex-start;
  padding: .78rem;
  border-radius: 19px;
  text-decoration: none;
  color: var(--text-main);
  background: rgba(74,124,89,.07);
  border: 1px solid rgba(74,124,89,.14);
}
.notification-inbox-item-icon {
  width: 40px;
  height: 40px;
  border-radius: 15px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  background: rgba(133,188,32,.14);
}
.notification-inbox-item strong,
.notification-inbox-item small,
.notification-inbox-item time { display: block; }
.notification-inbox-item strong { font-weight: 900; line-height: 1.18; }
.notification-inbox-item small { color: var(--text-light); margin-top: .12rem; line-height: 1.3; }
.notification-inbox-item time { color: var(--text-light); opacity: .78; margin-top: .25rem; font-size: .78rem; font-weight: 750; }
.notification-inbox-empty {
  padding: 1rem;
  border-radius: 20px;
  text-align: center;
  background: rgba(74,124,89,.07);
  border: 1px dashed rgba(74,124,89,.18);
  color: var(--text-light);
}
.notification-inbox-empty span,
.notification-inbox-empty strong,
.notification-inbox-empty small { display: block; }
.notification-inbox-empty span { font-size: 1.6rem; margin-bottom: .25rem; }
.notification-inbox-empty strong { color: var(--text-main); }
:root[data-theme="dark"] .category-sheet .mobile-category-link,
:root[data-theme="dark"] .notification-inbox-item,
:root[data-theme="dark"] .notification-inbox-empty {
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.11);
  color: #f6fff8;
}
:root[data-theme="dark"] .category-sheet .mobile-category-link strong,
:root[data-theme="dark"] .notification-inbox-item strong,
:root[data-theme="dark"] .notification-inbox-empty strong { color: #f6fff8; }
:root[data-theme="dark"] .notification-inbox-item small,
:root[data-theme="dark"] .notification-inbox-item time { color: rgba(237,247,239,.70); }

@media (max-width: 900px) {
  body { padding-bottom: calc(86px + env(safe-area-inset-bottom)); }
  .main-content { padding-bottom: calc(5.5rem + env(safe-area-inset-bottom)); }
  .nav-notification-button { display: grid !important; order: 1 !important; }
  .navbar-actions .nav-categories { display: none !important; }
  .navbar-actions .nav-user { order: 2 !important; }
  .mobile-bottom-nav {
    position: fixed;
    left: max(.75rem, env(safe-area-inset-left));
    right: max(.75rem, env(safe-area-inset-right));
    bottom: calc(.75rem + env(safe-area-inset-bottom));
    z-index: 900;
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr)) 64px repeat(2, minmax(0,1fr));
    align-items: center;
    gap: .25rem;
    min-height: 72px;
    padding: .55rem .65rem;
    border-radius: 28px;
    background: rgba(255,255,255,.86);
    border: 1px solid rgba(74,124,89,.14);
    box-shadow: 0 18px 42px rgba(31,42,36,.18);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
  }
  .mobile-bottom-nav-item {
    border: 0;
    background: transparent;
    color: var(--text-medium);
    text-decoration: none;
    min-width: 0;
    min-height: 54px;
    border-radius: 22px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: .15rem;
    font: inherit;
    cursor: pointer;
    font-size: .76rem;
    font-weight: 850;
  }
  .mobile-bottom-nav-icon { font-size: 1.15rem; line-height: 1; }
  .mobile-bottom-nav-item strong { font-size: .76rem; line-height: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
  .mobile-bottom-nav-item.is-active {
    color: var(--green-deep);
    background: rgba(138,184,148,.16);
    box-shadow: inset 0 -3px 0 rgba(137, 197, 101, .78);
  }
  .mobile-bottom-nav-plus {
    width: 64px;
    height: 64px;
    margin: -28px auto 0;
    border: 0;
    border-radius: 999px;
    color: white;
    background: linear-gradient(135deg, var(--green-medium), var(--green-deep));
    box-shadow: 0 16px 34px rgba(31,90,55,.35);
    font-size: 2.2rem;
    line-height: 1;
    display: grid;
    place-items: center;
    cursor: pointer;
  }
  .scroll-top-btn, .external-home-btn { bottom: calc(6.4rem + env(safe-area-inset-bottom)) !important; }
  .footer { padding-bottom: calc(5.8rem + env(safe-area-inset-bottom)); }
}
@media (max-width: 420px) {
  .navbar-brand { max-width: calc(100vw - 172px) !important; }
  .navbar-brand-accent { display: inline !important; }
  .navbar-brand-logo { width: 34px !important; height: 34px !important; flex-basis: 34px !important; }
  .navbar-brand-wordmark { gap: .17rem !important; }
  .navbar-brand-main { font-size: clamp(.98rem, 4.2vw, 1.16rem) !important; }
  .navbar-brand-accent { font-size: clamp(.88rem, 3.7vw, 1.02rem) !important; }
  .nav-notification-button { width: 42px !important; height: 42px !important; min-width: 42px !important; }
  .mobile-bottom-nav { grid-template-columns: repeat(2, minmax(0,1fr)) 58px repeat(2, minmax(0,1fr)); border-radius: 24px; padding: .5rem; }
  .mobile-bottom-nav-plus { width: 58px; height: 58px; }
  .mobile-bottom-nav-item strong { font-size: .68rem; }
  .mobile-bottom-nav-icon { font-size: 1.05rem; }
}
:root[data-theme="dark"] .nav-notification-button {
  background: rgba(10, 34, 22, .82);
  border-color: rgba(143,211,168,.18);
  color: #e8f7ea;
}
:root[data-theme="dark"] .mobile-bottom-nav {
  background: rgba(9, 31, 21, .84);
  border-color: rgba(143,211,168,.18);
  box-shadow: 0 18px 44px rgba(0,0,0,.48);
}
:root[data-theme="dark"] .mobile-bottom-nav-item { color: rgba(237,247,239,.74); }
:root[data-theme="dark"] .mobile-bottom-nav-item.is-active { color: #f5fff6; background: rgba(143,211,168,.12); }
:root[data-theme="dark"] .mobile-nav-sheet-link {
  background: rgba(143,211,168,.08);
  border-color: rgba(143,211,168,.16);
  color: #f5fff6;
}
:root[data-theme="dark"] .mobile-nav-sheet-link strong { color: #f5fff6; }
:root[data-theme="dark"] .mobile-nav-sheet-link small,
:root[data-theme="dark"] .notification-inbox-card small { color: rgba(237,247,239,.68); }
:root[data-theme="dark"] .notification-inbox-card {
  background: linear-gradient(135deg, rgba(143,211,168,.11), rgba(65,126,82,.10));
  border-color: rgba(143,211,168,.16);
}
:root[data-theme="dark"] .notification-inbox-card > span { background: rgba(255,255,255,.08); }
:root[data-theme="dark"] .notification-inbox-card strong { color: #f5fff6; }


/* v174 - animiertes Plus + Bottom-Sheets fuer Schnellaktionen und Kategorien */
@media (max-width: 900px) {
  .modal-backdrop-mobile-sheet {
    align-items: flex-end !important;
    justify-content: center !important;
    padding: 0 max(.62rem, env(safe-area-inset-right)) 0 max(.62rem, env(safe-area-inset-left)) !important;
    background: rgba(6, 22, 14, .54) !important;
    z-index: 1200 !important;
    animation: mobileSheetBackdropIn .2s ease both !important;
  }
  .modal-content-mobile-sheet {
    width: min(100%, 680px) !important;
    max-width: min(100%, 680px) !important;
    max-height: min(82dvh, 760px) !important;
    margin: 0 auto calc(.35rem + env(safe-area-inset-bottom)) !important;
    overflow-y: auto !important;
    border-radius: 32px 32px 26px 26px !important;
    padding: 1rem .95rem calc(6.2rem + env(safe-area-inset-bottom)) !important;
    transform-origin: bottom center !important;
    animation: mobileSheetSlideUp .34s cubic-bezier(.2,.86,.22,1) both !important;
    box-shadow: 0 -24px 70px rgba(0,0,0,.34) !important;
  }
  .modal-content-mobile-sheet .modal-close {
    top: .86rem !important;
    right: .86rem !important;
    width: 46px !important;
    height: 46px !important;
    z-index: 3 !important;
  }
  .mobile-sheet-handle {
    width: 54px;
    height: 6px;
    border-radius: 999px;
    margin: .05rem auto 1rem;
    background: rgba(31,42,36,.18);
  }
  :root[data-theme="dark"] .mobile-sheet-handle { background: rgba(255,255,255,.22); }
  .mobile-bottom-nav-plus {
    transition: transform .24s ease, box-shadow .24s ease, filter .24s ease, background .24s ease;
    will-change: transform;
  }
  .mobile-bottom-nav-plus::after {
    content: '';
    position: absolute;
    inset: -8px;
    border-radius: inherit;
    background: radial-gradient(circle, rgba(180,255,197,.26), transparent 68%);
    opacity: 0;
    transform: scale(.72);
    transition: opacity .24s ease, transform .24s ease;
    pointer-events: none;
  }
  .mobile-bottom-nav-plus:active {
    transform: translateY(-2px) scale(.96);
  }
  body.mobile-plus-sheet-open .mobile-bottom-nav-plus {
    transform: translateY(-5px) rotate(45deg) scale(1.05);
    box-shadow: 0 22px 46px rgba(72,153,91,.46), 0 0 0 10px rgba(178,245,190,.13);
    filter: saturate(1.08);
  }
  body.mobile-plus-sheet-open .mobile-bottom-nav-plus::after {
    opacity: 1;
    transform: scale(1.05);
  }
  body.mobile-category-sheet-open .mobile-bottom-nav-more {
    color: var(--green-deep);
    background: rgba(138,184,148,.18);
    box-shadow: inset 0 -3px 0 rgba(137,197,101,.8);
  }
  .quick-add-sheet .mobile-nav-sheet-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .72rem;
  }
  .quick-add-sheet .mobile-nav-sheet-link {
    min-height: 86px;
    border-radius: 24px;
    padding: .9rem .92rem;
    background: linear-gradient(135deg, rgba(255,255,255,.84), rgba(235,246,238,.82));
    border: 1px solid rgba(74,124,89,.16);
    box-shadow: 0 12px 28px rgba(31,42,36,.08);
  }
  .quick-add-sheet .mobile-nav-sheet-link span {
    width: 38px;
    height: 38px;
    border-radius: 15px;
    display: grid;
    place-items: center;
    background: rgba(133,188,32,.13);
  }
  .quick-add-sheet .mobile-nav-sheet-link:active {
    transform: scale(.985);
  }
  .category-sheet .mobile-category-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .58rem !important;
  }
  .category-sheet .mobile-category-link {
    min-height: 58px !important;
    padding: .66rem .72rem !important;
    border-radius: 18px !important;
    gap: .58rem !important;
    background: rgba(255,255,255,.78) !important;
    border-color: rgba(74,124,89,.15) !important;
  }
  .category-sheet .mobile-category-link span {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 13px;
    display: grid;
    place-items: center;
    background: rgba(133,188,32,.12);
    font-size: 1.18rem !important;
  }
  .category-sheet .mobile-category-link strong {
    min-width: 0;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.12 !important;
    font-size: clamp(.9rem, 3.6vw, 1rem) !important;
    color: var(--green-deep) !important;
    overflow-wrap: anywhere;
  }
  .mobile-nav-sheet-head h2 {
    padding-right: 3rem;
  }
}
@media (max-width: 380px) {
  .quick-add-sheet .mobile-nav-sheet-grid,
  .category-sheet .mobile-category-list {
    grid-template-columns: 1fr !important;
  }
  .modal-content-mobile-sheet {
    max-height: min(84dvh, 760px) !important;
  }
}
@keyframes mobileSheetBackdropIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes mobileSheetSlideUp {
  from { opacity: 0; transform: translateY(42px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
:root[data-theme="dark"] .quick-add-sheet .mobile-nav-sheet-link,
:root[data-theme="dark"] .category-sheet .mobile-category-link {
  background: linear-gradient(135deg, rgba(18,52,35,.92), rgba(9,35,23,.88)) !important;
  border-color: rgba(143,211,168,.18) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.26);
}
:root[data-theme="dark"] .quick-add-sheet .mobile-nav-sheet-link span,
:root[data-theme="dark"] .category-sheet .mobile-category-link span {
  background: rgba(143,211,168,.12);
}
:root[data-theme="dark"] .category-sheet .mobile-category-link strong,
:root[data-theme="dark"] .quick-add-sheet .mobile-nav-sheet-link strong {
  color: #f7fff8 !important;
}
:root[data-theme="dark"] .mobile-category-sheet-open .mobile-bottom-nav-more,
:root[data-theme="dark"] body.mobile-category-sheet-open .mobile-bottom-nav-more {
  color: #f7fff8;
  background: rgba(143,211,168,.12);
}


/* v176 - Bottom-Sheets docken sichtbar an die mobile Leiste an */
@media (max-width: 900px) {
  body.mobile-plus-sheet-open .mobile-bottom-nav,
  body.mobile-category-sheet-open .mobile-bottom-nav {
    z-index: 1350 !important;
    transform: translateY(0) !important;
    opacity: 1 !important;
  }

  body.mobile-plus-sheet-open .scroll-top-btn,
  body.mobile-category-sheet-open .scroll-top-btn {
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateY(10px) scale(.92) !important;
  }

  .scroll-top-btn,
  .external-home-btn {
    bottom: calc(8.85rem + env(safe-area-inset-bottom)) !important;
  }

  .modal-backdrop-mobile-sheet {
    padding: 0 max(.62rem, env(safe-area-inset-right)) calc(5.85rem + env(safe-area-inset-bottom)) max(.62rem, env(safe-area-inset-left)) !important;
    z-index: 1200 !important;
    background: linear-gradient(to bottom, rgba(6, 22, 14, .46), rgba(6, 22, 14, .20) 64%, transparent 100%) !important;
  }

  .modal-content-mobile-sheet {
    margin: 0 auto .15rem !important;
    max-height: min(68dvh, 640px) !important;
    padding: 1rem .95rem 1.05rem !important;
    border-radius: 32px 32px 28px 28px !important;
    overflow-y: auto !important;
    transform-origin: bottom center !important;
    animation: mobileSheetRiseFromNav .3s cubic-bezier(.2,.86,.22,1) both !important;
  }

  .modal-backdrop-quick-add .modal-content-mobile-sheet,
  .modal-backdrop-category-sheet .modal-content-mobile-sheet {
    box-shadow: 0 -18px 56px rgba(0,0,0,.32), 0 0 0 1px rgba(143,211,168,.14) inset !important;
  }

  .modal-content-mobile-sheet::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -10px;
    width: 86px;
    height: 18px;
    transform: translateX(-50%);
    border-radius: 0 0 999px 999px;
    background: inherit;
    border: 1px solid rgba(143,211,168,.12);
    border-top: 0;
    opacity: .72;
    pointer-events: none;
  }

  .quick-add-sheet .mobile-nav-sheet-head,
  .category-sheet .mobile-nav-sheet-head {
    margin-bottom: .78rem !important;
  }

  .quick-add-sheet .mobile-nav-sheet-head p {
    display: none !important;
  }

  .quick-add-sheet .mobile-nav-sheet-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .58rem !important;
  }

  .quick-add-sheet .mobile-nav-sheet-link {
    min-height: 70px !important;
    border-radius: 20px !important;
    padding: .72rem .78rem !important;
  }

  .category-sheet .mobile-category-list {
    max-height: min(48dvh, 420px);
    overflow-y: auto;
    padding-right: .15rem;
  }

  .category-sheet .mobile-category-link strong {
    font-size: clamp(.86rem, 3.35vw, .98rem) !important;
  }
}

@keyframes mobileSheetRiseFromNav {
  from { opacity: 0; transform: translateY(24px) scale(.992); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}


/* v176 - ziehbare Bottom-Sheets + höherer Scroll-Pfeil */
@media (max-width: 900px) {
  .global-back-to-top,
  .scroll-top-btn,
  .external-home-btn {
    bottom: calc(10.7rem + env(safe-area-inset-bottom)) !important;
    right: max(1rem, env(safe-area-inset-right)) !important;
    z-index: 1180 !important;
  }

  .modal-backdrop-mobile-sheet {
    align-items: flex-end !important;
    padding-bottom: calc(5.95rem + env(safe-area-inset-bottom)) !important;
    overflow: hidden !important;
  }

  .modal-content-mobile-sheet {
    max-height: min(66dvh, 640px) !important;
    min-height: min(38dvh, 360px);
    animation: mobileSheetExtendFromNav .38s cubic-bezier(.16,.92,.2,1.02) both !important;
    will-change: transform, opacity, height;
  }

  .modal-content-mobile-sheet.is-dragging {
    animation: none !important;
    transition: none !important;
    user-select: none;
  }

  .modal-content-mobile-sheet.is-expanded {
    max-height: min(86dvh, 860px) !important;
  }

  .mobile-sheet-handle {
    cursor: ns-resize;
    touch-action: none;
    position: relative;
  }

  .mobile-sheet-handle::before {
    content: '';
    position: absolute;
    inset: -14px -42px;
    border-radius: 999px;
  }

  body.mobile-plus-sheet-open .global-back-to-top,
  body.mobile-category-sheet-open .global-back-to-top {
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateY(10px) scale(.92) !important;
  }
}

@keyframes mobileSheetExtendFromNav {
  0% {
    opacity: 0;
    transform: translateY(92px) scale(.965);
    clip-path: inset(72% 0 0 0 round 32px);
  }
  62% {
    opacity: 1;
    transform: translateY(-4px) scale(1.004);
    clip-path: inset(0 0 0 0 round 32px);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
    clip-path: inset(0 0 0 0 round 32px);
  }
}

/* v177 - Sheet-Drag, Overlay-Fix, Glocken-Postfach oben */
@media (max-width: 900px) {
  .global-back-to-top,
  .scroll-top-btn,
  .external-home-btn {
    bottom: calc(9.15rem + env(safe-area-inset-bottom)) !important;
    right: max(1rem, env(safe-area-inset-right)) !important;
    z-index: 1180 !important;
  }

  .modal-backdrop-mobile-sheet {
    align-items: flex-end !important;
    justify-content: flex-end !important;
    padding: 0 max(.62rem, env(safe-area-inset-right)) calc(5.85rem + env(safe-area-inset-bottom)) max(.62rem, env(safe-area-inset-left)) !important;
    overflow: hidden !important;
    background: rgba(2, 12, 8, .54) !important;
    -webkit-backdrop-filter: blur(7px) saturate(105%) !important;
    backdrop-filter: blur(7px) saturate(105%) !important;
  }

  .modal-content-mobile-sheet {
    width: min(100%, 720px) !important;
    max-height: min(70dvh, 680px) !important;
    min-height: min(39dvh, 380px) !important;
    margin: 0 auto .16rem !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    transform-origin: bottom center !important;
    animation: mobileSheetDockedV177 .42s cubic-bezier(.16,.92,.22,1.02) both !important;
    background: linear-gradient(145deg, rgba(236,248,238,.98), rgba(255,255,255,.96)) !important;
  }

  :root[data-theme="dark"] .modal-content-mobile-sheet {
    background:
      radial-gradient(circle at 20% 0%, rgba(57,132,77,.22), transparent 38%),
      linear-gradient(145deg, rgba(8,31,20,.98), rgba(3,17,11,.98)) !important;
    color: #f7fff8 !important;
  }

  .modal-content-mobile-sheet.is-dragging {
    animation: none !important;
    transition: none !important;
  }

  .modal-content-mobile-sheet.is-expanded {
    max-height: min(86dvh, 860px) !important;
  }

  .modal-content-mobile-sheet .modal-close {
    z-index: 8 !important;
  }

  .modal-content-mobile-sheet .mobile-nav-sheet {
    min-height: 0 !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
  }

  .mobile-nav-sheet-head {
    flex: 0 0 auto !important;
  }

  .quick-add-sheet .mobile-nav-sheet-grid,
  .category-sheet .mobile-category-list {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding-bottom: .75rem !important;
  }

  .quick-add-sheet .mobile-nav-sheet-grid {
    align-content: start !important;
  }

  .category-sheet .mobile-category-list {
    align-content: start !important;
  }

  .modal-content-mobile-sheet::after {
    display: none !important;
  }

  body.mobile-plus-sheet-open .mobile-bottom-nav,
  body.mobile-category-sheet-open .mobile-bottom-nav {
    z-index: 1350 !important;
    background: linear-gradient(135deg, rgba(9,43,28,.96), rgba(3,29,19,.94)) !important;
  }

  body.mobile-plus-sheet-open .global-back-to-top,
  body.mobile-category-sheet-open .global-back-to-top,
  body.mobile-plus-sheet-open .scroll-top-btn,
  body.mobile-category-sheet-open .scroll-top-btn,
  body.mobile-plus-sheet-open .external-home-btn,
  body.mobile-category-sheet-open .external-home-btn {
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateY(10px) scale(.92) !important;
  }
}

@keyframes mobileSheetDockedV177 {
  0% {
    opacity: 0;
    transform: translateY(86px) scale(.965);
    clip-path: inset(78% 0 0 0 round 34px);
  }
  58% {
    opacity: 1;
    transform: translateY(-4px) scale(1.002);
    clip-path: inset(0 0 0 0 round 34px);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
    clip-path: inset(0 0 0 0 round 34px);
  }
}

.modal-backdrop-notification-popover {
  align-items: flex-start !important;
  justify-content: flex-end !important;
  padding: calc(4.8rem + env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) 1rem max(1rem, env(safe-area-inset-left)) !important;
  background: rgba(2, 12, 8, .38) !important;
  -webkit-backdrop-filter: blur(5px) saturate(105%) !important;
  backdrop-filter: blur(5px) saturate(105%) !important;
}

.modal-content-notification-popover {
  width: min(420px, calc(100vw - 1.35rem)) !important;
  max-height: min(72dvh, 560px) !important;
  overflow: hidden !important;
  border-radius: 28px !important;
  padding: 1rem !important;
  margin: 0 !important;
  background: linear-gradient(145deg, rgba(246,251,246,.98), rgba(255,255,255,.96)) !important;
  box-shadow: 0 22px 70px rgba(3,24,14,.25), inset 0 0 0 1px rgba(76,124,89,.12) !important;
  animation: notificationPopoverDropV177 .24s cubic-bezier(.2,.86,.2,1) both !important;
}

:root[data-theme="dark"] .modal-content-notification-popover {
  background:
    radial-gradient(circle at 20% 0%, rgba(57,132,77,.20), transparent 36%),
    linear-gradient(145deg, rgba(8,31,20,.98), rgba(3,17,11,.98)) !important;
  color: #f7fff8 !important;
  box-shadow: 0 24px 80px rgba(0,0,0,.46), inset 0 0 0 1px rgba(143,211,168,.16) !important;
}

.modal-content-notification-popover .modal-close {
  top: .72rem !important;
  right: .72rem !important;
  width: 42px !important;
  height: 42px !important;
  z-index: 4 !important;
}

.notification-popover-panel {
  display: grid;
  gap: .85rem;
  min-height: 0;
}

.notification-popover-panel .notification-inbox-list {
  max-height: min(54dvh, 430px) !important;
  overflow-y: auto !important;
  padding-right: .12rem;
}

.notification-inbox-item {
  transition: transform .16s ease, border-color .16s ease, background .16s ease !important;
}
.notification-inbox-item:active,
.notification-inbox-item:hover {
  transform: translateY(-1px);
  border-color: rgba(133,188,32,.35) !important;
}

@keyframes notificationPopoverDropV177 {
  from { opacity: 0; transform: translateY(-10px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* v178 - Mobile Taskleiste, aktiver Zustand & sanftere Klappanimationen */
@media (max-width: 900px) {
  .mobile-bottom-nav {
    min-height: 76px !important;
    padding: .58rem .66rem !important;
    gap: .28rem !important;
    border-radius: 30px !important;
    background:
      linear-gradient(180deg, rgba(255,255,255,.94), rgba(239,249,241,.88)) !important;
    border: 1px solid rgba(74,124,89,.16) !important;
    box-shadow:
      0 20px 48px rgba(21,43,30,.18),
      0 0 0 1px rgba(255,255,255,.64) inset !important;
    transform: translateZ(0) !important;
    transition: transform .24s ease, box-shadow .24s ease, background .24s ease, border-color .24s ease !important;
    overflow: visible !important;
    isolation: isolate !important;
  }

  .mobile-bottom-nav::before {
    content: '';
    position: absolute;
    inset: 7px 9px auto 9px;
    height: 1px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, rgba(133,188,32,.34), transparent);
    pointer-events: none;
  }

  .mobile-bottom-nav-item {
    position: relative !important;
    overflow: hidden !important;
    min-height: 58px !important;
    border-radius: 23px !important;
    color: rgba(62,82,70,.78) !important;
    transition:
      transform .22s cubic-bezier(.18,.88,.22,1),
      background .22s ease,
      color .22s ease,
      box-shadow .22s ease,
      filter .22s ease !important;
    -webkit-tap-highlight-color: transparent !important;
  }

  .mobile-bottom-nav-item::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 6px;
    width: 5px;
    height: 5px;
    border-radius: 99px;
    background: var(--green-soft);
    opacity: 0;
    transform: translateX(-50%) scale(.45);
    transition: opacity .22s ease, transform .22s cubic-bezier(.18,.88,.22,1), width .22s ease !important;
  }

  .mobile-bottom-nav-active-glow {
    position: absolute;
    inset: 4px 5px;
    border-radius: 21px;
    background:
      radial-gradient(circle at 50% 0%, rgba(255,255,255,.82), transparent 42%),
      linear-gradient(135deg, rgba(232,246,235,.98), rgba(207,233,214,.92));
    border: 1px solid rgba(86,142,99,.16);
    box-shadow: 0 10px 24px rgba(44,96,58,.14), inset 0 1px 0 rgba(255,255,255,.72);
    opacity: 0;
    transform: translateY(8px) scale(.88);
    transition: opacity .22s ease, transform .24s cubic-bezier(.18,.88,.22,1) !important;
    pointer-events: none;
    z-index: -1;
  }

  .mobile-bottom-nav-icon,
  .mobile-bottom-nav-item strong {
    position: relative;
    z-index: 1;
  }

  .mobile-bottom-nav-icon {
    width: 29px;
    height: 29px;
    display: grid !important;
    place-items: center !important;
    border-radius: 13px;
    font-size: 1.08rem !important;
    line-height: 1 !important;
    transition: transform .23s cubic-bezier(.18,.88,.22,1), background .22s ease, box-shadow .22s ease !important;
  }

  .mobile-bottom-nav-item strong {
    margin-top: .04rem;
    letter-spacing: -.02em;
    transition: transform .22s ease, color .22s ease !important;
  }

  .mobile-bottom-nav-item:hover,
  .mobile-bottom-nav-item:focus-visible {
    background: rgba(138,184,148,.12) !important;
    color: var(--green-deep) !important;
  }

  .mobile-bottom-nav-item:active {
    transform: translateY(1px) scale(.97) !important;
    filter: saturate(1.06) !important;
  }

  .mobile-bottom-nav-item.is-active {
    color: var(--green-deep) !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: translateY(-4px) !important;
  }

  .mobile-bottom-nav-item.is-active .mobile-bottom-nav-active-glow {
    opacity: 1;
    transform: translateY(0) scale(1);
  }

  .mobile-bottom-nav-item.is-active::after {
    opacity: 1;
    width: 22px;
    transform: translateX(-50%) scale(1);
  }

  .mobile-bottom-nav-item.is-active .mobile-bottom-nav-icon {
    transform: translateY(-1px) scale(1.08);
    background: rgba(133,188,32,.16);
    box-shadow: inset 0 0 0 1px rgba(74,124,89,.08);
  }

  .mobile-bottom-nav-item.is-active strong {
    color: var(--green-deep) !important;
    transform: translateY(-1px);
  }

  .mobile-bottom-nav-plus {
    position: relative !important;
    overflow: visible !important;
    width: 66px !important;
    height: 66px !important;
    margin: -31px auto 0 !important;
    display: grid !important;
    place-items: center !important;
    align-content: center !important;
    gap: 0 !important;
    border: 2px solid rgba(255,255,255,.76) !important;
    background:
      radial-gradient(circle at 32% 22%, rgba(255,255,255,.34), transparent 35%),
      linear-gradient(135deg, #74a941, var(--green-deep)) !important;
    box-shadow:
      0 18px 36px rgba(33,91,52,.36),
      0 0 0 8px rgba(138,184,148,.14) !important;
  }

  .mobile-bottom-nav-plus span {
    display: block;
    font-size: 2.15rem;
    line-height: .82;
    transform: translateY(-1px);
    transition: transform .24s cubic-bezier(.18,.88,.22,1) !important;
  }

  .mobile-bottom-nav-plus small {
    display: block;
    margin-top: .14rem;
    font-size: .58rem;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .03em;
    text-transform: uppercase;
    opacity: .92;
  }

  .mobile-bottom-nav-plus:hover,
  .mobile-bottom-nav-plus:focus-visible {
    transform: translateY(-3px) scale(1.035) !important;
    box-shadow:
      0 22px 42px rgba(33,91,52,.40),
      0 0 0 10px rgba(138,184,148,.16) !important;
  }

  .mobile-bottom-nav-plus:active {
    transform: translateY(-1px) scale(.96) !important;
  }

  body.mobile-plus-sheet-open .mobile-bottom-nav,
  body.mobile-category-sheet-open .mobile-bottom-nav {
    transform: translateY(-2px) !important;
    background:
      linear-gradient(180deg, rgba(255,255,255,.97), rgba(232,247,236,.94)) !important;
    border-color: rgba(133,188,32,.22) !important;
  }

  body.mobile-plus-sheet-open .mobile-bottom-nav-plus {
    transform: translateY(-5px) rotate(45deg) scale(1.06) !important;
    background:
      radial-gradient(circle at 30% 20%, rgba(255,255,255,.34), transparent 36%),
      linear-gradient(135deg, #8fc457, #24573a) !important;
  }

  body.mobile-plus-sheet-open .mobile-bottom-nav-plus span {
    transform: translateY(-1px) rotate(0deg);
  }

  body.mobile-plus-sheet-open .mobile-bottom-nav-plus small {
    opacity: 0;
  }

  body.mobile-category-sheet-open .mobile-bottom-nav-more .mobile-bottom-nav-active-glow {
    opacity: 1;
    transform: translateY(0) scale(1);
  }

  .modal-backdrop-mobile-sheet.is-closing,
  .modal-backdrop-notification-popover.is-closing {
    animation: modalBackdropFadeOutV178 .2s ease both !important;
  }

  .modal-content-mobile-sheet.is-closing {
    animation: mobileSheetSlideDownV178 .2s cubic-bezier(.4,0,.9,.4) both !important;
  }

  .modal-content-notification-popover.is-closing {
    animation: notificationPopoverUpV178 .18s ease both !important;
  }
}

details:not(.nav-categories) {
  transition: border-color .22s ease, box-shadow .22s ease, background .22s ease, transform .22s ease;
}

details:not(.nav-categories) > summary {
  cursor: pointer;
  transition: color .2s ease, background .2s ease, transform .2s ease;
  -webkit-tap-highlight-color: transparent;
}

details:not(.nav-categories) > summary::marker {
  transition: transform .2s ease;
}

details:not(.nav-categories)[open] {
  border-color: rgba(133,188,32,.24);
}

details:not(.nav-categories).is-smooth-details {
  contain: layout paint;
  will-change: height;
}

@keyframes modalBackdropFadeOutV178 {
  from { opacity: 1; }
  to { opacity: 0; }
}

@keyframes mobileSheetSlideDownV178 {
  from { opacity: 1; transform: translateY(0) scale(1); }
  to { opacity: 0; transform: translateY(34px) scale(.982); }
}

@keyframes notificationPopoverUpV178 {
  from { opacity: 1; transform: translateY(0) scale(1); }
  to { opacity: 0; transform: translateY(-8px) scale(.985); }
}

:root[data-theme="dark"] .mobile-bottom-nav {
  background:
    radial-gradient(circle at 50% 0%, rgba(143,211,168,.11), transparent 46%),
    linear-gradient(180deg, rgba(13,44,29,.94), rgba(5,24,16,.92)) !important;
  border-color: rgba(143,211,168,.20) !important;
  box-shadow: 0 22px 50px rgba(0,0,0,.46), inset 0 0 0 1px rgba(255,255,255,.04) !important;
}

:root[data-theme="dark"] .mobile-bottom-nav-item {
  color: rgba(237,247,239,.72) !important;
}

:root[data-theme="dark"] .mobile-bottom-nav-active-glow {
  background:
    radial-gradient(circle at 50% 0%, rgba(143,211,168,.24), transparent 48%),
    linear-gradient(135deg, rgba(31,78,51,.96), rgba(12,45,29,.94));
  border-color: rgba(143,211,168,.18);
  box-shadow: 0 12px 28px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.07);
}

:root[data-theme="dark"] .mobile-bottom-nav-item.is-active,
:root[data-theme="dark"] .mobile-bottom-nav-item.is-active strong,
:root[data-theme="dark"] body.mobile-category-sheet-open .mobile-bottom-nav-more {
  color: #f7fff8 !important;
}

:root[data-theme="dark"] body.mobile-plus-sheet-open .mobile-bottom-nav,
:root[data-theme="dark"] body.mobile-category-sheet-open .mobile-bottom-nav {
  background:
    radial-gradient(circle at 50% 0%, rgba(143,211,168,.13), transparent 46%),
    linear-gradient(180deg, rgba(14,50,33,.97), rgba(5,27,18,.96)) !important;
}

@media (prefers-reduced-motion: reduce) {
  .mobile-bottom-nav,
  .mobile-bottom-nav *,
  details:not(.nav-categories),
  details:not(.nav-categories) > summary {
    transition: none !important;
    animation: none !important;
  }
}


/* v179 - Clean Mobile-Taskleiste & Bottom-Sheets ohne Glaslook */
@media (max-width: 900px) {
  .mobile-bottom-nav {
    left: max(.72rem, env(safe-area-inset-left)) !important;
    right: max(.72rem, env(safe-area-inset-right)) !important;
    bottom: calc(.72rem + env(safe-area-inset-bottom)) !important;
    min-height: 70px !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) 58px repeat(2, minmax(0, 1fr)) !important;
    gap: .16rem !important;
    padding: .5rem .56rem !important;
    border-radius: 24px !important;
    background: var(--bg-card) !important;
    border: 1px solid var(--green-pale) !important;
    box-shadow: 0 14px 34px rgba(31, 42, 36, .16) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    transform: none !important;
    overflow: visible !important;
  }

  .mobile-bottom-nav::before,
  .mobile-bottom-nav-active-glow,
  .mobile-bottom-nav-item.is-active .mobile-bottom-nav-active-glow,
  body.mobile-category-sheet-open .mobile-bottom-nav-more .mobile-bottom-nav-active-glow {
    display: none !important;
    opacity: 0 !important;
  }

  .mobile-bottom-nav-item {
    min-height: 52px !important;
    padding: .35rem .12rem .32rem !important;
    border-radius: 18px !important;
    color: var(--text-light) !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background .18s ease, color .18s ease, transform .18s ease, border-color .18s ease !important;
  }

  .mobile-bottom-nav-item::after {
    display: none !important;
  }

  .mobile-bottom-nav-icon {
    width: 30px !important;
    height: 30px !important;
    border-radius: 12px !important;
    display: grid !important;
    place-items: center !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 1.08rem !important;
    transform: none !important;
  }

  .mobile-bottom-nav-item strong {
    max-width: 100% !important;
    margin-top: .08rem !important;
    font-size: .71rem !important;
    line-height: 1.05 !important;
    letter-spacing: -.02em !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    color: inherit !important;
    transform: none !important;
  }

  .mobile-bottom-nav-item:hover,
  .mobile-bottom-nav-item:focus-visible,
  .mobile-bottom-nav-item:active {
    background: rgba(133, 188, 32, .10) !important;
    color: var(--green-deep) !important;
    transform: translateY(-1px) !important;
    filter: none !important;
  }

  .mobile-bottom-nav-item.is-active,
  body.mobile-category-sheet-open .mobile-bottom-nav-more {
    background: rgba(133, 188, 32, .14) !important;
    color: var(--green-deep) !important;
    box-shadow: inset 0 0 0 1px rgba(133, 188, 32, .22) !important;
    transform: none !important;
  }

  .mobile-bottom-nav-item.is-active .mobile-bottom-nav-icon,
  body.mobile-category-sheet-open .mobile-bottom-nav-more .mobile-bottom-nav-icon {
    background: rgba(133, 188, 32, .14) !important;
    transform: none !important;
    box-shadow: none !important;
  }

  .mobile-bottom-nav-plus {
    width: 58px !important;
    height: 58px !important;
    margin: -22px auto 0 !important;
    border-radius: 999px !important;
    border: 3px solid var(--bg-card) !important;
    background: var(--green-medium) !important;
    color: #fff !important;
    box-shadow: 0 12px 26px rgba(31, 90, 55, .30) !important;
    display: grid !important;
    place-items: center !important;
    align-content: center !important;
    gap: 0 !important;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease !important;
  }

  .mobile-bottom-nav-plus::after {
    display: none !important;
  }

  .mobile-bottom-nav-plus span {
    font-size: 2rem !important;
    line-height: .86 !important;
    transform: translateY(-1px) !important;
  }

  .mobile-bottom-nav-plus small {
    margin-top: .12rem !important;
    font-size: .57rem !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: .03em !important;
    opacity: .95 !important;
  }

  .mobile-bottom-nav-plus:hover,
  .mobile-bottom-nav-plus:focus-visible,
  .mobile-bottom-nav-plus:active {
    transform: translateY(-2px) scale(1.02) !important;
    background: var(--green-deep) !important;
    box-shadow: 0 14px 30px rgba(31, 90, 55, .34) !important;
  }

  body.mobile-plus-sheet-open .mobile-bottom-nav,
  body.mobile-category-sheet-open .mobile-bottom-nav {
    background: var(--bg-card) !important;
    border-color: var(--green-pale) !important;
    box-shadow: 0 14px 34px rgba(31, 42, 36, .18) !important;
    transform: none !important;
  }

  body.mobile-plus-sheet-open .mobile-bottom-nav-plus {
    transform: translateY(-2px) rotate(45deg) scale(1) !important;
    background: var(--green-deep) !important;
    box-shadow: 0 14px 30px rgba(31, 90, 55, .36) !important;
  }

  body.mobile-plus-sheet-open .mobile-bottom-nav-plus small {
    opacity: 0 !important;
  }

  .modal-backdrop-mobile-sheet {
    align-items: flex-end !important;
    justify-content: flex-end !important;
    padding: 0 max(.72rem, env(safe-area-inset-right)) calc(5.55rem + env(safe-area-inset-bottom)) max(.72rem, env(safe-area-inset-left)) !important;
    background: rgba(4, 12, 8, .40) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    overflow: hidden !important;
  }

  .modal-content-mobile-sheet {
    width: min(100%, 720px) !important;
    max-width: min(100%, 720px) !important;
    min-height: auto !important;
    max-height: min(72dvh, 680px) !important;
    margin: 0 auto .15rem !important;
    padding: .95rem .95rem 1rem !important;
    border-radius: 26px !important;
    background: var(--bg-card) !important;
    border: 1px solid var(--green-pale) !important;
    color: var(--text-dark) !important;
    box-shadow: 0 -18px 46px rgba(31, 42, 36, .24) !important;
    animation: mobileSheetCleanV179 .28s cubic-bezier(.2, .86, .24, 1) both !important;
    overflow: hidden !important;
  }

  .modal-content-mobile-sheet.is-expanded {
    max-height: min(86dvh, 860px) !important;
  }

  .modal-content-mobile-sheet::after {
    display: none !important;
  }

  .modal-content-mobile-sheet .modal-close {
    top: .82rem !important;
    right: .82rem !important;
    width: 44px !important;
    height: 44px !important;
    border-radius: 999px !important;
    background: rgba(74, 124, 89, .12) !important;
    color: var(--green-deep) !important;
    border: 1px solid rgba(74, 124, 89, .14) !important;
  }

  .mobile-sheet-handle {
    width: 48px !important;
    height: 5px !important;
    margin: .08rem auto .82rem !important;
    border-radius: 999px !important;
    background: rgba(31, 42, 36, .20) !important;
  }

  .mobile-nav-sheet-head {
    margin-bottom: .82rem !important;
    padding-right: 3.2rem !important;
  }

  .mobile-nav-sheet-head .eyebrow {
    font-size: .82rem !important;
    letter-spacing: .03em !important;
  }

  .mobile-nav-sheet-head h2 {
    margin: .18rem 0 0 !important;
    font-size: clamp(1.35rem, 7vw, 1.85rem) !important;
    line-height: 1.08 !important;
    color: var(--green-deep) !important;
  }

  .quick-add-sheet .mobile-nav-sheet-head p {
    display: none !important;
  }

  .quick-add-sheet .mobile-nav-sheet-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .68rem !important;
    align-content: start !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding: .04rem .02rem .75rem !important;
  }

  .quick-add-sheet .mobile-nav-sheet-link {
    min-height: 108px !important;
    height: auto !important;
    padding: .82rem .84rem !important;
    border-radius: 20px !important;
    display: grid !important;
    grid-template-rows: auto auto minmax(0, 1fr) !important;
    align-content: start !important;
    align-items: start !important;
    gap: .3rem !important;
    background: rgba(74, 124, 89, .055) !important;
    border: 1px solid rgba(74, 124, 89, .15) !important;
    box-shadow: none !important;
    overflow: hidden !important;
    color: var(--text-dark) !important;
    transition: transform .18s ease, background .18s ease, border-color .18s ease !important;
  }

  .quick-add-sheet .mobile-nav-sheet-link:hover,
  .quick-add-sheet .mobile-nav-sheet-link:focus-visible,
  .quick-add-sheet .mobile-nav-sheet-link:active {
    background: rgba(133, 188, 32, .11) !important;
    border-color: rgba(133, 188, 32, .28) !important;
    transform: translateY(-1px) !important;
  }

  .quick-add-sheet .mobile-nav-sheet-link span {
    width: 38px !important;
    height: 38px !important;
    border-radius: 14px !important;
    display: grid !important;
    place-items: center !important;
    background: rgba(133, 188, 32, .13) !important;
    font-size: 1.22rem !important;
    line-height: 1 !important;
  }

  .quick-add-sheet .mobile-nav-sheet-link strong {
    min-width: 0 !important;
    font-size: 1.03rem !important;
    line-height: 1.12 !important;
    font-weight: 900 !important;
    color: var(--green-deep) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .quick-add-sheet .mobile-nav-sheet-link small {
    min-width: 0 !important;
    max-width: 100% !important;
    display: block !important;
    color: var(--text-light) !important;
    font-size: .78rem !important;
    line-height: 1.22 !important;
    font-weight: 750 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .category-sheet .mobile-category-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .62rem !important;
    align-content: start !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding: .04rem .02rem .75rem !important;
  }

  .category-sheet .mobile-category-link {
    min-height: 64px !important;
    padding: .68rem .72rem !important;
    border-radius: 18px !important;
    background: rgba(74, 124, 89, .055) !important;
    border: 1px solid rgba(74, 124, 89, .15) !important;
    box-shadow: none !important;
  }

  .category-sheet .mobile-category-link span {
    width: 36px !important;
    height: 36px !important;
    flex: 0 0 36px !important;
    border-radius: 13px !important;
    background: rgba(133, 188, 32, .13) !important;
  }

  .category-sheet .mobile-category-link strong {
    color: var(--green-deep) !important;
    font-size: clamp(.88rem, 3.45vw, .98rem) !important;
    line-height: 1.14 !important;
    white-space: normal !important;
    overflow: hidden !important;
    text-overflow: clip !important;
  }

  .modal-backdrop-mobile-sheet.is-closing {
    animation: modalBackdropFadeOutV179 .18s ease both !important;
  }

  .modal-content-mobile-sheet.is-closing {
    animation: mobileSheetCleanOutV179 .18s cubic-bezier(.4, 0, .9, .4) both !important;
  }
}

@media (max-width: 380px) {
  .quick-add-sheet .mobile-nav-sheet-grid,
  .category-sheet .mobile-category-list {
    grid-template-columns: 1fr !important;
  }
}

@keyframes mobileSheetCleanV179 {
  from { opacity: 0; transform: translateY(34px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes mobileSheetCleanOutV179 {
  from { opacity: 1; transform: translateY(0) scale(1); }
  to { opacity: 0; transform: translateY(28px) scale(.985); }
}

@keyframes modalBackdropFadeOutV179 {
  from { opacity: 1; }
  to { opacity: 0; }
}

:root[data-theme="dark"] .mobile-bottom-nav {
  background: var(--bg-card) !important;
  border-color: var(--border-soft) !important;
  box-shadow: 0 16px 38px rgba(0, 0, 0, .42) !important;
}

:root[data-theme="dark"] .mobile-bottom-nav-item {
  color: var(--text-light) !important;
}

:root[data-theme="dark"] .mobile-bottom-nav-item:hover,
:root[data-theme="dark"] .mobile-bottom-nav-item:focus-visible,
:root[data-theme="dark"] .mobile-bottom-nav-item:active,
:root[data-theme="dark"] .mobile-bottom-nav-item.is-active,
:root[data-theme="dark"] body.mobile-category-sheet-open .mobile-bottom-nav-more {
  background: rgba(143, 211, 168, .12) !important;
  color: var(--text-dark) !important;
  box-shadow: inset 0 0 0 1px rgba(143, 211, 168, .17) !important;
}

:root[data-theme="dark"] .mobile-bottom-nav-plus {
  border-color: var(--bg-card) !important;
  background: var(--green-medium) !important;
  color: #06100b !important;
  box-shadow: 0 14px 30px rgba(0, 0, 0, .38) !important;
}

:root[data-theme="dark"] body.mobile-plus-sheet-open .mobile-bottom-nav,
:root[data-theme="dark"] body.mobile-category-sheet-open .mobile-bottom-nav {
  background: var(--bg-card) !important;
  border-color: var(--border-soft) !important;
}

:root[data-theme="dark"] .modal-backdrop-mobile-sheet {
  background: rgba(0, 0, 0, .46) !important;
}

:root[data-theme="dark"] .modal-content-mobile-sheet {
  background: var(--bg-card) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-dark) !important;
  box-shadow: 0 -18px 46px rgba(0, 0, 0, .44) !important;
}

:root[data-theme="dark"] .modal-content-mobile-sheet .modal-close {
  background: rgba(255, 255, 255, .07) !important;
  color: var(--text-dark) !important;
  border-color: var(--border-soft) !important;
}

:root[data-theme="dark"] .mobile-sheet-handle {
  background: rgba(255, 255, 255, .22) !important;
}

:root[data-theme="dark"] .mobile-nav-sheet-head h2,
:root[data-theme="dark"] .quick-add-sheet .mobile-nav-sheet-link strong,
:root[data-theme="dark"] .category-sheet .mobile-category-link strong {
  color: var(--text-dark) !important;
}

:root[data-theme="dark"] .quick-add-sheet .mobile-nav-sheet-link,
:root[data-theme="dark"] .category-sheet .mobile-category-link {
  background: rgba(255, 255, 255, .045) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-dark) !important;
  box-shadow: none !important;
}

:root[data-theme="dark"] .quick-add-sheet .mobile-nav-sheet-link:hover,
:root[data-theme="dark"] .quick-add-sheet .mobile-nav-sheet-link:focus-visible,
:root[data-theme="dark"] .quick-add-sheet .mobile-nav-sheet-link:active,
:root[data-theme="dark"] .category-sheet .mobile-category-link:hover,
:root[data-theme="dark"] .category-sheet .mobile-category-link:focus-visible,
:root[data-theme="dark"] .category-sheet .mobile-category-link:active {
  background: rgba(143, 211, 168, .09) !important;
  border-color: rgba(143, 211, 168, .22) !important;
}

:root[data-theme="dark"] .quick-add-sheet .mobile-nav-sheet-link span,
:root[data-theme="dark"] .category-sheet .mobile-category-link span,
:root[data-theme="dark"] .mobile-bottom-nav-item.is-active .mobile-bottom-nav-icon,
:root[data-theme="dark"] body.mobile-category-sheet-open .mobile-bottom-nav-more .mobile-bottom-nav-icon {
  background: rgba(143, 211, 168, .12) !important;
}

:root[data-theme="dark"] .quick-add-sheet .mobile-nav-sheet-link small {
  color: var(--text-light) !important;
}


/* v180 - Darkmode der mobilen Bottom-Navigation ruhiger und stimmiger */
@media (max-width: 900px) {
  :root[data-theme="dark"] .mobile-bottom-nav {
    background: #0d1913 !important;
    border-color: rgba(207, 232, 214, 0.12) !important;
    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.42) !important;
  }

  :root[data-theme="dark"] .mobile-bottom-nav::before {
    background: linear-gradient(90deg, transparent, rgba(134, 205, 150, 0.16), transparent) !important;
    opacity: .9 !important;
  }

  :root[data-theme="dark"] .mobile-bottom-nav-item {
    color: rgba(233, 244, 236, 0.76) !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  :root[data-theme="dark"] .mobile-bottom-nav-item:hover,
  :root[data-theme="dark"] .mobile-bottom-nav-item:focus-visible {
    background: rgba(134, 205, 150, 0.08) !important;
    color: #f5fff7 !important;
    box-shadow: none !important;
  }

  :root[data-theme="dark"] .mobile-bottom-nav-item:active {
    background: rgba(134, 205, 150, 0.10) !important;
    color: #f5fff7 !important;
    box-shadow: none !important;
  }

  :root[data-theme="dark"] .mobile-bottom-nav-active-glow {
    background: rgba(134, 205, 150, 0.12) !important;
    border: 1px solid rgba(134, 205, 150, 0.18) !important;
    box-shadow: none !important;
  }

  :root[data-theme="dark"] .mobile-bottom-nav-item.is-active,
  :root[data-theme="dark"] body.mobile-category-sheet-open .mobile-bottom-nav-more {
    background: rgba(134, 205, 150, 0.08) !important;
    color: #f5fff7 !important;
    box-shadow: inset 0 0 0 1px rgba(134, 205, 150, 0.16) !important;
  }

  :root[data-theme="dark"] .mobile-bottom-nav-item.is-active strong,
  :root[data-theme="dark"] body.mobile-category-sheet-open .mobile-bottom-nav-more strong {
    color: #f5fff7 !important;
  }

  :root[data-theme="dark"] .mobile-bottom-nav-item.is-active .mobile-bottom-nav-icon,
  :root[data-theme="dark"] body.mobile-category-sheet-open .mobile-bottom-nav-more .mobile-bottom-nav-icon {
    background: rgba(134, 205, 150, 0.14) !important;
    box-shadow: inset 0 0 0 1px rgba(134, 205, 150, 0.12) !important;
  }

  :root[data-theme="dark"] .mobile-bottom-nav-item::after {
    background: #86cd96 !important;
  }

  :root[data-theme="dark"] .mobile-bottom-nav-plus {
    border-color: #0d1913 !important;
    background: #4b8357 !important;
    color: #ffffff !important;
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.38) !important;
  }

  :root[data-theme="dark"] .mobile-bottom-nav-plus small,
  :root[data-theme="dark"] .mobile-bottom-nav-plus span {
    color: #ffffff !important;
  }

  :root[data-theme="dark"] .mobile-bottom-nav-plus:hover,
  :root[data-theme="dark"] .mobile-bottom-nav-plus:focus-visible,
  :root[data-theme="dark"] .mobile-bottom-nav-plus:active {
    background: #5b9667 !important;
    color: #ffffff !important;
    box-shadow: 0 16px 30px rgba(0, 0, 0, 0.42) !important;
  }

  :root[data-theme="dark"] body.mobile-plus-sheet-open .mobile-bottom-nav,
  :root[data-theme="dark"] body.mobile-category-sheet-open .mobile-bottom-nav {
    background: #112019 !important;
    border-color: rgba(207, 232, 214, 0.14) !important;
  }

  :root[data-theme="dark"] body.mobile-plus-sheet-open .mobile-bottom-nav-plus {
    background: #5b9667 !important;
    color: #ffffff !important;
  }

  :root[data-theme="dark"] .modal-content-mobile-sheet {
    background: #122019 !important;
    border-color: rgba(207, 232, 214, 0.12) !important;
    box-shadow: 0 -18px 46px rgba(0, 0, 0, 0.42) !important;
  }

  :root[data-theme="dark"] .modal-content-mobile-sheet .modal-close {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(207, 232, 214, 0.10) !important;
    color: #f5fff7 !important;
  }

  :root[data-theme="dark"] .mobile-sheet-handle {
    background: rgba(255, 255, 255, 0.18) !important;
  }

  :root[data-theme="dark"] .quick-add-sheet .mobile-nav-sheet-link,
  :root[data-theme="dark"] .category-sheet .mobile-category-link {
    background: rgba(255, 255, 255, 0.04) !important;
    border-color: rgba(207, 232, 214, 0.10) !important;
    color: #f5fff7 !important;
  }

  :root[data-theme="dark"] .quick-add-sheet .mobile-nav-sheet-link:hover,
  :root[data-theme="dark"] .quick-add-sheet .mobile-nav-sheet-link:focus-visible,
  :root[data-theme="dark"] .quick-add-sheet .mobile-nav-sheet-link:active,
  :root[data-theme="dark"] .category-sheet .mobile-category-link:hover,
  :root[data-theme="dark"] .category-sheet .mobile-category-link:focus-visible,
  :root[data-theme="dark"] .category-sheet .mobile-category-link:active {
    background: rgba(134, 205, 150, 0.10) !important;
    border-color: rgba(134, 205, 150, 0.18) !important;
  }

  :root[data-theme="dark"] .quick-add-sheet .mobile-nav-sheet-link span,
  :root[data-theme="dark"] .category-sheet .mobile-category-link span {
    background: rgba(134, 205, 150, 0.14) !important;
  }

  :root[data-theme="dark"] .quick-add-sheet .mobile-nav-sheet-link strong,
  :root[data-theme="dark"] .category-sheet .mobile-category-link strong {
    color: #f5fff7 !important;
  }

  :root[data-theme="dark"] .quick-add-sheet .mobile-nav-sheet-link small {
    color: rgba(233, 244, 236, 0.72) !important;
  }
}

/* v182 - Scroll wieder sauber + Kalender-Formularbutton unten lassen */
@media (max-width: 900px) {
  body.familie-modal-open .modal-backdrop:has(#perm-form),
  body.familie-modal-open .modal-backdrop:has(#event-form) {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
    overscroll-behavior-y: contain !important;
    align-items: flex-start !important;
    padding-bottom: calc(7.4rem + env(safe-area-inset-bottom)) !important;
  }

  body.familie-modal-open .modal-content:has(#perm-form),
  body.familie-modal-open .modal-content:has(#event-form) {
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
    margin-bottom: calc(1.2rem + env(safe-area-inset-bottom)) !important;
  }

  body.familie-modal-open .modal-content:has(#event-form) {
    padding-bottom: 1.15rem !important;
  }

  #event-form { padding-bottom: 0 !important; }

  #event-form .calendar-form-actions {
    position: static !important;
    bottom: auto !important;
    z-index: auto !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: .65rem !important;
    margin-top: 1.15rem !important;
    padding-top: .25rem !important;
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
  }

  #event-form .calendar-form-actions .btn { min-height: 50px !important; }
}

@media (max-width: 720px) {
  html, body { overflow-y: auto; }
  body.familie-modal-open { overflow: hidden !important; }
}


/* v183 - PWA Scroll-Fix: Android/WebView darf wieder sauber scrollen */
@media (max-width: 900px) {
  html,
  body {
    min-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: auto !important;
    touch-action: pan-y !important;
  }

  body:not(.familie-modal-open) {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    width: auto !important;
    overflow-y: auto !important;
    touch-action: pan-y !important;
  }

  body.familie-modal-open {
    position: static !important;
    overflow-y: hidden !important;
    touch-action: auto !important;
  }

  body.familie-modal-open .modal-backdrop {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: contain !important;
    touch-action: pan-y !important;
  }

  body.familie-modal-open .modal-content {
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
    overscroll-behavior-y: contain !important;
  }

  body.familie-modal-open .modal-backdrop:has(#perm-form),
  body.familie-modal-open .modal-backdrop:has(#event-form) {
    align-items: flex-start !important;
    justify-content: center !important;
    padding: calc(.75rem + env(safe-area-inset-top)) .75rem calc(.9rem + env(safe-area-inset-bottom)) !important;
    overflow: hidden !important;
  }

  body.familie-modal-open .modal-content:has(#perm-form),
  body.familie-modal-open .modal-content:has(#event-form) {
    max-height: calc(100dvh - 1.7rem - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
    height: auto !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    margin: 0 !important;
    padding-bottom: max(1.15rem, env(safe-area-inset-bottom)) !important;
    scroll-padding-bottom: 1.25rem !important;
  }

  body.familie-modal-open .modal-content:has(#event-form) {
    padding-bottom: max(1.25rem, env(safe-area-inset-bottom)) !important;
  }

  #event-form {
    padding-bottom: 0 !important;
  }

  #event-form .calendar-form-actions {
    position: static !important;
    bottom: auto !important;
    z-index: auto !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: .65rem !important;
    margin-top: 1.15rem !important;
    padding-top: .25rem !important;
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
  }
}


/* v184 - PWA Scroll-Fix für Kalender/Admin + externer Hausbutton + aktiver Plusbutton */
@media (max-width: 900px) {
  body:not(.familie-modal-open),
  body:not(.familie-modal-open) .page-wrapper,
  body:not(.familie-modal-open) .main-content {
    touch-action: pan-y !important;
  }

  body.familie-modal-open.familie-form-modal-open {
    position: static !important;
    overflow-y: hidden !important;
    overflow-x: hidden !important;
    touch-action: pan-y !important;
  }

  body.familie-modal-open .modal-backdrop-form-scroll,
  body.familie-modal-open .modal-backdrop-permissions,
  body.familie-modal-open .modal-backdrop-calendar-event,
  body.familie-modal-open .modal-backdrop:has(#perm-form),
  body.familie-modal-open .modal-backdrop:has(#event-form) {
    position: fixed !important;
    inset: 0 !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: contain !important;
    touch-action: pan-y !important;
    padding: calc(.8rem + env(safe-area-inset-top)) .75rem calc(8.7rem + env(safe-area-inset-bottom)) !important;
  }

  body.familie-modal-open .modal-content-form-scroll,
  body.familie-modal-open .modal-content-permissions,
  body.familie-modal-open .modal-content-calendar-event,
  body.familie-modal-open .modal-content:has(#perm-form),
  body.familie-modal-open .modal-content:has(#event-form) {
    width: min(94vw, 760px) !important;
    max-height: none !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    overflow-y: visible !important;
    overflow-x: visible !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
    margin: 0 auto !important;
    padding-bottom: 1.25rem !important;
    transform: none !important;
    contain: none !important;
  }

  body.familie-modal-open .modal-content-form-scroll .modal-close,
  body.familie-modal-open .modal-content-permissions .modal-close,
  body.familie-modal-open .modal-content-calendar-event .modal-close {
    position: sticky !important;
    top: .35rem !important;
    margin-left: auto !important;
    float: right !important;
    z-index: 5 !important;
  }

  #perm-form,
  #event-form,
  .admin-permissions-modal-v181,
  .admin-permissions-form-v181,
  .admin-permission-section-v181,
  .member-smartlife-access {
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
    overflow-y: visible !important;
    touch-action: pan-y !important;
  }

  .member-smartlife-access .qr-smartlife-list,
  .qr-smartlife-list {
    max-height: none !important;
    overflow: visible !important;
    padding-right: 0 !important;
  }

  .admin-permission-save-v181,
  #event-form .calendar-form-actions {
    position: static !important;
    bottom: auto !important;
    z-index: auto !important;
    margin-bottom: .25rem !important;
  }

  #event-form .calendar-form-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: .65rem !important;
    margin-top: 1.15rem !important;
    padding: .25rem 0 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.mobile-plus-sheet-open .mobile-bottom-nav-plus {
    transform: translateY(-6px) scale(1.05) !important;
    background:
      radial-gradient(circle at 30% 18%, rgba(255,255,255,.38), transparent 34%),
      linear-gradient(135deg, #6fbf7b, #275f3e) !important;
    border-color: rgba(239,255,242,.95) !important;
    box-shadow:
      0 18px 34px rgba(20, 74, 43, .42),
      0 0 0 8px rgba(111, 191, 123, .16),
      inset 0 1px 0 rgba(255,255,255,.30) !important;
  }

  body.mobile-plus-sheet-open .mobile-bottom-nav-plus span {
    transform: translateY(-1px) rotate(45deg) scale(.96) !important;
  }

  body.mobile-plus-sheet-open .mobile-bottom-nav-plus small {
    font-size: 0 !important;
    opacity: 1 !important;
  }

  body.mobile-plus-sheet-open .mobile-bottom-nav-plus small::after {
    content: 'Zu';
    font-size: .57rem !important;
    font-weight: 900 !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
  }
}

.external-site-back,
.external-return-home-btn {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  z-index: 2147483000 !important;
}

.external-return-home-btn {
  display: grid !important;
  place-items: center !important;
  bottom: calc(1rem + env(safe-area-inset-bottom)) !important;
  right: max(1rem, env(safe-area-inset-right)) !important;
  width: 52px !important;
  height: 52px !important;
  font-size: 1.32rem !important;
  opacity: .96 !important;
  pointer-events: auto !important;
  transform: none !important;
}

@media (max-width: 900px) {
  .external-return-home-btn {
    bottom: calc(7.35rem + env(safe-area-inset-bottom)) !important;
  }

  body.mobile-plus-sheet-open .external-return-home-btn,
  body.mobile-category-sheet-open .external-return-home-btn {
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateY(10px) scale(.92) !important;
  }
}

:root[data-theme="dark"] body.mobile-plus-sheet-open .mobile-bottom-nav-plus {
  background:
    radial-gradient(circle at 30% 18%, rgba(255,255,255,.24), transparent 34%),
    linear-gradient(135deg, #5e9e69, #1e4b33) !important;
  border-color: #0d1913 !important;
  box-shadow:
    0 18px 36px rgba(0,0,0,.44),
    0 0 0 8px rgba(111,191,123,.13),
    inset 0 1px 0 rgba(255,255,255,.14) !important;
}


/* v190 - Desktop-Header ruhiger, Logo schöner, Kategorien mittiger */
@media (min-width: 901px) {
  .navbar {
    padding: .82rem 0 .8rem !important;
  }

  .navbar-toprow {
    display: grid !important;
    grid-template-columns: minmax(260px, auto) minmax(300px, 1fr) auto !important;
    align-items: center !important;
    gap: 1.1rem !important;
  }

  .navbar-brand {
    max-width: none !important;
    gap: .78rem !important;
  }

  .navbar-brand-logo {
    width: 56px !important;
    height: 56px !important;
    flex: 0 0 56px !important;
    border-radius: 20px !important;
    padding: .38rem !important;
    background:
      radial-gradient(circle at 28% 22%, rgba(214, 247, 199, .34), transparent 42%),
      linear-gradient(145deg, rgba(13, 63, 37, .94), rgba(8, 36, 24, .98)) !important;
    border: 1px solid rgba(145, 211, 162, .18) !important;
    box-shadow: 0 18px 34px rgba(6, 32, 20, .18), inset 0 1px 0 rgba(255,255,255,.08) !important;
  }

  .navbar-brand-wordmark {
    display: inline-flex !important;
    align-items: baseline !important;
    gap: .28rem !important;
    overflow: visible !important;
  }

  .navbar-brand-main {
    font-size: clamp(1.95rem, 2vw, 2.25rem) !important;
    letter-spacing: -.045em !important;
  }

  .navbar-brand-accent {
    display: inline !important;
    font-size: clamp(1.5rem, 1.7vw, 1.82rem) !important;
    font-style: italic !important;
    opacity: .9 !important;
    letter-spacing: -.04em !important;
  }

  .navbar-actions {
    display: grid !important;
    grid-template-columns: auto minmax(280px, 360px) auto !important;
    align-items: center !important;
    justify-content: end !important;
    gap: .9rem !important;
    margin-left: 0 !important;
    flex: 0 0 auto !important;
    width: auto !important;
  }

  .navbar-actions .nav-categories {
    justify-self: center !important;
    width: 100% !important;
  }

  .navbar-actions .nav-categories-summary {
    min-height: 56px !important;
    width: 100% !important;
    padding: .52rem .95rem !important;
    border-radius: 22px !important;
    gap: .75rem !important;
    background: linear-gradient(145deg, rgba(14, 66, 39, .96), rgba(6, 45, 28, .98)) !important;
    border: 1px solid rgba(145, 211, 162, .18) !important;
    box-shadow: 0 18px 34px rgba(7, 36, 22, .16), inset 0 1px 0 rgba(255,255,255,.06) !important;
  }

  .nav-categories-current {
    display: inline-flex !important;
    align-items: center !important;
    min-width: 0 !important;
    max-width: 15rem !important;
    padding: .44rem .72rem !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.08) !important;
    color: rgba(245, 251, 247, .96) !important;
    font-weight: 900 !important;
  }

  .nav-categories-toggle {
    margin-left: auto !important;
    font-size: .92rem !important;
    font-weight: 850 !important;
    color: rgba(236, 248, 239, .84) !important;
    letter-spacing: .01em !important;
  }

  .nav-user {
    min-height: 56px !important;
    padding: .48rem .7rem !important;
    border-radius: 22px !important;
    gap: .72rem !important;
    box-shadow: 0 18px 34px rgba(7, 36, 22, .12), inset 0 1px 0 rgba(255,255,255,.06) !important;
  }

  .nav-user-avatar {
    width: 42px !important;
    height: 42px !important;
  }

  .nav-user-name {
    font-size: .99rem !important;
  }

  .nav-user-subtitle {
    font-size: .78rem !important;
  }

  :root[data-theme="dark"] .navbar-brand-logo {
    background:
      radial-gradient(circle at 28% 22%, rgba(214, 247, 199, .18), transparent 42%),
      linear-gradient(145deg, rgba(10, 42, 27, .98), rgba(5, 23, 15, .99)) !important;
    border-color: rgba(192, 230, 201, .14) !important;
  }

  :root[data-theme="dark"] .navbar-actions .nav-categories-summary {
    background: linear-gradient(145deg, rgba(9, 37, 23, .98), rgba(5, 24, 15, .99)) !important;
    border-color: rgba(192, 230, 201, .14) !important;
  }
}

/* v213 - KI-Text wird sanft Zeichen für Zeichen eingeblendet, ohne das Chat-Design zu ändern */
.smart-chat-animated-text.is-typing::after {
  content: '▌';
  display: inline-block;
  margin-left: .08em;
  opacity: .72;
  animation: smartChatCaretV213 .85s steps(2, start) infinite;
}
@keyframes smartChatCaretV213 { 50% { opacity: .08; } }

/* v214 - Fettformatierung in animierten KI-Texten bleibt im Satz */
.smart-chat-animated-text strong,
.smart-chat-bubble p strong {
  display: inline !important;
  font-size: inherit !important;
  line-height: inherit !important;
  margin: 0 !important;
}

/* v215 - Einkaufsliste Bottom-Sheet polish */
.shopping-add-sheet-v215 { padding: .2rem .1rem .4rem; }
.shopping-add-head-v215 { padding: .2rem .15rem .8rem; }
.shopping-add-head-v215 h2 { margin: .2rem 0 .25rem; font-size: clamp(1.55rem, 6vw, 2.15rem); }
.shopping-add-form-v215 { display: grid; gap: .9rem; }
.shopping-add-input-card-v215,
.shopping-qty-card-v215,
.shopping-category-card-v215 { margin: 0; padding: .85rem; border-radius: 24px; background: rgba(255,255,255,.72); border: 1px solid rgba(133,188,32,.18); box-shadow: 0 12px 30px rgba(20,60,34,.08); }
.shopping-save-btn-v215 { min-height: 54px; border-radius: 22px; font-size: 1.05rem; }