:root{
  /* New palette — Moonstone primary, Saffron accent, Gunmetal text */
  --green:#519CAB;            /* primary (kept name for minimal churn) */
  --green-mid:#3F808D;        /* primary darker */
  --green-light:#C3E7F1;      /* light blue tint */
  --lime:#E5F3F7;             /* soft tint (cards/hover) */
  --lime-bright:#F3FAFC;      /* extra soft tint */
  --accent:#FFC64F;           /* saffron accent */
  --accent-soft:#FFF0CC;      /* saffron tint */
  --bg:#FFFFFF;
  --card:#ffffff;
  --border:#ECEFF1;
  --text:#20373B;             /* gunmetal */
  --text-mid:#5A6E73;
  --text-soft:#9AACB0;
  --radius:22px;
  --radius-lg:28px;
  --radius-sm:14px;
  /* Diffusion shadow system (Bento 2.0) */
  --shadow-xs:0 1px 2px rgba(32,55,59,0.04),inset 0 1px 0 rgba(255,255,255,0.6);
  --shadow:0 1px 2px rgba(32,55,59,0.04),0 10px 28px -12px rgba(32,55,59,0.10),inset 0 1px 0 rgba(255,255,255,0.6);
  --shadow-sm:0 1px 3px rgba(32,55,59,0.06);
  --shadow-lift:0 2px 4px rgba(32,55,59,0.04),0 20px 40px -15px rgba(32,55,59,0.16),inset 0 1px 0 rgba(255,255,255,0.7);
  --shadow-inset-glass:inset 0 1px 0 rgba(255,255,255,0.08),inset 0 -1px 0 rgba(0,0,0,0.06);
  --success:#519CAB;
  --success-light:#C3E7F1;
  --danger:#D14B5F;
  --danger-soft:#FBE8EC;
  /* 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 ============ */
:root[data-theme="dark"]{
  --green:#6DB4C3;
  --green-mid:#4E95A3;
  --green-light:#1E3C43;
  --lime:#1A2A2E;
  --lime-bright:#152025;
  --accent:#FFD36B;
  --accent-soft:#3A2E14;
  --bg:#0E1618;
  --card:#17232A;
  --border:#243139;
  --text:#E8EEF0;
  --text-mid:#9FAFB5;
  --text-soft:#6B7B80;
  --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:#6DB4C3;
  --success-light:#1E3C43;
  --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:100vh;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;width:100%;position:relative}
/* 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;background:linear-gradient(135deg,#20373B 0%,#519CAB 55%,#FFC64F 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;font-feature-settings:"ss01","ss02"}

/* Upgrade-Button */
.header-upgrade{display:inline-flex;align-items:center;gap:4px;padding:6px 12px;background:linear-gradient(135deg,var(--accent) 0%,#FFD88A 100%);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:#E39A1F;transition:color 200ms var(--ease-swift)}
.streak-badge.active{background:linear-gradient(135deg,#FFF3DB 0%,#FFE2A8 100%);border-color:#F3C36A}
.streak-badge.active .streak-flame{color:#D8821B}
.streak-badge.danger{background:linear-gradient(135deg,#FF7A3C 0%,#E05316 100%);border-color:#B8430D;color:#fff;animation:streak-pulse-strong 1.6s var(--ease-swift) infinite;box-shadow:0 0 0 0 rgba(255,122,60,0.6)}
.streak-badge.danger .streak-flame{color:#fff}
@keyframes streak-pulse-strong{0%{transform:scale(1);box-shadow:0 0 0 0 rgba(255,122,60,0.55)}50%{transform:scale(1.06);box-shadow:0 0 0 8px rgba(255,122,60,0)}100%{transform:scale(1);box-shadow:0 0 0 0 rgba(255,122,60,0)}}
@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:linear-gradient(140deg,#20373B 0%,#2E4A50 55%,#3C5A61 100%);color:#fff;padding:28px 24px 26px;isolation:isolate;box-shadow:0 2px 4px rgba(32,55,59,0.06),0 24px 48px -18px rgba(32,55,59,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}

/* 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:#FFF1E8;color:#C25B18}
.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(132,203,142,0.22);color:#9EDDA8;border:1px solid rgba(132,203,142,0.3)}
.streak-hero-status-pill.danger{background:rgba(255,138,76,0.22);color:#FFB078;border:1px solid rgba(255,138,76,0.35)}
.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-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%,#FFDA7B 0%,#FFAE3B 50%,#E38418 100%);display:flex;align-items:center;justify-content:center;color:#6E2E00;box-shadow:inset 0 2px 4px rgba(255,255,255,0.45),inset 0 -2px 6px rgba(110,46,0,0.25),0 12px 30px -6px rgba(226,132,24,0.6)}
.streak-hero-card.danger .streak-hero-flame-inner{background:radial-gradient(circle at 30% 20%,#FFC19A 0%,#FF7A3C 50%,#C73C08 100%);color:#5A1600;box-shadow:inset 0 2px 4px rgba(255,255,255,0.4),inset 0 -2px 6px rgba(90,22,0,0.35),0 12px 30px -6px rgba(199,60,8,0.65)}
.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;background:linear-gradient(180deg,#fff 0%,#FFE8B8 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;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:transparent}
.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,#FFC56B 0%,#E38418 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,0.35)}
.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:transparent}
.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,#FFF3DB 0%,#FFE0A6 100%);border-color:#EFB663}
.streak-ms-chip.next{background:var(--card);border-color:var(--text);box-shadow:0 2px 4px rgba(32,55,59,0.04),0 12px 24px -10px rgba(32,55,59,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:#8A5914}
.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:#B4791F}
.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:#FFF1E8;color:#C25B18}
.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(32,55,59,0.06),0 4px 12px -4px rgba(32,55,59,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(32,55,59,0.06),0 24px 48px -14px rgba(32,55,59,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:#20373B;color:#fff;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:linear-gradient(145deg,#20373B 0%,#2E4A50 45%,#3C5A61 100%);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%,#FFDA7B 0%,#FFAE3B 55%,#E38418 100%);box-shadow:0 0 24px rgba(255,174,59,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%,#FFDA7B 0%,#FFAE3B 50%,#E38418 100%);display:flex;align-items:center;justify-content:center;color:#6E2E00;box-shadow:inset 0 6px 12px rgba(255,255,255,0.45),inset 0 -8px 20px rgba(110,46,0,0.3),0 30px 80px -10px rgba(226,132,24,0.7);margin-bottom:50px;position:relative}
.share-card-flame::after{content:"";position:absolute;inset:-30px;border-radius:50%;background:radial-gradient(circle,rgba(255,184,77,0.3) 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;background:linear-gradient(180deg,#fff 0%,#FFE8B8 70%,#FFC56B 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;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:linear-gradient(135deg,#20373B 0%,#2E4A50 100%);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(32,55,59,0.08),0 14px 28px -10px rgba(32,55,59,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(32,55,59,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(32,55,59,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,#FFF3DB 0%,#FFC56B 100%);display:flex;align-items:center;justify-content:center;color:#D8821B;box-shadow:inset 0 1px 0 rgba(255,255,255,0.6),0 14px 32px -10px rgba(216,130,27,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(32,55,59,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(32,55,59,0.14),0 12px 24px -8px rgba(32,55,59,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(32,55,59,0.12),0 10px 22px -8px rgba(32,55,59,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(32,55,59,0.1),0 10px 24px -8px rgba(32,55,59,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:#2E4A50;transform:translateY(-1px);box-shadow:0 2px 4px rgba(32,55,59,0.12),0 16px 32px -10px rgba(32,55,59,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(--green);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:14px;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(81,156,171,0.12)}
.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(32,55,59,0.42);z-index:100;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(32,55,59,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(32,55,59,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(32,55,59,0.1),0 6px 16px -6px rgba(32,55,59,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:#2E4A50}
.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(32,55,59,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:all 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(81,156,171,0.12)}
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:linear-gradient(135deg,var(--text) 0%,#2E4A50 100%);border-radius:var(--radius-lg);padding:22px 22px 20px;color:#fff;margin-bottom:16px;box-shadow:0 2px 4px rgba(32,55,59,0.08),0 24px 48px -20px rgba(32,55,59,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:14px;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(81,156,171,0.12)}
.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(32,55,59,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:linear-gradient(135deg,var(--text) 0%,#2E4A50 100%);border-color:transparent;color:#fff;box-shadow:0 2px 4px rgba(32,55,59,0.08),0 14px 28px -10px rgba(32,55,59,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(--green);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:#8B6000}
.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(--green);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(--green);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:14px;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(81,156,171,0.1)}
.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:all 0.2s}
.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:linear-gradient(135deg,var(--text) 0%,#2E4A50 100%);border-radius:var(--radius-lg);padding:22px 22px 20px;color:#fff;margin-bottom:16px;box-shadow:0 2px 4px rgba(32,55,59,0.08),0 24px 48px -20px rgba(32,55,59,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(32,55,59,0.08),0 2px 8px rgba(32,55,59,0.06)}
.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(--green);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(32,55,59,0.06),0 8px 24px rgba(32,55,59,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:#8B6000}
.task-badge-prio-niedrig{background:var(--green-light);color:var(--green-mid)}
.task-badge-due{background:var(--lime);color:var(--green)}
.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(81,156,171,0.5)}50%{box-shadow:0 0 0 6px rgba(81,156,171,0)}}
.task-actions{display:flex;gap:6px;margin-top:10px}
.task-mini-btn{background:var(--lime);color:var(--green);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-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(32,55,59,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(32,55,59,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:#8B6000}
.prio-opt.sel[data-p="niedrig"]{background:var(--green-light);border-color:var(--green);color:var(--green-mid)}
.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(--green);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(--green);font-weight:700}
.cal-day.cal-sel{background:var(--text);color:#fff;font-weight:600;box-shadow:0 4px 14px rgba(32,55,59,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(--green);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:linear-gradient(135deg,var(--green-light) 0%,var(--lime) 100%);border:1px solid var(--border);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(--green);opacity:0.2;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:linear-gradient(135deg,var(--text) 0%,#2E4A50 100%);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(32,55,59,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(32,55,59,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(32,55,59,0.08),0 6px 16px -6px rgba(32,55,59,0.28);transition:transform 160ms var(--ease-out),background 200ms var(--ease-swift)}
.ms-next-done-btn:hover{background:#2E4A50}
.ms-next-done-btn:active{transform:scale(0.96)}

/* Deine Woche Card */
.ms-week-card-inner{background:linear-gradient(135deg,var(--text) 0%,#2E4A50 100%);color:#fff;border-radius:22px;padding:20px;box-shadow:0 2px 4px rgba(32,55,59,0.08),0 14px 28px -10px rgba(32,55,59,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(32,55,59,0.05),0 10px 28px rgba(32,55,59,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(--green);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(--green);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-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:linear-gradient(135deg,#20373B 0%,#2E4A50 100%);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:#FFB078}

.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}
.mgoal-ms-row{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--border);transition:background 180ms var(--ease-out)}
.mgoal-ms-row:last-child{border-bottom:none}
.mgoal-ms-row:active{background:var(--lime-bright)}
.mgoal-ms-check{width:22px;height:22px;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)}
.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:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.mgoal-action-btn{padding:14px;background:var(--lime-bright);border:1px solid var(--border);color:var(--text);border-radius:14px;font-family:inherit;font-size:13px;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:transform 160ms var(--ease-spring-soft),background 200ms var(--ease-out)}
.mgoal-action-btn:active{transform:scale(0.96)}
.mgoal-action-btn.danger{background:var(--danger-soft);color:var(--danger);border-color:transparent}
.mgoal-action-btn.danger:hover{background:#fdd}

/* Quotes — premium editorial style */
.quote-daily-card{background:linear-gradient(135deg,var(--text) 0%,#2E4A50 100%);color:#fff;border-radius:var(--radius-lg);padding:28px 24px 24px;margin-bottom:18px;position:relative;overflow:hidden;box-shadow:0 2px 4px rgba(32,55,59,0.08),0 24px 48px -20px rgba(32,55,59,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(--green);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(--green);text-transform:uppercase;letter-spacing:3px;margin-bottom:20px}
.focus-ring{position:relative;display:inline-block}
.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(32,55,59,0.22)}
.focus-btn-primary:hover{background:#2E4A50;color:#fff;border-color:#2E4A50}
.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(--green);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(32,55,59,0.08),0 2px 8px rgba(32,55,59,0.06)}

/* Confetti */
.confetti-overlay{position:fixed;inset:0;background:rgba(32,55,59,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:linear-gradient(135deg,var(--text) 0%,#2E4A50 100%);border-radius:var(--radius-lg);padding:24px;color:#fff;margin-bottom:14px;box-shadow:0 2px 4px rgba(32,55,59,0.08),0 24px 48px -20px rgba(32,55,59,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:0 4px 14px rgba(255,198,79,0.32);position:relative;z-index:1}
.sp-hero .btn:hover{background:#FFD06B}
.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(--green);box-shadow:0 2px 6px rgba(81,156,171,0.08),0 8px 24px rgba(81,156,171,0.12)}
.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(--green);border-radius:99px;padding:4px 12px;font-size:11px;font-weight:600;letter-spacing:-0.1px}
.sp-plan-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px;align-items:center}
.sp-plan-actions .btn-sm{flex:1;min-width:90px}
.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:linear-gradient(135deg,var(--text) 0%,#2E4A50 100%);color:#fff;border-radius:18px;padding:18px;margin-bottom:12px;box-shadow:0 6px 20px rgba(32,55,59,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(--green);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:linear-gradient(135deg,var(--text) 0%,#2E4A50 100%);color:#fff;border-radius:20px;padding:20px;margin-bottom:14px;box-shadow:0 6px 20px rgba(32,55,59,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(--green);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(--green);font-weight:600;margin-top:4px}
.sp-meas-diff.down{color:var(--green)}
.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(32,55,59,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.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(--green);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%,#FFDF8F 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(--green);font-weight:600;margin-top:6px;letter-spacing:0.3px}
.sp-ach-card.done .sp-ach-date{color:#8B6000}
.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(32,55,59,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:linear-gradient(135deg,var(--text) 0%,#2E4A50 100%);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:#8B6000;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%,#FFDF8F 100%);border-radius:14px;padding:14px 16px;margin-bottom:14px;color:#6E4D00;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:linear-gradient(135deg,var(--text) 0%,#2E4A50 100%);color:#fff;border:none;cursor:pointer;z-index:18;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(32,55,59,0.25),0 12px 24px -6px rgba(32,55,59,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(32,55,59,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(32,55,59,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,#fff 0%,var(--lime-bright) 100%);border-color:var(--green-light)}
.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-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:linear-gradient(90deg,#C3E7F1 0%,#519CAB 100%)}
.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(--green);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(32,55,59,0.18)}
.trk-meal-add:hover{background:#2E4A50}
.trk-meal-add:active{transform:scale(0.88)}

/* Meal Detail Modal */
.mmd-summary{background:linear-gradient(135deg,var(--text) 0%,#2E4A50 100%);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(32,55,59,0.1),0 10px 24px -6px rgba(32,55,59,0.3);transition:transform 180ms var(--ease-spring-soft),background 200ms var(--ease-swift)}
.mmd-add-btn:hover{background:#2E4A50;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:baseline;margin-bottom:12px}
.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}
.trk-water-val small{color:var(--text-soft);font-weight:500;font-size:11px;margin-left:3px}
.trk-water-glasses{display:flex;gap:7px;flex-wrap:wrap}
.trk-glass{width:28px;height:34px;border:1.5px solid var(--border);border-radius:6px 6px 10px 10px;cursor:pointer;position:relative;background:var(--card);transition:all 220ms var(--ease-swift);overflow:hidden}
.trk-glass.full{border-color:var(--green);background:linear-gradient(180deg,#fff 0%,var(--green-light) 50%,var(--green) 100%)}
.trk-glass:active{transform:scale(0.92)}

/* Sport Integration */
.trk-sport{background:linear-gradient(135deg,var(--text) 0%,#2E4A50 100%);color:#fff;border-radius:20px;padding:14px 18px;margin-bottom:12px;display:flex;align-items:center;gap:12px;box-shadow:0 2px 4px rgba(32,55,59,0.08),0 14px 28px -10px rgba(32,55,59,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:linear-gradient(135deg,#20373B 0%,#2E4A50 100%);color:#fff;border-radius:18px;padding:14px 18px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 2px 4px rgba(32,55,59,0.1),0 20px 40px -14px rgba(32,55,59,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;background:linear-gradient(180deg,#fff 0%,#FFE8B8 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.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%,#FFDA7B 0%,#FFAE3B 55%,#E38418 100%);display:flex;align-items:center;justify-content:center;color:#6E2E00;box-shadow:inset 0 1px 0 rgba(255,255,255,0.5),0 6px 18px -4px rgba(226,132,24,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(32,55,59,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:linear-gradient(135deg,var(--text) 0%,#2E4A50 100%);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(32,55,59,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:all 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:all 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:all 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:16px}
.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:all 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,#fff 0%,var(--lime-bright) 100%);border-color:#CFE8D4}
.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}
.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:linear-gradient(135deg,var(--text) 0%,#2E4A50 100%);color:#fff;border-color:transparent;box-shadow:0 2px 4px rgba(32,55,59,0.08),0 18px 36px -14px rgba(32,55,59,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:#fff;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(--green)}
.mst-tile-delta.down{background:#FEF1E6;color:#C25B18}
.mst-tile-delta.flat{background:var(--lime-bright);color:var(--text-soft)}

/* Hero-Tile: Streak */
.mst-hero{grid-column:1/-1;background:linear-gradient(135deg,#20373B 0%,#2E4A50 100%);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%,#FFDA7B 0%,#FFAE3B 55%,#E38418 100%);display:flex;align-items:center;justify-content:center;color:#6E2E00;box-shadow:inset 0 1px 0 rgba(255,255,255,0.5),0 8px 20px -4px rgba(226,132,24,0.55)}
.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;background:linear-gradient(180deg,#fff 0%,#FFE8B8 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.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,#FFC56B 0%,#FFAE3B 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:#FFE8B8}
.mst-heat-cell.l2{background:#FFC56B}
.mst-heat-cell.l3{background:#FFAE3B}
.mst-heat-cell.l4{background:#E38418}
.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(32,55,59,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(--green);text-decoration:none;border-bottom:1px solid currentColor}
.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;background:linear-gradient(135deg,#20373B 0%,#519CAB 55%,#FFC64F 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;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(32,55,59,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:all 200ms var(--ease-swift)}
.auth-wall-form input:focus{border-color:var(--text);background:var(--card);box-shadow:0 0 0 4px rgba(32,55,59,0.08)}
.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)}

/* 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:#FEF1E6;color:#C25B18}
.spw-hero-delta.down{background:var(--lime);color:var(--green)}
.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"}
.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:all 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}

/* ═══════════════════════════════════════════════════════════
   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}

.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:linear-gradient(165deg,#17292B 0%,#1F363A 45%,#2E4A50 100%);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";background:linear-gradient(180deg,#fff 0%,#FFE8B8 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.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:linear-gradient(155deg,#20373B 0%,#2E4A50 100%);color:#fff;border:none;box-shadow:0 2px 4px rgba(32,55,59,0.08),0 16px 32px -10px rgba(32,55,59,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:linear-gradient(135deg,var(--accent) 0%,#FFD88A 100%);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:#20373B;background:linear-gradient(175deg,rgba(255,198,79,0.14) 0%,#fff 60%);box-shadow:0 4px 8px rgba(32,55,59,0.08),0 18px 36px -12px rgba(32,55,59,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(--green);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:linear-gradient(135deg,var(--accent) 0%,#FFD88A 100%);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(--green);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(--green)}
.prof-plan-chip.trial{background:var(--accent-soft);color:#8B6000}
.prof-plan-chip.pro{background:linear-gradient(135deg,var(--accent) 0%,#FFD88A 100%);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:linear-gradient(135deg,var(--text) 0%,#2E4A50 100%);color:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto;box-shadow:0 2px 4px rgba(32,55,59,0.1),0 14px 28px -10px rgba(32,55,59,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:linear-gradient(135deg,var(--text) 0%,#2E4A50 100%);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(32,55,59,0.08),0 14px 28px -10px rgba(32,55,59,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(23,35,42,0.82);border-bottom:1px solid rgba(36,49,57,0.8)}
:root[data-theme="dark"] .bottom-nav{background:rgba(23,35,42,0.88);box-shadow:0 -4px 20px rgba(0,0,0,0.4)}
:root[data-theme="dark"] .sub-nav{background:rgba(14,22,24,0.88)}
:root[data-theme="dark"] .form-sheet-header{background:rgba(23,35,42,0.92)}
:root[data-theme="dark"] .chat-input-row{background:rgba(23,35,42,0.9)}
:root[data-theme="dark"] .fe-smart-wrap{background:rgba(23,35,42,0.95)}
:root[data-theme="dark"] .sp-photo-tile .date{background:rgba(23,35,42,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)}

/* ============================================================
   DARK MODE — PRIMARY BUTTONS / ACTIVE STATES
   Flip "dark pill + white text" → "light pill + dark text"
   ============================================================ */
:root[data-theme="dark"] .btn,
:root[data-theme="dark"] .nav-btn.active,
: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"] .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"] .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"] .ms-next-done-btn,
:root[data-theme="dark"] .focus-btn-primary,
:root[data-theme="dark"] .sp-body-subtab.active,
:root[data-theme="dark"] .trk-meal-add,
:root[data-theme="dark"] .mmd-add-btn,
:root[data-theme="dark"] .ob-quick-chip.sel,
:root[data-theme="dark"] .fe-tab.active,
:root[data-theme="dark"] .fa-meal-btn.sel,
:root[data-theme="dark"] .share-btn-primary,
:root[data-theme="dark"] .streak-intro-cta,
:root[data-theme="dark"] .pw-cta{
  background:var(--text);
  color:var(--bg);
  box-shadow:0 2px 4px rgba(0,0,0,0.4),0 12px 24px -8px rgba(0,0,0,0.55),inset 0 1px 0 rgba(255,255,255,0.08)
}
/* 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)}
