/* Lokale Schrift-Definitionen als Ersatz für Google Fonts */
  @font-face {
    font-family: 'Lora';
    src: local('Georgia'), local('Times New Roman');
    font-style: normal;
  }
  @font-face {
    font-family: 'DM Sans';
    src: local('Segoe UI'), local('Helvetica Neue'), local('Arial');
    font-style: normal;
  }

  :root {
    --bg: #f3f5f1;
    --bg2: #e8eee5;
    --bg3: #d7e0d5;
    --card: #fffefa;
    --card-soft: #f9fbf6;
    --border: #d4ddd1;
    --text: #273024;
    --text2: #596555;
    --text3: #82907d;
    --accent: #58745d;
    --accent2: #9d7751;
    --accent3: #638b6d;
    --warm: #b47a58;
    --blue: #6f8fa0;
    --success: #58745d;
    --info: #6f8fa0;
    --warning: #b47a58;
    --danger: #9f4f45;
    --radius: 10px;
    --shadow: 0 1px 8px rgba(39,48,36,0.06);
    --shadow-lg: 0 8px 26px rgba(39,48,36,0.12);
    --shadow-focus: 0 10px 28px rgba(39,48,36,0.14);
    --ease-soft: cubic-bezier(.2,.8,.2,1);
  }

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

  body {
    font-family: 'DM Sans', sans-serif;
    background: var(--bg);
    color: var(--text);
    min-height: 100vh;
    font-size: 15px;
    line-height: 1.6;
  }

  /* ============================================================
     LIZENZ-SCREEN
     ============================================================ */
  #lizenz-screen {
    display: none;
    position: fixed;
    inset: 0;
    background: linear-gradient(135deg, #2c2416 0%, #4a3c28 100%);
    z-index: 9999;
    align-items: center;
    justify-content: center;
    padding: 24px;
  }
  #lizenz-screen.show { display: flex; }
  .lizenz-box {
    background: #faf7f2;
    border-radius: 20px;
    padding: 32px 28px;
    max-width: 380px;
    width: 100%;
    text-align: center;
    box-shadow: 0 8px 40px rgba(0,0,0,0.3);
  }
  .lizenz-logo {
    font-size: 48px;
    margin-bottom: 12px;
  }
  .lizenz-titel {
    font-family: 'Lora', serif;
    font-size: 22px;
    font-weight: 500;
    color: var(--text);
    margin-bottom: 6px;
  }
  .lizenz-sub {
    font-size: 13px;
    color: var(--text3);
    margin-bottom: 28px;
    line-height: 1.5;
  }
  .lizenz-label {
    font-size: 12px;
    color: var(--text2);
    text-align: left;
    margin-bottom: 6px;
    font-weight: 500;
  }
  .lizenz-input {
    width: 100%;
    background: var(--bg);
    border: 2px solid var(--border);
    border-radius: 10px;
    padding: 12px 14px;
    font-family: 'DM Sans', sans-serif;
    font-size: 15px;
    color: var(--text);
    outline: none;
    letter-spacing: 0;
    text-align: center;
    transition: border-color 0.2s;
    margin-bottom: 8px;
  }
  .lizenz-input:focus { border-color: var(--accent2); }
  .lizenz-error {
    font-size: 12px;
    color: var(--warm);
    margin-bottom: 12px;
    min-height: 18px;
  }
  .lizenz-btn {
    width: 100%;
    background: var(--accent);
    color: #f5f0e8;
    border: none;
    border-radius: 10px;
    padding: 13px;
    font-family: 'DM Sans', sans-serif;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s;
  }
  .lizenz-btn:hover { background: #5a4f3c; }
  .lizenz-hinweis {
    font-size: 11px;
    color: var(--text3);
    margin-top: 16px;
    line-height: 1.5;
  }

  /* IMPULS HEADER */
  #impuls-header {
    background: #cddfca;
    color: #1f2a21;
    padding: 12px 20px 14px;
    position: sticky;
    top: 0;
    z-index: 100;
    border-bottom: 1px solid rgba(67,91,70,0.42);
    box-shadow: 0 3px 16px rgba(31,42,33,0.14);
  }
  .app-titel-bereich {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 8px;
    border-bottom: 1px solid rgba(111,127,112,0.20);
    padding-bottom: 8px;
  }
  .header-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 5px;
    margin-left: 12px;
  }
  .header-greeting {
    text-align: right;
    color: #263629;
    line-height: 1.25;
    max-width: min(52vw, 420px);
    overflow-wrap: anywhere;
  }
  .header-greeting-main {
    font-family: 'Lora', serif;
    font-size: 15px;
    font-weight: 600;
  }
  .header-greeting-date {
    font-size: 11px;
    color: #566958;
  }
  .header-tools {
    display: flex;
    align-items: center;
    gap: 5px;
  }
  #app-titel-anzeige {
    font-family: 'Lora', serif;
    font-size: 18px;
    font-weight: 500;
    color: #1f2a21;
  }
  #app-untertitel-anzeige {
    font-size: 11px;
    color: #566958;
    letter-spacing: 0.5px;
  }
  #app-titel-edit-bereich {
    display: none;
    margin-bottom: 8px;
    border-bottom: 1px solid rgba(111,127,112,0.20);
    padding-bottom: 8px;
  }
  #app-titel-edit-bereich input {
    background: rgba(255,255,255,0.58);
    border: 1px solid rgba(111,127,112,0.28);
    border-radius: 6px;
    color: #1f2a21;
    padding: 4px 8px;
    font-family: 'Lora', serif;
    font-size: 15px;
    width: 100%;
    margin-bottom: 5px;
  }
  #app-titel-edit-bereich input::placeholder { color: rgba(31,42,33,0.42); }
  .titel-edit-aktionen { display: flex; gap: 8px; }
  .titel-edit-aktionen button {
    font-size: 12px;
    padding: 3px 10px;
    border-radius: 5px;
    border: none;
    cursor: pointer;
  }
  .btn-titel-ok { background: var(--accent2); color: #fff; }
  .btn-titel-ab { background: rgba(255,255,255,0.62); color: #2f3f31; }
  .impuls-label {
    font-size: 10px;
    letter-spacing: 0;
    text-transform: uppercase;
    color: #c57a3d;
    margin-bottom: 4px;
    font-family: 'DM Sans', sans-serif;
    font-weight: 500;
  }
  .impuls-text {
    font-family: 'Lora', serif;
    font-style: italic;
    font-size: 16px;
    line-height: 1.5;
    color: #2f3f31;
  }
  .impuls-kategorie {
    font-size: 11px;
    color: #566958;
    margin-top: 4px;
  }
  .header-halt-btn {
    border: 1px solid rgba(111,127,112,0.34);
    border-radius: 999px;
    background: rgba(255,255,255,0.42);
    color: #2f3f31;
    font-family: 'DM Sans', sans-serif;
    font-size: 12px;
    font-weight: 650;
    line-height: 1;
    padding: 7px 10px;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.18s var(--ease-soft), border-color 0.18s var(--ease-soft), transform 0.18s var(--ease-soft);
  }
  .header-halt-btn:hover {
    background: rgba(255,255,255,0.66);
    border-color: rgba(111,127,112,0.52);
  }
  .header-halt-btn:active {
    transform: scale(0.97);
  }


  @media (max-width: 640px) {
    #impuls-header {
      padding: 10px 12px 13px;
      background: #c9ddc5;
    }
    #impuls-header > div:first-child {
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 8px 10px;
      align-items: start !important;
    }
    .app-titel-bereich {
      min-width: 0;
      gap: 4px;
      margin-bottom: 6px;
      padding-bottom: 7px;
      flex-direction: column;
      align-items: flex-start;
    }
    #app-titel-anzeige {
      font-size: 22px;
      line-height: 1.05;
    }
    #app-untertitel-anzeige {
      font-size: 13px;
      line-height: 1.35;
      max-width: 12.5em;
    }
    .header-meta {
      min-width: 0;
      margin-left: 0;
      align-items: flex-end;
      gap: 7px;
    }
    .header-greeting {
    text-align: right;
    color: #263629;
    line-height: 1.25;
    max-width: min(52vw, 420px);
    overflow-wrap: anywhere;
  }
    .header-greeting-main {
      font-size: 15px;
      line-height: 1.16;
    }
    .header-greeting-date {
      font-size: 11px;
      line-height: 1.2;
    }
    .header-tools {
      gap: 6px;
      justify-content: flex-end;
      flex-wrap: nowrap;
    }
    .header-halt-btn {
      font-size: 11px;
      padding: 7px 9px;
    }
    .impuls-label {
      margin-top: 2px;
    }
    .impuls-text {
      font-size: 17px;
      line-height: 1.38;
    }
  }

  /* TABS */
  #tab-bar {
    display: flex;
    background: #f6f5f0;
    border-bottom: 1px solid var(--border);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    position: sticky;
    top: 126px;
    z-index: 99;
  }
  #tab-bar::-webkit-scrollbar { display: none; }
  .tab-btn {
    flex: 1;
    min-width: 78px;
    min-height: 70px;
    padding: 13px 10px 11px;
    border: none;
    background: none;
    color: var(--text2);
    font-family: 'DM Sans', sans-serif;
    font-size: 13px;
    font-weight: 650;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 3px solid transparent;
    transition: all 0.2s;
    white-space: nowrap;
  }
  .tab-btn.active { color: var(--accent); border-bottom-color: var(--accent2); border-bottom-width: 3px; background: linear-gradient(to top, rgba(197,122,61,0.18) 0%, transparent 78%); }
  .tab-btn:active { transform: scale(0.97); }
  .tab-btn.active .tab-icon { transform: scale(1.12); }
  .tab-icon { font-size: 21px; line-height: 1; transition: transform 0.18s var(--ease-soft); }
  .tab-label { line-height: 1.15; }

  .mehr-card {
    padding: 6px 0;
  }
  .mehr-row {
    width: 100%;
    display: grid;
    grid-template-columns: 34px 1fr 18px;
    gap: 10px;
    align-items: center;
    border: 0;
    border-bottom: 1px solid var(--border);
    background: transparent;
    color: var(--text);
    padding: 13px 16px;
    text-align: left;
    cursor: pointer;
    font-family: 'DM Sans', sans-serif;
  }
  .mehr-row:last-child {
    border-bottom: 0;
  }
  .mehr-row:active {
    background: rgba(197,122,61,0.10);
  }
  .mehr-row.open {
    background: rgba(143,166,122,0.10);
  }
  .mehr-row-icon {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: var(--bg2);
    color: var(--accent);
    font-size: 17px;
    font-weight: 700;
  }
  .mehr-row-title {
    display: block;
    font-size: 14px;
    font-weight: 650;
    line-height: 1.25;
  }
  .mehr-row-sub {
    display: block;
    color: var(--text3);
    font-size: 12px;
    line-height: 1.35;
    margin-top: 2px;
  }
  .mehr-row-arrow {
    color: var(--text3);
    font-size: 11px;
    transition: transform 0.18s var(--ease-soft);
  }
  .mehr-row.open .mehr-row-arrow {
    transform: rotate(180deg);
  }
  .mehr-panel {
    display: none;
    padding: 0 16px 14px 60px;
    border-bottom: 1px solid var(--border);
  }
  .mehr-panel.open {
    display: block;
    animation: innenpauseFadeIn 0.18s var(--ease-soft);
  }
  .mehr-panel:last-child {
    border-bottom: 0;
  }
  .mehr-panel-text {
    color: var(--text2);
    font-size: 13px;
    line-height: 1.45;
    margin: 0 0 10px;
  }
  .mehr-back {
    margin: 12px 16px 0;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg2);
    color: var(--text2);
    padding: 8px 11px;
    font-family: 'DM Sans', sans-serif;
    font-size: 13px;
    cursor: pointer;
  }

  /* HALT FINDEN */
  .halt-card { margin-top: 12px; }
  .halt-intro { color: var(--text2); font-size: 14px; line-height: 1.55; margin: 6px 0 14px; }
  .halt-stepper { display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; background: #fbfaf6; margin: 0 16px 12px; }
  .halt-step { border: 0; border-right: 1px solid var(--border); background: transparent; color: var(--text3); padding: 8px 4px; font-size: 11px; cursor: pointer; }
  .halt-step:last-child { border-right: 0; }
  .halt-step.active { color: var(--text); background: linear-gradient(to top, rgba(197,122,61,0.18), transparent); box-shadow: inset 0 -3px 0 var(--accent2); }
  .halt-step-nr { display:block; font-size: 9px; letter-spacing: 0; text-transform: uppercase; font-weight: 700; }
  .halt-step-label { display:block; margin-top: 2px; }
  .halt-panel { padding: 2px 0 4px; }
  .halt-title { font-family:'Lora', serif; font-size: 21px; font-weight: 600; color: var(--text); margin-bottom: 6px; }
  .halt-note { margin: 12px 0; padding: 10px 12px; border-left: 4px solid var(--accent3); border-radius: 8px; background: rgba(143,166,122,0.14); color: var(--text2); font-size: 13px; line-height: 1.5; }
  .halt-note.warn { border-left-color: var(--warm); background: #fff4ec; }
  .halt-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 4px; }
  .halt-chip { border: 1px solid var(--border); border-radius: 999px; background: #fffaf3; color: var(--text); padding: 7px 11px; font-size: 13px; cursor: pointer; }
  .halt-chip.active { border-color: var(--success); background: rgba(79,122,92,0.14); color: var(--success); box-shadow: 0 0 0 3px rgba(79,122,92,0.12); }
  .halt-starter-list, .halt-action-grid { display: grid; gap: 8px; margin-top: 10px; }
  .halt-action-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .halt-starter, .halt-action { border: 1px solid var(--border); border-radius: 8px; background: #fffaf3; color: var(--text); padding: 10px 11px; cursor: pointer; text-align: left; font-size: 13px; line-height: 1.45; }
  .halt-action strong { display:block; margin-bottom: 4px; color: var(--text); }
  .halt-starter:hover, .halt-action:hover { border-color: var(--accent2); background: #fff; }
  .halt-action.active { border-color: var(--success); background: rgba(79,122,92,0.12); }
  .halt-actions { display: flex; justify-content: space-between; gap: 8px; margin-top: 16px; }
  .halt-summary { white-space: pre-wrap; background: #fffaf3; border: 1px solid var(--border); border-radius: 8px; padding: 10px 12px; min-height: 110px; color: var(--text); font-size: 13px; line-height: 1.5; }

  /* MAIN CONTENT */
  #main { padding: 0 0 100px; max-width: 600px; margin: 0 auto; }
  .tab-content { display: none; }
  .tab-content.active { display: block; }

  /* CARDS */
  .card {
    background: #fffdf8;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 16px;
    margin: 12px 16px;
    box-shadow: var(--shadow);
    transition: transform 0.18s var(--ease-soft), box-shadow 0.18s var(--ease-soft), border-color 0.18s var(--ease-soft), background 0.18s var(--ease-soft);
  }
  .card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(44,36,22,0.12);
  }
  .card-reflexion {
    background: linear-gradient(180deg, #fffdf8 0%, #fbf7ef 100%);
    border-left: 4px solid var(--blue);
  }
  .card-daten {
    border-left: 4px solid var(--accent3);
  }
  .card-verwaltung {
    border-left: 4px solid var(--accent2);
  }
  .card-title {
    font-family: 'Lora', serif;
    font-size: 15px;
    font-weight: 500;
    color: var(--text);
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
  }

  /* AKKORDEON */
  .akkordeon {
    background: var(--card);
    border: 1px solid var(--border);
    border-left: 4px solid var(--accent3);
    border-radius: var(--radius);
    margin: 12px 16px;
    overflow: hidden;
    box-shadow: var(--shadow);
    transition: transform 0.18s var(--ease-soft), box-shadow 0.18s var(--ease-soft), border-color 0.18s var(--ease-soft);
  }
  .akkordeon:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 22px rgba(44,36,22,0.12);
  }
  .akkordeon.open {
    border-left-color: var(--accent2);
  }
  .akkordeon-header {
    padding: 14px 16px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: 'Lora', serif;
    font-size: 15px;
    font-weight: 500;
    user-select: none;
    transition: background 0.2s;
  }
  .akkordeon-header:hover { background: var(--bg2); }
  .akkordeon-header .zeit-badge {
    font-size: 11px;
    font-family: 'DM Sans', sans-serif;
    font-weight: 400;
    color: var(--text3);
    background: var(--bg2);
    padding: 2px 8px;
    border-radius: 20px;
  }
  .akkordeon-arrow { transition: transform 0.3s; color: var(--text3); font-size: 12px; }
  .akkordeon.open .akkordeon-arrow { transform: rotate(180deg); }
  .akkordeon-body {
    display: none;
    padding: 0 16px 16px;
    border-top: 1px solid var(--border);
  }
  .akkordeon.open .akkordeon-body { display: block; }

  /* ÜBUNG JETZT */
  .uebung-jetzt-card {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, #fffdf8 0%, #f6f9f2 58%, #edf4ea 100%);
    border: 2px solid rgba(79,122,92,0.58);
    border-radius: calc(var(--radius) + 4px);
    margin: 10px 16px 6px;
    padding: 20px 18px 18px;
    box-shadow: 0 16px 38px rgba(31,42,33,0.16);
    transform: scale(1.01);
    transition: transform 0.18s var(--ease-soft), box-shadow 0.18s var(--ease-soft), border-color 0.18s var(--ease-soft);
  }
  .uebung-jetzt-card::before {
    content: '';
    position: absolute;
    inset: 0 auto 0 0;
    width: 6px;
    background: linear-gradient(180deg, var(--accent2), var(--success));
  }
  .uebung-jetzt-card:hover {
    transform: translateY(-3px) scale(1.015);
    border-color: rgba(197,122,61,0.68);
    box-shadow: 0 18px 46px rgba(31,42,33,0.20);
  }
  .uebung-jetzt-label { font-size: 10px; letter-spacing: 0; text-transform: uppercase; color: var(--accent2); font-weight: 700; margin-bottom: 8px; padding-left: 4px; }
  .uebung-jetzt-titel { font-family: 'Lora', serif; font-size: 20px; font-weight: 600; color: var(--text); margin-bottom: 7px; line-height: 1.3; }
  .uebung-jetzt-meta { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; font-size: 13px; color: var(--text2); }
  .uebung-jetzt-desc { font-size: 13px; color: var(--text2); line-height: 1.5; margin-bottom: 10px; }

  /* VORSCHLAG-KOMMENTAR */
  .vorschlag-kommentar-bereich { margin-top: 12px; border-top: 1px solid var(--border); padding-top: 12px; }
  .vorschlag-kommentar-label { font-size: 12px; color: var(--text2); margin-bottom: 6px; font-weight: 500; }
  .vorschlag-kommentar-saved { font-size: 13px; color: var(--text2); font-style: italic; background: var(--bg2); border-radius: 8px; padding: 8px 10px; margin-bottom: 8px; }

  /* SKALEN */
  .skala-gruppe { margin: 14px 0; }
  .skala-label { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; color: var(--text2); margin-bottom: 8px; }
  .skala-label-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; line-height: 1.25; }
  .skala-label-text span { color: var(--text); font-weight: 600; }
  .skala-label-text small { font-size: 13px; color: var(--text2); font-weight: 400; }
  .skala-wert { display: none; }
  .skala-orientierung {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 8px;
    margin-top: 7px;
    font-size: 11px;
    color: var(--text3);
    line-height: 1.25;
  }
  .skala-orientierung span:nth-child(2) { text-align: center; }
  .skala-orientierung span:nth-child(3) { text-align: right; }
  .schlaf-kompakt {
    margin-top: 10px;
  }
  .schlaf-dauer-inline {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
    color: var(--text3);
    font-size: 12px;
    white-space: nowrap;
  }
  .schlaf-dauer-inline input {
    width: 58px;
    min-height: 32px;
    padding: 5px 7px;
    text-align: center;
  }
  .checkin-intro {
    color: var(--text2);
    font-size: 13px;
    line-height: 1.45;
    margin: 4px 0 14px;
  }
  .checkin-block-label {
    color: var(--text2);
    font-size: 12px;
    font-weight: 650;
    margin: 12px 0 8px;
  }
  .checkin-optional-toggle {
    width: 100%;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg2);
    color: var(--text2);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px;
    margin: 16px 0 0;
    font-family: 'DM Sans', sans-serif;
    font-size: 13px;
    cursor: pointer;
  }
  .checkin-optional-toggle span:last-child {
    font-size: 10px;
    transition: transform 0.18s var(--ease-soft);
  }
  .checkin-optional-toggle.open span:last-child {
    transform: rotate(180deg);
  }
  .checkin-optional {
    display: none;
    padding-top: 10px;
  }
  .checkin-optional.open {
    display: block;
    animation: innenpauseFadeIn 0.18s var(--ease-soft);
  }
  .checkin-save-note {
    display: none;
    margin-top: 12px;
    padding: 12px;
    border: 1px solid rgba(143,166,122,0.35);
    border-radius: 8px;
    background: rgba(143,166,122,0.12);
    color: var(--text2);
    font-size: 13px;
    line-height: 1.45;
  }
  .checkin-save-note.show {
    display: block;
    animation: innenpauseFadeIn 0.2s var(--ease-soft);
  }
  .checkin-save-note .btn {
    margin-top: 10px;
  }
  input[type=range] {
    --slider-fill: var(--accent2);
    --slider-thumb: var(--accent2);
    --slider-glow: rgba(197,122,61,0.26);
    --slider-pos: 44%;
    width: 100%;
    -webkit-appearance: none;
    height: 22px;
    border-radius: 999px;
    background:
      linear-gradient(to right, var(--slider-fill) 0%, var(--slider-fill) var(--slider-pos), transparent var(--slider-pos), transparent 100%) center / 100% 9px no-repeat,
      linear-gradient(to right, transparent 0%, transparent var(--slider-pos), var(--bg3) var(--slider-pos), var(--bg3) 100%) center / 100% 4px no-repeat;
    outline: none;
  }
  input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--slider-thumb);
    cursor: pointer;
    box-shadow: 0 0 0 5px rgba(197,122,61,0.18), 0 1px 5px rgba(0,0,0,0.18);
  }
  input[type=range]::-moz-range-track {
    height: 4px;
    border-radius: 999px;
    background: var(--bg3);
  }
  input[type=range]::-moz-range-progress {
    height: 4px;
    border-radius: 999px;
    background: var(--slider-fill);
  }
  input[type=range]::-moz-range-thumb {
    width: 22px;
    height: 22px;
    border: 0;
    border-radius: 50%;
    background: var(--slider-thumb);
    cursor: pointer;
    box-shadow: 0 0 0 5px rgba(197,122,61,0.18), 0 1px 5px rgba(0,0,0,0.18);
  }

  /* INPUTS */
  textarea, input[type=text], input[type=number], select {
    width: 100%;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 10px 12px;
    font-family: 'DM Sans', sans-serif;
    font-size: 14px;
    color: var(--text);
    outline: none;
    transition: border-color 0.2s;
    resize: vertical;
  }
  textarea:focus, input[type=text]:focus, input[type=number]:focus, select:focus { border-color: var(--accent2); box-shadow: 0 0 0 3px rgba(181,149,106,0.16); }

  /* BUTTONS */
  .btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 18px;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    font-family: 'DM Sans', sans-serif;
    font-size: 14px;
    font-weight: 500;
    transition: transform 0.12s var(--ease-soft), box-shadow 0.18s var(--ease-soft), background 0.18s var(--ease-soft), border-color 0.18s var(--ease-soft);
  }
  .btn:hover { box-shadow: 0 4px 14px rgba(44,36,22,0.12); }
  .btn:active { transform: scale(0.97); }
  .btn-primary { background: var(--success); color: #f5f0e8; }
  .btn-primary:hover { background: #3f654b; }
  .btn-secondary { background: var(--bg2); color: var(--text); border: 1px solid var(--border); }
  .btn-secondary:hover { background: var(--bg3); }
  .btn-sm { padding: 6px 12px; font-size: 13px; }
  .btn-block { width: 100%; justify-content: center; margin-top: 12px; }
  .btn-danger { background: #c0392b; color: #fff; }
  .btn-danger:hover { background: #a93226; }
  .micro-pulse {
    animation: microPulse 0.55s var(--ease-soft);
  }
  @keyframes microPulse {
    0% { box-shadow: 0 0 0 0 rgba(197,122,61,0.0); }
    35% { box-shadow: 0 0 0 6px rgba(197,122,61,0.18); }
    100% { box-shadow: var(--shadow); }
  }

  /* FAVORITEN-BUTTON */
  .fav-btn {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    padding: 2px 4px;
    border-radius: 6px;
    transition: transform 0.15s;
    color: var(--text3);
  }
  .fav-btn:hover { transform: scale(1.25); }
  .fav-btn.aktiv { color: #e74c3c; }

  /* ÜBUNGS-KARTE */
  .uebungen-einstieg {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 14px 16px 8px;
    scrollbar-width: none;
  }
  .uebungen-einstieg::-webkit-scrollbar { display: none; }
  .uebung-chip {
    flex: 0 0 auto;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--bg2);
    color: var(--text2);
    padding: 8px 12px;
    font-family: 'DM Sans', sans-serif;
    font-size: 13px;
    cursor: pointer;
  }
  .uebung-chip.active {
    border-color: var(--accent2);
    background: rgba(197,122,61,0.16);
    color: var(--accent);
    font-weight: 650;
  }
  .uebungen-filter-card {
    display: none;
    margin-top: 4px !important;
  }
  .uebungen-filter-card.open {
    display: block;
    animation: innenpauseFadeIn 0.18s var(--ease-soft);
  }
  .admin-only {
    display: none !important;
  }
  body.admin-mode .admin-only {
    display: block !important;
  }
  body.admin-mode .admin-only.setting-row {
    display: flex !important;
  }
  .uebung-card { background: var(--bg); border: 1px solid var(--border); border-left: 4px solid var(--accent2); border-radius: 10px; padding: 14px; margin: 8px 0; position: relative; transition: transform 0.18s var(--ease-soft), box-shadow 0.18s var(--ease-soft), background 0.18s var(--ease-soft); }
  .uebung-card:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(44,36,22,0.11); background: #fffaf3; }
  .uebung-titel { font-family: 'Lora', serif; font-size: 15px; font-weight: 500; margin-bottom: 4px; }
  .uebung-meta { font-size: 12px; color: var(--text3); display: flex; gap: 10px; margin-bottom: 8px; flex-wrap: wrap; }
  .uebung-desc { font-size: 14px; color: var(--text2); line-height: 1.5; }
  .uebung-actions { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; align-items: center; }
  .badge { display: inline-block; font-size: 11px; padding: 2px 8px; border-radius: 20px; font-weight: 500; }
  .badge-kat { background: var(--bg2); color: var(--text2); }
  .badge-done { background: rgba(79,122,92,0.16); color: var(--success); }

  /* BEGRÜSSUNGSZEILE */
  .begruessung-bar {
    margin: 12px 16px 4px;
    padding: 10px 14px;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    font-size: 13px;
    color: var(--text2);
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .begruessung-icon { font-size: 18px; }
  .begruessung-text { font-family: 'Lora', serif; font-style: italic; }

  /* KATEGORIE-FARBEN */
  .badge-kat[data-kat="Atem"]                    { background: #dbeeff; color: #2a6496; }
  .badge-kat[data-kat="Körperwahrnehmung"]        { background: #e8f4e8; color: #2d6a2d; }
  .badge-kat[data-kat="Stimme & Singen"]          { background: #fde8f0; color: #9b2a5a; }
  .badge-kat[data-kat="GfK & Bedürfnisse"]        { background: #fff3dc; color: #7a5500; }
  .badge-kat[data-kat="Selbstmitgefühl"]          { background: #fde8e8; color: #8c2a2a; }
  .badge-kat[data-kat="Polyvagal & Regulation"]   { background: #e8eeff; color: #2a3d8c; }
  .badge-kat[data-kat="Bewegung & Rhythmus"]      { background: #e8fdf0; color: #1a6640; }
  .badge-kat[data-kat="Stille & Meditation"]      { background: #f0e8ff; color: #5a2d8c; }
  .badge-kat[data-kat="Kontakt & Verbindung"]     { background: #fff0e8; color: #7a3a00; }
  .badge-kat[data-kat="Energie & Lebendigkeit"]   { background: #fffbe8; color: #6b5900; }
  .badge-kat[data-kat="Ressourcen & Möglichkeiten"] { background: #e8f8ff; color: #1a5a72; }
  .badge-kat[data-kat="Schreiben & Ausdruck"]     { background: #f5e8ff; color: #6a1a8c; }
  .badge-kat[data-kat="Schwierige Momente"]       { background: #fce8e8; color: #8c1a1a; }
  /* EN-Varianten */
  .badge-kat[data-kat="Breath"]                   { background: #dbeeff; color: #2a6496; }
  .badge-kat[data-kat="Body Awareness"]           { background: #e8f4e8; color: #2d6a2d; }
  .badge-kat[data-kat="Voice & Singing"]          { background: #fde8f0; color: #9b2a5a; }
  .badge-kat[data-kat="NVC & Needs"]              { background: #fff3dc; color: #7a5500; }
  .badge-kat[data-kat="Self-Compassion"]          { background: #fde8e8; color: #8c2a2a; }
  .badge-kat[data-kat="Polyvagal & Regulation"]   { background: #e8eeff; color: #2a3d8c; }
  .badge-kat[data-kat="Movement & Rhythm"]        { background: #e8fdf0; color: #1a6640; }
  .badge-kat[data-kat="Stillness & Meditation"]   { background: #f0e8ff; color: #5a2d8c; }
  .badge-kat[data-kat="Contact & Connection"]     { background: #fff0e8; color: #7a3a00; }
  .badge-kat[data-kat="Energy & Vitality"]        { background: #fffbe8; color: #6b5900; }
  .badge-kat[data-kat="Resources & Possibilities"]{ background: #e8f8ff; color: #1a5a72; }
  .badge-kat[data-kat="Writing & Expression"]     { background: #f5e8ff; color: #6a1a8c; }
  .badge-kat[data-kat="Difficult Moments"]        { background: #fce8e8; color: #8c1a1a; }

  /* STERNE */
  .sterne { display: flex; gap: 4px; }
  .stern { font-size: 22px; cursor: pointer; opacity: 0.25; transition: opacity 0.15s; line-height: 1; }
  .stern.aktiv { opacity: 1; }

  /* INLINE STERNE (Vorschläge) */
  .inline-sterne { display: flex; gap: 6px; margin: 10px 0 4px; }
  .inline-stern { font-size: 26px; cursor: pointer; opacity: 0.2; transition: opacity 0.15s; line-height: 1; }
  .inline-stern.aktiv { opacity: 1; }
  .inline-stern:hover { opacity: 0.6; }
  .bewertung-anzeige { font-size: 12px; color: var(--text3); margin-top: 2px; }
  .bewertung-gespeichert { font-size: 12px; color: var(--accent3); margin-top: 4px; font-weight: 500; }

  /* DAUMEN */
  .daumen-gruppe { display: flex; gap: 6px; }
  .daumen-btn { padding: 6px 10px; border-radius: 6px; border: 1px solid var(--border); background: var(--bg); cursor: pointer; font-size: 16px; transition: all 0.15s; }
  .daumen-btn.aktiv { background: var(--bg3); border-color: var(--accent); }

  /* JOURNAL */
  .journal-entry { background: var(--bg); border-left: 3px solid var(--accent2); border-radius: 0 8px 8px 0; padding: 10px 14px; margin: 8px 0; }
  .journal-time { font-size: 11px; color: var(--text3); margin-bottom: 4px; }
  .journal-text { font-size: 14px; color: var(--text); line-height: 1.5; }

  /* VERLAUF */
  .verlauf-nav { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; background: var(--card); border-bottom: 1px solid var(--border); }
  .verlauf-datum { font-family: 'Lora', serif; font-size: 15px; }
  .nav-arrow { background: var(--bg2); border: 1px solid var(--border); border-radius: 6px; padding: 6px 10px; cursor: pointer; font-size: 14px; }
  .nav-arrow:hover { background: var(--bg3); }

  /* CHECKIN */
  .checkin-zeile { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--bg3); font-size: 13px; }
  .checkin-zeile:last-child { border-bottom: none; }
  .checkin-balken { width: 80px; height: 6px; background: var(--bg3); border-radius: 3px; overflow: hidden; }
  .checkin-balken-fill { height: 100%; background: var(--accent2); border-radius: 3px; }

  /* EINSTELLUNGEN */
  .settings-group {
    margin: 12px 16px;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--card);
    box-shadow: var(--shadow);
    overflow: hidden;
  }
  .settings-group-header {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 0;
    background: transparent;
    color: var(--text);
    padding: 14px 16px;
    font-family: 'DM Sans', sans-serif;
    text-align: left;
    cursor: pointer;
  }
  .settings-group.open .settings-group-header {
    background: rgba(143,166,122,0.10);
  }
  .settings-group-title {
    display: block;
    font-size: 15px;
    font-weight: 650;
    line-height: 1.25;
  }
  .settings-group-sub {
    display: block;
    color: var(--text3);
    font-size: 12px;
    line-height: 1.35;
    margin-top: 2px;
  }
  .settings-group-arrow {
    color: var(--text3);
    font-size: 11px;
    transition: transform 0.18s var(--ease-soft);
  }
  .settings-group.open .settings-group-arrow {
    transform: rotate(180deg);
  }
  .settings-group-panel {
    display: none;
    border-top: 1px solid var(--border);
    padding-bottom: 4px;
  }
  .settings-group-panel.open {
    display: block;
    animation: innenpauseFadeIn 0.18s var(--ease-soft);
  }
  .settings-group .section-label {
    padding-top: 12px;
  }
  .settings-group .card {
    margin-left: 12px;
    margin-right: 12px;
    box-shadow: none;
  }
  .setting-row { display: flex; justify-content: space-between; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--bg3); }
  .setting-label { font-size: 14px; color: var(--text); }
  .setting-sub { font-size: 12px; color: var(--text3); margin-top: 2px; }

  /* TOGGLE */
  .toggle { position: relative; width: 44px; height: 24px; }
  .toggle input { display: none; }
  .toggle-slider { position: absolute; inset: 0; background: var(--border); border-radius: 12px; cursor: pointer; transition: background 0.2s; }
  .toggle-slider::before { content: ''; position: absolute; width: 18px; height: 18px; background: white; border-radius: 50%; top: 3px; left: 3px; transition: transform 0.2s; }
  .toggle input:checked + .toggle-slider { background: var(--accent2); }
  .toggle input:checked + .toggle-slider::before { transform: translateX(20px); }

  /* TAGESFRAGE */
  .tagesfrage-toggle { font-size: 12px; color: var(--blue); cursor: pointer; margin-top: 8px; display: flex; align-items: center; gap: 4px; }
  .tagesfrage-bereich { display: none; margin-top: 10px; }
  .tagesfrage-bereich.open { display: block; }
  .tagesfrage-text { font-family: 'Lora', serif; font-style: italic; font-size: 14px; color: var(--text2); margin-bottom: 8px; padding: 8px 12px; background: var(--bg2); border-radius: 8px; border-left: 3px solid var(--blue); }

  /* TOAST */
  #toast {
    position: fixed;
    bottom: 80px;
    left: 50%;
    transform: translateX(-50%) translateY(20px);
    background: var(--text);
    color: var(--bg);
    padding: 10px 20px;
    border-radius: 20px;
    font-size: 13px;
    opacity: 0;
    transition: all 0.3s;
    pointer-events: none;
    z-index: 200;
    white-space: nowrap;
  }
  #toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

  /* LOADING */
  .loading { text-align: center; padding: 40px; color: var(--text3); font-style: italic; }

  /* DIVIDER */
  .divider { border: none; border-top: 1px solid var(--border); margin: 12px 0; }

  /* MODAL */
  .modal-overlay { display: none; position: fixed; inset: 0; background: rgba(44,36,22,0.5); z-index: 300; align-items: flex-end; }
  .modal-overlay.open { display: flex; }
  .modal { background: var(--card); border-radius: 20px 20px 0 0; padding: 20px; width: 100%; max-width: 600px; margin: 0 auto; max-height: 85vh; overflow-y: auto; }
  .modal-titel { font-family: 'Lora', serif; font-size: 17px; font-weight: 500; margin-bottom: 16px; }

  /* POOL VERWALTUNG */
  .uebung-pool-item { display: flex; justify-content: space-between; align-items: flex-start; padding: 10px 0; border-bottom: 1px solid var(--bg3); gap: 8px; }
  .pool-item-info { flex: 1; }
  .pool-item-titel { font-size: 14px; font-weight: 500; }
  .pool-item-kat { font-size: 11px; color: var(--text3); }
  .pool-item-actions { display: flex; gap: 4px; }
  .btn-icon { background: none; border: none; cursor: pointer; font-size: 16px; padding: 4px; color: var(--text3); transition: color 0.15s; }
  .btn-icon:hover { color: var(--warm); }

  input[type=date] {
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 8px 12px;
    font-family: 'DM Sans', sans-serif;
    font-size: 14px;
    color: var(--text);
    outline: none;
  }

  .section-label { font-size: 11px; letter-spacing: 0; text-transform: uppercase; color: var(--text3); font-weight: 500; padding: 16px 16px 4px; }
  .empty-state { text-align: center; padding: 30px 20px; color: var(--text3); font-style: italic; font-family: 'Lora', serif; font-size: 14px; }

  .heute-einstieg-card {
    margin: 16px;
    padding: 24px 18px 18px;
    background: linear-gradient(180deg, #fffdf8 0%, #fbf7ef 100%);
    border: 1px solid rgba(111,127,112,0.20);
    border-radius: var(--radius);
    box-shadow: 0 12px 34px rgba(44,36,22,0.09);
  }
  .heute-einstieg-title {
    font-family: 'Lora', serif;
    font-size: 24px;
    font-weight: 500;
    color: var(--text);
    text-align: center;
    margin-bottom: 20px;
    line-height: 1.25;
  }
  .heute-hauptbutton {
    padding: 14px 16px;
    font-size: 15px;
    justify-content: center;
    box-shadow: 0 8px 22px rgba(79,122,92,0.18);
  }
  .heute-halt-link {
    display: block;
    width: 100%;
    margin: 12px 0 0;
    padding: 8px 10px;
    border: none;
    background: transparent;
    color: var(--text3);
    font-family: 'DM Sans', sans-serif;
    font-size: 13px;
    cursor: pointer;
    text-align: center;
  }
  .heute-halt-link:hover { color: var(--accent); }
  .moment-auswahl {
    display: none;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--border);
  }
  .moment-auswahl.open {
    display: grid;
    gap: 10px;
    animation: innenpauseFadeIn 0.2s var(--ease-soft);
  }
  .moment-auswahl-title {
    font-family: 'Lora', serif;
    font-size: 17px;
    color: var(--text);
    text-align: center;
    margin-bottom: 6px;
  }
  .moment-option {
    width: 100%;
    min-height: 44px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: rgba(255,255,255,0.56);
    color: var(--text);
    font-family: 'DM Sans', sans-serif;
    font-size: 14px;
    cursor: pointer;
    text-align: left;
    padding: 11px 13px;
  }
  .moment-option:hover {
    background: var(--bg2);
    border-color: rgba(111,127,112,0.35);
  }
  .moment-option-halt {
    color: var(--accent);
    border-color: rgba(111,127,112,0.34);
  }
  .moment-schliessen {
    justify-self: center;
    min-height: 36px;
    border: 0;
    background: transparent;
    color: var(--text3);
    font-family: 'DM Sans', sans-serif;
    font-size: 13px;
    cursor: pointer;
    padding: 6px 10px;
  }
  .moment-schliessen:hover { color: var(--accent); }
  .heute-mehr-toggle-wrap {
    padding: 0 16px 8px;
  }
  #heute-mehr-toggle {
    background: transparent;
    border-color: rgba(111,127,112,0.20);
    color: var(--text3);
    box-shadow: none;
  }
  .heute-mehr-bereich { display: none; }
  .heute-mehr-bereich.open {
    display: block;
    animation: innenpauseFadeIn 0.2s var(--ease-soft);
  }

  .heute-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; margin: 12px 16px; }
  .heute-slot { background: var(--card); border: 1px solid var(--border); border-radius: 10px; padding: 12px 10px; text-align: center; cursor: pointer; transition: transform 0.18s var(--ease-soft), box-shadow 0.18s var(--ease-soft), background 0.18s var(--ease-soft), border-color 0.18s var(--ease-soft); }
  .heute-slot:hover { background: var(--bg2); transform: translateY(-2px); box-shadow: 0 6px 18px rgba(44,36,22,0.10); }
  .heute-slot:active { transform: scale(0.97); }
  .heute-slot.aktiv { border-color: var(--accent2); background: #fdf5e6; box-shadow: 0 6px 18px rgba(181,149,106,0.18); }
  .heute-slot.gesperrt {
    opacity: 0.58;
    cursor: default;
    background: var(--bg2);
  }
  .heute-slot.gesperrt:hover {
    transform: none;
    box-shadow: none;
  }
  .heute-slot-icon { font-size: 22px; margin-bottom: 4px; }
  .heute-slot-label { font-size: 12px; color: var(--text2); }
  .heute-slot-status { font-size: 10px; color: var(--text3); margin-top: 2px; }
  .schnellzugriff-row {
    margin: 0 16px 10px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .schnellzugriff-row .btn {
    justify-content: center;
    background: #f6f5f0;
  }

  /* STREAK */
  .streak-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 8px 16px 0;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 10px 14px;
    box-shadow: var(--shadow);
  }
  .streak-feuer { font-size: 22px; }
  .streak-text { flex: 1; }
  .streak-zahl { font-family: 'Lora', serif; font-size: 18px; font-weight: 500; color: var(--accent2); line-height: 1; }
  .streak-label { font-size: 11px; color: var(--text3); margin-top: 2px; }
  .streak-tage { display: flex; gap: 4px; }
  .streak-tag { width: 20px; height: 20px; border-radius: 50%; background: var(--bg3); font-size: 9px; display: flex; align-items: center; justify-content: center; }
  .streak-tag.aktiv { background: var(--accent2); }
  .streak-tag.heute { background: var(--accent); outline: 2px solid var(--accent2); }
  .streak-info-btn { background: none; border: none; cursor: pointer; font-size: 13px; color: var(--text3); padding: 2px 4px; border-radius: 50%; line-height: 1; transition: color 0.2s; }
  .streak-info-btn:hover { color: var(--accent2); }
  .streak-info-box { display: none; margin: 0 16px 8px; background: var(--bg2); border-radius: 8px; padding: 10px 14px; font-size: 12px; color: var(--text2); line-height: 1.6; border-left: 3px solid var(--accent2); }
  .streak-info-box.open { display: block; }

  /* WOCHEN-CHART */
  .wochen-chart { margin: 0 16px; }
  .wochen-chart svg { width: 100%; display: block; }
  .chart-label { font-size: 10px; fill: var(--text3); font-family: 'DM Sans', sans-serif; }
  .chart-bar { transition: opacity 0.2s; }
  .chart-bar:hover { opacity: 0.75; }

  /* Daten-Verwaltung */
  .daten-info { font-size: 12px; color: var(--text3); padding: 8px 0; }

  /* DEBUG-STATUS */
  .debug-status-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 6px;
    margin-top: 8px;
  }
  .debug-status-row {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 7px 0;
    border-bottom: 1px solid var(--bg3);
    font-size: 12px;
  }
  .debug-status-row:last-child { border-bottom: none; }
  .debug-status-label { color: var(--text3); }
  .debug-status-value { color: var(--text); font-weight: 600; text-align: right; overflow-wrap: anywhere; }
  .debug-status-ok { color: var(--success); }
  .debug-status-warn { color: var(--warm); }
  .startfehler-box {
    margin: 12px 16px;
    background: #fff4ec;
    border: 1px solid rgba(196,132,90,0.45);
    border-left: 5px solid var(--warm);
    border-radius: var(--radius);
    padding: 14px 16px;
    color: var(--text2);
    font-size: 13px;
    line-height: 1.55;
  }

  #global-startfehler-container {
    max-width: 600px;
    margin: 0 auto;
  }
  #global-startfehler-container .startfehler-box {
    margin-top: 12px;
  }
  .debug-action-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-top: 10px;
  }
  @media (max-width: 420px) {
    .debug-action-row { grid-template-columns: 1fr; }
  }

  .startfehler-box strong {
    display: block;
    color: var(--text);
    font-family: 'Lora', serif;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 4px;
  }


  /* UPDATE BANNER */
  #update-banner {
    display: none;
    position: fixed;
    bottom: 80px;
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(135deg, #3a5a3a, #4a7a4a);
    color: #f5f0e8;
    border-radius: 14px;
    padding: 14px 18px;
    max-width: 340px;
    width: calc(100% - 32px);
    box-shadow: 0 4px 24px rgba(0,0,0,0.25);
    z-index: 250;
    animation: slideUp 0.4s ease;
  }
  #update-banner.show { display: block; }
  @keyframes slideUp {
    from { transform: translateX(-50%) translateY(20px); opacity: 0; }
    to   { transform: translateX(-50%) translateY(0); opacity: 1; }
  }
  .update-banner-titel { font-family: 'Lora', serif; font-size: 15px; font-weight: 500; margin-bottom: 4px; }
  .update-banner-sub { font-size: 12px; opacity: 0.85; margin-bottom: 12px; line-height: 1.4; }
  .update-banner-btn { display: inline-block; padding: 8px 16px; border-radius: 8px; border: none; font-family: 'DM Sans', sans-serif; font-size: 13px; font-weight: 500; cursor: pointer; margin-right: 8px; }
  .update-btn-ja { background: #f5f0e8; color: #3a5a3a; }
  .update-btn-sp { background: rgba(255,255,255,0.15); color: #f5f0e8; }

  /* UPDATE MODAL */
  #update-modal { display: none; position: fixed; inset: 0; background: rgba(44,36,22,0.6); z-index: 400; align-items: center; justify-content: center; padding: 24px; }
  #update-modal.open { display: flex; }
  .update-modal-box { background: var(--card); border-radius: 16px; padding: 24px; max-width: 380px; width: 100%; box-shadow: var(--shadow-lg); }
  .update-changelog { background: var(--bg2); border-radius: 8px; padding: 12px 14px; margin: 12px 0 16px; font-size: 13px; color: var(--text2); line-height: 1.6; max-height: 200px; overflow-y: auto; }
  .update-changelog li { margin-bottom: 4px; list-style: none; padding-left: 4px; }
  .update-changelog li::before { content: "✦ "; color: var(--accent2); }

  /* HILFE MODAL */
  #hilfe-modal { display: none; position: fixed; inset: 0; background: rgba(44,36,22,0.6); z-index: 500; flex-direction: column; }
  #hilfe-modal.open { display: flex; }
  .hilfe-container { background: var(--bg); flex: 1; overflow: hidden; display: flex; flex-direction: column; max-width: 600px; margin: 0 auto; width: 100%; margin-top: 40px; border-radius: 20px 20px 0 0; }
  .hilfe-header { background: #e6eee3; color: #1f2a21; padding: 16px 20px; display: flex; align-items: center; justify-content: space-between; border-radius: 20px 20px 0 0; border-bottom: 1px solid #cfdccf; }
  .hilfe-header-titel { font-family: 'Lora', serif; font-size: 17px; }
  .hilfe-close { background: rgba(31,42,33,0.08); border: none; color: #1f2a21; border-radius: 8px; padding: 6px 12px; cursor: pointer; font-size: 14px; }
  .hilfe-nav { display: flex; flex-wrap: wrap; background: var(--card); border-bottom: 1px solid var(--border); scrollbar-width: none; }
  .hilfe-nav::-webkit-scrollbar { display: none; }
  .hilfe-nav-btn { flex-shrink: 0; padding: 8px 12px; border: none; background: none; font-family: 'DM Sans', sans-serif; font-size: 12px; font-weight: 500; color: var(--text3); cursor: pointer; border-bottom: 2px solid transparent; white-space: nowrap; }
  .hilfe-nav-btn.active { color: var(--accent); border-bottom-color: var(--accent2); }
  .hilfe-body { flex: 1; overflow-y: auto; padding: 16px; }
  .hilfe-sektion { display: none; }
  .hilfe-sektion.active { display: block; }
  .hilfe-h2 { font-family: 'Lora', serif; font-size: 16px; font-weight: 500; color: var(--text); margin: 16px 0 8px; }
  .hilfe-h2:first-child { margin-top: 0; }
  .hilfe-h3 { font-size: 13px; font-weight: 600; color: var(--accent); margin: 12px 0 4px; text-transform: uppercase; letter-spacing: 0; }
  .hilfe-p { font-size: 13px; color: var(--text2); line-height: 1.6; margin-bottom: 8px; }
  .hilfe-box { background: var(--bg2); border-radius: 8px; padding: 10px 12px; margin: 8px 0; font-size: 13px; color: var(--text2); line-height: 1.6; }
  .hilfe-box.tipp { border-left: 3px solid var(--accent3); }
  .hilfe-box.warn { border-left: 3px solid var(--warm); }
  .hilfe-box.info { border-left: 3px solid var(--blue); }
  .hilfe-kbd { display: inline-block; background: var(--bg3); border: 1px solid var(--border); border-radius: 4px; padding: 1px 6px; font-size: 12px; font-family: monospace; color: var(--text); margin: 0 2px; }
  .hilfe-schritt { display: flex; gap: 10px; margin: 6px 0; font-size: 13px; color: var(--text2); line-height: 1.5; }
  .hilfe-schritt-nr { background: var(--accent2); color: white; border-radius: 50%; width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 600; flex-shrink: 0; margin-top: 2px; }

  /* ? BUTTON IM HEADER */
  .hilfe-btn { background: rgba(31,42,33,0.08); border: none; color: #1f2a21; border-radius: 8px; padding: 4px 10px; cursor: pointer; font-size: 15px; font-weight: 600; transition: background 0.2s; }
  .hilfe-btn:hover { background: rgba(31,42,33,0.14); }



  /* ============================================================
     TAGESFORTSCHRITT UND LEERZUSTÄNDE
     ============================================================ */
  .tagesfortschritt-card {
    margin: 10px 16px 8px;
    padding: 12px 14px;
    background: linear-gradient(135deg, rgba(250,247,242,0.96), rgba(237,231,217,0.92));
    border: 1px solid var(--border);
    border-left: 4px solid var(--accent3);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    transition: transform 0.18s var(--ease-soft), box-shadow 0.18s var(--ease-soft);
  }
  .naechster-schritt-card {
    margin: 10px 16px 8px;
    padding: 14px 16px;
    background: #fffdf8;
    border: 1px solid rgba(197,122,61,0.34);
    border-left: 5px solid var(--accent2);
    border-radius: var(--radius);
    box-shadow: 0 8px 26px rgba(44,36,22,0.11);
  }
  .naechster-schritt-label {
    font-size: 10px;
    color: var(--accent2);
    text-transform: uppercase;
    letter-spacing: 0;
    font-weight: 700;
    margin-bottom: 4px;
  }
  .naechster-schritt-title {
    font-family: 'Lora', serif;
    font-size: 16px;
    color: var(--text);
    margin-bottom: 4px;
  }
  .naechster-schritt-text {
    font-size: 13px;
    color: var(--text2);
    line-height: 1.45;
    margin-bottom: 10px;
  }
  .tagesfortschritt-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(44,36,22,0.13);
  }
  .tagesfortschritt-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 8px;
  }
  .tagesfortschritt-title {
    font-size: 13px;
    font-weight: 700;
    color: var(--text);
  }
  .tagesfortschritt-count {
    font-size: 12px;
    color: var(--accent);
    font-weight: 700;
    white-space: nowrap;
  }
  .tagesfortschritt-bar {
    height: 7px;
    border-radius: 999px;
    background: rgba(44,36,22,0.08);
    overflow: hidden;
  }
  .tagesfortschritt-fill {
    height: 100%;
    width: 0%;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--accent3), var(--accent2));
    transition: width 0.35s var(--ease-soft);
  }
  .tagesfortschritt-sub {
    margin-top: 7px;
    font-size: 12px;
    color: var(--text3);
    line-height: 1.45;
  }
  .uebung-jetzt-actions {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
    gap: 8px;
    margin-top: 14px;
  }
  .uebung-jetzt-actions .btn { justify-content: center; }
  .uebung-jetzt-actions .btn-primary {
    font-size: 14px;
    padding: 11px 14px;
    box-shadow: 0 5px 16px rgba(122,109,82,0.22);
  }
  .empty-state {
    background: rgba(250,247,242,0.72);
    border: 1px dashed rgba(122,109,82,0.28);
    border-radius: var(--radius);
    margin: 8px 16px;
    padding: 18px 16px;
    color: var(--text2);
    font-family: 'DM Sans', sans-serif;
    font-style: normal;
    line-height: 1.5;
  }
  .empty-state strong {
    display: block;
    font-family: 'Lora', serif;
    font-size: 15px;
    color: var(--text);
    font-weight: 500;
    margin-bottom: 4px;
  }
  .empty-state span {
    display: block;
    font-size: 13px;
    color: var(--text3);
  }
  .empty-state-actions {
    display: flex;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 12px;
  }
  .heute-compact-card {
    margin-top: 8px;
    margin-bottom: 8px;
  }

  /* RÜCKKEHR / VERLAUF / REDUZIERTE HEUTE-SEITE */
  .rueckkehr-card {
    background: linear-gradient(135deg, rgba(143,166,122,0.22), rgba(250,247,242,0.96));
    border: 1px solid rgba(143,166,122,0.45);
    border-left: 5px solid var(--accent3);
    border-radius: var(--radius);
    margin: 12px 16px 6px;
    padding: 15px 16px;
    box-shadow: var(--shadow);
    animation: innenpauseFadeIn 0.35s var(--ease-soft);
  }
  .rueckkehr-title { font-family:'Lora',serif; font-size:16px; color:var(--text); margin-bottom:5px; }
  .rueckkehr-text { font-size:13px; color:var(--text2); line-height:1.55; margin-bottom:10px; }
  .vorschlaege-reduziert { display:none; }
  .vorschlaege-reduziert.offen { display:block; animation: innenpauseFadeIn 0.25s var(--ease-soft); }
  .insight-grid { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:8px; margin:8px 16px 4px; }
  .insight-card { background:var(--card); border:1px solid var(--border); border-radius:var(--radius); padding:12px; box-shadow:var(--shadow); transition:transform .18s var(--ease-soft), box-shadow .18s var(--ease-soft); }
  .insight-card:hover { transform:translateY(-2px); box-shadow:0 8px 22px rgba(44,36,22,0.12); }
  .insight-label { font-size:10px; color:var(--text3); text-transform:uppercase; letter-spacing:1px; margin-bottom:4px; }
  .insight-value { font-family:'Lora',serif; font-size:18px; color:var(--text); line-height:1.2; }
  .insight-sub { font-size:11px; color:var(--text2); margin-top:4px; line-height:1.35; }
  .wochenfokus-card { margin:8px 16px 10px; background:rgba(143,166,122,0.12); border-left:4px solid var(--accent3); }
  @keyframes innenpauseFadeIn { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
  @media (max-width: 520px) { .insight-grid { grid-template-columns:1fr; } }

  @media (max-width: 420px) {
    .uebung-jetzt-actions { grid-template-columns: 1fr; }
    #impuls-header { padding: 10px 12px 13px; }
    .app-titel-bereich {
      gap: 7px;
      flex-wrap: wrap;
      margin-bottom: 7px;
      padding-bottom: 7px;
    }
    .header-meta {
      align-items: flex-end;
      gap: 4px;
      margin-left: 8px;
    }
    .header-greeting-main { font-size: 15px; line-height: 1.16; }
    .header-greeting-date { font-size: 11px; line-height: 1.2; }
    #app-titel-anzeige { font-size: 22px; line-height: 1.05; }
    .impuls-text { font-size: 17px; line-height: 1.38; }
    .tab-btn {
      min-height: 62px;
      padding: 10px 6px 9px;
      font-size: 12px;
    }
    .halt-stepper { grid-template-columns: 1fr; }
    .halt-step { display:flex; justify-content:space-between; border-right:0; border-bottom:1px solid var(--border); text-align:left; }
    .halt-action-grid { grid-template-columns: 1fr; }
    .uebung-jetzt-card {
      margin: 8px 12px 5px;
      padding: 18px 15px 16px;
      transform: none;
    }
    .schnellzugriff-row,
    .heute-grid,
    .card,
    .tagesfortschritt-card,
    .naechster-schritt-card,
    .streak-bar {
      margin-left: 12px;
      margin-right: 12px;
    }
  }


  /* ============================================================
     SMART FLOW / KONTEXTLOGIK
     ============================================================ */
  .smart-hinweis { margin-top: 10px; background: rgba(143,166,122,0.14); border-left: 4px solid var(--accent3); border-radius: 8px; padding: 9px 11px; font-size: 12px; color: var(--text2); line-height: 1.45; }
  .smart-hinweis strong { display: block; color: var(--text); font-size: 12px; margin-bottom: 2px; }
  #flow-modal { display: none; position: fixed; inset: 0; background: rgba(44,36,22,0.62); z-index: 650; align-items: flex-end; }
  #flow-modal.open { display: flex; }
  .flow-box { width: 100%; max-width: 600px; margin: 0 auto; background: var(--card); border-radius: 22px 22px 0 0; box-shadow: 0 -10px 40px rgba(0,0,0,0.22); overflow: hidden; }
  .flow-header { background: linear-gradient(135deg, #2c2416 0%, #4a3c28 100%); color: #f5f0e8; padding: 17px 20px 14px; }
  .flow-label { font-size: 10px; letter-spacing: 0; text-transform: uppercase; color: var(--accent2); margin-bottom: 4px; font-weight: 700; }
  .flow-title { font-family: 'Lora', serif; font-size: 19px; line-height: 1.3; }
  .flow-body { padding: 18px 20px 20px; }
  .flow-progress { height: 7px; border-radius: 999px; background: var(--bg3); overflow: hidden; margin-bottom: 16px; }
  .flow-progress-fill { height: 100%; width: 0%; background: linear-gradient(90deg, var(--accent3), var(--accent2)); transition: width 0.3s var(--ease-soft); }
  .flow-step-title { font-family: 'Lora', serif; font-size: 17px; color: var(--text); margin-bottom: 8px; }
  .flow-step-text { font-size: 14px; color: var(--text2); line-height: 1.65; margin-bottom: 12px; }
  .flow-meta { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
  .flow-actions { display: grid; grid-template-columns: 1fr 1.4fr; gap: 8px; margin-top: 16px; }
  .flow-feedback { display: none; margin-top: 12px; background: var(--bg2); border-radius: 10px; padding: 12px; }
  .flow-feedback.show { display: block; }
  @media (max-width: 420px) { .flow-actions { grid-template-columns: 1fr; } }

  /* ============================================================
     RUHIGE TESTVERSION: EINHEITLICHE OBERFLÄCHE
     ============================================================ */
  #impuls-header {
    background: #dbe8d8;
    border-bottom-color: rgba(88,116,93,0.22);
    box-shadow: 0 2px 10px rgba(39,48,36,0.08);
  }
  .impuls-label,
  #app-untertitel-anzeige,
  .section-label,
  .uebung-jetzt-label,
  .naechster-schritt-label,
  .halt-step-nr,
  .insight-label,
  .flow-label,
  .hilfe-h3 {
    letter-spacing: 0;
  }
  .section-label {
    text-transform: none;
    font-size: 13px;
    color: var(--text2);
    font-weight: 650;
    padding: 18px 16px 6px;
  }
  #tab-bar {
    top: 124px;
    background: rgba(255,254,250,0.94);
    backdrop-filter: blur(8px);
  }
  .tab-btn.active {
    background: rgba(99,139,109,0.12);
    border-bottom-color: var(--accent);
    color: var(--accent);
    font-weight: 750;
  }
  .card,
  .akkordeon,
  .settings-group,
  .streak-bar,
  .insight-card,
  .heute-slot,
  .tagesfortschritt-card,
  .naechster-schritt-card {
    border-color: rgba(88,116,93,0.18);
    box-shadow: var(--shadow);
  }
  .card:hover,
  .akkordeon:hover,
  .uebung-card:hover,
  .heute-slot:hover,
  .uebung-jetzt-card:hover,
  .tagesfortschritt-card:hover,
  .insight-card:hover {
    transform: none;
    box-shadow: 0 3px 14px rgba(39,48,36,0.08);
  }
  .card-reflexion,
  .card-daten,
  .card-verwaltung,
  .akkordeon,
  .journal-entry,
  .tagesfortschritt-card,
  .naechster-schritt-card,
  .rueckkehr-card,
  .wochenfokus-card,
  .smart-hinweis {
    border-left-width: 0;
  }
  .btn {
    min-height: 40px;
    border-radius: 9px;
    justify-content: center;
    white-space: normal;
    text-align: center;
  }
  .btn-primary {
    background: var(--accent);
    color: #fffefa;
  }
  .btn-primary:hover { background: #48644e; }
  .btn-secondary {
    background: #f7f9f4;
    color: var(--text2);
    border-color: rgba(88,116,93,0.22);
  }
  .btn-danger {
    background: #f8eeee;
    color: var(--danger);
    border: 1px solid rgba(159,79,69,0.24);
  }
  .btn-danger:hover { background: #f1dddd; }
  .badge {
    border-radius: 999px;
    background: rgba(88,116,93,0.10);
    color: var(--text2);
  }
  .badge-kat,
  .badge-kat[data-kat] {
    background: rgba(99,139,109,0.12);
    color: var(--text2);
  }
  input[type=range]::-webkit-slider-thumb,
  input[type=range]::-moz-range-thumb {
    box-shadow: 0 0 0 5px rgba(88,116,93,0.13), 0 1px 4px rgba(39,48,36,0.16);
  }

  .heute-einstieg-card {
    margin: 14px 16px 10px;
    padding: 22px 18px 16px;
    background: var(--card);
    border-color: rgba(88,116,93,0.18);
    box-shadow: var(--shadow);
  }
  .heute-einstieg-title {
    font-size: 23px;
    margin-bottom: 16px;
  }
  .heute-hauptbutton {
    box-shadow: 0 5px 15px rgba(88,116,93,0.16);
  }
  .heute-halt-link {
    color: var(--text2);
    margin-top: 10px;
    padding: 9px 10px 4px;
  }
  .moment-auswahl {
    margin-top: 15px;
    padding-top: 14px;
  }
  .moment-auswahl-title {
    font-family: 'DM Sans', sans-serif;
    font-size: 14px;
    font-weight: 650;
    color: var(--text2);
    text-align: left;
  }
  .moment-option {
    background: var(--card-soft);
    min-height: 42px;
  }
  .moment-option-halt {
    background: rgba(99,139,109,0.10);
    color: var(--accent);
  }
  .moment-schliessen {
    color: var(--text2);
  }
  #heute-mehr-toggle,
  #uebungen-filter-toggle {
    min-height: 36px;
    margin-top: 8px;
  }
  .uebung-jetzt-card {
    background: var(--card);
    border: 1px solid rgba(88,116,93,0.28);
    border-radius: var(--radius);
    margin: 8px 16px 8px;
    padding: 18px 16px 16px;
    box-shadow: 0 5px 18px rgba(39,48,36,0.10);
    transform: none;
  }
  .uebung-jetzt-card.uebung-jetzt-done {
    background: linear-gradient(180deg, #f8fbf5 0%, #eef6eb 100%);
    border-color: rgba(88,116,93,0.38);
    box-shadow: 0 4px 16px rgba(88,116,93,0.12);
  }
  .uebung-jetzt-card::before { display: none; }
  .uebung-jetzt-label {
    text-transform: none;
    color: var(--accent);
    font-size: 12px;
    margin-bottom: 7px;
    padding-left: 0;
  }
  .uebung-jetzt-actions {
    grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  }
  .uebung-jetzt-status {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    margin: 10px 0 12px;
    padding: 10px 11px;
    border-radius: 9px;
    border: 1px solid rgba(88,116,93,0.28);
    background: rgba(255,254,250,0.78);
    color: var(--text);
    font-size: 13px;
    line-height: 1.3;
  }
  .uebung-jetzt-status-mark {
    width: 28px;
    height: 28px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    background: var(--accent);
    color: #fffefa;
    font-weight: 800;
    font-size: 15px;
  }
  .uebung-jetzt-status strong {
    display: block;
    font-weight: 750;
  }
  .uebung-jetzt-status small {
    display: block;
    color: var(--text2);
    font-size: 12px;
    margin-top: 1px;
  }

  .halt-card {
    background: var(--card);
    margin-top: 10px;
  }
  .halt-stepper {
    display: flex;
    gap: 7px;
    border: 0;
    border-radius: 0;
    overflow-x: auto;
    background: transparent;
    margin: 8px 16px 10px;
    padding-bottom: 2px;
    scrollbar-width: none;
  }
  .halt-stepper::-webkit-scrollbar { display: none; }
  .halt-step {
    flex: 1 0 104px;
    border: 1px solid rgba(88,116,93,0.18);
    border-radius: 999px;
    background: var(--card-soft);
    color: var(--text3);
    padding: 8px 10px;
    text-align: center;
  }
  .halt-step-label {
    font-weight: 650;
  }
  .halt-step.active {
    color: var(--text);
    background: rgba(99,139,109,0.14);
    border-color: rgba(88,116,93,0.32);
    box-shadow: none;
  }
  .halt-step-nr {
    text-transform: none;
    font-size: 10px;
    font-weight: 650;
    color: var(--text3);
  }
  .halt-title {
    font-size: 20px;
  }
  .halt-note {
    border: 1px solid rgba(88,116,93,0.18);
    border-left-width: 0;
    background: rgba(99,139,109,0.09);
  }
  .halt-grounding {
    background: linear-gradient(180deg, rgba(99,139,109,0.15), rgba(255,254,250,0.82));
    border-color: rgba(88,116,93,0.26);
    color: var(--text);
    font-size: 14px;
  }
  .halt-note.warn {
    border-color: rgba(180,122,88,0.22);
    background: #faf3ee;
  }
  .halt-chip,
  .halt-starter,
  .halt-action {
    background: var(--card-soft);
    border-color: rgba(88,116,93,0.20);
  }
  .halt-chip.active,
  .halt-action.active {
    border-color: rgba(88,116,93,0.38);
    background: rgba(99,139,109,0.15);
    color: var(--text);
    box-shadow: none;
  }
  .halt-summary {
    background: var(--card-soft);
  }

  .uebungen-einstieg {
    padding-top: 12px;
    gap: 7px;
  }
  .uebung-chip {
    background: var(--card);
    color: var(--text2);
    border-color: rgba(88,116,93,0.22);
    padding: 8px 11px;
  }
  .uebung-chip.active {
    background: rgba(99,139,109,0.14);
    color: var(--accent);
    border-color: rgba(88,116,93,0.34);
  }
  .uebungen-filter-card {
    background: var(--card-soft);
    box-shadow: none;
  }
  .uebung-card {
    background: var(--card);
    border: 1px solid rgba(88,116,93,0.18);
    border-radius: var(--radius);
    margin: 9px 16px;
    padding: 15px;
  }
  .uebung-titel {
    font-size: 16px;
  }
  .uebung-meta {
    gap: 7px;
  }
  .fav-btn {
    opacity: 0.72;
  }
  .fav-btn.aktiv {
    color: var(--warm);
    opacity: 1;
  }
  .sterne,
  .inline-sterne {
    opacity: 0.82;
  }

  .settings-group {
    margin-top: 10px;
    background: var(--card);
  }
  .settings-group-header {
    padding: 15px 16px;
  }
  .settings-group.open .settings-group-header {
    background: rgba(99,139,109,0.10);
  }
  #settings-group-technik {
    opacity: 0.78;
    margin-top: 18px;
  }
  #settings-group-technik.open {
    opacity: 1;
  }
  .settings-group .card {
    background: var(--card-soft);
    border-color: rgba(88,116,93,0.16);
  }
  .settings-quiet-card {
    background: #fbfcf8;
  }
  .setting-row {
    gap: 12px;
    border-bottom-color: rgba(88,116,93,0.14);
  }
  .setting-label {
    font-weight: 650;
  }
  #sync-reset-row,
  #settings-group-technik .btn-danger,
  #label-daten-loeschen {
    opacity: 0.82;
  }
  .settings-rare-actions {
    margin: 10px 12px 12px;
    border: 1px solid rgba(88,116,93,0.16);
    border-radius: var(--radius);
    background: rgba(255,254,250,0.58);
    overflow: hidden;
  }
  .settings-group .settings-rare-actions {
    margin-left: 12px;
    margin-right: 12px;
  }
  .settings-rare-actions summary {
    list-style: none;
    cursor: pointer;
    padding: 10px 12px;
    color: var(--text3);
    font-size: 13px;
    font-weight: 650;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .settings-rare-actions summary::-webkit-details-marker {
    display: none;
  }
  .settings-rare-actions summary::after {
    content: 'anzeigen';
    color: var(--text3);
    font-size: 12px;
    font-weight: 500;
  }
  .settings-rare-actions[open] summary::after {
    content: 'ausblenden';
  }
  .settings-rare-actions .setting-row {
    padding: 12px;
    border-top: 1px solid rgba(88,116,93,0.14);
    border-bottom: 0;
  }
  .settings-danger-row {
    background: rgba(180,122,88,0.06);
  }
  .settings-technical-details {
    background: transparent;
  }
  .settings-technical-details .card {
    margin: 0;
    border-width: 1px 0 0;
    border-radius: 0;
  }

  @media (max-width: 640px) {
    #tab-bar { top: 124px; }
    .tab-btn {
      min-width: 76px;
      min-height: 68px;
      padding: 12px 8px 10px;
      font-size: 13px;
    }
    .tab-icon {
      font-size: 20px;
    }
    .header-tools {
      flex-wrap: wrap;
      max-width: 156px;
    }
    .header-halt-btn {
      min-height: 32px;
      padding-left: 10px;
      padding-right: 10px;
    }
    .heute-einstieg-card {
      margin: 12px;
      padding: 20px 15px 15px;
    }
    .heute-einstieg-title {
      font-size: 21px;
      margin-bottom: 14px;
    }
    .heute-hauptbutton {
      min-height: 46px;
    }
    .moment-auswahl.open {
      gap: 8px;
    }
    .moment-option {
      min-height: 46px;
      padding: 11px 12px;
    }
    .uebung-jetzt-card,
    .uebung-card,
    .settings-group,
    .halt-stepper,
    .halt-card {
      margin-left: 12px;
      margin-right: 12px;
    }
    .halt-stepper {
      display: flex;
      grid-template-columns: none;
    }
    .halt-step {
      display: block;
      border: 1px solid rgba(88,116,93,0.18);
      text-align: center;
      min-width: 112px;
    }
    .halt-action-grid,
    .uebung-jetzt-actions {
      grid-template-columns: 1fr;
    }
    .settings-group .card {
      margin-left: 10px;
      margin-right: 10px;
    }
    .setting-row {
      align-items: flex-start;
      gap: 10px;
      flex-wrap: wrap;
    }
    .setting-row > div:first-child {
      min-width: 0;
      flex: 1 1 190px;
    }
    .setting-row > .btn,
    .setting-row > div:last-child .btn {
      flex-shrink: 0;
    }
    #sync-aktionen > div:last-child {
      width: 100%;
      display: grid !important;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
    }
  }

  @media (max-width: 380px) {
    .header-tools {
      max-width: 136px;
      gap: 4px;
    }
    .header-halt-btn {
      font-size: 10px;
      min-height: 30px;
      padding: 6px 8px;
    }
    .hilfe-btn {
      padding-left: 8px;
      padding-right: 8px;
    }
    .tab-btn {
      min-width: 70px;
      font-size: 12px;
    }
    .uebung-meta {
      gap: 6px;
    }
    .halt-actions {
      flex-wrap: wrap;
    }
    .uebung-actions .btn,
    .halt-actions .btn {
      flex: 1 1 130px;
    }
  }

  /* Mobile Endpolitur */
  @media (max-width: 640px) {
    body {
      font-size: 14px;
      overflow-x: hidden;
    }
    #main {
      max-width: 100%;
      padding-bottom: 92px;
    }
    #impuls-header {
      padding: 9px 11px 11px;
    }
    #impuls-header > div:first-child {
      grid-template-columns: minmax(0, 1fr) minmax(118px, auto) !important;
      gap: 7px;
    }
    .app-titel-bereich {
      padding-bottom: 6px;
      margin-bottom: 5px;
    }
    #app-titel-anzeige {
      font-size: 20px;
      max-width: 100%;
      overflow-wrap: anywhere;
    }
    #app-untertitel-anzeige {
      font-size: 12px;
      max-width: 13.5em;
    }
    .header-meta {
      max-width: 44vw;
      gap: 5px;
    }
    .header-greeting {
      max-width: 100%;
    }
    .header-greeting-date {
      font-size: 10.5px;
    }
    .header-tools {
      max-width: 100%;
      justify-content: flex-end;
      gap: 4px;
    }
    .header-halt-btn {
      max-width: 96px;
      min-height: 31px;
      padding: 6px 8px;
      font-size: 10.5px;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .hilfe-btn,
    #lang-btn-de,
    #lang-btn-en {
      min-width: 30px;
      min-height: 30px;
      padding: 3px 6px !important;
      font-size: 15px !important;
    }
    .impuls-text {
      font-size: 15.5px;
      line-height: 1.35;
    }
    #tab-bar {
      width: 100%;
      overflow-x: hidden;
    }
    .tab-btn {
      min-width: 0;
      min-height: 66px;
      padding: 10px 4px 9px;
      flex: 1 1 25%;
      gap: 5px;
    }
    .tab-label {
      max-width: 100%;
      overflow-wrap: anywhere;
    }
    .section-label {
      padding: 16px 12px 5px;
      font-size: 13px;
    }
    .heute-einstieg-card {
      margin: 10px 12px 8px;
      padding: 18px 14px 14px;
    }
    .heute-einstieg-title {
      font-size: 20px;
      line-height: 1.22;
    }
    .heute-hauptbutton {
      margin-top: 10px;
      min-height: 46px;
      padding: 12px 14px;
    }
    .heute-halt-link {
      line-height: 1.35;
      padding-left: 4px;
      padding-right: 4px;
    }
    .moment-auswahl {
      margin-top: 13px;
      padding-top: 13px;
    }
    .moment-auswahl-title {
      font-size: 13px;
    }
    .moment-option {
      min-height: 44px;
      line-height: 1.3;
    }
    .uebung-jetzt-card {
      margin: 8px 12px;
      padding: 16px 14px 14px;
    }
    .uebung-jetzt-titel {
      font-size: 18px;
      line-height: 1.28;
    }
    .uebung-jetzt-meta,
    .uebung-meta {
      gap: 6px;
      align-items: center;
    }
    .badge {
      max-width: 100%;
      line-height: 1.35;
      white-space: normal;
    }
    .uebung-jetzt-actions,
    .uebung-actions {
      display: grid;
      grid-template-columns: 1fr;
      gap: 8px;
    }
    .uebung-actions .btn,
    .uebung-jetzt-actions .btn {
      width: 100%;
      min-height: 42px;
    }
    .skala-label {
      align-items: flex-start;
      gap: 8px;
    }
    .skala-label-text small {
      line-height: 1.25;
    }
    input[type=range] {
      height: 28px;
    }
    .halt-stepper {
      margin: 8px 12px 10px;
      gap: 6px;
      padding-bottom: 4px;
      overflow-x: auto;
    }
    .halt-step {
      flex: 0 0 auto;
      min-width: 118px;
      min-height: 40px;
      padding: 8px 10px;
      line-height: 1.2;
    }
    .halt-step-nr {
      display: none;
    }
    .halt-title {
      font-size: 19px;
      line-height: 1.25;
    }
    .halt-intro,
    .halt-note,
    .halt-action,
    .halt-starter {
      font-size: 13px;
    }
    .halt-chips {
      gap: 7px;
    }
    .halt-chip {
      min-height: 38px;
      padding: 8px 10px;
      line-height: 1.2;
    }
    .halt-actions {
      display: grid;
      grid-template-columns: 1fr;
    }
    .halt-actions span {
      display: none;
    }
    .uebungen-einstieg {
      padding: 11px 12px 7px;
      gap: 6px;
    }
    .uebung-chip {
      min-height: 38px;
      padding: 8px 10px;
      font-size: 13px;
    }
    .uebungen-filter-card {
      margin-left: 12px !important;
      margin-right: 12px !important;
    }
    .settings-group {
      margin-left: 12px;
      margin-right: 12px;
    }
    .settings-group-header {
      padding: 13px 14px;
    }
    .settings-group-title {
      font-size: 14px;
    }
    .setting-row {
      padding: 11px 0;
    }
    .setting-label,
    .setting-sub {
      line-height: 1.35;
    }
    .modal {
      padding: 16px;
      max-height: 88vh;
    }
  }

  @media (max-width: 420px) {
    .header-meta {
      max-width: 42vw;
    }
    .header-greeting-main {
      font-size: 13px;
    }
    .header-greeting-date {
      display: none;
    }
    .header-halt-btn {
      max-width: 88px;
    }
    .heute-grid {
      grid-template-columns: 1fr;
      gap: 7px;
    }
    .heute-slot {
      display: grid;
      grid-template-columns: 32px 1fr auto;
      align-items: center;
      text-align: left;
      padding: 10px 12px;
    }
    .heute-slot-icon {
      margin: 0;
    }
    .streak-bar {
      align-items: flex-start;
      flex-wrap: wrap;
    }
    .streak-tage {
      width: 100%;
      justify-content: space-between;
    }
    .setting-row > .btn,
    .setting-row > button.btn {
      width: 100%;
    }
    .setting-row > div:last-child:not(:first-child) {
      width: 100%;
    }
    #sync-aktionen > div:last-child {
      grid-template-columns: 1fr;
    }
  }

  @media (max-width: 360px) {
    #impuls-header > div:first-child {
      grid-template-columns: minmax(0, 1fr) 104px !important;
    }
    .header-tools {
      gap: 3px;
    }
    .header-halt-btn {
      max-width: 100%;
      width: 100%;
      order: 3;
    }
    .hilfe-btn,
    #lang-btn-de,
    #lang-btn-en {
      min-width: 28px;
      min-height: 28px;
      font-size: 14px !important;
    }
    .tab-btn {
      min-height: 62px;
      font-size: 11.5px;
    }
    .tab-icon {
      font-size: 18px;
    }
    .heute-einstieg-title {
      font-size: 19px;
    }
    .btn {
      padding-left: 12px;
      padding-right: 12px;
    }
    .halt-step {
      min-width: 110px;
    }
    .settings-rare-actions summary {
      padding: 10px;
    }
  }

  /* ============================================================
     PRINT / PDF-EXPORT
     ============================================================ */
  #print-bereich { display: none; }

  /* PDF-Modal Checkbox-Labels */
  .pdf-cb-label {
    display: flex; align-items: center; gap: 8px;
    background: var(--bg2); border: 1px solid var(--border);
    border-radius: 8px; padding: 10px 12px; cursor: pointer;
    font-size: 13px; transition: background 0.15s;
  }
  .pdf-cb-label:hover { background: var(--bg3); }
  .pdf-cb-label input[type=checkbox] { width: 16px; height: 16px; accent-color: var(--accent); flex-shrink: 0; }


  @media (hover: none) {
    .card:hover, .uebung-card:hover, .heute-slot:hover, .akkordeon:hover, .uebung-jetzt-card:hover {
      transform: none;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
      transition: none !important;
      animation: none !important;
      scroll-behavior: auto !important;
    }
  }

  @media print {
    * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    body > *:not(#print-bereich) { display: none !important; }
    #print-bereich {
      display: block !important;
      font-family: 'Segoe UI', Arial, sans-serif;
      color: #2c2416;
      background: #fff;
      margin: 0;
      padding: 24px 28px;
      font-size: 13px;
      line-height: 1.6;
    }

    /* Header */
    .print-header {
      border-bottom: 2.5px solid #7a6d52;
      padding-bottom: 14px;
      margin-bottom: 24px;
    }
    .print-header-logo {
      font-size: 13px;
      color: #9e8f7a;
      margin-bottom: 4px;
      letter-spacing: 0.5px;
    }
    .print-header h1 {
      font-family: Georgia, 'Times New Roman', serif;
      font-size: 20px;
      margin: 0 0 5px;
      color: #2c2416;
      font-weight: normal;
    }
    .print-meta { font-size: 11px; color: #9e8f7a; }

    /* Tag-Block */
    .print-tag {
      page-break-inside: avoid;
      margin-bottom: 32px;
      padding-bottom: 20px;
      border-bottom: 1px solid #e2dace;
    }
    .print-tag:last-of-type { border-bottom: none; }
    .print-tag h2 {
      font-family: Georgia, 'Times New Roman', serif;
      font-size: 15px;
      font-weight: normal;
      color: #2c2416;
      border-bottom: 1px solid #d4ccbc;
      padding-bottom: 7px;
      margin-bottom: 14px;
    }

    /* Sektionen */
    .print-sektion { margin-bottom: 14px; }
    .print-sektion h3 {
      font-size: 10px;
      font-family: Arial, sans-serif;
      text-transform: uppercase;
      letter-spacing: 0;
      color: #9e8f7a;
      margin-bottom: 8px;
      font-weight: 600;
    }

    /* Check-in Block */
    .print-ci-block {
      background: #faf7f2;
      border: 1px solid #e2dace;
      border-radius: 6px;
      padding: 10px 12px;
      margin-bottom: 8px;
      page-break-inside: avoid;
    }
    .print-ci-titel {
      font-size: 12px;
      font-weight: 600;
      color: #6b5f4e;
      margin-bottom: 7px;
      text-transform: uppercase;
      letter-spacing: 0;
    }

    /* Zeilen mit Balken */
    .print-zeile {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 3px 0;
      border-bottom: 1px dotted #e2dace;
      font-size: 12px;
    }
    .print-zeile:last-child { border-bottom: none; }
    .print-zeile-label { color: #6b5f4e; }
    .print-zeile-wert { display: flex; align-items: center; gap: 6px; font-weight: 500; }

    /* Balken-Grafik */
    .print-balken-wrap {
      display: inline-block;
      width: 60px;
      height: 6px;
      background: #e2dace;
      border-radius: 3px;
      vertical-align: middle;
      overflow: hidden;
    }
    .print-balken-fill {
      display: block;
      height: 100%;
      background: #7a6d52;
      border-radius: 3px;
    }

    /* Text-Blöcke */
    .print-text {
      font-size: 12px;
      color: #2c2416;
      line-height: 1.6;
      background: #f5f0e8;
      padding: 7px 10px;
      border-radius: 4px;
      margin-top: 5px;
    }
    .print-text-klein { font-size: 11px; color: #6b5f4e; }

    /* Übungen */
    .print-uebung-zeile {
      display: flex;
      align-items: baseline;
      flex-wrap: wrap;
      gap: 6px;
      padding: 5px 0;
      border-bottom: 1px dotted #e2dace;
      font-size: 12px;
    }
    .print-uebung-zeile:last-child { border-bottom: none; }
    .print-uebung-titel { flex: 1; color: #2c2416; }
    .print-sterne { color: #b5956a; letter-spacing: 0; font-size: 11px; }

    /* Badges */
    .print-badge {
      display: inline-block;
      font-size: 10px;
      background: #ede7d9;
      padding: 1px 7px;
      border-radius: 10px;
      font-family: Arial, sans-serif;
      white-space: nowrap;
    }
    .print-badge-done { background: #d4e8c9; color: #3a6b2a; }
    .print-badge-vorschlag { background: #e8e2d4; color: #7a6d52; }

    /* Vorgeschlagene Übung (kursiv, dezent) */
    .print-uebung-vorschlag .print-uebung-titel { color: #6b5f4e; font-style: italic; }

    /* Zusammenfassungs-Block */
    .print-zusammenfassung { background: #f5f0e8; border: 1px solid #d4ccbc; border-radius: 6px; padding: 12px 14px; margin-bottom: 22px; page-break-inside: avoid; }
    .print-zusammenfassung h3 { font-size: 10px; font-family: Arial, sans-serif; text-transform: uppercase; letter-spacing: 0; color: #9e8f7a; margin: 0 0 10px; font-weight: 600; }

    /* Notizen */
    .print-notiz { margin-bottom: 8px; }
    .print-notiz-time { font-size: 10px; color: #9e8f7a; margin-bottom: 2px; display: block; }

    /* Leer-Hinweis */
    .print-leer { font-size: 11px; color: #9e8f7a; font-style: italic; }

    /* Footer */
    .print-footer {
      font-size: 10px;
      color: #9e8f7a;
      font-family: Arial, sans-serif;
      text-align: center;
      margin-top: 32px;
      border-top: 1px solid #d4ccbc;
      padding-top: 10px;
    }
  }