@font-face{font-family:"Fraunces";src:url(fonts/fraunces.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Manrope";src:url(fonts/manrope.woff2) format("woff2");font-weight:200 800;font-display:swap}

:root{
  --paper:#f5f1ea;--card:#fff;--ink:#1b2420;--ink-2:#56605b;--ink-3:#666e69;--line:#e8e1d6;
  --forest:#1f3b34;--forest-2:#2d5248;--on-forest:#fff;--clay:#a64b32;--clay-soft:#f4e4db;
  --sand:#efe6d8;--sage:#e1e8de;--honey:#e2ad4f;--danger:#b8432f;--danger-soft:#f7e2dc;
  --fur:#d9a25b;--fur-dark:#a86d31;--light:#f6e6cc;--spot:#c48846;--tongue:#e07480;--collar:#a64b32;
  --shadow:0 1px 2px rgba(27,36,32,.05),0 14px 34px -18px rgba(27,36,32,.22);
  --r:22px;--head:"Fraunces",Georgia,serif;--body:"Manrope",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --glass:rgba(255,255,255,.84);
}
html[data-fur=creme]{--fur:#efe0c8;--fur-dark:#cbae86;--light:#fffaf1;--spot:#d9c09c}
html[data-fur=braun]{--fur:#96593a;--fur-dark:#663923;--light:#e8c9a6;--spot:#784428}
html[data-fur=schwarz]{--fur:#3b3430;--fur-dark:#211b18;--light:#cbbdac;--spot:#86684b}
html[data-fur=grau]{--fur:#a8a19a;--fur-dark:#6f6862;--light:#ebe6df;--spot:#8a837b}
@media (prefers-color-scheme:dark){:root{
  --paper:#101412;--card:#181e1b;--ink:#eef0ec;--ink-2:#b4bcb7;--ink-3:#7f8883;--line:#27302c;
  --forest:#3d6b5f;--forest-2:#4a7b6e;--on-forest:#fff;--clay:#e38060;--clay-soft:#3a241c;
  --sand:#241f1a;--sage:#1d2823;--danger:#ec7a62;--danger-soft:#35201b;--collar:#e38060;
  --shadow:none;--glass:rgba(24,30,27,.86);
}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:500 16.5px/1.6 var(--body);padding-bottom:96px;-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision}
a{color:var(--forest)}
@media (prefers-color-scheme:dark){a{color:#9fd0c2}}
h1,h2,h3{font-family:var(--head);font-variation-settings:"SOFT" 50,"WONK" 0,"opsz" 72;font-weight:520;line-height:1.1;margin:0 0 .55rem;letter-spacing:-.015em}
h1{font-size:2.05rem}h2{font-size:1.6rem}h3{font-size:1.15rem;font-weight:560;letter-spacing:-.005em}
p{margin:0 0 .85rem}
img{max-width:100%;display:block}
/* Kopf */
.top{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 16px;max-width:1080px;margin:0 auto}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink)}
.brand svg{width:36px;height:36px;flex:none}
.brand b{font-family:var(--head);font-variation-settings:"SOFT" 50,"opsz" 72;font-size:1.35rem;font-weight:560;letter-spacing:-.02em;line-height:1}
.brand small{display:none}
.l-bg{fill:var(--forest)}.l-door{fill:none;stroke:var(--sand);stroke-width:2.2;stroke-linecap:round}.l-ear{fill:var(--fur-dark)}.l-head{fill:var(--fur)}.l-nose{fill:#1b2420}.l-ground{stroke:var(--sand);stroke-width:2.2;stroke-linecap:round}
.avatar{width:42px;height:42px;border-radius:50%;background:var(--card);display:grid;place-items:center;box-shadow:var(--shadow);border:1px solid var(--line)}
.avatar{overflow:hidden}.avatar .face{width:34px;height:34px}.avatar img{width:100%;height:100%;object-fit:cover}
main{max-width:760px;margin:0 auto;padding:4px 16px 28px;outline:none}
body.landing main{max-width:1080px}
/* Grundelemente */
.card{background:var(--card);border-radius:var(--r);padding:1.3rem;margin:0 0 1rem;box-shadow:var(--shadow);border:1px solid transparent;position:relative}
@media (prefers-color-scheme:dark){.card{border-color:var(--line)}}
.kicker{display:flex;align-items:center;gap:.45rem;font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--clay);margin-bottom:.5rem}
.kicker svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.muted{color:var(--ink-2)}.small{font-size:.9rem}.tiny{font-size:.8rem;color:var(--ink-3)}
.row{display:flex;gap:.7rem;flex-wrap:wrap;align-items:center}.between{justify-content:space-between}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:0;border-radius:999px;padding:.85rem 1.4rem;min-height:52px;font:700 1rem var(--body);cursor:pointer;text-decoration:none;background:var(--forest);color:var(--on-forest);transition:transform .12s ease,background .2s;letter-spacing:.005em}
.btn:hover{background:var(--forest-2)}.btn:active{transform:scale(.98)}
.btn.light{background:#fff;color:#1b2420}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn.ghost:hover{box-shadow:inset 0 0 0 1.5px var(--ink-3)}
.btn.done{background:var(--sage);color:var(--forest)}
@media (prefers-color-scheme:dark){.btn.done{color:#9fd0c2}}
.btn.small{min-height:40px;padding:.5rem 1rem;font-size:.9rem}
.btn.danger{background:transparent;color:var(--danger);box-shadow:inset 0 0 0 1.5px var(--danger)}
.btn.block{width:100%}
.btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.btn svg.paw{fill:currentColor;stroke:none}
.ico{display:inline-grid;place-items:center;flex:none}
.ico svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pill{display:inline-flex;align-items:center;gap:.3rem;font-size:.74rem;font-weight:700;padding:.22rem .6rem;border-radius:99px;background:var(--sand);color:var(--ink-2)}
.pill.draft{background:var(--clay-soft);color:var(--clay)}
label{display:block;font-weight:700;font-size:.92rem;margin:1rem 0 .4rem}
input,select,textarea{width:100%;font:500 1rem var(--body);color:var(--ink);background:var(--paper);border:1.5px solid var(--line);border-radius:14px;padding:.75rem .9rem;min-height:50px}
textarea{min-height:100px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--forest);box-shadow:0 0 0 4px color-mix(in srgb,var(--forest) 15%,transparent)}
button:focus-visible,a:focus-visible{outline:3px solid var(--honey);outline-offset:2px}
.hint{font-size:.85rem;color:var(--ink-3);margin-top:.4rem}
/* ===== Startseite ===== */
.lhero{position:relative;margin:-4px -16px 0;min-height:80vh;display:flex;align-items:flex-end;overflow:hidden;border-radius:0 0 28px 28px;color:#fff;background:#2a2620}
.lhero picture,.lhero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lhero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,18,15,0) 28%,rgba(12,18,15,.5) 58%,rgba(12,18,15,.9) 100%)}
@media(min-width:820px){.lhero::after{background:linear-gradient(90deg,rgba(12,18,15,.82) 0%,rgba(12,18,15,.55) 38%,rgba(12,18,15,0) 68%),linear-gradient(180deg,rgba(12,18,15,0) 55%,rgba(12,18,15,.35) 100%)}.lhero{align-items:center}}
.lhero .in{position:relative;z-index:1;padding:1.6rem 20px 1.8rem;max-width:640px}
.lhero .kicker{color:#f1c9b6}
.lhero h1{font-size:2.55rem;line-height:1.03;font-weight:480;color:#fff;margin-bottom:.8rem}
.lhero p{color:rgba(255,255,255,.88);font-size:1.05rem}
.lhero .tiny{color:rgba(255,255,255,.72);margin-top:.8rem}
@media(min-width:820px){.lhero{margin:8px 0 0;border-radius:28px;min-height:580px}.lhero h1{font-size:3.5rem}.lhero .in{padding:2.8rem}}
.facts{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.2rem 0 0}
.facts span{display:inline-flex;align-items:center;gap:.4rem;font-size:.84rem;font-weight:700;background:var(--card);padding:.45rem .8rem;border-radius:99px;box-shadow:var(--shadow)}
.facts svg{width:16px;height:16px;fill:none;stroke:var(--forest);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
@media (prefers-color-scheme:dark){.facts svg{stroke:#9fd0c2}}
.sec{margin:3.2rem 0}
.sec h2{font-size:1.95rem;max-width:20ch}
.sec .lead{color:var(--ink-2);max-width:52ch;font-size:1.05rem}
.split{display:grid;gap:1.8rem;align-items:center}
@media(min-width:820px){.split{grid-template-columns:1fr 1fr;gap:3rem}.split.start{align-items:start}.split.cards{align-items:stretch;gap:1.2rem}.split.cards .card{margin:0}}
/* Handy-Mockup */
.phone{width:272px;margin:0 auto;border-radius:46px;background:#0f1412;padding:10px;box-shadow:0 34px 70px -34px rgba(27,36,32,.6),0 0 0 1px rgba(0,0,0,.25)}
.phone .screen{border-radius:37px;overflow:hidden;background:#f5f1ea;color:#1b2420;height:576px;position:relative;font-size:12px;line-height:1.45}
.phone .notch{position:absolute;top:9px;left:50%;transform:translateX(-50%);width:86px;height:25px;border-radius:99px;background:#0f1412;z-index:3}
.phone .shot{position:relative;height:215px;color:#fff}
.phone .shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.phone .shot::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,18,15,.1),rgba(12,18,15,.78))}
.phone .shot div{position:absolute;left:14px;right:14px;bottom:12px;z-index:1}
.phone .shot em{font-style:normal;font-size:9px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#f1c9b6}
.phone .shot b{font-family:var(--head);font-size:32px;font-weight:480;display:block;line-height:1.05}
.phone .wk{display:flex;gap:4px;padding:8px 10px 0}
.phone .wk span{flex:1;text-align:center;font-weight:700;color:#657069;padding:4px 0;border-radius:8px;font-size:10px}
.phone .wk span.now{background:#efe6d8;color:#1b2420}
.phone .body{padding:10px 12px}
.phone .mcard{background:#fff;border-radius:14px;padding:12px;box-shadow:0 1px 2px rgba(27,36,32,.05),0 10px 24px -16px rgba(27,36,32,.3)}
.phone .mcard em{font-style:normal;font-size:8.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#a64b32}
.phone .mcard h4{font-family:var(--head);font-weight:520;font-size:17px;margin:3px 0 6px;line-height:1.15}
.phone .mstep{display:flex;gap:8px;margin:7px 0;color:#56605b}
.phone .mstep i{flex:none;width:18px;height:18px;border-radius:50%;background:#efe6d8;color:#1b2420;font-style:normal;font-weight:800;font-size:10px;display:grid;place-items:center}
.phone .mnote{display:flex;align-items:center;gap:8px;margin-top:8px;background:#fff;border-radius:14px;padding:8px 10px;color:#56605b;box-shadow:0 1px 2px rgba(27,36,32,.05)}
.phone .mnote b{display:block;color:#1b2420;font-size:11px}
.phone .mface .face{width:28px;height:28px;display:block}
.phone .mtabs{position:absolute;left:10px;right:10px;bottom:10px;display:flex;justify-content:space-between;background:rgba(255,255,255,.9);border-radius:22px;padding:9px 10px 10px;font-size:8.5px;font-weight:700;color:#657069;box-shadow:0 6px 18px -10px rgba(27,36,32,.4)}
.phone .mtabs .on{color:#1f3b34}
.phone .mbtn{margin-top:10px;background:#1f3b34;color:#fff;border-radius:99px;text-align:center;padding:9px;font-weight:700}
/* Etappen-Karussell */
.carousel{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin:1.3rem -16px 0;padding:0 16px 12px;scrollbar-width:none}
.carousel::-webkit-scrollbar{display:none}
.pcard{flex:0 0 80%;scroll-snap-align:start;background:var(--card);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow)}
@media(min-width:820px){.carousel{margin:1.3rem 0 0;padding:0 0 12px}.pcard{flex:1}}
.pcard img{aspect-ratio:3/2;object-fit:cover;width:100%}
.pcard div{padding:1rem 1.15rem 1.25rem}
.pcard .tiny{font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--clay)}
.pcard h3{font-size:1.35rem;margin:.2rem 0 .4rem}
.pcard p{color:var(--ink-2);font-size:.93rem;margin:0}
/* Werkzeug-Liste */
.tools{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin-top:1.3rem}
@media(min-width:820px){.tools{grid-template-columns:repeat(4,1fr)}}
.tool-i{background:var(--card);border-radius:18px;padding:1.05rem;box-shadow:var(--shadow)}
.tool-i .ico{width:42px;height:42px;border-radius:12px;background:var(--sage);color:var(--forest);margin-bottom:.75rem}
@media (prefers-color-scheme:dark){.tool-i .ico{color:#9fd0c2}}
.tool-i b{display:block;margin-bottom:.25rem}
.tool-i p{font-size:.87rem;color:var(--ink-2);margin:0;line-height:1.5}
/* dunkle Fläche */
.panel{border-radius:26px;overflow:hidden;background:var(--forest);color:#fff;box-shadow:var(--shadow)}
@media (prefers-color-scheme:dark){.panel{background:#1d3530}}
.panel img{aspect-ratio:16/10;object-fit:cover;width:100%}
.panel .in{padding:1.5rem 1.4rem 1.7rem}
.panel h2{color:#fff}.panel p{color:rgba(255,255,255,.85)}
.panel .kicker{color:#f1c9b6}
@media(min-width:820px){.panel{display:grid;grid-template-columns:1.1fr 1fr}.panel img{height:100%;aspect-ratio:auto}.panel .in{padding:2.6rem;align-self:center}}
.banner{border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);margin-top:1.3rem}
.banner img{width:100%;aspect-ratio:2.4/1;object-fit:cover}
@media(min-width:820px){.banner img{aspect-ratio:3.6/1}}
/* Preis */
.price{background:var(--card);border-radius:26px;padding:1.7rem 1.5rem;box-shadow:var(--shadow);max-width:470px;width:100%;justify-self:end}
.price .amount{font-family:var(--head);font-size:3.6rem;font-weight:460;line-height:1;letter-spacing:-.03em;margin:.4rem 0 .2rem}
.price .amount span{font-family:var(--body);font-size:1rem;color:var(--ink-2);font-weight:600;letter-spacing:0}
.checks{list-style:none;padding:0;margin:1.1rem 0 1.4rem}
.checks li{display:flex;gap:.65rem;align-items:flex-start;margin:.6rem 0}
.checks svg{flex:none;width:20px;height:20px;margin-top:.15rem;fill:none;stroke:var(--forest);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
@media (prefers-color-scheme:dark){.checks svg{stroke:#9fd0c2}}
/* FAQ */
.faq{margin-top:1rem}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:1rem;padding:1.05rem 0;font-weight:700;font-size:1.02rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.4rem;line-height:1;color:var(--ink-3);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--ink-2);padding-bottom:.6rem}
.not{display:flex;gap:.8rem;align-items:flex-start;background:var(--sand);border-radius:18px;padding:1.05rem 1.15rem;margin-top:1rem}
.not svg{flex:none;width:22px;height:22px;fill:none;stroke:var(--ink-2);stroke-width:1.8;margin-top:.1rem}
.not p{margin:0;color:var(--ink-2);font-size:.94rem}
.endcta{text-align:center;padding:2.4rem 1.2rem}
.endcta h2{margin:0 auto .6rem}
/* ===== App: Heute ===== */
.daycard{padding:0;overflow:hidden}
.dayhero{position:relative;min-height:260px;color:#fff;display:flex;align-items:flex-end;background:#2a2620}
.dayhero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dayhero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,18,15,.02) 25%,rgba(12,18,15,.8))}
.dayhero .in{position:relative;z-index:1;padding:1.1rem 1.25rem 1.05rem;width:100%}
.dayhero .kicker{color:#f1c9b6;margin-bottom:.15rem}
.dayhero .big{font-family:var(--head);font-weight:460;font-size:3.3rem;line-height:1;letter-spacing:-.03em}
.dayhero .big small{font-family:var(--body);font-size:1rem;font-weight:600;opacity:.8;letter-spacing:0;margin-left:.35rem}
.dayhero .sub{opacity:.9;font-size:.95rem;margin:.3rem 0 0}
.bar{height:4px;background:rgba(255,255,255,.28);border-radius:99px;margin-top:.85rem;overflow:hidden}.bar span{display:block;height:100%;background:#fff;border-radius:99px}
.week{display:flex;gap:.25rem;padding:.8rem .8rem .1rem}
.week a{flex:1;display:flex;flex-direction:column;align-items:center;gap:.3rem;text-decoration:none;color:var(--ink-3);font-size:.8rem;font-weight:700;padding:.5rem 0;border-radius:12px}
.week a i{width:6px;height:6px;border-radius:50%;background:var(--line)}
.week a.done i{background:var(--forest)}
.week a.now{background:var(--sand);color:var(--ink)}
.week a.now i{background:var(--clay)}
.task{padding:1rem 1.25rem 1.3rem}
.task h1{font-size:1.8rem}
.task .why{color:var(--ink-2)}
ol.steps{list-style:none;counter-reset:s;padding:0;margin:.8rem 0 1rem}
ol.steps li{counter-increment:s;display:grid;grid-template-columns:30px 1fr;gap:.75rem;margin:.75rem 0;align-items:start}
ol.steps li::before{content:counter(s);width:28px;height:28px;border-radius:50%;background:var(--sand);color:var(--ink);font-weight:800;display:grid;place-items:center;font-size:.84rem}
.task h3{margin-top:1.1rem}
.note{display:flex;gap:.7rem;align-items:flex-start;background:var(--sage);padding:.85rem 1rem;border-radius:16px;margin:.9rem 0;font-size:.93rem;color:var(--ink)}
.note .ico svg{width:20px;height:20px}
.note.warm{background:var(--sand);color:var(--ink-2)}
.nav-days{display:flex;justify-content:space-between;padding:0 1.25rem 1.2rem;font-weight:700;font-size:.9rem}
.nav-days a{text-decoration:none;color:var(--ink-2)}
.quick{display:grid;grid-template-columns:repeat(4,1fr);gap:.55rem;margin:0 0 1rem}
.qt{display:flex;flex-direction:column;align-items:center;gap:.45rem;text-decoration:none;color:var(--ink);font-size:.76rem;font-weight:700;text-align:center;background:var(--card);border-radius:18px;padding:.9rem .25rem .8rem;box-shadow:var(--shadow)}
.qt .ico{width:42px;height:42px;border-radius:13px;background:var(--sage);color:var(--forest)}
@media (prefers-color-scheme:dark){.qt .ico{color:#9fd0c2}}
.qt.red .ico{background:var(--danger-soft);color:var(--danger)}
.stamps{display:grid;grid-template-columns:repeat(7,1fr);gap:.5rem;margin-top:.5rem}
.stamp{aspect-ratio:1;border-radius:50%;border:1.5px solid var(--line);display:grid;place-items:center;font-size:.76rem;font-weight:800;color:var(--ink-3)}
.stamp.on{background:var(--forest);border-color:var(--forest);color:#fff}
.stamp.cur{border-color:var(--clay);color:var(--clay)}
.stamp.on.cur{color:#fff}
/* Übungsmodus */
.exer{min-height:66vh;display:flex;flex-direction:column}
.progress{height:4px;background:var(--line);border-radius:99px;overflow:hidden;margin:.9rem 0 1.4rem}
.progress span{display:block;height:100%;background:var(--forest);border-radius:99px;transition:width .3s}
.progress .grow{width:0;animation:grow 1.3s ease forwards}@keyframes grow{to{width:100%}}
.stepnum{font-family:var(--head);font-size:4.2rem;font-weight:380;line-height:1;color:var(--clay);margin:.2rem 0 .6rem}
.steptext{font-family:var(--head);font-size:1.65rem;line-height:1.25;font-weight:430;flex:1}
.timerbox{background:var(--paper);border-radius:18px;padding:.8rem 1rem;display:flex;align-items:center;justify-content:space-between;gap:.8rem;flex-wrap:wrap;margin-top:1rem}
.tdigits{font-family:var(--head);font-size:2.4rem;font-weight:420;font-variant-numeric:tabular-nums}
.making{text-align:center;padding:3rem 1.25rem}.making .face{width:96px;height:96px}
body.focus .tabs{display:none}body.focus{padding-bottom:24px}
/* Onboarding */
.ob{padding:1.5rem 1.3rem}
.ob h1{font-size:2.05rem;margin-top:1rem}
.ob-body{margin:1.3rem 0 1.5rem}
.ob-body input,.ob-body select{font-size:1.15rem;min-height:58px}
.options{display:grid;gap:.5rem}
.options.grid2{grid-template-columns:1fr 1fr}
.opt{display:flex;align-items:center;justify-content:space-between;gap:.8rem;border:1.5px solid var(--line);background:var(--card);color:var(--ink);border-radius:16px;padding:.85rem 1rem;font:600 1rem var(--body);cursor:pointer;text-align:left;min-height:54px;width:100%}
.opt small{display:block;font-weight:500;color:var(--ink-3);font-size:.84rem}
.opt::after{content:"";flex:none;width:22px;height:22px;border-radius:50%;border:1.5px solid var(--line);box-sizing:border-box}
.opt.on{border-color:var(--forest);background:color-mix(in srgb,var(--forest) 6%,var(--card))}
.opt.on::after{border:7px solid var(--forest)}
.options.multi .opt::after{border-radius:7px}
.options.multi .opt.on::after{border:0;background:var(--forest) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center/14px no-repeat}
.chipbtn{display:inline-flex;align-items:center;gap:.35rem;border:1.5px solid var(--line);background:var(--card);color:var(--ink);border-radius:99px;padding:.4rem .85rem;font:700 .86rem var(--body);cursor:pointer;min-height:38px}
.chipbtn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}
.chipbtn.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.furs{display:flex;gap:.9rem;flex-wrap:wrap;justify-content:center}
.furs label{margin:0;font-weight:600;font-size:.82rem;display:flex;flex-direction:column;align-items:center;gap:.35rem;cursor:pointer;color:var(--ink-2)}
.furs input{position:absolute;opacity:0;width:1px;height:1px}
.furs .sw{width:44px;height:44px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.furs input:checked+.sw{box-shadow:0 0 0 3px var(--card),0 0 0 5px var(--forest)}
.ob-face{display:grid;place-items:center;margin:0 0 1.2rem}.ob-face .face{width:130px;height:130px}
.ob-dots{display:flex;gap:.3rem}.ob-dots span{flex:1;height:4px;border-radius:99px;background:var(--line)}.ob-dots span.done,.ob-dots span.now{background:var(--forest)}
.pay-steps{list-style:none;padding:0;margin:1rem 0 1.2rem}
.pay-steps li{display:grid;grid-template-columns:64px 1fr;gap:.8rem;padding:.6rem 0;border-top:1px solid var(--line)}
.pay-steps li:first-child{border-top:0}
.pay-steps b{font-weight:800}
.imgcard{padding:0;overflow:hidden}.imgcard img{width:100%;aspect-ratio:16/9;object-fit:cover}.imgcard .in{padding:1.2rem 1.3rem 1.3rem}
/* Werkzeuge */
.clickercard{text-align:center}
.clicker{width:184px;height:184px;border-radius:50%;border:0;margin:1.3rem auto;display:grid;place-items:center;background:radial-gradient(circle at 32% 28%,var(--forest-2),var(--forest) 70%);box-shadow:0 20px 40px -18px rgba(31,59,52,.75),inset 0 -6px 0 rgba(0,0,0,.18);color:#fff;font:800 1rem var(--body);letter-spacing:.14em;text-transform:uppercase;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:transform .06s}
.clicker.hit{transform:scale(.95)}
.flash{position:fixed;inset:0;background:#fff;z-index:50;pointer-events:none;animation:fl .18s ease-out forwards}@keyframes fl{from{opacity:1}to{opacity:0}}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin-bottom:1rem}.grid2>.card{margin:0;padding:1.1rem}
.grid2 .tdigits{font-size:2rem;margin:.2rem 0 .7rem}
.loglist{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin:.6rem 0 1rem}
.logbtn{min-width:0;display:flex;align-items:center;gap:.55rem;border:1.5px solid var(--line);background:var(--card);color:var(--ink);border-radius:14px;padding:.6rem .7rem;font:700 .84rem var(--body);line-height:1.2;cursor:pointer;text-align:left;min-height:52px}
.logbtn:active{transform:scale(.97)}
.logbtn .ico svg{width:20px;height:20px}
.lk-pipi{--c:#c9982f}.lk-haufen{--c:#8c5a3c}.lk-drin{--c:var(--clay)}.lk-schreck{--c:#4d8499}.lk-gassi{--c:#4f7d62}.lk-allein{--c:#6b78a8}
.logbtn .ico{color:var(--c)}
.weekgrid{display:grid;gap:.3rem}
.wg-row{display:grid;grid-template-columns:30px repeat(7,1fr);gap:.3rem;align-items:center}
.wg-row.head span{font-size:.7rem;font-weight:800;color:var(--ink-3);text-align:center}
.wg-row .ico{width:28px;height:28px;color:var(--c,var(--ink-3))}.wg-row .ico svg{width:18px;height:18px}
.cell{height:28px;border-radius:8px;background:var(--paper);display:grid;place-items:center;font-size:.78rem;font-weight:800}
.cell.has{background:var(--c);color:#fff}
.alarm-link{display:flex;align-items:center;gap:.9rem;background:var(--danger);color:#fff;text-decoration:none;border-radius:var(--r);padding:1.1rem 1.2rem;box-shadow:var(--shadow)}
.alarm-link .ico svg{width:28px;height:28px}
.alarm-link b{display:block}.alarm-link span{font-size:.88rem;opacity:.9}
/* Notfall */
.emergency{background:linear-gradient(180deg,var(--danger-soft),var(--card) 45%)}
.emergency .kicker{color:var(--danger)}
.emergency ol.steps li::before{background:var(--danger);color:#fff}
.steckbrief{display:grid;grid-template-columns:minmax(0,1fr);gap:1.1rem;align-items:start}
.sb-photo{width:100%;aspect-ratio:4/3;border-radius:18px;overflow:hidden;background:var(--sand);display:grid;place-items:center}
@media(min-width:600px){.steckbrief{grid-template-columns:200px minmax(0,1fr)}.sb-photo{aspect-ratio:1}}
.sb-photo img{width:100%;height:100%;object-fit:cover}.sb-photo .face{width:80px;height:80px}
.steckbrief dl{display:grid;grid-template-columns:auto 1fr;gap:.25rem .8rem;margin:.4rem 0 .6rem;font-size:.93rem}
.steckbrief dt{color:var(--ink-3);font-weight:700}.steckbrief dd{margin:0;font-weight:700;overflow-wrap:anywhere}
.thumb{width:56px;height:56px;border-radius:14px;object-fit:cover}
/* Tagebuch */
.moods{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.3rem}
.moods button{border:1.5px solid var(--line);background:var(--card);border-radius:16px;padding:.5rem 0 .55rem;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:.2rem;font:700 .62rem var(--body);letter-spacing:-.01em;color:var(--ink-3);min-height:48px}
.moods .face{width:38px;height:38px}
.moods button[aria-pressed=true]{border-color:var(--forest);color:var(--ink);background:color-mix(in srgb,var(--forest) 6%,var(--card))}
.chips{display:flex;flex-wrap:wrap;gap:.45rem}
.chips button{border:1.5px solid var(--line);background:var(--card);color:var(--ink);border-radius:99px;padding:.45rem .85rem;font:600 .9rem var(--body);cursor:pointer;min-height:40px}
.chips button[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.chart{width:100%;height:140px;display:block}
.chart .area{fill:var(--forest);opacity:.1}.chart .l{fill:none;stroke:var(--forest);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.chart .pt{fill:var(--forest)}
@media (prefers-color-scheme:dark){.chart .area{fill:#9fd0c2}.chart .l{stroke:#9fd0c2}.chart .pt{fill:#9fd0c2}}
.chart .g{stroke:var(--line);stroke-width:1}.chart text{fill:var(--ink-3);font:600 10px var(--body)}
.entry{display:grid;grid-template-columns:44px 1fr;gap:.8rem;border-top:1px solid var(--line);padding:.9rem 0}
.entry:first-of-type{border-top:0}
.entry .face{width:44px;height:44px}
/* Pflichten */
.tags{display:grid}
.tagrow{margin:0;font-weight:500;display:grid;grid-template-columns:28px 1fr;gap:.8rem;align-items:start;padding:.95rem 0;border-top:1px solid var(--line);cursor:pointer}
.tags .tagrow:first-child{border-top:0}
.tagrow input{position:absolute;opacity:0;width:1px;height:1px}
.tagrow .mark{width:26px;height:26px;border-radius:50%;border:1.5px solid var(--ink-3);display:grid;place-items:center;margin-top:.1rem;transition:background .15s}
.tagrow .mark svg{width:14px;height:14px;fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.tagrow input:checked~.mark{background:var(--forest);border-color:var(--forest)}
.tagrow input:checked~.mark svg{opacity:1}
.tagrow input:checked~.txt strong{color:var(--ink-3);text-decoration:line-through}
.tagrow input:focus-visible~.mark{outline:3px solid var(--honey);outline-offset:2px}
.tagrow .txt{font-size:.93rem;color:var(--ink-2)}
.tagrow .txt strong{display:block;font-size:1rem;color:var(--ink);font-weight:700;margin-bottom:.1rem}
.ref{display:inline-block;margin-top:.4rem;font-size:.74rem;font-weight:700;color:var(--ink-2);background:var(--sand);padding:.15rem .55rem;border-radius:99px}
.counter{font-family:var(--head);font-size:1.15rem}
/* Plan */
.timeline{width:100%;height:auto;display:block;margin:.6rem 0}
.timeline .seg.s1{fill:var(--honey)}.timeline .seg.s2{fill:var(--clay)}.timeline .seg.s3{fill:var(--forest)}
.timeline text{font:700 10px var(--body);fill:var(--ink-3)}
.timeline .mk{fill:var(--ink);stroke:var(--card);stroke-width:3}.timeline .mkt{fill:var(--card);font:800 9px var(--body)}
.phase-card{padding:0;overflow:hidden}
.phase-card>img{aspect-ratio:16/7;object-fit:cover;width:100%}
.phase-card .in{padding:1.1rem 1.25rem .6rem}
details.week-box{border-top:1px solid var(--line)}
details.week-box summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:.7rem;padding:.9rem 1.25rem;font-weight:700}
details.week-box summary::-webkit-details-marker{display:none}
details.week-box summary .mini{margin-left:auto;color:var(--ink-3);font-size:.82rem}
details.week-box summary::after{content:"+";font-size:1.3rem;color:var(--ink-3);transition:transform .2s}
details.week-box[open] summary::after{transform:rotate(45deg)}
details.week-box summary .wk{width:10px;height:10px;border-radius:50%;background:var(--line);flex:none}
details.week-box summary .wk.on{background:var(--forest)}
.day-list{padding:0 .7rem .7rem}
.day-list a{display:flex;align-items:center;gap:.8rem;padding:.6rem;text-decoration:none;color:var(--ink);border-radius:12px;font-size:.95rem}
.day-list a:hover{background:var(--paper)}
.day-list .n{color:var(--ink-3);font-variant-numeric:tabular-nums;min-width:3.4rem;font-weight:700;font-size:.85rem}
.day-list i{margin-left:auto;width:8px;height:8px;border-radius:50%;background:var(--line);flex:none}
.day-list a.done i{background:var(--forest)}
.day-list a.now{background:var(--sand)}
.day-list a.now i{background:var(--clay)}
/* Texte */
.prose h2{margin-top:1.4rem;font-size:1.3rem}.prose ul{padding-left:1.2rem}.prose li{margin:.35rem 0}
#footpaws{display:none}
/* Tab-Leiste */
.tabs{position:fixed;left:0;right:0;bottom:0;display:flex;justify-content:space-around;background:var(--glass);-webkit-backdrop-filter:saturate(1.6) blur(18px);backdrop-filter:saturate(1.6) blur(18px);border-top:1px solid var(--line);padding:.35rem .3rem calc(.4rem + env(safe-area-inset-bottom));z-index:10}
.tabs a{flex:1;max-width:120px;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:.68rem;font-weight:700;color:var(--ink-3);text-decoration:none;padding:.3rem 0;min-height:48px}
.tabs svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tabs a.on{color:var(--ink)}
.tabs a.on svg{stroke-width:2.1}
body.landing .tabs{display:none}body.landing{padding-bottom:0}
.toast{position:fixed;left:50%;bottom:100px;transform:translateX(-50%);background:var(--ink);color:var(--paper);padding:.7rem 1.1rem;border-radius:14px;font-size:.92rem;font-weight:700;z-index:20;white-space:nowrap;box-shadow:0 10px 30px -10px rgba(0,0,0,.4)}
.toast .paw{display:none}
/* Gesichter */
.a-fur{fill:var(--fur)}.a-light{fill:var(--light)}.a-ear{fill:var(--fur-dark)}.a-spot{fill:var(--spot)}
.a-ink{fill:#1b2420}.a-shine{fill:#fff}.a-white{fill:#fff;stroke:#1b2420;stroke-width:1}.a-tongue{fill:var(--tongue)}
.a-line{fill:none;stroke:#1b2420;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.a-line.thin{stroke-width:2.4}
.report h2{margin-top:1.3rem;font-size:1.25rem}
@media (prefers-reduced-motion:no-preference){main>*{animation:up .35s ease both}@keyframes up{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}}
@media print{.tabs,.top,.foot,.noprint,.toast{display:none!important}body{background:#fff!important;padding:0;color:#000}.card{box-shadow:none;border:0}main{max-width:none}}

.linkbtn{background:none;border:0;padding:.3rem 0;margin-top:.3rem;font:700 .8rem var(--body);color:var(--ink-3);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.linkbtn:hover{color:var(--danger)}
@media(max-width:819px){.facts{display:grid;grid-template-columns:1fr 1fr;gap:.45rem}.facts span{border-radius:14px;align-items:flex-start;padding:.62rem .7rem;line-height:1.3;font-size:.8rem}.facts svg{margin-top:.05rem}}

/* ===== Kopf-Navigation ===== */
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--paper);padding:.5rem .9rem;border-radius:0 0 10px 0;z-index:30}
.skip:focus{left:0}
.topnav{display:none}
@media(min-width:820px){.topnav{display:flex;gap:1.6rem;margin-left:auto;margin-right:1.2rem}.topnav a{color:var(--ink-2);text-decoration:none;font-weight:700;font-size:.93rem}.topnav a:hover,.topnav a.on{color:var(--ink)}}
/* ===== Fußbereich ===== */
.foot{max-width:1080px;margin:2rem auto 0;padding:2rem 16px 2.4rem;color:var(--ink-2);font-size:.9rem;border-top:1px solid var(--line)}
.foot-grid{display:grid;gap:1.6rem;grid-template-columns:1fr 1fr}
.foot-brand{grid-column:1/-1}
.foot-brand b{font-family:var(--head);font-size:1.3rem;color:var(--ink);font-weight:560}
.foot-brand p{margin:.4rem 0 0;max-width:46ch}
@media(min-width:820px){.foot-grid{grid-template-columns:1.6fr 1fr 1fr 1fr}.foot-brand{grid-column:auto}}
.foot nav{display:flex;flex-direction:column;gap:.45rem}
.foot h3{font-family:var(--body);font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin:0 0 .3rem}
.foot nav a{color:var(--ink);text-decoration:none}.foot nav a:hover{text-decoration:underline}
.foot-actions{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.8rem 0 1rem}
.foot-actions .btn{color:var(--ink)}
.foot-copy{margin:0}.foot-copy a{color:var(--ink-3)}
body.info .tabs{display:none}body.info{padding-bottom:0}
/* ===== Info- und Rechtsseiten ===== */
.pagehead h1{font-size:2.3rem}
.pagehead .lead{font-size:1.08rem;color:var(--ink-2);max-width:60ch}
.prose h2{scroll-margin-top:1rem}
.legal .stand{color:var(--ink-3);font-size:.85rem;margin-top:-.2rem}
.legal h2{font-size:1.22rem;margin-top:1.8rem;padding-top:1.1rem;border-top:1px solid var(--line)}
.legal ol{padding-left:1.3rem}.legal ol li,.legal ul li{margin:.45rem 0}
.legal ol ul{margin:.3rem 0}
.legal-note{margin:1rem 0}
mark.ph{background:#fde7a6;color:#5a4300;padding:0 .25rem;border-radius:4px}
@media (prefers-color-scheme:dark){mark.ph{background:#5a4a1a;color:#fde7a6}}
.toc{display:flex;flex-wrap:wrap;gap:.4rem;margin:1rem 0 .4rem}
.toc button{border:1.5px solid var(--line);background:var(--card);color:var(--ink);border-radius:99px;padding:.35rem .75rem;font:700 .8rem var(--body);cursor:pointer}
.toc button:hover{border-color:var(--ink-3)}
.boxed{border:1.5px solid var(--line);border-radius:18px;padding:.4rem 1.2rem 1rem;margin:1.4rem 0;background:var(--paper)}
.boxed h2{border-top:0;padding-top:0;margin-top:1rem}
ul.plain{list-style:none;padding:0}
.facts-dl{display:grid;grid-template-columns:minmax(0,13rem) minmax(0,1fr);gap:.5rem 1rem;margin:.8rem 0}
.facts-dl dt{font-weight:700;color:var(--ink-2)}.facts-dl dd{margin:0}
@media(max-width:560px){.facts-dl{grid-template-columns:1fr}.facts-dl dd{margin-bottom:.5rem}}
.tbl{width:100%;border-collapse:collapse;font-size:.92rem;margin:.6rem 0 1rem}
.tbl th,.tbl td{text-align:left;padding:.65rem .5rem;border-bottom:1px solid var(--line);vertical-align:top}
.tbl th{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
@media(max-width:560px){.tbl thead{display:none}.tbl tr{display:block;border-bottom:1px solid var(--line);padding:.5rem 0}.tbl td{display:block;border:0;padding:.15rem 0}.tbl td:first-child{font-weight:800}}
.lform fieldset{border:0;padding:0;margin:1rem 0 0}
.lform legend{font-weight:700;font-size:.92rem;margin-bottom:.4rem}
.lform label.radio{display:flex;align-items:center;gap:.6rem;font-weight:500;margin:.4rem 0}
.lform label.radio input{width:20px;height:20px;min-height:0;accent-color:var(--forest)}
.lform [aria-invalid=true]{border-color:var(--danger);box-shadow:0 0 0 3px color-mix(in srgb,var(--danger) 15%,transparent)}
.receipt{margin-top:1.4rem;border:1.5px solid var(--forest);border-radius:18px;padding:1.1rem 1.2rem;background:color-mix(in srgb,var(--forest) 5%,var(--card));outline:none}
.receipt dl{display:grid;grid-template-columns:auto 1fr;gap:.3rem .9rem;margin:.6rem 0}
.receipt dt{font-weight:700;color:var(--ink-2)}.receipt dd{margin:0;overflow-wrap:anywhere}
.featlist{display:grid;gap:.9rem;margin-bottom:1rem}
@media(min-width:820px){.featlist{grid-template-columns:1fr 1fr}}
.feat{display:grid;grid-template-columns:48px 1fr;gap:1rem;margin:0}
.feat .ico{width:48px;height:48px;border-radius:14px;background:var(--sage);color:var(--forest)}
@media (prefers-color-scheme:dark){.feat .ico{color:#9fd0c2}}
.feat h2{font-size:1.2rem;margin:.2rem 0 .35rem}.feat p{margin:0;color:var(--ink-2);font-size:.95rem}
ol.daylist{list-style:none;padding:0;margin:.8rem 0}
.daylist li{display:grid;grid-template-columns:5.2rem 1fr;gap:.8rem;padding:.7rem 0;border-top:1px solid var(--line)}
.daylist li:first-child{border-top:0}
.daylist .n,.weekblock .n{font-weight:800;font-size:.8rem;color:var(--clay);letter-spacing:.04em;padding-top:.15rem}
.daylist p{margin:.15rem 0 0;color:var(--ink-2);font-size:.93rem}
.weekblock{padding:.9rem 0;border-top:1px solid var(--line)}
.weekblock .wkhead{display:flex;gap:.8rem;align-items:baseline;flex-wrap:wrap}
.weekblock .wkhead strong{font-size:1.05rem}
.weekblock p{margin:.3rem 0 0}
ol.how{list-style:none;counter-reset:h;padding:0;margin:1.3rem 0 0;display:grid;gap:.8rem}
@media(min-width:820px){ol.how{grid-template-columns:repeat(3,1fr)}}
ol.how li{counter-increment:h;background:var(--card);border-radius:18px;padding:1.1rem 1.2rem;box-shadow:var(--shadow)}
ol.how li::before{content:counter(h,decimal-leading-zero);display:block;font-family:var(--head);font-size:2rem;color:var(--clay);line-height:1;margin-bottom:.5rem}
ol.how b{display:block;margin-bottom:.25rem}ol.how span{color:var(--ink-2);font-size:.93rem}
ul.ticks,ul.crosses{list-style:none;padding:0;margin:.4rem 0 0}
ul.ticks li,ul.crosses li{position:relative;padding-left:1.7rem;margin:.55rem 0;color:var(--ink-2)}
ul.ticks li::before{content:"";position:absolute;left:0;top:.35rem;width:16px;height:16px;background:no-repeat center/16px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f3b34' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E")}
ul.crosses li::before{content:"";position:absolute;left:0;top:.35rem;width:16px;height:16px;background:no-repeat center/14px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b8432f' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E")}
@media (prefers-color-scheme:dark){ul.ticks li::before{filter:invert(.8) sepia(.4) hue-rotate(110deg)}}
@media print{.foot,.topnav,.skip{display:none!important}.legal h2{break-after:avoid}}
.receipt h2{border-top:0;padding-top:0;margin-top:.2rem}
@media(max-width:560px){.receipt dl{grid-template-columns:1fr;gap:0}.receipt dt{margin-top:.5rem}}
/* ---------- Ausbau: Wissen, Länder, Ratgeber, Werkzeuge ---------- */
@media(min-width:820px){.foot-grid{grid-template-columns:1.5fr repeat(4,1fr)}}
.lgrid{display:grid;gap:.9rem;margin-bottom:1rem}
@media(min-width:620px){.lgrid{grid-template-columns:1fr 1fr}}
.lcard{display:block;text-decoration:none;color:var(--ink);margin:0;transition:transform .15s ease}
.lcard:hover{transform:translateY(-2px)}
.lcard h2{font-size:1.25rem;margin-bottom:.7rem}
.lfacts{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:.35rem .8rem;font-size:.84rem}
.lfacts li{display:flex;justify-content:space-between;gap:.5rem;border-bottom:1px dashed var(--line);padding:.18rem 0}
.lfacts span{color:var(--ink-2)}
.lfacts b,.fv{font-weight:800}
.lfacts .yes b,.fv.yes{color:var(--forest)}
.lfacts .no b,.fv.no{color:var(--ink-3)}
.lfacts .part b,.fv.part{color:var(--clay)}
@media (prefers-color-scheme:dark){.lfacts .yes b,.fv.yes{color:#9fd0c2}}
.lcard .more{display:inline-block;margin-top:.8rem;font-weight:800;font-size:.85rem;color:var(--forest)}
.lcard .more::after{content:" →"}
@media (prefers-color-scheme:dark){.lcard .more{color:#9fd0c2}}
ul.rules{padding-left:1.1rem}
ul.rules li{margin:.7rem 0}
ul.rules .ref{margin:.25rem 0 0 .2rem}
details.more{border-top:1px solid var(--line);margin-top:.9rem;padding-top:.6rem}
details.more summary{cursor:pointer;font-weight:800;font-size:.92rem;padding:.3rem 0;list-style:none}
details.more summary::-webkit-details-marker{display:none}
details.more summary::after{content:"+";float:right;font-weight:600;color:var(--ink-3)}
details.more[open] summary::after{content:"–"}
details.more ul.rules{font-size:.92rem}
.artgrid{display:grid;gap:1rem}
@media(min-width:620px){.artgrid{grid-template-columns:1fr 1fr}}
@media(min-width:980px){main .sec .artgrid,body.landing .artgrid{grid-template-columns:repeat(3,1fr)}}
.acard{display:flex;flex-direction:column;padding:0;overflow:hidden;text-decoration:none;color:var(--ink);margin:0;transition:transform .15s ease}
.acard:hover{transform:translateY(-2px)}
.acard img{width:100%;aspect-ratio:16/9;object-fit:cover}
.acard>div{padding:1rem 1.1rem 1.2rem}
.acard .tiny{font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--clay);font-size:.7rem}
.acard h3{margin:.35rem 0 .4rem;font-size:1.15rem}
.acard p{font-size:.9rem;color:var(--ink-2);margin:0}
.artcard .meta{font-size:.84rem;color:var(--ink-3);margin:.2rem 0 0;line-height:1.8}
.srcs{font-size:.9rem}.srcs li{margin:.35rem 0}
a.tool-i{text-decoration:none;color:var(--ink);display:block}
a.tool-i:hover{box-shadow:inset 0 0 0 1.5px var(--line),var(--shadow)}
.glossar dl{margin:0}
.glossar dt{font-weight:800;margin-top:1rem;scroll-margin-top:1rem}
.glossar dd{margin:.2rem 0 0;color:var(--ink-2)}
.cl h2{font-size:1.3rem;margin:0}
.cl-list{list-style:none;padding:0;margin:.8rem 0 0}
.cl-list li{border-top:1px solid var(--line)}
.cl-list label{display:flex;gap:.75rem;align-items:flex-start;font-weight:500;font-size:.95rem;margin:0;padding:.7rem 0;cursor:pointer}
.cl-list input{position:absolute;opacity:0;width:1px;height:1px}
.cl-list .box{flex:none;width:22px;height:22px;border:2px solid var(--ink-3);border-radius:6px;margin-top:.1rem;display:grid;place-items:center}
.cl-list input:checked+.box{background:var(--forest);border-color:var(--forest)}
.cl-list input:checked+.box::after{content:"";width:6px;height:11px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg) translate(-1px,-1px)}
.cl-list input:focus-visible+.box{outline:3px solid var(--honey);outline-offset:2px}
.calc fieldset{border:0;padding:0;margin:0 0 .6rem}
.calc legend{font-weight:800;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:var(--clay);margin-top:.8rem}
.calc label{margin:.7rem 0 .3rem}
.eur{position:relative}.eur input{padding-right:2.2rem}.eur span{position:absolute;right:.9rem;top:50%;transform:translateY(-50%);color:var(--ink-3);font-weight:700}
@media(min-width:620px){.calc{display:grid;grid-template-columns:1fr 1fr;gap:0 1.4rem}}
.calc-out{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin:1rem 0 0}
.calc-out div{background:var(--paper);border-radius:14px;padding:.7rem .9rem}
.calc-out dt{font-size:.78rem;font-weight:700;color:var(--ink-2)}
.calc-out dd{margin:0;font:600 1.35rem/1.2 var(--head)}
.calc-out .sum{background:var(--forest);color:#fff}.calc-out .sum dt{color:#dfe9e4}
.changelog{list-style:none;padding:0;margin:0}
.changelog>li{border-left:2px solid var(--line);padding:0 0 1.2rem 1.1rem;margin:0;position:relative}
.changelog>li::before{content:"";position:absolute;left:-7px;top:.35rem;width:12px;height:12px;border-radius:50%;background:var(--clay)}
.changelog .cl-head{display:flex;gap:.6rem;align-items:center}
.changelog ul{margin:.4rem 0 0}
.quote{border-left:3px solid var(--clay);padding:.2rem 0 .2rem 1rem;color:var(--ink)}
.presslogo svg{width:72px;height:72px;display:block}
/* Suchplakat */
.posterwrap{display:grid;gap:1rem}
@media(min-width:900px){main:has(.posterwrap){max-width:1080px}.posterwrap{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}.posterwrap>.card{margin:0}.poster{position:sticky;top:1rem}}
.poster{background:#fff;color:#111;border-radius:14px;padding:1.4rem 1.4rem 0;box-shadow:var(--shadow);border:1px solid #e6e1d8;text-align:center;overflow:hidden;font-family:var(--body)}
.p-head{font:700 3.1rem/1 var(--head);letter-spacing:.02em;text-transform:uppercase;color:#b8432f;margin-bottom:.9rem}
.p-photo{aspect-ratio:4/3;border-radius:10px;overflow:hidden;background:#f1ece4;display:grid;place-items:center}
.p-photo img{width:100%;height:100%;object-fit:cover}
.p-photo .face{width:40%}
.p-name{font:600 2.4rem/1.1 var(--head);margin:.8rem 0 .2rem}
.p-when{font-weight:700;margin:0 0 .5rem}
.p-look{margin:0 0 .6rem;color:#333}
.p-shy{background:#fbe9e4;color:#6d2416;border-radius:10px;padding:.6rem .8rem;font-weight:700;font-size:.95rem;margin:.6rem 0}
.p-contact{margin:.8rem 0 .3rem}.p-contact span{display:block;font-weight:700;color:#444}
.p-contact b{display:block;font:700 2.1rem/1.15 var(--body);letter-spacing:.01em}
.p-contact small{display:block;color:#555;font-size:.8rem}
.p-foot{font-size:.9rem;color:#444;margin:.4rem 0 1rem;min-height:1px}
.p-strips{display:grid;grid-template-columns:repeat(8,1fr);border-top:2px dashed #999;margin:0 -1.4rem}
.p-strips span{writing-mode:vertical-rl;transform:rotate(180deg);font-size:.72rem;font-weight:700;padding:.6rem 0;border-left:1px dashed #bbb;height:9.5rem;display:flex;align-items:center;justify-content:center;white-space:nowrap;overflow:hidden}
.p-strips span:first-child{border-left:0}
@media print{
  @page{size:A4;margin:12mm}
  .posterwrap{display:block}
  .poster{box-shadow:none;border:0;border-radius:0;padding:0;font-size:14pt}
  .p-head{font-size:54pt}.p-name{font-size:40pt}.p-contact b{font-size:30pt}
  .p-photo{aspect-ratio:auto;height:98mm;width:100%}
  .p-strips{margin:0;break-inside:avoid}.p-strips span{height:40mm;font-size:9pt}
  .p-head{margin-bottom:4mm}.p-name{margin:4mm 0 1mm}
  .cl{break-inside:avoid}.cl-list input:checked+.box{background:none}.cl-list input:checked+.box::after{display:none}
  .artgrid,.toc,.lgrid .more{display:none!important}
}
.legal>h2:first-child{border-top:0;padding-top:0;margin-top:.2rem}
.lfacts.big{font-size:.92rem;margin-top:1rem;gap:.4rem 1.2rem}
.cl-list strong{display:block}
.prose .lfacts{padding-left:0}.prose .lfacts li{margin:0}
@media(max-width:560px){.lfacts.big{grid-template-columns:1fr}}
ul.rules li>strong{display:block}
/* Tarifwahl (26.09.2026) */
.tarife{display:grid;gap:.6rem;margin:1rem 0 .4rem}
.tarif{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"r kopf preis" "r info info" "r zusatz zusatz";gap:.2rem .8rem;align-items:center;border:1.5px solid var(--line);border-radius:18px;padding:.85rem 1rem;cursor:pointer;background:var(--card)}
.tarif input{grid-area:r;width:20px;height:20px;margin:0;accent-color:var(--forest)}
.tarif .t-kopf{grid-area:kopf;display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.tarif .t-preis,.tarif-liste .t-preis{grid-area:preis;font-family:var(--head);font-size:1.3rem;white-space:nowrap;text-align:right}
.tarif .t-preis small,.tarif-liste .t-preis small{font-family:var(--body);font-size:.76rem;color:var(--ink-2)}
.tarif .t-info{grid-area:info;font-size:.84rem;color:var(--ink-2)}
.tarif .t-zusatz{grid-area:zusatz;font-size:.8rem;font-weight:700;color:var(--forest)}
.tarif:has(input:checked){border-color:var(--forest);box-shadow:0 0 0 3px color-mix(in srgb,var(--forest) 16%,transparent)}
.tarif:focus-within{outline:2px solid var(--forest);outline-offset:2px}
.pill.empf{background:var(--forest);color:var(--on-forest,#fff)}
.tarif-liste{list-style:none;padding:0;margin:0 0 1.2rem}
.tarif-liste li{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:.7rem 0;border-top:1px solid var(--line)}
.tarif-liste li:first-child{border-top:0}
.tarif-liste small{display:block;font-size:.8rem;color:var(--ink-2);margin-top:.15rem}
.tarif-liste .t-preis small{display:inline}
.tarife-seite{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));margin:1rem 0}
.tarife-seite .price{max-width:none;justify-self:stretch;display:flex;flex-direction:column}
.tarife-seite .price .amount{font-size:2.6rem}
.tarife-seite .price .btn{margin-top:auto}
.tarife-seite .price.empf{outline:2px solid var(--forest)}
@media (prefers-color-scheme:dark){.tarif .t-zusatz{color:#9fd0c2}}
.zustimmung{display:flex;gap:.7rem;align-items:flex-start;margin:0 0 .8rem;padding:.75rem .9rem;border:1.5px solid var(--line);border-radius:14px;font-size:.86rem;line-height:1.45;cursor:pointer}
.zustimmung span{font-weight:500}
.zustimmung input{flex:0 0 auto;width:20px;height:20px;margin:.1rem 0 0;accent-color:var(--forest)}
.zustimmung:has(input:checked){border-color:var(--forest)}
.zustimmung.fehlt{border-color:var(--danger);background:var(--danger-soft)}
.zustimmung:focus-within{outline:2px solid var(--forest);outline-offset:2px}
.zhinweis{margin:-.4rem 0 .8rem;font-size:.84rem;font-weight:700;color:var(--danger)}