:root{
  /* ═══ TANREN MOMO PALETTE ═══
     Peach als Akzent (max 3-5%), Cream trägt die Fläche, Charcoal für Typo */
  --green:#F4B4A6;            /* PRIMARY = Momo Peach — Legacy-Name (--green) für minimum Code-Churn */
  --green-mid:#E89F8F;        /* Peach darker — Hover/Active */
  --green-light:#FBE5DE;      /* Peach tint — Backgrounds, Fills */
  --lime:#EFE8DC;             /* Cream-Soft — Card-Hover, Fills */
  --lime-bright:#F2ECE0;      /* Cream-Bright — Light tint */
  --accent:#F4B4A6;           /* Peach = Accent (same as primary, bewusst) */
  --accent-soft:#FBE5DE;      /* Peach tint */
  --bg:#F7F2EA;               /* CREAM — warmes Papier, nicht kaltes Weiß */
  --card:#FFFFFF;             /* White cards auf Cream */
  --border:#D9CEC0;           /* SAND — warme Borders */
  --text:#1A1614;             /* CHARCOAL — warmer Schwarz-Ton */
  --text-mid:#6B5F55;         /* Ink-Mid */
  --text-soft:#9A8E82;        /* Ink-Soft */
  --radius:22px;
  --radius-lg:28px;
  --radius-sm:14px;
  /* Shadow-System: warmer, weniger blau */
  --shadow-xs:0 1px 2px rgba(26,22,20,0.04),inset 0 1px 0 rgba(255,255,255,0.7);
  --shadow:0 1px 2px rgba(26,22,20,0.04),0 10px 28px -12px rgba(26,22,20,0.08),inset 0 1px 0 rgba(255,255,255,0.7);
  --shadow-sm:0 1px 3px rgba(26,22,20,0.05);
  --shadow-lift:0 2px 4px rgba(26,22,20,0.04),0 20px 40px -15px rgba(26,22,20,0.12),inset 0 1px 0 rgba(255,255,255,0.8);
  --shadow-inset-glass:inset 0 1px 0 rgba(255,255,255,0.08),inset 0 -1px 0 rgba(0,0,0,0.05);
  --success:#5C6148;          /* Deep Moss für Success-States (earthy, matches Palette) */
  --success-light:#E3E6D8;
  --danger:#B8352E;           /* 辰砂-adjacent — warmer Rot */
  --danger-soft:#F5DEDB;
  /* Display-Serif für Hero-Moments */
  --font-display:'Fraunces','Cardo','Playfair Display',Georgia,serif;
  /* Spring-physics motion */
  --ease-out:cubic-bezier(0.23,1,0.32,1);
  --ease-in-out:cubic-bezier(0.77,0,0.175,1);
  --ease-spring:cubic-bezier(0.34,1.56,0.64,1);
  --ease-spring-soft:cubic-bezier(0.5,1.4,0.4,1);
  --ease-swift:cubic-bezier(0.16,1,0.3,1);
  color-scheme:light;
}
/* ============ DARK MODE — MOMO × CHARCOAL ============ */
:root[data-theme="dark"]{
  --green:#F5B8AB;            /* Peach bleibt Peach, minimal saturierter */
  --green-mid:#EEA395;
  --green-light:#3A2420;      /* Dark peach tint */
  --lime:#221C18;             /* Warm dark surface */
  --lime-bright:#2A2420;
  --accent:#F5B8AB;
  --accent-soft:#3A2420;
  --bg:#14100E;               /* Warm Charcoal — nicht pure Black */
  --card:#221C18;             /* Slightly lighter card surface */
  --border:#3A332E;           /* Warm dark borders */
  --text:#F7F2EA;             /* Cream wird Text */
  --text-mid:#A39689;
  --text-soft:#6E6459;
  --shadow-xs:0 1px 2px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.04);
  --shadow:0 1px 2px rgba(0,0,0,0.3),0 10px 28px -12px rgba(0,0,0,0.55),inset 0 1px 0 rgba(255,255,255,0.04);
  --shadow-sm:0 1px 3px rgba(0,0,0,0.4);
  --shadow-lift:0 2px 4px rgba(0,0,0,0.3),0 20px 40px -15px rgba(0,0,0,0.6),inset 0 1px 0 rgba(255,255,255,0.05);
  --success:#9AAF80;
  --success-light:#2A3220;
  --danger:#E5758A;
  --danger-soft:#3A1D24;
  color-scheme:dark;
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important}
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%}
html{overflow-x:hidden;overscroll-behavior-x:none;scroll-behavior:auto}
body{font-family:'Geist',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:var(--bg);min-height:100dvh;max-width:480px;margin:0 auto;padding-bottom:90px;color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:"ss01","ss02";letter-spacing:-0.01em;overflow-x:hidden;overscroll-behavior-x:none;overscroll-behavior-y:none;width:100%;position:relative}
@supports not (min-height:100dvh){body{min-height:100vh}}
/* Alle Form-Sheets + Modals: horizontale Bewegung sperren — aber horizontale Inner-Scroller bleiben möglich */
.form-sheet-overlay,.modal-overlay,.form-sheet,.modal,.form-sheet-body,.modal-body{overflow-x:hidden;overscroll-behavior-x:none;max-width:100%}
/* Inputs: niemals über Container rausragen */
input,textarea,select{max-width:100%}
.mono,.tabular{font-family:'Geist Mono','JetBrains Mono',ui-monospace,Menlo,monospace;font-feature-settings:"zero","ss01"}

/* Skill-7: Perpetual micro-interactions */
@keyframes shimmerMove{0%{background-position:-200% 0}100%{background-position:200% 0}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes breathe{0%,100%{opacity:0.6;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}
@keyframes staggerIn{from{opacity:0;transform:translateY(10px) scale(0.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes shineSweep{0%{transform:translateX(-120%) skewX(-15deg)}60%,100%{transform:translateX(260%) skewX(-15deg)}}

/* Tactile press — Skill Rule 5 */
.press{transition:transform 180ms var(--ease-spring-soft),box-shadow 220ms var(--ease-swift)}
.press:active{transform:translateY(1px) scale(0.98)}

/* Header */
.header{background:rgba(255,255,255,0.82);backdrop-filter:saturate(180%) blur(16px);-webkit-backdrop-filter:saturate(180%) blur(16px);padding:max(env(safe-area-inset-top),10px) 16px 10px;position:sticky;top:0;z-index:10;border-bottom:1px solid rgba(236,239,241,0.6)}
.header-wrap{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:40px}
.header-left{display:flex;align-items:center;gap:10px}
.header-right{display:flex;align-items:center;gap:6px}

/* Brand */
.header-brand{display:inline-flex;align-items:center;gap:7px;background:transparent;border:none;cursor:pointer;padding:4px 2px;font-family:'Geist',-apple-system,sans-serif;transition:transform 180ms var(--ease-spring-soft);user-select:none}
.header-brand:active{transform:scale(0.96)}
.header-brand-ring{display:block;overflow:visible;flex-shrink:0}
.header-brand-ring #brand-ring-progress{transition:stroke-dashoffset 700ms var(--ease-swift)}
.header-brand-ring .brand-dot-core{transform-origin:10px 10px;transform-box:fill-box}
.header-brand-text{font-size:18px;font-weight:500;letter-spacing:-0.7px;line-height:1;color:var(--text);font-feature-settings:"ss01","ss02"}

/* Upgrade-Button */
.header-upgrade{display:inline-flex;align-items:center;gap:4px;padding:6px 12px;background:var(--momo-peach);color:var(--text);border:none;border-radius:99px;font-family:'Geist',sans-serif;font-size:11px;font-weight:600;letter-spacing:-0.1px;cursor:pointer;box-shadow:0 1px 2px rgba(255,198,79,0.3),0 4px 12px -2px rgba(255,198,79,0.4),inset 0 1px 0 rgba(255,255,255,0.4);transition:transform 180ms var(--ease-spring-soft),box-shadow 220ms var(--ease-swift);position:relative;overflow:hidden}
.header-upgrade::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,0.5) 48%,transparent 66%);transform:translateX(-120%) skewX(-15deg);transition:transform 900ms var(--ease-swift)}
.header-upgrade:hover::before{transform:translateX(250%) skewX(-15deg)}
.header-upgrade:active{transform:scale(0.94)}
.header-upgrade svg{flex-shrink:0}

/* Icon Buttons rechts */
.header-icon-btn{background:var(--lime-bright);border:1px solid var(--border);border-radius:99px;width:36px;height:36px;cursor:pointer;color:var(--text-mid);display:flex;align-items:center;justify-content:center;transition:background 200ms var(--ease-swift),color 200ms var(--ease-swift),transform 160ms var(--ease-spring-soft),border-color 200ms var(--ease-swift)}
.header-icon-btn:hover{background:var(--text);color:#fff;border-color:var(--text)}
.header-icon-btn:active{transform:scale(0.9)}

/* Streak Badge im Header */
.streak-badge{display:inline-flex;align-items:center;gap:5px;background:var(--lime-bright);border:1px solid var(--border);border-radius:99px;height:36px;padding:0 12px 0 10px;color:var(--text);font-weight:600;font-size:13px;cursor:pointer;transition:background 200ms var(--ease-swift),transform 160ms var(--ease-spring-soft),border-color 200ms var(--ease-swift);font-variant-numeric:tabular-nums;letter-spacing:-0.2px}
.streak-badge:active{transform:scale(0.92)}
.streak-badge[hidden]{display:none}
.streak-badge .streak-flame{width:14px;height:14px;color:#B8704F;transition:color 200ms var(--ease-swift)}
.streak-badge.active{background:linear-gradient(135deg,#FBE5DE 0%,#F4C4B0 100%);border-color:#D98E6B;color:#5A2A1E}
.streak-badge.active .streak-flame{color:#8C3A2A}
.streak-badge.danger{background:linear-gradient(135deg,#FBE5DE 0%,#F4C4B0 100%);border-color:#D98E6B;color:#5A2A1E}
.streak-badge.danger .streak-flame{color:#8C3A2A;animation:streak-flame-flicker 2.4s var(--ease-swift) infinite}
@keyframes streak-flame-flicker{0%,100%{opacity:1}50%{opacity:0.55}}
@keyframes streak-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}
@keyframes streak-bump{0%{transform:scale(1)}40%{transform:scale(1.18) rotate(-3deg)}100%{transform:scale(1) rotate(0)}}
.streak-badge.bumping{animation:streak-bump 650ms var(--ease-spring-soft)}

/* Streak Detail Sheet — Premium Bento */
.streak-body-wrap{padding:16px 16px 32px;display:flex;flex-direction:column;gap:14px}
.streak-hero-card{position:relative;overflow:hidden;border-radius:28px;background:transparent;color:#fff;padding:28px 24px 26px;isolation:isolate;box-shadow:0 2px 4px rgba(26,22,20,0.06),0 24px 48px -18px rgba(26,22,20,0.38)}

/* Compact-Variante: kleinere Hero-Card mit horizontalem Layout */
.streak-hero-card.compact{padding:18px 20px 20px;border-radius:24px}
.streak-hero-card.compact::before{top:-40%;right:-20%;width:70%;height:130%;filter:blur(14px)}
.streak-hero-row{display:flex;align-items:center;gap:18px;margin-top:4px}
.streak-hero-flame-wrap.compact{width:64px;height:64px;margin:0;flex-shrink:0}
.streak-hero-flame-wrap.compact .streak-hero-flame-inner{width:58px;height:58px;box-shadow:inset 0 2px 3px rgba(255,255,255,0.4),inset 0 -2px 4px rgba(110,46,0,0.25),0 8px 20px -4px rgba(226,132,24,0.55)}
.streak-hero-flame-wrap.compact .streak-hero-flame-inner svg{width:28px;height:28px}
.streak-hero-flame-wrap.compact .streak-hero-flame-glow{inset:-8px}
.streak-hero-content{flex:1;min-width:0}
.streak-hero-number.compact{font-size:52px;letter-spacing:-2.4px;margin-top:0;line-height:0.95;text-align:left}
.streak-hero-card.compact .streak-hero-label{text-align:left;margin-top:4px}
.streak-hero-sub.compact{font-size:12.5px;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,0.1);max-width:none;margin-left:0;margin-right:0;line-height:1.5;text-align:left;min-height:44px;display:flex;align-items:center}

/* Rules v2 — permanent sichtbar, 2-Spalten-Grid */
.streak-rules-v2{background:var(--card);border:1px solid var(--border);border-radius:22px;padding:18px 20px}
.streak-rules-v2-title{font-size:11px;letter-spacing:0.6px;color:var(--text-mid);text-transform:uppercase;font-weight:600;margin-bottom:14px;font-family:'Geist Mono',ui-monospace,monospace}
.streak-rules-v2-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 10px}
.streak-rule-v2{display:flex;gap:10px;align-items:flex-start}
.streak-rule-v2-ico{width:26px;height:26px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--lime);color:var(--green)}
.streak-rule-v2-ico.warn{background:transparent;border:1px solid var(--momo-peach);color:var(--momo-peach)}
.streak-rule-v2-ico.info{background:var(--lime-bright);color:var(--text-mid)}
.streak-rule-v2-head{font-size:12.5px;font-weight:500;color:var(--text);letter-spacing:-0.15px;line-height:1.3}
.streak-rule-v2-sub{font-size:11px;color:var(--text-mid);margin-top:2px;line-height:1.4;letter-spacing:-0.05px}
.streak-hero-card::before{content:"";position:absolute;top:-60%;right:-30%;width:85%;height:160%;background:radial-gradient(ellipse at center,rgba(255,166,54,0.5) 0%,rgba(255,166,54,0.15) 35%,transparent 65%);filter:blur(10px);z-index:-1;pointer-events:none}
.streak-hero-card.danger::before{background:radial-gradient(ellipse at center,rgba(255,107,53,0.6) 0%,rgba(255,107,53,0.2) 35%,transparent 65%)}
.streak-hero-card.zero::before{background:radial-gradient(ellipse at center,rgba(255,198,79,0.25) 0%,rgba(255,198,79,0.08) 35%,transparent 65%)}
.streak-hero-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:22px}
.streak-hero-eyebrow{font-size:10px;letter-spacing:1.5px;text-transform:uppercase;font-weight:600;color:rgba(255,255,255,0.55);font-family:'Geist Mono',ui-monospace,monospace}
.streak-hero-status-pill{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;border-radius:99px;font-size:11px;font-weight:500;letter-spacing:-0.1px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.streak-hero-status-pill.active{background:rgba(247,242,234,0.14);color:var(--momo-cream);border:1px solid rgba(247,242,234,0.22)}
.streak-hero-status-pill.danger{background:rgba(244,180,166,0.18);color:#F7CFB8;border:1px solid rgba(244,180,166,0.32)}
.streak-hero-status-pill.sleep{background:rgba(255,255,255,0.1);color:rgba(255,255,255,0.65);border:1px solid rgba(255,255,255,0.12)}
.streak-hero-status-pill.frozen{background:rgba(217,206,192,0.2);color:#EFE8DC;border:1px solid rgba(217,206,192,0.32)}
.streak-hero-flame-wrap{position:relative;width:96px;height:96px;margin:0 auto 6px;display:flex;align-items:center;justify-content:center}
.streak-hero-flame-glow{position:absolute;inset:-12px;border-radius:50%;background:radial-gradient(circle at center,rgba(255,184,77,0.55) 0%,transparent 65%);filter:blur(14px);animation:streak-glow 3.2s ease-in-out infinite;pointer-events:none}
.streak-hero-card.danger .streak-hero-flame-glow{background:radial-gradient(circle at center,rgba(255,107,53,0.65) 0%,transparent 65%)}
.streak-hero-card.zero .streak-hero-flame-glow{display:none}
@keyframes streak-glow{0%,100%{transform:scale(1);opacity:0.7}50%{transform:scale(1.15);opacity:1}}
.streak-hero-flame-inner{position:relative;width:86px;height:86px;border-radius:50%;background:radial-gradient(circle at 30% 20%,#F7CFB8 0%,#D98E6B 50%,#8C3A2A 100%);display:flex;align-items:center;justify-content:center;color:#3A1810;box-shadow:inset 0 2px 4px rgba(255,255,255,0.4),inset 0 -2px 6px rgba(58,24,16,0.3),0 12px 30px -6px rgba(140,58,42,0.55)}
.streak-hero-card.danger .streak-hero-flame-inner{background:radial-gradient(circle at 30% 20%,#E8A488 0%,#8C3A2A 50%,#3A1810 100%);color:#1A0A06;box-shadow:inset 0 2px 4px rgba(255,255,255,0.3),inset 0 -2px 6px rgba(26,10,6,0.4),0 12px 30px -6px rgba(58,24,16,0.55)}
.streak-hero-card.zero .streak-hero-flame-inner{background:rgba(255,255,255,0.08);color:rgba(255,255,255,0.4);box-shadow:inset 0 1px 0 rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.12)}
.streak-hero-flame-inner svg{width:40px;height:40px}
.streak-hero-number{font-size:88px;font-weight:500;letter-spacing:-4.5px;line-height:1;font-variant-numeric:tabular-nums;text-align:center;color:var(--text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:currentColor;margin-top:10px}
.streak-hero-card.zero .streak-hero-number{background:linear-gradient(180deg,rgba(255,255,255,0.75) 0%,rgba(255,255,255,0.35) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:currentColor}
.streak-hero-label{font-size:13px;color:rgba(255,255,255,0.65);text-align:center;margin-top:2px;letter-spacing:-0.1px;font-weight:400}
.streak-hero-sub{font-size:13px;color:rgba(255,255,255,0.75);text-align:center;margin-top:14px;letter-spacing:-0.15px;line-height:1.5;max-width:280px;margin-left:auto;margin-right:auto}

/* Heatmap — 14 Tage als Timeline, heute rechts */
.streak-heatmap{background:var(--card);border:1px solid var(--border);border-radius:22px;padding:18px 20px}
.streak-heatmap-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px}
.streak-heatmap-title{font-size:11px;letter-spacing:0.6px;color:var(--text-mid);text-transform:uppercase;font-weight:600}
.streak-heatmap-sub{font-size:11px;color:var(--text-soft);font-variant-numeric:tabular-nums}
.streak-heatmap-row{display:grid;grid-template-columns:repeat(14,1fr);gap:5px;margin-bottom:6px}
.streak-heatmap-labels{display:grid;grid-template-columns:repeat(14,1fr);gap:5px}
.streak-hm-cell{aspect-ratio:1;border-radius:6px;background:#F2EDE1;position:relative;transition:transform 200ms var(--ease-swift)}
.streak-hm-cell.done{background:linear-gradient(135deg,#E8A488 0%,#8C3A2A 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,0.3)}
.streak-hm-cell.frozen{background:repeating-linear-gradient(135deg,rgba(185,169,147,0.6) 0 4px,rgba(217,206,192,0.4) 4px 8px);box-shadow:inset 0 0 0 1px rgba(185,169,147,0.5)}
.streak-hm-cell.today{outline:2px solid var(--text);outline-offset:2px}
.streak-hm-label{font-size:9px;text-align:center;color:var(--text-soft);font-weight:500;letter-spacing:0.3px;font-family:'Geist Mono',ui-monospace,monospace;text-transform:uppercase}
.streak-hm-label.today{color:var(--text);font-weight:700}

/* Stats — borderless Split */
.streak-stats-split{display:grid;grid-template-columns:1fr 1px 1fr;gap:14px;background:var(--card);border:1px solid var(--border);border-radius:22px;padding:20px 18px;align-items:center}
.streak-stat-col{text-align:center}
.streak-stat-divider{background:var(--border);height:38px;align-self:center}
.streak-stat-val{font-size:34px;font-weight:500;letter-spacing:-1.2px;color:var(--text);font-variant-numeric:tabular-nums;line-height:1;background:linear-gradient(180deg,var(--text) 0%,var(--text-mid) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:currentColor}
.streak-stat-lbl{font-size:10px;color:var(--text-mid);letter-spacing:1px;text-transform:uppercase;font-weight:600;margin-top:6px;font-family:'Geist Mono',ui-monospace,monospace}

/* Milestones — horizontale Scroll-Chips */
.streak-ms-wrap{background:var(--card);border:1px solid var(--border);border-radius:22px;padding:18px 0 16px}
.streak-ms-head{display:flex;justify-content:space-between;align-items:baseline;padding:0 20px;margin-bottom:14px}
.streak-ms-title{font-size:11px;letter-spacing:0.6px;color:var(--text-mid);text-transform:uppercase;font-weight:600}
.streak-ms-progress{font-size:11px;color:var(--text-soft);font-family:'Geist Mono',ui-monospace,monospace}
.streak-ms-track{display:flex;gap:10px;overflow-x:auto;padding:2px 20px 6px;scrollbar-width:none;-ms-overflow-style:none}
.streak-ms-track::-webkit-scrollbar{display:none}
.streak-ms-chip{flex:0 0 auto;min-width:98px;padding:14px 14px 12px;background:var(--bg-2,#F5F0E3);border:1px solid var(--border);border-radius:16px;text-align:left;position:relative;transition:transform 200ms var(--ease-swift),border-color 200ms var(--ease-swift)}
.streak-ms-chip.done{background:linear-gradient(155deg,#FBE5DE 0%,#F4C4B0 100%);border-color:#D98E6B}
.streak-ms-chip.next{background:var(--card);border-color:var(--text);box-shadow:0 2px 4px rgba(26,22,20,0.04),0 12px 24px -10px rgba(26,22,20,0.16)}
.streak-ms-chip-num{font-size:26px;font-weight:500;letter-spacing:-1px;color:var(--text);font-variant-numeric:tabular-nums;line-height:1}
.streak-ms-chip.done .streak-ms-chip-num{color:#8C3A2A}
.streak-ms-chip-unit{font-size:11px;color:var(--text-mid);margin-top:2px;letter-spacing:-0.1px}
.streak-ms-chip-status{margin-top:10px;display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:600;letter-spacing:0.6px;text-transform:uppercase;font-family:'Geist Mono',ui-monospace,monospace;color:var(--text-soft)}
.streak-ms-chip.done .streak-ms-chip-status{color:#B8704F}
.streak-ms-chip.next .streak-ms-chip-status{color:var(--text)}

/* Rules — minimale Accordion */
.streak-rules{background:var(--card);border:1px solid var(--border);border-radius:22px;overflow:hidden}
.streak-rules-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;padding:18px 20px;background:none;border:none;cursor:pointer;font-family:inherit;text-align:left}
.streak-rules-toggle-label{font-size:14px;font-weight:500;color:var(--text);letter-spacing:-0.2px}
.streak-rules-toggle-chev{color:var(--text-soft);transition:transform 300ms var(--ease-swift)}
.streak-rules-toggle.open .streak-rules-toggle-chev{transform:rotate(180deg)}
.streak-rules-content{max-height:0;overflow:hidden;transition:max-height 420ms var(--ease-swift)}
.streak-rules-content.open{max-height:600px}
.streak-rules-inner{padding:0 20px 20px;display:flex;flex-direction:column;gap:12px}
.streak-rule{display:flex;gap:12px;align-items:flex-start}
.streak-rule-ico{width:28px;height:28px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--lime);color:var(--green)}
.streak-rule-ico.warn{background:transparent;border:1px solid var(--momo-peach);color:var(--momo-peach)}
.streak-rule-ico.info{background:var(--bg-2,#F5F0E3);color:var(--text-mid)}
.streak-rule-head{font-size:13px;font-weight:500;color:var(--text);letter-spacing:-0.15px;line-height:1.4}
.streak-rule-sub{font-size:12px;color:var(--text-mid);margin-top:2px;line-height:1.45;letter-spacing:-0.1px}

/* ═══════════════════════════════════════════════════════════
   SHARE MOMENTS — Exportable Cards für Instagram/Stories
   ═══════════════════════════════════════════════════════════ */
.share-sheet-body{padding:20px 16px 24px;display:flex;flex-direction:column;gap:14px}
.share-format-tabs{display:flex;gap:6px;background:var(--lime-bright);border-radius:14px;padding:4px}
.share-format-tab{flex:1;padding:10px;background:none;border:none;border-radius:10px;font-size:12px;font-weight:500;color:var(--text-mid);cursor:pointer;letter-spacing:-0.1px;font-family:inherit;transition:background 200ms var(--ease-swift),color 200ms var(--ease-swift)}
.share-format-tab.active{background:var(--card);color:var(--text);box-shadow:0 1px 2px rgba(26,22,20,0.06),0 4px 12px -4px rgba(26,22,20,0.12)}
.share-preview-wrap{display:flex;justify-content:center;padding:6px 0 4px;perspective:1000px}
.share-preview{border-radius:24px;overflow:hidden;box-shadow:0 2px 4px rgba(26,22,20,0.06),0 24px 48px -14px rgba(26,22,20,0.32);transform:scale(0.42);transform-origin:top center;transition:transform 450ms var(--ease-spring-soft);margin-bottom:-340px}
.share-preview.story{margin-bottom:-600px}
.share-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px}
.share-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px;border-radius:14px;font-family:inherit;font-size:14px;font-weight:500;letter-spacing:-0.15px;cursor:pointer;border:none;transition:transform 160ms var(--ease-spring-soft)}
.share-btn:active{transform:scale(0.97)}
.share-btn-primary{background:var(--text);color:#fff;grid-column:1/-1}
.share-btn-secondary{background:var(--lime-bright);color:var(--text);border:1px solid var(--border)}
.share-hint{font-size:11px;color:var(--text-mid);text-align:center;margin-top:4px;letter-spacing:-0.05px}

/* Offscreen Renderer — keine Interaktion, nur für html2canvas */
.share-render-area{position:fixed;top:-10000px;left:-10000px;pointer-events:none;z-index:-1}

/* ─── THE CARD (gleich für Preview + Render) ──────────────── */
.share-card{position:relative;overflow:hidden;font-family:'Geist',-apple-system,sans-serif;background:var(--momo-charcoal);color:var(--momo-cream);isolation:isolate}
.share-card.feed{width:1080px;height:1350px}      /* IG Portrait 4:5 */
.share-card.story{width:1080px;height:1920px}     /* IG Story 9:16 */
.share-card-bg{position:absolute;inset:0;background:var(--momo-charcoal);z-index:-2}
.share-card-glow{position:absolute;top:-20%;right:-20%;width:80%;height:80%;background:radial-gradient(circle at center,rgba(255,166,54,0.55) 0%,rgba(255,166,54,0.15) 40%,transparent 70%);filter:blur(60px);z-index:-1;pointer-events:none}
.share-card-grain{position:absolute;inset:0;background-image:radial-gradient(circle at 50% 50%,rgba(255,255,255,0.03) 0%,transparent 70%);mix-blend-mode:overlay;pointer-events:none;z-index:0}
.share-card-header{position:absolute;top:60px;left:60px;right:60px;display:flex;align-items:center;justify-content:space-between;z-index:2}
.share-card-brand{display:flex;align-items:center;gap:12px;font-size:32px;font-weight:500;letter-spacing:-1.5px}
.share-card-brand-dot{width:34px;height:34px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#F7CFB8 0%,#D98E6B 55%,#8C3A2A 100%);box-shadow:0 0 24px rgba(217,142,107,0.5)}
.share-card-tag{font-size:14px;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,0.55);font-weight:600;font-family:'Geist Mono',ui-monospace,monospace}
.share-card-body{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:160px 60px;z-index:1}
.share-card-flame{width:260px;height:260px;border-radius:50%;background:radial-gradient(circle at 30% 20%,#F7CFB8 0%,#D98E6B 50%,#8C3A2A 100%);display:flex;align-items:center;justify-content:center;color:#3A1810;box-shadow:inset 0 6px 12px rgba(255,255,255,0.4),inset 0 -8px 20px rgba(58,24,16,0.32),0 30px 80px -10px rgba(140,58,42,0.6);margin-bottom:50px;position:relative}
.share-card-flame::after{content:"";position:absolute;inset:-30px;border-radius:50%;background:radial-gradient(circle,rgba(217,142,107,0.32) 0%,transparent 70%);z-index:-1;filter:blur(20px)}
.share-card-flame svg{width:140px;height:140px}
.share-card-number{font-size:380px;font-weight:500;letter-spacing:-25px;line-height:0.85;color:var(--text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:currentColor;margin:10px 0 0;font-variant-numeric:tabular-nums}
.share-card.story .share-card-number{font-size:440px}
.share-card-label{font-size:40px;font-weight:500;color:rgba(255,255,255,0.9);letter-spacing:-0.8px;margin-top:26px}
.share-card-quote{margin-top:50px;font-size:28px;color:rgba(255,255,255,0.6);font-style:italic;max-width:720px;line-height:1.5;letter-spacing:-0.3px}
.share-card-footer{position:absolute;bottom:60px;left:60px;right:60px;display:flex;align-items:center;justify-content:space-between;z-index:2}
.share-card-user{font-size:18px;color:rgba(255,255,255,0.75);letter-spacing:-0.2px}
.share-card-user strong{color:#fff;font-weight:500}
.share-card-cta{font-size:14px;color:rgba(255,198,107,0.9);font-weight:600;letter-spacing:1.5px;text-transform:uppercase;font-family:'Geist Mono',ui-monospace,monospace}

/* Streak Detail Sheet — Share Button unten */
.streak-share-wrap{padding:0 16px 20px}
.streak-share-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:16px;background:transparent;color:#fff;border:none;border-radius:16px;font-family:inherit;font-size:15px;font-weight:500;letter-spacing:-0.2px;cursor:pointer;transition:transform 160ms var(--ease-spring-soft);box-shadow:0 2px 4px rgba(26,22,20,0.08),0 14px 28px -10px rgba(26,22,20,0.28)}
.streak-share-btn:active{transform:scale(0.97)}

/* Streak Intro Popover (1x beim ersten Mal) */
.streak-intro-backdrop{position:fixed;inset:0;background:rgba(26,22,20,0.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:9999;display:none;align-items:center;justify-content:center;padding:20px;opacity:0;transition:opacity 320ms var(--ease-swift)}
.streak-intro-backdrop.open{display:flex;opacity:1}
.streak-intro-card{background:var(--card);border-radius:28px;max-width:380px;width:100%;padding:32px 26px 22px;text-align:center;transform:scale(0.92);transition:transform 420ms var(--ease-spring-soft);box-shadow:0 30px 60px -20px rgba(26,22,20,0.35)}
.streak-intro-backdrop.open .streak-intro-card{transform:scale(1)}
.streak-intro-flame{width:84px;height:84px;margin:0 auto 16px;border-radius:50%;background:linear-gradient(135deg,#FBE5DE 0%,#E8A488 60%,#B8704F 100%);display:flex;align-items:center;justify-content:center;color:#5A2A1E;box-shadow:inset 0 1px 0 rgba(255,255,255,0.55),0 14px 32px -10px rgba(184,112,79,0.45);animation:streak-intro-pulse 2.8s ease-in-out infinite}
@keyframes streak-intro-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
.streak-intro-title{font-size:24px;font-weight:500;letter-spacing:-0.7px;color:var(--text);margin-bottom:6px}
.streak-intro-sub{font-size:14px;color:var(--text-mid);line-height:1.5;letter-spacing:-0.15px;margin-bottom:20px}
.streak-intro-rule{display:flex;gap:10px;align-items:flex-start;text-align:left;padding:10px 12px;background:var(--lime-bright);border-radius:12px;margin-bottom:8px;font-size:13px;color:var(--text);line-height:1.4}
.streak-intro-rule-ico{color:var(--green);flex-shrink:0;margin-top:1px}
.streak-intro-cta{width:100%;margin-top:14px;background:var(--text);color:#fff;border:none;border-radius:14px;padding:14px;font-size:15px;font-weight:500;letter-spacing:-0.2px;cursor:pointer;font-family:inherit;transition:transform 160ms var(--ease-spring-soft)}
.streak-intro-cta:active{transform:scale(0.97)}

.header p{display:none}

/* Bottom Nav */
.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;background:rgba(255,255,255,0.92);backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);border-top:1px solid var(--border);display:flex;z-index:20;box-shadow:0 -4px 20px rgba(26,22,20,0.04);padding:10px 12px 18px;gap:4px}
.nav-btn{flex:1;padding:10px 0 9px;border:none;background:transparent;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--text-soft);font-size:10.5px;font-weight:500;border-radius:18px;transition:color 260ms var(--ease-swift),background 260ms var(--ease-swift),transform 220ms var(--ease-spring-soft);letter-spacing:-0.1px;font-family:'Geist',sans-serif}
.nav-btn:active{transform:scale(0.94)}
.nav-btn.active{background:var(--text);color:#fff;box-shadow:0 2px 4px rgba(26,22,20,0.14),0 12px 24px -8px rgba(26,22,20,0.38),inset 0 1px 0 rgba(255,255,255,0.12)}
.nav-btn.active .icon{animation:navPop 460ms var(--ease-spring)}
.nav-btn .icon{line-height:0;display:inline-flex;align-items:center;justify-content:center;transition:transform 260ms var(--ease-spring-soft)}
.nav-btn .icon svg{display:block;transition:stroke-width 220ms var(--ease-swift)}
.nav-btn.active .icon svg{stroke-width:2}
@keyframes navPop{0%{transform:scale(0.85) rotate(-8deg)}55%{transform:scale(1.18) rotate(4deg)}100%{transform:scale(1) rotate(0)}}

/* Sub Nav (horizontal pills under header) */
.sub-nav{display:flex;gap:8px;padding:14px 16px 4px;overflow-x:auto;scrollbar-width:none;position:sticky;top:0;z-index:9;background:rgba(255,255,255,0.9);backdrop-filter:saturate(180%) blur(10px);-webkit-backdrop-filter:saturate(180%) blur(10px)}
.sub-nav::-webkit-scrollbar{display:none}
.sub-nav-btn{flex-shrink:0;padding:9px 16px;border:1px solid var(--border);background:var(--card);color:var(--text-mid);border-radius:99px;font-size:13px;font-weight:500;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:color 220ms var(--ease-swift),background 240ms var(--ease-swift),border-color 240ms var(--ease-swift),transform 180ms var(--ease-spring-soft),box-shadow 240ms var(--ease-swift);letter-spacing:-0.1px;white-space:nowrap;font-family:'Geist',sans-serif}
.sub-nav-btn[hidden]{display:none !important}
.sub-nav-btn:active{transform:scale(0.96)}
.sub-nav-btn .icon{font-size:14px;line-height:1}
.sub-nav-btn.active{background:var(--text);color:#fff;border-color:var(--text);box-shadow:0 2px 4px rgba(26,22,20,0.12),0 10px 22px -8px rgba(26,22,20,0.32),inset 0 1px 0 rgba(255,255,255,0.12)}
.sub-nav-btn:hover:not(.active){border-color:var(--text);color:var(--text)}

/* Sections */
.section{padding:16px;display:none}
.section.active{display:block;animation:sectionIn 360ms var(--ease-out) both}
@keyframes sectionIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.meta{font-size:12px;color:var(--text-soft);padding:6px 0 10px;font-weight:500}

/* Cards — Bento 2.0 */
.card{background:var(--card);border-radius:var(--radius);overflow:hidden;margin-bottom:14px;box-shadow:var(--shadow);border:1px solid var(--border);padding:0;transition:transform 300ms var(--ease-spring-soft),box-shadow 300ms var(--ease-swift);animation:cardIn 420ms var(--ease-swift) both}
.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lift)}
.card:active{transform:translateY(0) scale(0.993)}
@keyframes cardIn{from{opacity:0;transform:translateY(10px) scale(0.985)}to{opacity:1;transform:translateY(0) scale(1)}}
.card[style*="--index"]{animation-delay:calc(var(--index,0) * 60ms)}
.card-body{padding:16px 18px 18px}
.card-title{font-weight:500;font-size:17px;color:var(--text);letter-spacing:-0.5px;font-feature-settings:"ss01","ss02"}
.card-sub{font-size:12px;color:var(--text-soft);margin-top:3px;font-weight:500;letter-spacing:-0.1px}

/* Badge */
.badge{display:inline-flex;align-items:center;font-size:11px;padding:3px 10px;border-radius:99px;font-weight:600;margin-top:6px;background:var(--green-light);color:var(--green-mid);letter-spacing:0.1px}

/* Buttons */
.btn{background:var(--text);color:#fff;border:none;border-radius:99px;padding:14px 30px;font-weight:500;cursor:pointer;font-size:14px;letter-spacing:-0.2px;transition:transform 220ms var(--ease-spring-soft),box-shadow 260ms var(--ease-swift),background 220ms var(--ease-swift);box-shadow:0 1px 2px rgba(26,22,20,0.1),0 10px 24px -8px rgba(26,22,20,0.32),inset 0 1px 0 rgba(255,255,255,0.12);position:relative;overflow:hidden;isolation:isolate}
.btn::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,0.14) 48%,transparent 66%);transform:translateX(-120%) skewX(-15deg);transition:transform 700ms var(--ease-swift);z-index:-1}
.btn:hover{background:var(--btn-primary-hover);transform:translateY(-1px);box-shadow:0 2px 4px rgba(26,22,20,0.12),0 16px 32px -10px rgba(26,22,20,0.38),inset 0 1px 0 rgba(255,255,255,0.14)}
.btn:hover::before{transform:translateX(260%) skewX(-15deg)}
.btn:active{transform:translateY(1px) scale(0.98)}
.btn-outline{background:transparent;color:var(--text);border:1.5px solid var(--border);border-radius:99px;padding:12px 28px;font-weight:600;cursor:pointer;font-size:14px;transition:transform 160ms var(--ease-out),background 200ms var(--ease-out),border-color 200ms var(--ease-out)}
.btn-outline:hover{border-color:var(--green);color:var(--green)}
.btn-outline:active{transform:scale(0.97);background:var(--lime-bright)}
.btn-sm{background:transparent;color:var(--text-mid);border:1.5px solid var(--border);border-radius:99px;padding:6px 14px;font-size:12px;cursor:pointer;font-weight:600;transition:transform 140ms var(--ease-out),color 200ms var(--ease-out),border-color 200ms var(--ease-out)}
.btn-sm:hover{color:var(--green);border-color:var(--green)}
.btn-sm:active{transform:scale(0.96)}
.btn-del{background:var(--danger-soft);color:var(--danger);border:1.5px solid transparent;border-radius:99px;padding:9px 16px;font-size:13px;cursor:pointer;font-weight:600;transition:transform 140ms var(--ease-out),background 200ms var(--ease-out)}
.btn-del:active{transform:scale(0.96)}
.btn-edit{background:var(--lime);color:var(--text);border:none;border-radius:99px;padding:9px 16px;font-size:13px;cursor:pointer;font-weight:600;transition:transform 140ms var(--ease-out),background 200ms var(--ease-out)}
.btn-edit:hover{background:var(--green-light)}
.btn-edit:active{transform:scale(0.96)}
.close-btn{background:var(--lime);border:none;border-radius:99px;width:34px;height:34px;font-size:15px;cursor:pointer;color:var(--text-mid);font-weight:500;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:transform 160ms var(--ease-out),background 200ms var(--ease-out)}
.close-btn:hover{background:var(--green-light);color:var(--green)}
.close-btn:active{transform:scale(0.92) rotate(90deg)}
.add{text-align:center;padding:4px 0 8px}
.empty{text-align:center;color:var(--text-soft);padding:40px 0;font-size:14px;line-height:2}

/* Search & Sort */
.search-row{display:flex;gap:8px;margin-bottom:10px}
.search-input{flex:1;padding:11px 16px;border-radius:99px;border:1.5px solid var(--border);font-size:16px;background:var(--card);color:var(--text);font-family:inherit;outline:none;transition:border-color 200ms var(--ease-out),box-shadow 200ms var(--ease-out)}
.search-input:focus{border-color:var(--green);box-shadow:0 0 0 4px rgba(244,180,166,0.22)}
.sort-btn{background:var(--card);border:1.5px solid var(--border);border-radius:99px;padding:11px 16px;font-size:13px;color:var(--text-mid);cursor:pointer;font-weight:600;white-space:nowrap;transition:transform 140ms var(--ease-out),background 200ms var(--ease-out),color 200ms var(--ease-out),border-color 200ms var(--ease-out)}
.sort-btn:active{transform:scale(0.96)}
.sort-btn.active{background:var(--text);color:#fff;border-color:var(--text)}

/* Filter */
.filter-row{display:flex;gap:8px;overflow-x:auto;padding:2px 0 12px;scrollbar-width:none}
.filter-row::-webkit-scrollbar{display:none}
.filter-btn{white-space:nowrap;padding:7px 16px;border-radius:99px;border:1.5px solid var(--border);background:var(--card);color:var(--text-mid);font-size:12px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:4px;transition:transform 140ms var(--ease-out),background 200ms var(--ease-out),color 200ms var(--ease-out),border-color 200ms var(--ease-out)}
.filter-btn:active{transform:scale(0.96)}
.filter-btn.active{background:var(--text);color:#fff;border-color:var(--text)}

/* Recipe card image */
.recipe-img{width:100%;height:200px;object-fit:cover;display:block;transition:transform 500ms var(--ease-out)}
.card:hover .recipe-img{transform:scale(1.03)}
.recipe-action-row{display:flex;gap:8px;margin-top:10px}
.recipe-action-row button{flex:1}

/* Modals */
.overlay{position:fixed;inset:0;background:rgba(26,22,20,0.42);z-index:130;display:none;align-items:flex-end;justify-content:center;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;transition:opacity 240ms var(--ease-out)}
.overlay.open{display:flex;opacity:1}
.modal{background:var(--card);border-radius:24px 24px 0 0;padding:24px 24px calc(24px + env(safe-area-inset-bottom));width:100%;max-width:480px;height:75svh;max-height:75svh;overflow-y:auto;-webkit-overflow-scrolling:touch;box-shadow:0 -8px 40px rgba(26,22,20,0.14);transform:translateY(100%);transition:transform 420ms cubic-bezier(0.32,0.72,0,1);overscroll-behavior:contain;contain:layout paint;will-change:transform}
@supports not (height:100svh){.modal{height:75vh;max-height:calc(100vh - 20px)}}
.modal-compact{height:auto;max-height:90svh;padding:20px 22px calc(22px + env(safe-area-inset-bottom))}
@supports not (height:100svh){.modal-compact{max-height:calc(100vh - 16px)}}
/* Input focus — padding am scroll so Feld nicht unter Keyboard rutscht */
.modal input,.modal textarea,.modal select{scroll-margin-block:120px}
.overlay.open .modal{transform:translateY(0)}

/* FormSheet — fullscreen create/edit mit sticky Save-Header */
.form-sheet-overlay{position:fixed;inset:0;background:rgba(26,22,20,0.42);z-index:110;display:none;align-items:stretch;justify-content:center;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;transition:opacity 260ms cubic-bezier(0.32,0.72,0,1)}
.form-sheet-overlay.open{display:flex;opacity:1}
.form-sheet{background:var(--card);width:100%;max-width:560px;height:100dvh;max-height:100dvh;display:flex;flex-direction:column;transform:translateY(100%);transition:transform 420ms cubic-bezier(0.32,0.72,0,1);overflow:hidden;contain:layout paint;will-change:transform;margin:0 auto}
@supports not (height:100dvh){.form-sheet{height:100vh;max-height:100vh}}
.form-sheet-overlay.open .form-sheet{transform:translateY(0)}
.form-sheet-header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:max(env(safe-area-inset-top),14px) 14px 12px;background:rgba(255,255,255,0.92);backdrop-filter:saturate(180%) blur(16px);-webkit-backdrop-filter:saturate(180%) blur(16px);border-bottom:1px solid var(--border);flex-shrink:0;position:relative;z-index:2}
.form-sheet-cancel{background:var(--lime-bright);border:1px solid var(--border);border-radius:99px;width:38px;height:38px;cursor:pointer;color:var(--text-mid);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 160ms ease,color 160ms ease,transform 140ms var(--ease-spring-soft);font-family:inherit}
.form-sheet-cancel:hover{background:var(--lime);color:var(--text)}
.form-sheet-cancel:active{transform:scale(0.9)}
.form-sheet-title{font-size:16px;font-weight:500;color:var(--text);letter-spacing:-0.3px;flex:1;text-align:center;font-family:'Geist',sans-serif;font-feature-settings:"ss01","ss02";overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 4px}
.form-sheet-save{background:var(--text);color:#fff;border:none;border-radius:99px;padding:9px 18px;font-size:13px;font-weight:500;cursor:pointer;letter-spacing:-0.2px;font-family:'Geist',sans-serif;box-shadow:0 1px 2px rgba(26,22,20,0.1),0 6px 16px -6px rgba(26,22,20,0.32);transition:transform 160ms var(--ease-out),opacity 200ms ease,background 200ms ease;flex-shrink:0;min-width:82px;height:38px;display:inline-flex;align-items:center;justify-content:center}
.form-sheet-save:hover{background:var(--btn-primary-hover)}
.form-sheet-save:active{transform:scale(0.95)}
.form-sheet-save:disabled{opacity:0.35;cursor:not-allowed}
.form-sheet-body{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:18px 20px calc(env(safe-area-inset-bottom) + 50px);scroll-padding-block:120px}
.form-sheet-body input,.form-sheet-body textarea,.form-sheet-body select{scroll-margin-block:120px}
.form-sheet-body label{display:block;font-size:12px;font-weight:500;color:var(--text-mid);margin:16px 0 6px;letter-spacing:-0.1px}
.form-sheet-body label:first-child,.form-sheet-body > div:first-child > label:first-child{margin-top:0}
.form-sheet-body input,.form-sheet-body textarea,.form-sheet-body select{width:100%;padding:13px 16px;border-radius:14px;border:1.5px solid var(--border);font-size:15px;background:var(--lime-bright);color:var(--text);font-family:inherit;outline:none;transition:border-color 200ms var(--ease-swift),background 200ms var(--ease-swift),box-shadow 200ms var(--ease-swift)}
.form-sheet-body input:focus,.form-sheet-body textarea:focus,.form-sheet-body select:focus{border-color:var(--text);background:var(--card);box-shadow:0 0 0 4px rgba(26,22,20,0.06)}
.form-sheet-body textarea{min-height:90px;resize:vertical}
.form-sheet-section{margin-top:24px;padding-top:22px;border-top:1px solid var(--border)}
.form-sheet-section-title{font-size:10px;font-weight:500;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.4px;font-family:'Geist Mono',ui-monospace,monospace;margin:0 0 4px}
.form-sheet-section-sub{font-size:12px;color:var(--text-soft);font-weight:500;letter-spacing:-0.1px;margin-bottom:10px}
.form-sheet-body .nw-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}
.form-sheet-body .nw-item label{margin-top:0;margin-bottom:5px}
.form-sheet-body .prio-select-row,.form-sheet-body .period-select-row{display:flex;gap:8px;margin-top:4px}
.form-sheet-body .prio-opt,.form-sheet-body .period-opt{flex:1;padding:12px 0;border:1.5px solid var(--border);background:var(--card);border-radius:12px;cursor:pointer;font-size:13px;font-weight:500;color:var(--text-mid);text-align:center;transition:background 180ms var(--ease-swift),color 180ms var(--ease-swift),border-color 180ms var(--ease-swift);font-family:inherit}
.form-sheet-body .prio-opt:active,.form-sheet-body .period-opt:active{transform:scale(0.97)}
.form-sheet-body .img-upload-area{background:var(--lime-bright);border:2px dashed var(--border);border-radius:14px;height:140px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;color:var(--text-soft);font-size:13px;gap:6px;overflow:hidden;transition:border-color 200ms ease;margin-top:6px}
.form-sheet-body .img-upload-area:hover{border-color:var(--text)}
.modal-handle{width:40px;height:4px;background:var(--border);border-radius:99px;margin:0 auto 20px}
.modal h2{font-size:20px;font-weight:700;color:var(--text);margin-bottom:18px;letter-spacing:-0.5px}
label{display:block;font-size:13px;font-weight:500;color:var(--text-mid);margin:14px 0 5px;letter-spacing:-0.1px}
input,select,textarea{width:100%;padding:12px 14px;border-radius:12px;border:1.5px solid var(--border);font-size:15px;background:var(--card);color:var(--text);font-family:inherit;outline:none;transition:border-color 200ms var(--ease-out),box-shadow 200ms var(--ease-out)}
input:focus,select:focus,textarea:focus{border-color:var(--green);box-shadow:0 0 0 4px rgba(244,180,166,0.22)}
textarea{min-height:90px;resize:vertical}
.mbtns{display:flex;gap:10px;margin-top:20px}
.mbtns .btn,.mbtns .btn-outline{flex:1;padding:13px 0;text-align:center}
.cat-row{display:flex;gap:8px}
.cat-row input{flex:1}
.nw-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}
.nw-item label{margin-top:0;margin-bottom:5px}
.nw-view-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.nw-view-item{background:var(--lime-bright);border-radius:12px;padding:12px 8px;text-align:center}
.img-upload-area{width:100%;height:150px;background:var(--bg);border:2px dashed var(--border);border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;margin-top:6px;color:var(--text-soft);font-size:13px;gap:6px;overflow:hidden;transition:border-color 0.2s}
.img-upload-area:hover{border-color:var(--green-light)}

/* Progress */
.ttime{font-size:32px;font-weight:800;margin-top:4px;letter-spacing:-1px}
.tbar{background:var(--lime-bright);border-radius:99px;height:6px;overflow:hidden;margin-top:12px}
.tfill{height:100%;border-radius:99px;transition:width 0.5s}
.ttotal{font-size:11px;color:var(--text-soft);margin-top:6px}
.pbar{margin-top:10px}
.plabel{display:flex;justify-content:space-between;font-size:12px;color:var(--text-soft);margin-bottom:4px;font-weight:500}
.ptrack{background:var(--lime-bright);border-radius:99px;height:6px;overflow:hidden}
.pfill{height:100%;border-radius:99px}

/* Shop */
.shop-hero{background:transparent;border-radius:var(--radius-lg);padding:22px 22px 20px;color:#fff;margin-bottom:16px;box-shadow:0 2px 4px rgba(26,22,20,0.08),0 24px 48px -20px rgba(26,22,20,0.32),inset 0 1px 0 rgba(255,255,255,0.08);position:relative;overflow:hidden}
.shop-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,0.08) 48%,transparent 66%);pointer-events:none;animation:shineSweep 6s var(--ease-in-out) infinite;z-index:1}
.shop-hero::after{content:"";position:absolute;top:-60%;right:-20%;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(255,198,79,0.24) 0%,transparent 70%);pointer-events:none}
.shop-hero-top{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:12px;position:relative;z-index:1}
.shop-hero-title{font-size:11px;font-weight:600;opacity:0.75;letter-spacing:1.2px;text-transform:uppercase}
.shop-hero-count{font-size:34px;font-weight:500;line-height:1;margin-top:8px;letter-spacing:-1.4px;font-family:'Geist',sans-serif;font-feature-settings:"ss01"}
.shop-hero-count small{font-size:12px;font-weight:500;opacity:0.6;margin-left:8px;letter-spacing:-0.2px}
.shop-hero-pct{font-size:24px;font-weight:500;letter-spacing:-0.8px;color:var(--accent);font-variant-numeric:tabular-nums}
.shop-progress{background:rgba(255,255,255,0.14);border-radius:99px;height:6px;overflow:hidden;position:relative;z-index:1}
.shop-progress-fill{height:100%;background:linear-gradient(90deg,var(--green-light) 0%,var(--accent) 100%);border-radius:99px;transition:width 700ms var(--ease-swift);box-shadow:0 0 16px rgba(255,198,79,0.6);position:relative}
.shop-progress-fill::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.45),transparent);background-size:200% 100%;animation:shimmerMove 2.2s linear infinite}
.shop-add-row{display:flex;gap:8px;margin-bottom:18px}
.shop-add-input{flex:1;padding:13px 18px;border-radius:99px;border:1.5px solid var(--border);font-size:16px;background:var(--card);color:var(--text);font-family:inherit;outline:none;transition:border-color 200ms var(--ease-out),box-shadow 200ms var(--ease-out)}
.shop-add-input:focus{border-color:var(--green);box-shadow:0 0 0 4px rgba(244,180,166,0.22)}
.shop-add-btn{background:var(--text);color:#fff;border:none;border-radius:99px;width:46px;height:46px;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(26,22,20,0.22);transition:transform 160ms var(--ease-out),box-shadow 200ms var(--ease-out)}
.shop-add-btn:active{transform:scale(0.92)}
.shop-scan-btn{background:var(--card);color:var(--text);border:1.5px solid var(--border);border-radius:99px;width:46px;height:46px;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:transform 160ms var(--ease-out),border-color 200ms var(--ease-out),color 200ms var(--ease-out),background 200ms var(--ease-out)}
.shop-scan-btn:hover{border-color:var(--text);background:var(--lime-bright)}
.shop-scan-btn:active{transform:scale(0.92)}

/* Scanner FULLSCREEN */
.scan-fullscreen{position:fixed;inset:0;background:#000;z-index:200;display:none;overflow:hidden}
.scan-fullscreen.open{display:block}
.scan-fullscreen #scan-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
#scan-container{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;background:#000}
#scan-container video,#scan-container canvas{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover!important;display:block}
#scan-container canvas.drawingBuffer{z-index:1}
.scan-bottom-bar{position:absolute;left:0;right:0;bottom:0;padding:20px 20px calc(env(safe-area-inset-bottom) + 30px);display:flex;flex-direction:column;align-items:center;gap:10px;pointer-events:auto}
.scan-capture{width:72px;height:72px;border-radius:50%;border:none;background:transparent;cursor:pointer;position:relative;display:flex;align-items:center;justify-content:center;padding:0;transition:transform 160ms var(--ease-spring-soft)}
.scan-capture:active{transform:scale(0.88)}
.scan-capture-ring{position:absolute;inset:0;border:4px solid #fff;border-radius:50%;opacity:0.9}
.scan-capture-dot{width:54px;height:54px;border-radius:50%;background:var(--card);transition:background 180ms var(--ease-swift),transform 160ms var(--ease-swift)}
.scan-capture:active .scan-capture-dot{background:var(--accent);transform:scale(0.85)}
.scan-bottom-hint{color:rgba(255,255,255,0.75);font-size:11px;font-weight:500;letter-spacing:-0.1px;text-align:center;max-width:80%}
.scan-overlay-ui{position:absolute;inset:0;display:flex;flex-direction:column;pointer-events:none}
.scan-top-bar{display:flex;align-items:center;justify-content:space-between;padding:max(env(safe-area-inset-top),14px) 20px 14px;background:linear-gradient(180deg,rgba(0,0,0,0.6) 0%,transparent 100%);pointer-events:auto}
.scan-close{background:rgba(255,255,255,0.14);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:none;border-radius:99px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;transition:transform 160ms var(--ease-spring-soft),background 200ms var(--ease-swift)}
.scan-close:hover{background:rgba(255,255,255,0.22)}
.scan-close:active{transform:scale(0.92)}
.scan-torch{background:rgba(255,255,255,0.14);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:none;border-radius:99px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;transition:transform 160ms var(--ease-spring-soft),background 200ms var(--ease-swift)}
.scan-torch:hover{background:rgba(255,255,255,0.22)}
.scan-torch:active{transform:scale(0.92)}
.scan-torch.on{background:var(--accent);color:var(--text)}
.scan-title{color:#fff;font-size:15px;font-weight:500;letter-spacing:-0.3px;font-family:'Geist',sans-serif}
.scan-frame-big{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:85vw;max-width:420px;height:min(55vh,320px);border-radius:24px;box-shadow:0 0 0 9999px rgba(0,0,0,0.55);pointer-events:none}
.scan-frame-big::before,.scan-frame-big::after,.scan-frame-big>span::before,.scan-frame-big>span::after{content:"";position:absolute;width:32px;height:32px;border:3px solid var(--accent);border-radius:6px}
.scan-frame-big::before{top:-2px;left:-2px;border-right:none;border-bottom:none}
.scan-frame-big::after{top:-2px;right:-2px;border-left:none;border-bottom:none}
.scan-frame-big>span{position:absolute;inset:0;pointer-events:none}
.scan-frame-big>span::before{bottom:-2px;left:-2px;border-right:none;border-top:none}
.scan-frame-big>span::after{bottom:-2px;right:-2px;border-left:none;border-top:none}
.scan-laser-big{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:85vw;max-width:420px;height:min(55vh,320px);pointer-events:none}
.scan-laser-big::before{content:"";position:absolute;left:12px;right:12px;height:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);box-shadow:0 0 16px var(--accent);animation:scanLaserBig 2s var(--ease-in-out) infinite}
@keyframes scanLaserBig{0%{top:10%;opacity:0.3}50%{opacity:1}100%{top:90%;opacity:0.3}}
.scan-hint{position:absolute;bottom:calc(env(safe-area-inset-bottom) + 140px);left:0;right:0;text-align:center;color:#fff;font-size:13px;font-weight:500;letter-spacing:-0.1px;padding:0 30px;opacity:0.9;font-family:'Geist',sans-serif}
.scan-hint.err{color:var(--danger)}
.scan-hint.ok{color:var(--accent)}

/* Old viewport (behalten für kompatibilität falls referenziert) */
.scan-viewport{position:relative;width:100%;aspect-ratio:4/3;border-radius:18px;overflow:hidden;background:#000}

/* Product card */
.prod-img{width:100%;height:180px;object-fit:contain;background:var(--lime-bright);border-radius:18px;margin-bottom:14px;border:1px solid var(--border)}
.prod-title{font-size:19px;font-weight:500;color:var(--text);letter-spacing:-0.5px;line-height:1.2;margin-bottom:4px}
.prod-brand{font-size:12px;color:var(--text-soft);font-weight:500;letter-spacing:-0.1px;margin-bottom:12px;font-family:'Geist Mono',ui-monospace,monospace;text-transform:uppercase}
.prod-nutri-label{font-size:10px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.2px;font-weight:500;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:10px}
.prod-nutri-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:14px}
.prod-nutri{background:var(--lime-bright);border:1px solid var(--border);border-radius:14px;padding:12px 14px}
.prod-nutri-name{font-size:11px;color:var(--text-soft);font-weight:500;letter-spacing:-0.1px;margin-bottom:4px}
.prod-nutri-val{font-size:20px;font-weight:500;color:var(--text);letter-spacing:-0.5px;font-variant-numeric:tabular-nums;font-feature-settings:"ss01"}
.prod-nutri-val small{font-size:11px;color:var(--text-soft);font-weight:500;margin-left:2px}
.prod-nutri.hero{grid-column:1 / -1;background:transparent;border-color:transparent;color:#fff;box-shadow:0 2px 4px rgba(26,22,20,0.08),0 14px 28px -10px rgba(26,22,20,0.24),inset 0 1px 0 rgba(255,255,255,0.08)}
.prod-nutri.hero .prod-nutri-name{color:rgba(255,255,255,0.7)}
.prod-nutri.hero .prod-nutri-val{color:#fff;font-size:28px}
.prod-nutri.hero .prod-nutri-val small{color:var(--accent)}
.prod-score{display:inline-flex;align-items:center;gap:6px;background:var(--lime);color:var(--text);padding:4px 10px;border-radius:99px;font-size:11px;font-weight:600;letter-spacing:-0.1px;margin-bottom:14px}
.prod-score.a{background:#D4EDDA;color:#155724}
.prod-score.b{background:#D1ECF1;color:#0C5460}
.prod-score.c{background:var(--accent-soft);color:var(--accent-text)}
.prod-score.d{background:#FFE0B2;color:#8B4500}
.prod-score.e{background:var(--danger-soft);color:var(--danger)}

.prod-empty{text-align:center;padding:32px 20px}
.prod-empty-icon{font-size:40px;margin-bottom:12px;opacity:0.5}
.prod-empty-title{font-size:16px;font-weight:500;color:var(--text);letter-spacing:-0.3px;margin-bottom:6px}
.prod-empty-sub{font-size:13px;color:var(--text-mid);font-weight:500;line-height:1.5;margin-bottom:18px}
.shop-section-title{font-size:11px;font-weight:600;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.2px;margin:18px 0 10px;display:flex;align-items:center;gap:8px}
.shop-section-title span{background:var(--lime);color:var(--text);padding:2px 10px;border-radius:99px;font-size:10px;font-weight:600}
.shop-list{background:var(--card);border-radius:16px;border:1px solid var(--border);overflow:hidden;box-shadow:var(--shadow)}
.shop-item{display:flex;align-items:center;gap:14px;padding:14px 16px;border-bottom:1px solid var(--border);transition:background 200ms var(--ease-out);animation:rowIn 380ms var(--ease-swift) both;animation-delay:calc(var(--index,0) * 40ms)}
@keyframes rowIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
.shop-item:last-child{border-bottom:none}
.shop-item:active{background:var(--lime-bright)}
.shop-item.done{background:var(--lime-bright)}
.shop-check{width:24px;height:24px;border-radius:50%;border:1.5px solid var(--border);appearance:none;cursor:pointer;flex-shrink:0;position:relative;background:var(--card);transition:background 200ms var(--ease-out),border-color 200ms var(--ease-out),transform 220ms var(--ease-spring)}
.shop-check:hover{border-color:var(--green)}
.shop-check:checked{background:var(--green);border-color:var(--green);transform:scale(1.08)}
.shop-check:checked::after{content:"";position:absolute;top:50%;left:50%;width:9px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;border-bottom-left-radius:1px;transform:translate(-55%,-70%) rotate(-45deg)}
@keyframes checkPop{0%{transform:translate(-50%,-50%) scale(0);opacity:0}70%{transform:translate(-50%,-50%) scale(1.2);opacity:1}100%{transform:translate(-50%,-50%) scale(1);opacity:1}}
.shop-text{flex:1;font-size:15px;color:var(--text);font-weight:500;transition:color 200ms var(--ease-out),text-decoration-color 200ms var(--ease-out)}
.shop-text.done{text-decoration:line-through;color:var(--text-soft);font-weight:400}
.shop-source{font-size:10px;color:var(--text);margin-left:8px;background:var(--lime);padding:3px 9px;border-radius:99px;font-weight:600;letter-spacing:0.2px;vertical-align:middle}
.shop-del{background:none;border:none;color:var(--text-soft);cursor:pointer;font-size:18px;line-height:1;padding:6px;border-radius:99px;transition:background 180ms var(--ease-out),color 180ms var(--ease-out),transform 160ms var(--ease-out)}
.shop-del:hover{background:var(--danger-soft);color:var(--danger)}
.shop-del:active{transform:scale(0.9)}
.shop-empty{text-align:center;padding:48px 20px;color:var(--text-soft)}
.shop-empty-icon{font-size:42px;margin-bottom:8px;opacity:0.5}
.shop-clear{background:transparent;color:var(--text-soft);border:none;font-size:12px;font-weight:600;cursor:pointer;padding:4px 8px;text-decoration:underline;text-underline-offset:2px;transition:color 180ms var(--ease-out)}
.shop-clear:hover{color:var(--green)}

/* KI Chat */
#tab-ki{display:none;flex-direction:column;height:calc(100dvh - 200px);padding:0}
#tab-ki.active{display:flex}
@supports not (height:100dvh){#tab-ki{height:calc(100vh - 200px)}}
.chat-msgs{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px}
.msg{max-width:82%;padding:12px 16px;border-radius:20px;font-size:14px;line-height:1.6;white-space:pre-wrap}
.msg{animation:msgIn 320ms var(--ease-out) both}
@keyframes msgIn{from{opacity:0;transform:translateY(6px) scale(0.98)}to{opacity:1;transform:translateY(0) scale(1)}}
.msg-user{background:var(--text);color:#fff;border-radius:20px 20px 4px 20px;align-self:flex-end;font-weight:500}
.msg-ai{background:var(--card);color:var(--text);border-radius:20px 20px 20px 4px;align-self:flex-start;box-shadow:var(--shadow);border:1px solid var(--border)}
.msg-ai.typing{color:var(--text-soft);font-style:italic}
.chat-recipe-card{background:var(--card);border-radius:20px 20px 20px 4px;border:1px solid var(--border);box-shadow:var(--shadow);padding:18px;max-width:92%;align-self:flex-start;width:92%}
.chat-add-btn{background:var(--text);color:#fff;border:none;border-radius:12px;padding:12px 16px;font-size:14px;font-weight:600;cursor:pointer;margin-top:12px;width:100%;letter-spacing:-0.1px;transition:transform 160ms var(--ease-out),background 200ms var(--ease-out)}
.chat-add-btn:active{transform:scale(0.97)}
.chat-input-row{padding:10px 14px 14px;background:rgba(255,255,255,0.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--border);display:flex;gap:6px;align-items:center}
.chat-cam-btn{background:transparent;border:none;width:36px;height:36px;font-size:17px;cursor:pointer;color:var(--text-soft);display:flex;align-items:center;justify-content:center;border-radius:10px;flex-shrink:0;transition:background 200ms var(--ease-out),color 200ms var(--ease-out),transform 140ms var(--ease-out)}
.chat-cam-btn:hover{background:var(--lime);color:var(--green)}
.chat-cam-btn:active{transform:scale(0.92)}
.chat-input{flex:1;padding:10px 14px;border-radius:14px;border:1px solid var(--border);font-size:16px;background:var(--lime-bright);color:var(--text);font-family:inherit;resize:none;max-height:100px;outline:none;line-height:1.4;transition:border-color 200ms var(--ease-out),background 200ms var(--ease-out),box-shadow 200ms var(--ease-out)}
.chat-input:focus{border-color:var(--green);background:var(--card);box-shadow:0 0 0 4px rgba(244,180,166,0.2)}
.chat-send{background:var(--text);color:#fff;border:none;border-radius:12px;width:36px;height:36px;font-size:14px;font-weight:500;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:transform 140ms var(--ease-out),background 200ms var(--ease-out),opacity 200ms var(--ease-out)}
.chat-send:active{transform:scale(0.9)}
.chat-send:disabled{opacity:0.3;cursor:not-allowed}
.ki-key-banner{background:var(--card);border-bottom:1px solid var(--border);padding:12px 16px;display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-soft)}
.ki-key-banner input{flex:1;padding:8px 12px;font-size:13px;margin:0;border-radius:10px}

/* PDF */
.pdf-drop{border:2px dashed var(--green-light);border-radius:16px;padding:28px 24px;text-align:center;cursor:pointer;background:var(--lime-bright);margin-bottom:14px;transition:background 200ms ease,border-color 200ms ease}
.pdf-drop:hover{border-color:var(--green);background:var(--lime)}
.prog-bar{background:var(--lime-bright);border-radius:99px;height:8px;overflow:hidden;margin-top:12px}
.prog-fill{height:100%;background:var(--green);border-radius:99px;transition:width 0.3s}

/* Crop */
.crop-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.92);z-index:200;display:none;flex-direction:column;align-items:center;justify-content:center;padding:20px}
.crop-overlay.open{display:flex}
.crop-container{position:relative;max-width:100%;cursor:crosshair;user-select:none;border-radius:14px;overflow:hidden;box-shadow:0 0 0 2px var(--green-light)}
.crop-container img{display:block;max-width:100%;max-height:50vh;user-select:none;pointer-events:none}
.crop-sel{position:absolute;border:2px solid var(--green-light);box-shadow:0 0 0 9999px rgba(0,0,0,0.55);cursor:move;display:none}
.crop-handle{position:absolute;width:18px;height:18px;background:var(--green-light);border-radius:4px;box-shadow:0 1px 4px rgba(0,0,0,0.3)}
.ch-tl{top:-9px;left:-9px;cursor:nw-resize}
.ch-tr{top:-9px;right:-9px;cursor:ne-resize}
.ch-bl{bottom:-9px;left:-9px;cursor:sw-resize}
.ch-br{bottom:-9px;right:-9px;cursor:se-resize}
.crop-actions{display:flex;gap:12px;margin-top:18px;width:100%;max-width:380px}
.crop-actions button{flex:1;padding:14px 0;font-size:15px;font-weight:700;border-radius:99px;cursor:pointer;border:none}

/* View img */
.view-img{width:100%;height:220px;object-fit:cover;border-radius:0;margin-bottom:0}

/* Timer card */
.timer-card{background:var(--card);border-radius:var(--radius);overflow:hidden;margin-bottom:14px;box-shadow:var(--shadow);border:1px solid var(--border)}
.timer-card-inner{padding:16px}

/* Tasks */
.task-hero{background:transparent;border-radius:var(--radius-lg);padding:22px 22px 20px;color:#fff;margin-bottom:16px;box-shadow:0 2px 4px rgba(26,22,20,0.08),0 24px 48px -20px rgba(26,22,20,0.32),inset 0 1px 0 rgba(255,255,255,0.08);position:relative;overflow:hidden}
.task-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,0.08) 48%,transparent 66%);pointer-events:none;animation:shineSweep 7s var(--ease-in-out) infinite;z-index:1}
.task-hero::after{content:"";position:absolute;top:-50%;right:-15%;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(255,198,79,0.28) 0%,transparent 70%);pointer-events:none}
.task-hero-top{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:12px;position:relative;z-index:2}
.task-hero-title{font-size:10px;font-weight:500;opacity:0.72;letter-spacing:1.4px;text-transform:uppercase;font-family:'Geist Mono',ui-monospace,monospace}
.task-hero-count{font-size:34px;font-weight:500;line-height:1;margin-top:8px;letter-spacing:-1.4px;font-feature-settings:"ss01"}
.task-hero-count small{font-size:12px;font-weight:500;opacity:0.6;margin-left:8px;letter-spacing:-0.2px}
.task-hero-pct{font-size:24px;font-weight:500;letter-spacing:-0.8px;color:var(--accent);font-variant-numeric:tabular-nums}
.task-progress{background:rgba(255,255,255,0.14);border-radius:99px;height:6px;overflow:hidden;position:relative;z-index:2}
.task-progress-fill{height:100%;background:linear-gradient(90deg,var(--green-light) 0%,var(--accent) 100%);border-radius:99px;transition:width 700ms var(--ease-swift);box-shadow:0 0 16px rgba(255,198,79,0.6);position:relative}
.task-progress-fill::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.45),transparent);background-size:200% 100%;animation:shimmerMove 2.2s linear infinite}
.period-tabs{display:flex;gap:4px;background:var(--lime-bright);border:1px solid var(--border);border-radius:99px;padding:4px;margin-bottom:16px}
.period-tab{flex:1;padding:9px 0;border:none;background:transparent;cursor:pointer;font-size:13px;font-weight:600;color:var(--text-mid);border-radius:99px;transition:color 200ms var(--ease-out),background 200ms var(--ease-out),transform 140ms var(--ease-out);letter-spacing:-0.1px}
.period-tab:active{transform:scale(0.97)}
.period-tab.active{background:var(--card);color:var(--text);box-shadow:0 1px 3px rgba(26,22,20,0.08),0 2px 8px rgba(26,22,20,0.06)}
.t-time-row{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:stretch}
.t-time-field{display:flex;flex-direction:column;gap:4px;background:var(--lime-bright);border:1.5px solid var(--border);border-radius:14px;padding:8px 12px;transition:border-color 200ms var(--ease-swift)}
.t-time-field:focus-within{border-color:var(--text);background:var(--card)}
.t-time-lbl{font-size:10px;letter-spacing:0.8px;text-transform:uppercase;color:var(--text-soft);font-family:'Geist Mono',ui-monospace,monospace;font-weight:600}
.t-time-field input[type="time"]{background:transparent;border:none;outline:none;font-family:inherit;font-size:16px;font-weight:500;color:var(--text);padding:0;font-variant-numeric:tabular-nums;letter-spacing:-0.3px;width:100%}
.t-time-sep{display:flex;align-items:center;color:var(--text-soft);font-size:18px;font-weight:400;user-select:none}
:root[data-theme="dark"] .t-time-field{background:transparent;border-color:var(--momo-sand)}
:root[data-theme="dark"] .t-time-field:focus-within{border-color:var(--momo-cream);background:rgba(247,242,234,0.04)}

/* Timeline Tagesansicht — Karten bleiben natürlich, Dauer = Peach-Hairline in der Zeitspalte */
.task-timeline{position:relative;padding-left:56px;margin-bottom:18px}
.tl-row{position:relative;margin-bottom:10px;min-height:var(--row-h,auto);transition:opacity 220ms var(--ease-swift)}
.tl-time{position:absolute;left:-56px;top:0;width:44px;display:flex;flex-direction:column;align-items:flex-end;padding:14px 0 0;font-family:'Geist Mono',ui-monospace,monospace;font-variant-numeric:tabular-nums;letter-spacing:-0.2px;pointer-events:none}
.tl-time-top{font-size:13px;font-weight:600;color:var(--text);line-height:1}
.tl-dur{width:2px;border-radius:2px;background:var(--momo-peach);height:var(--dur-h,0);margin:6px 5px 6px 0;align-self:flex-end;transition:background 240ms var(--ease-swift)}
.tl-time-end{font-size:10.5px;font-weight:500;color:var(--text-soft);line-height:1;opacity:0.7}
.tl-row.past{opacity:0.48}
.tl-row.past .tl-time-top{font-weight:500;color:var(--text-soft)}
.tl-row.past .tl-dur{background:var(--border)}
.tl-gap{height:var(--gap-h,16px);pointer-events:none}
.tl-now-row{position:relative;display:flex;align-items:center;margin:2px 0;height:14px}
.tl-now-row::before{content:"";position:absolute;left:-8px;top:50%;width:6px;height:6px;border-radius:50%;background:var(--momo-peach);box-shadow:0 0 0 3px rgba(244,180,166,0.2);transform:translateY(-50%);z-index:2;animation:tl-pulse 2.4s ease-out infinite}
.tl-now-time{position:absolute;left:-56px;top:50%;transform:translateY(-50%);font-size:10.5px;font-weight:600;color:var(--momo-peach);font-family:'Geist Mono',ui-monospace,monospace;letter-spacing:-0.2px;font-variant-numeric:tabular-nums;width:40px;text-align:right}
.tl-now-line{flex:1;height:1px;background:linear-gradient(to right,rgba(209,75,95,0.4),rgba(209,75,95,0.05) 92%,transparent);margin-left:4px}
@keyframes tl-pulse{0%,100%{box-shadow:0 0 0 3px rgba(209,75,95,0.14)}50%{box-shadow:0 0 0 5px rgba(209,75,95,0.06)}}
@media (prefers-reduced-motion:reduce){.tl-now-row::before{animation:none}}

.task-sort-bar{display:inline-flex;gap:4px;padding:3px;background:var(--lime-bright);border:1px solid var(--border);border-radius:99px;margin:0 0 14px}
.task-sort-chip{padding:7px 14px;border-radius:99px;background:transparent;border:none;font-family:inherit;font-size:12px;font-weight:600;color:var(--text-soft);letter-spacing:-0.1px;cursor:pointer;display:inline-flex;align-items:center;transition:background 220ms var(--ease-swift),color 220ms var(--ease-swift)}
.task-sort-chip.active{background:var(--text);color:#fff}
.task-sort-chip:active{transform:scale(0.96)}
:root[data-theme="dark"] .task-sort-bar{background:transparent;border-color:var(--momo-sand)}
:root[data-theme="dark"] .task-sort-chip.active{background:var(--momo-cream);color:var(--momo-charcoal)}
.task-group{margin-bottom:18px}
.task-group-head{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-size:11px;font-weight:600;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.2px}
.task-group-head .dot{width:8px;height:8px;border-radius:99px;flex-shrink:0}
.task-group-head .count{background:var(--lime);color:var(--text);padding:2px 10px;border-radius:99px;font-size:10px;margin-left:auto;font-weight:600}
.task-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:14px 16px;margin-bottom:10px;box-shadow:var(--shadow);display:flex;gap:12px;align-items:flex-start;transition:transform 220ms var(--ease-out),box-shadow 220ms var(--ease-out),opacity 300ms var(--ease-out);position:relative;overflow:hidden;animation:rowIn 360ms var(--ease-out) both}
.task-card:hover{transform:translateY(-1px);box-shadow:0 2px 6px rgba(26,22,20,0.06),0 8px 24px rgba(26,22,20,0.06)}
.task-card:active{transform:scale(0.99)}
.task-card.done{opacity:0.55;background:var(--lime-bright)}
.task-card.p-hoch::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--danger)}
.task-card.p-mittel::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--accent)}
.task-card.p-niedrig::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--green)}
.task-check{width:24px;height:24px;border-radius:50%;border:1.5px solid var(--border);appearance:none;cursor:pointer;flex-shrink:0;position:relative;background:var(--card);transition:background 220ms var(--ease-out),border-color 220ms var(--ease-out),transform 260ms var(--ease-spring);margin-top:1px}
.task-check:hover{border-color:var(--green)}
.task-check:checked{background:var(--green);border-color:var(--green);transform:scale(1.08)}
.task-check:checked::after{content:"";position:absolute;top:50%;left:50%;width:9px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;border-bottom-left-radius:1px;transform:translate(-55%,-70%) rotate(-45deg)}
.task-body{flex:1;min-width:0}
.task-title{font-size:15px;font-weight:500;color:var(--text);line-height:1.4;word-break:break-word;letter-spacing:-0.2px;transition:color 240ms var(--ease-out)}
.task-title.done{text-decoration:line-through;color:var(--text-soft);font-weight:400}
.task-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;align-items:center}
.task-badge{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;padding:3px 9px;border-radius:99px;letter-spacing:0.1px}
.task-badge-prio-hoch{background:var(--danger-soft);color:var(--danger)}
.task-badge-prio-mittel{background:var(--accent-soft);color:var(--accent-text)}
.task-badge-prio-niedrig{background:var(--green-light);color:var(--text)}
.task-badge-due{background:var(--lime);color:var(--text)}
.task-badge-due.overdue{background:var(--danger-soft);color:var(--danger)}
.task-badge-timer{background:var(--lime-bright);color:var(--text-mid);font-variant-numeric:tabular-nums}
.task-badge-timer.active{background:var(--green);color:#fff;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(244,180,166,0.55)}50%{box-shadow:0 0 0 6px rgba(244,180,166,0)}}
.task-actions{display:flex;gap:6px;margin-top:10px}
.task-mini-btn{background:var(--lime);color:var(--text);border:none;border-radius:99px;padding:6px 12px;font-size:12px;font-weight:600;cursor:pointer;transition:background 200ms var(--ease-out),transform 140ms var(--ease-out)}
.task-mini-btn:hover{background:var(--green-light)}
.task-mini-btn:active{transform:scale(0.96)}
.task-mini-btn.danger{background:var(--danger-soft);color:var(--danger)}
.task-mini-btn.danger:hover{background:#F5D3DA}
.task-right{display:flex;align-items:center;gap:4px;margin-left:auto;flex-shrink:0;align-self:center}
.task-icon-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:10px;color:var(--text-soft);cursor:pointer;transition:background 160ms var(--ease-out),color 160ms var(--ease-out),transform 140ms var(--ease-out)}
.task-icon-btn:hover{background:var(--lime);color:var(--text)}
.task-icon-btn:active{transform:scale(0.92)}
.task-icon-btn.danger:hover{background:var(--danger-soft);color:var(--danger)}
.task-add-fab{position:fixed;bottom:calc(env(safe-area-inset-bottom) + 110px);right:max(20px,calc(50% - 220px));width:56px;height:56px;border-radius:50%;background:var(--text);color:#fff;border:none;font-size:26px;font-weight:300;cursor:pointer;box-shadow:0 8px 24px rgba(26,22,20,0.25);z-index:15;display:flex;align-items:center;justify-content:center;transition:transform 200ms var(--ease-spring-soft),box-shadow 200ms var(--ease-swift)}
.task-add-fab:hover{box-shadow:0 10px 28px rgba(26,22,20,0.32)}
.task-add-fab:active{transform:scale(0.9)}
.prio-select-row{display:flex;gap:8px;margin-top:4px}
.prio-opt{flex:1;padding:10px 0;border:1.5px solid var(--border);background:var(--card);border-radius:12px;cursor:pointer;font-size:13px;font-weight:500;color:var(--text-mid);text-align:center;transition:transform 140ms var(--ease-out),background 200ms var(--ease-out),border-color 200ms var(--ease-out),color 200ms var(--ease-out)}
.prio-opt:active{transform:scale(0.97)}
.prio-opt.sel[data-p="hoch"]{background:var(--danger-soft);border-color:var(--danger);color:var(--danger)}
.prio-opt.sel[data-p="mittel"]{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-text)}
.prio-opt.sel[data-p="niedrig"]{background:var(--green-light);border-color:var(--green);color:var(--text)}
.period-select-row{display:flex;gap:8px;margin-top:4px}
.period-opt{flex:1;padding:10px 0;border:1.5px solid var(--border);background:var(--card);border-radius:12px;cursor:pointer;font-size:13px;font-weight:500;color:var(--text-mid);text-align:center;transition:transform 140ms var(--ease-out),background 200ms var(--ease-out),border-color 200ms var(--ease-out),color 200ms var(--ease-out)}
.period-opt:active{transform:scale(0.97)}
.period-opt.sel{background:var(--text);border-color:var(--text);color:#fff}
.task-empty{text-align:center;padding:48px 20px;color:var(--text-soft)}
.task-empty-icon{font-size:42px;margin-bottom:8px;opacity:0.5}

/* Calendar */
.cal-wrap{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:14px;margin-bottom:16px;box-shadow:var(--shadow)}
.cal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding:0 4px}
.cal-title{font-size:15px;font-weight:600;color:var(--text);letter-spacing:-0.3px}
.cal-nav{background:var(--lime);color:var(--text);border:none;border-radius:99px;width:34px;height:34px;font-size:18px;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background 200ms var(--ease-out),transform 140ms var(--ease-out)}
.cal-nav:hover{background:var(--green-light)}
.cal-nav:active{transform:scale(0.92)}
.cal-today-btn{background:transparent;border:1.5px solid var(--border);color:var(--text-mid);border-radius:99px;padding:5px 12px;font-size:11px;font-weight:600;cursor:pointer;letter-spacing:0.2px;transition:border-color 200ms var(--ease-out),color 200ms var(--ease-out)}
.cal-today-btn:hover{border-color:var(--green);color:var(--green)}
.cal-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:4px}
.cal-weekdays div{text-align:center;font-size:10px;font-weight:600;color:var(--text-soft);letter-spacing:1.2px;padding:6px 0;text-transform:uppercase}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.cal-day{aspect-ratio:1;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;font-size:13px;font-weight:500;color:var(--text);position:relative;transition:background 200ms var(--ease-out),color 200ms var(--ease-out),transform 200ms var(--ease-spring);background:transparent;gap:2px}
.cal-day:hover{background:var(--lime-bright)}
.cal-day.cal-out{color:var(--text-soft);opacity:0.3;cursor:default}
.cal-day.cal-out:hover{background:transparent}
.cal-day.cal-today{background:var(--lime);color:var(--text);font-weight:700}
.cal-day.cal-sel{background:var(--text);color:#fff;font-weight:600;box-shadow:0 4px 14px rgba(26,22,20,0.22);transform:scale(1.04)}
.cal-day.cal-sel.cal-today{background:var(--text)}
.cal-dots{display:flex;gap:2px;position:absolute;bottom:4px;left:50%;transform:translateX(-50%)}
.cal-dot{width:4px;height:4px;border-radius:99px}
.cal-day.cal-sel .cal-dot{background:var(--accent)!important;opacity:1}
.cal-selected-head{display:flex;justify-content:space-between;align-items:center;margin:4px 0 10px;padding:0 2px}
.cal-selected-date{font-size:15px;font-weight:600;color:var(--text);letter-spacing:-0.3px}
.cal-selected-count{font-size:11px;color:var(--text);background:var(--lime);padding:3px 10px;border-radius:99px;font-weight:600;letter-spacing:0.2px}
.date-input{width:100%;padding:12px 14px;border-radius:12px;border:1.5px solid var(--border);font-size:15px;background:var(--card);color:var(--text);font-family:inherit;outline:none;color-scheme:light;transition:border-color 200ms var(--ease-out),box-shadow 200ms var(--ease-out)}

/* Meilensteine */
.ms-daily-quote{background:var(--momo-cream-warm);border:1px solid var(--momo-sand);border-radius:18px;padding:16px 18px 14px;margin-bottom:14px;position:relative;overflow:hidden;box-shadow:var(--shadow-xs)}
.ms-daily-quote::before{content:"\201C";position:absolute;top:-12px;left:12px;font-size:60px;color:var(--momo-ink-soft);opacity:0.25;font-family:'Geist',sans-serif;font-weight:700;line-height:1}
.ms-daily-quote-text{font-family:'Geist',-apple-system,sans-serif;font-size:14px;font-weight:500;color:var(--text);line-height:1.45;position:relative;z-index:1;margin-bottom:8px;letter-spacing:-0.2px;padding-left:16px}
.ms-daily-quote-author{font-size:10px;color:var(--text-mid);text-transform:uppercase;letter-spacing:1.4px;font-weight:500;font-family:'Geist Mono',ui-monospace,monospace;padding-left:16px}
.ms-dash-block{margin-bottom:18px}
.ms-dash-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.ms-dash-head h3{font-size:15px;font-weight:600;color:var(--text);letter-spacing:-0.3px}
.ms-dash-cta{background:transparent;color:#fff;border-radius:20px;padding:16px 18px;margin-bottom:18px;display:flex;align-items:center;gap:14px;cursor:pointer;box-shadow:0 6px 20px rgba(26,22,20,0.18);transition:transform 200ms var(--ease-out),box-shadow 200ms var(--ease-out);position:relative;overflow:hidden}
.ms-dash-cta::after{content:"";position:absolute;top:-60%;right:-10%;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,rgba(255,198,79,0.22) 0%,transparent 70%);pointer-events:none}
.ms-dash-cta:hover{transform:translateY(-1px);box-shadow:0 10px 28px rgba(26,22,20,0.22)}
.ms-dash-cta:active{transform:scale(0.98)}
.ms-dash-cta-icon{font-size:28px;line-height:1;flex-shrink:0;position:relative;z-index:1}
.ms-dash-cta-title{font-size:16px;font-weight:600;letter-spacing:-0.3px}
.ms-dash-cta-sub{font-size:12px;opacity:0.75;margin-top:2px;font-weight:500}
.ms-dash-cta-arrow{margin-left:auto;font-size:20px;font-weight:500;flex-shrink:0;transition:transform 220ms var(--ease-out);position:relative;z-index:1}
.ms-dash-cta:hover .ms-dash-cta-arrow{transform:translateX(4px)}
/* Bento 2.0 — Dashboard stats */
.ms-week-stats{display:grid;grid-template-columns:2fr 1fr;grid-auto-rows:minmax(88px,auto);gap:10px}
.ms-week-stats > *:first-child{grid-column:1 / -1;grid-row:1}
.ms-week-stat{background:var(--card);border:1px solid var(--border);border-radius:22px;padding:18px 20px;text-align:left;box-shadow:var(--shadow);transition:transform 280ms var(--ease-spring-soft),box-shadow 280ms var(--ease-swift);position:relative;overflow:hidden}
.ms-week-stat::before{content:"";position:absolute;top:-40%;right:-20%;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,var(--lime) 0%,transparent 70%);opacity:0.5;pointer-events:none;transition:transform 600ms var(--ease-swift),opacity 400ms var(--ease-swift)}
.ms-week-stat:hover{transform:translateY(-3px);box-shadow:var(--shadow-lift)}
.ms-week-stat:hover::before{transform:scale(1.3);opacity:0.8}
.ms-week-stat-num{font-size:40px;font-weight:400;color:var(--text);letter-spacing:-2px;line-height:1;font-feature-settings:"ss01";font-variant-numeric:tabular-nums;position:relative}
.ms-week-stat-label{font-size:10px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.4px;font-weight:500;margin-top:10px;font-family:'Geist Mono',ui-monospace,monospace;position:relative}

/* Nächster Meilenstein Card */
.ms-next-card{background:var(--card);border:1px solid var(--border);border-radius:22px;padding:18px 20px 18px 24px;margin-bottom:12px;box-shadow:var(--shadow);position:relative;overflow:hidden;transition:transform 280ms var(--ease-spring-soft)}
.ms-next-card::before{content:"";position:absolute;top:0;left:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--accent) 0%,var(--green) 100%)}
.ms-next-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.ms-next-label{font-size:10px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.4px;font-weight:500;font-family:'Geist Mono',ui-monospace,monospace}
.ms-next-more{font-size:10px;color:var(--text-soft);background:var(--lime-bright);padding:3px 9px;border-radius:99px;font-weight:600;letter-spacing:0.3px}
.ms-next-title{font-size:17px;font-weight:500;color:var(--text);letter-spacing:-0.4px;line-height:1.3;margin-bottom:6px}
.ms-next-goal{font-size:12px;color:var(--text-mid);font-weight:500;letter-spacing:-0.1px;margin-bottom:14px;line-height:1.4}
.ms-next-goal strong{color:var(--text);font-weight:600}
.ms-next-done-btn{display:inline-flex;align-items:center;gap:6px;background:var(--text);color:#fff;border:none;border-radius:99px;padding:9px 18px;font-size:13px;font-weight:500;cursor:pointer;font-family:inherit;letter-spacing:-0.2px;box-shadow:0 1px 2px rgba(26,22,20,0.08),0 6px 16px -6px rgba(26,22,20,0.28);transition:transform 160ms var(--ease-out),background 200ms var(--ease-swift)}
.ms-next-done-btn:hover{background:var(--btn-primary-hover)}
.ms-next-done-btn:active{transform:scale(0.96)}

/* Deine Woche Card */
.ms-week-card-inner{background:transparent;color:#fff;border-radius:22px;padding:20px;box-shadow:0 2px 4px rgba(26,22,20,0.08),0 14px 28px -10px rgba(26,22,20,0.28),inset 0 1px 0 rgba(255,255,255,0.08);position:relative;overflow:hidden}
.ms-week-card-inner::after{content:"";position:absolute;top:-40%;right:-15%;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(255,198,79,0.18) 0%,transparent 70%);pointer-events:none}
.ms-week-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:18px;position:relative;z-index:1}
.ms-week-card-head .ms-next-label{color:rgba(255,255,255,0.62)}
.ms-week-card-total{font-size:36px;font-weight:400;letter-spacing:-1.4px;line-height:1;margin-top:6px;font-variant-numeric:tabular-nums;font-feature-settings:"ss01"}
.ms-week-card-total small{font-size:11px;opacity:0.6;margin-left:4px;font-weight:500;letter-spacing:-0.2px}
.ms-week-card-delta{font-size:12px;color:var(--accent);font-weight:500;margin-top:6px;letter-spacing:-0.1px}
.ms-week-mini-stats{display:flex;flex-direction:column;gap:5px;text-align:right}
.ms-week-mini{display:flex;align-items:baseline;justify-content:flex-end;gap:6px;font-size:12px}
.ms-week-mini-num{color:#fff;font-weight:600;font-size:14px;font-variant-numeric:tabular-nums;letter-spacing:-0.2px}
.ms-week-mini-lbl{color:rgba(255,255,255,0.55);font-weight:500;font-size:10px;text-transform:uppercase;letter-spacing:0.8px;font-family:'Geist Mono',ui-monospace,monospace}
.ms-week-chart{display:flex;align-items:flex-end;gap:6px;height:80px;position:relative;z-index:1}
.ms-week-bar-wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;height:100%;min-width:0}
.ms-week-bar{width:100%;border-radius:4px 4px 2px 2px;transition:height 600ms var(--ease-swift);min-height:4px}
.ms-week-bar-label{font-size:9px;color:rgba(255,255,255,0.55);font-family:'Geist Mono',ui-monospace,monospace;letter-spacing:0.5px;font-weight:500}
.goal-card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:18px;margin-bottom:12px;box-shadow:var(--shadow);position:relative;overflow:hidden;transition:transform 260ms var(--ease-out),box-shadow 260ms var(--ease-out);animation:cardIn 400ms var(--ease-out) both}
.goal-card:hover{transform:translateY(-2px);box-shadow:0 2px 6px rgba(26,22,20,0.05),0 10px 28px rgba(26,22,20,0.07)}
.goal-card.done{opacity:0.65}
.goal-card.done .goal-title{text-decoration:line-through}
.goal-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:8px}
.goal-title{font-size:16px;font-weight:600;color:var(--text);letter-spacing:-0.3px;flex:1;line-height:1.3}
.goal-cat{font-size:10px;font-weight:600;background:var(--lime);color:var(--text);padding:3px 10px;border-radius:99px;letter-spacing:1px;text-transform:uppercase;flex-shrink:0;align-self:flex-start}
.goal-desc{font-size:13px;color:var(--text-mid);line-height:1.55;margin-bottom:10px}
.goal-why{background:var(--lime-bright);border-left:3px solid var(--accent);padding:10px 14px;border-radius:8px;font-size:12px;color:var(--text-mid);margin-bottom:12px;line-height:1.5;letter-spacing:-0.1px}
.goal-progress-wrap{margin:10px 0}
.goal-progress-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;font-size:12px;font-weight:500;color:var(--text-mid)}
.goal-progress-pct{color:var(--text);font-weight:700}
.goal-progress-bar{height:6px;background:var(--lime-bright);border-radius:99px;overflow:hidden}
.goal-progress-fill{height:100%;background:linear-gradient(90deg,var(--green) 0%,var(--accent) 100%);border-radius:99px;transition:width 600ms var(--ease-out)}
.goal-deadline{font-size:11px;color:var(--text-soft);margin-top:8px;display:flex;align-items:center;gap:4px;font-weight:500}
.goal-deadline.overdue{color:var(--danger);font-weight:600}
.goal-milestones{margin-top:12px;border-top:1px solid var(--border);padding-top:12px}
.milestone-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px dashed var(--border)}
.milestone-row:last-child{border-bottom:none}
.milestone-check{width:20px;height:20px;border-radius:50%;border:1.5px solid var(--border);appearance:none;cursor:pointer;flex-shrink:0;position:relative;background:var(--card);transition:background 220ms var(--ease-out),border-color 220ms var(--ease-out),transform 220ms var(--ease-spring)}
.milestone-check:hover{border-color:var(--green)}
.milestone-check:checked{background:var(--green);border-color:var(--green);transform:scale(1.08)}
.milestone-check:checked::after{content:"";position:absolute;top:50%;left:50%;width:8px;height:4px;border-left:1.5px solid #fff;border-bottom:1.5px solid #fff;border-bottom-left-radius:1px;transform:translate(-55%,-70%) rotate(-45deg)}
.milestone-text{flex:1;font-size:13px;color:var(--text);transition:color 200ms var(--ease-out)}
.milestone-text.done{text-decoration:line-through;color:var(--text-soft)}
.milestone-date{font-size:10px;color:var(--text-soft);background:var(--lime-bright);padding:2px 8px;border-radius:99px;font-weight:600;letter-spacing:0.2px}
.goal-actions{display:flex;gap:6px;margin-top:14px}
.goal-action-btn{flex:1;background:var(--lime);color:var(--text);border:none;border-radius:12px;padding:9px;font-size:12px;font-weight:600;cursor:pointer;transition:background 200ms var(--ease-out),transform 140ms var(--ease-out)}
.goal-action-btn:hover{background:var(--green-light)}
.goal-action-btn:active{transform:scale(0.96)}
.goal-action-btn.danger{background:var(--danger-soft);color:var(--danger)}
.goal-stats-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.goal-stat-chip{font-size:11px;color:var(--text-soft);background:var(--lime-bright);padding:3px 9px;border-radius:99px;font-weight:500;display:inline-flex;align-items:center;gap:4px}
.goal-ms-input-row{display:flex;gap:6px;margin-bottom:8px;align-items:center}
.goal-ms-input-row input[type="text"]{flex:2}
.goal-ms-input-row input[type="date"]{flex:1.2;font-size:13px}
.goal-ms-date{flex:1.2;position:relative;display:inline-flex;align-items:center;gap:6px;padding:0 10px;background:#fff;border:1px solid var(--border);border-radius:10px;height:36px;color:var(--text-mid);font-size:13px;cursor:pointer;overflow:hidden}
.goal-ms-date svg{flex-shrink:0;opacity:.7}
.goal-ms-date[data-empty="0"] span{display:none}
.goal-ms-date[data-empty="0"]{color:var(--text)}
.goal-ms-date input[type="date"]{position:absolute;inset:0;opacity:0;width:100%;height:100%;border:none;padding:0;margin:0;cursor:pointer;font-size:13px}
.goal-ms-date[data-empty="0"] input[type="date"]{opacity:1;padding:0 10px 0 30px;background:transparent}
.goal-ms-del{background:var(--danger-soft);color:var(--danger);border:none;border-radius:10px;width:34px;height:36px;cursor:pointer;font-size:14px;flex-shrink:0;transition:transform 140ms var(--ease-out)}
.goal-ms-del:active{transform:scale(0.9)}

/* Kompakte Goal-Card (Listenansicht) + klickbares Verhalten */
.goal-card-compact{cursor:pointer;user-select:none}
.goal-card-compact:active{transform:scale(0.992)}
.goal-meta-row{display:flex;align-items:center;gap:10px;margin-top:12px;padding-top:10px;border-top:1px solid var(--border);flex-wrap:wrap}
.goal-meta-item{font-size:11px;color:var(--text-soft);display:inline-flex;align-items:center;gap:5px;font-weight:500;letter-spacing:-0.05px}
.goal-meta-item.overdue{color:var(--danger);font-weight:600}
.goal-meta-chevron{margin-left:auto;color:var(--text-soft);display:inline-flex;align-items:center}

/* Goal Detail Sheet */
.mgoal-body-wrap{padding:20px 18px 30px;display:flex;flex-direction:column;gap:16px}
.mgoal-hero-card{background:transparent;color:#fff;border-radius:24px;padding:24px;position:relative;overflow:hidden;isolation:isolate}
.mgoal-hero-card::before{content:"";position:absolute;top:-30%;right:-20%;width:70%;height:80%;background:radial-gradient(circle,rgba(255,198,79,0.35) 0%,transparent 65%);filter:blur(30px);z-index:-1;pointer-events:none}
.mgoal-hero-cat{font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:rgba(255,255,255,0.6);font-weight:600;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:10px}
.mgoal-hero-title{font-size:24px;font-weight:500;letter-spacing:-0.8px;line-height:1.2;margin-bottom:8px}
.mgoal-hero-desc{font-size:13px;color:rgba(255,255,255,0.75);line-height:1.5;letter-spacing:-0.15px;margin-bottom:18px}
.mgoal-progress-block{margin-top:14px}
.mgoal-progress-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px;font-size:12px;color:rgba(255,255,255,0.7);font-weight:500}
.mgoal-progress-pct{font-size:18px;color:#fff;font-weight:500;font-variant-numeric:tabular-nums;letter-spacing:-0.5px}
.mgoal-progress-bar{height:8px;background:rgba(255,255,255,0.15);border-radius:99px;overflow:hidden}
.mgoal-progress-fill{height:100%;background:linear-gradient(90deg,#84CB8E 0%,#FFC64F 100%);border-radius:99px;transition:width 600ms var(--ease-out)}
.mgoal-hero-meta{display:flex;gap:14px;margin-top:14px;font-size:11px;color:rgba(255,255,255,0.65);font-weight:500}
.mgoal-hero-meta span{display:inline-flex;align-items:center;gap:5px}
.mgoal-hero-meta .overdue{color:var(--momo-peach)}

.mgoal-why{background:var(--lime-bright);border:1px solid var(--border);border-left:3px solid var(--accent);padding:14px 16px;border-radius:14px;font-size:13px;color:var(--text);line-height:1.5;letter-spacing:-0.1px}
.mgoal-why-label{font-size:10px;letter-spacing:1.2px;text-transform:uppercase;color:var(--text-mid);font-weight:600;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:6px}

.mgoal-section-title{font-size:11px;letter-spacing:0.6px;color:var(--text-mid);text-transform:uppercase;font-weight:600;margin:4px 0 10px;display:flex;justify-content:space-between;align-items:baseline}
.mgoal-section-title .mgoal-count{color:var(--text-soft);font-family:'Geist Mono',ui-monospace,monospace}

.mgoal-ms-list{background:var(--card);border:1px solid var(--border);border-radius:16px;overflow:hidden}
label.mgoal-ms-row{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--border);transition:background 180ms var(--ease-out);margin:0}
.mgoal-ms-row:last-child{border-bottom:none}
.mgoal-ms-row:active{background:var(--lime-bright)}
input.mgoal-ms-check{width:22px;height:22px;border-radius:50%;border:1.5px solid var(--border);appearance:none;-webkit-appearance:none;cursor:pointer;flex-shrink:0;position:relative;background:var(--card);margin:0;padding:0;transition:background 220ms var(--ease-out),border-color 220ms var(--ease-out),transform 220ms var(--ease-spring)}
.mgoal-ms-check:checked{background:var(--green);border-color:var(--green);transform:scale(1.08)}
.mgoal-ms-check:checked::after{content:"";position:absolute;top:50%;left:50%;width:9px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;border-bottom-left-radius:1px;transform:translate(-55%,-70%) rotate(-45deg)}
.mgoal-ms-text{flex:1;font-size:14px;color:var(--text);letter-spacing:-0.15px;line-height:1.4}
.mgoal-ms-text.done{text-decoration:line-through;color:var(--text-soft)}
.mgoal-ms-date{font-size:10px;color:var(--text-soft);background:var(--lime-bright);padding:3px 9px;border-radius:99px;font-weight:600;letter-spacing:0.3px;white-space:nowrap}
.mgoal-ms-empty{padding:20px;text-align:center;color:var(--text-soft);font-size:13px;letter-spacing:-0.1px;line-height:1.5}

.mgoal-tasks{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:4px 0}
.mgoal-task-row{padding:10px 16px;font-size:13px;color:var(--text);display:flex;align-items:center;gap:10px;letter-spacing:-0.15px}
.mgoal-task-row.done{color:var(--text-soft);text-decoration:line-through}
.mgoal-task-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}

.mgoal-actions{display:flex;justify-content:flex-end;gap:6px;margin-top:12px}
.mgoal-action-btn{padding:7px 12px;background:transparent;border:1px solid var(--border);color:var(--text-mid);border-radius:99px;font-family:inherit;font-size:12px;font-weight:500;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:transform 160ms var(--ease-spring-soft),background 200ms var(--ease-out),color 200ms var(--ease-out)}
.mgoal-action-btn svg{width:12px;height:12px}
.mgoal-action-btn:active{transform:scale(0.96)}
.mgoal-action-btn:hover{background:var(--lime-bright);color:var(--text)}
.mgoal-action-btn.danger{color:var(--danger);border-color:transparent;background:transparent}
.mgoal-action-btn.danger:hover{background:var(--danger-soft);color:var(--danger)}

/* Quotes — premium editorial style */
.quote-daily-card{background:transparent;color:#fff;border-radius:var(--radius-lg);padding:28px 24px 24px;margin-bottom:18px;position:relative;overflow:hidden;box-shadow:0 2px 4px rgba(26,22,20,0.08),0 24px 48px -20px rgba(26,22,20,0.32),inset 0 1px 0 rgba(255,255,255,0.08)}
.quote-daily-card::before{content:"\201C";position:absolute;top:-30px;left:14px;font-size:160px;color:var(--accent);opacity:0.16;font-family:'Geist',sans-serif;font-weight:700;line-height:1;z-index:0}
.quote-daily-card::after{content:"";position:absolute;top:-40%;right:-15%;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(255,198,79,0.16) 0%,transparent 70%);pointer-events:none;z-index:0}
.quote-daily-card .quote-text{font-family:'Geist',-apple-system,sans-serif;font-size:19px;font-weight:400;line-height:1.45;color:#fff;margin-bottom:14px;letter-spacing:-0.5px;position:relative;z-index:1}
.quote-daily-card .quote-author{font-size:10px;color:var(--accent);text-transform:uppercase;letter-spacing:2px;font-weight:600;font-family:'Geist Mono',ui-monospace,monospace;position:relative;z-index:1}
.quote-daily-card .quote-daily-tag{display:inline-block;font-size:9px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--accent);background:rgba(255,198,79,0.14);padding:4px 10px;border-radius:99px;margin-bottom:14px;position:relative;z-index:1;font-family:'Geist Mono',ui-monospace,monospace}

.quote-card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:22px;margin-bottom:10px;box-shadow:var(--shadow);transition:transform 280ms var(--ease-spring-soft),box-shadow 280ms var(--ease-swift);position:relative;overflow:hidden}
.quote-card::before{content:"\201C";position:absolute;top:-10px;left:10px;font-size:70px;color:var(--green);opacity:0.12;font-family:'Geist',sans-serif;font-weight:700;line-height:1}
.quote-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lift)}
.quote-text{font-family:'Geist',-apple-system,sans-serif;font-size:15px;font-weight:500;line-height:1.55;color:var(--text);margin-bottom:12px;letter-spacing:-0.2px;position:relative;z-index:1;padding-left:22px}
.quote-author{font-size:10px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.6px;font-weight:500;margin-bottom:10px;font-family:'Geist Mono',ui-monospace,monospace;padding-left:22px}
.quote-tags{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:10px;padding-left:22px}
.quote-tag{font-size:10px;color:var(--text);background:var(--lime);padding:2px 8px;border-radius:99px;font-weight:600;letter-spacing:0.3px}
.quote-actions{display:flex;gap:2px;margin-top:12px;border-top:1px solid var(--border);padding-top:12px}
.quote-actions button{flex:1;background:transparent;color:var(--text-mid);border:none;padding:8px;font-size:12px;font-weight:500;cursor:pointer;border-radius:10px;transition:background 200ms var(--ease-swift),color 200ms var(--ease-swift);font-family:inherit}
.quote-actions button:hover{background:var(--lime-bright);color:var(--text)}
.quote-actions .fav.on{color:var(--accent)}

/* Fokus */
.focus-stage{background:var(--card);border:1px solid var(--border);border-radius:22px;padding:32px 20px;text-align:center;box-shadow:var(--shadow);margin-bottom:16px}
.focus-mode{font-size:10px;font-weight:600;color:var(--text-soft);text-transform:uppercase;letter-spacing:3px;margin-bottom:20px}
.focus-ring{position:relative;display:block;width:220px;margin:0 auto}
.focus-ring svg{display:block}
.focus-ring svg circle{transition:stroke-dashoffset 800ms var(--ease-out),stroke 400ms var(--ease-out)}
.focus-time{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:46px;font-weight:300;color:var(--text);font-variant-numeric:tabular-nums;letter-spacing:-2px;font-family:'Geist',-apple-system,sans-serif}
.focus-goal-label{font-size:13px;color:var(--text-mid);margin-top:18px;padding:8px 14px;background:var(--lime-bright);border-radius:99px;display:inline-block;max-width:90%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.focus-controls{display:flex;gap:10px;justify-content:center;margin-top:22px}
.focus-btn{background:var(--card);color:var(--text);border:1.5px solid var(--border);border-radius:99px;padding:12px 20px;font-size:14px;font-weight:500;cursor:pointer;transition:border-color 200ms var(--ease-out),color 200ms var(--ease-out),transform 160ms var(--ease-out);min-width:48px}
.focus-btn:hover{border-color:var(--green);color:var(--green)}
.focus-btn:active{transform:scale(0.95)}
.focus-btn-primary{background:var(--text);color:#fff;border-color:var(--text);min-width:140px;box-shadow:0 4px 14px rgba(26,22,20,0.22)}
.focus-btn-primary:hover{background:var(--btn-primary-hover);color:#fff;border-color:var(--btn-primary-hover)}
.focus-settings{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:16px;box-shadow:var(--shadow)}
.focus-set-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--border)}
.focus-set-row:last-child{border-bottom:none}
.focus-set-row label{margin:0;font-size:13px;color:var(--text-mid);font-weight:500}
.focus-set-row input,.focus-set-row select{width:110px;padding:8px 10px;font-size:13px;text-align:center;margin:0}
.focus-dur-wrap{display:inline-flex;align-items:center;gap:5px}
.focus-dur-wrap input{width:52px!important;padding:8px 4px!important;font-size:13px!important;text-align:center;font-variant-numeric:tabular-nums}
.focus-dur-wrap span{font-size:11px;color:var(--text-soft);font-weight:500;font-family:'Geist Mono',ui-monospace,monospace;letter-spacing:0.5px}
.focus-history{}
.focus-stat-row{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:12px 14px;margin-bottom:8px;display:flex;justify-content:space-between;align-items:center;transition:transform 180ms var(--ease-out)}
.focus-stat-row:hover{transform:translateX(2px)}
.focus-stat-row-label{font-size:13px;color:var(--text);font-weight:500}
.focus-stat-row-value{font-size:14px;font-weight:600;color:var(--text);font-variant-numeric:tabular-nums}
.focus-goal-option{background:var(--card);border:1.5px solid var(--border);border-radius:14px;padding:12px 14px;margin-bottom:8px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:border-color 200ms var(--ease-out),background 200ms var(--ease-out),transform 160ms var(--ease-out)}
.focus-goal-option:hover{border-color:var(--green);background:var(--lime-bright)}
.focus-goal-option:active{transform:scale(0.99)}
.focus-goal-option.sel{border-color:var(--green);background:var(--lime)}
.focus-goal-option-name{font-size:14px;font-weight:600;color:var(--text)}
.focus-goal-option-cat{font-size:10px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1px;margin-top:2px;font-weight:600}
.focus-mode-toggle{display:inline-flex;gap:2px;background:var(--lime-bright);border:1px solid var(--border);border-radius:99px;padding:3px;width:auto}
.focus-mode-opt{flex:0 0 auto;padding:7px 14px;border:none;background:transparent;cursor:pointer;font-size:12px;font-weight:600;color:var(--text-mid);border-radius:99px;transition:color 200ms var(--ease-out),background 220ms var(--ease-out),transform 140ms var(--ease-out);letter-spacing:-0.1px;font-family:inherit}
.focus-mode-opt:active{transform:scale(0.96)}
.focus-mode-opt.active{background:var(--card);color:var(--text);box-shadow:0 1px 3px rgba(26,22,20,0.08),0 2px 8px rgba(26,22,20,0.06)}

/* Confetti */
.confetti-overlay{position:fixed;inset:0;background:rgba(26,22,20,0.5);z-index:200;display:none;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.confetti-overlay.open{display:flex;animation:fadeIn 260ms var(--ease-out)}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.confetti-content{background:var(--card);border-radius:24px;padding:32px 24px;text-align:center;max-width:360px;width:100%;position:relative;z-index:201;animation:pop 500ms var(--ease-spring)}
@keyframes pop{0%{transform:scale(0.92);opacity:0}100%{transform:scale(1);opacity:1}}
.confetti-icon{font-size:56px;margin-bottom:10px;animation:bounce 800ms var(--ease-spring)}
@keyframes bounce{0%{transform:translateY(0) scale(0.8)}30%{transform:translateY(-20px) scale(1.1) rotate(-10deg)}60%{transform:translateY(0) scale(1) rotate(10deg)}100%{transform:translateY(0) scale(1) rotate(0)}}
.confetti-title{font-size:22px;font-weight:600;color:var(--text);margin-bottom:12px;letter-spacing:-0.5px}
.confetti-quote{font-family:'Geist',-apple-system,sans-serif;font-size:14px;color:var(--text-mid);line-height:1.6;margin-bottom:20px;font-weight:500}
.confetti-content .btn{width:100%}
.confetti-piece{position:fixed;width:10px;height:10px;z-index:200;pointer-events:none;animation:fall 3s linear forwards}
@keyframes fall{0%{transform:translateY(-100vh) rotate(0deg);opacity:1}100%{transform:translateY(100vh) rotate(720deg);opacity:0}}

/* ================= SPORT ================= */
.sp-hero{background:transparent;border-radius:var(--radius-lg);padding:24px;color:#fff;margin-bottom:14px;box-shadow:0 2px 4px rgba(26,22,20,0.08),0 24px 48px -20px rgba(26,22,20,0.32),inset 0 1px 0 rgba(255,255,255,0.08);position:relative;overflow:hidden}
.sp-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,0.08) 48%,transparent 66%);pointer-events:none;animation:shineSweep 8s var(--ease-in-out) infinite;z-index:1}
.sp-hero::after{content:"";position:absolute;top:-50%;right:-15%;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(255,198,79,0.28) 0%,transparent 70%);pointer-events:none}
.sp-hero-label{font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;opacity:0.75;margin-bottom:6px;position:relative;z-index:1}
.sp-hero-title{font-size:22px;font-weight:600;letter-spacing:-0.6px;margin-bottom:4px;position:relative;z-index:1}
.sp-hero-sub{font-size:12px;opacity:0.75;margin-bottom:16px;position:relative;z-index:1;font-weight:500}
.sp-hero .btn{background:var(--accent);color:var(--text);width:100%;box-shadow:none;position:relative;z-index:1}
.sp-hero .btn:hover{background:var(--accent)}
.sp-kpis{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-bottom:16px}
.sp-kpi{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:14px 10px;text-align:center;box-shadow:var(--shadow);transition:transform 220ms var(--ease-out)}
.sp-kpi:hover{transform:translateY(-2px)}
.sp-kpi-num{font-size:24px;font-weight:600;color:var(--text);letter-spacing:-0.8px;line-height:1}
.sp-kpi-num small{font-size:11px;font-weight:600;color:var(--text-soft);margin-left:2px}
.sp-kpi-label{font-size:10px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1px;font-weight:600;margin-top:8px}
.sp-section-title{font-size:11px;font-weight:600;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.2px;margin:18px 0 10px;display:flex;align-items:center;gap:8px;justify-content:space-between}
.sp-quick-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-top:4px}
.sp-quick-btn{background:var(--card);border:1.5px solid var(--border);border-radius:16px;padding:16px 8px;cursor:pointer;text-align:center;transition:border-color 200ms var(--ease-out),background 200ms var(--ease-out),transform 140ms var(--ease-out);font-family:inherit}
.sp-quick-btn:hover{border-color:var(--green);background:var(--lime-bright)}
.sp-quick-btn:active{transform:scale(0.95)}
.sp-quick-icon{font-size:24px;display:block;margin-bottom:6px;transition:transform 240ms var(--ease-spring)}
.sp-quick-btn:hover .sp-quick-icon{transform:scale(1.12) rotate(-4deg)}
.sp-quick-label{font-size:11px;font-weight:600;color:var(--text);letter-spacing:-0.1px}

/* Mehr-sehen Link-Cards — Zugang zu Achievements/Statistik */
.sp-more-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.sp-more-card{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:12px 14px;cursor:pointer;font-family:inherit;text-align:left;transition:border-color 200ms var(--ease-swift),background 200ms var(--ease-swift),transform 140ms var(--ease-spring-soft)}
.sp-more-card:hover{border-color:var(--text);background:var(--lime-bright)}
.sp-more-card:active{transform:scale(0.98)}
.sp-more-ico{width:34px;height:34px;border-radius:10px;background:var(--lime-bright);color:var(--text-mid);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 200ms var(--ease-swift),color 200ms var(--ease-swift)}
.sp-more-card:hover .sp-more-ico{background:var(--text);color:#fff}
.sp-more-text{flex:1;min-width:0}
.sp-more-title{font-size:13px;font-weight:500;color:var(--text);letter-spacing:-0.2px;line-height:1.2}
.sp-more-sub{font-size:10.5px;color:var(--text-soft);margin-top:2px;letter-spacing:-0.05px;line-height:1.3}
.sp-more-chev{color:var(--text-soft);flex-shrink:0;transition:transform 200ms var(--ease-swift),color 200ms var(--ease-swift)}
.sp-more-card:hover .sp-more-chev{transform:translateX(2px);color:var(--text)}

/* Training cards */
.sp-plan-card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:16px;margin-bottom:10px;box-shadow:var(--shadow);transition:transform 240ms var(--ease-out),box-shadow 240ms var(--ease-out);animation:cardIn 380ms var(--ease-out) both}
.sp-plan-card:hover{transform:translateY(-1px)}
.sp-plan-card.active{border-color:var(--border);box-shadow:var(--shadow)}
.sp-plan-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:6px;gap:10px}
.sp-plan-title{font-weight:600;font-size:16px;color:var(--text);letter-spacing:-0.3px}
.sp-plan-desc{font-size:12px;color:var(--text-mid);margin-top:4px;line-height:1.5}
.sp-plan-days{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.sp-day-chip{background:var(--lime);color:var(--text);border-radius:99px;padding:4px 12px;font-size:11px;font-weight:600;letter-spacing:-0.1px}
.sp-plan-actions{display:flex;gap:8px;margin-top:14px;align-items:stretch}
.sp-plan-actions .sp-plan-cta{flex:1}
.sp-plan-actions .sp-plan-activate{background:transparent;border:1px solid var(--border);color:var(--text);padding:0 16px;border-radius:99px;font-weight:500}
.sp-plan-actions .sp-plan-activate:hover{border-color:var(--text);background:var(--cream)}
.sp-plan-meta{display:flex;gap:2px;flex-shrink:0;margin:-4px -4px 0 0}
.sp-plan-ico{background:transparent;border:0;color:var(--text-soft);cursor:pointer;width:30px;height:30px;border-radius:99px;display:inline-flex;align-items:center;justify-content:center;transition:color 180ms var(--ease-swift),background 180ms var(--ease-swift),transform 140ms var(--ease-out)}
.sp-plan-ico:hover{color:var(--text);background:var(--cream)}
.sp-plan-ico.danger:hover{color:var(--danger);background:var(--danger-soft)}
.sp-plan-ico:active{transform:scale(0.9)}
.plan-del-sm{background:transparent;border:1px solid var(--border);color:var(--text-soft);cursor:pointer;width:34px;height:34px;border-radius:99px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;transition:color 200ms var(--ease-swift),border-color 200ms var(--ease-swift),transform 140ms var(--ease-out)}
.plan-del-sm:hover{color:var(--danger);border-color:var(--danger-soft)}
.plan-del-sm:active{transform:scale(0.9)}
.sp-active-chip{background:var(--accent);color:var(--text);border-radius:99px;padding:3px 10px;font-size:10px;font-weight:700;letter-spacing:0.5px;text-transform:uppercase}

.sp-day-block{background:var(--lime-bright);border-radius:14px;padding:14px;margin-bottom:10px;border:1px solid var(--border)}
.sp-day-name{font-weight:600;color:var(--text);font-size:14px;margin-bottom:10px;display:flex;justify-content:space-between;align-items:center;letter-spacing:-0.2px}
.sp-ex-row{background:var(--card);border-radius:10px;padding:10px 12px;margin-bottom:6px;display:flex;justify-content:space-between;align-items:center;font-size:13px;gap:8px;border:1px solid var(--border);transition:transform 180ms var(--ease-out)}
.sp-ex-row:hover{transform:translateX(2px)}
.sp-ex-row-name{font-weight:500;color:var(--text);flex:1}
.sp-ex-row-target{font-size:11px;color:var(--text-soft);font-weight:500}
.sp-ex-rm{background:none;border:none;color:var(--text-soft);cursor:pointer;font-size:14px;padding:2px 6px;transition:color 180ms var(--ease-out),transform 140ms var(--ease-out)}
.sp-ex-rm:hover{color:var(--danger)}
.sp-ex-rm:active{transform:scale(0.9)}

/* Exercise library */
.sp-ex-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:14px;margin-bottom:8px;box-shadow:var(--shadow);display:flex;gap:12px;align-items:center;transition:transform 200ms var(--ease-out);animation:cardIn 360ms var(--ease-out) both}
.sp-ex-card:hover{transform:translateY(-1px)}
.sp-ex-icon{width:44px;height:44px;border-radius:12px;background:var(--lime);color:var(--green);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.sp-ex-main{flex:1;min-width:0}
.sp-ex-name{font-weight:600;font-size:14px;color:var(--text);letter-spacing:-0.2px}
.sp-ex-meta{font-size:11px;color:var(--text-soft);margin-top:3px;font-weight:500}
.sp-ex-actions{display:flex;gap:4px}
.sp-ex-actions button{background:transparent;border:none;font-size:16px;cursor:pointer;color:var(--text-soft);padding:4px;border-radius:8px;transition:color 180ms var(--ease-out),transform 140ms var(--ease-out)}
.sp-ex-actions button:active{transform:scale(0.9)}
.sp-ex-actions button.fav{color:var(--accent)}

/* Workout runner */
.sp-workout-hdr{background:transparent;color:#fff;border-radius:18px;padding:18px;margin-bottom:12px;box-shadow:0 6px 20px rgba(26,22,20,0.16)}
.sp-workout-title{font-size:18px;font-weight:600;letter-spacing:-0.4px}
.sp-workout-sub{font-size:12px;opacity:0.75;margin-top:4px;font-weight:500}
.sp-workout-time{font-size:30px;font-weight:500;letter-spacing:-1px;margin-top:8px;font-variant-numeric:tabular-nums;color:var(--accent)}
.sp-wx-card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:16px;margin-bottom:12px;box-shadow:var(--shadow)}
.sp-wx-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;gap:10px}
.sp-wx-name{font-weight:600;font-size:15px;color:var(--text);letter-spacing:-0.3px}
.sp-wx-last{font-size:11px;color:var(--text-soft);margin-top:3px;font-weight:500}
.sp-set-row{display:grid;grid-template-columns:32px 1fr 1fr 40px;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid var(--border)}
.sp-set-row:last-child{border-bottom:none}
.sp-set-no{font-size:11px;font-weight:600;color:var(--text);text-align:center}
.sp-set-input{padding:8px 10px;border-radius:10px;border:1.5px solid var(--border);font-size:13px;background:var(--lime-bright);text-align:center;font-weight:500;transition:border-color 200ms var(--ease-out),background 200ms var(--ease-out)}
.sp-set-input:focus{border-color:var(--green);background:var(--card)}
.sp-set-check{width:24px;height:24px;border-radius:50%;border:1.5px solid var(--border);appearance:none;cursor:pointer;background:var(--card);position:relative;justify-self:center;transition:background 220ms var(--ease-out),border-color 220ms var(--ease-out),transform 220ms var(--ease-spring)}
.sp-set-check:hover{border-color:var(--green)}
.sp-set-check:checked{background:var(--green);border-color:var(--green);transform:scale(1.08)}
.sp-set-check:checked::after{content:"";position:absolute;top:50%;left:50%;width:9px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;border-bottom-left-radius:1px;transform:translate(-55%,-70%) rotate(-45deg)}
.sp-set-labels{display:grid;grid-template-columns:32px 1fr 1fr 40px;gap:8px;font-size:10px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1px;font-weight:600;padding:0 0 4px}
.sp-set-labels div{text-align:center}
.sp-rest-banner{background:var(--green-light);color:var(--green-mid);border-radius:14px;padding:14px;text-align:center;font-weight:600;margin-bottom:12px;display:flex;justify-content:space-between;align-items:center}
.sp-rest-time{font-size:24px;font-weight:600;letter-spacing:-0.8px;font-variant-numeric:tabular-nums;color:var(--text)}

/* Körper */
.sp-body-current{background:transparent;color:#fff;border-radius:20px;padding:20px;margin-bottom:14px;box-shadow:0 6px 20px rgba(26,22,20,0.16);position:relative;overflow:hidden}
.sp-body-current::after{content:"";position:absolute;top:-50%;right:-15%;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(195,231,241,0.2) 0%,transparent 70%);pointer-events:none}
.sp-body-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;position:relative;z-index:1}
.sp-body-label{font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;opacity:0.75}
.sp-body-weight{font-size:42px;font-weight:500;letter-spacing:-1.5px;line-height:1;margin:6px 0;position:relative;z-index:1}
.sp-body-weight small{font-size:16px;font-weight:500;opacity:0.65;margin-left:6px}
.sp-body-trend{font-size:12px;opacity:0.8;position:relative;z-index:1;font-weight:500}
.sp-body-trend.up{color:var(--accent);opacity:1}
.sp-meas-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:14px}

/* Collapsible Maße-Section unter Gewicht */
.sp-meas-section{margin-top:22px;background:var(--card);border:1px solid var(--border);border-radius:18px;overflow:hidden}
.sp-meas-toggle{display:flex;align-items:center;gap:10px;width:100%;padding:14px 18px;background:none;border:none;cursor:pointer;font-family:inherit;font-size:13.5px;font-weight:500;color:var(--text);letter-spacing:-0.15px}
.sp-meas-toggle svg:first-child{color:var(--text-mid);flex-shrink:0}
.sp-meas-toggle span{text-align:left}
.sp-meas-toggle-count{margin-left:auto;font-size:10px;font-weight:600;background:var(--lime);color:var(--text);padding:2px 8px;border-radius:99px;font-family:'Geist Mono',ui-monospace,monospace;letter-spacing:0.3px;display:none;align-items:center;min-width:22px;justify-content:center}
.sp-meas-toggle-chev{color:var(--text-soft);margin-left:8px;transition:transform 300ms var(--ease-swift);flex-shrink:0}
.sp-meas-toggle.open .sp-meas-toggle-chev{transform:rotate(180deg)}
.sp-meas-body{max-height:0;overflow:hidden;transition:max-height 420ms var(--ease-swift)}
.sp-meas-body.open{max-height:2000px}
.sp-meas-body>*:first-child{padding-top:6px}
.sp-meas-body{padding:0 18px}
.sp-meas-body.open{padding:0 18px 18px}

/* Foto-Actions-Zeile */
.sp-photo-actions{display:flex;gap:10px;margin-bottom:16px}
.sp-meas-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px;box-shadow:var(--shadow);transition:transform 220ms var(--ease-out)}
.sp-meas-card:hover{transform:translateY(-1px)}
.sp-meas-name{font-size:10px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1px;font-weight:600;margin-bottom:6px}
.sp-meas-val{font-size:22px;font-weight:600;color:var(--text);letter-spacing:-0.5px}
.sp-meas-val small{font-size:11px;color:var(--text-soft);font-weight:500;margin-left:2px}
.sp-meas-diff{font-size:10px;color:var(--text);font-weight:600;margin-top:4px}
.sp-meas-diff.down{color:var(--text)}
.sp-meas-diff.up{color:var(--danger)}

/* Chart */
.sp-chart{width:100%;height:160px;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:12px;margin-bottom:14px}

/* Photos */
.sp-photo-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-bottom:14px}
.sp-photo-tile{aspect-ratio:3/4;background:var(--lime-bright);border-radius:12px;overflow:hidden;position:relative;cursor:pointer;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);transition:transform 220ms var(--ease-out),box-shadow 220ms var(--ease-out)}
.sp-photo-tile:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.sp-photo-tile:active{transform:scale(0.98)}
.sp-photo-tile img{width:100%;height:100%;object-fit:cover;transition:transform 500ms var(--ease-out)}
.sp-photo-tile:hover img{transform:scale(1.04)}
.sp-photo-tile .persp{position:absolute;top:6px;left:6px;background:rgba(26,22,20,0.7);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);color:#fff;font-size:9px;padding:3px 8px;border-radius:99px;font-weight:600;letter-spacing:0.5px;text-transform:uppercase}
.sp-photo-tile .date{position:absolute;bottom:6px;right:6px;background:rgba(255,255,255,0.9);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);color:var(--text);font-size:9px;padding:3px 8px;border-radius:99px;font-weight:600}
.sp-photo-tile .weight{position:absolute;bottom:6px;left:6px;background:rgba(255,255,255,0.9);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);color:var(--text);font-size:9px;padding:3px 8px;border-radius:99px;font-weight:600;font-variant-numeric:tabular-nums}
:root[data-theme="dark"] .sp-photo-tile .weight{background:rgba(20,16,14,0.9);color:var(--text)}
.sp-entry-thumb{width:40px;height:40px;border-radius:8px;object-fit:cover;flex-shrink:0;cursor:pointer;transition:transform 160ms var(--ease-out)}
.sp-entry-thumb:active{transform:scale(0.95)}
.spw-photo-section{background:var(--lime-bright);border:1px solid var(--border);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:10px}
.spw-photo-section.has-photo{background:var(--card)}
.spw-photo-lbl{font-size:11px;color:var(--text-soft);text-transform:uppercase;letter-spacing:0.8px;font-weight:600}
.spw-photo-add{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px;border:1.5px dashed var(--border);border-radius:12px;cursor:pointer;color:var(--text-soft);font-size:13px;font-weight:500;transition:border-color 180ms var(--ease-out),color 180ms var(--ease-out),background 180ms var(--ease-out),transform 160ms var(--ease-out)}
.spw-photo-add:hover{border-color:var(--green);color:var(--green);background:var(--card)}
.spw-photo-add:active{transform:scale(0.98)}
.spw-photo-preview{position:relative;aspect-ratio:3/4;max-height:220px;align-self:center;border-radius:12px;overflow:hidden;background:var(--card)}
.spw-photo-preview img{width:100%;height:100%;object-fit:cover;display:block}
.spw-photo-remove{position:absolute;top:8px;right:8px;width:28px;height:28px;border-radius:50%;background:rgba(26,22,20,0.85);color:#fff;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform 160ms var(--ease-out)}
.spw-photo-remove:active{transform:scale(0.9)}
.spw-photo-persp{display:flex;gap:6px}
.spw-photo-persp .spw-date-chip{flex:1}
.sp-photo-tile.selected{outline:3px solid var(--green);outline-offset:2px}
.sp-photo-empty-icon{font-size:22px;opacity:0.4}
.sp-ba-view{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}
.sp-ba-half{background:var(--card);border-radius:14px;overflow:hidden;border:1px solid var(--border);animation:cardIn 360ms var(--ease-out) both}
.sp-ba-half img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block}
.sp-ba-caption{padding:8px 10px;font-size:11px;color:var(--text-mid);font-weight:600;text-align:center}
.sp-ba-diff{background:var(--lime);border-radius:14px;padding:14px;margin-bottom:12px;text-align:center;color:var(--text);font-weight:600;font-size:13px;line-height:1.8}
.sp-ba-diff strong{font-size:17px;color:var(--text);font-weight:600}

/* Achievements */
.sp-ach-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.sp-ach-card{background:var(--card);border:1.5px solid var(--border);border-radius:16px;padding:16px 12px;text-align:center;box-shadow:var(--shadow);position:relative;transition:transform 240ms var(--ease-out),box-shadow 240ms var(--ease-out);animation:cardIn 380ms var(--ease-out) both}
.sp-ach-card:hover{transform:translateY(-2px)}
.sp-ach-card.done{background:linear-gradient(135deg,var(--accent-soft) 0%,#F4B4A6 100%);border-color:var(--accent)}
.sp-ach-card.locked{opacity:0.5}
.sp-ach-icon{font-size:36px;margin-bottom:8px;filter:grayscale(1);opacity:0.4;transition:filter 360ms var(--ease-out),opacity 360ms var(--ease-out),transform 360ms var(--ease-spring)}
.sp-ach-card.done .sp-ach-icon{filter:none;opacity:1;animation:achPop 680ms var(--ease-spring)}
@keyframes achPop{0%{transform:scale(0.6) rotate(-10deg)}60%{transform:scale(1.15) rotate(8deg)}100%{transform:scale(1) rotate(0)}}
.sp-ach-title{font-size:13px;font-weight:600;color:var(--text);letter-spacing:-0.2px;line-height:1.25}
.sp-ach-desc{font-size:11px;color:var(--text-mid);margin-top:4px;line-height:1.4;min-height:28px}
.sp-ach-date{font-size:10px;color:var(--text-soft);font-weight:600;margin-top:6px;letter-spacing:0.3px}
.sp-ach-card.done .sp-ach-date{color:var(--accent-text)}
.sp-ach-prog{margin-top:8px;background:var(--border);border-radius:99px;height:4px;overflow:hidden}
.sp-ach-prog-fill{height:100%;background:linear-gradient(90deg,var(--green) 0%,var(--accent) 100%);border-radius:99px;transition:width 600ms var(--ease-out)}

/* Stats */
.sp-stat-tabs{display:flex;gap:4px;margin-bottom:14px;background:var(--lime-bright);border:1px solid var(--border);border-radius:14px;padding:4px}
.sp-stat-tab{flex:1;padding:8px;font-size:11px;font-weight:600;color:var(--text-mid);border:none;background:transparent;border-radius:10px;cursor:pointer;letter-spacing:0.2px;transition:color 200ms var(--ease-out),background 200ms var(--ease-out),transform 140ms var(--ease-out)}
.sp-stat-tab:active{transform:scale(0.97)}
.sp-stat-tab.active{background:var(--card);color:var(--text);box-shadow:0 1px 3px rgba(26,22,20,0.08)}
.sp-heatmap{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-top:8px}
.sp-heat-cell{aspect-ratio:1;border-radius:4px;background:var(--lime-bright);transition:transform 200ms var(--ease-out)}
.sp-heat-cell:hover{transform:scale(1.15)}
.sp-heat-cell.l1{background:#E1F2F6}
.sp-heat-cell.l2{background:#C3E7F1}
.sp-heat-cell.l3{background:#8CC5D3}
.sp-heat-cell.l4{background:#519CAB}
.sp-stat-box{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px;margin-bottom:10px;box-shadow:var(--shadow)}
.sp-stat-box-title{font-size:10px;font-weight:600;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.2px;margin-bottom:12px}
.sp-stat-line{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--border);font-size:13px}
.sp-stat-line:last-child{border-bottom:none}
.sp-stat-line-lbl{color:var(--text-mid);font-weight:500}
.sp-stat-line-val{font-weight:600;color:var(--text)}

/* Entries list */
.sp-entry-row{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:12px 14px;margin-bottom:6px;display:flex;justify-content:space-between;align-items:center;font-size:13px;transition:transform 180ms var(--ease-out)}
.sp-entry-row:hover{transform:translateX(2px)}
.sp-entry-date{font-size:11px;color:var(--text-soft);font-weight:500}
.sp-entry-val{font-weight:600;color:var(--text);font-size:15px;letter-spacing:-0.3px}
.sp-entry-del{background:transparent;border:none;color:var(--text-soft);cursor:pointer;font-size:14px;padding:4px 6px;transition:color 180ms var(--ease-out),transform 140ms var(--ease-out)}
.sp-entry-del:hover{color:var(--danger)}
.sp-entry-del:active{transform:scale(0.9)}

/* Split input rows for measurements */
.sp-meas-input-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px}
.sp-meas-input-item label{margin-top:0;margin-bottom:4px;font-size:12px}

/* Body tabs */
.sp-body-subtabs{display:flex;gap:6px;margin-bottom:14px;overflow-x:auto;scrollbar-width:none}
.sp-body-subtabs::-webkit-scrollbar{display:none}
.sp-body-subtab{flex-shrink:0;padding:8px 16px;border-radius:99px;border:1.5px solid var(--border);background:var(--card);color:var(--text-mid);font-size:12px;font-weight:600;cursor:pointer;transition:background 200ms var(--ease-out),color 200ms var(--ease-out),border-color 200ms var(--ease-out),transform 140ms var(--ease-out)}
.sp-body-subtab:active{transform:scale(0.96)}
.sp-body-subtab.active{background:var(--text);color:#fff;border-color:var(--text)}

/* Exercise filters */
.sp-mg-row{display:flex;gap:6px;overflow-x:auto;padding:2px 0 12px;scrollbar-width:none}
.sp-mg-row::-webkit-scrollbar{display:none}

/* Workout summary */
.sp-sum-box{background:transparent;color:#fff;border-radius:20px;padding:24px 20px;margin-bottom:14px;text-align:center;position:relative;overflow:hidden}
.sp-sum-box::after{content:"";position:absolute;top:-40%;left:-20%;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(255,198,79,0.24) 0%,transparent 70%);pointer-events:none}
.sp-sum-icon{font-size:48px;margin-bottom:8px;position:relative;z-index:1;animation:achPop 680ms var(--ease-spring)}
.sp-sum-title{font-size:22px;font-weight:600;letter-spacing:-0.5px;margin-bottom:4px;position:relative;z-index:1}
.sp-sum-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-top:18px;position:relative;z-index:1}
.sp-sum-grid-item{background:rgba(255,255,255,0.12);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:12px;padding:12px 6px}
.sp-sum-grid-num{font-size:22px;font-weight:600;letter-spacing:-0.5px}
.sp-sum-grid-lbl{font-size:10px;opacity:0.75;font-weight:600;text-transform:uppercase;letter-spacing:0.8px;margin-top:3px}
.sp-pr-list{background:var(--accent-soft);border-radius:14px;padding:12px 14px;margin-top:12px;color:var(--accent-text);font-size:12px;font-weight:600;position:relative;z-index:1}

/* Alert modal for achievement prompt */
.sp-ach-prompt{background:linear-gradient(135deg,var(--accent-soft) 0%,#F4B4A6 100%);border-radius:14px;padding:14px 16px;margin-bottom:14px;color:var(--accent-text);font-size:13px;line-height:1.55;border:1px solid var(--accent)}
.sp-ach-prompt-title{font-weight:600;font-size:14px;margin-bottom:4px;letter-spacing:-0.2px;color:var(--text)}

/* PDF & drop zones */
.pdf-drop{transition:border-color 240ms var(--ease-out),background 240ms var(--ease-out)}
.img-upload-area:hover{border-color:var(--green)!important;background:var(--lime-bright)}

/* NW view items */
.nw-view-item{background:var(--lime-bright);border-radius:12px;padding:12px 8px;text-align:center;border:1px solid var(--border);transition:transform 220ms var(--ease-out)}
.nw-view-item:hover{transform:translateY(-1px)}

/* Spin for progress states */
@keyframes spin{to{transform:rotate(360deg)}}

/* ================= KI-KOCH FAB ================= */
.ki-fab{position:fixed;bottom:108px;right:max(20px,env(safe-area-inset-right));width:56px;height:56px;border-radius:50%;background:transparent;color:#fff;border:none;cursor:pointer;z-index:18;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(26,22,20,0.25),0 12px 24px -6px rgba(26,22,20,0.32),inset 0 1px 0 rgba(255,255,255,0.1);transition:transform 220ms var(--ease-spring-soft),box-shadow 220ms var(--ease-swift)}
.ki-fab:hover{transform:translateY(-2px)}
.ki-fab:active{transform:scale(0.92)}
.ki-fab-pulse{position:absolute;top:10px;right:10px;width:8px;height:8px;border-radius:99px;background:var(--accent);box-shadow:0 0 0 0 var(--accent);animation:kiFabPulse 2.2s var(--ease-in-out) infinite}
@keyframes kiFabPulse{0%,100%{box-shadow:0 0 0 0 rgba(255,198,79,0.6)}70%{box-shadow:0 0 0 8px rgba(255,198,79,0)}}

/* KI Overlay (popover full-ish) */
.ki-overlay{position:fixed;inset:0;background:rgba(26,22,20,0.42);z-index:95;display:none;align-items:flex-end;justify-content:center;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;transition:opacity 240ms var(--ease-out)}
.ki-overlay.open{display:flex;opacity:1}
.ki-overlay-inner{background:var(--card);border-radius:24px 24px 0 0;width:100%;max-width:480px;height:85dvh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 -8px 40px rgba(26,22,20,0.18);transform:translateY(100%);transition:transform 420ms cubic-bezier(0.32,0.72,0,1)}
.ki-overlay.open .ki-overlay-inner{transform:translateY(0)}
@supports not (height:100dvh){.ki-overlay-inner{height:85vh}}
.ki-overlay-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px 12px;border-bottom:1px solid var(--border)}
.ki-overlay-title{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:500;color:var(--text);letter-spacing:-0.3px}
.ki-dot{width:8px;height:8px;border-radius:99px;background:var(--green);animation:breathe 2.4s var(--ease-in-out) infinite}

/* ================= KALORIEN-TRACKER ================= */
/* Toolbar: Date nav + Settings */
.trk-toolbar{display:flex;align-items:center;gap:6px;background:var(--card);border:1px solid var(--border);border-radius:99px;padding:5px;margin-bottom:14px;box-shadow:var(--shadow-xs)}
.trk-date-label{font-size:13px;font-weight:500;color:var(--text);letter-spacing:-0.2px;cursor:pointer;flex:1;text-align:center;font-feature-settings:"ss01"}
.trk-date-label small{color:var(--text-soft);font-weight:500;letter-spacing:0;font-size:11px}
.trk-date-btn{background:var(--lime-bright);border:none;border-radius:99px;width:32px;height:32px;cursor:pointer;color:var(--text-mid);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 200ms var(--ease-swift),transform 140ms var(--ease-out)}
.trk-date-btn:hover{background:var(--lime)}
.trk-date-btn:active{transform:scale(0.92)}
.trk-settings-btn{background:var(--lime-bright);border:none;border-radius:99px;width:32px;height:32px;cursor:pointer;color:var(--text-mid);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 200ms var(--ease-swift),transform 140ms var(--ease-out),color 200ms var(--ease-swift)}
.trk-settings-btn:hover{background:var(--text);color:#fff}
.trk-settings-btn:active{transform:scale(0.92)}

/* Hero Ring — compact side-by-side */
.trk-hero{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px 16px 14px;margin-bottom:12px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.trk-hero-compact{padding:14px 14px 12px}
.trk-hero.future{background:linear-gradient(180deg,var(--card) 0%,var(--lime-bright) 100%);border-color:var(--momo-sand)}
.trk-future-badge{position:absolute;top:10px;right:12px;background:var(--green);color:#fff;font-size:9px;font-weight:600;letter-spacing:1.2px;text-transform:uppercase;padding:3px 10px;border-radius:99px;z-index:1;font-family:'Geist Mono',ui-monospace,monospace}
.trk-hero-row{display:flex;align-items:center;gap:16px;margin-bottom:10px}
.trk-ring{position:relative;width:124px;height:124px;flex-shrink:0}
.trk-ring svg{display:block}
.trk-ring svg .trk-ring-fg{transition:stroke-dashoffset 700ms var(--ease-swift),stroke 400ms var(--ease-swift)}
.trk-ring-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.trk-ring-num{font-size:30px;font-weight:400;color:var(--text);letter-spacing:-1.4px;line-height:1;font-feature-settings:"ss01";font-variant-numeric:tabular-nums}
.trk-ring-unit{font-size:9px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.6px;font-weight:500;font-family:'Geist Mono',ui-monospace,monospace;margin-top:3px}
.trk-ring.over .trk-ring-num{color:var(--danger)}
.trk-hero-stats{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.trk-stat-row{display:flex;align-items:center;gap:8px;font-size:13px;font-variant-numeric:tabular-nums}
.trk-stat-row-btn{cursor:pointer;transition:opacity 160ms ease-out,transform 160ms ease-out;margin:-4px -6px;padding:4px 6px;border-radius:8px;user-select:none;-webkit-tap-highlight-color:transparent}
.trk-stat-row-btn:hover{background:rgba(26,22,20,0.035)}
.trk-stat-row-btn:active{transform:scale(0.97);background:rgba(26,22,20,0.06)}
.trk-stat-row-add{margin-left:auto;color:var(--text-soft);opacity:0.7}
.trk-stat-row-btn:hover .trk-stat-row-add{opacity:1;color:var(--text)}
/* Manual Burn Sheet */
.mburn-list{display:flex;flex-direction:column;gap:8px;max-height:220px;overflow-y:auto}
.mburn-empty{font-size:13px;color:var(--text-soft);font-style:italic;padding:12px 4px;font-family:var(--font-display),serif}
.mburn-item{display:flex;align-items:center;gap:12px;padding:10px 12px;background:var(--card);border:1px solid var(--border);border-radius:12px}
.mburn-item-info{flex:1;min-width:0;display:flex;align-items:baseline;gap:10px}
.mburn-item-kcal{font-size:16px;font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;letter-spacing:-0.2px}
.mburn-item-kcal small{font-size:10px;font-weight:500;color:var(--text-soft);margin-left:3px;letter-spacing:0.4px;text-transform:uppercase;font-family:'Geist Mono',ui-monospace,monospace}
.mburn-item-label{font-size:12px;color:var(--text-mid);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mburn-item-label-muted{color:var(--text-soft);font-style:italic}
.mburn-item-del{width:30px;height:30px;border-radius:50%;border:none;background:transparent;color:var(--text-soft);display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:background-color 160ms ease,color 160ms ease,transform 160ms ease-out}
.mburn-item-del:hover{background:rgba(140,58,42,0.08);color:#8C3A2A}
.mburn-item-del:active{transform:scale(0.92)}
.trk-stat-dot{width:6px;height:6px;border-radius:99px;flex-shrink:0}
.trk-stat-name{color:var(--text-mid);font-weight:500;letter-spacing:-0.1px;flex:1}
.trk-stat-val{color:var(--text);font-weight:500;letter-spacing:-0.3px}

/* Macro bars — kompakt */
.trk-macros{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.trk-macro{padding:0}
.trk-macro-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:4px}
.trk-macro-name{font-size:9px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.2px;font-weight:600;font-family:'Geist Mono',ui-monospace,monospace}
.trk-macro-val{font-size:11px;font-weight:500;color:var(--text);letter-spacing:-0.1px;font-variant-numeric:tabular-nums}
.trk-macro-val small{color:var(--text-soft);font-weight:500}
.trk-macro-bar{height:3px;background:var(--border);border-radius:99px;overflow:hidden}
.trk-macro-bar-fill{height:100%;border-radius:99px;transition:width 600ms var(--ease-swift)}

/* Sport inline */
.trk-sport-inline{background:var(--lime-bright);border:1px solid var(--border);border-radius:14px;padding:10px 14px;margin-bottom:12px;display:flex;align-items:center;gap:10px;font-size:12px;color:var(--text-mid)}
.trk-sport-inline-icon{font-size:16px;flex-shrink:0}
.trk-sport-inline-text{flex:1;font-weight:500;letter-spacing:-0.1px}
.trk-sport-inline-text strong{color:var(--accent);font-weight:600}
.trk-macro[data-t="protein"] .trk-macro-bar-fill{background:var(--momo-peach)}
.trk-macro[data-t="carbs"] .trk-macro-bar-fill{background:linear-gradient(90deg,#FFE7A8 0%,#FFC64F 100%)}
.trk-macro[data-t="fat"] .trk-macro-bar-fill{background:linear-gradient(90deg,#F5D3DA 0%,#D14B5F 100%)}

/* Meal cards — kompakt */
.trk-meal{background:var(--card);border:1px solid var(--border);border-radius:18px;margin-bottom:10px;box-shadow:var(--shadow);overflow:hidden;transition:transform 220ms var(--ease-spring-soft),box-shadow 220ms var(--ease-swift)}
.trk-meal:hover{transform:translateY(-1px);box-shadow:var(--shadow-lift)}
.trk-meal.filled{border-left:3px solid var(--green)}
.trk-meal-head{display:flex;align-items:center;gap:12px;padding:14px 14px 14px 16px;cursor:pointer;user-select:none;transition:background 200ms var(--ease-swift)}
.trk-meal-head:hover{background:var(--lime-bright)}
.trk-meal-icon{width:36px;height:36px;border-radius:12px;background:var(--lime);color:var(--green);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:18px}
.trk-meal-info{flex:1;min-width:0}
.trk-meal-row-1{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:3px}
.trk-meal-name{font-size:15px;font-weight:500;color:var(--text);letter-spacing:-0.3px;line-height:1.2}
.trk-meal-kcal-big{font-size:16px;font-weight:500;color:var(--text);letter-spacing:-0.3px;font-variant-numeric:tabular-nums;flex-shrink:0}
.trk-meal-kcal-big small{font-size:10px;color:var(--text-soft);font-weight:500;margin-left:2px;letter-spacing:-0.1px}
.trk-meal-macros-inline{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--text-mid);font-weight:500;font-family:'Geist Mono',ui-monospace,monospace;letter-spacing:0.2px;flex-wrap:wrap}
.trk-meal-macros-inline strong{color:var(--text);font-weight:600}
.trk-meal-count-badge{margin-left:auto;font-size:10px;color:var(--text);background:var(--lime);padding:2px 8px;border-radius:99px;font-weight:600;letter-spacing:0.3px;font-family:'Geist',sans-serif;text-transform:uppercase}
.trk-meal-add{background:var(--text);color:#fff;border:none;border-radius:50%;width:34px;height:34px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:transform 160ms var(--ease-spring-soft),background 200ms var(--ease-swift);box-shadow:0 2px 6px rgba(26,22,20,0.18)}
.trk-meal-add:hover{background:var(--btn-primary-hover)}
.trk-meal-add:active{transform:scale(0.88)}

/* Meal Detail Modal */
.mmd-summary{background:transparent;color:#fff;padding:22px 20px;position:relative;overflow:hidden}
.mmd-summary::after{content:"";position:absolute;top:-40%;right:-15%;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(255,198,79,0.18) 0%,transparent 70%);pointer-events:none}
.mmd-summary-kcal{font-size:36px;font-weight:500;letter-spacing:-1.4px;line-height:1;font-variant-numeric:tabular-nums;font-feature-settings:"ss01";position:relative;z-index:1}
.mmd-summary-kcal small{font-size:12px;opacity:0.65;margin-left:4px;font-weight:500;letter-spacing:-0.2px}
.mmd-summary-date{font-size:11px;color:var(--accent);text-transform:uppercase;letter-spacing:1.4px;font-weight:500;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:8px;position:relative;z-index:1}
.mmd-summary-macros{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px;position:relative;z-index:1}
.mmd-macro{background:rgba(255,255,255,0.1);backdrop-filter:blur(4px);border-radius:12px;padding:10px 12px}
.mmd-macro-name{font-size:10px;opacity:0.72;text-transform:uppercase;letter-spacing:1.2px;font-weight:600;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:3px}
.mmd-macro-val{font-size:15px;font-weight:500;letter-spacing:-0.3px;font-variant-numeric:tabular-nums}
.mmd-macro-val small{font-size:10px;opacity:0.6;margin-left:2px;font-weight:500}

.mmd-items{padding:18px 20px 10px}
.mmd-items-title{font-size:10px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.4px;font-weight:500;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:12px}
.mmd-item{display:flex;align-items:stretch;gap:4px;background:var(--card);border:1px solid var(--border);border-radius:14px;margin-bottom:8px;transition:border-color 200ms var(--ease-swift);box-shadow:var(--shadow-xs);overflow:hidden}
.mmd-item:hover{border-color:var(--text)}
.mmd-item-tap{flex:1;display:flex;align-items:center;gap:14px;padding:14px;cursor:pointer;min-width:0;transition:background 180ms var(--ease-swift)}
.mmd-item-tap:active{background:var(--lime-bright)}
.mmd-item-main{flex:1;min-width:0}
.mmd-item-name{font-size:14px;font-weight:500;color:var(--text);letter-spacing:-0.2px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mmd-item-meta{font-size:11px;color:var(--text-soft);margin-top:4px;font-family:'Geist Mono',ui-monospace,monospace;letter-spacing:0.2px}
.mmd-item-kcal{font-size:15px;font-weight:500;color:var(--text);font-variant-numeric:tabular-nums;letter-spacing:-0.3px;flex-shrink:0}
.mmd-item-kcal small{font-size:10px;color:var(--text-soft);font-weight:500;margin-left:2px}
.mmd-item-del{background:transparent;border:none;border-left:1px solid var(--border);color:var(--text-soft);width:44px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 180ms var(--ease-swift),color 180ms var(--ease-swift)}
.mmd-item-del:hover{background:var(--danger-soft);color:var(--danger)}
.mmd-item-del:active{background:var(--danger);color:#fff}

.mmd-add-cta{padding:6px 20px 26px;text-align:center}
.mmd-add-btn{display:inline-flex;align-items:center;gap:8px;background:var(--text);color:#fff;border:none;border-radius:99px;padding:14px 28px;font-size:14px;font-weight:500;cursor:pointer;letter-spacing:-0.2px;font-family:inherit;box-shadow:0 1px 2px rgba(26,22,20,0.1),0 10px 24px -6px rgba(26,22,20,0.3);transition:transform 180ms var(--ease-spring-soft),background 200ms var(--ease-swift)}
.mmd-add-btn:hover{background:var(--btn-primary-hover);transform:translateY(-1px)}
.mmd-add-btn:active{transform:scale(0.96)}
.mmd-add-btn svg{flex-shrink:0}

.mmd-empty{text-align:center;padding:28px 20px;color:var(--text-soft);font-size:14px;font-weight:500;line-height:1.5}
.mmd-empty-icon{font-size:40px;margin-bottom:10px;opacity:0.6}

/* Water tracker */
.trk-water{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:16px;margin-bottom:12px;box-shadow:var(--shadow)}
.trk-water-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:14px}
.trk-water-title-row{display:flex;align-items:center;gap:8px}
.trk-water-title{font-size:10px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.2px;font-weight:600;font-family:'Geist Mono',ui-monospace,monospace}
.trk-water-val{font-size:17px;font-weight:500;color:var(--text);letter-spacing:-0.4px;font-variant-numeric:tabular-nums;line-height:1;cursor:pointer;padding:4px 6px;margin:-4px -6px;border-radius:8px;transition:background 160ms var(--ease-swift),transform 140ms var(--ease-out);-webkit-tap-highlight-color:transparent}
.trk-water-val:hover{background:var(--cream)}
.trk-water-val:active{transform:scale(0.97)}
.trk-water-val small{color:var(--text-soft);font-weight:500;font-size:11px;margin-left:3px}
.trk-water-edit{background:var(--cream);border:1px solid var(--border);color:var(--text-soft);cursor:pointer;width:24px;height:24px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;padding:0;transition:color 180ms var(--ease-swift),background 180ms var(--ease-swift),border-color 180ms var(--ease-swift),transform 140ms var(--ease-out)}
.trk-water-edit:hover{color:var(--green);border-color:var(--green);background:var(--card)}
.trk-water-edit:active{transform:scale(0.88)}
.trk-water-edit svg{pointer-events:none}
/* Glasses: immer eine Reihe, gleichmäßig verteilt (Grid mit --gcount Spalten) */
.trk-water-glasses{display:grid;grid-template-columns:repeat(var(--gcount,8),minmax(0,1fr));gap:10px;align-items:end;margin-top:2px}
.trk-water-hint{margin-top:12px;display:flex;align-items:center;gap:8px;font-family:'Geist Mono',ui-monospace,monospace;font-size:10.5px;font-weight:500;color:var(--text-soft);letter-spacing:0.4px;text-transform:uppercase;font-variant-numeric:tabular-nums}
.trk-water-hint-count{color:var(--text);font-weight:600;letter-spacing:-0.1px;text-transform:none;font-size:12px}
.trk-water-hint-sep{width:3px;height:3px;border-radius:50%;background:var(--border);flex-shrink:0}
.trk-glass{background:none;border:0;padding:0;margin:0;cursor:pointer;width:100%;aspect-ratio:32/42;max-width:38px;justify-self:center;display:inline-block;transition:transform 220ms var(--ease-out);touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.trk-glass:active{transform:scale(0.88) translateY(-1px)}
.trk-glass-svg{width:100%;height:100%;display:block;overflow:visible}
.trk-glass-svg .g-body{fill:var(--lime-bright);stroke:var(--border);stroke-width:1.4;stroke-linejoin:round;transition:stroke 280ms var(--ease-out),fill 280ms var(--ease-out)}
.trk-glass-svg .g-rim{fill:none;stroke:var(--border);stroke-width:1.4;transition:stroke 280ms var(--ease-out)}
.trk-glass-svg .g-water{fill:var(--momo-peach,#F4B4A6);opacity:0;transform:translateY(8px);transform-origin:center 100%;transition:opacity 320ms var(--ease-out),transform 480ms cubic-bezier(0.34,1.35,0.64,1)}
.trk-glass-svg .g-water-top{fill:none;stroke:rgba(255,255,255,0.6);stroke-width:1;opacity:0;transition:opacity 320ms var(--ease-out) 60ms}
.trk-glass.full .g-body{stroke:#E89985;fill:transparent}
.trk-glass.full .g-rim{stroke:#E89985}
.trk-glass.full .g-water{opacity:1;transform:translateY(0)}
.trk-glass.full .g-water-top{opacity:1}
:root[data-theme="dark"] .trk-water-edit{background:rgba(255,255,255,0.04)}
:root[data-theme="dark"] .trk-glass-svg .g-body{fill:rgba(247,242,234,0.03);stroke:rgba(217,206,192,0.22)}
:root[data-theme="dark"] .trk-glass-svg .g-rim{stroke:rgba(217,206,192,0.22)}
:root[data-theme="dark"] .trk-glass.full .g-body{fill:transparent;stroke:rgba(244,180,166,0.7)}
:root[data-theme="dark"] .trk-glass.full .g-rim{stroke:rgba(244,180,166,0.7)}
:root[data-theme="dark"] .trk-glass-svg .g-water-top{stroke:rgba(255,255,255,0.35)}
:root[data-theme="dark"] .trk-water-hint-sep{background:rgba(217,206,192,0.28)}
:root[data-theme="dark"] .trk-water-hint-count{color:var(--momo-cream)}

/* Sport Integration */
.trk-sport{background:transparent;color:#fff;border-radius:20px;padding:14px 18px;margin-bottom:12px;display:flex;align-items:center;gap:12px;box-shadow:0 2px 4px rgba(26,22,20,0.08),0 14px 28px -10px rgba(26,22,20,0.24);position:relative;overflow:hidden}
.trk-sport-icon{width:36px;height:36px;border-radius:12px;background:rgba(255,255,255,0.14);color:var(--accent);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.trk-sport-main{flex:1;min-width:0}
.trk-sport-label{font-size:10px;opacity:0.72;text-transform:uppercase;letter-spacing:1.2px;font-weight:600;font-family:'Geist Mono',ui-monospace,monospace}
.trk-sport-val{font-size:17px;font-weight:500;letter-spacing:-0.4px;margin-top:3px;font-variant-numeric:tabular-nums}
.trk-sport-val small{opacity:0.6;font-size:11px;margin-left:3px;font-weight:500}

/* Onboarding */
.ob-wrap{padding:16px}
.ob-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:28px 24px;box-shadow:var(--shadow);margin-bottom:14px}
.ob-step-label{font-size:10px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.4px;font-weight:600;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:10px}
.ob-step-title{font-size:24px;font-weight:500;color:var(--text);letter-spacing:-1px;line-height:1.15;margin-bottom:8px}
.ob-step-sub{font-size:14px;color:var(--text-mid);line-height:1.5;margin-bottom:24px;font-weight:500}
.ob-progress{height:3px;background:var(--border);border-radius:99px;overflow:hidden;margin-bottom:22px}
.ob-progress-fill{height:100%;background:linear-gradient(90deg,var(--green) 0%,var(--accent) 100%);border-radius:99px;transition:width 500ms var(--ease-swift)}
.ob-opt-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ob-opt{background:var(--card);border:1.5px solid var(--border);border-radius:16px;padding:18px 14px;cursor:pointer;text-align:center;font-family:inherit;color:var(--text);transition:transform 160ms var(--ease-spring-soft),border-color 220ms var(--ease-swift),background 220ms var(--ease-swift)}
.ob-opt:hover{border-color:var(--text)}
.ob-opt:active{transform:scale(0.97)}
.ob-opt.sel{border-color:var(--text);background:var(--lime-bright);box-shadow:inset 0 0 0 1px var(--text)}
.ob-opt.ob-opt-slim{padding:10px 22px;font-size:13px;width:auto}
.ob-opt.ob-opt-slim .ob-opt-label{font-size:13px}
.ob-opt-icon{font-size:26px;margin-bottom:6px}
.ob-opt-label{font-size:13px;font-weight:500;letter-spacing:-0.1px}
.ob-opt-sub{font-size:11px;color:var(--text-soft);margin-top:3px;font-weight:500;letter-spacing:-0.1px;line-height:1.3}
.ob-input{font-size:22px;font-weight:500;text-align:center;padding:18px;background:var(--lime-bright);border:1.5px solid var(--border);border-radius:14px;letter-spacing:-0.5px;font-variant-numeric:tabular-nums}
.ob-input:focus{border-color:var(--text);background:var(--card)}
.ob-unit{display:block;text-align:center;font-size:11px;color:var(--text-soft);margin-top:8px;text-transform:uppercase;letter-spacing:1.4px;font-weight:600;font-family:'Geist Mono',ui-monospace,monospace}

/* Tap-friendly Number Stepper */
.ob-stepper{display:flex;align-items:center;justify-content:space-between;background:var(--lime-bright);border:1.5px solid var(--border);border-radius:18px;padding:10px 14px;gap:10px}
.ob-stepper-btn{width:48px;height:48px;border-radius:14px;background:var(--card);border:1px solid var(--border);font-size:24px;font-weight:500;color:var(--text);cursor:pointer;font-family:inherit;display:flex;align-items:center;justify-content:center;transition:transform 140ms var(--ease-spring-soft),background 200ms var(--ease-swift)}
.ob-stepper-btn:active{transform:scale(0.92);background:var(--text);color:#fff}
.ob-stepper-val{flex:1;text-align:center;font-size:46px;font-weight:500;color:var(--text);letter-spacing:-2.2px;font-variant-numeric:tabular-nums;line-height:1;font-feature-settings:"ss01"}
.ob-stepper-unit{font-size:14px;color:var(--text-mid);margin-left:6px;letter-spacing:-0.1px;font-weight:500}
.ob-quick-chips{display:flex;gap:8px;margin-top:14px;justify-content:center;flex-wrap:wrap}
.ob-quick-chip{padding:8px 16px;background:var(--card);border:1px solid var(--border);border-radius:99px;font-size:12px;font-weight:500;color:var(--text-mid);cursor:pointer;font-family:inherit;font-variant-numeric:tabular-nums;transition:background 200ms var(--ease-swift),color 200ms var(--ease-swift),border-color 200ms var(--ease-swift)}
.ob-quick-chip:hover{border-color:var(--text)}
.ob-quick-chip.sel{background:var(--text);color:#fff;border-color:var(--text)}

/* Live-Preview Pill */
.ob-live-preview{margin:18px 0 4px;background:transparent;color:#fff;border-radius:18px;padding:14px 18px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 2px 4px rgba(26,22,20,0.1),0 20px 40px -14px rgba(26,22,20,0.35);animation:ob-preview-in 420ms var(--ease-spring-soft)}
@keyframes ob-preview-in{0%{opacity:0;transform:translateY(10px)}100%{opacity:1;transform:translateY(0)}}
.ob-live-preview-lbl{font-size:10px;opacity:0.7;text-transform:uppercase;letter-spacing:1.3px;font-weight:600;font-family:'Geist Mono',ui-monospace,monospace}
.ob-live-preview-val{font-size:26px;font-weight:500;letter-spacing:-1px;font-variant-numeric:tabular-nums;line-height:1;margin-top:2px;color:var(--text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:currentColor}
.ob-live-preview-val small{font-size:11px;opacity:0.6;margin-left:3px;font-weight:500;-webkit-text-fill-color:rgba(255,255,255,0.6)}
.ob-live-preview-flame{width:40px;height:40px;border-radius:12px;background:radial-gradient(circle at 30% 20%,#F7CFB8 0%,#D98E6B 55%,#8C3A2A 100%);display:flex;align-items:center;justify-content:center;color:#3A1810;box-shadow:inset 0 1px 0 rgba(255,255,255,0.4),0 6px 18px -4px rgba(140,58,42,0.5)}

/* Progress Dots (zusätzlich zur Bar) */
.ob-progress-dots{display:flex;gap:6px;justify-content:center;margin-top:-10px;margin-bottom:20px}
.ob-progress-dot{width:6px;height:6px;border-radius:50%;background:var(--border);transition:background 300ms var(--ease-swift),transform 300ms var(--ease-swift)}
.ob-progress-dot.done{background:var(--green)}
.ob-progress-dot.active{background:var(--text);transform:scale(1.4)}
.ob-slider-wrap{padding:8px 0}
.ob-slider{width:100%;height:6px;background:var(--border);border-radius:99px;appearance:none;outline:none;margin:14px 0 8px}
.ob-slider::-webkit-slider-thumb{appearance:none;width:24px;height:24px;border-radius:50%;background:var(--text);border:3px solid #fff;box-shadow:0 2px 6px rgba(26,22,20,0.2);cursor:pointer}
.ob-slider-val{text-align:center;font-size:32px;font-weight:500;color:var(--text);letter-spacing:-1px;font-variant-numeric:tabular-nums}
.ob-slider-val small{font-size:13px;color:var(--text-soft);font-weight:500;margin-left:4px;letter-spacing:-0.1px}
.ob-warn{background:var(--danger-soft);color:var(--danger);border-radius:12px;padding:10px 14px;font-size:12px;font-weight:500;line-height:1.4;margin-top:12px}
.ob-nav{display:flex;gap:10px;margin-top:18px}
.ob-nav .btn,.ob-nav .btn-outline{flex:1}
.ob-result{background:transparent;color:#fff;border-radius:20px;padding:24px;margin-bottom:14px;text-align:center;position:relative;overflow:hidden}
.ob-result::after{content:"";position:absolute;top:-40%;right:-20%;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(255,198,79,0.22) 0%,transparent 70%);pointer-events:none}
.ob-result-label{font-size:10px;opacity:0.72;text-transform:uppercase;letter-spacing:1.4px;font-weight:600;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:10px;position:relative;z-index:1}
.ob-result-kcal{font-size:54px;font-weight:300;letter-spacing:-2px;line-height:1;font-variant-numeric:tabular-nums;font-feature-settings:"ss01";position:relative;z-index:1}
.ob-result-kcal small{font-size:14px;opacity:0.6;font-weight:500;margin-left:6px;letter-spacing:-0.2px}
.ob-result-macros{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-top:18px;position:relative;z-index:1}
.ob-result-macro{background:rgba(255,255,255,0.12);border-radius:12px;padding:10px 8px}
.ob-result-macro-name{font-size:9px;opacity:0.7;text-transform:uppercase;letter-spacing:1.2px;font-weight:600}
.ob-result-macro-val{font-size:16px;font-weight:500;margin-top:3px;letter-spacing:-0.3px}

/* Food Entry Modal */
.fe-search{display:flex;gap:8px;margin-bottom:12px}
.fe-search input{flex:1}

/* Smart Search */
.fe-smart-wrap{padding:14px 20px 10px;background:rgba(255,255,255,0.95);backdrop-filter:saturate(180%) blur(12px);-webkit-backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:3}
.fe-smart-search{position:relative;display:flex;align-items:center;background:var(--lime-bright);border:1.5px solid var(--border);border-radius:14px;padding:0 10px 0 44px;transition:border-color 200ms var(--ease-swift),background 200ms var(--ease-swift),box-shadow 200ms var(--ease-swift);margin-bottom:10px}
.fe-smart-search:focus-within{border-color:var(--text);background:var(--card);box-shadow:0 0 0 4px rgba(26,22,20,0.06)}
.fe-smart-icon{position:absolute;left:14px;color:var(--text-soft);pointer-events:none;flex-shrink:0}
.fe-smart-search:focus-within .fe-smart-icon{color:var(--text)}
.fe-smart-search input{flex:1;border:none!important;background:transparent!important;padding:14px 4px!important;font-size:15px!important;color:var(--text);font-family:inherit;outline:none;box-shadow:none!important;letter-spacing:-0.2px}
.fe-smart-clear{background:var(--lime);border:none;border-radius:99px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-mid);flex-shrink:0;transition:background 180ms ease,transform 140ms var(--ease-spring-soft)}
.fe-smart-clear:hover{background:var(--border)}
.fe-smart-clear:active{transform:scale(0.88)}

.fe-scan-btn{background:var(--card);border:1.5px solid var(--border);border-radius:99px;width:46px;height:46px;cursor:pointer;color:var(--text);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background 200ms var(--ease-swift),color 200ms var(--ease-swift),border-color 200ms var(--ease-swift)}
.fe-scan-btn:hover{border-color:var(--text);background:var(--lime-bright)}
.fe-tabs{display:flex;gap:4px;overflow-x:auto;padding:2px 0 10px;scrollbar-width:none;margin-bottom:10px}
.fe-tabs::-webkit-scrollbar{display:none}
.fe-tab{flex-shrink:0;padding:7px 14px;border-radius:99px;border:1px solid var(--border);background:var(--card);color:var(--text-mid);font-size:12px;font-weight:500;cursor:pointer;font-family:inherit;letter-spacing:-0.1px;transition:background 200ms var(--ease-swift),color 200ms var(--ease-swift),border-color 200ms var(--ease-swift)}
.fe-tab.active{background:var(--text);color:#fff;border-color:var(--text)}
.fe-list{padding:10px 20px 0}
.fe-item{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--card);border:1px solid var(--border);border-radius:14px;margin-bottom:6px;cursor:pointer;transition:transform 180ms var(--ease-swift),border-color 200ms var(--ease-swift)}
.fe-item:hover{border-color:var(--text);transform:translateX(2px)}
.fe-item-main{flex:1;min-width:0}
.fe-item-name{font-size:14px;font-weight:500;color:var(--text);letter-spacing:-0.2px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fe-item-meta{font-size:10px;color:var(--text-soft);margin-top:3px;font-family:'Geist Mono',ui-monospace,monospace;letter-spacing:0.2px}
.fe-item-kcal{font-size:13px;font-weight:500;color:var(--text);font-variant-numeric:tabular-nums;flex-shrink:0}
.fe-item-kcal small{font-size:9px;color:var(--text-soft);font-weight:500;margin-left:2px}
.fe-empty{text-align:center;padding:30px 20px;color:var(--text-soft);font-size:13px}

/* Food Amount Screen */
.fa-head{text-align:center;margin-bottom:20px}
.fa-name{font-size:20px;font-weight:500;color:var(--text);letter-spacing:-0.6px;line-height:1.2;margin-bottom:4px}
.fa-brand{font-size:11px;color:var(--text-soft);font-family:'Geist Mono',ui-monospace,monospace;text-transform:uppercase;letter-spacing:1px;font-weight:500}
.fa-amount{display:flex;align-items:center;gap:8px;margin:12px 0 18px}
.fa-amount input{flex:1;font-size:20px;font-weight:500;text-align:center;padding:14px;background:var(--lime-bright);border:1.5px solid var(--border);border-radius:14px;letter-spacing:-0.4px;font-variant-numeric:tabular-nums}
.fa-amount input:focus{border-color:var(--text);background:var(--card)}
.fa-amount-unit{font-size:13px;color:var(--text-soft);font-weight:500;padding:0 6px;font-family:'Geist Mono',ui-monospace,monospace;letter-spacing:0.5px}
.fa-quick{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:16px}
.fa-quick-btn{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:7px;font-size:11px;font-weight:500;color:var(--text-mid);cursor:pointer;transition:background 200ms var(--ease-swift),color 200ms var(--ease-swift),border-color 200ms var(--ease-swift)}
.fa-quick-btn:hover{background:var(--lime-bright);color:var(--text);border-color:var(--text)}
.fa-nutri-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:14px}
/* Detail-Nährwerte (Lifesum-Style): gruppiert mit Divider, Lock-Icon bei fehlenden Daten */
.prod-nutri-detail{display:flex;flex-direction:column;gap:14px;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px 16px;margin-bottom:16px}
.prod-nutri-detail-group{display:flex;flex-direction:column;gap:8px}
.prod-nutri-detail-group + .prod-nutri-detail-group{border-top:1px solid var(--border);padding-top:12px}
.prod-nutri-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--text)}
.prod-nutri-row-label{color:var(--text-mid)}
.prod-nutri-row-val{font-variant-numeric:tabular-nums;font-weight:500}
.prod-nutri-row-val small{font-size:10px;color:var(--text-mid);font-weight:400;margin-left:2px}
.prod-nutri-row-locked .prod-nutri-row-label{color:var(--text-mid);opacity:0.7}
.prod-nutri-row-locked .prod-nutri-row-val{opacity:0.4}
.prod-nutri-row-premium{transition:opacity 160ms var(--ease-swift)}
.prod-nutri-row-premium:active{opacity:0.5}
.fa-meal-pick{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:14px}
.fa-meal-btn{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:10px 4px;font-size:11px;font-weight:500;color:var(--text-mid);cursor:pointer;text-align:center;font-family:inherit;transition:background 200ms var(--ease-swift),color 200ms var(--ease-swift),border-color 200ms var(--ease-swift)}
.fa-meal-btn.sel{background:var(--text);color:#fff;border-color:var(--text)}
.fa-meal-btn-icon{font-size:18px;display:block;margin-bottom:3px}

/* ================= HOME / HAUPTMENÜ ================= */
.home-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:20px}
.home-greet-label{font-size:11px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.5px;font-weight:500;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:6px}
.home-greet-title{font-size:22px;font-weight:500;color:var(--text);letter-spacing:-0.8px;line-height:1.15;font-feature-settings:"ss01","ss02"}
.home-greet-sub{font-size:13px;color:var(--text-mid);margin-top:6px;font-weight:500;letter-spacing:-0.1px}
.home-settings-btn{background:var(--card);border:1px solid var(--border);border-radius:14px;width:42px;height:42px;cursor:pointer;color:var(--text-mid);display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:var(--shadow-xs);transition:transform 220ms var(--ease-spring-soft),background 220ms var(--ease-swift),color 220ms var(--ease-swift),border-color 220ms var(--ease-swift)}
.home-settings-btn:hover{color:var(--text);border-color:var(--text)}
.home-settings-btn:active{transform:scale(0.92) rotate(45deg)}
.home-settings-btn svg{display:block;transition:transform 600ms var(--ease-in-out)}
.home-settings-btn:hover svg{transform:rotate(60deg)}

/* Bento grid */
.home-bento{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:minmax(110px,auto);gap:10px;margin-bottom:18px}

/* Widget Edit — minimaler Link oben rechts über dem Bento */
.home-bento-head{display:flex;justify-content:flex-end;margin:0 0 8px}
.home-widget-edit-link{display:inline-flex;align-items:center;gap:5px;background:transparent;border:none;color:var(--text-soft);font-size:12px;font-weight:500;font-family:inherit;letter-spacing:-0.1px;cursor:pointer;padding:6px 4px;transition:color 180ms var(--ease-swift)}
.home-widget-edit-link:hover{color:var(--text)}
.home-widget-edit-link svg{opacity:0.7;transition:opacity 180ms var(--ease-swift)}
.home-widget-edit-link:hover svg{opacity:1}

/* Widget Picker Sheet */
.wp-wrap{padding:18px 16px 30px;display:flex;flex-direction:column;gap:16px}
.wp-intro{background:var(--lime-bright);border:1px solid var(--border);border-radius:14px;padding:14px 16px;font-size:12.5px;color:var(--text-mid);line-height:1.55;letter-spacing:-0.1px}
.wp-intro strong{color:var(--text);font-weight:600}
.wp-section{display:flex;flex-direction:column;gap:8px}
.wp-section-title{font-size:10px;letter-spacing:1.2px;text-transform:uppercase;color:var(--text-mid);font-weight:600;font-family:'Geist Mono',ui-monospace,monospace;padding:0 4px}
.wp-empty{background:var(--card);border:1px dashed var(--border);border-radius:14px;padding:20px;text-align:center;font-size:13px;color:var(--text-soft);letter-spacing:-0.1px}
.wp-list{display:flex;flex-direction:column;gap:6px}
.wp-row{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:12px 14px;transition:border-color 200ms var(--ease-swift)}
.wp-row.enabled{background:linear-gradient(90deg,var(--card) 0%,var(--lime-bright) 100%);border-color:var(--momo-peach)}
.wp-row-ico{width:32px;height:32px;border-radius:10px;background:var(--lime-bright);color:var(--text-mid);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.wp-row.enabled .wp-row-ico{background:var(--lime);color:var(--green)}
.wp-row-name{flex:1;font-size:13.5px;font-weight:500;color:var(--text);letter-spacing:-0.15px;display:flex;align-items:center;gap:8px;min-width:0}
.wp-size{display:inline-flex;align-items:center;gap:5px;font-family:'Geist Mono',ui-monospace,monospace;font-size:9px;font-weight:600;letter-spacing:1.2px;text-transform:uppercase;padding:3px 7px;border-radius:99px;flex-shrink:0}
.wp-size.wide{color:var(--momo-ink-soft);background:var(--momo-sand);opacity:0.85}
.wp-size.half{color:var(--momo-ink-soft);border:1px solid var(--momo-sand);background:transparent}
.wp-size::before{content:"";display:block;width:10px;height:6px;border-radius:2px;background:currentColor;opacity:0.6}
.wp-size.half::before{width:5px}
:root[data-theme="dark"] .wp-size.wide{background:rgba(217,206,192,0.15);color:var(--momo-ink-mid)}
:root[data-theme="dark"] .wp-size.half{border-color:rgba(217,206,192,0.25);color:var(--momo-ink-mid)}
/* Widget-Picker Dark-Overrides (hartcodierte #fff/#CFE8D4/--text-Werte unbrauchbar in dark) */
:root[data-theme="dark"] .wp-row.enabled{background:var(--momo-sand);border-color:var(--momo-sand)}
:root[data-theme="dark"] .wp-row.enabled .wp-row-ico{background:rgba(245,184,171,0.15);color:var(--momo-peach)}
:root[data-theme="dark"] .wp-btn.add{background:var(--momo-peach);color:var(--momo-charcoal);border-color:var(--momo-peach)}
:root[data-theme="dark"] .wp-btn.add:hover:not(:disabled){background:var(--momo-peach);border-color:var(--momo-peach);opacity:0.88}
:root[data-theme="dark"] .wp-btn:hover:not(:disabled){background:var(--momo-sand);color:var(--momo-cream);border-color:var(--momo-sand)}
.wp-row-actions{display:flex;gap:4px}
.wp-btn{width:32px;height:32px;border-radius:10px;background:var(--card);border:1px solid var(--border);color:var(--text-mid);cursor:pointer;display:flex;align-items:center;justify-content:center;font-family:inherit;transition:background 180ms var(--ease-swift),color 180ms var(--ease-swift),border-color 180ms var(--ease-swift),transform 140ms var(--ease-spring-soft)}
.wp-btn:hover:not(:disabled){background:var(--text);color:#fff;border-color:var(--text)}
.wp-btn:active:not(:disabled){transform:scale(0.9)}
.wp-btn:disabled{opacity:0.3;cursor:not-allowed}
.wp-btn.danger{color:var(--danger);border-color:transparent;background:var(--danger-soft)}
.wp-btn.danger:hover:not(:disabled){background:var(--danger);color:#fff}
.wp-btn.add{background:var(--text);color:#fff;border-color:var(--text);width:36px;height:36px}
.wp-btn.add:hover:not(:disabled){background:var(--green);border-color:var(--green)}
.wp-footer{margin-top:8px;text-align:center}
.wp-reset{background:transparent;border:none;color:var(--text-soft);font-size:12px;cursor:pointer;font-family:inherit;letter-spacing:-0.05px;text-decoration:underline;text-underline-offset:3px;padding:8px}
.wp-reset:hover{color:var(--text)}
.bento{background:var(--card);border:1px solid var(--border);border-radius:22px;padding:18px;box-shadow:var(--shadow);position:relative;overflow:hidden;cursor:pointer;transition:transform 280ms var(--ease-spring-soft),box-shadow 280ms var(--ease-swift);animation:staggerIn 520ms var(--ease-swift) both;animation-delay:calc(var(--index,0) * 60ms)}
.bento:hover{transform:translateY(-3px);box-shadow:var(--shadow-lift)}
.bento:active{transform:translateY(0) scale(0.985)}
.bento-wide{grid-column:1 / -1}
.bento-tall{grid-row:span 2}
.bento-label{font-size:10px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.4px;font-weight:500;font-family:'Geist Mono',ui-monospace,monospace;display:flex;align-items:center;gap:6px}
.bento-value{font-size:34px;font-weight:400;color:var(--text);letter-spacing:-1.5px;line-height:1;margin-top:10px;font-variant-numeric:tabular-nums;font-feature-settings:"ss01"}
.bento-value small{font-size:14px;font-weight:500;color:var(--text-soft);margin-left:6px;letter-spacing:-0.1px}
.bento-sub{font-size:12px;color:var(--text-mid);margin-top:8px;font-weight:500;letter-spacing:-0.1px;line-height:1.45}
.bento-icon{width:32px;height:32px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:var(--green);background:var(--lime);flex-shrink:0}
.bento-icon svg{display:block}
.bento-accent{background:transparent;color:#fff;border-color:transparent;box-shadow:0 2px 4px rgba(26,22,20,0.08),0 18px 36px -14px rgba(26,22,20,0.28),inset 0 1px 0 rgba(255,255,255,0.08)}
.bento-accent::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,0.08) 48%,transparent 66%);pointer-events:none;animation:shineSweep 7s var(--ease-in-out) infinite;z-index:1}
.bento-accent::after{content:"";position:absolute;top:-40%;right:-20%;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(255,198,79,0.22) 0%,transparent 70%);pointer-events:none}
.bento-accent .bento-label{color:rgba(255,255,255,0.72)}
.bento-accent .bento-value{color:#fff;position:relative;z-index:2}
.bento-accent .bento-value small{color:rgba(255,255,255,0.6)}
.bento-accent .bento-sub{color:rgba(255,255,255,0.72);position:relative;z-index:2}
.bento-accent .bento-icon{background:rgba(255,255,255,0.14);color:var(--accent);position:relative;z-index:2}

/* Home quick actions (CTA stack) */
.home-cta-stack{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:18px}
.home-cta{background:var(--card);border:1px solid var(--border);border-radius:22px;padding:18px;cursor:pointer;display:flex;align-items:flex-start;gap:12px;box-shadow:var(--shadow);transition:transform 220ms var(--ease-spring-soft),box-shadow 220ms var(--ease-swift),border-color 220ms var(--ease-swift);position:relative;overflow:hidden;text-align:left;font-family:inherit;color:var(--text)}
.home-cta:hover{transform:translateY(-2px);box-shadow:var(--shadow-lift);border-color:var(--text)}
.home-cta:active{transform:scale(0.985)}
.home-cta-icon{width:38px;height:38px;border-radius:12px;background:var(--lime);color:var(--green);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.home-cta-title{font-size:14px;font-weight:500;color:var(--text);letter-spacing:-0.2px;line-height:1.2}
.home-cta-sub{font-size:11px;color:var(--text-soft);margin-top:3px;font-weight:500;letter-spacing:-0.1px;line-height:1.35}

/* Stats-Quick-Widget — 3 Kennzahlen + Link auf Detail-Sheet */
.home-stats-quick{background:var(--card);border:1px solid var(--border);border-radius:22px;padding:18px 20px;margin-bottom:8px;box-shadow:var(--shadow)}
.home-stats-quick-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px}
.home-stats-quick-title{font-size:11px;letter-spacing:1.4px;color:var(--text-mid);text-transform:uppercase;font-weight:600;font-family:'Geist Mono',ui-monospace,monospace}
.home-stats-quick-link{font-size:12px;color:var(--text);font-weight:500;letter-spacing:-0.1px;cursor:pointer;display:inline-flex;align-items:center;gap:4px;padding:5px 10px;border-radius:99px;border:1px solid var(--border);background:var(--card);font-family:inherit;transition:background 200ms var(--ease-swift),color 200ms var(--ease-swift),border-color 200ms var(--ease-swift)}
.home-stats-quick-link:hover{background:var(--text);color:var(--bg);border-color:var(--text)}
.home-stats-quick-grid{display:grid;grid-template-columns:1fr 1px 1fr 1px 1fr;gap:14px;align-items:center}
.home-stats-quick-item{text-align:center}
.home-stats-quick-divider{background:var(--border);height:38px;align-self:center}
.home-stats-quick-num{font-size:24px;font-weight:500;color:var(--text);letter-spacing:-0.8px;line-height:1;font-variant-numeric:tabular-nums;font-feature-settings:"ss01"}
.home-stats-quick-num small{font-size:11px;color:var(--text-mid);margin-left:3px;font-weight:500;letter-spacing:-0.1px}
.home-stats-quick-lbl{font-size:10px;color:var(--text-soft);letter-spacing:0.8px;text-transform:uppercase;font-weight:500;margin-top:6px;font-family:'Geist Mono',ui-monospace,monospace}

/* ═══════════════════════════════════════════════════════════
   STATS DASHBOARD — Bento 2.0 mit SVG-Charts
   ═══════════════════════════════════════════════════════════ */
.mstats-wrap{padding:16px;display:grid;grid-template-columns:1fr 1fr;gap:10px;grid-auto-rows:minmax(130px,auto)}

/* Generische Bento-Tile */
.mst-tile{background:var(--card);border:1px solid var(--border);border-radius:22px;padding:18px;position:relative;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column}
.mst-tile.wide{grid-column:1/-1}
.mst-tile.tall{grid-row:span 2}
.mst-tile-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.mst-tile-lbl{font-size:10px;letter-spacing:1.2px;text-transform:uppercase;color:var(--text-mid);font-family:'Geist Mono',ui-monospace,monospace;font-weight:600}
.mst-tile-ico{width:24px;height:24px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--text-mid);background:var(--lime-bright)}
.mst-tile-val{font-size:30px;font-weight:500;color:var(--text);letter-spacing:-1.2px;line-height:1;font-variant-numeric:tabular-nums;font-feature-settings:"ss01";margin-bottom:4px}
.mst-tile-val small{font-size:12px;color:var(--text-mid);margin-left:3px;font-weight:500;letter-spacing:-0.15px}
.mst-tile-sub{font-size:11px;color:var(--text-soft);letter-spacing:-0.05px;margin-top:auto}
.mst-tile-delta{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:600;padding:2px 8px;border-radius:99px;font-family:'Geist Mono',ui-monospace,monospace;letter-spacing:0.2px}
.mst-tile-delta.up{background:var(--lime);color:var(--text)}
.mst-tile-delta.down{background:var(--warn-bg);color:var(--warn-text)}
.mst-tile-delta.flat{background:var(--lime-bright);color:var(--text-soft)}

/* Hero-Tile: Streak */
.mst-hero{grid-column:1/-1;background:transparent;color:#fff;border:none;padding:22px;isolation:isolate}
.mst-hero::before{content:"";position:absolute;top:-30%;right:-15%;width:65%;height:85%;background:radial-gradient(circle,rgba(255,166,54,0.4) 0%,transparent 65%);filter:blur(32px);z-index:-1;pointer-events:none}
.mst-hero-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px}
.mst-hero-flame{width:44px;height:44px;border-radius:50%;background:radial-gradient(circle at 30% 20%,#F7CFB8 0%,#D98E6B 55%,#8C3A2A 100%);display:flex;align-items:center;justify-content:center;color:#3A1810;box-shadow:inset 0 1px 0 rgba(255,255,255,0.4),0 8px 20px -4px rgba(140,58,42,0.5)}
.mst-hero-lbl{font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:rgba(255,255,255,0.55);font-family:'Geist Mono',ui-monospace,monospace;font-weight:600;margin-bottom:4px}
.mst-hero-num{font-size:48px;font-weight:500;letter-spacing:-2.2px;line-height:1;font-variant-numeric:tabular-nums;color:var(--text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:currentColor}
.mst-hero-num small{font-size:13px;opacity:0.65;margin-left:4px;font-weight:500;letter-spacing:-0.1px;-webkit-text-fill-color:rgba(255,255,255,0.65)}
.mst-hero-sub{font-size:12px;color:rgba(255,255,255,0.6);margin-top:8px;letter-spacing:-0.1px}
.mst-hero-dots{display:flex;gap:4px;margin-top:16px}
.mst-hero-dot{flex:1;height:6px;border-radius:3px;background:rgba(255,255,255,0.1)}
.mst-hero-dot.done{background:linear-gradient(90deg,#E8A488 0%,#D98E6B 100%)}

/* Chart-Container */
.mst-chart-wrap{flex:1;display:flex;align-items:flex-end;margin-top:6px;min-height:60px}
.mst-chart-wrap svg{width:100%;height:auto;overflow:visible}
.mst-chart-axis{font-size:9px;fill:var(--text-soft);font-family:'Geist Mono',ui-monospace,monospace;letter-spacing:0.2px}
.mst-bar{fill:var(--text);opacity:0.85;transition:opacity 200ms var(--ease-out)}
.mst-bar.today{fill:url(#mstGrad)}
.mst-bar-empty{fill:var(--border)}
.mst-line{fill:none;stroke:url(#mstGrad);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.mst-line-area{fill:url(#mstAreaGrad);opacity:0.25}
.mst-line-dot{fill:var(--accent);stroke:#fff;stroke-width:2}

/* Donut / Ring Chart */
.mst-donut{display:flex;align-items:center;gap:14px;flex:1}
.mst-donut-svg{width:84px;height:84px;flex-shrink:0}
.mst-donut-track{fill:none;stroke:var(--lime-bright);stroke-width:10}
.mst-donut-fg{fill:none;stroke:url(#mstGrad);stroke-width:10;stroke-linecap:round;transition:stroke-dashoffset 800ms var(--ease-out)}
.mst-donut-num{font-size:18px;font-weight:500;fill:var(--text);text-anchor:middle;dominant-baseline:central;font-variant-numeric:tabular-nums}
.mst-donut-info{flex:1}
.mst-donut-info-num{font-size:20px;font-weight:500;color:var(--text);letter-spacing:-0.5px;line-height:1;font-variant-numeric:tabular-nums}
.mst-donut-info-lbl{font-size:11px;color:var(--text-soft);margin-top:3px;letter-spacing:-0.05px}

/* Heatmap */
.mst-heat-grid{display:grid;grid-template-columns:repeat(14,1fr);gap:3px;margin-top:auto}
.mst-heat-cell{aspect-ratio:1;border-radius:4px;background:#F2EDE1}
.mst-heat-cell.l1{background:#FBE5DE}
.mst-heat-cell.l2{background:#F4C4B0}
.mst-heat-cell.l3{background:#D98E6B}
.mst-heat-cell.l4{background:#8C3A2A}
.mst-heat-cell.today{outline:2px solid var(--text);outline-offset:1px}
.mst-heat-legend{display:flex;align-items:center;gap:4px;margin-top:8px;font-size:9px;color:var(--text-soft);font-family:'Geist Mono',ui-monospace,monospace;letter-spacing:0.3px;justify-content:flex-end}
.mst-heat-legend-sq{width:8px;height:8px;border-radius:2px}

.home-section-title{font-size:11px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.4px;font-weight:500;font-family:'Geist Mono',ui-monospace,monospace;margin:22px 0 12px;display:flex;justify-content:space-between;align-items:center}
.home-section-title .link{font-family:'Geist',sans-serif;font-size:12px;color:var(--text);font-weight:500;letter-spacing:-0.1px;text-transform:none;text-decoration:none;cursor:pointer;display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:99px;border:1px solid var(--border);transition:background 200ms var(--ease-swift),border-color 200ms var(--ease-swift)}
.home-section-title .link:hover{background:var(--text);color:#fff;border-color:var(--text)}

.home-mini-list{background:var(--card);border:1px solid var(--border);border-radius:22px;overflow:hidden;box-shadow:var(--shadow)}
.home-mini-item{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--border);transition:background 200ms var(--ease-swift)}
.home-mini-item:last-child{border-bottom:none}
.home-mini-item:hover{background:var(--lime-bright)}
.home-mini-dot{width:8px;height:8px;border-radius:99px;flex-shrink:0}
.home-mini-text{flex:1;font-size:14px;color:var(--text);font-weight:500;letter-spacing:-0.1px;line-height:1.3;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.home-mini-meta{font-size:11px;color:var(--text-soft);font-weight:500;letter-spacing:-0.1px;flex-shrink:0}

.home-empty{text-align:center;padding:28px 20px;color:var(--text-soft);font-size:13px;font-weight:500;letter-spacing:-0.1px;background:var(--lime-bright);border-radius:20px;border:1px dashed var(--border)}

/* ================= SETTINGS ================= */
.settings-head{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.settings-back{background:var(--card);border:1px solid var(--border);border-radius:14px;width:42px;height:42px;cursor:pointer;color:var(--text-mid);display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:var(--shadow-xs);transition:transform 180ms var(--ease-spring-soft),color 200ms var(--ease-swift),border-color 200ms var(--ease-swift)}
.settings-back:hover{color:var(--text);border-color:var(--text)}
.settings-back:active{transform:scale(0.92) translateX(-2px)}
.settings-head-title{font-size:24px;font-weight:500;color:var(--text);letter-spacing:-1px}
.settings-group{background:var(--card);border:1px solid var(--border);border-radius:22px;margin-bottom:16px;overflow:hidden;box-shadow:var(--shadow)}
.settings-group-title{font-size:10px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.4px;font-weight:500;font-family:'Geist Mono',ui-monospace,monospace;margin:0 0 8px 18px}
.settings-row{display:flex;align-items:center;gap:14px;padding:16px 18px;border-bottom:1px solid var(--border);transition:background 200ms var(--ease-swift);cursor:pointer;background:transparent;border-left:none;border-right:none;border-top:none;width:100%;font-family:inherit;text-align:left;color:var(--text)}
.settings-row:last-child{border-bottom:none}
.settings-row:hover{background:var(--lime-bright)}
.settings-row:active{background:var(--lime)}
.settings-row-icon{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:var(--lime);color:var(--green);flex-shrink:0}
.settings-row-icon.danger{background:var(--danger-soft);color:var(--danger)}
.settings-row-main{flex:1;min-width:0}
.settings-row-label{font-size:14px;font-weight:500;color:var(--text);letter-spacing:-0.2px;line-height:1.2}
.settings-row-sub{font-size:11px;color:var(--text-soft);margin-top:3px;font-weight:500;letter-spacing:-0.1px;line-height:1.4}
.settings-row-value{font-size:13px;color:var(--text-mid);font-weight:500;letter-spacing:-0.1px;font-variant-numeric:tabular-nums}
.settings-row-chevron{color:var(--text-soft);flex-shrink:0;transition:transform 200ms var(--ease-swift)}
.settings-row:hover .settings-row-chevron{transform:translateX(3px);color:var(--text)}
.settings-toggle{position:relative;width:42px;height:24px;border-radius:99px;background:var(--border);cursor:pointer;transition:background 260ms var(--ease-swift);flex-shrink:0;border:none}
.settings-toggle::after{content:"";position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:var(--card);box-shadow:0 1px 3px rgba(26,22,20,0.2);transition:transform 260ms var(--ease-spring-soft)}
.settings-toggle.on{background:var(--green)}
.settings-toggle.on::after{transform:translateX(18px)}
.settings-row-static{cursor:default}
.settings-row-static:active{transform:none}
/* Segmented theme control */
.theme-seg{display:inline-flex;gap:2px;background:var(--lime);border-radius:999px;padding:3px;flex-shrink:0}
.theme-seg button{border:none;background:transparent;color:var(--text-mid);font-family:inherit;font-size:12px;font-weight:500;letter-spacing:-0.1px;padding:6px 10px;border-radius:999px;cursor:pointer;transition:background 160ms var(--ease-swift),color 160ms var(--ease-swift)}
.theme-seg button.active{background:var(--card);color:var(--text);box-shadow:var(--shadow-sm)}
.theme-seg button:active{transform:scale(0.96)}
/* Abo-Verwalten Modal */
.msub-card{margin:18px 18px 8px;background:var(--lime-bright);border:1px solid var(--border);border-radius:var(--radius);padding:20px 20px 18px}
.msub-eyebrow{font-family:'Geist Mono',ui-monospace,monospace;font-size:11px;letter-spacing:1.4px;text-transform:uppercase;color:var(--text-soft);margin-bottom:6px}
.msub-title{font-size:22px;font-weight:500;letter-spacing:-0.6px;color:var(--text);margin-bottom:4px}
.msub-price{font-size:14px;color:var(--text-mid);font-variant-numeric:tabular-nums;margin-bottom:10px}
.msub-meta{font-size:12px;color:var(--text-soft);border-top:1px solid var(--border);padding-top:10px;margin-top:6px}
.msub-section{padding:18px 20px 4px}
.msub-section-title{font-size:13px;font-weight:600;color:var(--text);letter-spacing:-0.1px;margin-bottom:8px}
.msub-section-body{font-size:14px;line-height:1.55;color:var(--text-mid);letter-spacing:-0.05px;margin-bottom:12px;max-width:65ch}
.msub-section-body a{color:var(--text);text-decoration:none;border-bottom:1px solid var(--momo-peach)}
.msub-cta{display:inline-flex;align-items:center;justify-content:center;background:var(--text);color:var(--bg);font-family:inherit;font-weight:500;font-size:14px;padding:11px 18px;border-radius:12px;text-decoration:none;letter-spacing:-0.1px;transition:transform 160ms var(--ease-out)}
.msub-cta:active{transform:scale(0.97)}
.msub-foot{padding:18px 20px calc(env(safe-area-inset-bottom) + 24px);font-size:11px;color:var(--text-soft);text-align:center;letter-spacing:-0.05px}
.settings-brand{text-align:center;padding:20px 16px;color:var(--text-soft);font-size:12px;font-weight:500;letter-spacing:-0.1px;font-family:'Geist Mono',ui-monospace,monospace}
.settings-brand strong{color:var(--text);font-family:'Geist',sans-serif;font-weight:500;letter-spacing:-0.3px}

/* Auth Wall — blockt App bis angemeldet */
.auth-wall{position:fixed;inset:0;background:var(--card);z-index:500;display:none;overflow-y:auto;-webkit-overflow-scrolling:touch}
.auth-wall.open{display:block}
.auth-wall-inner{max-width:420px;margin:0 auto;padding:max(env(safe-area-inset-top),30px) 24px calc(env(safe-area-inset-bottom) + 40px);min-height:100svh;display:flex;flex-direction:column;justify-content:flex-start}
@supports not (height:100svh){.auth-wall-inner{min-height:100vh}}
.auth-wall-brand{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;margin-bottom:20px}
.auth-wall-brand-text{font-size:22px;font-weight:500;letter-spacing:-0.8px;color:var(--text);font-feature-settings:"ss01","ss02"}
.auth-wall-hero{margin:8px 0 22px}
.auth-wall-title{font-size:34px;font-weight:500;color:var(--text);letter-spacing:-1.8px;line-height:1.05;margin:0 0 12px;font-feature-settings:"ss01","ss02"}
.auth-wall-sub{font-size:15px;color:var(--text-mid);line-height:1.5;margin:0;font-weight:500;letter-spacing:-0.2px}
.auth-wall-tabs{display:flex;background:var(--lime-bright);border:1px solid var(--border);border-radius:99px;padding:4px;margin-bottom:16px}
.auth-wall-tab{flex:1;padding:11px 0;border:none;background:transparent;cursor:pointer;font-size:14px;font-weight:500;color:var(--text-mid);border-radius:99px;font-family:inherit;transition:background 220ms var(--ease-swift),color 220ms var(--ease-swift)}
.auth-wall-tab.active{background:var(--card);color:var(--text);box-shadow:0 1px 3px rgba(26,22,20,0.08)}
.auth-wall-form label{font-size:12px;font-weight:500;color:var(--text-mid);letter-spacing:-0.1px;margin:14px 0 6px}
.auth-wall-form input{width:100%;padding:14px 16px;border-radius:14px;border:1.5px solid var(--border);font-size:15px;background:var(--lime-bright);color:var(--text);font-family:inherit;outline:none;transition:background 200ms var(--ease-swift),color 200ms var(--ease-swift),border-color 200ms var(--ease-swift)}
.auth-wall-form input:focus{border-color:var(--text);background:var(--card);box-shadow:0 0 0 4px rgba(26,22,20,0.08)}
.pw-reveal-wrap{position:relative}
.pw-reveal-wrap input{padding-right:46px!important}
.pw-reveal-btn{position:absolute;top:50%;right:6px;transform:translateY(-50%);width:34px;height:34px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:10px;cursor:pointer;color:var(--text-soft);padding:0;transition:color 160ms var(--ease-out),background 160ms var(--ease-out)}
.pw-reveal-btn:hover{color:var(--text);background:rgba(26,22,20,0.06)}
.pw-reveal-btn:active{transform:translateY(-50%) scale(0.94)}
.auth-wall-error{background:var(--danger-soft);color:var(--danger);border-radius:12px;padding:10px 14px;font-size:13px;font-weight:500;line-height:1.4;margin-top:12px}
.auth-wall-submit{width:100%;margin-top:18px;padding:15px}
.auth-wall-footer{text-align:center;margin-top:16px;font-size:13px}
.auth-wall-footer a{color:var(--text-mid);text-decoration:underline;text-underline-offset:2px;font-weight:500}
.auth-wall-founders{margin-top:22px;padding:18px 18px 16px;border:1px solid var(--border);border-radius:16px;text-align:center;background:var(--lime-bright)}
.auth-wall-founders-line{font-size:12.5px;color:var(--text-mid);letter-spacing:-0.05px;margin-bottom:6px}
.auth-wall-founders-cta{display:inline-block;font-size:14px;font-weight:500;color:var(--text);letter-spacing:-0.15px;text-decoration:none;padding:4px 0;border-bottom:1px solid var(--text);transition:transform 160ms var(--ease-out)}
.auth-wall-founders-cta:active{transform:scale(0.97)}

/* Pre-Launch Auth-Wall — Waitlist-First */
.auth-wall-eyebrow{display:inline-block;font-size:11px;font-weight:600;letter-spacing:1.4px;text-transform:uppercase;color:var(--text-mid);padding:6px 12px;border:1px solid var(--border);border-radius:99px;background:var(--lime-bright);margin-bottom:4px;align-self:flex-start}
.auth-wall-waitlist-cta{display:flex;align-items:center;justify-content:center;text-decoration:none;margin-top:4px}
.auth-wall-note{font-size:12.5px;color:var(--text-mid);text-align:center;margin-top:12px;letter-spacing:-0.05px}
.auth-wall-signin-wrap{margin-top:auto;padding-top:40px;text-align:center}
.auth-wall-signin-toggle{background:none;border:none;cursor:pointer;font-family:inherit;font-size:13px;font-weight:500;color:var(--text-mid);letter-spacing:-0.1px;padding:8px 12px;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--border);transition:color 180ms var(--ease-swift),text-decoration-color 180ms var(--ease-swift)}
.auth-wall-signin-toggle:hover,.auth-wall-signin-toggle.open{color:var(--text);text-decoration-color:var(--text)}
.auth-wall-signin-wrap .auth-wall-form{margin-top:14px;text-align:left;padding:20px 18px 18px;border:1px solid var(--border);border-radius:16px;background:var(--lime-bright)}
.auth-wall-signin-wrap .auth-wall-form label:first-child{margin-top:0}

/* Deep-Link ?signin=1: Pre-Launch-Hero + Waitlist-CTA ausblenden,
   Signin-Block nach oben holen — User landet direkt beim Login */
.auth-wall-signin-direct .auth-wall-eyebrow,
.auth-wall-signin-direct .auth-wall-hero,
.auth-wall-signin-direct .auth-wall-waitlist-cta,
.auth-wall-signin-direct .auth-wall-note{display:none}
.auth-wall-signin-direct .auth-wall-signin-wrap{margin-top:24px;padding-top:0;text-align:left}
.auth-wall-signin-direct .auth-wall-signin-toggle{display:none}

/* Home-Welcome-Card — einmaliges Intro für neue User */
.home-welcome{margin:16px 16px 24px;padding:28px 24px 24px;border:1px solid var(--border);border-radius:22px;background:var(--lime-bright);font-feature-settings:"ss01","ss02"}
.home-welcome-eyebrow{font-size:11px;font-weight:600;letter-spacing:1.4px;text-transform:uppercase;color:var(--text-mid);margin-bottom:10px}
.home-welcome-title{font-family:"Fraunces",Georgia,serif;font-size:26px;font-weight:400;letter-spacing:-0.8px;line-height:1.15;color:var(--text);margin:0 0 10px}
.home-welcome-sub{font-size:14.5px;line-height:1.55;color:var(--text-mid);margin:0 0 18px;letter-spacing:-0.1px}
.home-welcome-list{list-style:none;padding:0;margin:0 0 22px;display:flex;flex-direction:column;gap:10px}
.home-welcome-list li{position:relative;padding:10px 12px 10px 14px;background:var(--card);border:1px solid var(--border);border-radius:12px;font-size:13.5px;line-height:1.5;color:var(--text-mid);letter-spacing:-0.1px}
.home-welcome-list li strong{color:var(--text);font-weight:600}
.home-welcome-cta{width:100%;padding:14px}

/* Paywall — Premium-Screen */
/* ═══════════════════════════════════════════════════════════
   FEATURE GATE v2 — editorial, matching Main Paywall
   Fokus: 1 Feature hervorheben + inline Plan-Auswahl
   ═══════════════════════════════════════════════════════════ */
.mfg-v2{background:#FAFAF7;min-height:100%;padding:36px 24px calc(env(safe-area-inset-bottom) + 24px);color:#111827;font-feature-settings:"ss01","ss02"}
.mfg-v2-feature{text-align:center;padding:8px 4px 28px;max-width:420px;margin:0 auto}
.mfg-v2-icon{width:64px;height:64px;border-radius:18px;background:var(--card);border:1px solid #E7E5E0;color:#111827;display:inline-flex;align-items:center;justify-content:center;margin-bottom:20px;box-shadow:0 1px 2px rgba(17,24,39,0.04),0 12px 28px -12px rgba(17,24,39,0.12)}
.mfg-v2-icon svg{width:28px;height:28px}
.mfg-v2-wordmark{font-size:10px;letter-spacing:1.6px;text-transform:uppercase;color:#C28B12;font-weight:600;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:10px}
.mfg-v2-title{font-size:26px;font-weight:500;letter-spacing:-0.9px;line-height:1.15;color:#111827;margin:0 0 10px;font-feature-settings:"ss01","ss02"}
.mfg-v2-desc{font-size:14px;color:#4B5563;line-height:1.55;letter-spacing:-0.1px;margin:0;max-width:42ch;margin-left:auto;margin-right:auto}
.mfg-v2-plans{display:flex;flex-direction:column;gap:8px;max-width:420px;margin:0 auto 16px}
.mfg-v2-plan{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;background:var(--card);border:1px solid #E7E5E0;border-radius:14px;cursor:pointer;font-family:inherit;text-align:left;width:100%;transition:border-color 200ms var(--ease-swift),box-shadow 200ms var(--ease-swift),transform 140ms var(--ease-spring-soft)}
.mfg-v2-plan:hover{border-color:#C9C5BD}
.mfg-v2-plan:active{transform:scale(0.995)}
.mfg-v2-plan.selected{border-color:#111827;box-shadow:0 0 0 1px #111827}
.mfg-v2-plan-radio{width:20px;height:20px;border-radius:50%;border:1.5px solid #D4D0C8;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px;transition:border-color 200ms var(--ease-swift)}
.mfg-v2-plan.selected .mfg-v2-plan-radio{border-color:#111827}
.mfg-v2-plan-radio-dot{width:10px;height:10px;border-radius:50%;background:#111827;transform:scale(0);transition:transform 220ms var(--ease-spring-soft)}
.mfg-v2-plan.selected .mfg-v2-plan-radio-dot{transform:scale(1)}
.mfg-v2-plan-body{flex:1;min-width:0}
.mfg-v2-plan-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:3px}
.mfg-v2-plan-name{font-size:14.5px;font-weight:500;color:#111827;letter-spacing:-0.2px}
.mfg-v2-plan-price{font-size:15px;font-weight:600;color:#111827;letter-spacing:-0.3px;font-variant-numeric:tabular-nums}
.mfg-v2-plan-bottom{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:12px;color:#6B7280;letter-spacing:-0.1px}
.mfg-v2-plan.recommended .mfg-v2-plan-note{color:#C28B12;font-weight:500}
.mfg-v2-trust{text-align:center;font-size:12px;color:#6B7280;letter-spacing:-0.05px;margin-bottom:18px}
.mfg-v2-actions{max-width:420px;margin:0 auto;display:flex;flex-direction:column;gap:10px}
.mfg-v2-cta{width:100%;background:#111827;color:#fff;border:none;border-radius:14px;padding:17px;font-family:inherit;font-size:15px;font-weight:500;letter-spacing:-0.15px;cursor:pointer;transition:transform 160ms var(--ease-spring-soft),background 200ms var(--ease-swift)}
.mfg-v2-cta:hover{background:#000}
.mfg-v2-cta:active{transform:scale(0.985)}
.mfg-v2-more{background:transparent;border:none;font-family:inherit;font-size:12.5px;color:#6B7280;cursor:pointer;letter-spacing:-0.05px;text-decoration:underline;text-underline-offset:3px;text-decoration-color:#D4D0C8;padding:8px;transition:color 180ms var(--ease-swift),text-decoration-color 180ms var(--ease-swift)}
.mfg-v2-more:hover{color:#111827;text-decoration-color:#111827}

/* ═══════════════════════════════════════════════════════════
   WEIGHT ENTRY v2 — Tap-Stepper Layout
   ═══════════════════════════════════════════════════════════ */
.spw-wrap{padding:24px 20px 30px;display:flex;flex-direction:column;gap:20px}
.spw-hero{text-align:center}
.spw-hero-lbl{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:var(--text-mid);font-family:'Geist Mono',ui-monospace,monospace;font-weight:600;margin-bottom:8px}
.spw-hero-val{font-size:72px;font-weight:500;color:var(--text);letter-spacing:-3.5px;line-height:1;font-variant-numeric:tabular-nums;font-feature-settings:"ss01"}
.spw-hero-val small{font-size:18px;color:var(--text-soft);margin-left:6px;font-weight:500;letter-spacing:-0.2px}
.spw-hero-delta{display:inline-flex;align-items:center;gap:5px;margin-top:10px;padding:5px 12px;border-radius:99px;font-size:11px;font-weight:600;letter-spacing:0.2px;font-family:'Geist Mono',ui-monospace,monospace}
.spw-hero-delta.up{background:var(--warn-bg);color:var(--warn-text)}
.spw-hero-delta.down{background:var(--lime);color:var(--text)}
.spw-hero-delta.flat{background:var(--lime-bright);color:var(--text-soft)}

.spw-stepper{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;background:var(--lime-bright);border:1.5px solid var(--border);border-radius:22px;padding:14px}
.spw-step-btn{width:64px;height:64px;border-radius:18px;background:var(--card);border:1px solid var(--border);font-size:28px;font-weight:500;color:var(--text);cursor:pointer;font-family:inherit;display:flex;align-items:center;justify-content:center;transition:transform 140ms var(--ease-spring-soft),background 200ms var(--ease-swift),color 200ms var(--ease-swift)}
.spw-step-btn:active{transform:scale(0.9);background:var(--text);color:#fff}
.spw-step-display{text-align:center;font-size:40px;font-weight:500;color:var(--text);letter-spacing:-1.5px;font-variant-numeric:tabular-nums;line-height:1;font-feature-settings:"ss01";cursor:pointer;user-select:none;padding:4px 8px;border-radius:10px;transition:background 160ms var(--ease-swift)}
.spw-step-display:hover{background:var(--cream)}
.spw-step-display:active{transform:scale(0.98)}
.spw-step-unit{font-size:14px;color:var(--text-mid);margin-left:4px;font-weight:500}
.spw-step-hint{text-align:center;font-size:10px;color:var(--text-soft);font-family:'Geist Mono',ui-monospace,monospace;letter-spacing:0.6px;margin-top:4px;text-transform:uppercase;font-weight:600}

.spw-chips{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.spw-chip{padding:10px 14px;background:var(--card);border:1px solid var(--border);border-radius:99px;font-size:12px;font-weight:600;color:var(--text);cursor:pointer;font-family:'Geist Mono',ui-monospace,monospace;letter-spacing:0.3px;transition:background 200ms var(--ease-swift),color 200ms var(--ease-swift),border-color 200ms var(--ease-swift);font-variant-numeric:tabular-nums}
.spw-chip:hover{border-color:var(--text);background:var(--text);color:#fff}
.spw-chip:active{transform:scale(0.94)}

.spw-date-row{display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap}
.spw-date-chip{padding:8px 14px;background:var(--card);border:1px solid var(--border);border-radius:99px;font-size:12px;font-weight:500;color:var(--text-mid);cursor:pointer;font-family:inherit;letter-spacing:-0.1px;transition:background 200ms var(--ease-swift),color 200ms var(--ease-swift),border-color 200ms var(--ease-swift)}
.spw-date-chip.active{background:var(--text);color:#fff;border-color:var(--text)}
.spw-date-input{margin-top:8px}
.spw-date-input input{font-family:inherit;padding:10px 14px;border-radius:12px;border:1.5px solid var(--border);background:var(--card);color:var(--text);font-size:13px;width:100%}

.spw-note-wrap{background:var(--lime-bright);border:1px solid var(--border);border-radius:14px;padding:4px 0}
.spw-note-wrap textarea{width:100%;background:transparent;border:none;padding:12px 16px;font-family:inherit;font-size:13px;color:var(--text);resize:none;letter-spacing:-0.1px;line-height:1.5;outline:none}
.spw-note-lbl{font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--text-soft);font-family:'Geist Mono',ui-monospace,monospace;font-weight:600;padding:8px 16px 0}

/* Maße-Section im Gewichts-Modal (aufklappbar) */
.spw-meas-section{background:var(--lime-bright);border:1px solid var(--border);border-radius:14px;overflow:hidden;transition:background 220ms var(--ease-swift)}
.spw-meas-section.open{background:var(--card)}
.spw-meas-toggle{display:flex;align-items:center;gap:10px;width:100%;padding:14px 16px;background:none;border:none;cursor:pointer;font-family:inherit;font-size:13px;font-weight:500;color:var(--text);letter-spacing:-0.15px;text-align:left}
.spw-meas-toggle svg:first-child{color:var(--text-mid);flex-shrink:0}
.spw-meas-toggle span{flex:1}
.spw-meas-chev{color:var(--text-soft);transition:transform 300ms var(--ease-swift);flex-shrink:0}
.spw-meas-section.open .spw-meas-chev{transform:rotate(180deg)}
.spw-meas-body{padding:4px 16px 16px;border-top:1px solid var(--border)}
.spw-meas-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.spw-meas-grid.primary{grid-template-columns:1fr 1fr 1fr}
.spw-meas-input{background:var(--lime-bright);border:1px solid var(--border);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:2px;transition:border-color 200ms var(--ease-swift)}
.spw-meas-input:focus-within{border-color:var(--text);background:var(--card)}
.spw-meas-input-lbl{font-size:10px;color:var(--text-mid);letter-spacing:0.2px;font-weight:500;font-family:'Geist Mono',ui-monospace,monospace;text-transform:uppercase}
.spw-meas-input input{background:transparent;border:none;outline:none;font-family:inherit;font-size:16px;font-weight:500;color:var(--text);width:100%;padding:0;font-variant-numeric:tabular-nums;letter-spacing:-0.3px}
.spw-meas-input input::placeholder{color:var(--text-soft);font-weight:400}
.spw-meas-input-unit{font-size:10px;color:var(--text-soft);letter-spacing:0.2px;font-family:'Geist Mono',ui-monospace,monospace;font-weight:500;margin-top:-2px}
.spw-meas-rest-title{font-size:10px;letter-spacing:0.6px;text-transform:uppercase;color:var(--text-soft);font-weight:600;margin:14px 0 4px;font-family:'Geist Mono',ui-monospace,monospace}

/* Weight-Modal Redesign — Hero+Stepper vereint, einheitliche Sektion-Shell */
.spw-main{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:20px 16px 18px;display:flex;flex-direction:column;align-items:center;gap:10px;box-shadow:0 1px 0 rgba(26,22,20,0.02)}
.spw-main-lbl{font-size:10px;letter-spacing:1.2px;text-transform:uppercase;color:var(--text-soft);font-family:'Geist Mono',ui-monospace,monospace;font-weight:600}
.spw-main-row{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;width:100%}
.spw-main .spw-step-display{font-size:56px;font-weight:500;color:var(--text);letter-spacing:-2.5px;line-height:1;font-variant-numeric:tabular-nums;font-feature-settings:"ss01";padding:6px 10px;border-radius:12px;background:transparent;cursor:pointer;user-select:none;transition:background 160ms var(--ease-swift)}
.spw-main .spw-step-display:hover{background:var(--lime-bright)}
.spw-main .spw-step-display .spw-step-unit{font-size:15px;color:var(--text-soft);margin-left:6px;font-weight:500;letter-spacing:0}
.spw-main .spw-step-btn{width:52px;height:52px;border-radius:16px;background:var(--lime-bright);border:1px solid var(--border)}
.spw-main .spw-hero-delta{margin-top:2px}
.spw-main-hint{font-size:10px;color:var(--text-soft);font-family:'Geist Mono',ui-monospace,monospace;letter-spacing:0.5px;text-transform:uppercase;font-weight:600;text-align:center;margin-top:2px}

.spw-field{display:flex;flex-direction:column;gap:10px}
.spw-field-lbl{font-size:10px;letter-spacing:1.2px;text-transform:uppercase;color:var(--text-soft);font-family:'Geist Mono',ui-monospace,monospace;font-weight:600;padding-left:2px}

.spw-section{background:var(--card);border:1px solid var(--border);border-radius:14px;overflow:hidden;transition:border-color 200ms var(--ease-swift)}
.spw-section:focus-within{border-color:var(--text-mid)}
.spw-section-head{display:flex;align-items:center;gap:10px;padding:12px 14px;width:100%;background:none;border:none;font-family:inherit;text-align:left;color:var(--text)}
.spw-section-btn{cursor:pointer;transition:background 180ms var(--ease-swift)}
.spw-section-btn:active{background:var(--lime-bright)}
.spw-section-ico{color:var(--text-mid);flex-shrink:0}
.spw-section-lbl{flex:1;font-size:13px;font-weight:600;color:var(--text);letter-spacing:-0.15px}
.spw-section-opt{font-size:9px;letter-spacing:0.8px;text-transform:uppercase;color:var(--text-soft);font-family:'Geist Mono',ui-monospace,monospace;font-weight:600;padding:3px 8px;border-radius:99px;background:var(--lime-bright)}
.spw-section-chev{color:var(--text-soft);transition:transform 300ms var(--ease-swift);flex-shrink:0}
.spw-section-toggle.open .spw-section-chev{transform:rotate(180deg)}
.spw-section-ta{width:100%;background:transparent;border:none;border-top:1px solid var(--border);padding:12px 14px;font-family:inherit;font-size:13px;color:var(--text);resize:none;letter-spacing:-0.1px;line-height:1.5;outline:none;display:block}
.spw-section-ta::placeholder{color:var(--text-soft)}
.spw-section .spw-meas-body{border-top:1px solid var(--border);padding:12px 14px 14px;margin:0}
.spw-section.has-photo .spw-photo-preview{margin:4px auto 10px}
.spw-section .spw-photo-add{margin:0 14px 14px;border-top-left-radius:12px;border-top-right-radius:12px}
.spw-section .spw-photo-persp{padding:0 14px 14px}

:root[data-theme="dark"] .spw-main,
:root[data-theme="dark"] .spw-section{background:transparent;border-color:var(--momo-sand)}
:root[data-theme="dark"] .spw-main .spw-step-btn{background:transparent;border-color:var(--momo-sand)}
:root[data-theme="dark"] .spw-main .spw-step-display:hover{background:rgba(247,242,234,0.05)}
:root[data-theme="dark"] .spw-section-opt{background:rgba(247,242,234,0.06);color:var(--momo-cream)}
:root[data-theme="dark"] .spw-section-btn:active{background:rgba(247,242,234,0.05)}
:root[data-theme="dark"] .spw-section-ta{border-top-color:var(--momo-sand)}
:root[data-theme="dark"] .spw-section .spw-meas-body{border-top-color:var(--momo-sand)}

/* ═══════════════════════════════════════════════════════════
   PAYWALL v4 — Editorial, hochwertig, Trust-First
   Inspiration: Apple App Store Subscriptions + Linear + Stripe Pricing.
   Keine Gradienten, keine Badges, keine Fake-Social-Proof.
   ═══════════════════════════════════════════════════════════ */
.pw-v4{background:#FAFAF7;min-height:100%;padding:0;color:#111827;font-feature-settings:"ss01","ss02"}
.pw-v4-hero{padding:28px 28px 18px;max-width:560px;margin:0 auto}
/* Floating close, top-right */
.pw-sheet{position:relative}
.pw-close{position:absolute;top:14px;right:14px;z-index:20;width:36px;height:36px;border-radius:999px;border:1px solid rgba(17,24,39,0.08);background:rgba(250,250,247,0.85);backdrop-filter:saturate(1.4) blur(8px);-webkit-backdrop-filter:saturate(1.4) blur(8px);color:#111827;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform 160ms cubic-bezier(0.23,1,0.32,1),background 160ms ease}
.pw-close:hover{background:var(--card)}
.pw-close:active{transform:scale(0.94)}
.pw-v4-wordmark{font-size:11px;letter-spacing:1.8px;text-transform:uppercase;color:#C28B12;font-weight:600;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:18px}
.pw-v4-headline{font-size:34px;font-weight:500;letter-spacing:-1.4px;line-height:1.08;color:#111827;margin:0 0 14px}
.pw-v4-deck{font-size:15.5px;color:#4B5563;line-height:1.55;letter-spacing:-0.1px;margin:0;max-width:45ch}

.pw-v4-section{padding:36px 28px 8px;max-width:560px;margin:0 auto}
.pw-v4-eyebrow{font-size:10px;letter-spacing:1.6px;text-transform:uppercase;color:#6B7280;font-weight:600;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:14px}

/* Plan-Liste vertikal */
.pw-v4-plans{display:flex;flex-direction:column;gap:6px}
.pw-v4-plan{display:flex;align-items:flex-start;gap:14px;padding:18px 20px;background:var(--card);border:1px solid #E7E5E0;border-radius:14px;cursor:pointer;font-family:inherit;text-align:left;width:100%;transition:border-color 200ms var(--ease-swift),background 200ms var(--ease-swift),transform 140ms var(--ease-spring-soft)}
.pw-v4-plan:hover{border-color:#C9C5BD}
.pw-v4-plan:active{transform:scale(0.995)}
.pw-v4-plan.selected{border-color:#111827;background:var(--card);box-shadow:0 0 0 1px #111827}
.pw-v4-plan-radio{width:20px;height:20px;border-radius:50%;border:1.5px solid #D4D0C8;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px;transition:border-color 200ms var(--ease-swift)}
.pw-v4-plan.selected .pw-v4-plan-radio{border-color:#111827}
.pw-v4-plan-radio-dot{width:10px;height:10px;border-radius:50%;background:#111827;transform:scale(0);transition:transform 220ms var(--ease-spring-soft)}
.pw-v4-plan.selected .pw-v4-plan-radio-dot{transform:scale(1)}
.pw-v4-plan-body{flex:1;min-width:0}
.pw-v4-plan-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:4px}
.pw-v4-plan-name{font-size:15px;font-weight:500;color:#111827;letter-spacing:-0.2px}
.pw-v4-plan-price{font-size:16px;font-weight:600;color:#111827;letter-spacing:-0.3px;font-variant-numeric:tabular-nums}
.pw-v4-plan-bottom{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:12.5px;color:#6B7280;letter-spacing:-0.1px}
.pw-v4-plan-per{color:#6B7280}
.pw-v4-plan-note{color:#6B7280;text-align:right}
.pw-v4-plan.recommended .pw-v4-plan-note{color:#C28B12;font-weight:500}

/* Yearly (recommended) dominiert visuell — größer, Gold-Akzent, Lift-Shadow */
.pw-v4-plan.recommended{
  padding:22px 22px;
  border-color:#F3E4B6;
  background:linear-gradient(180deg,#FFFBF0 0%,var(--card) 100%);
  box-shadow:0 1px 2px rgba(194,139,18,0.06),0 14px 32px -14px rgba(194,139,18,0.22);
  position:relative;
}
.pw-v4-plan.recommended::before{
  content:"";position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,#C28B12,transparent);
  border-radius:14px 14px 0 0;
}
.pw-v4-plan.recommended .pw-v4-plan-name{font-size:16px;font-weight:600}
.pw-v4-plan.recommended .pw-v4-plan-price{font-size:18px}
.pw-v4-plan.recommended.selected{
  border-color:#C28B12;
  box-shadow:0 0 0 1px #C28B12,0 14px 32px -14px rgba(194,139,18,0.28);
}
.pw-v4-plan.recommended.selected .pw-v4-plan-radio{border-color:#C28B12}
.pw-v4-plan.recommended.selected .pw-v4-plan-radio-dot{background:#C28B12}

/* Redeem-Link im Footer — zurückhaltend, Serif-Akzent */
.pw-v4-foot-redeem{margin-top:12px;font-size:11.5px;color:#9CA3AF}
.pw-v4-foot-redeem a{color:#6B7280;text-decoration:underline;text-underline-offset:3px;text-decoration-color:#D4D0C8;font-weight:500;transition:color 180ms var(--ease-swift),text-decoration-color 180ms var(--ease-swift)}
.pw-v4-foot-redeem a:hover{color:#111827;text-decoration-color:#111827}

.pw-v4-trial-line{font-size:12px;color:#6B7280;text-align:center;margin-top:16px;letter-spacing:-0.05px;line-height:1.5}

/* Features — schlichte Liste, nicht Cards */
.pw-v4-features{display:flex;flex-direction:column;gap:2px}
.pw-v4-feat{padding:16px 0;border-bottom:1px solid #E7E5E0}
.pw-v4-feat:last-child{border-bottom:none}
.pw-v4-feat-title{font-size:15px;font-weight:500;color:#111827;letter-spacing:-0.2px;margin-bottom:3px}
.pw-v4-feat-desc{font-size:13.5px;color:#6B7280;line-height:1.55;letter-spacing:-0.1px}

/* FAQ — native <details> */
.pw-v4-faq{display:flex;flex-direction:column}
.pw-v4-faq-item{border-bottom:1px solid #E7E5E0}
.pw-v4-faq-item:last-child{border-bottom:none}
.pw-v4-faq-q{list-style:none;display:flex;justify-content:space-between;align-items:center;padding:18px 0;font-size:14.5px;color:#111827;letter-spacing:-0.15px;cursor:pointer;gap:12px;font-weight:500}
.pw-v4-faq-q::-webkit-details-marker{display:none}
.pw-v4-faq-q::marker{content:""}
.pw-v4-faq-chev{color:#9CA3AF;flex-shrink:0;transition:transform 260ms var(--ease-swift)}
.pw-v4-faq-item[open] .pw-v4-faq-chev{transform:rotate(180deg)}
.pw-v4-faq-a{padding:0 0 18px;font-size:13.5px;color:#4B5563;line-height:1.6;letter-spacing:-0.05px}

/* Redeem-Link sehr dezent */
.pw-v4-redeem{text-align:center;padding:28px 24px 0;max-width:560px;margin:0 auto}
.pw-v4-redeem-btn{background:transparent;border:none;font-family:inherit;font-size:12.5px;color:#6B7280;cursor:pointer;letter-spacing:-0.05px;text-decoration:underline;text-underline-offset:3px;text-decoration-color:#D4D0C8;padding:8px 12px;transition:color 180ms var(--ease-swift),text-decoration-color 180ms var(--ease-swift)}
.pw-v4-redeem-btn:hover{color:#111827;text-decoration-color:#111827}

.pw-v4-foot{padding:20px 28px 4px;max-width:560px;margin:0 auto;text-align:center}
.pw-v4-foot-line{font-size:11px;color:#6B7280;letter-spacing:-0.05px;line-height:1.55;margin-bottom:3px}
.pw-v4-foot-line.faint{color:#9CA3AF}

/* Legacy v3 — bleibt für falls jemand noch referenziert */
.pw-v3-wrap{background:var(--card);min-height:100%;padding:0 0 120px}
.pw-v3-hero{padding:40px 24px 20px;text-align:center}
.pw-v3-logo{width:44px;height:44px;border-radius:14px;background:var(--text);color:#fff;display:inline-flex;align-items:center;justify-content:center;margin-bottom:18px}
.pw-v3-title{font-size:26px;font-weight:500;letter-spacing:-0.8px;color:var(--text);margin:0 0 6px;line-height:1.2}
.pw-v3-sub{font-size:14px;color:var(--text-mid);margin:0;line-height:1.5;letter-spacing:-0.1px}
.pw-v3-plans{padding:10px 16px 8px}
.pw-v3-features{padding:20px 24px 4px;display:flex;flex-direction:column;gap:10px}
.pw-v3-feat{display:flex;align-items:flex-start;gap:10px;font-size:14px;color:var(--text);letter-spacing:-0.15px;line-height:1.45}
.pw-v3-feat svg{color:var(--green);flex-shrink:0;margin-top:4px}
.pw-v3-code{padding:14px 24px 0;text-align:center}
.pw-v3-footer{padding:20px 24px 10px;text-align:center}
.pw-v3-footer-text{font-size:11px;color:var(--text-soft);letter-spacing:-0.05px;line-height:1.5;margin-bottom:4px}
.pw-v3-footer-text.faint{color:var(--text-soft);opacity:0.7}

/* ═══════════════════════════════════════════════════════════
   PAYWALL v2 — Conversion-Optimized Premium Design
   ═══════════════════════════════════════════════════════════ */
.pw-v2-wrap{background:#FAF7EF;min-height:100%}

/* HERO — kompakt, schlanker Gunmetal mit Glow */
.pw-hero{position:relative;background:transparent;color:#fff;padding:20px 22px 22px;overflow:hidden;isolation:isolate;display:flex;align-items:center;gap:16px}
.pw-hero::before{content:"";position:absolute;top:-50%;right:-20%;width:70%;height:200%;background:radial-gradient(circle,rgba(255,174,59,0.45) 0%,rgba(255,174,59,0.1) 40%,transparent 70%);filter:blur(40px);z-index:-1;pointer-events:none;animation:pwGlowPulse 6s var(--ease-in-out) infinite}
@keyframes pwGlowPulse{0%,100%{opacity:0.85;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}

.pw-hero-crown{width:46px;height:46px;border-radius:14px;background:radial-gradient(circle at 30% 20%,#FFE49A 0%,#FFAE3B 55%,#D8821B 100%);display:flex;align-items:center;justify-content:center;color:#6E2E00;box-shadow:inset 0 1px 0 rgba(255,255,255,0.45),inset 0 -2px 4px rgba(110,46,0,0.3),0 6px 18px -2px rgba(226,132,24,0.55);flex-shrink:0}
.pw-hero-crown svg{width:22px;height:22px}
.pw-hero-text{flex:1;min-width:0}
.pw-hero-eyebrow{font-size:10px;letter-spacing:1.6px;text-transform:uppercase;font-weight:600;color:rgba(255,198,79,0.95);font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:3px}
.pw-hero-title{font-size:20px;font-weight:500;letter-spacing:-0.6px;line-height:1.2;margin-bottom:2px;font-feature-settings:"ss01","ss02";color:var(--text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:currentColor}
.pw-hero-sub{font-size:12.5px;line-height:1.45;font-weight:400;letter-spacing:-0.1px;color:rgba(255,255,255,0.7)}

/* Social Proof — horizontale Chip-Reihe unter dem Hero */
.pw-social-proof{display:flex;gap:6px;padding:10px 16px;background:#17292B;border-bottom:1px solid rgba(255,255,255,0.06);overflow-x:auto;scrollbar-width:none}
.pw-social-proof::-webkit-scrollbar{display:none}
.pw-social-proof-item{flex:0 0 auto;display:inline-flex;align-items:center;gap:5px;padding:5px 10px;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.08);border-radius:99px;font-size:11px;color:rgba(255,255,255,0.82);font-weight:500;letter-spacing:-0.05px;white-space:nowrap}
.pw-social-proof-val{display:inline-flex;align-items:center;gap:3px;font-weight:600;color:#fff}
.pw-social-proof-val svg{color:#FFC64F;width:11px;height:11px}
.pw-social-proof-lbl{font-size:10px;color:rgba(255,255,255,0.55);letter-spacing:0;text-transform:none;font-weight:500;font-family:inherit;margin-top:0}

/* Context-Banner wenn Paywall aus einem Gate heraus geöffnet wurde */
.pw-context-banner{display:flex;gap:14px;padding:16px 20px;background:linear-gradient(135deg,rgba(255,198,79,0.12) 0%,rgba(255,198,79,0.04) 100%);border-bottom:1px solid rgba(255,198,79,0.25);align-items:flex-start;animation:pwContextIn 420ms var(--ease-spring-soft)}
@keyframes pwContextIn{0%{opacity:0;transform:translateY(-8px)}100%{opacity:1;transform:translateY(0)}}
.pw-context-banner-accent{width:3px;align-self:stretch;background:linear-gradient(180deg,#FFC64F 0%,#E38418 100%);border-radius:99px;flex-shrink:0}
.pw-context-banner-content{flex:1;min-width:0}
.pw-context-banner-title{font-size:14px;font-weight:600;color:var(--text);letter-spacing:-0.2px;line-height:1.3;margin-bottom:3px}
.pw-context-banner-desc{font-size:12.5px;color:var(--text-mid);line-height:1.5;letter-spacing:-0.1px}
.pw-context-banner-desc strong{color:var(--text);font-weight:600}

/* Trial-Banner when trial active */
.pw-trial-banner{background:linear-gradient(135deg,#FF7A3C 0%,#E05316 100%);color:#fff;margin:0;padding:14px 20px;display:flex;align-items:center;gap:12px;font-size:13px;font-weight:500;letter-spacing:-0.1px;animation:pwTrialPulse 2.4s var(--ease-in-out) infinite}
@keyframes pwTrialPulse{0%,100%{box-shadow:inset 0 0 0 0 rgba(255,255,255,0.1)}50%{box-shadow:inset 0 0 0 4px rgba(255,255,255,0.08)}}
.pw-trial-banner svg{flex-shrink:0}
.pw-trial-banner strong{font-weight:600}
.pw-trial-banner-countdown{margin-left:auto;font-family:'Geist Mono',ui-monospace,monospace;font-weight:700;letter-spacing:0.5px;padding:4px 10px;border-radius:8px;background:rgba(255,255,255,0.15);font-size:12px}

/* Comparison Free vs Pro */
.pw-compare{padding:30px 20px 24px;background:#FAF7EF}
.pw-compare-title{font-size:11px;font-weight:600;color:var(--text-mid);text-transform:uppercase;letter-spacing:1.2px;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:14px;text-align:center}
.pw-compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pw-compare-col{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:18px 14px;position:relative}
.pw-compare-col.pro{background:transparent;color:#fff;border:none;box-shadow:0 2px 4px rgba(26,22,20,0.08),0 16px 32px -10px rgba(26,22,20,0.3)}
.pw-compare-col-head{font-size:10px;letter-spacing:1.4px;text-transform:uppercase;font-weight:600;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:12px;color:var(--text-soft)}
.pw-compare-col.pro .pw-compare-col-head{color:rgba(255,198,79,0.9)}
.pw-compare-col-name{font-size:18px;font-weight:500;letter-spacing:-0.5px;margin-bottom:14px}
.pw-compare-item{display:flex;align-items:flex-start;gap:8px;font-size:12.5px;padding:6px 0;color:var(--text-mid);letter-spacing:-0.1px;line-height:1.4}
.pw-compare-col.pro .pw-compare-item{color:rgba(255,255,255,0.9)}
.pw-compare-item svg{flex-shrink:0;margin-top:2px}
.pw-compare-item.no{color:var(--text-soft)}
.pw-compare-item.no svg{color:var(--text-soft)}
.pw-compare-col.pro .pw-compare-item svg{color:#FFC64F}

/* Features — icon cards */
.pw-features{padding:10px 20px 24px;background:#FAF7EF}
.pw-features-title{font-size:11px;font-weight:600;color:var(--text-mid);text-transform:uppercase;letter-spacing:1.2px;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:14px;text-align:center}
.pw-features-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pw-feat{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px 14px;display:flex;flex-direction:column;gap:8px;transition:transform 200ms var(--ease-spring-soft),border-color 200ms var(--ease-swift)}
.pw-feat:hover{border-color:var(--text-mid);transform:translateY(-2px)}
.pw-feat-icon{width:34px;height:34px;border-radius:10px;background:var(--momo-peach);color:var(--text);display:flex;align-items:center;justify-content:center;box-shadow:inset 0 1px 0 rgba(255,255,255,0.5)}
.pw-feat-title{font-size:13px;font-weight:500;color:var(--text);letter-spacing:-0.2px;line-height:1.3}
.pw-feat-desc{font-size:11px;color:var(--text-soft);font-weight:500;line-height:1.4;letter-spacing:-0.05px}

/* Pricing Tiers */
/* PLANS — 3-column side-by-side grid for direct comparison */
.pw-plans{padding:10px 16px 20px;background:#FAF7EF}
.pw-plans-title{font-size:11px;font-weight:600;color:var(--text-mid);text-transform:uppercase;letter-spacing:1.2px;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:20px;text-align:center}
.pw-plans-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;align-items:stretch}
.pw-plans-grid.pw-plans-grid-2{grid-template-columns:1fr 1fr;gap:10px;max-width:460px;margin:0 auto}
.pw-plan{background:var(--card);border:2px solid var(--border);border-radius:18px;padding:16px 10px 14px;cursor:pointer;position:relative;transition:border-color 220ms var(--ease-swift),transform 220ms var(--ease-spring-soft),box-shadow 260ms var(--ease-swift),background 220ms var(--ease-swift);font-family:inherit;text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px;min-height:180px}
.pw-plan:hover{border-color:var(--text-mid)}
.pw-plan:active{transform:scale(0.97)}
/* Recommended = hat "Beliebt"-Badge — dezenter Gold-Schimmer, aber NICHT highlighted wenn nicht selected */
.pw-plan.recommended{background:linear-gradient(175deg,rgba(255,198,79,0.08) 0%,#fff 65%)}
/* Selected = User hat diesen Plan aktiv gewählt — DIESER bekommt den starken Highlight */
.pw-plan.selected{border-color:var(--momo-charcoal);background:linear-gradient(175deg,rgba(255,198,79,0.14) 0%,#fff 60%);box-shadow:0 4px 8px rgba(26,22,20,0.08),0 18px 36px -12px rgba(26,22,20,0.28);transform:translateY(-2px)}
.pw-plan.selected:active{transform:translateY(-2px) scale(0.97)}
.pw-plan-badge{position:absolute;top:-10px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,#FFAE3B 0%,#E38418 100%);color:#fff;padding:4px 9px;border-radius:99px;font-size:9px;font-weight:700;letter-spacing:0.8px;text-transform:uppercase;font-family:'Geist Mono',ui-monospace,monospace;box-shadow:0 4px 12px -2px rgba(226,132,24,0.45);white-space:nowrap;display:inline-flex;align-items:center;gap:3px;z-index:2}
.pw-plan-badge svg{flex-shrink:0}
.pw-plan-name{font-size:11px;font-weight:600;color:var(--text);letter-spacing:-0.1px;text-transform:uppercase;font-family:'Geist Mono',ui-monospace,monospace;margin-top:4px;line-height:1.2;min-height:28px;display:flex;align-items:center;justify-content:center;text-align:center}
.pw-plan-price-main{font-size:28px;font-weight:500;color:var(--text);letter-spacing:-1.2px;line-height:1;font-variant-numeric:tabular-nums;margin-top:8px;font-feature-settings:"ss01"}
.pw-plan-price-main small{font-size:13px;color:var(--text-soft);font-weight:500;margin-left:1px;letter-spacing:-0.1px}
.pw-plan-price-per{font-size:10px;color:var(--text-soft);font-weight:500;margin-top:3px;font-family:'Geist Mono',ui-monospace,monospace;letter-spacing:0.2px;line-height:1.3}
.pw-plan-sub{font-size:10px;color:var(--text-soft);font-weight:500;letter-spacing:-0.05px;margin-top:auto;padding-top:8px;line-height:1.3;text-align:center}
.pw-plan-save{font-size:9.5px;font-weight:700;color:var(--text);background:var(--lime);padding:4px 8px;border-radius:99px;margin-top:6px;letter-spacing:0.3px;white-space:nowrap;display:inline-flex;align-items:center;gap:3px}
.pw-plan-save svg{color:var(--green)}
.pw-plan-perday{font-size:10px;color:var(--text-mid);font-weight:500;margin-top:4px;letter-spacing:-0.05px;line-height:1.3}
.pw-plan-perday strong{color:var(--text);font-weight:600}

/* Rabattcode — dezente Text-Link-Zeile, nicht mehr "Coupon" */
.pw-code-hint{display:inline-flex;align-items:center;gap:8px;background:transparent;border:none;color:var(--text-mid);padding:14px 8px 4px;margin:10px auto 0;cursor:pointer;font-family:inherit;font-size:12.5px;letter-spacing:-0.1px;transition:color 180ms var(--ease-swift);width:auto;max-width:100%}
.pw-code-hint:hover{color:var(--text)}
.pw-code-hint:active{opacity:0.7}
.pw-code-hint svg:first-child{color:var(--text-soft);flex-shrink:0;transition:color 180ms var(--ease-swift)}
.pw-code-hint:hover svg:first-child{color:var(--text)}
.pw-code-hint-text{border-bottom:1px dashed var(--border);padding-bottom:1px;font-weight:500}
.pw-code-hint:hover .pw-code-hint-text{border-bottom-color:var(--text)}
.pw-code-hint .pw-code-chev{display:none}

/* CTA — sticky, editorial */
.pw-cta-wrap{position:sticky;bottom:0;background:linear-gradient(to top,#FAFAF7 88%,rgba(250,250,247,0));padding:14px 24px calc(env(safe-area-inset-bottom) + 8px);z-index:10;max-width:560px;margin:0 auto;backdrop-filter:saturate(1.4);-webkit-backdrop-filter:saturate(1.4)}
.pw-cta{width:100%;background:#111827;color:#fff;border:none;border-radius:14px;padding:17px;font-family:inherit;font-size:15px;font-weight:500;letter-spacing:-0.15px;cursor:pointer;transition:transform 160ms var(--ease-spring-soft),background 200ms var(--ease-swift)}
.pw-cta:hover{background:#000}
.pw-cta:active{transform:scale(0.985)}
.pw-cta-sub{display:none}

/* Testimonials */
.pw-testimonials{padding:8px 20px 22px;background:#FAF7EF}
.pw-testimonials-title{font-size:11px;font-weight:600;color:var(--text-mid);text-transform:uppercase;letter-spacing:1.2px;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:14px;text-align:center}
.pw-testimonial{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:18px;margin-bottom:10px}
.pw-testimonial-stars{color:#FFAE3B;font-size:12px;letter-spacing:1px;margin-bottom:8px;display:inline-flex;gap:1px}
.pw-testimonial-quote{font-size:13.5px;color:var(--text);line-height:1.6;font-style:italic;letter-spacing:-0.1px;margin-bottom:12px}
.pw-testimonial-author{display:flex;align-items:center;gap:10px}
.pw-testimonial-avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#519CAB 0%,#3F808D 100%);color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:500}
.pw-testimonial-name{font-size:12px;font-weight:500;color:var(--text);letter-spacing:-0.1px}
.pw-testimonial-meta{font-size:10px;color:var(--text-soft);margin-top:1px;font-family:'Geist Mono',ui-monospace,monospace;letter-spacing:0.2px}

/* FAQ */
.pw-faq{padding:8px 20px 22px;background:#FAF7EF}
.pw-faq-title{font-size:11px;font-weight:600;color:var(--text-mid);text-transform:uppercase;letter-spacing:1.2px;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:14px;text-align:center}
.pw-faq-item{background:var(--card);border:1px solid var(--border);border-radius:14px;overflow:hidden;margin-bottom:8px}
.pw-faq-q{width:100%;padding:14px 18px;background:none;border:none;font-family:inherit;font-size:13px;font-weight:500;color:var(--text);text-align:left;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;letter-spacing:-0.15px}
.pw-faq-chev{color:var(--text-soft);transition:transform 280ms var(--ease-swift);flex-shrink:0}
.pw-faq-item.open .pw-faq-chev{transform:rotate(180deg)}
.pw-faq-a{max-height:0;overflow:hidden;transition:max-height 380ms var(--ease-swift)}
.pw-faq-item.open .pw-faq-a{max-height:400px}
.pw-faq-a-inner{padding:0 18px 16px;font-size:12.5px;color:var(--text-mid);line-height:1.55;letter-spacing:-0.1px}

/* Trust-Strip */
.pw-trust{display:flex;gap:12px;padding:6px 20px 20px;background:#FAF7EF;justify-content:center;flex-wrap:wrap}
.pw-trust-item{display:inline-flex;align-items:center;gap:5px;font-size:11px;color:var(--text-mid);font-weight:500;letter-spacing:-0.05px;padding:6px 10px;background:var(--card);border:1px solid var(--border);border-radius:99px}
.pw-trust-item svg{color:var(--green)}

/* Paywall Footer (Rabattcode + Legal) */
.pw-footer{padding:0 20px 22px;background:#FAF7EF;text-align:center}
.pw-redeem-btn{background:var(--card);border:1px solid var(--border);color:var(--text);cursor:pointer;font-size:13px;font-weight:500;letter-spacing:-0.1px;padding:11px 18px;display:inline-flex;align-items:center;gap:8px;font-family:inherit;border-radius:12px;transition:background 200ms var(--ease-swift),border-color 200ms var(--ease-swift)}
.pw-redeem-btn:hover{background:var(--text);color:#fff;border-color:var(--text)}
.pw-disclaimer{font-size:10px;color:var(--text-soft);margin-top:12px;line-height:1.6;font-weight:500;letter-spacing:-0.05px;padding:0 10px}

/* Current Plan Banner (wenn schon Pro) */
.pw-current{background:linear-gradient(135deg,var(--lime) 0%,var(--green-light) 100%);border:1px solid var(--border);border-radius:16px;padding:18px;margin:20px;text-align:center}
.pw-current-icon{width:48px;height:48px;border-radius:16px;background:var(--green);color:#fff;display:inline-flex;align-items:center;justify-content:center;margin-bottom:12px}
.pw-current-title{font-size:17px;font-weight:500;color:var(--text);letter-spacing:-0.3px;margin-bottom:6px}
.pw-current-sub{font-size:13px;color:var(--text-mid);font-weight:500;letter-spacing:-0.1px;line-height:1.5}

/* Rabattcode Modal */
.pc-hero{text-align:center;padding:8px 0 12px}
.pc-icon{width:60px;height:60px;margin:0 auto;border-radius:18px;background:var(--momo-peach);color:var(--text);display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px rgba(255,198,79,0.3),0 14px 28px -8px rgba(255,198,79,0.5),inset 0 1px 0 rgba(255,255,255,0.4)}
.pc-title{font-size:24px;font-weight:500;color:var(--text);letter-spacing:-0.8px;line-height:1.15;margin:14px 0 8px}
.pc-sub{font-size:14px;color:var(--text-mid);font-weight:500;line-height:1.5;margin:0;letter-spacing:-0.1px}
.pc-sources{list-style:none;padding:0;margin:10px 0 0;display:flex;flex-direction:column;gap:10px}
.pc-sources li{display:flex;align-items:flex-start;gap:12px;font-size:13px;color:var(--text-mid);line-height:1.45;letter-spacing:-0.1px}
.pc-sources li strong{color:var(--text);font-weight:500;font-size:13px}
.pc-source-icon{flex-shrink:0;width:32px;height:32px;border-radius:10px;background:var(--surface-2,#f5f2ea);color:var(--text);display:inline-flex;align-items:center;justify-content:center}
.pw-plan-badge{display:inline-flex;align-items:center}

.pc-message-ok{background:var(--lime);color:var(--text);border:1px solid var(--green-light)}
.pc-message-err{background:var(--danger-soft);color:var(--danger);border:1px solid var(--danger-soft)}

/* Profile Page */
.prof-avatar-block{display:flex;align-items:center;gap:16px;background:var(--card);border:1px solid var(--border);border-radius:22px;padding:18px;margin-bottom:12px;box-shadow:var(--shadow)}
.prof-avatar{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,var(--text) 0%,var(--green) 100%);color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:500;letter-spacing:-0.5px;flex-shrink:0;box-shadow:inset 0 1px 0 rgba(255,255,255,0.12)}
.prof-avatar-info{flex:1;min-width:0}
.prof-avatar-name{font-size:17px;font-weight:500;color:var(--text);letter-spacing:-0.4px;line-height:1.2}
.prof-avatar-email{font-size:12px;color:var(--text-soft);margin-top:4px;font-weight:500;letter-spacing:-0.1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prof-plan-chip{display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:600;padding:3px 9px;border-radius:99px;letter-spacing:0.4px;text-transform:uppercase;margin-top:6px;font-family:'Geist Mono',ui-monospace,monospace}
.prof-plan-chip.free{background:var(--lime);color:var(--text)}
.prof-plan-chip.trial{background:var(--accent-soft);color:var(--accent-text)}
.prof-plan-chip.pro{background:var(--momo-peach);color:var(--text)}

.prof-section-title{font-size:10px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.4px;font-weight:500;font-family:'Geist Mono',ui-monospace,monospace;margin:18px 0 10px 4px}

.prof-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.prof-stat{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:14px 16px;box-shadow:var(--shadow-xs)}
.prof-stat-label{font-size:10px;color:var(--text-soft);text-transform:uppercase;letter-spacing:1.2px;font-weight:600;font-family:'Geist Mono',ui-monospace,monospace;margin-bottom:6px}
.prof-stat-val{font-size:24px;font-weight:500;color:var(--text);letter-spacing:-0.8px;line-height:1;font-variant-numeric:tabular-nums}
.prof-stat-val small{font-size:11px;color:var(--text-soft);font-weight:500;margin-left:3px}

.prof-info-card{background:var(--card);border:1px solid var(--border);border-radius:22px;box-shadow:var(--shadow);overflow:hidden;margin-bottom:12px}
.prof-info-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px;border-bottom:1px solid var(--border);font-size:13px}
.prof-info-row:last-child{border-bottom:none}
.prof-info-label{color:var(--text-mid);font-weight:500;letter-spacing:-0.1px}
.prof-info-val{color:var(--text);font-weight:500;letter-spacing:-0.1px;font-variant-numeric:tabular-nums;text-align:right}

.prof-cta{display:flex;flex-direction:column;gap:8px;margin-top:8px}

/* Auth: Login Modal */
.auth-hero{text-align:center;margin-bottom:12px}
.auth-icon{width:56px;height:56px;border-radius:16px;background:transparent;color:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto;box-shadow:0 2px 4px rgba(26,22,20,0.1),0 14px 28px -10px rgba(26,22,20,0.28),inset 0 1px 0 rgba(255,255,255,0.08)}

/* Sync indicator in header */
.sync-indicator{position:absolute;top:50%;transform:translateY(-50%);right:0;display:flex;align-items:center;gap:5px;font-size:10px;font-weight:500;color:var(--text);font-family:'Geist',sans-serif;letter-spacing:-0.1px;padding:5px 11px;border-radius:99px;background:var(--card);border:1px solid var(--border);cursor:pointer;transition:transform 200ms var(--ease-spring-soft),background 220ms var(--ease-swift),color 220ms var(--ease-swift),border-color 220ms var(--ease-swift),box-shadow 220ms var(--ease-swift);overflow:hidden;box-shadow:var(--shadow-xs)}
.sync-indicator:hover{background:var(--text);color:#fff;border-color:var(--text)}
.sync-indicator:active{transform:translateY(-50%) scale(0.95)}
.sync-dot{width:6px;height:6px;border-radius:99px;background:var(--green);flex-shrink:0;transition:background 200ms var(--ease-swift);animation:breathe 3s var(--ease-in-out) infinite}
.sync-indicator:hover .sync-dot{background:var(--accent)}
.sync-label{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:130px}

/* Home cloud banner */
.home-cloud-banner{background:transparent;color:#fff;border-radius:20px;padding:16px 18px;margin-bottom:16px;display:flex;align-items:center;gap:14px;cursor:pointer;position:relative;overflow:hidden;box-shadow:0 2px 4px rgba(26,22,20,0.08),0 14px 28px -10px rgba(26,22,20,0.24),inset 0 1px 0 rgba(255,255,255,0.08);transition:transform 220ms var(--ease-spring-soft)}
.home-cloud-banner::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,0.08) 48%,transparent 66%);pointer-events:none;animation:shineSweep 6s var(--ease-in-out) infinite;z-index:1}
.home-cloud-banner:active{transform:scale(0.985)}
.home-cloud-icon{width:36px;height:36px;border-radius:10px;background:rgba(255,255,255,0.14);color:var(--accent);display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;z-index:2}
.home-cloud-text{flex:1;position:relative;z-index:2}
.home-cloud-title{font-size:14px;font-weight:500;letter-spacing:-0.2px}
.home-cloud-sub{font-size:11px;opacity:0.72;margin-top:3px;font-weight:500;letter-spacing:-0.1px;line-height:1.4}
.home-cloud-arrow{color:var(--accent);position:relative;z-index:2;flex-shrink:0;transition:transform 220ms var(--ease-swift)}
.home-cloud-banner:hover .home-cloud-arrow{transform:translateX(3px)}

/* Auth-status row in settings */
.settings-auth-row{display:flex;align-items:center;gap:14px;padding:16px 18px;border-bottom:1px solid var(--border);background:var(--lime-bright)}
.settings-auth-row:last-child{border-bottom:none}
.settings-auth-avatar{width:38px;height:38px;border-radius:12px;background:var(--text);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;letter-spacing:-0.3px;flex-shrink:0}
.settings-auth-main{flex:1;min-width:0}
.settings-auth-email{font-size:13px;font-weight:500;color:var(--text);letter-spacing:-0.2px;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.settings-auth-meta{font-size:11px;color:var(--text-soft);margin-top:3px;font-weight:500;display:flex;align-items:center;gap:5px}
.settings-auth-meta .sync-dot{width:6px;height:6px;border-radius:99px;animation:breathe 3s var(--ease-in-out) infinite}

/* ============================================================
   DARK MODE OVERRIDES
   Fixes hardcoded whites & paywall tint that ignore --card var
   ============================================================ */
:root[data-theme="dark"] .header{background:rgba(20,16,14,0.92);border-bottom:1px solid var(--momo-sand)}
:root[data-theme="dark"] .bottom-nav{background:rgba(20,16,14,0.92);box-shadow:0 -4px 20px rgba(0,0,0,0.4)}
:root[data-theme="dark"] .sub-nav{background:transparent}
:root[data-theme="dark"] .form-sheet-header{background:rgba(20,16,14,0.92)}
:root[data-theme="dark"] .chat-input-row{background:rgba(20,16,14,0.92)}
:root[data-theme="dark"] .fe-smart-wrap{background:rgba(20,16,14,0.95)}
:root[data-theme="dark"] .sp-photo-tile .date{background:rgba(20,16,14,0.9);color:var(--text)}
/* Paywall + contextual gate sheet */
:root[data-theme="dark"] .pw-v4,
:root[data-theme="dark"] .mfg-v2{background:var(--bg);color:var(--text)}
:root[data-theme="dark"] .pw-v4-headline,
:root[data-theme="dark"] .mfg-v2-headline{color:var(--text)}
:root[data-theme="dark"] .pw-cta-wrap{background:linear-gradient(to top,var(--bg) 88%,rgba(14,22,24,0))}
:root[data-theme="dark"] .pw-v4-plan,
:root[data-theme="dark"] .pw-v4-faq-item,
:root[data-theme="dark"] .pw-v4-features > *{background:var(--card);border-color:var(--border);color:var(--text)}
:root[data-theme="dark"] .pw-close{background:rgba(23,35,42,0.85);border-color:rgba(255,255,255,0.08);color:var(--text)}
:root[data-theme="dark"] .pw-close:hover{background:var(--card)}
/* Inputs: focus state used background:#fff — switch to card */
:root[data-theme="dark"] .form-sheet-body input:focus,
:root[data-theme="dark"] .form-sheet-body textarea:focus,
:root[data-theme="dark"] .form-sheet-body select:focus,
:root[data-theme="dark"] .chat-input:focus,
:root[data-theme="dark"] .sp-set-input:focus{background:var(--card)}
/* Date-picker forced light color-scheme → switch to dark */
:root[data-theme="dark"] .date-input{color-scheme:dark}
/* Periodic tab active pill */
:root[data-theme="dark"] .period-tab.active,
:root[data-theme="dark"] .sp-stat-tab.active,
:root[data-theme="dark"] .share-format-tab.active,
:root[data-theme="dark"] .focus-mode-opt.active{box-shadow:0 1px 3px rgba(0,0,0,0.4),0 2px 8px rgba(0,0,0,0.3)}
/* Auth-avatar: Text bleibt hell für Kontrast */
:root[data-theme="dark"] .settings-auth-avatar{background:var(--green);color:var(--bg)}
/* Scrollbar zurückhaltend in dunkel */
:root[data-theme="dark"] ::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.08)}
:root[data-theme="dark"] ::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.14)}
/* "Body-als-Karte"-Feeling: App-Hintergrund ganz leicht dunkler als Karten */
:root[data-theme="dark"] body{background:var(--bg)}
/* Paywall + Gate: hardcoded grays for text */
:root[data-theme="dark"] .pw-v4-deck,
:root[data-theme="dark"] .pw-v4-eyebrow,
:root[data-theme="dark"] .pw-v4-plan-bottom,
:root[data-theme="dark"] .pw-v4-plan-per,
:root[data-theme="dark"] .pw-v4-plan-note,
:root[data-theme="dark"] .pw-v4-trial-line,
:root[data-theme="dark"] .pw-v4-faq-q-text,
:root[data-theme="dark"] .pw-v4-faq-a,
:root[data-theme="dark"] .pw-v4-feat-desc,
:root[data-theme="dark"] .pw-v4-foot-line,
:root[data-theme="dark"] .mfg-v2-plan-bottom,
:root[data-theme="dark"] .mfg-v2-trust,
:root[data-theme="dark"] .mfg-v2-more{color:var(--text-mid)}
:root[data-theme="dark"] .pw-v4-foot-line.faint{color:var(--text-soft)}
:root[data-theme="dark"] .pw-v4-plan-name,
:root[data-theme="dark"] .pw-v4-plan-price,
:root[data-theme="dark"] .pw-v4-feat-title,
:root[data-theme="dark"] .pw-v4-faq-q,
:root[data-theme="dark"] .mfg-v2-title,
:root[data-theme="dark"] .mfg-v2-plan-name,
:root[data-theme="dark"] .mfg-v2-plan-price,
:root[data-theme="dark"] .mfg-v2-icon{color:var(--text)}
:root[data-theme="dark"] .pw-v4-plan.selected,
:root[data-theme="dark"] .mfg-v2-plan.selected{border-color:var(--text);box-shadow:0 0 0 1px var(--text)}
:root[data-theme="dark"] .pw-v4-plan.selected .pw-v4-plan-radio,
:root[data-theme="dark"] .mfg-v2-plan.selected .mfg-v2-plan-radio{border-color:var(--text)}
:root[data-theme="dark"] .mfg-v2-icon{background:var(--card);border-color:var(--border)}
:root[data-theme="dark"] .mfg-v2-more:hover{color:var(--text);text-decoration-color:var(--text)}
/* Yearly-Karte (recommended) im Dark-Mode: Gold bleibt Gold, BG subtil dunkler */
:root[data-theme="dark"] .pw-v4-plan.recommended{
  background:linear-gradient(180deg,rgba(255,211,107,0.08) 0%,var(--card) 100%);
  border-color:rgba(255,211,107,0.28);
  box-shadow:0 1px 2px rgba(0,0,0,0.3),0 14px 32px -14px rgba(255,211,107,0.18);
}
:root[data-theme="dark"] .pw-v4-plan.recommended.selected{
  border-color:var(--accent);
  box-shadow:0 0 0 1px var(--accent),0 14px 32px -14px rgba(255,211,107,0.28);
}
:root[data-theme="dark"] .pw-v4-plan.recommended.selected .pw-v4-plan-radio{border-color:var(--accent)}
:root[data-theme="dark"] .pw-v4-plan.recommended.selected .pw-v4-plan-radio-dot{background:var(--accent)}
:root[data-theme="dark"] .pw-v4-foot-redeem{color:var(--text-soft)}
:root[data-theme="dark"] .pw-v4-foot-redeem a{color:var(--text-mid);text-decoration-color:var(--border)}
:root[data-theme="dark"] .pw-v4-foot-redeem a:hover{color:var(--text);text-decoration-color:var(--text)}

/* ============================================================
   DARK MODE — PRIMARY BUTTONS / ACTIVE STATES
   Flip "dark pill + white text" → "light pill + dark text"
   ============================================================ */
/* Primary CTAs in dark: Peach-Fill (brand accent) statt harte Cream — weniger grell, markentreu */
:root[data-theme="dark"] .btn,
:root[data-theme="dark"] .form-sheet-save,
:root[data-theme="dark"] .shop-add-btn,
:root[data-theme="dark"] .msg-user,
:root[data-theme="dark"] .chat-add-btn,
:root[data-theme="dark"] .chat-send,
:root[data-theme="dark"] .task-add-fab,
:root[data-theme="dark"] .ms-next-done-btn,
:root[data-theme="dark"] .focus-btn-primary,
:root[data-theme="dark"] .trk-meal-add,
:root[data-theme="dark"] .mmd-add-btn,
:root[data-theme="dark"] .share-btn-primary,
:root[data-theme="dark"] .streak-intro-cta,
:root[data-theme="dark"] .pw-cta{
  background:var(--momo-peach);
  color:var(--momo-charcoal);
  box-shadow:0 2px 4px rgba(0,0,0,0.35),0 10px 22px -8px rgba(245,184,171,0.35),inset 0 1px 0 rgba(255,255,255,0.12)
}
/* Active Selection-Chips in dark: Sand-Surface (elevated warm) — erkennbar selected, aber ruhig */
:root[data-theme="dark"] .sub-nav-btn.active,
:root[data-theme="dark"] .sort-btn.active,
:root[data-theme="dark"] .filter-btn.active,
:root[data-theme="dark"] .period-opt.sel,
:root[data-theme="dark"] .cal-day.cal-sel,
:root[data-theme="dark"] .cal-day.cal-sel.cal-today,
:root[data-theme="dark"] .sp-body-subtab.active,
:root[data-theme="dark"] .ob-quick-chip.sel,
:root[data-theme="dark"] .fe-tab.active,
:root[data-theme="dark"] .fa-meal-btn.sel{
  background:var(--momo-sand);
  color:var(--momo-cream);
  border-color:var(--momo-sand);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04)
}
/* Hover-Varianten, die ebenfalls invertieren wollten */
:root[data-theme="dark"] .header-icon-btn:hover,
:root[data-theme="dark"] .sp-more-card:hover .sp-more-ico,
:root[data-theme="dark"] .trk-settings-btn:hover,
:root[data-theme="dark"] .ob-stepper-btn:active{background:var(--text);color:var(--bg);border-color:var(--text)}
/* Border-Elemente, die --text als Akzent nutzen */
:root[data-theme="dark"] .sub-nav-btn.active,
:root[data-theme="dark"] .sort-btn.active,
:root[data-theme="dark"] .filter-btn.active,
:root[data-theme="dark"] .period-opt.sel,
:root[data-theme="dark"] .sp-body-subtab.active,
:root[data-theme="dark"] .ob-quick-chip.sel,
:root[data-theme="dark"] .fe-tab.active,
:root[data-theme="dark"] .fa-meal-btn.sel{border-color:var(--text)}
/* Ob-Progress-Dot: aktiv jetzt mit Accent statt --text */
:root[data-theme="dark"] .ob-progress-dot.active{background:var(--green)}
/* Slider-Thumb: weiße Border sieht auf dunklem BG raus */
:root[data-theme="dark"] .ob-slider::-webkit-slider-thumb{border-color:var(--card)}
/* Paywall-CTA: Gold-Akzent statt inverted (editorial-Feeling bleibt) */
:root[data-theme="dark"] .pw-cta{background:var(--accent);color:#1A1206;box-shadow:0 2px 4px rgba(0,0,0,0.4),0 14px 32px -8px rgba(255,211,107,0.25)}
/* Header-Brand-Ring + Headline: sicherstellen dass Text-Farbe stimmt */
:root[data-theme="dark"] .header-brand-text{color:var(--text)}

/* ============================================================
   SPRINT 1 FIX 2: Universal Tap-Feedback
   Alle interaktiven Elemente kriegen subtiles :active-Feedback
   damit User sofort weiß: "die App hat meinen Tap registriert"
   ============================================================ */

/* Basis-Regel für alle häufigen Button-Klassen, die bisher kein :active hatten */
.settings-row,
.trk-tile,
.trk-meal-chip,
.goal-card,
.goal-card-compact,
.ms-next-card,
.ms-week-stat,
.quote-card,
.focus-stage,
.focus-stat-row,
.sp-kpi,
.sp-quick-btn,
.sp-more-card,
.sp-plan-card,
.sp-ex-row,
.sp-ex-card,
.sp-wx-card,
.sp-meas-card,
.sp-ach-card,
.sp-ba-half,
.shop-item,
.task-card,
.meal-item,
.recipe-card,
.mgoal-task-row,
.mgoal-ms-row,
.streak-hero-card,
.streak-rules-v2,
.filter-btn,
.sort-btn,
.sub-nav-btn,
.period-tab,
.fe-tab,
.fa-meal-btn,
.ob-quick-chip,
.sp-body-subtab,
.sp-stat-tab,
.period-opt,
.prio-opt,
.task-mini-btn,
.share-format-tab,
.focus-mode-opt,
.focus-btn,
.focus-btn-primary,
.chat-add-btn,
.chat-send,
.shop-add-btn,
.shop-scan-btn,
.shop-clear,
.shop-del,
.trk-meal-add,
.trk-settings-btn,
.mmd-add-btn,
.mgoal-ms-check,
.ob-stepper-btn,
.ob-progress-dot,
.cal-day,
.header-icon-btn,
.header-brand,
.header-upgrade,
.btn,
.btn-outline,
.btn-sm,
.btn-del,
.btn-edit,
.btn-link,
.form-sheet-save,
.form-sheet-cancel,
.task-add-fab,
.ki-fab,
.pw-cta,
.pw-v4-plan,
.pw-v4-redeem-btn,
.pw-v4-faq-q,
.mfg-v2-plan,
.mfg-v2-cta,
.mfg-v2-more,
.msub-cta,
.lookup-toggle,
.theme-seg button{
  transition:transform 140ms cubic-bezier(0.23,1,0.32,1),background 180ms cubic-bezier(0.23,1,0.32,1),border-color 180ms cubic-bezier(0.23,1,0.32,1),color 180ms cubic-bezier(0.23,1,0.32,1),box-shadow 180ms cubic-bezier(0.23,1,0.32,1);
}

/* Tap-Scale für alle klickbaren Elemente — subtil aber taktil */
.settings-row:active,
.trk-tile:active,
.trk-meal-chip:active,
.goal-card:active,
.goal-card-compact:active,
.ms-next-card:active,
.ms-week-stat:active,
.quote-card:active,
.focus-stage:active,
.focus-stat-row:active,
.sp-kpi:active,
.sp-quick-btn:active,
.sp-more-card:active,
.sp-plan-card:active,
.sp-ex-row:active,
.sp-ex-card:active,
.sp-wx-card:active,
.sp-meas-card:active,
.sp-ach-card:active,
.sp-ba-half:active,
.shop-item:active,
.task-card:active,
.meal-item:active,
.recipe-card:active,
.mgoal-task-row:active,
.mgoal-ms-row:active,
.streak-rules-v2:active{
  transform:scale(0.985)
}

/* Buttons — etwas stärkerer Tap, weil primärer Interaktionspunkt */
.btn:active,
.btn-outline:active,
.btn-sm:active,
.form-sheet-save:active,
.shop-add-btn:active,
.shop-scan-btn:active,
.chat-send:active,
.chat-add-btn:active,
.trk-meal-add:active,
.mmd-add-btn:active,
.task-add-fab:active,
.ki-fab:active,
.pw-cta:active,
.mfg-v2-cta:active,
.msub-cta:active,
.header-upgrade:active{
  transform:scale(0.96)
}

/* Icon-Buttons & kleine Pills — stärkerer Press weil kleiner */
.header-icon-btn:active,
.header-brand:active,
.filter-btn:active,
.sort-btn:active,
.sub-nav-btn:active,
.period-tab:active,
.fe-tab:active,
.fa-meal-btn:active,
.task-mini-btn:active,
.share-format-tab:active,
.focus-mode-opt:active,
.cal-day:active,
.theme-seg button:active,
.ob-quick-chip:active{
  transform:scale(0.94)
}

/* Checkboxes/Radios visuell bestätigen */
.task-check:active,
.shop-check:active,
.milestone-check:active,
.sp-set-check:active,
.mgoal-ms-check:active{
  transform:scale(0.88)
}

/* Reduced-Motion: niemand will scales wenn er Motion deaktiviert hat */
@media (prefers-reduced-motion: reduce){
  .settings-row:active,.trk-tile:active,.goal-card:active,.goal-card-compact:active,
  .ms-next-card:active,.quote-card:active,.btn:active,.task-card:active,.meal-item:active,
  .header-icon-btn:active,.filter-btn:active,.period-tab:active,.pw-cta:active{
    transform:none;
    background:rgba(0,0,0,0.03)
  }
}

/* ============================================================
   SPRINT 1 FIX 3: Saving State
   Button-Visuals während async-Save (oder Double-Click-Prevention)
   ============================================================ */
.is-saving{
  opacity:0.72;
  pointer-events:none;
  cursor:progress;
  position:relative;
}
.is-saving::after{
  content:"";
  position:absolute;
  inset:0;
  background:inherit;
  opacity:0.15;
  border-radius:inherit;
  pointer-events:none;
}

/* ============================================================
   SPRINT 1 FIX 1: Empty-State Pattern
   Konsistente, einladende Empty-States mit Icon + Headline + Anleitung
   ============================================================ */
.empty-state{
  text-align:center;
  padding:40px 24px;
  max-width:340px;
  margin:0 auto;
}
.empty-state-icon{
  width:56px;height:56px;
  border-radius:99px;
  background:var(--lime-bright);
  color:var(--text-mid);
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 16px;
}
.empty-state-title{
  font-size:16px;font-weight:500;letter-spacing:-0.3px;
  color:var(--text);margin-bottom:6px;line-height:1.35;
}
.empty-state-text{
  font-size:13.5px;line-height:1.55;letter-spacing:-0.05px;
  color:var(--text-mid);
}
:root[data-theme="dark"] .empty-state-icon{background:var(--card);color:var(--text-soft)}

/* ============================================================
   iOS-Optimierungen — Safari-Quirks fixen
   ============================================================ */

/* Long-Press-Menü auf Buttons deaktivieren (iOS Callout) */
button,
.task-card,
.meal-item,
.goal-card,
.shop-item,
.recipe-card,
.nav-btn,
.settings-row{
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  user-select:none;
}

/* Smooth-Scrolling mit Momentum — essentiell für iOS */
html,body,.form-sheet-body,.modal-body{
  -webkit-overflow-scrolling:touch;
}

/* Double-Tap-Zoom verhindern auf interaktiven Elementen.
   WICHTIG: NICHT auf Body/Html setzen, sonst stirbt Pinch-Zoom für Bilder etc. */
button,a,input[type="button"],input[type="submit"],.nav-btn,
.settings-row,.task-card,.goal-card,.shop-item,.filter-btn,
.sub-nav-btn,.period-tab,.fe-tab,.cal-day{
  touch-action:manipulation;
}

/* Input-Felder: Text-Selection erlaubt (sonst kann man nicht kopieren) */
input,textarea{
  -webkit-user-select:text;
  user-select:text;
  -webkit-touch-callout:default;
}

/* Safari Backdrop-Filter-Performance: "will-change" sparsam */
.header,.bottom-nav,.sub-nav,.form-sheet-header{
  will-change:auto;  /* explizit, weil Safari sonst memory leakt */
}

/* iOS Fix: Date-Inputs nicht rauszoomen */
input[type="date"],
input[type="datetime-local"],
input[type="time"],
input[type="month"]{
  min-height:48px;  /* Touch-Target */
}

/* iOS: Autofill-Gelb unterdrücken (verfärbt Eingabe-Felder) */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill{
  -webkit-box-shadow:0 0 0px 1000px var(--card) inset;
  -webkit-text-fill-color:var(--text);
  transition:background-color 5000s ease-in-out 0s;
}

/* iOS PWA Standalone-Mode: Status-Bar-Space reservieren */
/* BUGFIX: body padding-top im Standalone verursachte double-padding
   weil der Header bereits die Safe-Area absorbiert. Entfernt. */
/* @media all and (display-mode:standalone){
  body{padding-top:env(safe-area-inset-top)}
} */

/* iOS-Gesture-Zone oben (Dynamic Island, Notch) nicht mit Content überlappen */
.header{
  padding-top:max(env(safe-area-inset-top),10px);
}

/* ═══════════════════════════════════════════════════════════════════
   ╔═══════════════════════════════════════════════════════════════╗
   ║  TANREN · MOMO DESIGN SYSTEM — Canonical Layer                ║
   ║                                                               ║
   ║  EINE Schicht, EIN Truth. Ersetzt ALLE vorherigen Overrides.  ║
   ║                                                               ║
   ║  Token-Palette:                                               ║
   ║    Peach    #F4B4A6  · Seltener Gast (Accent, 3-5%)           ║
   ║    Cream    #F7F2EA  · Hauptbühne (Hintergrund)               ║
   ║    Charcoal #1A1614  · Typografie + Struktur                  ║
   ║    Sand     #D9CEC0  · Borders, Dividers                      ║
   ║    Plum     #3A2A2E  · Rare depth moments                     ║
   ║                                                               ║
   ║  Regeln:                                                      ║
   ║    1. Peach NIEMALS Hintergrund                               ║
   ║    2. Peach markiert Aktion + Erfolg (CTA, Progress, Focus)   ║
   ║    3. Keine Gradients, kein Blur (außer Modal-Scrim)          ║
   ║    4. Flache Surfaces, 1px Sand-Border, keine Shadows         ║
   ║    5. Typografie trägt das Design                             ║
   ╚═══════════════════════════════════════════════════════════════╝
   ═══════════════════════════════════════════════════════════════════ */

/* ─── Palette-Tokens anchored (exakt deine 5 Farben) ─── */
:root{
  --momo-peach:#F4B4A6;
  --momo-cream:#F7F2EA;
  --momo-charcoal:#1A1614;
  --momo-sand:#D9CEC0;
  --momo-plum:#3A2A2E;
  --momo-cream-warm:#EFE8DC;  /* Cream-Tint für Hover-States */
  --momo-ink-mid:#6B5F55;     /* Text Secondary — ~6.5:1 auf Cream */
  --momo-ink-soft:#7A6E60;    /* Text Tertiary — ~4.7:1 auf Cream (WCAG AA) */
  --btn-primary-hover:#2E2622;/* Hover für Primary-Button (Charcoal-Tint) */
  --accent-text:#8B6000;      /* Gold-Text auf accent-soft (peach-tint) */
  --warn-bg:#FAE3D6;          /* Warn-Chip BG (sanftes Peach-Cream) */
  --warn-text:#8C3A2A;        /* Warn-Chip Text (Burnt-Plum) */
}
:root[data-theme="dark"]{
  --momo-peach:#F5B8AB;
  --momo-cream:#F7F2EA;
  --momo-charcoal:#14100E;    /* Im Dark: Charcoal wird BG */
  --momo-sand:#3A332E;        /* Warm dark gray */
  --momo-plum:#D4B7BA;        /* Plum wird zu rose highlight */
  --momo-cream-warm:#1E1814;
  --momo-ink-mid:#C2B5A5;     /* ~8:1 auf Dark-BG */
  --momo-ink-soft:#8F8478;    /* ~5:1 auf Dark-BG (WCAG AA) */
  --btn-primary-hover:#3A332E;
  --accent-text:#F2C57C;      /* Hell-Gold auf Dark-accent-soft (~5.5:1) */
  --warn-bg:#3A1810;          /* Dark: tiefes Plum */
  --warn-text:#F7CFB8;        /* Dark: Hell-Peach (~7:1 Kontrast) */
}

/* Legacy-Variablen-Alias (damit existierender Code funktioniert) */
:root{
  --green:var(--momo-peach);
  --green-mid:#E89F8F;
  --green-light:#FBE5DE;
  --lime:var(--momo-cream-warm);
  --lime-bright:var(--momo-cream);
  --accent:var(--momo-peach);
  --accent-soft:#FBE5DE;
  --bg:var(--momo-cream);
  --card:var(--momo-cream);  /* Cards haben KEINEN anderen BG als Cream */
  --border:var(--momo-sand);
  --text:var(--momo-charcoal);
  --text-mid:var(--momo-ink-mid);
  --text-soft:var(--momo-ink-soft);
}
:root[data-theme="dark"]{
  --green:var(--momo-peach);
  --green-mid:#EEA395;
  --green-light:#3A2420;
  --lime:var(--momo-sand);
  --lime-bright:#2A2420;
  --accent:var(--momo-peach);
  --bg:var(--momo-charcoal);
  --card:var(--momo-charcoal);
  --border:var(--momo-sand);
  --text:var(--momo-cream);
  --text-mid:var(--momo-ink-mid);
  --text-soft:var(--momo-ink-soft);
}

/* Display-Font (Reckless-Replacement via Fraunces) */
:root{
  --font-display:'Fraunces','Cardo','Playfair Display',Georgia,serif;
}

/* ═══════════════════════════════════════════════════════════════════
   1. FOUNDATION — Body & Background
   ═══════════════════════════════════════════════════════════════════ */

body{
  background:var(--momo-cream);
  color:var(--momo-charcoal);
}
:root[data-theme="dark"] body{
  background:var(--momo-charcoal);
  color:var(--momo-cream);
}

/* ═══════════════════════════════════════════════════════════════════
   2. CARDS — Transparent with 1px Sand border, NO shadows, NO fill
   ═══════════════════════════════════════════════════════════════════ */

.bento,
.bento-accent,
.home-card,
.home-full-card,
.home-bento-widget,
.home-bento-slot,
.home-stats-quick,
.goal-card,
.goal-card-compact,
.ms-next-card,
.ms-week-stat,
.ms-daily-quote,
.quote-card,
.sp-plan-card,
.sp-ex-card,
.sp-wx-card,
.sp-meas-card,
.sp-meas-section,
.sp-ba-half,
.sp-ach-card,
.sp-kpi,
.sp-quick-btn,
.sp-more-card,
.sp-chart,
.sp-hero,
.sp-hero-card,
.sp-dash-hero,
.sp-active-plan,
.sp-body,
.focus-stage,
.focus-settings,
.focus-stat-row,
.focus-goal-option,
.timer-card,
.cal-wrap,
.streak-hero-card,
.streak-rules-v2,
.streak-heatmap,
.streak-stats-split,
.streak-ms-wrap,
.streak-rules,
.shop-hero,
.task-hero,
.spw-hero,
.mgoal-hero-card,
.mst-hero,
.mst-heat,
.mst-stats,
.ob-live-preview,
.settings-row,
.settings-auth-row,
.pw-v4-plan,
.mfg-v2-plan,
.rank-card,
.rank-current,
.rank-next,
.rank-boost,
.mgoal-ms-list,
.mgoal-tasks,
.chat-recipe-card,
.confetti-content,
.msub-card,
.msub-section,
.pw-current,
.pw-trial-banner,
.pw-v4-trial-line,
.pw-context-banner{
  background:transparent;
  background-color:transparent;
  border:1px solid var(--momo-sand);
  border-radius:14px;
  box-shadow:none;
}
:root[data-theme="dark"] .bento,
:root[data-theme="dark"] .bento-accent,
:root[data-theme="dark"] .home-card,
:root[data-theme="dark"] .home-full-card,
:root[data-theme="dark"] .goal-card,
:root[data-theme="dark"] .quote-card,
:root[data-theme="dark"] .settings-row,
:root[data-theme="dark"] .pw-v4-plan{
  border-color:var(--momo-sand);
  background:transparent;
}

/* Kill gradients + decorative ::before / ::after on hero-type cards */
.streak-hero-card::before,
.streak-hero-card::after,
.task-hero::before,
.shop-hero::before,
.sp-hero::before,
.sp-hero-card::before,
.bento-accent::before,
.bento-accent::after,
.mgoal-hero-card::before,
.mst-hero::before,
.pw-compare-col.pro::before{
  display:none;
}

/* Die alte Daily-Quote mit Gradient-Rand — neu: einfache Sand-Line links */
.ms-daily-quote::before{
  content:none;
}
.ms-daily-quote{
  border-left:2px solid var(--momo-peach);
  border-radius:0;
  padding-left:16px;
}

/* ═══════════════════════════════════════════════════════════════════
   3. TYPOGRAFIE — Fraunces für Heroes, Geist für UI, Mono für Data
   ═══════════════════════════════════════════════════════════════════ */

/* Hero-Numbers (die großen editorial-Momente) */
.bento-value,
.home-hero-streak-num,
.streak-hero-number,
.task-hero-count,
.sp-body-weight,
.spw-hero-val,
.mst-hero-num,
.rank-number,
.pw-v4-headline,
.mfg-v2-title,
.home-stats-val,
.home-stats-quick-num,
.confetti-title,
.ms-week-val,
.goal-progress-pct,
.focus-time,
.streak-ms-num,
.auth-wall-title,
.settings-head-title,
.pw-hero-title,
.mgoal-title,
.mst-title,
.msub-title{
  font-family:var(--font-display);
  font-weight:300;
  font-variation-settings:"SOFT" 50,"opsz" 144;
  letter-spacing:-0.04em;
  background:none;
  -webkit-background-clip:border-box;
  background-clip:border-box;
  -webkit-text-fill-color:currentColor;
  color:var(--momo-charcoal);
}
:root[data-theme="dark"] .bento-value,
:root[data-theme="dark"] .home-hero-streak-num,
:root[data-theme="dark"] .streak-hero-number,
:root[data-theme="dark"] .task-hero-count,
:root[data-theme="dark"] .sp-body-weight,
:root[data-theme="dark"] .spw-hero-val,
:root[data-theme="dark"] .mst-hero-num,
:root[data-theme="dark"] .rank-number,
:root[data-theme="dark"] .pw-v4-headline,
:root[data-theme="dark"] .mfg-v2-title,
:root[data-theme="dark"] .home-stats-val,
:root[data-theme="dark"] .confetti-title,
:root[data-theme="dark"] .auth-wall-title{
  color:var(--momo-cream);
}

/* Italic Fraunces für quote-like Elemente */
.home-hero-quote,
.streak-hero-sub,
.sp-body-trend,
.pw-v4-deck,
.home-hero-greeting,
.streak-quote{
  font-family:var(--font-display);
  font-style:italic;
  font-weight:400;
  font-variation-settings:"SOFT" 100;
  color:var(--momo-ink-mid);
}

/* Mono-Caps für Labels */
.bento-label,
.streak-hero-label,
.home-streak-label,
.home-hero-streak-cap,
.task-hero-title,
.shop-hero-title,
.home-section-title > span:first-child,
.sp-body-label,
.settings-group-title,
.mgoal-section-title,
.sp-section-title,
.pw-v4-eyebrow,
.home-stats-quick-title,
.home-stats-quick-lbl,
.wordmark,
.home-hero-date{
  font-family:'Geist Mono',ui-monospace,monospace;
  font-size:10.5px;
  letter-spacing:1.8px;
  text-transform:uppercase;
  color:var(--momo-ink-soft);
  font-weight:600;
}

/* Body-Copy + Subs */
.home-card-sub,
.goal-desc,
.bento-sub,
.pw-v4-feat-desc{
  color:var(--momo-ink-mid);
  font-size:13px;
}

/* ═══════════════════════════════════════════════════════════════════
   4. NAVIGATION — Bottom-Nav with Peach indicator, Header clean
   ═══════════════════════════════════════════════════════════════════ */

.bottom-nav{
  background:rgba(247,242,234,0.92);
  backdrop-filter:saturate(1.4) blur(14px);
  -webkit-backdrop-filter:saturate(1.4) blur(14px);
  border-top:1px solid var(--momo-sand);
  box-shadow:none;
}
:root[data-theme="dark"] .bottom-nav{
  background:rgba(20,16,14,0.92);
}

.nav-btn{
  background:transparent;
  color:var(--momo-ink-soft);
  box-shadow:none;
  padding:14px 0 10px;
  border-radius:0;
  position:relative;
}
.nav-btn.active{
  background:transparent;
  color:var(--momo-charcoal);
  box-shadow:none;
}
:root[data-theme="dark"] .nav-btn.active{color:var(--momo-cream)}
.nav-btn.active::before{
  content:"";
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:24px;
  height:2px;
  background:var(--momo-peach);
  border-radius:0 0 2px 2px;
}
.nav-btn .icon svg{stroke-width:1.5}
.nav-btn.active .icon svg{stroke-width:1.75}
.nav-btn span:not(.icon){
  font-size:10px;
  letter-spacing:0.1px;
  font-weight:500;
  font-family:'Geist',sans-serif;
}

/* Header */
.header{
  background:rgba(247,242,234,0.92);
  backdrop-filter:saturate(1.4) blur(12px);
  -webkit-backdrop-filter:saturate(1.4) blur(12px);
  border-bottom:1px solid var(--momo-sand);
  box-shadow:none;
}
:root[data-theme="dark"] .header{
  background:rgba(20,16,14,0.92);
}
.header-brand-text,
.auth-wall-brand-text{
  font-family:var(--font-display);
  font-weight:400;
  font-variation-settings:"SOFT" 50;
  color:var(--momo-charcoal);
  background:none;
  -webkit-text-fill-color:var(--momo-charcoal);
  font-size:18px;
  letter-spacing:-0.4px;
}
:root[data-theme="dark"] .header-brand-text,
:root[data-theme="dark"] .auth-wall-brand-text{
  color:var(--momo-cream);
  -webkit-text-fill-color:var(--momo-cream);
}
.header-brand-ring,
.header-brand svg{color:var(--momo-peach)}

.header-icon-btn{
  background:transparent;
  border:1px solid var(--momo-sand);
  color:var(--momo-ink-mid);
  box-shadow:none;
}

/* Pro-Pill: Charcoal caps with Peach star */
.header-upgrade{
  background:var(--momo-charcoal);
  color:var(--momo-cream);
  padding:5px 12px;
  font-size:10.5px;
  font-family:'Geist Mono',ui-monospace,monospace;
  letter-spacing:1px;
  text-transform:uppercase;
  font-weight:600;
  border-radius:99px;
  box-shadow:none;
  border:none;
}
:root[data-theme="dark"] .header-upgrade{
  background:var(--momo-peach);
  color:var(--momo-charcoal);
}
:root[data-theme="dark"] .header-upgrade svg{color:var(--momo-charcoal)}
.header-upgrade svg{color:var(--momo-peach);width:10px;height:10px}

/* Sub-Nav (Dashboard/Training/etc.) */
.sub-nav{
  background:transparent;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  border-bottom:none;
  padding:14px 16px 10px;
}
.sub-nav-btn{
  background:transparent;
  border:1px solid var(--momo-sand);
  color:var(--momo-ink-mid);
  box-shadow:none;
  font-family:'Geist',sans-serif;
}
.sub-nav-btn.active{
  background:var(--momo-charcoal);
  color:var(--momo-cream);
  border-color:var(--momo-charcoal);
  box-shadow:none;
}
:root[data-theme="dark"] .sub-nav-btn.active{
  background:var(--momo-sand);
  color:var(--momo-cream);
  border-color:var(--momo-sand);
}

/* ═══════════════════════════════════════════════════════════════════
   5. BUTTONS — Primary = Charcoal, Peach only for success
   ═══════════════════════════════════════════════════════════════════ */

.btn,
.pw-cta,
.mfg-v2-cta,
.shop-add-btn,
.chat-add-btn,
.chat-send,
.trk-meal-add,
.mmd-add-btn,
.task-add-fab,
.form-sheet-save,
.share-btn-primary,
.streak-intro-cta,
.ms-next-done-btn,
.focus-btn-primary,
.msub-cta,
.home-full-card-cta,
.streak-share-btn,
.ki-fab{
  background:var(--momo-charcoal);
  color:var(--momo-cream);
  box-shadow:none;
  border:none;
  font-family:'Geist',sans-serif;
  font-weight:500;
}
:root[data-theme="dark"] .btn,
:root[data-theme="dark"] .pw-cta,
:root[data-theme="dark"] .home-full-card-cta,
:root[data-theme="dark"] .streak-share-btn{
  background:var(--momo-peach);
  color:var(--momo-charcoal);
}

/* Secondary / Outline buttons */
.btn-outline{
  background:transparent;
  border:1px solid var(--momo-sand);
  color:var(--momo-charcoal);
  box-shadow:none;
}
:root[data-theme="dark"] .btn-outline{
  color:var(--momo-cream);
}

/* Chips & Tags */
.filter-btn,
.sort-btn,
.period-tab,
.fe-tab,
.fa-meal-btn,
.task-mini-btn,
.ob-quick-chip,
.sp-body-subtab,
.sp-stat-tab,
.share-format-tab,
.focus-mode-opt,
.goal-cat,
.chip-tag,
.recipe-cat{
  background:transparent;
  border:1px solid var(--momo-sand);
  color:var(--momo-ink-mid);
  box-shadow:none;
  font-family:'Geist',sans-serif;
}
.filter-btn.active,
.sort-btn.active,
.period-tab.active,
.fe-tab.active,
.fa-meal-btn.sel,
.ob-quick-chip.sel,
.sp-body-subtab.active,
.sp-stat-tab.active,
.share-format-tab.active,
.focus-mode-opt.active{
  background:var(--momo-charcoal);
  color:var(--momo-cream);
  border-color:var(--momo-charcoal);
  box-shadow:none;
}
:root[data-theme="dark"] .filter-btn.active,
:root[data-theme="dark"] .sort-btn.active,
:root[data-theme="dark"] .period-tab.active{
  background:var(--momo-cream);
  color:var(--momo-charcoal);
}

/* ═══════════════════════════════════════════════════════════════════
   6. PEACH ACCENTS — Only where it matters
   ═══════════════════════════════════════════════════════════════════ */

/* Progress-Bar Fills */
.goal-progress-fill,
.mgoal-progress-fill,
.task-progress-fill,
.shop-progress-fill,
.rank-progress-fill,
.trk-macro-bar-fill{
  background:var(--momo-peach);
}
.goal-progress-bar,
.mgoal-progress-bar,
.task-progress,
.shop-progress,
.rank-progress-bar,
.trk-macro-bar{
  background:var(--momo-sand);
}

/* Input Focus */
.form-sheet-body input:focus,
.form-sheet-body textarea:focus,
.chat-input:focus,
.search-input:focus,
.shop-add-input:focus{
  border-color:var(--momo-peach);
  box-shadow:none;
  outline:none;
}

/* Paywall recommended plan */
.pw-v4-plan.recommended{
  border-color:var(--momo-peach);
}
.pw-v4-plan.recommended::before{
  background:var(--momo-peach);
  height:2px;
}
.pw-v4-plan.selected{
  border-color:var(--momo-charcoal);
  box-shadow:0 0 0 1px var(--momo-charcoal);
}
:root[data-theme="dark"] .pw-v4-plan.selected{
  border-color:var(--momo-cream);
  box-shadow:0 0 0 1px var(--momo-cream);
}

/* Heat-Map-Cells: Peach-Opacity-Skala */
.sp-heat-cell.l1,
.mst-heat-cell.l1{background:rgba(244,180,166,0.25);border-color:transparent}
.sp-heat-cell.l2,
.mst-heat-cell.l2{background:rgba(244,180,166,0.5);border-color:transparent}
.sp-heat-cell.l3,
.mst-heat-cell.l3{background:rgba(244,180,166,0.75);border-color:transparent}
.sp-heat-cell.l4{background:var(--momo-peach);border-color:transparent}

/* ═══════════════════════════════════════════════════════════════════
   7. SETTINGS-ROWS — iOS-like grouped list
   ═══════════════════════════════════════════════════════════════════ */

.settings-row{
  background:transparent;
  border:1px solid var(--momo-sand);
  border-bottom:none;
  border-radius:0;
  box-shadow:none;
}
.settings-group > .settings-row:first-child{border-radius:14px 14px 0 0}
.settings-group > .settings-row:last-child{border-radius:0 0 14px 14px;border-bottom:1px solid var(--momo-sand)}
.settings-group > .settings-row:only-child{border-radius:14px;border-bottom:1px solid var(--momo-sand)}
.settings-row-icon{
  background:transparent;
  color:var(--momo-ink-mid);
  border:1px solid var(--momo-sand);
  box-shadow:none;
}
.settings-row-icon.danger{color:var(--danger);border-color:var(--danger-soft)}

/* ═══════════════════════════════════════════════════════════════════
   8. FORMS — Flat fields with Peach focus
   ═══════════════════════════════════════════════════════════════════ */

.form-sheet{background:var(--momo-cream)}
:root[data-theme="dark"] .form-sheet{background:var(--momo-charcoal)}

.form-sheet-header{
  background:rgba(247,242,234,0.92);
  backdrop-filter:saturate(1.4) blur(12px);
  -webkit-backdrop-filter:saturate(1.4) blur(12px);
  border-bottom:1px solid var(--momo-sand);
}
:root[data-theme="dark"] .form-sheet-header{
  background:rgba(20,16,14,0.92);
}

.form-sheet-body input,
.form-sheet-body textarea,
.form-sheet-body select,
.search-input,
.shop-add-input,
.chat-input{
  background:var(--momo-cream-warm);
  border:1px solid var(--momo-sand);
  color:var(--momo-charcoal);
  box-shadow:none;
}
:root[data-theme="dark"] .form-sheet-body input,
:root[data-theme="dark"] .form-sheet-body textarea,
:root[data-theme="dark"] .search-input,
:root[data-theme="dark"] .chat-input{
  background:var(--momo-cream-warm);
  color:var(--momo-cream);
}

.form-sheet-body input:focus,
.form-sheet-body textarea:focus,
.search-input:focus{
  border-color:var(--momo-peach);
  background:var(--momo-cream);
  box-shadow:none;
}
:root[data-theme="dark"] .form-sheet-body input:focus{
  background:var(--momo-cream-warm);
}

/* ═══════════════════════════════════════════════════════════════════
   9. MODAL / OVERLAY — Only place with scrim + blur
   ═══════════════════════════════════════════════════════════════════ */

.overlay,
.form-sheet-overlay{
  background:rgba(26,22,20,0.5);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
}

.modal{
  background:var(--momo-cream);
  box-shadow:0 -8px 40px rgba(26,22,20,0.14);
}
:root[data-theme="dark"] .modal{
  background:var(--momo-charcoal);
}

/* ═══════════════════════════════════════════════════════════════════
   10. SPACING — 4/8dp rhythm, section hierarchy
   ═══════════════════════════════════════════════════════════════════ */

/* Section: padding überall AUSSER Home (da hat Hero edge-to-edge)
   16px oben damit der Content nicht direkt am Header klebt */
.section{padding:16px 16px 24px}
#tab-home.section{padding:0 0 24px}
/* Home: Children bringen eigenes Padding mit */
.home-bento{
  padding:0 16px;
  gap:10px;
  margin-bottom:24px;
}
.home-bento-head{padding:0 16px}
.home-section-title{
  margin:24px 16px 12px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
#home-today,#home-goals{margin:0 16px}
#home-stats-quick{margin:0 16px 8px}
.home-section-title .link{
  font-family:'Geist',sans-serif;
  font-size:12px;
  color:var(--momo-charcoal);
  font-weight:500;
  text-transform:none;
  letter-spacing:-0.05px;
  padding:5px 10px;
  border-radius:99px;
  border:1px solid var(--momo-sand);
  background:transparent;
  cursor:pointer;
}
:root[data-theme="dark"] .home-section-title .link{color:var(--momo-cream)}

/* Bento Widgets: clean grid with Sand border */
.bento{padding:16px;border-radius:14px}
.bento-value{
  font-size:30px;
  letter-spacing:-1.5px;
  margin-top:8px;
  color:var(--momo-charcoal);
}
:root[data-theme="dark"] .bento-value{color:var(--momo-cream)}
.bento-icon{
  width:26px;
  height:26px;
  background:transparent;
  color:var(--momo-ink-soft);
  box-shadow:none;
  opacity:0.6;
}
.bento-label{margin-bottom:0}

/* Bento accent (wide task-card) kein gradient */
.bento-accent,
.bento-accent .bento-label,
.bento-accent .bento-value,
.bento-accent .bento-sub,
.bento-accent .bento-value small{
  color:var(--momo-charcoal);
}
:root[data-theme="dark"] .bento-accent,
:root[data-theme="dark"] .bento-accent .bento-value{color:var(--momo-cream)}
:root[data-theme="dark"] .bento-accent .bento-label,
:root[data-theme="dark"] .bento-accent .bento-sub{color:var(--momo-ink-mid)}
.bento-accent .bento-icon{
  background:transparent;
  color:var(--momo-ink-soft);
}

/* Home Hero V2 — mittig, mittlere Größe */
.home-hero-v2{
  padding:40px 24px 36px;
  margin-bottom:0;
  border-bottom:1px solid var(--momo-sand);
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}
.home-hero-v2 .home-hero-date{
  display:none; /* in der Demo-Variante kein Datum */
}
.home-hero-v2 .home-hero-greeting{
  display:none; /* kein Greeting — nur Streak + Quote */
}
.home-hero-streak{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
}
.home-hero-streak-num{
  font-family:var(--font-display);
  font-weight:300;
  font-size:clamp(88px,22vw,128px);
  letter-spacing:-4px;
  line-height:0.95;
  color:var(--momo-charcoal);
}
:root[data-theme="dark"] .home-hero-streak-num{color:var(--momo-cream)}
.home-hero-streak-cap{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-family:'Geist Mono',ui-monospace,monospace;
  font-size:10px;
  letter-spacing:1.8px;
  text-transform:uppercase;
  color:var(--momo-ink-soft);
  font-weight:600;
}
.home-hero-streak-cap::before,
.home-hero-streak-cap::after{
  content:"";
  display:block;
  width:22px;
  height:1px;
  background:var(--momo-sand);
}
.home-hero-quote{
  margin-top:14px;
  font-family:var(--font-display);
  font-style:italic;
  font-weight:400;
  font-size:15px;
  color:var(--momo-ink-mid);
  max-width:280px;
  line-height:1.4;
}
.home-hero-v2 + .home-bento-head{padding-top:18px}

/* Paywall spacing */
.pw-v4-hero{padding:32px 24px 20px;text-align:center}
.pw-v4-section{padding:0 20px 24px}
.pw-v4-plans{gap:8px}
.pw-v4-plan{padding:16px 18px}

/* Bottom-Nav spacing */
.bottom-nav{padding:10px 12px calc(env(safe-area-inset-bottom) + 12px)}

/* ═══════════════════════════════════════════════════════════════════
   11. CONFETTI / CELEBRATION — Subtle, not gaudy
   ═══════════════════════════════════════════════════════════════════ */

.confetti-content{
  background:var(--momo-cream);
  border:1px solid var(--momo-sand);
  box-shadow:0 20px 40px -16px rgba(26,22,20,0.15);
}
.confetti-title{
  font-family:var(--font-display);
  font-weight:300;
  color:var(--momo-charcoal);
}

/* ═══════════════════════════════════════════════════════════════════
   12. STREAK HERO — Flat cream with Fraunces, NO gradient card
   ═══════════════════════════════════════════════════════════════════ */

.streak-hero-card{
  background:transparent;
  color:var(--momo-charcoal);
  border:1px solid var(--momo-sand);
  box-shadow:none;
  padding:28px 24px 26px;
}
:root[data-theme="dark"] .streak-hero-card{color:var(--momo-cream)}
.streak-hero-flame-wrap,
.streak-hero-flame-inner,
.streak-hero-flame-glow{display:none}
.streak-hero-number{
  color:var(--momo-charcoal);
  background:none;
  -webkit-text-fill-color:var(--momo-charcoal);
  font-family:var(--font-display);
  font-weight:300;
  font-variation-settings:"SOFT" 50,"opsz" 144;
  letter-spacing:-0.05em;
}
:root[data-theme="dark"] .streak-hero-number{
  color:var(--momo-cream);
  -webkit-text-fill-color:var(--momo-cream);
}
.streak-hero-label{color:var(--momo-peach)}
.streak-hero-status-pill{
  background:rgba(244,180,166,0.18);
  color:var(--momo-peach);
  border:1px solid rgba(244,180,166,0.35);
}

/* Share-Card (exported) bleibt dark — das ist Poster-Art */
.share-card{
  background:var(--momo-charcoal);
  color:var(--momo-cream);
}
.share-card-bg{display:none}
.share-card-number{
  background:none;
  -webkit-text-fill-color:var(--momo-cream);
  color:var(--momo-cream);
  font-family:var(--font-display);
  font-weight:300;
}

/* ═══════════════════════════════════════════════════════════════════
   13. ICONS — Consistent stroke-width, subtle color
   ═══════════════════════════════════════════════════════════════════ */

.settings-row-chevron{color:var(--momo-ink-soft)}
.home-section-title .link svg{stroke-width:1.75}

/* ═══════════════════════════════════════════════════════════════════
   14. AUTH-WALL
   ═══════════════════════════════════════════════════════════════════ */

.auth-wall{background:var(--momo-cream)}
:root[data-theme="dark"] .auth-wall{background:var(--momo-charcoal)}
.auth-wall-inner{background:transparent;box-shadow:none}
.auth-wall-title{
  font-family:var(--font-display);
  font-weight:300;
  font-variation-settings:"SOFT" 50;
  font-size:32px;
  letter-spacing:-1px;
  color:var(--momo-charcoal);
}
.auth-wall-sub{
  font-family:var(--font-display);
  font-style:italic;
  font-variation-settings:"SOFT" 100;
  color:var(--momo-ink-mid);
}
.auth-wall-tab{
  background:transparent;
  color:var(--momo-ink-mid);
  border:1px solid var(--momo-sand);
}
.auth-wall-tab.active{
  background:var(--momo-charcoal);
  color:var(--momo-cream);
  border-color:var(--momo-charcoal);
}
:root[data-theme="dark"] .auth-wall-tab.active{
  background:var(--momo-cream);
  color:var(--momo-charcoal);
}


/* ═══════════════════════════════════════════════════════════════════
   BUG FIXES — Text-Color + Border für ent-gradient-te Cards
   Diese Cards hatten Dark-Gradient + color:#fff — jetzt brauchen sie
   proper Text-Color und Sand-Border
   ═══════════════════════════════════════════════════════════════════ */

.ms-dash-cta,
.ms-week-card-inner,
.sp-workout-hdr,
.sp-body-current,
.sp-sum-box,
.prod-nutri.hero,
.trk-sport,
.mmd-summary,
.quote-daily-card,
.pw-hero,
.ob-live-preview{
  color:var(--momo-charcoal);
  border:1px solid var(--momo-sand);
  border-radius:14px;
  box-shadow:none;
}
:root[data-theme="dark"] .ms-dash-cta,
:root[data-theme="dark"] .ms-week-card-inner,
:root[data-theme="dark"] .sp-workout-hdr,
:root[data-theme="dark"] .sp-body-current,
:root[data-theme="dark"] .sp-sum-box,
:root[data-theme="dark"] .mmd-summary,
:root[data-theme="dark"] .quote-daily-card,
:root[data-theme="dark"] .ob-live-preview{
  color:var(--momo-cream);
}

/* Kill remaining ::before / ::after decorations on these cards */
.ms-dash-cta::before,
.ms-dash-cta::after,
.ms-week-card-inner::before,
.ms-week-card-inner::after,
.quote-daily-card::before,
.quote-daily-card::after,
.sp-body-current::after,
.sp-sum-box::before,
.sp-sum-box::after,
.mmd-summary::after,
.trk-sport::before,
.pw-hero::before{
  display:none!important;
}

/* ─── MEAL-DETAIL SUMMARY (Mittagessen-Detail) ─── */
.mmd-summary{
  padding:22px 20px;
  background:transparent;
}
.mmd-summary-kcal{
  font-family:var(--font-display);
  font-weight:300;
  font-variation-settings:"SOFT" 50,"opsz" 144;
  letter-spacing:-0.045em;
  color:var(--momo-charcoal);
}
:root[data-theme="dark"] .mmd-summary-kcal{color:var(--momo-cream)}
.mmd-summary-date{
  color:var(--momo-peach);
  font-family:'Geist Mono',ui-monospace,monospace;
  font-weight:600;
}
.mmd-macro{
  background:transparent;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  border:1px solid var(--momo-sand);
}
.mmd-macro-name{
  color:var(--momo-ink-soft);
  opacity:1;
}
.mmd-macro-val{color:var(--momo-charcoal)}
:root[data-theme="dark"] .mmd-macro-val{color:var(--momo-cream)}

/* ─── SHOP-HERO / TASK-HERO (war dark gradient, jetzt flat) ─── */
.shop-hero,
.task-hero{
  background:transparent;
  color:var(--momo-charcoal);
  border:1px solid var(--momo-sand);
  box-shadow:none;
  padding:24px 22px 20px;
}
:root[data-theme="dark"] .shop-hero,
:root[data-theme="dark"] .task-hero{color:var(--momo-cream)}
.shop-hero::after,
.task-hero::after{display:none}
.shop-hero-title,
.task-hero-title{color:var(--momo-peach)}

/* ─── SP-HERO (Sport Dashboard Hero) ─── */
.sp-hero{
  background:transparent;
  color:var(--momo-charcoal);
  border:1px solid var(--momo-sand);
  box-shadow:none;
}
:root[data-theme="dark"] .sp-hero{color:var(--momo-cream)}
.sp-hero::after{display:none}
.sp-hero-sub{color:var(--momo-ink-mid)}

/* ─── SP-QUICK-BTN (die 3 Schnellzugriff-Buttons unten) ─── */
.sp-quick-btn{
  background:transparent;
  border:1px solid var(--momo-sand);
  color:var(--momo-charcoal);
  box-shadow:none;
}
:root[data-theme="dark"] .sp-quick-btn{color:var(--momo-cream)}
.sp-quick-btn svg{
  color:var(--momo-ink-mid);
  opacity:0.7;
}
.sp-quick-ico{
  background:transparent;
  color:var(--momo-ink-mid);
  border:1px solid var(--momo-sand);
  box-shadow:none;
}

/* ─── KI-FAB (AI Button Floating Action) ─── */
.ki-fab{
  background:var(--momo-charcoal);
  color:var(--momo-cream);
  box-shadow:0 4px 12px rgba(26,22,20,0.25);
}
:root[data-theme="dark"] .ki-fab{
  background:var(--momo-cream);
  color:var(--momo-charcoal);
}

/* ─── STREAK SECTION — Clean & consistent ─── */
.streak-hero-card{
  background:transparent;
  color:var(--momo-charcoal);
  border:1px solid var(--momo-sand);
  box-shadow:none;
  padding:28px 24px 26px;
}
:root[data-theme="dark"] .streak-hero-card{color:var(--momo-cream)}
.streak-hero-number{
  font-family:var(--font-display);
  font-weight:300;
  font-variation-settings:"SOFT" 50,"opsz" 144;
  color:var(--momo-charcoal);
  background:none;
  -webkit-text-fill-color:var(--momo-charcoal);
  letter-spacing:-0.05em;
}
:root[data-theme="dark"] .streak-hero-number{
  color:var(--momo-cream);
  -webkit-text-fill-color:var(--momo-cream);
}
.streak-hero-label{
  color:var(--momo-peach);
  font-family:'Geist Mono',ui-monospace,monospace;
  font-weight:600;
  letter-spacing:1.8px;
}
.streak-hero-sub{
  color:var(--momo-ink-mid);
  font-family:var(--font-display);
  font-style:italic;
  font-variation-settings:"SOFT" 100;
}
.streak-hero-flame-wrap,
.streak-hero-flame-inner,
.streak-hero-flame-glow{display:none}

.streak-hero-status-pill{
  background:transparent;
  color:var(--momo-peach);
  border:1px solid rgba(244,180,166,0.4);
}
.streak-hero-status-pill.danger{
  color:var(--danger);
  border-color:rgba(184,53,46,0.4);
}

/* Streak-Share-Btn → Charcoal (flat) */
.streak-share-btn{
  background:var(--momo-charcoal);
  color:var(--momo-cream);
  box-shadow:none;
}
:root[data-theme="dark"] .streak-share-btn{
  background:var(--momo-cream);
  color:var(--momo-charcoal);
}

/* Share-Card (html2canvas poster) → behält dark Charcoal — poster-style */
.share-card-bg{
  background:var(--momo-charcoal);
}
.share-card{
  color:var(--momo-cream);
}
.share-card-number{
  font-family:var(--font-display);
  font-weight:300;
  background:none;
  -webkit-text-fill-color:var(--momo-cream);
  color:var(--momo-cream);
}

/* Milestones Week Stats Card (Deine Woche) — flat */
.ms-week-card-inner{
  background:transparent;
  padding:22px 20px;
}
.ms-week-val{
  font-family:var(--font-display);
  font-weight:300;
  font-variation-settings:"SOFT" 50;
  color:var(--momo-charcoal);
}
:root[data-theme="dark"] .ms-week-val{color:var(--momo-cream)}
.ms-week-label{color:var(--momo-ink-mid)}

/* "Fokus starten" Card */
.ms-dash-cta{
  padding:16px 18px;
  background:transparent;
  gap:14px;
  display:flex;
  align-items:center;
}
.ms-dash-cta svg{color:var(--momo-peach)}

/* Body-Current (Gewichts-Hero) */
.sp-body-current{
  background:transparent;
  padding:20px;
}
.sp-body-weight{
  font-family:var(--font-display);
  font-weight:300;
  font-variation-settings:"SOFT" 50,"opsz" 144;
  color:var(--momo-charcoal);
}
:root[data-theme="dark"] .sp-body-weight{color:var(--momo-cream)}
.sp-body-label{color:var(--momo-ink-mid)}
.sp-body-trend{
  font-family:var(--font-display);
  font-style:italic;
  font-variation-settings:"SOFT" 100;
  color:var(--momo-ink-mid);
}

/* Sum-Box (Workout-Achievement) */
.sp-sum-box{
  background:transparent;
  text-align:center;
}
.sp-sum-icon{color:var(--momo-peach)}

/* Tracker-Sport-Card */
.trk-sport{
  background:transparent;
  padding:14px 18px;
  display:flex;
  align-items:center;
  gap:12px;
}
.trk-sport svg{color:var(--momo-peach)}

/* Onboarding Live-Preview */
.ob-live-preview{
  background:transparent;
  padding:14px 18px;
}
.ob-live-preview-val{
  font-family:var(--font-display);
  font-weight:300;
  background:none;
  -webkit-text-fill-color:var(--momo-charcoal);
  color:var(--momo-charcoal);
}
:root[data-theme="dark"] .ob-live-preview-val{
  color:var(--momo-cream);
  -webkit-text-fill-color:var(--momo-cream);
}

/* Paywall PW-Hero (small promo banner) */
.pw-hero{
  background:transparent;
  color:var(--momo-charcoal);
  padding:18px 20px;
  border:1px solid var(--momo-sand);
  border-radius:14px;
}
:root[data-theme="dark"] .pw-hero{color:var(--momo-cream)}
.pw-hero-title{
  background:none;
  -webkit-text-fill-color:var(--momo-charcoal);
  color:var(--momo-charcoal);
  font-family:var(--font-display);
  font-weight:400;
}
:root[data-theme="dark"] .pw-hero-title{
  color:var(--momo-cream);
  -webkit-text-fill-color:var(--momo-cream);
}

/* Workout-Header */
.sp-workout-hdr{
  background:transparent;
  padding:18px;
  color:var(--momo-charcoal);
}
:root[data-theme="dark"] .sp-workout-hdr{color:var(--momo-cream)}

/* Daily-Quote-Card (mit Peach-Left-Border Akzent) */
.quote-daily-card{
  background:transparent;
  padding:28px 24px 24px;
  border:1px solid var(--momo-sand);
  border-left:3px solid var(--momo-peach);
  border-radius:14px;
  box-shadow:none;
}
.quote-daily-card::before,
.quote-daily-card::after{display:none}
.quote-daily-tag{
  background:transparent;
  border:1px solid var(--momo-peach);
  color:var(--momo-peach);
}
.quote-daily-text{
  font-family:var(--font-display);
  font-style:italic;
  font-variation-settings:"SOFT" 100;
  color:var(--momo-charcoal);
  -webkit-text-fill-color:var(--momo-charcoal);
}
:root[data-theme="dark"] .quote-daily-text{
  color:var(--momo-cream);
  -webkit-text-fill-color:var(--momo-cream);
}
.quote-daily-author{color:var(--momo-ink-soft)}

/* Milestone-Goal-Hero */
.mgoal-hero-card{
  background:transparent;
  color:var(--momo-charcoal);
  border:1px solid var(--momo-sand);
  box-shadow:none;
}
:root[data-theme="dark"] .mgoal-hero-card{color:var(--momo-cream)}
.mgoal-hero-card::before,
.mgoal-hero-card::after{display:none}

/* MST (Milestones-Week) */
.mst-hero,
.mst-heat,
.mst-stats{
  background:transparent;
  color:var(--momo-charcoal);
  border:1px solid var(--momo-sand);
  box-shadow:none;
}
:root[data-theme="dark"] .mst-hero,
:root[data-theme="dark"] .mst-heat{color:var(--momo-cream)}
.mst-hero-num{
  color:var(--momo-charcoal);
  background:none;
  -webkit-text-fill-color:var(--momo-charcoal);
  font-family:var(--font-display);
  font-weight:300;
}
:root[data-theme="dark"] .mst-hero-num{
  color:var(--momo-cream);
  -webkit-text-fill-color:var(--momo-cream);
}

/* Nutri Hero in Produkt-Scan — flat */
.prod-nutri.hero{
  background:transparent;
  color:var(--momo-charcoal);
  border:1px solid var(--momo-sand);
  box-shadow:none;
}
:root[data-theme="dark"] .prod-nutri.hero{color:var(--momo-cream)}

/* ═══════════════════════════════════════════════════════════════════
   WIDGET EXTENSIONS — Nutrition, Training + Safe-Zone Home
   ═══════════════════════════════════════════════════════════════════ */

.training-widget{
  display:flex;
  align-items:center;
}
.training-widget-cta{
  background:var(--momo-peach);
  color:var(--momo-charcoal);
  border:none;
  padding:10px 18px;
  border-radius:99px;
  font-family:'Geist',sans-serif;
  font-size:13px;
  font-weight:500;
  letter-spacing:-0.15px;
  cursor:pointer;
  flex-shrink:0;
  transition:transform 160ms var(--ease-spring-soft),background 200ms ease;
}
.training-widget-cta:hover{
  background:#E89F8F;
}
.training-widget-cta:active{
  transform:scale(0.96);
}

/* Bento small peach dot (optional visual accent) */
.bento{position:relative}
.bento[data-tier="primary"]::after{
  content:"";
  position:absolute;
  top:14px;
  right:14px;
  width:6px;
  height:6px;
  border-radius:99px;
  background:var(--momo-peach);
}

/* ═══════════════════════════════════════════════════════════════════
   STREAK-DETAIL SEITE — Momo-Refresh
   ═══════════════════════════════════════════════════════════════════ */

#streak-body{
  padding:24px 20px 40px!important;
  background:var(--momo-cream);
}
:root[data-theme="dark"] #streak-body{background:var(--momo-charcoal)}

/* Großes Streak-Hero im mstreak sheet — scoped auf .streak-hero-card! */
#streak-body .streak-hero-card{
  background:transparent;
  border:none;
  box-shadow:none;
  padding:28px 4px 26px;
  text-align:center;
  border-bottom:1px solid var(--momo-sand);
  margin-bottom:22px;
}

#streak-body .streak-hero-number{
  font-family:var(--font-display);
  font-weight:300;
  font-size:clamp(76px,22vw,108px);
  letter-spacing:-0.05em;
  font-variation-settings:"SOFT" 50,"opsz" 144;
  color:var(--momo-charcoal);
  background:none;
  -webkit-text-fill-color:var(--momo-charcoal);
  line-height:0.95;
  display:block;
  margin-bottom:14px;
}
:root[data-theme="dark"] #streak-body .streak-hero-number{
  color:var(--momo-cream);
  -webkit-text-fill-color:var(--momo-cream);
}

#streak-body .streak-hero-label{
  color:var(--momo-ink-soft);
  font-family:'Geist Mono',ui-monospace,monospace;
  font-size:11px;
  letter-spacing:2px;
  text-transform:uppercase;
  font-weight:600;
  display:inline-flex;
  align-items:center;
  gap:12px;
}
#streak-body .streak-hero-label::before,
#streak-body .streak-hero-label::after{
  content:"";
  width:20px;
  height:1px;
  background:var(--momo-sand);
}

/* Streak Stats-Split (Longest + Total) clean */
.streak-stats-split{
  background:transparent;
  border:1px solid var(--momo-sand);
  border-radius:14px;
  padding:18px 20px;
  display:grid;
  grid-template-columns:1fr 1px 1fr;
  gap:16px;
  box-shadow:none;
}
.streak-stats-split > div:nth-child(2){
  background:var(--momo-sand);
  width:1px;
}
.streak-stats-val{
  font-family:var(--font-display);
  font-weight:300;
  font-size:28px;
  color:var(--momo-charcoal);
  letter-spacing:-0.04em;
  font-variation-settings:"SOFT" 50;
  line-height:1;
}
:root[data-theme="dark"] .streak-stats-val{color:var(--momo-cream)}
.streak-stats-label{
  font-family:'Geist Mono',ui-monospace,monospace;
  font-size:10px;
  letter-spacing:1.6px;
  text-transform:uppercase;
  color:var(--momo-ink-soft);
  margin-top:6px;
}

/* Streak-Heatmap */
.streak-heatmap{
  background:transparent;
  border:1px solid var(--momo-sand);
  border-radius:14px;
  padding:20px;
  box-shadow:none;
}
.streak-heat-grid{gap:4px}
.streak-heat-cell{
  border-radius:4px;
  background:var(--momo-sand);
  opacity:0.4;
}
.streak-heat-cell.active{
  background:var(--momo-peach);
  opacity:1;
}
.streak-heat-cell.future{opacity:0.15}

/* Streak-Rules (Explanatory Text) */
.streak-rules,
.streak-rules-v2{
  background:transparent;
  border:1px solid var(--momo-sand);
  border-radius:14px;
  padding:20px;
  box-shadow:none;
}
.streak-rule-item{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:10px 0;
  border-bottom:1px solid var(--momo-sand);
}
.streak-rule-item:last-child{border-bottom:none}
.streak-rule-icon{
  color:var(--momo-peach);
  flex-shrink:0;
  margin-top:2px;
}

/* Streak-Next-Milestone Chips */
.streak-ms-track{
  display:flex;
  gap:8px;
  overflow-x:auto;
  padding:2px 0 6px;
  scrollbar-width:none;
}
.streak-ms-track::-webkit-scrollbar{display:none}
.streak-ms-chip{
  flex-shrink:0;
  padding:12px 16px;
  background:transparent;
  border:1px solid var(--momo-sand);
  border-radius:14px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
  min-width:80px;
}
.streak-ms-chip.reached{
  background:transparent;
  border-color:var(--momo-peach);
}
.streak-ms-chip.reached .streak-ms-num{color:var(--momo-peach)}
.streak-ms-chip.next{
  background:var(--momo-charcoal);
  border-color:var(--momo-charcoal);
  color:var(--momo-cream);
}
.streak-ms-chip.next .streak-ms-num{color:var(--momo-cream)}
:root[data-theme="dark"] .streak-ms-chip.next{
  background:var(--momo-cream);
  color:var(--momo-charcoal);
}
:root[data-theme="dark"] .streak-ms-chip.next .streak-ms-num{color:var(--momo-charcoal)}
.streak-ms-num{
  font-family:var(--font-display);
  font-weight:300;
  font-size:22px;
  letter-spacing:-0.04em;
  line-height:1;
  font-variation-settings:"SOFT" 50;
}
.streak-ms-label{
  font-family:'Geist Mono',ui-monospace,monospace;
  font-size:9px;
  letter-spacing:1.2px;
  text-transform:uppercase;
  color:var(--momo-ink-soft);
  font-weight:600;
}

/* Streak-Share-Button prominent */
#streak-body .streak-share-btn,
#streak-body .streak-hero-share{
  background:var(--momo-charcoal);
  color:var(--momo-cream);
  width:100%;
  padding:16px;
  border-radius:14px;
  border:none;
  font-family:'Geist',sans-serif;
  font-weight:500;
  font-size:14px;
  letter-spacing:-0.15px;
  cursor:pointer;
  margin-top:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  transition:transform 160ms var(--ease-out);
  box-shadow:none;
}
#streak-body .streak-share-btn:active{transform:scale(0.98)}
:root[data-theme="dark"] #streak-body .streak-share-btn{
  background:var(--momo-cream);
  color:var(--momo-charcoal);
}

/* ═══════════════════════════════════════════════════════════════════
   PAYWALL — Komplett-Fix im Momo-Design
   ═══════════════════════════════════════════════════════════════════ */

#paywall-body{
  background:var(--momo-cream);
  padding:0;
}
:root[data-theme="dark"] #paywall-body{background:var(--momo-charcoal)}

.pw-v4{
  background:transparent;
  padding-bottom:120px;
}

.pw-v4-hero{
  background:transparent;
  padding:36px 24px 28px;
  text-align:center;
}

.pw-v4-wordmark{
  font-family:'Geist Mono',ui-monospace,monospace;
  font-size:10.5px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--momo-peach);
  font-weight:600;
  margin-bottom:16px;
}

.pw-v4-headline{
  font-family:var(--font-display);
  font-weight:300;
  font-variation-settings:"SOFT" 50,"opsz" 144;
  font-size:clamp(34px,8vw,48px);
  letter-spacing:-0.04em;
  line-height:1.05;
  color:var(--momo-charcoal);
  background:none;
  -webkit-text-fill-color:var(--momo-charcoal);
  margin-bottom:16px;
}
:root[data-theme="dark"] .pw-v4-headline{
  color:var(--momo-cream);
  -webkit-text-fill-color:var(--momo-cream);
}

.pw-v4-deck{
  font-family:var(--font-display);
  font-style:italic;
  font-variation-settings:"SOFT" 100;
  color:var(--momo-ink-mid);
  font-size:15px;
  line-height:1.55;
  max-width:320px;
  margin:0 auto;
  font-weight:400;
}

.pw-v4-section{
  padding:0 20px 28px;
}
.pw-v4-section:first-of-type{padding-top:0}

.pw-v4-eyebrow{
  font-family:'Geist Mono',ui-monospace,monospace;
  font-size:10px;
  letter-spacing:1.8px;
  text-transform:uppercase;
  color:var(--momo-ink-soft);
  font-weight:600;
  margin-bottom:14px;
}

.pw-v4-plans{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.pw-v4-plan{
  background:transparent;
  border:1px solid var(--momo-sand);
  border-radius:14px;
  padding:16px 18px;
  cursor:pointer;
  position:relative;
  display:flex;
  align-items:flex-start;
  gap:14px;
  font-family:inherit;
  text-align:left;
  width:100%;
  box-shadow:none;
  transition:border-color 200ms var(--ease-out),background 200ms var(--ease-out);
}

.pw-v4-plan.recommended{
  border-color:var(--momo-peach);
  background:transparent;
}
.pw-v4-plan.recommended::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:2px;
  background:var(--momo-peach);
  border-radius:14px 14px 0 0;
}

.pw-v4-plan.selected{
  border-color:var(--momo-charcoal);
  box-shadow:0 0 0 1px var(--momo-charcoal);
}
:root[data-theme="dark"] .pw-v4-plan.selected{
  border-color:var(--momo-cream);
  box-shadow:0 0 0 1px var(--momo-cream);
}

.pw-v4-plan-radio{
  width:18px;
  height:18px;
  border-radius:99px;
  border:1.5px solid var(--momo-sand);
  flex-shrink:0;
  margin-top:2px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:transparent;
}
.pw-v4-plan.selected .pw-v4-plan-radio{border-color:var(--momo-charcoal)}
:root[data-theme="dark"] .pw-v4-plan.selected .pw-v4-plan-radio{border-color:var(--momo-cream)}
.pw-v4-plan-radio-dot{
  width:10px;
  height:10px;
  border-radius:99px;
  background:var(--momo-charcoal);
  transform:scale(0);
  transition:transform 200ms var(--ease-spring-soft);
}
:root[data-theme="dark"] .pw-v4-plan-radio-dot{background:var(--momo-cream)}
.pw-v4-plan.selected .pw-v4-plan-radio-dot{transform:scale(1)}

.pw-v4-plan-body{
  flex:1;
  min-width:0;
}
.pw-v4-plan-top{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:12px;
  margin-bottom:4px;
}
.pw-v4-plan-name{
  font-size:15px;
  font-weight:500;
  color:var(--momo-charcoal);
  letter-spacing:-0.2px;
}
:root[data-theme="dark"] .pw-v4-plan-name{color:var(--momo-cream)}
.pw-v4-plan-price{
  font-family:var(--font-display);
  font-size:18px;
  font-weight:400;
  color:var(--momo-charcoal);
  letter-spacing:-0.04em;
  font-variant-numeric:tabular-nums;
  font-variation-settings:"SOFT" 50;
}
:root[data-theme="dark"] .pw-v4-plan-price{color:var(--momo-cream)}
.pw-v4-plan-bottom{
  display:flex;
  justify-content:space-between;
  gap:12px;
  font-size:12.5px;
  color:var(--momo-ink-soft);
}
.pw-v4-plan-per{color:var(--momo-ink-soft)}
.pw-v4-plan-note{color:var(--momo-ink-soft);text-align:right}
.pw-v4-plan.recommended .pw-v4-plan-note{color:var(--momo-peach);font-weight:500}

.pw-v4-trial-line{
  font-size:12px;
  color:var(--momo-ink-soft);
  text-align:center;
  margin-top:14px;
  letter-spacing:-0.05px;
  line-height:1.5;
  background:transparent;
  padding:0;
  border:none;
  box-shadow:none;
}

/* Paywall Features Liste */
.pw-v4-features{
  display:flex;
  flex-direction:column;
  gap:0;
  background:transparent;
  border:1px solid var(--momo-sand);
  border-radius:14px;
  overflow:hidden;
}
.pw-v4-feat{
  padding:14px 18px;
  border-bottom:1px solid var(--momo-sand);
  background:transparent;
}
.pw-v4-feat:last-child{border-bottom:none}
.pw-v4-feat-title{
  font-family:'Geist',sans-serif;
  font-weight:500;
  color:var(--momo-charcoal);
  font-size:14px;
  margin-bottom:4px;
  letter-spacing:-0.1px;
}
:root[data-theme="dark"] .pw-v4-feat-title{color:var(--momo-cream)}
.pw-v4-feat-desc{
  color:var(--momo-ink-mid);
  font-size:13px;
  line-height:1.45;
  letter-spacing:-0.05px;
}

/* FAQ */
.pw-v4-faq{
  background:transparent;
  border:1px solid var(--momo-sand);
  border-radius:14px;
  overflow:hidden;
}
.pw-v4-faq-item{
  border-bottom:1px solid var(--momo-sand);
  padding:0;
}
.pw-v4-faq-item:last-child{border-bottom:none}
.pw-v4-faq-q{
  padding:14px 18px;
  font-family:'Geist',sans-serif;
  font-weight:500;
  color:var(--momo-charcoal);
  font-size:14px;
  cursor:pointer;
  display:flex;
  justify-content:space-between;
  align-items:center;
  background:transparent;
  border:none;
  width:100%;
  text-align:left;
}
:root[data-theme="dark"] .pw-v4-faq-q{color:var(--momo-cream)}
.pw-v4-faq-a{
  padding:0 18px 14px;
  color:var(--momo-ink-mid);
  font-size:13px;
  line-height:1.55;
}

/* Paywall Footer */
.pw-v4-foot{
  padding:24px 20px 20px;
  text-align:center;
}
.pw-v4-foot-line{
  font-size:11.5px;
  color:var(--momo-ink-soft);
  letter-spacing:-0.05px;
  line-height:1.5;
  margin-bottom:4px;
}
.pw-v4-foot-line.faint{color:var(--momo-ink-soft);opacity:0.7}
.pw-v4-foot-redeem{
  margin-top:12px;
  font-size:12px;
  color:var(--momo-ink-soft);
}
.pw-v4-foot-redeem a{
  color:var(--momo-charcoal);
  text-decoration:underline;
  text-underline-offset:3px;
  text-decoration-color:var(--momo-sand);
  font-weight:500;
}
:root[data-theme="dark"] .pw-v4-foot-redeem a{color:var(--momo-cream)}

/* Paywall CTA */
.pw-cta-wrap{
  position:sticky;
  bottom:0;
  background:linear-gradient(to top,var(--momo-cream) 85%,rgba(247,242,234,0));
  padding:14px 20px calc(env(safe-area-inset-bottom) + 14px);
  z-index:10;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
:root[data-theme="dark"] .pw-cta-wrap{
  background:linear-gradient(to top,var(--momo-charcoal) 85%,rgba(20,16,14,0));
}

.pw-cta{
  width:100%;
  background:var(--momo-charcoal);
  color:var(--momo-cream);
  border:none;
  padding:16px;
  border-radius:14px;
  font-family:'Geist',sans-serif;
  font-weight:500;
  font-size:14px;
  letter-spacing:-0.15px;
  cursor:pointer;
  transition:transform 160ms var(--ease-out),background 200ms ease;
  box-shadow:none;
}
.pw-cta:hover{background:var(--momo-plum)}
.pw-cta:active{transform:scale(0.98)}
:root[data-theme="dark"] .pw-cta{
  background:var(--momo-cream);
  color:var(--momo-charcoal);
}

/* Paywall Trial Banner */
.pw-trial-banner{
  margin:0 20px 20px;
  padding:14px 16px;
  background:transparent;
  border:1px solid var(--momo-peach);
  border-radius:14px;
  display:flex;
  align-items:center;
  gap:10px;
  font-size:13px;
  color:var(--momo-charcoal);
  box-shadow:none;
}
:root[data-theme="dark"] .pw-trial-banner{color:var(--momo-cream)}
.pw-trial-banner svg{color:var(--momo-peach);flex-shrink:0}
.pw-trial-banner strong{color:var(--momo-peach);font-weight:600}
.pw-trial-banner-countdown{
  margin-left:auto;
  font-family:'Geist Mono',ui-monospace,monospace;
  font-size:11px;
  color:var(--momo-peach);
  font-weight:600;
  letter-spacing:0.5px;
  padding:4px 8px;
  background:transparent;
  border:1px solid var(--momo-peach);
  border-radius:6px;
}

/* Paywall Pro-Bestätigung */
.pw-current{
  background:transparent;
  border:1px solid var(--momo-sand);
  border-radius:14px;
  padding:24px 20px;
  text-align:center;
  box-shadow:none;
}
.pw-current-icon{
  width:48px;
  height:48px;
  border-radius:99px;
  background:var(--momo-peach);
  color:var(--momo-charcoal);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:14px;
}
.pw-current-title{
  font-family:var(--font-display);
  font-weight:400;
  font-size:22px;
  color:var(--momo-charcoal);
  letter-spacing:-0.3px;
  margin-bottom:6px;
}
:root[data-theme="dark"] .pw-current-title{color:var(--momo-cream)}
.pw-current-sub{
  color:var(--momo-ink-mid);
  font-size:13px;
  line-height:1.5;
}

/* Feature-Gate-Sheet (mfg) — same treatment */
.mfg-v2{
  background:transparent;
  padding:32px 24px calc(env(safe-area-inset-bottom) + 20px);
  color:var(--momo-charcoal);
}
:root[data-theme="dark"] .mfg-v2{color:var(--momo-cream)}
.mfg-v2-icon{
  width:52px;
  height:52px;
  border-radius:99px;
  background:transparent;
  border:1px solid var(--momo-peach);
  color:var(--momo-peach);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:18px;
  box-shadow:none;
}
.mfg-v2-title{
  font-family:var(--font-display);
  font-weight:400;
  font-variation-settings:"SOFT" 50;
  font-size:26px;
  color:var(--momo-charcoal);
  letter-spacing:-0.04em;
  margin-bottom:10px;
  line-height:1.15;
}
:root[data-theme="dark"] .mfg-v2-title{color:var(--momo-cream)}
.mfg-v2-deck{
  color:var(--momo-ink-mid);
  font-size:14px;
  line-height:1.55;
  margin-bottom:24px;
  font-family:var(--font-display);
  font-style:italic;
  font-variation-settings:"SOFT" 100;
}
.mfg-v2-plan{
  background:transparent;
  border:1px solid var(--momo-sand);
  border-radius:14px;
  padding:14px 16px;
  box-shadow:none;
}
.mfg-v2-plan.selected{
  border-color:var(--momo-charcoal);
}
:root[data-theme="dark"] .mfg-v2-plan.selected{border-color:var(--momo-cream)}
.mfg-v2-cta{
  background:var(--momo-charcoal);
  color:var(--momo-cream);
  border:none;
  padding:14px;
  border-radius:14px;
  font-family:'Geist',sans-serif;
  font-weight:500;
  box-shadow:none;
}
:root[data-theme="dark"] .mfg-v2-cta{
  background:var(--momo-cream);
  color:var(--momo-charcoal);
}
.mfg-v2-more{
  background:transparent;
  border:none;
  color:var(--momo-ink-mid);
  font-size:12.5px;
  text-decoration:underline;
  text-underline-offset:3px;
  text-decoration-color:var(--momo-sand);
  padding:8px;
  cursor:pointer;
  font-family:inherit;
}
.mfg-v2-more:hover{color:var(--momo-charcoal);text-decoration-color:var(--momo-charcoal)}
:root[data-theme="dark"] .mfg-v2-more:hover{color:var(--momo-cream);text-decoration-color:var(--momo-cream)}

/* Feature-Gate form-sheet-header: force Momo background */
#mfg .form-sheet-header{
  background:rgba(247,242,234,0.92)!important;
  border-bottom-color:var(--momo-sand)!important;
}
:root[data-theme="dark"] #mfg .form-sheet-header{
  background:rgba(20,16,14,0.92)!important;
}

/* ═══════════════════════════════════════════════════════════════════
   WHITE-TEXT-ON-WHITE RESCUE
   Alle Hero-Cards hatten früher dunklen Gradient + color:#fff. Gradient
   wurde für Momo-Aesthetic entfernt → weißer Text auf cream → unlesbar.
   Hier: alle betroffenen Klassen auf Momo-Charcoal zurücksetzen.
   ═══════════════════════════════════════════════════════════════════ */
.streak-hero-card,.streak-hero-card *,
.share-card,.share-card *,
.prod-nutri.hero,.prod-nutri.hero .prod-nutri-val,
.shop-hero,.shop-hero *,
.task-hero,.task-hero *,
.ms-dash-cta,.ms-dash-cta *,
.ms-week-card-inner,.ms-week-card-inner *,.ms-week-mini-num,
.mgoal-hero-card,.mgoal-hero-card *,.mgoal-progress-pct,
.quote-daily-card,.quote-daily-card *,.quote-daily-card .quote-text,
.bento-accent,.bento-accent .bento-label,.bento-accent .bento-value,
.bento-accent .bento-value small,.bento-accent .bento-sub,
.streak-share-btn,.streak-share-btn *,
.sp-hero,.sp-hero *,
.sp-workout-hdr,.sp-workout-hdr *,
.sp-body-current,.sp-body-current *,
.sp-sum-box,.sp-sum-box *,
.mmd-summary,.mmd-summary *,
.trk-sport,.trk-sport *,
.ob-live-preview,.ob-live-preview *,
.ob-result,.ob-result *,
.mst-hero,.mst-hero *{
  color:var(--momo-charcoal)!important;
  text-shadow:none!important;
}
/* Ki-FAB: rund + peach → charcoal icon */
.ki-fab{background:var(--momo-peach)!important;color:var(--momo-charcoal)!important;box-shadow:0 2px 4px rgba(26,22,20,0.08),0 12px 24px -8px rgba(26,22,20,0.25)!important}
:root[data-theme="dark"] .ki-fab{background:var(--momo-peach)!important;color:var(--momo-charcoal)!important}
:root[data-theme="dark"] .streak-hero-card,:root[data-theme="dark"] .streak-hero-card *,
:root[data-theme="dark"] .prod-nutri.hero,:root[data-theme="dark"] .prod-nutri.hero .prod-nutri-val,
:root[data-theme="dark"] .shop-hero,:root[data-theme="dark"] .shop-hero *,
:root[data-theme="dark"] .task-hero,:root[data-theme="dark"] .task-hero *,
:root[data-theme="dark"] .ms-dash-cta,:root[data-theme="dark"] .ms-dash-cta *,
:root[data-theme="dark"] .ms-week-card-inner,:root[data-theme="dark"] .ms-week-card-inner *,
:root[data-theme="dark"] .ms-week-mini-num,
:root[data-theme="dark"] .mgoal-hero-card,:root[data-theme="dark"] .mgoal-hero-card *,
:root[data-theme="dark"] .mgoal-progress-pct,
:root[data-theme="dark"] .quote-daily-card,:root[data-theme="dark"] .quote-daily-card *,
:root[data-theme="dark"] .bento-accent,:root[data-theme="dark"] .bento-accent *,
:root[data-theme="dark"] .streak-share-btn,:root[data-theme="dark"] .streak-share-btn *,
:root[data-theme="dark"] .sp-hero,:root[data-theme="dark"] .sp-hero *,
:root[data-theme="dark"] .sp-workout-hdr,:root[data-theme="dark"] .sp-workout-hdr *,
:root[data-theme="dark"] .sp-body-current,:root[data-theme="dark"] .sp-body-current *,
:root[data-theme="dark"] .sp-sum-box,:root[data-theme="dark"] .sp-sum-box *,
:root[data-theme="dark"] .mmd-summary,:root[data-theme="dark"] .mmd-summary *,
:root[data-theme="dark"] .trk-sport,:root[data-theme="dark"] .trk-sport *,
:root[data-theme="dark"] .ob-live-preview,:root[data-theme="dark"] .ob-live-preview *,
:root[data-theme="dark"] .ob-result,:root[data-theme="dark"] .ob-result *,
:root[data-theme="dark"] .mst-hero,:root[data-theme="dark"] .mst-hero *{
  color:var(--momo-cream)!important;
}
/* share-card bleibt dunkel (ist der Share-PNG Hintergrund) */
.share-card{background:var(--momo-charcoal)!important;color:var(--momo-cream)!important}
.share-card *{color:var(--momo-cream)!important}
.share-card strong{color:var(--momo-cream)!important}

/* Button-Text auf dunklem Primary-Button bleibt cream (lesbar auf charcoal) */
/* .nav-btn.active WEGgelassen — hat transparenten Hintergrund in Momo, nutzt charcoal color selbst */
.btn,.sort-btn.active,.filter-btn.active,
.form-sheet-save,.shop-add-btn,.task-add-fab,.chat-send,.chat-add-btn,
.msg-user,.focus-btn-primary,.ms-next-done-btn,.streak-intro-cta,
.period-opt.sel,.cal-day.cal-sel,.header-icon-btn:hover,.share-btn-primary{
  color:var(--momo-cream)!important;
}
.sub-nav-btn.active{color:var(--momo-cream)!important}
/* :root[data-theme="dark"] .sub-nav-btn.active jetzt cream-text auf sand-surface (unten definiert) */
:root[data-theme="dark"] .btn,
:root[data-theme="dark"] .form-sheet-save,
:root[data-theme="dark"] .shop-add-btn,
:root[data-theme="dark"] .task-add-fab{
  color:var(--momo-charcoal)!important;
}
/* Active Selection-Chips: cream text auf sand-surface */
:root[data-theme="dark"] .sub-nav-btn.active,
:root[data-theme="dark"] .sort-btn.active,
:root[data-theme="dark"] .filter-btn.active,
:root[data-theme="dark"] .period-opt.sel,
:root[data-theme="dark"] .cal-day.cal-sel,
:root[data-theme="dark"] .sp-body-subtab.active,
:root[data-theme="dark"] .ob-quick-chip.sel,
:root[data-theme="dark"] .fe-tab.active,
:root[data-theme="dark"] .fa-meal-btn.sel{
  color:var(--momo-cream)!important;
}
/* Nav-btn Active-State explizit (gegen Rescue-Regression absichern) */
.nav-btn.active{color:var(--momo-charcoal)!important}
:root[data-theme="dark"] .nav-btn.active{color:var(--momo-cream)!important}
.nav-btn{color:var(--momo-ink-soft)!important}
:root[data-theme="dark"] .nav-btn{color:var(--momo-ink-mid)!important}

/* ═══════════════════════════════════════════════════════════════════
   PAYWALL POLISH — editoriale Verfeinerung, kein Struktur-Change
   ═══════════════════════════════════════════════════════════════════ */

/* Hero: feiner Serif-Touch + ornamentale Peach-Linie unterhalb des Wordmarks */
.pw-v4-hero{padding:32px 24px 20px !important}
.pw-v4-wordmark{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:var(--momo-peach) !important;
}
.pw-v4-wordmark::after{
  content:"";
  display:block;
  width:24px;
  height:1px;
  background:var(--momo-peach);
  opacity:0.55;
}
.pw-v4-headline{
  margin:0 auto 12px !important;
  max-width:14ch;
}
.pw-v4-deck{
  max-width:34ch !important;
}

/* Sections: kompakter */
.pw-v4-section{padding:0 20px 20px !important}
.pw-v4-eyebrow{margin-bottom:12px !important}

/* Plans: feinere Typo-Hierarchie */
.pw-v4-plans{gap:6px !important}
.pw-v4-plan{
  padding:14px 16px !important;
  background:transparent;
}
.pw-v4-plan-name{font-size:14.5px !important;letter-spacing:-0.15px !important}
.pw-v4-plan-price{
  font-family:var(--font-display) !important;
  font-weight:400 !important;
  font-size:19px !important;
  letter-spacing:-0.04em !important;
}
.pw-v4-plan-bottom{font-size:12px !important}
.pw-v4-plan-per,.pw-v4-plan-note{color:var(--momo-ink-soft) !important}

/* Recommended-Plan: Peach-Tint + Badge */
.pw-v4-plan.recommended{
  background:rgba(244,180,166,0.08) !important;
  border-color:var(--momo-peach) !important;
  padding-top:22px !important;
}
:root[data-theme="dark"] .pw-v4-plan.recommended{
  background:rgba(244,180,166,0.08) !important;
}
.pw-v4-plan.recommended::before{
  content:"Beliebt" !important;
  position:absolute !important;
  top:-1px !important;
  right:14px !important;
  left:auto !important;
  background:var(--momo-peach) !important;
  color:var(--momo-charcoal) !important;
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:9px !important;
  font-weight:600 !important;
  letter-spacing:1.4px !important;
  text-transform:uppercase !important;
  padding:3px 9px 4px !important;
  border-radius:0 0 6px 6px !important;
  height:auto !important;
  line-height:1 !important;
}
.pw-v4-plan.recommended .pw-v4-plan-price{
  font-size:22px !important;
  color:var(--momo-charcoal) !important;
}
:root[data-theme="dark"] .pw-v4-plan.recommended .pw-v4-plan-price{
  color:var(--momo-cream) !important;
}
.pw-v4-plan.recommended .pw-v4-plan-note{
  color:var(--momo-peach) !important;
  font-weight:500 !important;
}
.pw-v4-plan.recommended.selected{
  box-shadow:0 0 0 1.5px var(--momo-peach) !important;
  border-color:var(--momo-peach) !important;
}
.pw-v4-plan.recommended.selected .pw-v4-plan-radio{
  border-color:var(--momo-peach) !important;
}
.pw-v4-plan.recommended.selected .pw-v4-plan-radio-dot{
  background:var(--momo-peach) !important;
}

/* Trial-Line: feiner */
.pw-v4-trial-line{
  margin-top:12px !important;
  font-size:11.5px !important;
  color:var(--momo-ink-soft) !important;
  letter-spacing:0.1px !important;
}

/* Features: minimaler, List-Stil ohne Border-Card */
.pw-v4-features{
  border:none !important;
  background:transparent !important;
}
.pw-v4-feat{
  padding:12px 0 !important;
  border-bottom:1px solid var(--momo-sand) !important;
  background:transparent !important;
}
.pw-v4-feat:last-child{border-bottom:none !important}
.pw-v4-feat-title{
  font-size:14px !important;
  margin-bottom:3px !important;
}
.pw-v4-feat-desc{
  font-size:12.5px !important;
  line-height:1.5 !important;
}

/* FAQ: konsistent ohne schwere Card */
.pw-v4-faq{
  border:none !important;
  background:transparent !important;
}
.pw-v4-faq-item{
  border-bottom:1px solid var(--momo-sand) !important;
}
.pw-v4-faq-item:last-child{border-bottom:none !important}
.pw-v4-faq-q{
  padding:13px 0 !important;
  font-size:13.5px !important;
  gap:16px !important;
}
.pw-v4-faq-a{
  padding:0 0 14px !important;
  font-size:12.5px !important;
  line-height:1.55 !important;
  color:var(--momo-ink-mid) !important;
}

/* CTA: sanft schwebend, Fraunces-Touch fürs Preis-Anchor */
.pw-cta-wrap{
  padding:16px 20px calc(env(safe-area-inset-bottom) + 14px) !important;
}
.pw-cta{
  padding:15px 20px !important;
  font-size:14px !important;
  letter-spacing:-0.15px !important;
  border-radius:14px !important;
  font-family:'Geist',sans-serif !important;
  font-weight:500 !important;
}
.pw-cta:hover{background:#0F0B08 !important}
:root[data-theme="dark"] .pw-cta:hover{background:#E8E1D3 !important}

/* Footer: zentriert, dezent */
.pw-v4-foot{padding:8px 20px 20px !important}
.pw-v4-foot-line{font-size:11px !important;margin-bottom:4px !important}
.pw-v4-foot-redeem{margin-top:8px !important;font-size:11.5px !important}

/* Current-Plan State (schon Pro) */
.pw-current{
  text-align:center;
  padding:28px 20px 16px;
  border:1px solid var(--momo-sand);
  border-radius:16px;
  background:transparent;
}
.pw-current-icon{
  width:44px;height:44px;
  border-radius:99px;
  background:var(--momo-peach);
  color:var(--momo-charcoal);
  display:inline-flex;align-items:center;justify-content:center;
  margin-bottom:14px;
}
.pw-current-title{
  font-family:var(--font-display);
  font-weight:300;
  font-size:26px;
  letter-spacing:-0.04em;
  color:var(--momo-charcoal);
  margin-bottom:8px;
}
:root[data-theme="dark"] .pw-current-title{color:var(--momo-cream)}
.pw-current-sub{
  font-size:13px;
  color:var(--momo-ink-mid);
  line-height:1.5;
}

/* ═══════════════════════════════════════════════════════════════════
   iOS PWA POLISH — Native-App Feel
   ═══════════════════════════════════════════════════════════════════ */

button,a,.bento,.nav-btn,.sub-nav-btn,.streak-badge,.header-brand,.home-widget-edit-link{
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  user-select:none;
}
a,button,[role="button"],.nav-btn,.sub-nav-btn,.bento,.filter-btn,.sort-btn,.wp-btn,.form-sheet-save,.btn,input[type="submit"]{
  touch-action:manipulation;
}
input,textarea,[contenteditable]{
  -webkit-user-select:auto;
  user-select:auto;
  -webkit-touch-callout:default;
}
html{
  overscroll-behavior:none;
  -webkit-tap-highlight-color:transparent;
}

@media (display-mode:standalone){
  /* Header: Safe-Area + minimales 4px Bottom-Padding */
  .header{padding:env(safe-area-inset-top) 16px 4px !important}
  .header-brand{padding-top:2px !important;padding-bottom:2px !important}
  /* Bottom-Nav: Safe-Area + 2px Polster */
  .bottom-nav{padding:6px 12px calc(env(safe-area-inset-bottom) + 2px) !important}
  /* Body-Padding-Bottom: genug Luft damit letzter Content nicht hinter der
     Nav verschwindet. Safe-Area (Home-Indicator) + 78px für Nav-Höhe. */
  body{padding-bottom:calc(env(safe-area-inset-bottom) + 78px) !important}
  /* Form-Sheet-Header: Safe-Area + 4px top, 8px bottom */
  .form-sheet-header{padding:calc(env(safe-area-inset-top) + 4px) 14px 8px !important}
  /* Paywall Sticky-CTA unten: Safe-Area + 4px */
  .pw-cta-wrap{padding:10px 20px calc(env(safe-area-inset-bottom) + 4px) !important}
  /* Paywall Footer selbst: nur 10px Bottom-Padding */
  .pw-v4-foot{padding-bottom:10px !important}
  .ios-install-prompt{display:none !important}
}

/* Paywall Close-Button (.pw-close) — KRITISCH: MUSS unter Notch/Dynamic Island
   verschoben werden sonst ist er auf iPhones mit Notch nicht tappbar!
   Gilt sowohl im Browser (viewport-fit=cover) als auch im Standalone. */
.pw-close{
  top:calc(env(safe-area-inset-top) + 12px) !important;
  right:max(env(safe-area-inset-right),14px) !important;
  width:40px !important;
  height:40px !important;
}

/* Paywall Hero: extra Top-Padding damit der Content nicht unter dem
   Close-Button beginnt (Close-Button ist 40px + Safe-Area + 12px = ~99px auf Notch-iPhone) */
.pw-v4-hero{
  padding-top:calc(env(safe-area-inset-top) + 60px);
}
@media (display-mode:standalone){
  .pw-v4-hero{padding-top:calc(env(safe-area-inset-top) + 60px) !important}
}

.ios-install-prompt{
  position:fixed;
  left:16px;right:16px;bottom:16px;
  background:var(--momo-charcoal);
  color:var(--momo-cream);
  border-radius:18px;
  padding:14px 16px 14px 18px;
  display:none;
  align-items:center;
  gap:12px;
  font-family:'Geist',sans-serif;
  font-size:13px;
  line-height:1.4;
  letter-spacing:-0.1px;
  box-shadow:0 12px 28px -8px rgba(26,22,20,0.35),0 2px 4px rgba(26,22,20,0.08);
  z-index:200;
  animation:installSlide 500ms var(--ease-spring-soft) 800ms both;
  max-width:440px;
  margin:0 auto;
}
.ios-install-prompt.show{display:flex}
.ios-install-prompt-icon{
  width:36px;height:36px;
  border-radius:10px;
  background:var(--momo-peach);
  color:var(--momo-charcoal);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.ios-install-prompt-body{flex:1;min-width:0}
.ios-install-prompt-title{font-weight:500;color:var(--momo-cream);margin-bottom:2px}
.ios-install-prompt-hint{
  font-size:11.5px;
  color:rgba(247,242,234,0.72);
  letter-spacing:0.05px;
}
.ios-install-prompt-hint svg{
  display:inline-block;
  vertical-align:-3px;
  margin:0 3px;
}
.ios-install-prompt-close{
  background:transparent;
  border:none;
  color:rgba(247,242,234,0.6);
  cursor:pointer;
  padding:6px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:8px;
  transition:background 160ms var(--ease-out);
}
.ios-install-prompt-close:active{transform:scale(0.9)}

@keyframes installSlide{
  from{opacity:0;transform:translateY(20px)}
  to{opacity:1;transform:translateY(0)}
}

/* Inline "Teilen" Chip im Install-Prompt-Hint */
.ios-install-prompt-chip{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:2px 7px 2px 6px;
  background:rgba(247,242,234,0.14);
  border:1px solid rgba(247,242,234,0.22);
  border-radius:99px;
  color:var(--momo-cream);
  font-size:10.5px;
  font-weight:500;
  letter-spacing:0.1px;
  vertical-align:1px;
  white-space:nowrap;
}
.ios-install-prompt-chip svg{flex-shrink:0}
.ios-install-prompt-hint strong{color:var(--momo-cream);font-weight:500}

/* ═══════════════════════════════════════════════════════════════════
   iOS AUTO-ZOOM FIX
   Wenn ein Input font-size < 16px hat, zoomt iOS Safari beim Fokus automatisch
   rein UND zoomt nicht mehr raus. Lösung: globales Minimum 16px auf allen
   Input-Elementen erzwingen. Optional visuell mit transform:scale kleiner
   darstellen wenn Design es braucht.
   ═══════════════════════════════════════════════════════════════════ */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
select,
textarea{
  font-size:16px !important;
}
/* Für sehr enge UI-Bereiche wo 16px zu groß wirkt: die Größe bleibt 16px,
   aber nur auf iOS (wo der Zoom-Bug existiert). Android/Desktop kriegen
   ihre originale Größe via max-width Media Query-Override falls nötig. */
.ki-key-banner input{font-size:16px !important}

/* ═══════════════════════════════════════════════════════════════════
   TOUCH-DEVICE HOVER RESET
   Auf Touch-Geräten (iOS Safari, Android) triggert :hover beim Tap und
   bleibt als Ghost-State bis zum nächsten Tap hängen. Emil-Regel:
   Hover-Effekte nur auf echten Mäuse-Devices zeigen.
   ═══════════════════════════════════════════════════════════════════ */
@media (hover: none), (pointer: coarse){
  /* Reset aller Hover-Transform- + Shadow-Effekte auf Touch-Geräten */
  .bento:hover,
  .card:hover,
  .goal-card:hover,
  .task-card:hover,
  .meal-item:hover,
  .recipe-card:hover,
  .recipe-img-wrap:hover,
  .ms-dash-cta:hover,
  .home-mini-item:hover,
  .wp-row:hover,
  .mstr-share:hover,
  .pw-cta:hover,
  .btn:hover,
  .form-sheet-save:hover,
  .shop-add-btn:hover,
  .task-add-fab:hover,
  .header-icon-btn:hover,
  .streak-badge:hover,
  .filter-btn:hover:not(.active),
  .sort-btn:hover:not(.active),
  .sub-nav-btn:hover:not(.active),
  .nav-btn:hover:not(.active),
  .pw-v4-plan:hover,
  .wp-btn:hover,
  .ios-install-prompt-close:hover,
  .streak-share-btn:hover,
  .home-stats-quick-link:hover,
  .home-widget-edit-link:hover{
    transform:none !important;
    background:inherit;
    box-shadow:inherit;
  }
  /* Recipe-Image Zoom auf Touch deaktivieren */
  .recipe-img:hover{transform:none !important}
}

/* ═══════════════════════════════════════════════════════════════════
   REDUCED MOTION — alle dekorativen infinite Loops deaktivieren
   User mit Motion-Sickness sehen nur noch funktionale Animationen
   (Opacity für Comprehension), keine Bewegung.
   ═══════════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce){
  /* Alle dekorativen Loops komplett aus */
  .header-upgrade::before,
  .btn::before,
  .shop-hero::before,
  .task-hero::before,
  .sp-hero::before,
  .bento-accent::before,
  .streak-hero-flame-glow,
  .streak-intro-flame,
  .shop-progress-fill::after,
  .task-progress-fill::after,
  .streak-badge.danger,
  .streak-badge.danger .streak-flame,
  .task-badge-timer.active,
  .ki-fab-pulse,
  .ki-dot,
  .scan-laser-big::before,
  .pw-hero::before,
  .pw-trial-banner,
  .pw-cta::before,
  .mmd-summary::before{
    animation:none !important;
  }
  /* Entrance-Animationen auf minimales Fade runter */
  .bento,
  .card,
  .goal-card,
  .task-card,
  .meal-item{
    animation:none !important;
  }
  /* Transforms für Hover/Active weg, Opacity darf bleiben */
  *:hover,
  *:active{
    transform:none !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════
   DATE-INPUT iOS OVERFLOW FIX
   iOS Safari rendert <input type="date"> mit internem -webkit-min-
   logical-width das width:100% überschreiben kann → Input bricht rechts
   aus dem Container. Fix: native Appearance abschalten + min-width:0 +
   display:block erzwingen.
   ═══════════════════════════════════════════════════════════════════ */
input[type="date"],
input[type="time"],
input[type="datetime-local"],
.date-input{
  -webkit-appearance:none;
  appearance:none;
  min-width:0;
  max-width:100%;
  width:100%;
  display:block;
  box-sizing:border-box;
}
/* iOS zeigt Calendar-Icon via ::-webkit-date-and-time-value
   — Alignment erzwingen damit Text nicht rechts überhängt */
input[type="date"]::-webkit-date-and-time-value,
input[type="time"]::-webkit-date-and-time-value,
input[type="datetime-local"]::-webkit-date-and-time-value{
  text-align:left;
  min-width:0;
}

/* ═══════════════════════════════════════════════════════════════════
   STREAK DETAIL SHEET — Momo Redesign (nur CSS, keine Markup-Änderung)
   Ersetzt die alte dunkle Gradient-Card durch cream/peach/Fraunces-Look
   passend zum aktuellen App-Design.
   ═══════════════════════════════════════════════════════════════════ */

#streak-body{
  background:var(--momo-cream) !important;
  padding:0 !important;
}
:root[data-theme="dark"] #streak-body{
  background:var(--momo-charcoal) !important;
}

/* Body-Wrap: saubere Section-Stacks statt schwebende Cards */
.streak-body-wrap{
  padding:20px 20px 32px !important;
  display:flex !important;
  flex-direction:column !important;
  gap:20px !important;
}

/* ───── HERO ───── */
.streak-hero-card,
.streak-hero-card.compact{
  background:transparent !important;
  border:1px solid var(--momo-sand) !important;
  border-radius:20px !important;
  padding:24px 22px !important;
  box-shadow:none !important;
  overflow:hidden !important;
}
.streak-hero-card::before,
.streak-hero-card::after{display:none !important}

.streak-hero-top{
  margin-bottom:18px !important;
}
.streak-hero-eyebrow{
  color:var(--momo-ink-soft) !important;
  letter-spacing:1.8px !important;
  font-size:10px !important;
}
/* Status-Pills: transparent mit farbigem Border statt glassy dunkel */
.streak-hero-status-pill{
  background:transparent !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  padding:4px 10px !important;
  font-size:10.5px !important;
  font-weight:600 !important;
  letter-spacing:0.3px !important;
  font-family:'Geist Mono',ui-monospace,monospace !important;
  text-transform:uppercase !important;
}
.streak-hero-status-pill.active{
  color:var(--momo-peach) !important;
  border:1px solid var(--momo-peach) !important;
}
.streak-hero-status-pill.danger{
  color:#C2513A !important;
  border:1px solid #E89070 !important;
}
.streak-hero-status-pill.sleep{
  color:var(--momo-ink-soft) !important;
  border:1px solid var(--momo-sand) !important;
}

/* Flame-Icon: ruhiger peach-Disc statt Lava-Orange */
.streak-hero-flame-wrap,
.streak-hero-flame-wrap.compact{
  width:52px !important;
  height:52px !important;
  flex-shrink:0 !important;
}
.streak-hero-flame-glow{display:none !important}
.streak-hero-flame-inner{
  width:52px !important;
  height:52px !important;
  background:var(--momo-peach) !important;
  color:var(--momo-charcoal) !important;
  box-shadow:none !important;
}
.streak-hero-flame-inner svg{width:22px !important;height:22px !important}
/* Danger-State: peach → Orange-Tint */
.streak-hero-card.danger .streak-hero-flame-inner{
  background:#E89070 !important;
  color:var(--momo-charcoal) !important;
}
/* Zero-State: flame als outline statt gefüllt */
.streak-hero-card.zero .streak-hero-flame-inner{
  background:transparent !important;
  border:1.5px solid var(--momo-sand) !important;
  color:var(--momo-ink-soft) !important;
}

/* Streak-Zahl: Fraunces Display, groß, links */
.streak-hero-number,
.streak-hero-number.compact{
  font-family:var(--font-display) !important;
  font-weight:300 !important;
  font-variation-settings:"SOFT" 50,"opsz" 144 !important;
  font-size:clamp(56px,14vw,72px) !important;
  letter-spacing:-0.04em !important;
  line-height:0.9 !important;
  color:var(--momo-charcoal) !important;
  -webkit-text-fill-color:var(--momo-charcoal) !important;
  background:none !important;
}
:root[data-theme="dark"] .streak-hero-number,
:root[data-theme="dark"] .streak-hero-number.compact{
  color:var(--momo-cream) !important;
  -webkit-text-fill-color:var(--momo-cream) !important;
}

.streak-hero-card .streak-hero-label,
.streak-hero-card.compact .streak-hero-label{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:10px !important;
  letter-spacing:1.8px !important;
  text-transform:uppercase !important;
  color:var(--momo-ink-soft) !important;
  font-weight:600 !important;
  margin-top:6px !important;
}

.streak-hero-sub,
.streak-hero-sub.compact{
  font-family:var(--font-display) !important;
  font-style:italic !important;
  font-variation-settings:"SOFT" 100 !important;
  font-weight:400 !important;
  font-size:14.5px !important;
  color:var(--momo-ink-mid) !important;
  line-height:1.45 !important;
  border-top:1px solid var(--momo-sand) !important;
  padding-top:14px !important;
  margin-top:16px !important;
}

/* ───── RULES V2 ───── */
.streak-rules-v2{
  background:transparent !important;
  border:1px solid var(--momo-sand) !important;
  border-radius:20px !important;
  padding:18px 20px !important;
  box-shadow:none !important;
}
.streak-rules-v2-title{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:10px !important;
  letter-spacing:1.8px !important;
  text-transform:uppercase !important;
  color:var(--momo-ink-soft) !important;
  margin-bottom:14px !important;
}
.streak-rules-v2-grid{gap:14px 12px !important}
.streak-rule-v2-ico{
  width:22px !important;
  height:22px !important;
  border-radius:6px !important;
  background:transparent !important;
  border:1px solid var(--momo-sand) !important;
  color:var(--momo-ink-soft) !important;
}
.streak-rule-v2-ico.warn{
  background:transparent !important;
  border-color:var(--momo-peach) !important;
  color:var(--momo-peach) !important;
}
.streak-rule-v2-ico.info{
  background:transparent !important;
  border-color:var(--momo-sand) !important;
  color:var(--momo-ink-soft) !important;
}
.streak-rule-v2-head{
  font-size:12.5px !important;
  color:var(--momo-charcoal) !important;
  font-weight:500 !important;
}
:root[data-theme="dark"] .streak-rule-v2-head{color:var(--momo-cream) !important}
.streak-rule-v2-sub{
  color:var(--momo-ink-mid) !important;
  font-size:11px !important;
}

/* ───── HEATMAP ───── */
.streak-heatmap{
  background:transparent !important;
  border:1px solid var(--momo-sand) !important;
  border-radius:20px !important;
  padding:18px 20px !important;
  box-shadow:none !important;
}
.streak-heatmap-head{margin-bottom:14px !important}
.streak-heatmap-title{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:10px !important;
  letter-spacing:1.8px !important;
  text-transform:uppercase !important;
  color:var(--momo-ink-soft) !important;
  font-weight:600 !important;
}
.streak-heatmap-sub{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:11px !important;
  color:var(--momo-charcoal) !important;
  font-weight:500 !important;
  font-variant-numeric:tabular-nums !important;
}
:root[data-theme="dark"] .streak-heatmap-sub{color:var(--momo-cream) !important}
.streak-heatmap-row{gap:4px !important;margin-bottom:8px !important}
.streak-heatmap-labels{gap:4px !important}
.streak-hm-cell{
  background:transparent !important;
  border:1px solid var(--momo-sand) !important;
  border-radius:5px !important;
  box-shadow:none !important;
}
.streak-hm-cell.done{
  background:var(--momo-peach) !important;
  border-color:var(--momo-peach) !important;
  box-shadow:none !important;
}
.streak-hm-cell.today{
  outline:1.5px solid var(--momo-charcoal) !important;
  outline-offset:1px !important;
}
:root[data-theme="dark"] .streak-hm-cell.today{
  outline-color:var(--momo-cream) !important;
}
.streak-hm-label{color:var(--momo-ink-soft) !important;font-size:9px !important}
.streak-hm-label.today{color:var(--momo-charcoal) !important}
:root[data-theme="dark"] .streak-hm-label.today{color:var(--momo-cream) !important}

/* ───── STATS SPLIT ───── */
.streak-stats-split{
  background:transparent !important;
  border:1px solid var(--momo-sand) !important;
  border-radius:20px !important;
  padding:22px 20px !important;
  box-shadow:none !important;
}
.streak-stat-val{
  font-family:var(--font-display) !important;
  font-weight:300 !important;
  font-variation-settings:"SOFT" 50 !important;
  font-size:42px !important;
  letter-spacing:-0.04em !important;
  color:var(--momo-charcoal) !important;
  -webkit-text-fill-color:var(--momo-charcoal) !important;
  background:none !important;
  line-height:1 !important;
}
:root[data-theme="dark"] .streak-stat-val{
  color:var(--momo-cream) !important;
  -webkit-text-fill-color:var(--momo-cream) !important;
}
.streak-stat-lbl{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:10px !important;
  letter-spacing:1.8px !important;
  color:var(--momo-ink-soft) !important;
  margin-top:8px !important;
}
.streak-stat-divider{
  background:var(--momo-sand) !important;
  height:44px !important;
}

/* ───── MILESTONES ───── */
.streak-ms-wrap{
  background:transparent !important;
  border:1px solid var(--momo-sand) !important;
  border-radius:20px !important;
  padding:18px 20px 20px !important;
  box-shadow:none !important;
}
.streak-ms-head{margin-bottom:14px !important}
.streak-ms-title{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:10px !important;
  letter-spacing:1.8px !important;
  text-transform:uppercase !important;
  color:var(--momo-ink-soft) !important;
  font-weight:600 !important;
}
.streak-ms-progress{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:11px !important;
  color:var(--momo-charcoal) !important;
  font-weight:500 !important;
  font-variant-numeric:tabular-nums !important;
}
:root[data-theme="dark"] .streak-ms-progress{color:var(--momo-cream) !important}
.streak-ms-track{gap:8px !important}
.streak-ms-chip{
  background:transparent !important;
  border:1px solid var(--momo-sand) !important;
  border-radius:14px !important;
  padding:12px 14px !important;
  min-width:86px !important;
  box-shadow:none !important;
}
.streak-ms-chip.done{
  background:var(--momo-peach) !important;
  border-color:var(--momo-peach) !important;
}
.streak-ms-chip.next{
  background:transparent !important;
  border:1.5px solid var(--momo-charcoal) !important;
  box-shadow:none !important;
}
:root[data-theme="dark"] .streak-ms-chip.next{
  border-color:var(--momo-cream) !important;
}
.streak-ms-chip-num{
  font-family:var(--font-display) !important;
  font-weight:400 !important;
  font-variation-settings:"SOFT" 50 !important;
  font-size:24px !important;
  letter-spacing:-0.03em !important;
  color:var(--momo-charcoal) !important;
}
.streak-ms-chip.done .streak-ms-chip-num{color:var(--momo-charcoal) !important}
:root[data-theme="dark"] .streak-ms-chip-num{color:var(--momo-cream) !important}
:root[data-theme="dark"] .streak-ms-chip.done .streak-ms-chip-num{color:var(--momo-charcoal) !important}
.streak-ms-chip-unit{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:9px !important;
  letter-spacing:1.4px !important;
  text-transform:uppercase !important;
  color:var(--momo-ink-soft) !important;
  margin-top:2px !important;
}
.streak-ms-chip.done .streak-ms-chip-unit{color:rgba(26,22,20,0.6) !important}
.streak-ms-chip-status{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:9px !important;
  letter-spacing:1.2px !important;
  text-transform:uppercase !important;
  font-weight:600 !important;
  color:var(--momo-ink-soft) !important;
  margin-top:6px !important;
}
.streak-ms-chip.done .streak-ms-chip-status{color:var(--momo-charcoal) !important;opacity:0.7}
.streak-ms-chip.next .streak-ms-chip-status{color:var(--momo-charcoal) !important}
:root[data-theme="dark"] .streak-ms-chip.next .streak-ms-chip-status{color:var(--momo-cream) !important}

/* Share-Button (falls gezeigt): passend einordnen */
#streak-body .streak-share-btn{
  background:var(--momo-charcoal) !important;
  color:var(--momo-cream) !important;
  border-radius:14px !important;
  padding:14px 20px !important;
  font-family:'Geist',sans-serif !important;
  font-size:13px !important;
  font-weight:500 !important;
  box-shadow:none !important;
  letter-spacing:-0.15px !important;
}
:root[data-theme="dark"] #streak-body .streak-share-btn{
  background:var(--momo-cream) !important;
  color:var(--momo-charcoal) !important;
}

/* Streak-Zahl mittig statt links */
.streak-hero-card .streak-hero-row,
.streak-hero-card.compact .streak-hero-row{
  flex-direction:column !important;
  align-items:center !important;
  gap:10px !important;
  margin-top:4px !important;
}
.streak-hero-card .streak-hero-content,
.streak-hero-card.compact .streak-hero-content{
  text-align:center !important;
  width:100% !important;
}
.streak-hero-card .streak-hero-number,
.streak-hero-card.compact .streak-hero-number,
.streak-hero-card .streak-hero-number.compact{
  text-align:center !important;
}
.streak-hero-card .streak-hero-label,
.streak-hero-card.compact .streak-hero-label{
  text-align:center !important;
  margin-top:8px !important;
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
}
/* Peach-Dashes links+rechts vom Label (wie auf Home) */
.streak-hero-card .streak-hero-label::before,
.streak-hero-card .streak-hero-label::after{
  content:"";
  display:block;
  width:22px;
  height:1px;
  background:var(--momo-sand);
}

/* ═══════════════════════════════════════════════════════════════════
   STREAK-BADGE (Header, oben rechts) — Momo-Farben
   ═══════════════════════════════════════════════════════════════════ */
.streak-badge{
  background:var(--momo-charcoal) !important;
  border:1px solid var(--momo-charcoal) !important;
  color:var(--momo-cream) !important;
  height:36px !important;
  padding:0 14px 0 11px !important;
  font-family:'Geist',sans-serif !important;
  font-size:13.5px !important;
  font-weight:600 !important;
  letter-spacing:-0.15px !important;
  box-shadow:0 2px 4px rgba(26,22,20,0.08),0 6px 14px -6px rgba(26,22,20,0.3) !important;
}
.streak-badge .streak-flame{color:var(--momo-peach) !important;width:15px !important;height:15px !important}
/* Active (User hat heute getrackt): peach-Fill, charcoal Text, deutlicher Glow */
.streak-badge.active{
  background:var(--momo-peach) !important;
  border-color:#E89985 !important;
  color:var(--momo-charcoal) !important;
  box-shadow:0 0 0 3px rgba(244,180,166,0.22),0 2px 6px rgba(216,120,100,0.32),0 10px 22px -8px rgba(216,120,100,0.5) !important;
}
.streak-badge.active .streak-flame{color:#C2513A !important}
/* Frozen (Streak pausiert): gedämpftes Sand/Taupe aus der Momo-Palette, Flame kühl-taupe */
.streak-badge.frozen{
  background:var(--momo-sand) !important;
  border-color:#B9A993 !important;
  color:#5C4E42 !important;
  box-shadow:0 0 0 3px rgba(217,206,192,0.35),0 2px 6px rgba(139,119,98,0.22),0 10px 22px -8px rgba(139,119,98,0.38) !important;
}
.streak-badge.frozen .streak-flame{color:#8A7565 !important}
/* Danger: Terracotta (harmoniert mit der Peach-Flame), weißer Text */
.streak-badge.danger{
  background:#C2513A !important;
  border-color:#A8432E !important;
  color:var(--momo-cream) !important;
  animation:none !important;
  box-shadow:0 0 0 3px rgba(194,81,58,0.18),0 2px 6px rgba(168,67,46,0.28),0 10px 22px -8px rgba(168,67,46,0.45) !important;
}
.streak-badge.danger .streak-flame{color:var(--momo-cream) !important}
/* Dark-Mode: cream-Fill, charcoal Text */
:root[data-theme="dark"] .streak-badge{
  background:transparent !important;
  border-color:var(--momo-sand) !important;
  color:var(--momo-cream) !important;
  box-shadow:none !important;
}
:root[data-theme="dark"] .streak-badge .streak-flame{color:var(--momo-peach) !important}
:root[data-theme="dark"] .streak-badge.active .streak-flame{color:var(--momo-charcoal) !important}
:root[data-theme="dark"] .streak-badge.active{
  background:var(--momo-peach) !important;
  border-color:var(--momo-peach) !important;
  color:var(--momo-charcoal) !important;
}
:root[data-theme="dark"] .streak-badge.frozen{
  background:rgba(217,206,192,0.14) !important;
  border-color:rgba(217,206,192,0.4) !important;
  color:var(--momo-sand) !important;
  box-shadow:0 0 0 3px rgba(217,206,192,0.1) !important;
}
:root[data-theme="dark"] .streak-badge.frozen .streak-flame{color:var(--momo-sand) !important}

/* ═══════════════════════════════════════════════════════════════════
   WORDMARK (Header + Auth-Wall) — neue Tanren Brand
   ═══════════════════════════════════════════════════════════════════ */
.header-wordmark{
  display:block;
  height:30px;
  width:auto;
  user-select:none;
  pointer-events:none;
}
.header-wordmark-dark{display:none}
:root[data-theme="dark"] .header-wordmark-light{display:none}
:root[data-theme="dark"] .header-wordmark-dark{display:block}
/* Automatisch bei System-Dark-Mode falls User kein explizites Theme gesetzt hat */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .header-wordmark-light{display:none}
  :root:not([data-theme="light"]) .header-wordmark-dark{display:block}
}

.auth-wall-wordmark{
  display:block;
  height:64px;
  width:auto;
  user-select:none;
  pointer-events:none;
  max-width:100%;
}
.auth-wall-wordmark-dark{display:none}
:root[data-theme="dark"] .auth-wall-wordmark-light{display:none}
:root[data-theme="dark"] .auth-wall-wordmark-dark{display:block}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .auth-wall-wordmark-light{display:none}
  :root:not([data-theme="light"]) .auth-wall-wordmark-dark{display:block}
}

/* Header-Brand-Button: Wordmark ist die Signatur, kein extra Text mehr */
.header-brand{padding:2px 4px !important}
.auth-wall-brand{padding:0 !important;margin-bottom:20px !important}

/* ═══════════════════════════════════════════════════════════════════
   FEATURE-GATE: 'Mit Pro freigeschaltet'-Block
   Kommuniziert klar dass User das gesamte Pro-Paket bekommt — nicht
   nur das geblockte Feature.
   ═══════════════════════════════════════════════════════════════════ */
.mfg-v2-includes{
  margin:4px 20px 20px;
  padding:16px 18px;
  background:rgba(244,180,166,0.08);
  border:1px solid var(--momo-peach);
  border-radius:14px;
}
:root[data-theme="dark"] .mfg-v2-includes{
  background:rgba(244,180,166,0.06);
}
.mfg-v2-includes-label{
  font-family:'Geist Mono',ui-monospace,monospace;
  font-size:10px;
  letter-spacing:1.8px;
  text-transform:uppercase;
  color:var(--momo-peach);
  font-weight:600;
  margin-bottom:10px;
}
.mfg-v2-includes-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px 16px;
  list-style:none;
  padding:0;
  margin:0;
}
@media (max-width: 440px){
  .mfg-v2-includes-list{grid-template-columns:1fr}
}
.mfg-v2-includes-list li{
  font-family:'Geist',sans-serif;
  font-size:12.5px;
  line-height:1.4;
  color:var(--momo-charcoal);
  letter-spacing:-0.1px;
  padding-left:14px;
  position:relative;
}
:root[data-theme="dark"] .mfg-v2-includes-list li{color:var(--momo-cream)}
.mfg-v2-includes-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:7px;
  width:5px;
  height:5px;
  border-radius:99px;
  background:var(--momo-peach);
}

/* ═══════════════════════════════════════════════════════════════════
   FEATURE-GATE (mfg-v2): komplett auf Momo-Palette + Dark-Mode
   Bestehende hardcoded Werte mit Momo-Variablen überschreiben
   ═══════════════════════════════════════════════════════════════════ */
.mfg-v2{
  background:var(--momo-cream) !important;
  color:var(--momo-charcoal) !important;
  padding:32px 22px calc(env(safe-area-inset-bottom) + 24px) !important;
}
:root[data-theme="dark"] .mfg-v2{
  background:var(--momo-charcoal) !important;
  color:var(--momo-cream) !important;
}

/* Feature-Header: Icon + Wordmark + Title */
.mfg-v2-feature{padding:8px 4px 22px !important}
.mfg-v2-icon{
  width:56px !important;
  height:56px !important;
  border-radius:16px !important;
  background:transparent !important;
  border:1px solid var(--momo-sand) !important;
  color:var(--momo-peach) !important;
  box-shadow:none !important;
  margin-bottom:18px !important;
}
.mfg-v2-icon svg{width:24px !important;height:24px !important}
.mfg-v2-wordmark{
  color:var(--momo-peach) !important;
  letter-spacing:2px !important;
  margin-bottom:12px !important;
}
.mfg-v2-title{
  font-family:var(--font-display) !important;
  font-weight:400 !important;
  font-variation-settings:"SOFT" 50,"opsz" 144 !important;
  font-size:28px !important;
  letter-spacing:-0.04em !important;
  line-height:1.1 !important;
  color:var(--momo-charcoal) !important;
  margin:0 0 10px !important;
}
:root[data-theme="dark"] .mfg-v2-title{color:var(--momo-cream) !important}
.mfg-v2-desc{
  color:var(--momo-ink-mid) !important;
  font-size:14.5px !important;
  line-height:1.5 !important;
  max-width:38ch !important;
}

/* 'Mit Pro freigeschaltet' Block — tightere Proportion + peach Refinement */
.mfg-v2-includes{
  margin:0 auto 22px !important;
  max-width:420px !important;
  padding:16px 18px !important;
  background:rgba(244,180,166,0.08) !important;
  border:1px solid var(--momo-peach) !important;
  border-radius:14px !important;
}
:root[data-theme="dark"] .mfg-v2-includes{
  background:rgba(244,180,166,0.06) !important;
  border-color:rgba(244,180,166,0.5) !important;
}
.mfg-v2-includes-label{
  color:var(--momo-peach) !important;
  letter-spacing:1.8px !important;
  margin-bottom:12px !important;
}
.mfg-v2-includes-list li{
  color:var(--momo-charcoal) !important;
  font-size:12.5px !important;
  line-height:1.45 !important;
}
:root[data-theme="dark"] .mfg-v2-includes-list li{color:var(--momo-cream) !important}

/* Plans: Momo-Styling */
.mfg-v2-plans{max-width:420px !important;margin:0 auto 14px !important;gap:6px !important}
.mfg-v2-plan{
  background:transparent !important;
  border:1px solid var(--momo-sand) !important;
  border-radius:14px !important;
  padding:14px 16px !important;
  box-shadow:none !important;
  transition:border-color 200ms var(--ease-out),background 200ms var(--ease-out) !important;
}
@media (hover:hover) and (pointer:fine){
  .mfg-v2-plan:hover{border-color:var(--momo-charcoal) !important}
  :root[data-theme="dark"] .mfg-v2-plan:hover{border-color:var(--momo-cream) !important}
}
.mfg-v2-plan.selected{
  border-color:var(--momo-charcoal) !important;
  box-shadow:0 0 0 1px var(--momo-charcoal) !important;
}
:root[data-theme="dark"] .mfg-v2-plan.selected{
  border-color:var(--momo-cream) !important;
  box-shadow:0 0 0 1px var(--momo-cream) !important;
}
.mfg-v2-plan.recommended{
  border-color:var(--momo-peach) !important;
  background:rgba(244,180,166,0.06) !important;
}
.mfg-v2-plan.recommended.selected{
  box-shadow:0 0 0 1.5px var(--momo-peach) !important;
  border-color:var(--momo-peach) !important;
}

.mfg-v2-plan-radio{
  width:18px !important;
  height:18px !important;
  border:1.5px solid var(--momo-sand) !important;
  background:transparent !important;
}
.mfg-v2-plan.selected .mfg-v2-plan-radio{border-color:var(--momo-charcoal) !important}
:root[data-theme="dark"] .mfg-v2-plan.selected .mfg-v2-plan-radio{border-color:var(--momo-cream) !important}
.mfg-v2-plan.recommended.selected .mfg-v2-plan-radio{border-color:var(--momo-peach) !important}
.mfg-v2-plan-radio-dot{
  width:9px !important;
  height:9px !important;
  background:var(--momo-charcoal) !important;
}
:root[data-theme="dark"] .mfg-v2-plan-radio-dot{background:var(--momo-cream) !important}
.mfg-v2-plan.recommended.selected .mfg-v2-plan-radio-dot{background:var(--momo-peach) !important}

.mfg-v2-plan-name{
  color:var(--momo-charcoal) !important;
  font-size:14px !important;
}
:root[data-theme="dark"] .mfg-v2-plan-name{color:var(--momo-cream) !important}
.mfg-v2-plan-price{
  font-family:var(--font-display) !important;
  font-weight:400 !important;
  font-size:17px !important;
  letter-spacing:-0.04em !important;
  color:var(--momo-charcoal) !important;
}
:root[data-theme="dark"] .mfg-v2-plan-price{color:var(--momo-cream) !important}
.mfg-v2-plan-bottom{
  color:var(--momo-ink-soft) !important;
  font-size:11.5px !important;
}
.mfg-v2-plan.recommended .mfg-v2-plan-note{
  color:var(--momo-peach) !important;
  font-weight:500 !important;
}

/* Trust-Zeile */
.mfg-v2-trust{
  color:var(--momo-ink-soft) !important;
  font-size:11.5px !important;
  margin-bottom:16px !important;
}

/* Actions — Primary CTA + Secondary Text-Link */
.mfg-v2-actions{max-width:420px !important}
.mfg-v2-cta{
  background:var(--momo-charcoal) !important;
  color:var(--momo-cream) !important;
  border-radius:14px !important;
  padding:15px 20px !important;
  font-size:14px !important;
  letter-spacing:-0.15px !important;
  font-weight:500 !important;
  box-shadow:none !important;
}
.mfg-v2-cta:hover{background:#0F0B08 !important}
:root[data-theme="dark"] .mfg-v2-cta{
  background:var(--momo-cream) !important;
  color:var(--momo-charcoal) !important;
}
:root[data-theme="dark"] .mfg-v2-cta:hover{background:#EFE6D7 !important}

.mfg-v2-more{
  color:var(--momo-ink-soft) !important;
  text-decoration-color:var(--momo-sand) !important;
  font-size:12.5px !important;
}
.mfg-v2-more:hover{
  color:var(--momo-charcoal) !important;
  text-decoration-color:var(--momo-charcoal) !important;
}
:root[data-theme="dark"] .mfg-v2-more:hover{
  color:var(--momo-cream) !important;
  text-decoration-color:var(--momo-cream) !important;
}

/* Form-Sheet-Header für #mfg ebenfalls Momo — Cream/Charcoal BG statt Off-White */
#mfg .form-sheet-header{
  background:rgba(247,242,234,0.92) !important;
  border-bottom-color:var(--momo-sand) !important;
}
:root[data-theme="dark"] #mfg .form-sheet-header{
  background:rgba(26,22,20,0.92) !important;
  border-bottom-color:var(--momo-sand) !important;
}

/* ═══════════════════════════════════════════════════════════════════
   BENTO TREND-PILLS — ↗ ↘ → neben Widget-Zahlen
   Zeigt Änderung vs Vorzeitraum (7-Tage-Durchschnitt oder Vorwoche)
   ═══════════════════════════════════════════════════════════════════ */
.bento-trend{
  display:inline-flex;
  align-items:center;
  gap:3px;
  margin-left:8px;
  padding:3px 7px 3px 6px;
  border-radius:99px;
  font-family:'Geist Mono',ui-monospace,monospace;
  font-size:10px;
  font-weight:600;
  letter-spacing:0.2px;
  font-variant-numeric:tabular-nums;
  line-height:1;
  vertical-align:middle;
  white-space:nowrap;
}
.bento-trend-up{
  color:var(--momo-peach);
  background:rgba(244,180,166,0.12);
}
.bento-trend-down{
  color:var(--momo-ink-soft);
  background:rgba(139,127,117,0.1);
}
.bento-trend-flat{
  color:var(--momo-ink-soft);
  background:transparent;
  padding:3px 6px;
}
:root[data-theme="dark"] .bento-trend-up{
  color:var(--momo-peach);
  background:rgba(244,180,166,0.14);
}
:root[data-theme="dark"] .bento-trend-down{
  color:var(--momo-ink-mid);
  background:rgba(160,148,135,0.1);
}

/* Goal-Badge in Task-Meta — zeigt verknüpftes Ziel als clickable peach pill */
.task-goal-badge{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:3px 9px 3px 7px;
  border-radius:99px;
  background:rgba(244,180,166,0.12);
  border:1px solid rgba(244,180,166,0.5);
  color:var(--momo-charcoal);
  font-family:'Geist',sans-serif;
  font-size:11px;
  font-weight:500;
  letter-spacing:-0.05px;
  max-width:160px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  cursor:pointer;
  transition:background 180ms var(--ease-out);
}
.task-goal-badge svg{color:var(--momo-peach);flex-shrink:0}
:root[data-theme="dark"] .task-goal-badge{color:var(--momo-cream)}
@media (hover:hover) and (pointer:fine){
  .task-goal-badge:hover{background:rgba(244,180,166,0.2)}
}

/* Virtuelle Milestone-Tasks — dezenter peach-Tint damit User erkennt
   dass der Eintrag aus einem Ziel kommt */
.task-card-virtual{
  background:rgba(244,180,166,0.06) !important;
  border-color:rgba(244,180,166,0.4) !important;
}
:root[data-theme="dark"] .task-card-virtual{
  background:rgba(244,180,166,0.04) !important;
}

/* ═══════════════════════════════════════════════════════════════════
   BUG-FIXES (recovered nach Rollback)
   ═══════════════════════════════════════════════════════════════════ */

/* 1) FOOTER ÜBERDECKT CONTENT — mehr Luft am Seitenende garantiert */
body{padding-bottom:calc(env(safe-area-inset-bottom) + 90px) !important}
@media (display-mode:standalone){
  body{padding-bottom:calc(env(safe-area-inset-bottom) + 96px) !important}
}
/* Sections innerhalb von Tabs bekommen extra Puffer unten, falls sie
   selbst ein letztes Element haben das fixen Sticky-Nav überlappt */
.section{padding-bottom:32px !important}

/* 2) CONFETTI IM DARK-MODE — charcoal Surface + cream Text + Pro-CTA */
:root[data-theme="dark"] .confetti-content{
  background:var(--momo-charcoal) !important;
  border:1px solid var(--momo-sand) !important;
  box-shadow:0 20px 40px -16px rgba(0,0,0,0.5) !important;
}
:root[data-theme="dark"] .confetti-title{color:var(--momo-cream) !important}
:root[data-theme="dark"] .confetti-quote{color:var(--momo-ink-mid) !important}
/* Confetti-Overlay BG: dunkler im Dark-Mode */
:root[data-theme="dark"] .confetti-overlay{
  background:rgba(0,0,0,0.6) !important;
}
/* Confetti-Button: charcoal/cream invertiert */
.confetti-content .btn{
  background:var(--momo-charcoal) !important;
  color:var(--momo-cream) !important;
  border:none !important;
}
:root[data-theme="dark"] .confetti-content .btn{
  background:var(--momo-cream) !important;
  color:var(--momo-charcoal) !important;
}

/* 3) TRAININGSPLAN-EDITOR — Tag-Name-Input + Farben (für sp-day-block/name) */
.sp-day-block{
  background:var(--momo-cream) !important;
  border:1px solid var(--momo-sand) !important;
}
:root[data-theme="dark"] .sp-day-block{
  background:var(--momo-charcoal) !important;
}
/* Tag-Input Text muss lesbar sein (nicht peach) */
.sp-day-block input{
  color:var(--momo-charcoal) !important;
  background:var(--momo-cream) !important;
  border:1px solid var(--momo-sand) !important;
  font-weight:500 !important;
}
:root[data-theme="dark"] .sp-day-block input{
  color:var(--momo-cream) !important;
  background:var(--momo-charcoal) !important;
  border-color:var(--momo-sand) !important;
}
.sp-day-block input:focus{
  border-color:var(--momo-charcoal) !important;
}
:root[data-theme="dark"] .sp-day-block input:focus{
  border-color:var(--momo-cream) !important;
}
/* Müll-Icon dezent ink-soft, nicht peach */
.sp-day-block .sp-ex-rm{
  color:var(--momo-ink-soft) !important;
  background:transparent !important;
}
.sp-day-block .sp-ex-rm:hover{color:var(--momo-charcoal) !important}
:root[data-theme="dark"] .sp-day-block .sp-ex-rm:hover{color:var(--momo-cream) !important}
/* + Übung / + Trainingstag-Buttons: neutral ink-mid */
.sp-day-block .btn-sm,
#spp-days ~ button.btn-sm{
  color:var(--momo-ink-mid) !important;
  border-color:var(--momo-sand) !important;
  background:transparent !important;
}
.sp-day-block .btn-sm:hover,
#spp-days ~ button.btn-sm:hover{
  color:var(--momo-charcoal) !important;
  border-color:var(--momo-charcoal) !important;
}
:root[data-theme="dark"] .sp-day-block .btn-sm:hover,
:root[data-theme="dark"] #spp-days ~ button.btn-sm:hover{
  color:var(--momo-cream) !important;
  border-color:var(--momo-cream) !important;
}
/* Exercise-Zeilen */
.sp-day-block .sp-ex-row{
  background:var(--momo-cream) !important;
  border-color:var(--momo-sand) !important;
  color:var(--momo-charcoal) !important;
}
:root[data-theme="dark"] .sp-day-block .sp-ex-row{
  background:var(--momo-charcoal) !important;
  color:var(--momo-cream) !important;
}
.sp-day-block .sp-ex-row-name{color:inherit !important}
.sp-day-block .sp-ex-row-target{color:var(--momo-ink-soft) !important}

/* 4) SELECT / INPUTS im Dark-Mode — cream Text auf charcoal BG */
:root[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea{
  background:var(--momo-charcoal) !important;
  color:var(--momo-cream) !important;
  border-color:var(--momo-sand) !important;
}
:root[data-theme="dark"] select option{
  background:#221C18;
  color:var(--momo-cream);
}
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder{
  color:var(--momo-ink-mid) !important;
  opacity:1;
}
:root[data-theme="dark"] select{color-scheme:dark}
/* Light-Mode nochmal klarstellen damit Overrides greifen */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
select,
textarea{
  background:var(--momo-cream);
  color:var(--momo-charcoal);
  border-color:var(--momo-sand);
}
/* ═══════════════════════════════════════════════════════════════════
   MULTI-STREAKS: Category-Tabs + Streak-Freeze-Banner
   ═══════════════════════════════════════════════════════════════════ */
.streak-cat-tabs{
  display:flex;
  gap:4px;
  padding:4px;
  background:var(--momo-sand);
  border-radius:99px;
  margin-bottom:18px;
}
:root[data-theme="dark"] .streak-cat-tabs{
  background:rgba(217,206,192,0.1);
}
.streak-cat-tab{
  flex:1;
  padding:8px 12px;
  border:none;
  background:transparent;
  color:var(--momo-ink-mid);
  font-family:'Geist',sans-serif;
  font-size:12.5px;
  font-weight:500;
  letter-spacing:-0.1px;
  border-radius:99px;
  cursor:pointer;
  transition:background 200ms var(--ease-out),color 200ms var(--ease-out);
}
.streak-cat-tab.active{
  background:var(--momo-cream);
  color:var(--momo-charcoal);
  box-shadow:0 1px 2px rgba(26,22,20,0.08);
}
:root[data-theme="dark"] .streak-cat-tab.active{
  background:var(--momo-charcoal);
  color:var(--momo-cream);
  box-shadow:0 1px 2px rgba(0,0,0,0.2);
}

/* Freeze-Banner */
.streak-freeze-banner{
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 16px;
  background:rgba(244,180,166,0.12);
  border:1px solid var(--momo-peach);
  border-radius:16px;
  margin-bottom:18px;
}
:root[data-theme="dark"] .streak-freeze-banner{
  background:rgba(244,180,166,0.08);
}
.streak-freeze-banner.locked{
  background:transparent;
  border-color:var(--momo-sand);
}
.streak-freeze-body{flex:1;min-width:0}
.streak-freeze-title{
  font-family:'Geist',sans-serif;
  font-size:14px;
  font-weight:500;
  color:var(--momo-charcoal);
  letter-spacing:-0.15px;
  margin-bottom:3px;
}
:root[data-theme="dark"] .streak-freeze-title{color:var(--momo-cream)}
.streak-freeze-desc{
  font-size:12px;
  color:var(--momo-ink-mid);
  line-height:1.45;
  letter-spacing:-0.05px;
}
.streak-freeze-pro{
  display:inline-block;
  font-family:'Geist Mono',ui-monospace,monospace;
  font-size:9.5px;
  font-weight:600;
  letter-spacing:1px;
  text-transform:uppercase;
  color:var(--momo-peach);
  margin-left:6px;
}
.streak-freeze-btn{
  background:var(--momo-peach);
  color:var(--momo-charcoal);
  border:none;
  padding:9px 18px;
  border-radius:99px;
  font-family:'Geist',sans-serif;
  font-size:12.5px;
  font-weight:500;
  letter-spacing:-0.1px;
  cursor:pointer;
  flex-shrink:0;
  transition:transform 160ms var(--ease-spring-soft),background 200ms var(--ease-out);
}
.streak-freeze-btn:active{transform:scale(0.96)}
.streak-freeze-btn.pro{
  background:var(--momo-charcoal);
  color:var(--momo-cream);
}
:root[data-theme="dark"] .streak-freeze-btn.pro{
  background:var(--momo-cream);
  color:var(--momo-charcoal);
}

/* ═══════════════════════════════════════════════════════════════════
   STREAK-SHEET — visuell aufgeräumt, Momo-consistent, editorial
   ═══════════════════════════════════════════════════════════════════ */

#streak-body{
  background:var(--momo-cream) !important;
  padding:0 !important;
}
:root[data-theme="dark"] #streak-body{background:var(--momo-charcoal) !important}

.streak-body-wrap{
  padding:20px 20px 40px !important;
  display:flex !important;
  flex-direction:column !important;
  gap:16px !important;
}

/* ───── HERO — große Fraunces-Zahl, zentriert, ruhig ───── */
.streak-hero-card,
.streak-hero-card.compact{
  background:transparent !important;
  border:1px solid var(--momo-sand) !important;
  border-radius:20px !important;
  padding:28px 22px !important;
  box-shadow:none !important;
  overflow:hidden !important;
  position:relative !important;
}
.streak-hero-card::before,
.streak-hero-card::after{display:none !important}
.streak-hero-flame-glow{display:none !important}

/* Top: Eyebrow + Status-Pill */
.streak-hero-top{
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  margin-bottom:20px !important;
  gap:12px !important;
}
.streak-hero-eyebrow{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:10px !important;
  letter-spacing:2px !important;
  text-transform:uppercase !important;
  color:var(--momo-ink-soft) !important;
  font-weight:600 !important;
}
.streak-hero-card.active .streak-hero-eyebrow,
.streak-hero-card:not(.zero):not(.danger) .streak-hero-eyebrow{color:var(--momo-ink-soft) !important}
.streak-hero-card.danger .streak-hero-eyebrow{color:#8C3A2A !important}

/* Status-Pills: minimal, Outline-Stil */
.streak-hero-status-pill{
  background:transparent !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  border:none !important;
  padding:0 !important;
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:10px !important;
  font-weight:600 !important;
  letter-spacing:1.4px !important;
  text-transform:uppercase !important;
  display:inline-flex !important;
  align-items:center !important;
  gap:5px !important;
}
.streak-hero-status-pill{
  border:none !important;
  padding:0 !important;
  background:transparent !important;
}
.streak-hero-status-pill.active,
.streak-hero-status-pill.danger,
.streak-hero-status-pill.sleep,
.streak-hero-status-pill.frozen{
  border:none !important;
  background:transparent !important;
  padding:0 !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.streak-hero-status-pill.active{color:var(--momo-ink-soft) !important}
.streak-hero-status-pill.active svg{color:var(--momo-peach) !important}
.streak-hero-status-pill.danger{color:#8C3A2A !important}
.streak-hero-status-pill.danger svg{color:#C2513A !important}
.streak-hero-status-pill.sleep{color:var(--momo-ink-soft) !important}
.streak-hero-status-pill.sleep svg{color:var(--momo-ink-soft) !important}
.streak-hero-status-pill.frozen{color:#5B94A8 !important}
.streak-hero-status-pill svg{flex-shrink:0}

/* Row: Flame + Zahl mittig gestapelt */
.streak-hero-row,
.streak-hero-card.compact .streak-hero-row{
  flex-direction:column !important;
  align-items:center !important;
  gap:14px !important;
  margin-top:0 !important;
}
.streak-hero-flame-wrap,
.streak-hero-flame-wrap.compact{
  width:56px !important;
  height:56px !important;
  flex-shrink:0 !important;
  margin:0 !important;
}
.streak-hero-flame-inner{
  width:56px !important;
  height:56px !important;
  background:var(--momo-peach) !important;
  color:var(--momo-charcoal) !important;
  box-shadow:none !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:50% !important;
}
.streak-hero-flame-inner svg{width:26px !important;height:26px !important}
.streak-hero-card.danger .streak-hero-flame-inner{
  background:#E89070 !important;
}
.streak-hero-card.zero .streak-hero-flame-inner{
  background:transparent !important;
  border:1.5px solid var(--momo-sand) !important;
  color:var(--momo-ink-soft) !important;
}

.streak-hero-content{
  text-align:center !important;
  width:100% !important;
}
.streak-hero-number,
.streak-hero-number.compact{
  font-family:var(--font-display) !important;
  font-weight:300 !important;
  font-variation-settings:"SOFT" 50,"opsz" 144 !important;
  font-size:clamp(72px,18vw,96px) !important;
  letter-spacing:-0.05em !important;
  line-height:0.9 !important;
  color:var(--momo-charcoal) !important;
  -webkit-text-fill-color:var(--momo-charcoal) !important;
  background:none !important;
  text-align:center !important;
  margin:0 !important;
}
:root[data-theme="dark"] .streak-hero-number,
:root[data-theme="dark"] .streak-hero-number.compact{
  color:var(--momo-cream) !important;
  -webkit-text-fill-color:var(--momo-cream) !important;
}

.streak-hero-card .streak-hero-label,
.streak-hero-card.compact .streak-hero-label{
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:10px !important;
  letter-spacing:1.8px !important;
  text-transform:uppercase !important;
  color:var(--momo-ink-soft) !important;
  font-weight:600 !important;
  margin-top:8px !important;
  text-align:center !important;
}
.streak-hero-card .streak-hero-label::before,
.streak-hero-card .streak-hero-label::after{
  content:"";
  display:block;
  width:22px;
  height:1px;
  background:var(--momo-sand);
}

.streak-hero-sub,
.streak-hero-sub.compact{
  font-family:var(--font-display) !important;
  font-style:italic !important;
  font-variation-settings:"SOFT" 100 !important;
  font-weight:400 !important;
  font-size:14px !important;
  color:var(--momo-ink-mid) !important;
  line-height:1.5 !important;
  border-top:1px solid var(--momo-sand) !important;
  padding-top:16px !important;
  margin-top:20px !important;
  text-align:center !important;
  max-width:34ch !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* ───── FREEZE BANNER ───── */
.streak-freeze-banner{
  display:flex !important;
  align-items:center !important;
  gap:14px !important;
  padding:14px 16px !important;
  background:rgba(244,180,166,0.1) !important;
  border:1px solid var(--momo-peach) !important;
  border-radius:16px !important;
}
:root[data-theme="dark"] .streak-freeze-banner{
  background:rgba(244,180,166,0.08) !important;
}
.streak-freeze-banner.locked{
  background:transparent !important;
  border-color:var(--momo-sand) !important;
}
.streak-freeze-body{flex:1;min-width:0}
.streak-freeze-title{
  font-family:'Geist',sans-serif !important;
  font-size:13.5px !important;
  font-weight:500 !important;
  color:var(--momo-charcoal) !important;
  letter-spacing:-0.1px !important;
  margin-bottom:2px !important;
}
:root[data-theme="dark"] .streak-freeze-title{color:var(--momo-cream) !important}
.streak-freeze-desc{
  font-size:11.5px !important;
  color:var(--momo-ink-mid) !important;
  line-height:1.45 !important;
  letter-spacing:-0.05px !important;
}
.streak-freeze-btn{
  background:var(--momo-peach) !important;
  color:var(--momo-charcoal) !important;
  border:none !important;
  padding:9px 16px !important;
  border-radius:99px !important;
  font-family:'Geist',sans-serif !important;
  font-size:12.5px !important;
  font-weight:500 !important;
  letter-spacing:-0.1px !important;
  cursor:pointer !important;
  flex-shrink:0 !important;
  box-shadow:none !important;
  transition:transform 160ms var(--ease-spring-soft) !important;
}
.streak-freeze-btn:active{transform:scale(0.96)}
.streak-freeze-btn.pro{
  background:var(--momo-charcoal) !important;
  color:var(--momo-cream) !important;
}
:root[data-theme="dark"] .streak-freeze-btn.pro{
  background:var(--momo-cream) !important;
  color:var(--momo-charcoal) !important;
}
.streak-freeze-pro{
  display:inline-block !important;
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:9.5px !important;
  font-weight:600 !important;
  letter-spacing:1px !important;
  text-transform:uppercase !important;
  color:var(--momo-peach) !important;
  margin-left:6px !important;
}

/* ───── RULES ───── */
.streak-rules-v2{
  background:transparent !important;
  border:1px solid var(--momo-sand) !important;
  border-radius:20px !important;
  padding:18px 20px !important;
  box-shadow:none !important;
}
.streak-rules-v2-title{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:10px !important;
  letter-spacing:1.8px !important;
  text-transform:uppercase !important;
  color:var(--momo-ink-soft) !important;
  font-weight:600 !important;
  margin-bottom:14px !important;
}
.streak-rules-v2-grid{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:14px 12px !important;
}
.streak-rule-v2{
  display:flex !important;
  gap:10px !important;
  align-items:flex-start !important;
}
.streak-rule-v2-ico{
  width:22px !important;
  height:22px !important;
  border-radius:6px !important;
  background:transparent !important;
  border:1px solid var(--momo-sand) !important;
  color:var(--momo-ink-soft) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex-shrink:0 !important;
}
.streak-rule-v2-ico.warn{
  border-color:var(--momo-peach) !important;
  color:var(--momo-peach) !important;
  background:transparent !important;
}
.streak-rule-v2-ico.info{
  border-color:var(--momo-sand) !important;
  color:var(--momo-ink-soft) !important;
  background:transparent !important;
}
.streak-rule-v2-head{
  font-size:12.5px !important;
  font-weight:500 !important;
  color:var(--momo-charcoal) !important;
  letter-spacing:-0.1px !important;
  line-height:1.3 !important;
}
:root[data-theme="dark"] .streak-rule-v2-head{color:var(--momo-cream) !important}
.streak-rule-v2-sub{
  font-size:11px !important;
  color:var(--momo-ink-mid) !important;
  margin-top:2px !important;
  line-height:1.4 !important;
  letter-spacing:-0.05px !important;
}

/* ───── HEATMAP ───── */
.streak-heatmap{
  background:transparent !important;
  border:1px solid var(--momo-sand) !important;
  border-radius:20px !important;
  padding:18px 20px !important;
  box-shadow:none !important;
}
.streak-heatmap-head{
  display:flex !important;
  justify-content:space-between !important;
  align-items:baseline !important;
  margin-bottom:14px !important;
}
.streak-heatmap-title{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:10px !important;
  letter-spacing:1.8px !important;
  text-transform:uppercase !important;
  color:var(--momo-ink-soft) !important;
  font-weight:600 !important;
}
.streak-heatmap-sub{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:11px !important;
  color:var(--momo-charcoal) !important;
  font-weight:500 !important;
  font-variant-numeric:tabular-nums !important;
}
:root[data-theme="dark"] .streak-heatmap-sub{color:var(--momo-cream) !important}
.streak-heatmap-row{
  display:grid !important;
  grid-template-columns:repeat(14,1fr) !important;
  gap:4px !important;
  margin-bottom:8px !important;
}
.streak-heatmap-labels{
  display:grid !important;
  grid-template-columns:repeat(14,1fr) !important;
  gap:4px !important;
}
.streak-hm-cell{
  aspect-ratio:1 !important;
  border-radius:5px !important;
  background:transparent !important;
  border:1px solid var(--momo-sand) !important;
  box-shadow:none !important;
}
.streak-hm-cell.done{
  background:var(--momo-peach) !important;
  border-color:var(--momo-peach) !important;
  box-shadow:none !important;
}
.streak-hm-cell.today{
  outline:1.5px solid var(--momo-charcoal) !important;
  outline-offset:1px !important;
}
:root[data-theme="dark"] .streak-hm-cell.today{outline-color:var(--momo-cream) !important}
.streak-hm-label{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:9px !important;
  text-align:center !important;
  color:var(--momo-ink-soft) !important;
  font-weight:500 !important;
  letter-spacing:0.4px !important;
  text-transform:uppercase !important;
}
.streak-hm-label.today{
  color:var(--momo-charcoal) !important;
  font-weight:600 !important;
}
:root[data-theme="dark"] .streak-hm-label.today{color:var(--momo-cream) !important}

/* ───── STATS SPLIT ───── */
.streak-stats-split{
  background:transparent !important;
  border:1px solid var(--momo-sand) !important;
  border-radius:20px !important;
  padding:22px 20px !important;
  box-shadow:none !important;
  display:grid !important;
  grid-template-columns:1fr 1px 1fr !important;
  gap:0 !important;
}
.streak-stat-col{
  text-align:center !important;
  padding:0 8px !important;
}
.streak-stat-divider{
  background:var(--momo-sand) !important;
  height:44px !important;
  align-self:center !important;
  width:1px !important;
}
.streak-stat-val{
  font-family:var(--font-display) !important;
  font-weight:300 !important;
  font-variation-settings:"SOFT" 50 !important;
  font-size:40px !important;
  letter-spacing:-0.04em !important;
  color:var(--momo-charcoal) !important;
  -webkit-text-fill-color:var(--momo-charcoal) !important;
  background:none !important;
  line-height:1 !important;
  font-variant-numeric:lining-nums !important;
}
:root[data-theme="dark"] .streak-stat-val{
  color:var(--momo-cream) !important;
  -webkit-text-fill-color:var(--momo-cream) !important;
}
.streak-stat-lbl{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:10px !important;
  letter-spacing:1.6px !important;
  text-transform:uppercase !important;
  color:var(--momo-ink-soft) !important;
  font-weight:600 !important;
  margin-top:8px !important;
}

/* ───── MILESTONES (Chips) ───── */
.streak-ms-wrap{
  background:transparent !important;
  border:1px solid var(--momo-sand) !important;
  border-radius:20px !important;
  padding:18px 20px 20px !important;
  box-shadow:none !important;
}
.streak-ms-head{
  display:flex !important;
  justify-content:space-between !important;
  align-items:baseline !important;
  margin-bottom:14px !important;
}
.streak-ms-title{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:10px !important;
  letter-spacing:1.8px !important;
  text-transform:uppercase !important;
  color:var(--momo-ink-soft) !important;
  font-weight:600 !important;
}
.streak-ms-progress{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:11px !important;
  color:var(--momo-charcoal) !important;
  font-weight:500 !important;
  font-variant-numeric:tabular-nums !important;
}
:root[data-theme="dark"] .streak-ms-progress{color:var(--momo-cream) !important}
.streak-ms-track{
  display:flex !important;
  gap:8px !important;
  overflow-x:auto !important;
  -webkit-overflow-scrolling:touch !important;
  padding-bottom:4px !important;
  scrollbar-width:none !important;
}
.streak-ms-track::-webkit-scrollbar{display:none}
.streak-ms-chip{
  flex:0 0 auto !important;
  min-width:90px !important;
  padding:12px 14px !important;
  background:transparent !important;
  border:1px solid var(--momo-sand) !important;
  border-radius:14px !important;
  text-align:left !important;
  box-shadow:none !important;
  transition:transform 160ms var(--ease-spring-soft) !important;
}
.streak-ms-chip.done{
  background:var(--momo-peach) !important;
  border-color:var(--momo-peach) !important;
}
.streak-ms-chip.next{
  background:transparent !important;
  border:1.5px solid var(--momo-charcoal) !important;
  box-shadow:none !important;
}
:root[data-theme="dark"] .streak-ms-chip.next{
  border-color:var(--momo-cream) !important;
}
.streak-ms-chip-num{
  font-family:var(--font-display) !important;
  font-weight:400 !important;
  font-variation-settings:"SOFT" 50 !important;
  font-size:24px !important;
  letter-spacing:-0.03em !important;
  color:var(--momo-charcoal) !important;
  line-height:1 !important;
  font-variant-numeric:lining-nums !important;
}
.streak-ms-chip.done .streak-ms-chip-num{color:var(--momo-charcoal) !important}
:root[data-theme="dark"] .streak-ms-chip-num{color:var(--momo-cream) !important}
:root[data-theme="dark"] .streak-ms-chip.done .streak-ms-chip-num{color:var(--momo-charcoal) !important}
.streak-ms-chip-unit{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:9px !important;
  letter-spacing:1.4px !important;
  text-transform:uppercase !important;
  color:var(--momo-ink-soft) !important;
  margin-top:2px !important;
  font-weight:600 !important;
}
.streak-ms-chip.done .streak-ms-chip-unit{color:rgba(26,22,20,0.55) !important}
.streak-ms-chip-status{
  font-family:'Geist Mono',ui-monospace,monospace !important;
  font-size:9px !important;
  letter-spacing:1.2px !important;
  text-transform:uppercase !important;
  font-weight:600 !important;
  color:var(--momo-ink-soft) !important;
  margin-top:8px !important;
}
.streak-ms-chip.done .streak-ms-chip-status{
  color:var(--momo-charcoal) !important;
  opacity:0.65 !important;
}
.streak-ms-chip.next .streak-ms-chip-status{
  color:var(--momo-charcoal) !important;
}
:root[data-theme="dark"] .streak-ms-chip.next .streak-ms-chip-status{
  color:var(--momo-cream) !important;
}

/* ════════════════════════════════════════════════════════════
   STREAK-FREEZE v2 — aktiv/inaktiv Zustände, Icon-Spalte, Ghost-Btn
   ════════════════════════════════════════════════════════════ */
.streak-freeze-banner{
  display:grid!important;
  grid-template-columns:auto 1fr auto!important;
  align-items:center!important;
  gap:14px!important;
  padding:14px 16px!important;
  border-radius:18px!important;
  background:rgba(244,180,166,0.12)!important;
  border:1px solid rgba(244,180,166,0.35)!important;
  margin-bottom:14px!important;
  transition:background 200ms ease,border-color 200ms ease!important;
}
.streak-freeze-ico{
  width:40px;height:40px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(244,180,166,0.22);
  color:var(--peach,#F4B4A6);
  flex-shrink:0;
}
.streak-freeze-body{min-width:0}
.streak-freeze-title{
  font-family:"Fraunces","Playfair Display",serif!important;
  font-size:15px!important;font-weight:600!important;
  color:var(--ink,#1A1614)!important;
  letter-spacing:-0.01em!important;
  margin-bottom:3px!important;
}
.streak-freeze-desc{
  font-size:12.5px!important;line-height:1.45!important;
  color:rgba(26,22,20,0.68)!important;
}
.streak-freeze-desc b{font-weight:600;color:var(--ink,#1A1614)}
.streak-freeze-pro{
  display:inline-block;margin-top:4px;
  font-size:11px;font-weight:500;
  color:rgba(26,22,20,0.55);
  letter-spacing:0.02em;
}

/* Active-Zustand (Free 24h) — deutlichere Peach-Fläche */
.streak-freeze-banner.active{
  background:rgba(244,180,166,0.2)!important;
  border-color:rgba(244,180,166,0.55)!important;
}
.streak-freeze-banner.active .streak-freeze-ico{
  background:var(--peach,#F4B4A6);
  color:#1A1614;
  animation:freezePulse 2.4s ease-in-out infinite;
}
@keyframes freezePulse{
  0%,100%{box-shadow:0 0 0 0 rgba(244,180,166,0.6)}
  50%{box-shadow:0 0 0 8px rgba(244,180,166,0)}
}

/* Active Pro — zusätzlich Charcoal-Akzent */
.streak-freeze-banner.active.pro{
  background:rgba(26,22,20,0.04)!important;
  border-color:rgba(26,22,20,0.15)!important;
}
.streak-freeze-banner.active.pro .streak-freeze-ico{
  background:var(--ink,#1A1614);
  color:var(--cream,#F7F2EA);
}

/* Locked */
.streak-freeze-banner.locked{
  background:rgba(26,22,20,0.03)!important;
  border-color:rgba(26,22,20,0.1)!important;
  opacity:0.92;
}
.streak-freeze-banner.locked .streak-freeze-ico{
  background:rgba(26,22,20,0.06);
  color:rgba(26,22,20,0.5);
}

/* Button — primary */
.streak-freeze-btn{
  padding:10px 16px!important;
  border-radius:999px!important;
  font-family:"Geist",system-ui,sans-serif!important;
  font-size:13px!important;font-weight:600!important;
  letter-spacing:-0.005em!important;
  background:var(--ink,#1A1614)!important;
  color:var(--cream,#F7F2EA)!important;
  border:none!important;
  cursor:pointer;
  transition:transform 160ms ease-out,background 160ms ease!important;
  white-space:nowrap;
  flex-shrink:0;
}
.streak-freeze-btn:active{transform:scale(0.97)!important}
.streak-freeze-btn.pro{
  background:var(--peach,#F4B4A6)!important;
  color:var(--ink,#1A1614)!important;
}
.streak-freeze-btn.ghost{
  background:transparent!important;
  color:var(--ink,#1A1614)!important;
  border:1px solid rgba(26,22,20,0.25)!important;
}
.streak-freeze-btn.ghost:hover{
  background:rgba(26,22,20,0.05)!important;
}

/* Dark mode */
:root[data-theme="dark"] .streak-freeze-banner{
  background:rgba(244,180,166,0.08)!important;
  border-color:rgba(244,180,166,0.22)!important;
}
:root[data-theme="dark"] .streak-freeze-ico{
  background:rgba(244,180,166,0.15);
}
:root[data-theme="dark"] .streak-freeze-title{color:var(--cream,#F7F2EA)!important}
:root[data-theme="dark"] .streak-freeze-desc{color:rgba(247,242,234,0.68)!important}
:root[data-theme="dark"] .streak-freeze-desc b{color:var(--cream,#F7F2EA)}
:root[data-theme="dark"] .streak-freeze-pro{color:rgba(247,242,234,0.5)}
:root[data-theme="dark"] .streak-freeze-banner.active{
  background:rgba(244,180,166,0.14)!important;
  border-color:rgba(244,180,166,0.4)!important;
}
:root[data-theme="dark"] .streak-freeze-banner.active.pro{
  background:rgba(247,242,234,0.05)!important;
  border-color:rgba(247,242,234,0.15)!important;
}
:root[data-theme="dark"] .streak-freeze-banner.active.pro .streak-freeze-ico{
  background:var(--cream,#F7F2EA);
  color:var(--ink,#1A1614);
}
:root[data-theme="dark"] .streak-freeze-banner.locked{
  background:rgba(247,242,234,0.04)!important;
  border-color:rgba(247,242,234,0.1)!important;
}
:root[data-theme="dark"] .streak-freeze-banner.locked .streak-freeze-ico{
  background:rgba(247,242,234,0.06);
  color:rgba(247,242,234,0.5);
}
:root[data-theme="dark"] .streak-freeze-btn{
  background:var(--cream,#F7F2EA)!important;
  color:var(--ink,#1A1614)!important;
}
:root[data-theme="dark"] .streak-freeze-btn.pro{
  background:var(--peach,#F4B4A6)!important;
  color:var(--ink,#1A1614)!important;
}
:root[data-theme="dark"] .streak-freeze-btn.ghost{
  background:transparent!important;
  color:var(--cream,#F7F2EA)!important;
  border-color:rgba(247,242,234,0.25)!important;
}
:root[data-theme="dark"] .streak-freeze-btn.ghost:hover{
  background:rgba(247,242,234,0.05)!important;
}

/* Mobile — Icon einklappen wenn sehr schmal */
@media (max-width:380px){
  .streak-freeze-banner{grid-template-columns:1fr auto!important}
  .streak-freeze-ico{display:none!important}
}

/* ════════════════════════════════════════════════════════════
   STREAK — Design-Polish Freeze-Banner + Rules v3
   ════════════════════════════════════════════════════════════ */

/* Ease-Tokens (lokal, falls global fehlt) */
.streak-freeze-banner,
.streak-rule-v2,
.streak-freeze-btn{
  --ease-out-strong:cubic-bezier(0.23,1,0.32,1);
}

/* ── Freeze-Banner: Top-Align, saubere Textspalte ─────────────── */
.streak-freeze-banner{
  align-items:start!important;
  padding:16px 18px!important;
  gap:14px!important;
  text-align:left!important;
}
.streak-freeze-banner > *{text-align:left!important}
.streak-freeze-ico{
  margin-top:1px!important;   /* optische Baseline mit Titel */
  width:38px!important;height:38px!important;
  border-radius:11px!important;
}
.streak-freeze-body{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  gap:4px!important;
}
.streak-freeze-title{
  font-size:15.5px!important;
  line-height:1.25!important;
  letter-spacing:-0.015em!important;
  margin-bottom:0!important;
}
.streak-freeze-desc{
  font-size:12.5px!important;
  line-height:1.5!important;
  max-width:38ch;
}
.streak-freeze-pro{
  margin-top:6px!important;
  font-size:10.5px!important;
  text-transform:uppercase;
  letter-spacing:0.08em!important;
  color:rgba(26,22,20,0.45)!important;
}
:root[data-theme="dark"] .streak-freeze-pro{
  color:rgba(247,242,234,0.45)!important;
}

/* Button rutscht neben die Titelzeile statt mittig zwischen 2 Zeilen */
.streak-freeze-btn{
  align-self:start!important;
  margin-top:1px!important;
  padding:9px 15px!important;
  font-size:12.5px!important;
  letter-spacing:0!important;
  transition:transform 160ms var(--ease-out-strong),background-color 160ms ease!important;
}
.streak-freeze-btn:active{transform:scale(0.96)!important}

/* Icon-Pulse dezenter (war zu auffällig) */
.streak-freeze-banner.active .streak-freeze-ico{
  animation:freezePulseSoft 2.8s ease-in-out infinite!important;
}
@keyframes freezePulseSoft{
  0%,100%{box-shadow:0 0 0 0 rgba(244,180,166,0.45)}
  50%{box-shadow:0 0 0 6px rgba(244,180,166,0)}
}

/* ── Rules Section: redaktioneller Stil ──────────────────────── */
.streak-rules-v2{
  margin:22px 0 18px!important;
  padding:0!important;
  background:transparent!important;
  border:none!important;
}
.streak-rules-v2::before{
  content:"REGELN";
  display:block;
  font-family:"Geist Mono","SF Mono",ui-monospace,monospace;
  font-size:10.5px;
  letter-spacing:0.16em;
  color:rgba(26,22,20,0.42);
  margin-bottom:8px;
}
:root[data-theme="dark"] .streak-rules-v2::before{color:rgba(247,242,234,0.42)}

.streak-rules-v2-title{
  font-family:inherit!important;
  font-size:15px!important;
  font-weight:600!important;
  font-style:normal!important;
  letter-spacing:-0.015em!important;
  color:var(--ink,#1A1614)!important;
  margin-bottom:14px!important;
}
:root[data-theme="dark"] .streak-rules-v2-title{color:var(--cream,#F7F2EA)!important}

.streak-rules-v2-grid{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:10px!important;
}
@media (max-width:480px){
  .streak-rules-v2-grid{grid-template-columns:1fr!important;gap:8px!important}
}

/* Rule-Card */
.streak-rule-v2{
  display:flex!important;
  align-items:flex-start!important;
  gap:12px!important;
  padding:13px 14px!important;
  border-radius:14px!important;
  background:transparent!important;
  border:1px solid rgba(26,22,20,0.08)!important;
  transition:transform 200ms var(--ease-out-strong),
             border-color 200ms ease,
             background-color 200ms ease!important;
}
@media (hover:hover) and (pointer:fine){
  .streak-rule-v2:hover{
    transform:translateY(-1px);
    border-color:rgba(26,22,20,0.16)!important;
    background:rgba(26,22,20,0.015)!important;
  }
}
:root[data-theme="dark"] .streak-rule-v2{
  border-color:rgba(247,242,234,0.1)!important;
}
:root[data-theme="dark"] .streak-rule-v2:hover{
  border-color:rgba(247,242,234,0.2)!important;
  background:rgba(247,242,234,0.02)!important;
}

/* Icon-Kreis — type-spezifisch */
.streak-rule-v2-ico{
  width:28px!important;height:28px!important;
  border-radius:50%!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  flex-shrink:0!important;
  margin-top:1px!important;
  transition:background-color 200ms ease!important;
}
.streak-rule-v2-ico.ok{
  background:transparent!important;
  border:1.5px solid var(--ink,#1A1614)!important;
  color:var(--ink,#1A1614)!important;
}
.streak-rule-v2-ico.warn{
  background:var(--peach,#F4B4A6)!important;
  border:none!important;
  color:#1A1614!important;
}
.streak-rule-v2-ico.info{
  background:rgba(217,206,192,0.5)!important;  /* Sand */
  border:none!important;
  color:var(--ink,#1A1614)!important;
}
:root[data-theme="dark"] .streak-rule-v2-ico.ok{
  border-color:var(--cream,#F7F2EA)!important;
  color:var(--cream,#F7F2EA)!important;
}
:root[data-theme="dark"] .streak-rule-v2-ico.info{
  background:rgba(217,206,192,0.18)!important;
  color:var(--cream,#F7F2EA)!important;
}

/* Rule-Text */
.streak-rule-v2-head{
  font-family:"Geist",system-ui,sans-serif!important;
  font-size:13.5px!important;
  font-weight:600!important;
  letter-spacing:-0.01em!important;
  line-height:1.3!important;
  color:var(--ink,#1A1614)!important;
  margin-bottom:3px!important;
}
.streak-rule-v2-sub{
  font-size:12px!important;
  line-height:1.45!important;
  color:rgba(26,22,20,0.6)!important;
  max-width:28ch;
}
:root[data-theme="dark"] .streak-rule-v2-head{color:var(--cream,#F7F2EA)!important}
:root[data-theme="dark"] .streak-rule-v2-sub{color:rgba(247,242,234,0.6)!important}

/* Reduced motion respektieren */
@media (prefers-reduced-motion:reduce){
  .streak-freeze-banner.active .streak-freeze-ico{animation:none!important}
  .streak-rule-v2{transition:none!important}
  .streak-rule-v2:hover{transform:none!important}
}

/* ════════════════════════════════════════════════════════════
   STREAK-FREEZE v3 — kompakter Chip statt prominenter Banner
   ════════════════════════════════════════════════════════════ */

/* Alte Banner-Styles komplett neutralisieren */
.streak-freeze-banner{display:none!important}

/* Row: feste Höhe → Zero Layout-Shift zwischen Zuständen */
.streak-freeze-row{
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
  min-height:34px!important;
  margin:14px 0 10px!important;
  padding:0 2px!important;
}

/* Chip — gemeinsame Basis für Button + aktiver Container */
.streak-freeze-chip{
  display:inline-flex;
  align-items:center;
  gap:7px;
  height:34px;
  padding:0 13px;
  border-radius:999px;
  background:transparent;
  border:1px solid rgba(26,22,20,0.14);
  color:rgba(26,22,20,0.72);
  font-family:"Geist",system-ui,sans-serif;
  font-size:12.5px;
  font-weight:500;
  letter-spacing:-0.005em;
  line-height:1;
  cursor:pointer;
  transition:background-color 180ms cubic-bezier(0.23,1,0.32,1),
             border-color 180ms cubic-bezier(0.23,1,0.32,1),
             color 180ms ease,
             transform 140ms cubic-bezier(0.23,1,0.32,1);
  white-space:nowrap;
  user-select:none;
}
.streak-freeze-chip-ico{
  display:inline-flex;align-items:center;justify-content:center;
  opacity:0.7;
  transition:opacity 180ms ease;
}
.streak-freeze-chip-label{line-height:1}

@media (hover:hover) and (pointer:fine){
  .streak-freeze-chip:hover{
    border-color:rgba(26,22,20,0.28);
    color:rgba(26,22,20,0.9);
    background:rgba(26,22,20,0.02);
  }
  .streak-freeze-chip:hover .streak-freeze-chip-ico{opacity:1}
}
.streak-freeze-chip:active{transform:scale(0.97)}

/* Active-Zustand — dezenter Peach-Outline, kein lauter Fill */
.streak-freeze-chip.active{
  background:rgba(244,180,166,0.12);
  border-color:rgba(244,180,166,0.5);
  color:var(--ink,#1A1614);
  padding:0 5px 0 13px;
  cursor:default;
}
.streak-freeze-chip.active .streak-freeze-chip-ico{
  color:var(--peach,#F4B4A6);
  opacity:1;
}
.streak-freeze-chip.active:active{transform:none}

/* Locked — visuell zurückgenommen, aber klickbar zum Upgrade */
.streak-freeze-chip.locked{
  border-style:dashed;
  border-color:rgba(26,22,20,0.18);
  color:rgba(26,22,20,0.5);
}
.streak-freeze-chip.locked .streak-freeze-chip-ico{opacity:0.55}

/* Close-Button im aktiven Chip */
.streak-freeze-chip-x{
  display:inline-flex;
  align-items:center;justify-content:center;
  width:22px;height:22px;
  margin-left:4px;
  padding:0;
  border-radius:50%;
  background:transparent;
  border:none;
  color:rgba(26,22,20,0.5);
  cursor:pointer;
  transition:background-color 160ms ease,color 160ms ease,transform 140ms ease-out;
}
@media (hover:hover) and (pointer:fine){
  .streak-freeze-chip-x:hover{
    background:rgba(26,22,20,0.08);
    color:var(--ink,#1A1614);
  }
}
.streak-freeze-chip-x:active{transform:scale(0.9)}

/* Dark-Mode */
:root[data-theme="dark"] .streak-freeze-chip{
  border-color:rgba(247,242,234,0.16);
  color:rgba(247,242,234,0.72);
}
:root[data-theme="dark"] .streak-freeze-chip:hover{
  border-color:rgba(247,242,234,0.3);
  color:var(--cream,#F7F2EA);
  background:rgba(247,242,234,0.04);
}
:root[data-theme="dark"] .streak-freeze-chip.active{
  background:rgba(244,180,166,0.1);
  border-color:rgba(244,180,166,0.4);
  color:var(--cream,#F7F2EA);
}
:root[data-theme="dark"] .streak-freeze-chip.locked{
  border-color:rgba(247,242,234,0.18);
  color:rgba(247,242,234,0.45);
}
:root[data-theme="dark"] .streak-freeze-chip-x{color:rgba(247,242,234,0.5)}
:root[data-theme="dark"] .streak-freeze-chip-x:hover{
  background:rgba(247,242,234,0.08);
  color:var(--cream,#F7F2EA);
}

/* Reduced Motion */
@media (prefers-reduced-motion:reduce){
  .streak-freeze-chip,
  .streak-freeze-chip-x{transition:none!important}
}

/* ════════════════════════════════════════════════════════════
   STREAK-FREEZE v4 — integriert als Hero-Footer, keine Standalone-Zeile
   ════════════════════════════════════════════════════════════ */

/* Alte Standalone-Chip-Row killen */
.streak-freeze-row,.streak-freeze-chip{display:none!important}

/* Hero-Footer-Row: dünne Sand-Divider oben, Kontext links, Action rechts */
.streak-hero-freeze{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  margin-top:16px!important;
  padding-top:12px!important;
  border-top:1px solid rgba(26,22,20,0.08)!important;
  min-height:22px!important;      /* fixe Höhe → kein Shift zwischen Zuständen */
}
:root[data-theme="dark"] .streak-hero-freeze{
  border-top-color:rgba(247,242,234,0.1)!important;
}

/* Kontext-Text links */
.streak-hero-freeze-context{
  font-family:"Geist",system-ui,sans-serif;
  font-size:12px;
  font-weight:400;
  line-height:1;
  color:rgba(26,22,20,0.48);
  letter-spacing:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  min-width:0;
}
:root[data-theme="dark"] .streak-hero-freeze-context{
  color:rgba(247,242,234,0.48);
}

/* Tertiärer Link rechts — KEIN Button-Look, KEIN Border, KEIN Fill */
.streak-hero-freeze-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:transparent;
  border:none;
  padding:10px 4px;
  min-height:40px;
  font-family:"Geist",system-ui,sans-serif;
  font-size:12.5px;
  font-weight:500;
  line-height:1;
  letter-spacing:-0.005em;
  color:var(--ink,#1A1614);
  cursor:pointer;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
  transition:opacity 160ms ease,transform 140ms cubic-bezier(0.23,1,0.32,1);
  white-space:nowrap;
  flex-shrink:0;
}
.streak-hero-freeze-link>*{pointer-events:none}
.streak-hero-freeze-link .streak-hero-freeze-ico{
  display:inline-flex;align-items:center;justify-content:center;
  opacity:0.55;
}
.streak-hero-freeze-link .streak-hero-freeze-arrow{
  display:inline-flex;align-items:center;justify-content:center;
  opacity:0.4;
  transition:transform 180ms cubic-bezier(0.23,1,0.32,1),opacity 180ms ease;
}
@media (hover:hover) and (pointer:fine){
  .streak-hero-freeze-link:hover{opacity:0.75}
  .streak-hero-freeze-link:hover .streak-hero-freeze-arrow{
    transform:translateX(2px);
    opacity:0.7;
  }
}
.streak-hero-freeze-link:active{transform:scale(0.97)}
:root[data-theme="dark"] .streak-hero-freeze-link{color:var(--cream,#F7F2EA)}

/* Locked-Variante — subtiler */
.streak-hero-freeze-link.locked{
  color:var(--peach,#F4B4A6);
}

/* Active-Zustand: ganze Zeile wird zu Status-Label + "Beenden"-Link */
.streak-hero-freeze.active .streak-hero-freeze-label{
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-family:"Geist",system-ui,sans-serif;
  font-size:12.5px;
  font-weight:500;
  color:var(--ink,#1A1614);
  line-height:1;
}
.streak-hero-freeze.active .streak-hero-freeze-ico{
  color:var(--peach,#F4B4A6);
  opacity:1;
}
.streak-hero-freeze.active .streak-hero-freeze-link{
  color:rgba(26,22,20,0.5);
  font-weight:400;
}
@media (hover:hover) and (pointer:fine){
  .streak-hero-freeze.active .streak-hero-freeze-link:hover{color:var(--ink,#1A1614);opacity:1}
}
:root[data-theme="dark"] .streak-hero-freeze.active .streak-hero-freeze-label{color:var(--cream,#F7F2EA)}
:root[data-theme="dark"] .streak-hero-freeze.active .streak-hero-freeze-link{color:rgba(247,242,234,0.5)}
:root[data-theme="dark"] .streak-hero-freeze.active .streak-hero-freeze-link:hover{color:var(--cream,#F7F2EA)}

/* Mobile: schmaler → Kontext-Text ausblenden wenn nötig, Link bleibt */
@media (max-width:360px){
  .streak-hero-freeze-context{display:none!important}
  .streak-hero-freeze{justify-content:flex-end!important}
  .streak-hero-freeze.active{justify-content:space-between!important}
}

/* Reduced Motion */
@media (prefers-reduced-motion:reduce){
  .streak-hero-freeze-link,
  .streak-hero-freeze-arrow{transition:none!important}
  .streak-hero-freeze-link:hover .streak-hero-freeze-arrow{transform:none!important}
}

/* ════════════════════════════════════════════════════════════
   FA-STATS · Redesign Nährwerte-Modal
   4-Col Hero-Strip + flache Mikro-Grid
   ════════════════════════════════════════════════════════════ */

.fa-stats-hero{
  display:grid!important;
  grid-template-columns:1fr 1px 1fr 1px 1fr 1px 1fr!important;
  align-items:center!important;
  gap:0!important;
  padding:18px 14px!important;
  margin:12px 0 0!important;
  background:rgba(244,180,166,0.06)!important;
  border:1px solid rgba(26,22,20,0.08)!important;
  border-radius:16px!important;
}
:root[data-theme="dark"] .fa-stats-hero{
  background:rgba(244,180,166,0.05)!important;
  border-color:rgba(247,242,234,0.1)!important;
}

.fa-stat-cell{
  text-align:center;
  min-width:0;
  padding:0 8px;
}
.fa-stat-num{
  font-family:"Fraunces","Playfair Display",Georgia,serif!important;
  font-weight:400!important;
  font-size:26px!important;
  line-height:1!important;
  letter-spacing:-0.8px!important;
  color:var(--ink,#1A1614)!important;
  font-variant-numeric:tabular-nums!important;
  display:inline-flex;
  align-items:baseline;
  gap:2px;
  white-space:nowrap;
}
:root[data-theme="dark"] .fa-stat-num{color:var(--cream,#F7F2EA)!important}

.fa-stat-unit{
  font-family:"Geist Mono","SF Mono",ui-monospace,monospace!important;
  font-size:11px!important;
  font-weight:500!important;
  letter-spacing:0!important;
  color:rgba(26,22,20,0.48)!important;
  margin-left:2px;
}
:root[data-theme="dark"] .fa-stat-unit{color:rgba(247,242,234,0.48)!important}

.fa-stat-label{
  font-family:"Geist Mono","SF Mono",ui-monospace,monospace!important;
  font-size:9.5px!important;
  font-weight:600!important;
  letter-spacing:0.14em!important;
  text-transform:uppercase!important;
  color:rgba(26,22,20,0.55)!important;
  margin-top:8px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
:root[data-theme="dark"] .fa-stat-label{color:rgba(247,242,234,0.55)!important}

.fa-stat-divider{
  width:1px!important;
  height:34px!important;
  background:rgba(26,22,20,0.12)!important;
  align-self:center;
  justify-self:center;
}
:root[data-theme="dark"] .fa-stat-divider{background:rgba(247,242,234,0.14)!important}

/* Mikro-Grid: flach, 2 Spalten, ruhig */
.fa-micro-grid{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:2px 20px!important;
  padding:16px 4px 4px!important;
  margin-top:12px!important;
  border-top:1px solid rgba(26,22,20,0.08)!important;
}
:root[data-theme="dark"] .fa-micro-grid{border-top-color:rgba(247,242,234,0.1)!important}

.fa-micro-row{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  padding:6px 2px!important;
  min-height:28px;
}
.fa-micro-label{
  font-family:"Geist",system-ui,sans-serif!important;
  font-size:12.5px!important;
  color:rgba(26,22,20,0.58)!important;
  letter-spacing:-0.05px!important;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  min-width:0;
  flex:1;
}
:root[data-theme="dark"] .fa-micro-label{color:rgba(247,242,234,0.58)!important}

.fa-micro-val{
  font-family:"Geist Mono","SF Mono",ui-monospace,monospace!important;
  font-size:11.5px!important;
  color:rgba(26,22,20,0.72)!important;
  font-variant-numeric:tabular-nums!important;
  flex-shrink:0;
  display:inline-flex;
  align-items:baseline;
  gap:2px;
}
:root[data-theme="dark"] .fa-micro-val{color:rgba(247,242,234,0.72)!important}

.fa-micro-unit{
  font-size:10px!important;
  color:rgba(26,22,20,0.42)!important;
  margin-left:2px;
}
:root[data-theme="dark"] .fa-micro-unit{color:rgba(247,242,234,0.42)!important}

.fa-micro-empty{
  color:rgba(26,22,20,0.28)!important;
  font-size:12px;
}
:root[data-theme="dark"] .fa-micro-empty{color:rgba(247,242,234,0.28)!important}

/* Mobile — sehr schmal: Hero auf 2×2 Grid */
@media (max-width:420px){
  .fa-stats-hero{
    grid-template-columns:1fr 1fr!important;
    gap:14px 0!important;
    padding:16px 10px!important;
  }
  .fa-stat-divider{display:none!important}
  .fa-stat-cell{
    padding:0 4px;
    border-left:1px solid rgba(26,22,20,0.1);
  }
  .fa-stat-cell:nth-child(odd){border-left:none}
  :root[data-theme="dark"] .fa-stat-cell{border-left-color:rgba(247,242,234,0.12)}
  .fa-stat-num{font-size:24px!important}
  /* Mikro-Grid auf 1 Spalte */
  .fa-micro-grid{grid-template-columns:1fr!important}
}

/* ════════════════════════════════════════════════════════════
   FA-STATS v2 · kcal dominiert, Makros sekundär
   ════════════════════════════════════════════════════════════ */

/* Hero-Container: stack statt grid — zwei Zeilen */
.fa-stats-hero{
  display:flex!important;
  flex-direction:column!important;
  gap:0!important;
  grid-template-columns:none!important;
  padding:0!important;
}

/* kcal Hero-Zeile */
.fa-stats-kcal{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  padding:24px 16px 20px!important;
  text-align:center!important;
}
.fa-stats-kcal-label{
  font-family:"Geist Mono","SF Mono",ui-monospace,monospace!important;
  font-size:10px!important;
  font-weight:600!important;
  letter-spacing:0.22em!important;
  text-transform:uppercase!important;
  color:rgba(26,22,20,0.48)!important;
  margin-bottom:8px!important;
}
:root[data-theme="dark"] .fa-stats-kcal-label{color:rgba(247,242,234,0.48)!important}

.fa-stats-kcal-row{
  display:inline-flex!important;
  align-items:baseline!important;
  gap:8px!important;
}
.fa-stats-kcal-num{
  font-family:"Fraunces","Playfair Display",Georgia,serif!important;
  font-weight:400!important;
  font-size:46px!important;
  line-height:0.95!important;
  letter-spacing:-1.8px!important;
  color:var(--ink,#1A1614)!important;
  font-variant-numeric:tabular-nums!important;
}
:root[data-theme="dark"] .fa-stats-kcal-num{color:var(--cream,#F7F2EA)!important}

.fa-stats-kcal-unit{
  font-family:"Geist Mono","SF Mono",ui-monospace,monospace!important;
  font-size:13px!important;
  font-weight:600!important;
  letter-spacing:0.08em!important;
  text-transform:uppercase!important;
  color:var(--peach,#F4B4A6)!important;
}

/* Sand-Divider zwischen kcal-Zeile und Makro-Strip */
.fa-stats-macros{
  display:grid!important;
  grid-template-columns:1fr 1px 1fr 1px 1fr!important;
  align-items:center!important;
  padding:16px 14px 18px!important;
  border-top:1px solid rgba(26,22,20,0.1)!important;
}
:root[data-theme="dark"] .fa-stats-macros{border-top-color:rgba(247,242,234,0.12)!important}

/* Makro-Zahlen etwas kleiner als vorher, damit Hierarchie klar */
.fa-stats-macros .fa-stat-num{
  font-size:22px!important;
  letter-spacing:-0.6px!important;
}
.fa-stats-macros .fa-stat-unit{
  font-size:10.5px!important;
}
.fa-stats-macros .fa-stat-label{
  font-size:9px!important;
  letter-spacing:0.16em!important;
  margin-top:6px!important;
}

/* Mobile-Anpassungen */
@media (max-width:420px){
  .fa-stats-kcal{padding:20px 14px 16px!important}
  .fa-stats-kcal-num{font-size:40px!important;letter-spacing:-1.4px!important}
  .fa-stats-kcal-unit{font-size:12px!important}
  .fa-stats-macros{
    grid-template-columns:1fr 1px 1fr 1px 1fr!important;
    padding:14px 8px 16px!important;
  }
  .fa-stats-macros .fa-stat-num{font-size:19px!important}
  .fa-stats-macros .fa-stat-label{font-size:8.5px!important;letter-spacing:0.14em!important}
  /* Vorheriger 2×2-Hero-Override für Hero-Grid zurücknehmen */
  .fa-stats-hero{grid-template-columns:none!important}
  .fa-stats-hero .fa-stat-divider{display:block!important}
  .fa-stats-hero .fa-stat-cell{border-left:none!important;padding:0 4px!important}
}

/* ════════════════════════════════════════════════════════════
   PORTION-GRÖßEN — Label-Hint + Hint-Text
   ════════════════════════════════════════════════════════════ */

/* Inline-Hint im Menge-Label: "1 Portion · 45g" */
.fa-amount-hint{
  display:inline-block;
  margin-left:8px;
  font-family:"Geist Mono","SF Mono",ui-monospace,monospace;
  font-size:10.5px;
  font-weight:500;
  letter-spacing:0.04em;
  color:var(--peach,#F4B4A6);
  text-transform:none;
}

/* Hint-Text unter Form-Section */
.form-sheet-hint{
  font-size:12px;
  line-height:1.45;
  color:rgba(26,22,20,0.5);
  letter-spacing:-0.05px;
  margin-top:8px;
}
:root[data-theme="dark"] .form-sheet-hint{color:rgba(247,242,234,0.5)}

/* ════════════════════════════════════════════════════════════
   FA-QUICK-UNIT · kleines Caption-Wort im Anker-Button
   ════════════════════════════════════════════════════════════ */
.fa-quick-unit{
  font-family:"Geist Mono","SF Mono",ui-monospace,monospace;
  font-size:10px;
  font-weight:500;
  letter-spacing:0.04em;
  color:rgba(26,22,20,0.55);
  margin-left:3px;
}
:root[data-theme="dark"] .fa-quick-unit{color:rgba(247,242,234,0.55)}

/* Quick-Buttons einheitlicher — gleiche Mindestbreite für ordentliche Reihe */
.fa-quick-btn{
  min-width:56px;
  text-align:center;
}
@media (max-width:380px){
  .fa-quick-btn{min-width:48px;font-size:13px!important}
  .fa-quick-unit{font-size:9.5px}
}

/* ════════════════════════════════════════════════════════════
   MEAL-DETAIL · Redesign für Screenshot-Würdigkeit
   ════════════════════════════════════════════════════════════ */

/* ─── Summary-Card ─── */
.mmd-summary{
  background:rgba(244,180,166,0.06)!important;
  border:1px solid rgba(26,22,20,0.08)!important;
  border-radius:20px!important;
  padding:20px 22px 22px!important;
  margin:12px 20px 24px!important;
}
:root[data-theme="dark"] .mmd-summary{
  background:rgba(244,180,166,0.05)!important;
  border-color:rgba(247,242,234,0.1)!important;
}

/* Eyebrow: Mono-Caps dezent mit Meal-Icon */
.mmd-summary-date{
  font-family:"Geist Mono","SF Mono",ui-monospace,monospace!important;
  font-size:10.5px!important;
  font-weight:600!important;
  letter-spacing:0.2em!important;
  text-transform:uppercase!important;
  color:rgba(26,22,20,0.5)!important;
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  margin-bottom:14px!important;
}
:root[data-theme="dark"] .mmd-summary-date{color:rgba(247,242,234,0.5)!important}
.mmd-summary-date svg{
  width:13px!important;height:13px!important;
  color:var(--peach,#F4B4A6)!important;
  flex-shrink:0;
  opacity:0.9;
}

/* kcal Hero — Fraunces dominant */
.mmd-summary-kcal{
  display:flex!important;
  align-items:baseline!important;
  gap:6px!important;
  margin-bottom:16px!important;
}
.mmd-summary-kcal-num{
  font-family:"Fraunces","Playfair Display",Georgia,serif!important;
  font-weight:400!important;
  font-size:52px!important;
  line-height:0.95!important;
  letter-spacing:-1.6px!important;
  color:var(--ink,#1A1614)!important;
  font-variant-numeric:tabular-nums!important;
}
:root[data-theme="dark"] .mmd-summary-kcal-num{color:var(--cream,#F7F2EA)!important}
.mmd-summary-kcal-unit{
  font-family:"Geist Mono","SF Mono",ui-monospace,monospace!important;
  font-size:12px!important;
  font-weight:600!important;
  letter-spacing:0.08em!important;
  text-transform:uppercase!important;
  color:var(--peach,#F4B4A6)!important;
}

/* Macro-Distribution Bar — 6px, proportional */
.mmd-macro-bar{
  display:flex!important;
  height:6px!important;
  width:100%;
  border-radius:999px!important;
  overflow:hidden!important;
  background:rgba(26,22,20,0.06);
  margin-bottom:16px!important;
}
:root[data-theme="dark"] .mmd-macro-bar{background:rgba(247,242,234,0.08)}
.mmd-macro-bar-seg{
  height:100%;
  transition:width 280ms cubic-bezier(0.23,1,0.32,1);
}
.mmd-macro-bar-p{background:var(--peach,#F4B4A6)}
.mmd-macro-bar-c{background:rgba(217,206,192,0.9)}  /* Sand */
.mmd-macro-bar-f{background:rgba(26,22,20,0.55)}    /* Charcoal */
:root[data-theme="dark"] .mmd-macro-bar-c{background:rgba(217,206,192,0.5)}
:root[data-theme="dark"] .mmd-macro-bar-f{background:rgba(247,242,234,0.45)}

/* Macro-Strip — 3 Cols mit Dividern (wie fa-stats Pattern) */
.mmd-summary-macros{
  display:grid!important;
  grid-template-columns:1fr 1px 1fr 1px 1fr!important;
  align-items:center!important;
  gap:0!important;
}
.mmd-macro{
  text-align:center;
  padding:0 4px;
  border:none!important;
  background:transparent!important;
}
.mmd-macro-divider{
  width:1px!important;
  height:22px!important;
  background:rgba(26,22,20,0.1)!important;
  align-self:center;
  justify-self:center;
}
:root[data-theme="dark"] .mmd-macro-divider{background:rgba(247,242,234,0.12)!important}
.mmd-macro-val{
  font-family:"Fraunces","Playfair Display",Georgia,serif!important;
  font-weight:400!important;
  font-size:24px!important;
  line-height:1!important;
  letter-spacing:-0.5px!important;
  color:var(--ink,#1A1614)!important;
  font-variant-numeric:tabular-nums!important;
  display:inline-flex;
  align-items:baseline;
  gap:2px;
  margin-bottom:4px;
}
:root[data-theme="dark"] .mmd-macro-val{color:var(--cream,#F7F2EA)!important}
.mmd-macro-unit{
  font-family:"Geist Mono","SF Mono",ui-monospace,monospace!important;
  font-size:11px!important;
  color:rgba(26,22,20,0.48)!important;
  font-weight:500!important;
}
:root[data-theme="dark"] .mmd-macro-unit{color:rgba(247,242,234,0.48)!important}
.mmd-macro-name{
  font-family:"Geist Mono","SF Mono",ui-monospace,monospace!important;
  font-size:9.5px!important;
  font-weight:600!important;
  letter-spacing:0.14em!important;
  text-transform:uppercase!important;
  color:rgba(26,22,20,0.55)!important;
}
:root[data-theme="dark"] .mmd-macro-name{color:rgba(247,242,234,0.55)!important}

/* ─── Section-Header "X Einträge" ─── */
.mmd-items-title{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  font-family:"Geist Mono","SF Mono",ui-monospace,monospace!important;
  font-size:10.5px!important;
  font-weight:600!important;
  letter-spacing:0.2em!important;
  text-transform:uppercase!important;
  color:rgba(26,22,20,0.5)!important;
  margin:8px 2px 14px!important;
}
:root[data-theme="dark"] .mmd-items-title{color:rgba(247,242,234,0.5)!important}
.mmd-items-dot{
  width:5px;height:5px;
  border-radius:999px;
  background:var(--peach,#F4B4A6);
  flex-shrink:0;
}

/* ─── Entry-Items ─── */
.mmd-item{
  position:relative;
  display:flex!important;
  align-items:stretch!important;
  gap:8px!important;
  padding:14px 16px!important;
  margin-bottom:8px!important;
  border-radius:14px!important;
  background:rgba(253,250,245,0.6)!important;
  border:1px solid rgba(26,22,20,0.07)!important;
  transition:border-color 200ms cubic-bezier(0.23,1,0.32,1),
             background-color 200ms ease,
             transform 160ms cubic-bezier(0.23,1,0.32,1)!important;
}
:root[data-theme="dark"] .mmd-item{
  background:rgba(247,242,234,0.03)!important;
  border-color:rgba(247,242,234,0.08)!important;
}
@media (hover:hover) and (pointer:fine){
  .mmd-item:hover{
    border-color:rgba(244,180,166,0.5)!important;
    background:rgba(244,180,166,0.04)!important;
  }
}
.mmd-item:active{transform:scale(0.995)}

.mmd-item-tap{
  flex:1;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  min-width:0;
  cursor:pointer;
}
.mmd-item-main{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}

/* Food-Name in Fraunces italic — Editorial Brand-Voice */
.mmd-item-name{
  font-family:"Fraunces","Playfair Display",Georgia,serif!important;
  font-style:italic!important;
  font-weight:400!important;
  font-size:16px!important;
  line-height:1.2!important;
  letter-spacing:-0.3px!important;
  color:var(--ink,#1A1614)!important;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
:root[data-theme="dark"] .mmd-item-name{color:var(--cream,#F7F2EA)!important}

/* Meta-Row: Mono, tabular, klein */
.mmd-item-meta{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  font-family:"Geist Mono","SF Mono",ui-monospace,monospace!important;
  font-size:11px!important;
  color:rgba(26,22,20,0.55)!important;
  font-variant-numeric:tabular-nums!important;
  letter-spacing:0.02em!important;
}
:root[data-theme="dark"] .mmd-item-meta{color:rgba(247,242,234,0.55)!important}
.mmd-item-meta-g{font-weight:500}
.mmd-item-meta-m{
  display:inline-flex;
  align-items:baseline;
  gap:1px;
}
.mmd-item-meta-lbl{
  font-size:9px;
  color:rgba(26,22,20,0.4);
  margin-left:1px;
}
:root[data-theme="dark"] .mmd-item-meta-lbl{color:rgba(247,242,234,0.4)}
.mmd-item-meta-sep{
  width:2px;height:2px;
  border-radius:50%;
  background:rgba(26,22,20,0.25);
  flex-shrink:0;
}
:root[data-theme="dark"] .mmd-item-meta-sep{background:rgba(247,242,234,0.25)}

/* kcal-Zahl pro Eintrag */
.mmd-item-kcal{
  display:inline-flex;
  align-items:baseline;
  gap:3px;
  flex-shrink:0;
}
.mmd-item-kcal-num{
  font-family:"Fraunces","Playfair Display",Georgia,serif!important;
  font-weight:400!important;
  font-size:22px!important;
  line-height:1!important;
  letter-spacing:-0.4px!important;
  color:var(--ink,#1A1614)!important;
  font-variant-numeric:tabular-nums!important;
}
:root[data-theme="dark"] .mmd-item-kcal-num{color:var(--cream,#F7F2EA)!important}
.mmd-item-kcal-unit{
  font-family:"Geist Mono","SF Mono",ui-monospace,monospace!important;
  font-size:10px!important;
  font-weight:500!important;
  color:rgba(26,22,20,0.45)!important;
  letter-spacing:0.04em;
}
:root[data-theme="dark"] .mmd-item-kcal-unit{color:rgba(247,242,234,0.45)!important}

/* Delete-Button — ghost-style */
.mmd-item-del{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:36px!important;height:36px!important;
  padding:0!important;
  background:transparent!important;
  border:none!important;
  border-radius:10px!important;
  color:rgba(26,22,20,0.28)!important;
  cursor:pointer;
  flex-shrink:0;
  align-self:center;
  transition:background-color 180ms ease,color 180ms ease,transform 140ms cubic-bezier(0.23,1,0.32,1)!important;
}
:root[data-theme="dark"] .mmd-item-del{color:rgba(247,242,234,0.28)!important}
@media (hover:hover) and (pointer:fine){
  .mmd-item-del:hover{
    background:rgba(194,81,58,0.08)!important;
    color:var(--danger,#C2513A)!important;
  }
}
.mmd-item-del:active{transform:scale(0.9)}

/* Mobile Anpassungen */
@media (max-width:420px){
  .mmd-summary{padding:18px 18px 20px!important;border-radius:18px!important}
  .mmd-summary-kcal-num{font-size:44px!important;letter-spacing:-1.2px!important}
  .mmd-macro-val{font-size:21px!important}
  .mmd-item{padding:12px 14px!important}
  .mmd-item-name{font-size:15px!important}
  .mmd-item-kcal-num{font-size:20px!important}
  .mmd-item-del{width:32px!important;height:32px!important}
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  .mmd-macro-bar-seg{transition:none!important}
  .mmd-item,.mmd-item-del{transition:none!important}
  .mmd-item:active,.mmd-item-del:active{transform:none!important}
}

/* Macro-Name bekommt Farb-Dot — Bar wird dadurch selbsterklärend */
.mmd-macro-name{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
}
.mmd-macro-dot{
  display:inline-block;
  width:6px;height:6px;
  border-radius:999px;
  flex-shrink:0;
  margin-top:-1px;  /* optische Mitte zur Cap-Height */
}
.mmd-macro-dot-p{background:var(--peach,#F4B4A6)}
.mmd-macro-dot-c{background:rgba(217,206,192,1)}      /* Sand */
.mmd-macro-dot-f{background:rgba(26,22,20,0.7)}       /* Charcoal */
:root[data-theme="dark"] .mmd-macro-dot-c{background:rgba(217,206,192,0.55)}
:root[data-theme="dark"] .mmd-macro-dot-f{background:rgba(247,242,234,0.6)}

/* Macro-Name & Dot Alignment-Fix */
.mmd-macro-name{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  line-height:1!important;
}
.mmd-macro-dot{
  width:5px!important;height:5px!important;
  margin-top:0!important;
}
