/* Tief durch – Stylesheet. Helle, warme Küchenpalette (Creme, Petrol, Koralle). Textgrößen in rem, damit die Schriftgröße-Einstellung überall greift. */
@font-face{font-family:"Fraunces";src:url(../fonts/fraunces.woff2) format("woff2");font-weight:500 800;font-style:normal;font-display:swap}
@font-face{font-family:"Fraunces";src:url(../fonts/fraunces-italic.woff2) format("woff2");font-weight:500 800;font-style:italic;font-display:swap}
@font-face{font-family:"Nunito";src:url(../fonts/nunito.woff2) format("woff2");font-weight:400 900;font-style:normal;font-display:swap}

:root{
  --bg:#FBF5EC; --bg2:#F4EADB; --paper:#FFFFFF;
  --ink:#1F3B3A; --ink2:#3E5653; --ink3:#5D6E6A;
  --teal:#2D6F69; --teal-d:#235853; --teal-l:#E2F0EC; --teal2:#4FA39A;
  --coral:#C44A34; --coral2:#DF5B43; --coral-l:#FBE6DF; --sun:#F2B84B; --sun-l:#FCF0D6;
  --card:#FFFFFF; --line:rgba(31,59,58,.10); --line2:rgba(31,59,58,.18);
  --r-lg:22px; --shadow:0 1px 2px rgba(31,59,58,.06),0 10px 26px -14px rgba(31,59,58,.28);
  --safe-t:max(env(safe-area-inset-top),14px); --safe-b:env(safe-area-inset-bottom);
  --tabh:calc(72px + var(--safe-b));
  color-scheme:light;
}
html{font-size:100%;-webkit-text-size-adjust:100%;background:#EFE5D5}
html.fs-1{font-size:112.5%} html.fs-2{font-size:125%}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"Nunito",system-ui,sans-serif;color:var(--ink);-webkit-font-smoothing:antialiased;min-height:100dvh;overscroll-behavior-y:none;-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;text-align:inherit}
input,textarea{font:inherit;color:inherit}
a{color:inherit}
:focus{outline:none}
:focus-visible{outline:3px solid var(--teal);outline-offset:3px;border-radius:12px}
.serif{font-family:"Fraunces",Georgia,serif;letter-spacing:-.01em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.muted{color:var(--ink3);font-weight:600}
#app{max-width:480px;margin:0 auto;min-height:100dvh;position:relative;background:var(--bg);overflow-x:hidden;overflow-x:clip}
@media (min-width:520px){#app{box-shadow:0 0 0 1px var(--line),0 30px 80px -40px rgba(31,59,58,.35)}}
::placeholder{color:#7D8A86;opacity:1}
[data-focus]:focus{outline:none}

/* ---------- Grundgerüst ---------- */
.screen{min-height:100dvh;display:flex;flex-direction:column;position:relative;animation:in .3s ease-out both}
.screen.has-tabs{padding-bottom:var(--tabh)}
@keyframes in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.content{flex:1;padding:var(--safe-t) 22px 24px;display:flex;flex-direction:column;position:relative;z-index:2;min-height:0}
.content.center{text-align:center}
.topbar{display:flex;align-items:center;justify-content:space-between;min-height:48px;gap:10px}
.iconbtn{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.85);border:1px solid var(--line2);display:grid;place-items:center;flex:none;color:var(--ink);transition:transform .15s}
.iconbtn:active{transform:scale(.94)}
.iconbtn.sm{width:40px;height:40px}
.iconbtn.flip svg{transform:scaleX(-1)}
.iconbtn[disabled]{opacity:.35;pointer-events:none}
.helpbtn{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 14px 0 11px;border-radius:999px;background:rgba(255,255,255,.88);border:1.5px solid rgba(196,74,52,.35);color:var(--coral);font-weight:800;font-size:.875rem;flex:none}
.brandrow{display:flex;align-items:center;gap:9px}
.brandrow span{font-family:"Fraunces";font-size:1.25rem;font-weight:600}
.eyebrow{font-size:.8125rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--ink3);display:flex;align-items:center;gap:6px}
.card{background:var(--card);border-radius:var(--r-lg);border:1px solid var(--line);box-shadow:var(--shadow)}
.btn{min-height:58px;border-radius:20px;display:flex;align-items:center;justify-content:center;gap:10px;font-weight:800;font-size:1.0625rem;padding:0 20px;text-align:center;transition:transform .15s,opacity .15s;width:100%}
.btn:active{transform:scale(.98)}
.btn.primary,.btn.teal{background:var(--teal);color:#fff;box-shadow:0 12px 26px -14px rgba(45,111,105,.8)}
.btn.coral{background:var(--coral);color:#fff;box-shadow:0 12px 26px -14px rgba(196,74,52,.8)}
.btn.ghost{background:#fff;color:var(--ink);border:1.5px solid var(--line2)}
.btn.small{min-height:46px;font-size:.9375rem;border-radius:16px;width:auto;display:inline-flex;padding:0 16px}
.btn[disabled]{opacity:.4;pointer-events:none}
.btn.danger{background:#B8402B;color:#fff}
.btn.pulse{animation:pulse 1.8s ease-in-out infinite}
@keyframes pulse{50%{box-shadow:0 0 0 8px rgba(45,111,105,.18)}}
.link{font-weight:800;color:var(--teal-d);font-size:.9375rem;padding:12px;text-align:center;display:flex;align-items:center;justify-content:center;gap:6px;width:100%;text-decoration:none}
.h2{font-size:1.875rem;font-weight:600;line-height:1.12}
.lead{font-size:.97rem;color:var(--ink2);font-weight:600;line-height:1.5}
.sect{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);font-weight:800;margin-top:24px;margin-bottom:8px}
.hint{text-align:center;font-size:.84rem;color:var(--ink3);font-weight:600;margin-top:12px;line-height:1.4}
.hint.left{text-align:left}
.bottom{margin-top:auto;padding-top:18px;position:relative;display:flex;flex-direction:column;gap:4px}
.bottom-inline{display:flex;flex-direction:column;gap:2px;margin-top:12px}

/* ---------- Tabbar ---------- */
.tabbar{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;height:var(--tabh);display:flex;justify-content:space-around;align-items:flex-start;padding-top:9px;background:rgba(251,245,236,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--line);z-index:20}
.tab{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:.72rem;font-weight:800;color:var(--ink3);width:76px;padding:2px 0;border-radius:14px}
.tab.on{color:var(--teal)}
.tab .dot{width:5px;height:5px;border-radius:50%;background:var(--coral2);opacity:0}
.tab.on .dot{opacity:1}

/* ---------- Kunst & Animation ---------- */
.scene{display:block;width:100%;height:100%}
.steam{animation:steam 3.2s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 100%}
.steam.st1{animation-delay:-.8s}.steam.st2{animation-delay:-1.6s}.steam.st3{animation-delay:-2.4s}
@keyframes steam{0%{opacity:0;transform:translateY(4px) scaleY(.85)}30%{opacity:.95}100%{opacity:0;transform:translateY(-8px) scaleY(1.1)}}
.whistle{animation:whistle .9s ease-in-out infinite alternate}
@keyframes whistle{from{opacity:.35}to{opacity:1}}
.glow{animation:glow 5s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes glow{50%{opacity:.65;transform:scale(1.06)}}
.drift-a{animation:drift 10s ease-in-out infinite alternate}
@keyframes drift{to{transform:translateX(12px)}}
.float{animation:bob 5s ease-in-out infinite}.float.f1{animation-delay:-2s}
@keyframes bob{50%{transform:translateY(-4px)}}
.faded{opacity:.35;filter:grayscale(1)}

/* ---------- Heute ---------- */
.home-scene,.onb-scene,.night-scene{position:absolute;top:0;left:0;right:0;height:300px;z-index:0;overflow:hidden}
.home-scene::after,.onb-scene::after{content:"";position:absolute;left:0;right:0;bottom:0;height:70px;background:linear-gradient(180deg,rgba(251,245,236,0),var(--bg))}
.home-scene .topfade,.home-scene::before{content:"";position:absolute;left:0;right:0;top:0;height:70px;background:linear-gradient(180deg,rgba(251,245,236,.7),rgba(251,245,236,0));z-index:1}
.home-spacer{height:206px;flex:none}
.hello{font-size:.97rem;color:var(--ink2);font-weight:800;position:relative}
.h-title{font-size:2rem;line-height:1.1;font-weight:600;margin-top:2px;position:relative}
.h-title em,.onb-title em{font-style:italic;color:var(--coral)}
.pausebtn{display:flex;align-items:center;gap:16px;width:100%;margin-top:16px;padding:18px 18px 18px 16px;border-radius:28px;background:linear-gradient(135deg,#D3573F,#B8402B);color:#fff;box-shadow:0 18px 34px -16px rgba(184,64,43,.85);text-align:left;transition:transform .15s}
.pausebtn:active{transform:scale(.985)}
.pb-ic{width:62px;height:62px;border-radius:50%;background:rgba(255,255,255,.18);border:2px solid rgba(255,255,255,.4);display:grid;place-items:center;flex:none}
.pb-tx b{display:block;font-family:"Fraunces";font-size:1.75rem;font-weight:600;line-height:1}
.pb-tx span{display:block;font-size:.9rem;font-weight:700;margin-top:5px;line-height:1.3;opacity:.95}
.home-cards{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.cta{display:flex;align-items:center;gap:14px;width:100%;padding:15px 16px 15px 14px;border-radius:22px;text-align:left;transition:transform .15s}
.cta.soft{background:var(--teal);color:#fff;box-shadow:0 14px 28px -16px rgba(45,111,105,.85)}
.cta .ic{width:48px;height:48px;border-radius:16px;background:rgba(255,255,255,.18);display:grid;place-items:center;flex:none}
.cta .tx{flex:1;min-width:0}
.cta b{display:block;font-size:1.06rem;font-weight:900;line-height:1.2}
.cta .tx span{display:block;font-size:.875rem;font-weight:700;opacity:.92;margin-top:2px;line-height:1.3}
.rowcard{display:flex;align-items:center;gap:14px;width:100%;padding:14px 16px 14px 14px;text-align:left;position:relative}
.rowcard .ic{width:44px;height:44px;border-radius:15px;display:grid;place-items:center;flex:none}
.rowcard .ic.kt{background:var(--bg2)}
.ic.teal{background:var(--teal-l);color:var(--teal)} .ic.coral{background:var(--coral-l);color:var(--coral)} .ic.sun{background:var(--sun-l);color:#9A6A10}
.rowcard .tx{flex:1;min-width:0}
.rowcard b{display:block;font-weight:800;font-size:1rem;line-height:1.3}
.rowcard .tx span{display:block;font-size:.875rem;color:var(--ink2);font-weight:600;margin-top:2px;line-height:1.35}
.rowcard .go{color:var(--ink3);flex:none}
.rowcard .lock-tag{position:static;transform:none;flex:none}
.repcard{padding:14px 16px 16px;border:1.5px solid rgba(223,91,67,.35);background:linear-gradient(140deg,#FFF6F1,#fff)}
.repcard .eyebrow{color:var(--coral)}
.rq-text{font-family:"Fraunces";font-size:1.125rem;line-height:1.4;margin-top:8px;font-weight:500}
.rep-acts{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.daily{padding:14px 16px}
.dq{font-size:1.19rem;line-height:1.38;margin-top:6px;font-weight:500;font-style:italic}
.weekmini,.weekcard{display:block;width:100%;padding:14px 14px 10px;text-align:left}
.wm-top{display:flex;justify-content:space-between;align-items:baseline;padding:0 2px}
.wm-top b{font-weight:800}
.wm-top span{font-size:.84rem;color:var(--ink3);font-weight:700}
.wstrip{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-top:8px}
.wd{display:flex;flex-direction:column;align-items:center;gap:2px}
.wd .wk{height:30px;display:grid;place-items:end center}
.wd .wk i{width:10px;height:10px;border-radius:50%;border:2px dashed var(--line2);margin-bottom:8px}
.wd small{font-size:.72rem;font-weight:800;color:var(--ink3)}
.wd.today small{color:#fff;background:var(--teal);border-radius:6px;padding:0 6px}

/* ---------- Pause ---------- */
.s-pause{background:linear-gradient(180deg,#F6EFE4,var(--bg) 40%)}
.s-pause.hot{background:linear-gradient(180deg,#FBE3DA 0%,var(--bg) 46%)}
.s-pause.cool{background:linear-gradient(180deg,#DDEFEA 0%,var(--bg) 46%)}
.dots{display:flex;gap:6px}
.dots i{width:24px;height:7px;border-radius:4px;background:rgba(31,59,58,.14);transition:background .3s}
.dots i.on{background:var(--teal)} .dots i.done{background:rgba(45,111,105,.45)}
.q{font-size:1.94rem;line-height:1.12;font-weight:600;margin-top:4px}
.q-sub{font-size:.97rem;color:var(--ink2);margin-top:8px;line-height:1.45;font-weight:600}
.stoplist{list-style:none;margin-top:12px;display:flex;flex-direction:column;gap:6px}
.stoplist li{font-weight:800;font-size:1.06rem;padding-left:22px;position:relative;line-height:1.35}
.stoplist li::before{content:"";position:absolute;left:4px;top:.5em;width:9px;height:9px;border-radius:50%;background:var(--coral2)}
.say{margin-top:16px;padding:14px 16px;border-radius:20px;background:rgba(255,255,255,.8);border:1px solid var(--line)}
.say p{font-size:1.19rem;line-height:1.38;margin-top:6px;font-weight:500}
.say.big{padding:18px 18px 8px;margin-top:16px}
.say.big p{font-size:1.4rem;margin-top:0}
.swap{justify-content:flex-start;padding:10px 0;color:var(--teal)}
.baby{display:flex;gap:10px;align-items:flex-start;margin-top:12px;padding:12px 14px;border-radius:16px;background:var(--coral-l);font-size:.9rem;font-weight:700;line-height:1.4;color:#6B2A1E}
.baby svg{flex:none;color:var(--coral);margin-top:1px}
.heatrow{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:10px}
.hbtn{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 2px 8px;border-radius:16px;background:#fff;border:2px solid var(--line);font-size:.75rem;font-weight:800;color:var(--ink2);transition:transform .15s,border-color .15s}
.hbtn:active{transform:scale(.95)}
.hbtn.on{border-color:var(--hc);background:color-mix(in srgb,var(--hc) 14%,#fff);color:var(--ink)}
.s-pause.done .ba{display:flex;align-items:flex-end;justify-content:center;gap:4px;margin-top:min(9vh,72px)}
.ba > span{display:flex;flex-direction:column;align-items:center;gap:4px}
.ba small{font-weight:800;color:var(--ink3);font-size:.8125rem}
.ba .arr{font-size:1.8rem;color:var(--teal);padding-bottom:52px;font-weight:800}
.toolseg{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-top:10px;padding:4px;border-radius:18px;background:rgba(31,59,58,.06)}
.toolseg button{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 2px;border-radius:14px;font-size:.78rem;font-weight:800;color:var(--ink2)}
.toolseg button.on{background:#fff;color:var(--teal);box-shadow:0 2px 8px -2px rgba(31,59,58,.2)}
.breath,.steps-tool{display:flex;flex-direction:column;align-items:center;text-align:center;margin-top:18px}
.b-ring{width:230px;height:230px;border-radius:50%;position:relative;display:grid;place-items:center}
.b-glow{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle,rgba(79,163,154,.35) 0%,rgba(79,163,154,.12) 60%,rgba(79,163,154,0) 72%);transform:scale(.6);transition:transform 4s ease-in-out}
.b-glow::after{content:"";position:absolute;inset:16%;border-radius:50%;border:2px solid rgba(45,111,105,.35)}
.breath.in .b-glow{transform:scale(1.05)}
.breath.out .b-glow{transform:scale(.6);transition-duration:6s}
.b-k{position:relative}
.b-word{font-size:2.2rem;font-weight:600;margin-top:10px;line-height:1.1}
.b-sub{color:var(--ink2);font-weight:600;margin-top:8px;line-height:1.45;min-height:2.9em;max-width:300px}
.b-count{font-size:.84rem;font-weight:800;color:var(--ink3);margin-top:6px;min-height:1.2em}
.countnum{font-size:6.5rem;font-weight:600;color:var(--teal);line-height:1;height:230px;display:grid;place-items:center}
.countnum.pop{animation:pop 1.6s ease-out both}
@keyframes pop{0%{opacity:0;transform:scale(1.25)}25%{opacity:1;transform:scale(1)}100%{opacity:.75}}
.st-ic{width:120px;height:120px;border-radius:50%;background:var(--teal-l);color:var(--teal);display:grid;place-items:center;margin:16px 0 8px}
.st-prog{display:flex;gap:6px;margin-top:16px;width:100%;max-width:280px}
.st-prog i{flex:1;height:6px;border-radius:3px;background:rgba(31,59,58,.12);overflow:hidden}
.st-prog i b{display:block;height:100%;width:0;background:var(--teal)}
.st-prog i.on b{animation:fill linear both}
.st-prog i.done b{width:100%;animation:none}
@keyframes fill{to{width:100%}}

/* ---------- Check ---------- */
.s-check{background:linear-gradient(180deg,#F1EAF2 0%,var(--bg) 40%)}
.choices{display:flex;flex-direction:column;gap:8px;margin-top:16px}
.choice{display:flex;align-items:center;gap:14px;width:100%;min-height:64px;padding:10px 16px 10px 12px;border-radius:20px;background:#fff;border:2px solid var(--line);text-align:left;transition:transform .15s,border-color .15s}
.choice:active{transform:scale(.985)}
.choice.on{border-color:var(--teal);background:var(--teal-l)}
.choice .kt{width:52px;display:grid;place-items:center;flex:none}
.choice b{display:block;font-weight:800;font-size:1.03rem;line-height:1.25}
.choice .tx span{display:block;font-size:.84rem;color:var(--ink2);font-weight:600;margin-top:2px;line-height:1.3}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.chip{min-height:44px;padding:8px 14px;border-radius:14px;background:#fff;border:1.5px solid var(--line2);font-weight:800;font-size:.9rem;color:var(--ink2);line-height:1.25;text-align:left}
.chip.on{background:var(--teal);border-color:var(--teal);color:#fff}
.chip.ghost{background:transparent;border-style:dashed;font-weight:700;font-size:.84rem;min-height:40px}
.area{width:100%;margin-top:14px;border-radius:18px;border:1.5px solid var(--line2);background:#fff;padding:12px 14px;font-size:1rem;font-weight:600;line-height:1.45;resize:vertical}
.area:focus,.namefield:focus{border-color:var(--teal)}
.repoffer{margin-top:16px;padding:16px 16px 10px;border:1.5px solid rgba(223,91,67,.35);background:#FFF6F1}
.repoffer .big{font-size:1.25rem;line-height:1.3;font-weight:600}
.night-scene{height:330px}
.night-scene::after{content:"";position:absolute;left:0;right:0;bottom:0;height:80px;background:linear-gradient(180deg,rgba(251,245,236,0),var(--bg))}
.night-spacer{height:252px;flex:none}
.s-check.night{background:var(--bg)}
.lightcard{margin-top:16px;padding:14px 16px;text-align:left;background:var(--sun-l);border-color:rgba(242,184,75,.4)}
.lightcard .eyebrow{color:#86590A}
.lightcard .serif{font-size:1.15rem;line-height:1.4;margin-top:6px}

/* ---------- Reparatur ---------- */
.s-repair{background:linear-gradient(180deg,#FBE9E1 0%,var(--bg) 36%)}
.rep-head{display:grid;place-items:center;margin-top:-4px}
.mugs-art{width:150px;height:auto}
.agechips{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:8px}
.agechip{display:flex;flex-direction:column;align-items:center;padding:8px 2px;border-radius:14px;background:#fff;border:1.5px solid var(--line2);text-align:center;line-height:1.15}
.agechip b{font-weight:900;font-size:.97rem}
.agechip span{font-size:.7rem;font-weight:700;color:var(--ink3);margin-top:2px}
.agechip.on{background:var(--teal);border-color:var(--teal);color:#fff}
.agechip.on span{color:#E2F0EC}
.parts{display:flex;flex-direction:column;gap:8px;margin-top:16px}
.part{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:18px;background:#fff;border:1.5px solid var(--line);text-align:left;width:100%}
.part .pn{width:28px;height:28px;border-radius:50%;background:var(--coral-l);color:var(--coral);font-weight:900;display:grid;place-items:center;flex:none;font-size:.875rem}
.part .tx{flex:1;min-width:0}
.part b{font-weight:800;display:block}
.part .pd{display:block;font-size:.8125rem;color:var(--ink3);font-weight:700}
.part .ps{display:block;font-size:1.06rem;line-height:1.38;margin-top:6px}
.part .sw{color:var(--teal);flex:none;margin-top:2px}
.tipline{display:flex;gap:10px;margin-top:14px;font-size:.875rem;font-weight:700;color:var(--ink2);line-height:1.4}
.tipline svg{flex:none;color:var(--coral2)}

/* ---------- Verlauf ---------- */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}
.stat{padding:12px;background:#fff;border-radius:18px;border:1px solid var(--line)}
.stat b{font-family:"Fraunces";font-size:1.6rem;font-weight:600;display:block;line-height:1;color:var(--teal)}
.stat span{font-size:.78rem;color:var(--ink2);font-weight:700;margin-top:6px;display:block;line-height:1.25}
.insight{display:flex;gap:12px;margin-top:8px;padding:14px 16px;background:linear-gradient(135deg,#EAF4F1,#fff);border:1px solid rgba(45,111,105,.2);border-radius:var(--r-lg)}
.insight .i-ic{width:34px;height:34px;border-radius:12px;background:var(--teal);color:#fff;display:grid;place-items:center;flex:none}
.insight b{font-size:1rem;font-weight:800;line-height:1.35;display:block}
.insight p{font-size:.875rem;color:var(--ink2);font-weight:600;line-height:1.45;margin-top:3px}
.lockcard{display:flex;gap:12px;width:100%;margin-top:8px;padding:16px 74px 16px 16px;text-align:left;position:relative;background:linear-gradient(140deg,#FFF8EA,#fff);border-color:rgba(242,184,75,.45)}
.lockcard .lk{width:38px;height:38px;border-radius:50%;background:var(--sun-l);color:#86590A;display:grid;place-items:center;flex:none}
.lockcard b{font-weight:800;display:block}
.lockcard p{font-size:.875rem;color:var(--ink2);font-weight:600;line-height:1.4;margin-top:3px}
.lock-tag{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:.6875rem;font-weight:900;padding:4px 8px;border-radius:8px;background:var(--sun-l);color:#7A4F06;display:flex;align-items:center;gap:4px;flex:none}
.empty-mini{padding:14px 16px}
.empty-mini p{font-size:.9rem;color:var(--ink2);font-weight:600;line-height:1.45}
.empty{padding:22px 18px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px}
.empty p{color:var(--ink2);font-weight:600;line-height:1.45}
.empty b{color:var(--ink)}
.calcard{padding:10px 10px 14px}
.cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.cal-head b{font-weight:800}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cw{text-align:center;font-size:.72rem;font-weight:800;color:var(--ink3);padding-bottom:2px}
.cd{aspect-ratio:1/1;border-radius:12px;display:grid;place-items:center;font-size:.8125rem;font-weight:700;color:var(--ink3);position:relative}
.cd i{position:absolute;inset:3px;border-radius:10px;background:var(--hc);opacity:.9}
.cd span{position:relative;font-weight:800}
.cd i + span{color:var(--ink)}
.cd em{position:absolute;bottom:3px;width:5px;height:5px;border-radius:50%;background:var(--ink)}
.cd.today{outline:2px solid var(--teal);outline-offset:-1px}
.cd.fut{opacity:.4}
.legend{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:10px;padding:0 4px}
.legend span{display:flex;align-items:center;gap:5px;font-size:.78rem;font-weight:700;color:var(--ink2)}
.legend i{width:10px;height:10px;border-radius:50%}
.legend em{width:6px;height:6px;border-radius:50%;background:var(--ink)}
.group{padding:2px 16px}
.logrow{display:flex;align-items:center;gap:12px;width:100%;padding:10px 0;border-bottom:1px solid var(--line);text-align:left;color:var(--ink3)}
.logrow:last-child{border-bottom:0}
.logrow .kt{width:40px;display:grid;place-items:center;flex:none}
.logrow .tx{flex:1;min-width:0}
.logrow b{display:block;color:var(--ink);font-weight:800;font-size:.97rem}
.logrow .tx span{display:block;font-size:.8125rem;color:var(--ink2);font-weight:600;margin-top:2px}
.tag-head{display:flex;align-items:center;gap:14px;margin:8px 0 6px}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.tag{padding:5px 10px;border-radius:10px;background:var(--teal-l);color:var(--teal-d);font-weight:800;font-size:.84rem}
.row.col{flex-direction:column;align-items:flex-start;gap:2px}
.row.col .serif{font-size:1.06rem;line-height:1.4}
.lights{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.lightnote{padding:14px;border-radius:6px 18px 6px 18px;background:var(--sun-l);box-shadow:var(--shadow);transform:rotate(-1deg)}
.lightnote.n1{background:var(--teal-l);transform:rotate(1deg)}.lightnote.n2{background:var(--coral-l);transform:rotate(-.5deg)}
.lightnote p{font-size:1rem;line-height:1.35}
.lightnote small{display:block;margin-top:8px;font-size:.75rem;font-weight:800;color:var(--ink3)}

/* ---------- Kiste ---------- */
.toolgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tool{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:14px;text-align:left}
.tool .ic{width:44px;height:44px;border-radius:14px;background:var(--teal-l);color:var(--teal);display:grid;place-items:center;margin-bottom:4px}
.tool b{font-weight:800;line-height:1.25}
.tool span{font-size:.8125rem;color:var(--ink2);font-weight:600;line-height:1.3}
.row .ic.sm{width:36px;height:36px;border-radius:12px;background:var(--bg2);color:var(--teal);display:grid;place-items:center;flex:none}
.row.sit,.row{position:relative}
.row .lock-tag{position:static;transform:none}
.readmark{color:var(--teal)!important;font-weight:800!important}
.sit-head{margin-top:6px}
.ic.big{width:68px;height:68px;border-radius:22px;background:var(--teal-l);color:var(--teal);display:grid;place-items:center}
.sit-head + .h2{margin-top:12px}
.saetze{display:flex;flex-direction:column;gap:8px;margin-top:16px}
.satz{padding:14px 16px;border-radius:18px;background:#fff;border:1px solid var(--line);font-size:1.12rem;line-height:1.4;border-left:4px solid var(--teal2)}
.tipcard{margin-top:16px;padding:14px 16px;background:var(--teal-l);border-color:rgba(45,111,105,.2);box-shadow:none}
.tipcard .eyebrow{color:var(--teal-d)}
.tipcard p:last-child{font-weight:700;line-height:1.45;margin-top:6px}
.w-lead{font-size:1.06rem;font-weight:800;color:var(--ink2);margin-top:8px;line-height:1.45}
.w-p{font-size:1rem;line-height:1.62;font-weight:600;margin-top:12px}

/* ---------- Ich ---------- */
.me-card{display:flex;align-items:center;gap:14px;padding:14px 16px;margin-top:8px}
.me-card .namefield{margin-top:6px}
.plusrow{display:flex;align-items:center;gap:14px;width:100%;padding:14px 16px;text-align:left;background:linear-gradient(140deg,#FFF8EA,#fff);border-color:rgba(242,184,75,.45)}
.plusrow .pr-art{width:44px;height:44px;border-radius:15px;background:var(--sun);color:var(--ink);display:grid;place-items:center;flex:none}
.plusrow .tx{flex:1}.plusrow b{display:block;font-weight:800}.plusrow .tx span{display:block;font-size:.84rem;color:var(--ink2);font-weight:600;margin-top:2px;line-height:1.35}
.row{display:flex;align-items:center;gap:12px;min-height:56px;padding:10px 0;border-bottom:1px solid var(--line);width:100%;text-align:left}
.group > .row:last-child{border-bottom:0}
.row .lbl{flex:1;font-weight:700;font-size:.97rem;line-height:1.3}
.row .lbl small{display:block;font-size:.8125rem;color:var(--ink2);font-weight:600;margin-top:2px;line-height:1.35}
.row .val{color:var(--ink2);font-weight:700;font-size:.875rem;text-align:right}
.row > svg{color:var(--ink3);flex:none}
.row.danger .lbl,.row.danger svg{color:#A8361F}
.toggle{width:52px;height:32px;border-radius:16px;background:#C9CFCB;position:relative;flex:none;transition:background .2s}
.toggle::after{content:"";position:absolute;top:3px;left:3px;width:26px;height:26px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .2s}
.toggle[aria-checked="true"]{background:var(--teal)}
.toggle[aria-checked="true"]::after{transform:translateX(20px)}
.fs-seg{display:flex;gap:6px;flex:none}
.fs-seg button{width:44px;height:40px;border-radius:12px;background:var(--bg2);font-weight:800;display:grid;place-items:center;color:var(--ink2)}
.fs-seg button.on{background:var(--teal);color:#fff}
.namefield{width:100%;min-height:52px;border-radius:16px;border:1.5px solid var(--line2);background:#fff;padding:0 14px;font-weight:700;font-size:1rem;color:var(--ink)}
.textpage p,.textpage li{font-size:.97rem;line-height:1.6;font-weight:600;color:var(--ink2);margin-top:10px}
.textpage h3{font-size:1.06rem;font-weight:800;margin-top:20px}
.textpage ul{padding-left:20px}

/* ---------- Hilfe ---------- */
.helprow{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:18px;background:#fff;border:1px solid var(--line2);margin-top:8px;text-decoration:none}
.helprow .who{flex:1;min-width:0}
.helprow .top{display:flex;align-items:center;gap:8px}
.helprow .nr{font-family:"Fraunces";font-weight:700;font-size:1.25rem;line-height:1.2;color:var(--teal-d);white-space:nowrap}
.helprow .nm{display:block;font-size:.8125rem;color:var(--ink2);font-weight:600;line-height:1.35;margin-top:2px}
.helprow .nm b{font-weight:800;color:var(--ink)}
.helprow .call{width:40px;height:40px;border-radius:50%;background:var(--teal);display:grid;place-items:center;color:#fff;flex:none}
.land{font-size:.7rem;font-weight:900;background:var(--bg2);color:var(--ink2);padding:2px 7px;border-radius:6px;letter-spacing:.04em}
.sos{margin-top:12px;padding:14px 16px;border-radius:18px;background:var(--coral-l);border:1.5px solid rgba(196,74,52,.3);color:#5A2318;font-size:.92rem;font-weight:700;line-height:1.45}
.sos ol{padding-left:20px;margin-top:6px}
.sos li+li{margin-top:3px}
.sos p{margin-top:8px}
.safety{margin-top:14px;padding:14px 16px}
.safety p{font-size:.94rem;font-weight:600;line-height:1.5;color:var(--ink2)}
.safety b{color:var(--ink)}

/* ---------- Plus ---------- */
.s-plus{background:linear-gradient(180deg,#FCEFD8 0%,var(--bg) 45%)}
.p-ill{display:block;width:calc(100% + 44px);height:auto;margin:0 -22px}
.p-title{font-size:2rem;font-weight:600;line-height:1.1;text-align:center}
.p-sub{text-align:center;color:var(--ink2);font-weight:600;font-size:.97rem;margin-top:8px;line-height:1.45}
.feat{margin-top:16px;display:flex;flex-direction:column;gap:10px;padding:0 4px}
.feat div{display:flex;gap:12px;align-items:center;font-weight:700;font-size:.97rem;line-height:1.3}
.feat i{width:26px;height:26px;border-radius:9px;background:var(--teal-l);color:var(--teal);display:grid;place-items:center;flex:none}
.plans{display:flex;flex-direction:column;gap:10px;margin-top:18px}
.plan{min-height:64px;border-radius:20px;background:#fff;border:1.5px solid var(--line2);display:flex;align-items:center;padding:8px 18px;gap:14px;width:100%}
.plan.sel{border:2px solid var(--teal);background:#F2F9F7}
.radio{width:22px;height:22px;border-radius:50%;border:2px solid rgba(31,59,58,.3);flex:none}
.plan.sel .radio{border:7px solid var(--teal)}
.plan .n{font-weight:800;font-size:1.03rem}
.plan .d{font-size:.8125rem;color:var(--ink2);font-weight:700}
.plan .pr{margin-left:auto;text-align:right;font-weight:800;font-size:1.06rem;white-space:nowrap}
.plan .pr small{display:block;font-size:.75rem;color:var(--ink3);font-weight:700}
.badge{font-size:.6875rem;font-weight:900;background:var(--coral-l);color:#A8361F;padding:3px 8px;border-radius:8px;margin-left:6px;vertical-align:2px}
.fine{text-align:center;font-size:.78rem;color:var(--ink3);font-weight:600;line-height:1.5;margin-top:10px}

/* ---------- Onboarding ---------- */
.s-onb{background:var(--bg)}
.onb-scene{height:320px}
.onb-spacer{height:226px;flex:none}
.s-onb.o2,.s-onb.o3{background:linear-gradient(180deg,#F4EADB 0%,var(--bg) 40%)}
.onb-art2-wrap{margin:4px -6px 0;display:grid;place-items:center}
.steps-art{width:100%;max-width:340px;height:auto}
.onb-title{font-size:2.125rem;font-weight:600;line-height:1.1;margin-top:8px;position:relative}
.onb-steps{margin-top:14px;display:flex;flex-direction:column;gap:10px}
.onb-steps div{display:flex;gap:12px;align-items:flex-start;font-weight:600;line-height:1.45;font-size:.97rem;color:var(--ink2)}
.onb-steps b{color:var(--ink);font-weight:800}
.onb-steps i{width:28px;height:28px;border-radius:10px;background:var(--teal);color:#fff;display:grid;place-items:center;font-style:normal;font-weight:900;font-size:.875rem;flex:none}
.onb-promise{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.onb-promise span{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 12px;font-size:.84rem;font-weight:700;color:var(--ink2)}
.onb-promise svg{color:var(--teal)}
.check{display:flex;gap:12px;align-items:center;margin-top:14px;font-weight:800;font-size:.97rem;padding:12px 14px;border-radius:16px;background:#fff;border:1.5px solid var(--line2);width:100%;text-align:left}
.check .box{width:26px;height:26px;border-radius:8px;border:2px solid rgba(31,59,58,.35);display:grid;place-items:center;flex:none}
.check[aria-checked="true"] .box{background:var(--teal);border-color:var(--teal)}
.check[aria-checked="true"] .box::after{content:"";width:12px;height:7px;border:solid #fff;border-width:0 0 3px 3px;transform:rotate(-45deg) translate(1px,-1px)}
.onb-dots{display:flex;gap:6px;justify-content:center;margin:4px 0 8px}
.onb-dots i{width:8px;height:8px;border-radius:4px;background:rgba(31,59,58,.2)}
.onb-dots i.on{width:24px;background:var(--teal)}
.s-onb .bottom{position:sticky;bottom:0;z-index:2;margin:auto -22px -24px;padding:18px 22px max(20px,env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(251,245,236,0),var(--bg) 30%)}

/* ---------- Sheet, Toast ---------- */
.backdrop{position:fixed;inset:0;background:rgba(20,36,35,.45);z-index:40;animation:fade .2s both}
@keyframes fade{from{opacity:0}}
.sheet{position:fixed;left:50%;bottom:0;transform:translateX(-50%);width:100%;max-width:480px;max-height:90dvh;overflow:auto;background:var(--bg);border-radius:28px 28px 0 0;padding:10px 20px calc(20px + var(--safe-b));z-index:41;animation:up .28s cubic-bezier(.2,.9,.3,1) both;box-shadow:0 -10px 40px -10px rgba(20,36,35,.35)}
@keyframes up{from{transform:translate(-50%,100%)}}
.sheet .grab{width:44px;height:5px;border-radius:3px;background:rgba(31,59,58,.2);margin:0 auto 12px}
.sheet h2{font-family:"Fraunces";font-size:1.5rem;font-weight:600;line-height:1.15}
.sheet .lead{margin-top:6px}
.toast{position:fixed;left:50%;bottom:calc(var(--safe-b) + 136px);transform:translateX(-50%);background:var(--ink);color:#fff;padding:12px 18px;border-radius:16px;font-weight:800;font-size:.94rem;z-index:60;max-width:calc(100% - 40px);width:max-content;text-align:center;animation:toast 2.6s both;box-shadow:0 10px 30px -10px rgba(0,0,0,.4)}
@keyframes toast{0%{opacity:0;transform:translate(-50%,8px)}10%,85%{opacity:1;transform:translate(-50%,0)}100%{opacity:0}}

/* ---------- Weniger Bewegung ---------- */
html.rm *,html.rm *::before,html.rm *::after{animation:none!important;transition:none!important}
@media (prefers-reduced-motion:reduce){html:not(.rm-off) *,html:not(.rm-off) *::before,html:not(.rm-off) *::after{animation:none!important;transition:none!important}}
html.rm .steam{opacity:.7}
/* ---------- Hoher Kontrast ---------- */
html.hc{--ink2:#1F3B3A;--ink3:#2E4644;--line:rgba(31,59,58,.45);--line2:rgba(31,59,58,.7)}
html.hc .card,html.hc .choice,html.hc .chip,html.hc .hbtn,html.hc .plan,html.hc .helprow,html.hc .part,html.hc .agechip,html.hc .stat{border:2px solid #1F3B3A}
html.hc .tab{color:#1F3B3A}
html.hc :focus-visible{outline:4px solid #000}
html.hc ::placeholder{color:#4A5A57}
.fs-2 .heatrow span{font-size:.62rem}
.fs-2 .agechips{grid-template-columns:repeat(2,1fr)}
.fs-2 .toolgrid{grid-template-columns:1fr}