/*
Theme Name: Ich helfe mir
Description: Das Design für das Workbook „Innere Klarheit“. Arbeitet mit dem Plugin „Innere Klarheit – Workbook“ zusammen.
Author: Jennifer Zorn
Version: 1.1.0
Text Domain: ihelfmir
Requires PHP: 7.4
*/
/* ===== Innere Klarheit – Design-System =====
   Konzept: 60 % ruhige Basis (Weiß/Hellgrau), 30 % digitale Aquarell-Verläufe (Lavendel, Himmel, Mint, Pfirsich, Rosé),
   10 % Neonpink nur für Buttons und Highlights. Typografie: Montserrat (Überschriften), Inter (Text). */
:root {
  --paper: #f6f4ef; --mist: #ece8de; --card: #fbfaf6; --line: #ddd9cf; --line-2: #cfcabd;
  --ink: #1a201d; --ink-2: #4a524e; --ink-3: #5e6561;
  --olive: #2f4b3f; --sage: #8fa899; --pink: #cf93a0; --pink-line: #b06a79; --pink-deep: #8a4659; --pink-soft: #f4e4e4;
  --lav: #e3e8e1; --sky: #dbe5ea; --mint: #d3dccf; --peach: #efe2d9; --rose: #e6d3d3;
  --c1: #e3e8e1; --c2: #d3dccf; --c3: #efe2d9;
  --r-lg: 26px; --r-md: 16px; --r-sm: 10px;
  --f-head: 'Montserrat', 'Helvetica Neue', Arial, sans-serif; --f-body: 'Inter', 'Helvetica Neue', Arial, sans-serif;
  --gut: max(18px, env(safe-area-inset-left, 0px)); --gut-r: max(18px, env(safe-area-inset-right, 0px));
  --shadow: 0 1px 2px rgba(26,32,29,.05), 0 8px 28px -12px rgba(26,32,29,.12);
  --hdr: 64px;
}
.h0 { --c1: #e3e8e1; --c2: #e6d3d3; --c3: #dbe5ea; } .h1 { --c1: #dbe5ea; --c2: #d3dccf; --c3: #e3e8e1; }
.h2 { --c1: #d3dccf; --c2: #dbe5ea; --c3: #efe2d9; } .h3 { --c1: #efe2d9; --c2: #e6d3d3; --c3: #efe2d9; }
.h4 { --c1: #e6d3d3; --c2: #e3e8e1; --c3: #efe2d9; }

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 400 16px/1.65 var(--f-body); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
h1, h2, h3, h4 { font-family: var(--f-head); color: var(--ink); margin: 0; text-wrap: balance; letter-spacing: -.015em; line-height: 1.15; }
p { margin: 0; } a { color: inherit; } button { font: inherit; color: inherit; }
ul, ol { margin: 0; padding: 0; list-style: none; }
:focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; border-radius: 6px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.wrap { width: 100%; max-width: 1240px; margin: 0 auto; padding-left: var(--gut); padding-right: var(--gut-r); }
.skip { position: absolute; left: 12px; top: -60px; background: var(--ink); color: #fff; padding: 10px 16px; border-radius: 10px; z-index: 200; transition: top .2s; }
.skip:focus { top: 10px; }

/* ---------- Buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 46px; padding: 0 22px; border-radius: 999px; border: 1.5px solid var(--ink); background: transparent; color: var(--ink);
  font: 600 .95rem/1 var(--f-body); cursor: pointer; text-decoration: none; transition: transform .15s, background .15s, box-shadow .15s; white-space: nowrap; }
.btn:hover { background: var(--ink); color: #fff; }
.btn:active { transform: translateY(1px); }
.btn.pink { background: var(--pink); border-color: var(--pink); color: var(--ink); box-shadow: 0 10px 26px -10px rgba(176,106,121,.65); }
.btn.pink:hover { background: #d9a3ae; border-color: #d9a3ae; color: var(--ink); }
.btn.soft { border-color: var(--line-2); background: var(--card); }
.btn.soft:hover { background: var(--ink); border-color: var(--ink); }
.btn.sm { min-height: 38px; padding: 0 16px; font-size: .86rem; }
.btn.ico { padding: 0; width: 46px; } .btn.sm.ico { width: 38px; }
.btn svg, .ic { width: 18px; height: 18px; flex: none; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.btn[disabled] { opacity: .45; pointer-events: none; }

/* ---------- Kopfzeile ---------- */
.top { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 60; background: rgba(246,244,239,.82); backdrop-filter: saturate(1.4) blur(16px); -webkit-backdrop-filter: saturate(1.4) blur(16px); border-bottom: 1px solid rgba(221,217,207,.8); }
.top .wrap { height: var(--hdr); display: flex; align-items: center; gap: 12px; }
.logo { display: flex; align-items: center; gap: 11px; text-decoration: none; font: 800 1.02rem/1 var(--f-head); letter-spacing: -.01em; margin-right: auto; }
.logo i { width: 34px; height: 34px; border-radius: 50%; background: conic-gradient(from 210deg, var(--lav), var(--sky), var(--mint), var(--peach), var(--rose), var(--lav)); position: relative; flex: none; }
.logo i::after { content: ''; position: absolute; width: 9px; height: 9px; border-radius: 50%; background: var(--pink); right: 4px; top: 4px; border: 2px solid var(--paper); box-sizing: content-box; }
.nav { display: flex; align-items: center; gap: 6px; }
.nav .lnk { padding: 10px 14px; border-radius: 999px; font-weight: 500; font-size: .93rem; text-decoration: none; color: var(--ink-2); background: none; border: 0; cursor: pointer; }
.nav .lnk:hover, .nav .lnk[aria-expanded="true"] { background: var(--mist); color: var(--ink); }
.ring { --p: 0; width: 38px; height: 38px; border-radius: 50%; background: conic-gradient(var(--pink) calc(var(--p) * 1%), var(--line) 0); display: grid; place-items: center; position: relative; flex: none; }
.ring::before { content: ''; position: absolute; inset: 4px; background: var(--paper); border-radius: 50%; }
.ring b { position: relative; font: 700 .64rem/1 var(--f-head); }
body.editing .btn.edit-t { background: var(--ink); color: #fff; }
.menu-btn { display: none; }
.chmenu { position: absolute; left: 0; right: 0; top: 100%; background: var(--card); border-bottom: 1px solid var(--line); box-shadow: var(--shadow); padding: 22px 0 28px; display: none; max-height: calc(100vh - var(--hdr) - 20px); overflow-y: auto; }
.chmenu.open { display: block; }
.chmenu ul { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px 22px; }
.chmenu a { display: flex; gap: 12px; align-items: center; padding: 9px 10px; border-radius: 12px; text-decoration: none; font-weight: 500; font-size: .95rem; }
.chmenu a:hover { background: var(--mist); }
.chmenu .n { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font: 700 .75rem/1 var(--f-head); background: linear-gradient(135deg, var(--c1), var(--c2)); flex: none; }

/* ---------- Startseite ---------- */
.hero { position: relative; overflow: hidden; padding: clamp(56px, 9vw, 120px) 0 clamp(90px, 12vw, 170px); isolation: isolate; }
.hero-art { position: absolute; inset: -10% -5% 0; z-index: -1; pointer-events: none; }
.hero-art svg { width: 100%; height: 100%; animation: drift 38s ease-in-out infinite alternate; transform-origin: 60% 40%; }
@keyframes drift { from { transform: translate3d(-1.5%, 0, 0) rotate(-1deg) scale(1.02); } to { transform: translate3d(2%, -2%, 0) rotate(1.5deg) scale(1.08); } }
.hero-wave { position: absolute; left: 0; right: 0; bottom: -1px; width: 100%; height: clamp(50px, 8vw, 110px); display: block; z-index: 1; }
.hero .wrap { position: relative; z-index: 2; }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; font: 600 .85rem/1 var(--f-body); color: var(--ink-2); padding: 9px 15px; border-radius: 999px; background: rgba(255,255,255,.7); border: 1px solid rgba(255,255,255,.9); backdrop-filter: blur(8px); }
.eyebrow::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--pink); }
.hero h1 { font-weight: 800; font-size: clamp(2.7rem, 7.2vw, 6rem); line-height: .98; letter-spacing: -.035em; margin: 26px 0 22px; max-width: 12ch; }
.hero .lead { font-size: clamp(1.05rem, 1.7vw, 1.3rem); line-height: 1.55; color: var(--ink-2); max-width: 36em; }
.hero .cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.stats { display: flex; flex-wrap: wrap; gap: 14px 34px; margin-top: 46px; }
.stats div { display: flex; flex-direction: column; gap: 2px; } .stats b { font: 800 1.7rem/1 var(--f-head); } .stats span { font-size: .85rem; color: var(--ink-2); }

.sec { padding: clamp(56px, 8vw, 104px) 0; }
.sec.tint { background: var(--mist); }
.sec-h { max-width: 46rem; margin-bottom: 42px; }
.sec-h h2 { font-size: clamp(1.9rem, 4vw, 3rem); font-weight: 800; letter-spacing: -.03em; }
.sec-h p { margin-top: 14px; color: var(--ink-2); font-size: 1.08rem; }
.grid-ch { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 290px), 1fr)); gap: 20px; }
.chc { position: relative; display: flex; flex-direction: column; background: var(--card); border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; text-decoration: none; transition: transform .2s, box-shadow .2s; min-width: 0; }
.chc:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.chc .art { height: 130px; position: relative; background: radial-gradient(60% 90% at 15% 20%, var(--c1), transparent 70%), radial-gradient(55% 80% at 85% 30%, var(--c2), transparent 70%), radial-gradient(70% 70% at 50% 110%, var(--c3), transparent 70%), #fff; }
.chc .num { position: absolute; left: 20px; bottom: 14px; font: 800 3rem/1 var(--f-head); letter-spacing: -.04em; color: rgba(26,32,29,.9); }
.chc .bd { padding: 18px 22px 22px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.chc h3 { font-size: 1.15rem; font-weight: 700; }
.chc q { color: var(--ink-2); font-size: .9rem; line-height: 1.5; quotes: '„' '“'; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.bar { height: 6px; border-radius: 99px; background: var(--mist); overflow: hidden; margin-top: auto; }
.bar i { display: block; height: 100%; width: calc(var(--p, 0) * 1%); background: var(--ink); border-radius: 99px; transition: width .4s; }
.chc .meta { display: flex; justify-content: space-between; font-size: .8rem; color: var(--ink-3); }
.steps4 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 18px; }
.st { padding: 26px; border-radius: var(--r-lg); background: var(--card); border: 1px solid var(--line); display: flex; flex-direction: column; gap: 12px; }
.st .ib { width: 48px; height: 48px; border-radius: 16px; display: grid; place-items: center; background: linear-gradient(135deg, var(--c1), var(--c2)); } .st .ib .ic { width: 22px; height: 22px; }
.st h3 { font-size: 1.08rem; } .st p { color: var(--ink-2); font-size: .95rem; }
.leit { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 16px; }
.leit blockquote { margin: 0; padding: 26px 28px; border-radius: var(--r-lg); background: linear-gradient(135deg, var(--c1), var(--c2)); font: 600 1.15rem/1.45 var(--f-head); letter-spacing: -.01em; display: flex; flex-direction: column; gap: 12px; justify-content: space-between; }
.leit blockquote small { font: 500 .8rem/1 var(--f-body); color: var(--ink-2); }
.privacy { display: grid; grid-template-columns: auto 1fr; gap: 18px 22px; align-items: start; padding: 28px; border-radius: var(--r-lg); background: var(--card); border: 1px solid var(--line); max-width: 52rem; }
.privacy .ib { width: 46px; height: 46px; border-radius: 15px; background: var(--pink-soft); display: grid; place-items: center; }
.foot { padding: 46px 0 70px; border-top: 1px solid var(--line); color: var(--ink-3); font-size: .88rem; }
.foot .wrap { display: flex; flex-wrap: wrap; gap: 14px 32px; justify-content: space-between; }

/* ---------- Kapitelansicht ---------- */
.chead { position: relative; overflow: hidden; padding: clamp(40px, 6vw, 76px) 0 clamp(36px, 5vw, 60px); background: radial-gradient(50% 90% at 10% 10%, var(--c1), transparent 70%), radial-gradient(45% 80% at 90% 20%, var(--c2), transparent 70%), radial-gradient(70% 80% at 55% 120%, var(--c3), transparent 70%), var(--card); border-bottom: 1px solid var(--line); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.crumb { font-size: .88rem; color: var(--ink-2); display: flex; gap: 8px; align-items: center; margin-bottom: 18px; }
.crumb a { text-decoration: none; border-bottom: 1px solid var(--line-2); } .crumb a:hover { border-color: var(--ink); }
.chead .big { font: 800 clamp(4rem, 12vw, 9rem)/.8 var(--f-head); letter-spacing: -.06em; color: rgba(26,32,29,.92); }
.chead h1 { font-size: clamp(1.9rem, 4.6vw, 3.4rem); font-weight: 800; letter-spacing: -.03em; max-width: 18ch; margin-top: 14px; }
.chead .quote { margin-top: 18px; max-width: 42rem; font: 500 clamp(1.05rem, 1.8vw, 1.28rem)/1.5 var(--f-head); color: var(--ink); letter-spacing: -.01em; }
.chead .row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; align-items: center; }
.cprog { display: flex; align-items: center; gap: 10px; font-size: .88rem; color: var(--ink-2); margin-left: 6px; }
.cprog .bar { width: 120px; margin: 0; background: rgba(255,255,255,.7); }
.layout { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 44px; padding-top: 40px; padding-bottom: 70px; align-items: start; }
.toc { position: sticky; top: calc(var(--hdr) + 18px + env(safe-area-inset-top, 0px)); max-height: calc(100vh - var(--hdr) - 36px); overflow-y: auto; padding-right: 6px; }
.toc h4 { font: 700 .82rem/1 var(--f-head); color: var(--ink-3); margin: 0 0 14px 12px; letter-spacing: .02em; }
.toc a { display: flex; align-items: flex-start; gap: 11px; padding: 9px 12px; border-radius: 12px; text-decoration: none; font-size: .9rem; line-height: 1.35; color: var(--ink-2); }
.toc a:hover { background: var(--mist); color: var(--ink); }
.toc a.act { background: var(--card); color: var(--ink); font-weight: 600; box-shadow: 0 0 0 1px var(--line); }
.toc a.act .dot { border-color: var(--pink); background: var(--pink); }
.dot { width: 14px; height: 14px; border-radius: 50%; border: 1.5px solid var(--line-2); margin-top: 3px; flex: none; position: relative; }
.toc a.done .dot { background: var(--ink); border-color: var(--ink); }
.toc a.part .dot { background: linear-gradient(90deg, var(--ink) 50%, transparent 50%); border-color: var(--ink); }
.pages { display: flex; flex-direction: column; gap: 28px; min-width: 0; }
.pg { background: var(--card); border: 1px solid var(--line); border-radius: var(--r-lg); padding: clamp(22px, 4vw, 44px); scroll-margin-top: calc(var(--hdr) + 18px); min-width: 0; position: relative; }
.pg-h { margin-bottom: 26px; }
.pg-n { font: 600 .8rem/1 var(--f-body); color: var(--ink-3); margin-bottom: 12px; display: flex; align-items: center; gap: 10px; }
.pg-n::before { content: ''; width: 26px; height: 6px; border-radius: 9px; background: linear-gradient(90deg, var(--c1), var(--c2)); }
.pg h2 { font-size: clamp(1.45rem, 3vw, 2.1rem); font-weight: 800; letter-spacing: -.025em; }
.pg .sub { margin-top: 10px; color: var(--ink-2); max-width: 46rem; }
.blk { margin-top: 24px; position: relative; min-width: 0; } .blk:first-child { margin-top: 0; }
.motto { margin-top: 34px; padding-top: 20px; border-top: 1px dashed var(--line-2); font: 500 .95rem/1.4 var(--f-head); color: var(--ink-3); text-align: center; text-wrap: balance; display: flex; gap: 14px; align-items: center; justify-content: center; }
.motto::before, .motto::after { content: ''; width: 7px; height: 7px; border-radius: 50%; background: linear-gradient(135deg, var(--c1), var(--c2)); flex: none; border: 1px solid var(--line-2); }
.nextch { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 8px; }
.nextch a { padding: 24px 28px; border-radius: var(--r-lg); border: 1px solid var(--line); background: var(--card); text-decoration: none; display: flex; flex-direction: column; gap: 6px; transition: transform .2s, box-shadow .2s; }
.nextch a:hover { transform: translateY(-3px); box-shadow: var(--shadow); } .nextch small { color: var(--ink-3); font-size: .82rem; } .nextch b { font: 700 1.1rem/1.25 var(--f-head); }
.nextch a:last-child { text-align: right; } .nextch a:only-child { grid-column: 1 / -1; }

/* ---------- Inhaltsblöcke ---------- */
.idea { padding: 24px 28px; border-radius: 22px; background: linear-gradient(135deg, var(--c1), var(--c2)); display: grid; gap: 8px; }
.idea small { font: 700 .8rem/1 var(--f-head); color: var(--ink-2); } .idea p { font: 600 clamp(1.05rem, 2vw, 1.3rem)/1.45 var(--f-head); letter-spacing: -.01em; max-width: 44rem; }
.say { padding: 20px 26px; border-radius: 20px; background: var(--mist); border: 1px solid var(--line); font: 600 1.05rem/1.5 var(--f-head); text-align: center; text-wrap: balance; letter-spacing: -.01em; }
.say::before { content: ''; display: block; width: 28px; height: 4px; border-radius: 9px; background: var(--pink); margin: 0 auto 14px; }
.note { font-size: .86rem; color: var(--ink-3); line-height: 1.55; padding-left: 14px; border-left: 3px solid var(--line-2); max-width: 52rem; }
.subh { font: 700 1.05rem/1.3 var(--f-head); margin-top: 38px !important; } .subh + p { margin-top: 6px; color: var(--ink-2); }
.cards { display: grid; gap: 14px; grid-template-columns: repeat(var(--cols, 2), minmax(0, 1fr)); }
.card { padding: 20px 22px; border-radius: 20px; border: 1px solid var(--line); background: var(--paper); display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.card header { display: flex; gap: 12px; align-items: flex-start; }
.card h3 { font: 700 1rem/1.3 var(--f-head); letter-spacing: -.01em; padding-top: 4px; }
.nb { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg, var(--c1), var(--c2)); font: 700 .8rem/1 var(--f-head); flex: none; }
.card p { color: var(--ink-2); font-size: .95rem; line-height: 1.55; }
.card .q { color: var(--ink); font: 600 .95rem/1.45 var(--f-head); }
.card .fq { font-size: .9rem; color: var(--ink); padding-top: 10px; border-top: 1px dashed var(--line-2); }
.card .fq::before { content: 'Frage: '; font-weight: 600; color: var(--pink-deep); }
.card .ex { font-size: .86rem; color: var(--ink-3); } .card .ex::before { content: 'Beispiel: '; font-weight: 600; }
.card ul.l li, .vs ul li { position: relative; padding-left: 20px; font-size: .94rem; color: var(--ink); line-height: 1.5; margin-top: 6px; }
.card ul.l li::before, .vs ul li::before { content: ''; position: absolute; left: 3px; top: .58em; width: 7px; height: 7px; border-radius: 50%; background: linear-gradient(135deg, var(--c1), var(--c2)); border: 1px solid var(--line-2); }
.card ol.l { counter-reset: o var(--s, 0); } .card ol.l li { counter-increment: o; position: relative; padding-left: 34px; margin-top: 8px; font-size: .94rem; line-height: 1.45; }
.card ol.l li::before { content: counter(o); position: absolute; left: 0; top: 0; width: 24px; height: 24px; border-radius: 50%; background: var(--mist); font: 700 .72rem/24px var(--f-head); text-align: center; }
.cards.mini .card { background: var(--card); padding: 16px 18px; } .cards.mini .card h3 { font-size: .95rem; padding: 0; }
.cards.ladder { grid-template-columns: 1fr; gap: 10px; } .cards.ladder .card { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 8px 24px; } .cards.ladder .card header { min-width: 220px; } .cards.ladder .card ul { display: flex; flex-wrap: wrap; gap: 4px 22px; } .cards.ladder .card:nth-child(1) { margin-left: 0; } .cards.ladder .card:nth-child(2) { margin-left: 2%; } .cards.ladder .card:nth-child(3) { margin-left: 4%; } .cards.ladder .card:nth-child(4) { margin-left: 6%; background: linear-gradient(135deg, var(--c1), var(--c2)); }
.cards.rows .card { flex-direction: row; align-items: center; } .cards.rows .card p { margin: 0; }
.cards.chips ul.l { display: flex; flex-wrap: wrap; gap: 6px; } .card.chips ul.l li { padding: 5px 12px; border-radius: 99px; background: var(--card); border: 1px solid var(--line); margin: 0; } .card.chips ul.l li::before { display: none; }
.cards.wide .card:first-child { grid-column: 1 / -1; background: linear-gradient(135deg, var(--c1), var(--c2)); border: 0; } .cards.wide .card:first-child p { color: var(--ink); font: 700 1.2rem/1.3 var(--f-head); }
.cards.inputs .card { gap: 12px; }
.vs { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; } .vs .col { padding: 22px 24px; border-radius: 20px; border: 1px solid var(--line); background: var(--paper); min-width: 0; }
.vs .col:first-child { background: linear-gradient(160deg, var(--c1), #fff 90%); } .vs .col:last-child { background: linear-gradient(160deg, var(--c2), #fff 90%); }
.vs h3 { font: 700 1.02rem/1.3 var(--f-head); } .vs .s { color: var(--ink-3); font-size: .85rem; margin-top: 2px; } .vs .qq { font: 600 1.05rem/1.4 var(--f-head); margin-top: 14px; } .vs p { color: var(--ink-2); margin-top: 8px; font-size: .94rem; }
.myth { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 14px; } .myth .hd { font: 700 .82rem/1 var(--f-head); color: var(--ink-3); padding: 0 4px 4px; }
.myth div.m, .myth div.r { padding: 13px 16px; border-radius: 14px; font-size: .94rem; line-height: 1.4; } .myth .m { background: var(--mist); color: var(--ink-2); text-decoration: line-through; text-decoration-color: var(--line-2); } .myth .r { background: linear-gradient(135deg, var(--c1), var(--c2)); font-weight: 500; }
.flow { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr)); counter-reset: f; position: relative; }
.flow .st1 { position: relative; padding: 18px 18px 18px; border-radius: 18px; background: var(--paper); border: 1px solid var(--line); display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.flow .st1 .nb { margin-bottom: 4px; } .flow .st1 h3 { font: 700 .98rem/1.25 var(--f-head); } .flow .st1 p { font-size: .88rem; color: var(--ink-2); line-height: 1.45; }
.flow.chain .st1:not(:last-child)::after, .flow.loop .st1:not(:last-child)::after { content: ''; position: absolute; right: -10px; top: 30px; width: 8px; height: 8px; border-top: 2px solid var(--ink-3); border-right: 2px solid var(--ink-3); transform: rotate(45deg); z-index: 2; }
.flow.fstairs { align-items: end; } .flow.fstairs .st1 { margin-top: calc((var(--i) * 0px)); }
.flow.grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.say + .note, .note + .say { margin-top: 18px; }
.pk { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; } .pk > span { font-weight: 600; margin-right: 8px; }
.opt { min-width: 44px; height: 44px; padding: 0 14px; border-radius: 999px; border: 1.5px solid var(--line-2); background: var(--card); font-weight: 600; cursor: pointer; transition: all .12s; }
.opt:hover { border-color: var(--ink); } .opt[aria-pressed="true"], .opt[aria-checked="true"] { background: var(--pink); border-color: var(--pink); color: var(--ink); }

/* ---------- Eingaben ---------- */
.ask { display: flex; flex-direction: column; gap: 22px; counter-reset: q; }
.q1 { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 4px 14px; } .q1 .nb { margin-top: 1px; }
.q1 label, .q1 .lbl { font-weight: 600; line-height: 1.45; padding-top: 4px; display: block; } .q1 .lbl small { display: block; font-weight: 400; color: var(--ink-2); font-size: .93rem; margin-top: 1px; }
.q1 .ta { grid-column: 2; }
.ta { display: grid; position: relative; --lh: 1.95rem; }
.ta textarea, .ta .mir { grid-area: 1 / 1; font: 400 1rem/var(--lh) var(--f-body); padding: 0 6px; min-height: calc(var(--lh) * var(--rows, 2)); border: 0; margin: 0; width: 100%; white-space: pre-wrap; word-wrap: break-word; overflow-wrap: anywhere; }
.ta .mir { visibility: hidden; pointer-events: none; padding-bottom: var(--lh) ; } .ta textarea { resize: none; overflow: hidden; background: transparent; color: var(--ink); caret-color: var(--pink); border-radius: 4px;
  background-image: repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--lh) - 1px), var(--line-2) calc(var(--lh) - 1px), var(--line-2) var(--lh)); background-size: 100% var(--lh); }
.ta textarea:focus { outline: none; box-shadow: 0 0 0 3px rgba(176,106,121,.22); background-color: #fbfaf6; }
.ta textarea::placeholder { color: var(--ink-3); opacity: .55; }
.fields { display: grid; gap: 16px; grid-template-columns: repeat(var(--cols, 2), minmax(0, 1fr)); }
.field { border: 1px solid var(--line); border-radius: 20px; padding: 18px 20px 16px; background: var(--paper); display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.field label, .field .lbl { font: 700 .9rem/1.3 var(--f-head); display: block; } .field .h { font-size: .86rem; color: var(--ink-2); line-height: 1.4; margin-top: -2px; }
.field .bdg { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 9px; background: var(--ink); color: #fff; font: 700 .8rem/1 var(--f-head); margin-right: 8px; vertical-align: middle; }
.field .ta { margin-top: 6px; }
.one { display: flex; flex-direction: column; gap: 4px; } .one .lbl { font-weight: 600; } .one .h { font-size: .88rem; color: var(--ink-2); }
.line { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; } .line .lbl { font-weight: 600; flex: none; } .line input { flex: 1 1 220px; min-width: 0; border: 0; border-bottom: 1.5px dotted var(--ink-3); background: transparent; font: inherit; padding: 6px 4px; color: var(--ink); caret-color: var(--pink); }
input[type=text], input[type=date], input[type=number], select { font: inherit; color: var(--ink); }
input.in { width: 100%; min-width: 0; border: 0; border-bottom: 1.5px dotted var(--ink-3); background: transparent; padding: 8px 4px; border-radius: 4px 4px 0 0; caret-color: var(--pink); }
input.in:focus, .line input:focus { outline: none; background: #fbfaf6; border-bottom-color: var(--pink); box-shadow: 0 2px 0 var(--pink); }
.stem { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0 12px; align-items: baseline; padding: 4px 0; } .stem .lbl { font-weight: 600; } .stem .ta { --lh: 1.95rem; }
.nums { display: grid; gap: 10px; counter-reset: n; } .nums .lbl.t { font-weight: 600; margin-bottom: 2px; } .nums .r { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 12px; align-items: center; }
.tbl-w { overflow-x: auto; border: 1px solid var(--line); border-radius: 20px; background: var(--paper); -webkit-overflow-scrolling: touch; }
table.tbl { width: 100%; border-collapse: collapse; min-width: 560px; }
.tbl th { text-align: left; font: 700 .85rem/1.3 var(--f-head); padding: 14px 16px; background: var(--mist); border-bottom: 1px solid var(--line); }
.tbl td { padding: 4px 10px; border-bottom: 1px solid var(--line); vertical-align: top; } .tbl tr:last-child td { border-bottom: 0; } .tbl td + td, .tbl th + th { border-left: 1px solid var(--line); }
.tbl td.num { width: 44px; text-align: center; font: 700 .85rem/1 var(--f-head); color: var(--ink-3); padding-top: 14px; } .tbl td.fx { font-weight: 600; padding: 14px 16px; white-space: nowrap; background: var(--mist); }
.tbl .ta { --lh: 1.7rem; } .tbl .ta textarea { padding: 6px 4px; background-image: none; line-height: 1.5; min-height: 2.8rem; } .tbl .ta .mir { padding: 6px 4px 6px; }
.scale { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 20px; overflow: hidden; background: var(--paper); }
.sc-h { display: flex; justify-content: flex-end; gap: 0; padding: 12px 18px 6px; font-size: .78rem; color: var(--ink-3); } .sc-h span { width: 240px; display: flex; justify-content: space-between; }
.sc-r { display: flex; justify-content: space-between; gap: 14px 24px; align-items: center; padding: 14px 18px; border-top: 1px solid var(--line); flex-wrap: wrap; }
.sc-r:first-of-type { border-top: 0; } .sc-r .t { flex: 1 1 260px; font-size: .96rem; line-height: 1.4; }
.dots5 { display: flex; gap: 8px; flex: none; position: relative; } .dots5 .opt { min-width: 40px; width: 40px; height: 40px; padding: 0; } .dots5 .opt.was { box-shadow: 0 0 0 3px var(--c1), 0 0 0 4.5px var(--ink); }
.sum { padding: 16px 20px; border-radius: 18px; background: linear-gradient(135deg, var(--c1), var(--c2)); display: flex; flex-wrap: wrap; gap: 10px 22px; align-items: baseline; font-size: .93rem; } .sum b { font: 800 1.5rem/1 var(--f-head); }
.chips-w { display: flex; flex-wrap: wrap; gap: 8px; } .chp { padding: 10px 16px; border-radius: 99px; border: 1.5px solid var(--line-2); background: var(--card); cursor: pointer; font-weight: 500; transition: all .12s; }
.chp:hover { border-color: var(--ink); } .chp[aria-pressed="true"] { background: var(--ink); color: #fff; border-color: var(--ink); } .chp[aria-pressed="true"]::before { content: ''; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--pink); margin-right: 8px; }
.cnt { font-weight: 600; margin-bottom: 12px; display: flex; gap: 10px; align-items: center; } .cnt b { font: 800 1.3rem/1 var(--f-head); }
.hintbox { padding: 16px 20px; border-radius: 18px; background: var(--mist); font-size: .94rem; } .hintbox .chips-w { margin-top: 10px; }
.chk { display: flex; flex-direction: column; gap: 12px; } .ck { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 4px 14px; padding: 16px 18px; border-radius: 18px; border: 1px solid var(--line); background: var(--paper); align-items: start; }
.cb { width: 28px; height: 28px; border-radius: 9px; border: 1.5px solid var(--ink-3); background: var(--card); display: grid; place-items: center; cursor: pointer; padding: 0; transition: all .12s; flex: none; }
.cb[aria-checked="true"] { background: var(--pink); border-color: var(--pink); } .cb svg { width: 16px; height: 16px; stroke: var(--ink); stroke-width: 2.6; fill: none; opacity: 0; } .cb[aria-checked="true"] svg { opacity: 1; }
.ck .t { font-weight: 600; padding-top: 3px; } .ck .ta { grid-column: 2; } .ck.plain { grid-template-columns: 28px 1fr; padding: 4px 0; border: 0; background: none; align-items: center; }
.dotsr { display: flex; flex-wrap: wrap; gap: 8px; } .dc { width: 28px; height: 28px; border-radius: 50%; border: 1.5px solid var(--ink-3); background: var(--card); cursor: pointer; padding: 0; } .dc[aria-checked="true"] { background: var(--pink); border-color: var(--pink); }
.lbl.sm { font-weight: 600; margin-bottom: 8px; display: block; }
.trk { overflow-x: auto; border: 1px solid var(--line); border-radius: 20px; background: var(--paper); padding-bottom: 6px; -webkit-overflow-scrolling: touch; }
.trk table { border-collapse: separate; border-spacing: 0; min-width: 1060px; width: 100%; } .trk th { font: 600 .68rem/1 var(--f-body); color: var(--ink-3); padding: 10px 0 6px; text-align: center; } .trk th:first-child, .trk td:first-child { position: sticky; left: 0; background: var(--paper); z-index: 2; min-width: 168px; max-width: 168px; padding: 0 8px; }
.trk td { padding: 3px 1px; text-align: center; } .trk td:first-child input { width: 100%; border: 0; border-bottom: 1.5px dotted var(--ink-3); background: transparent; font: .9rem var(--f-body); padding: 6px 2px; color: var(--ink); }
.tc { width: 24px; height: 24px; border-radius: 7px; border: 1.5px solid var(--line-2); background: var(--card); cursor: pointer; padding: 0; } .tc[aria-checked="true"] { background: var(--pink); border-color: var(--pink); }
.trk-h { display: flex; gap: 20px; flex-wrap: wrap; margin-bottom: 14px; } .trk-h > div { flex: 1 1 220px; }
.wheel-w { display: grid; grid-template-columns: minmax(280px, 460px) minmax(0, 1fr); gap: 26px 36px; align-items: center; }
.wheel-w svg { width: 100%; height: auto; display: block; overflow: visible; }
.sl { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line); } .sl:last-child { border: 0; }
.sl label { font-weight: 600; font-size: .93rem; } .sl output { font: 800 1.05rem/1 var(--f-head); min-width: 2ch; text-align: right; } .sl input[type=range] { grid-column: 1 / -1; width: 100%; accent-color: var(--pink); height: 28px; }
.sl input.in { font-weight: 600; }
.legend { font-size: .82rem; color: var(--ink-3); margin-top: 8px; }
.bat-w { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 24px 34px; align-items: start; } .bat { display: flex; flex-direction: column; align-items: center; gap: 10px; } .bat-t { width: 38px; height: 10px; background: var(--ink); border-radius: 4px 4px 0 0; margin-bottom: -10px; }
.bat-b { width: 110px; padding: 10px; border: 3px solid var(--ink); border-radius: 18px; display: flex; flex-direction: column-reverse; gap: 6px; margin-top: 10px; background: var(--card); } .seg { height: 24px; border-radius: 7px; border: 1.5px solid var(--line-2); background: var(--paper); cursor: pointer; padding: 0; display: block; width: 100%; position: relative; } .seg[aria-pressed="true"] { background: linear-gradient(90deg, var(--c1), var(--c2)); border-color: var(--ink-3); } .seg.top[aria-pressed="true"] { background: var(--pink); border-color: var(--pink); }
.bat-l { font-size: .85rem; color: var(--ink-2); text-align: center; }
.stairs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; align-items: end; } .stp { border-radius: 18px; border: 1px solid var(--line); background: var(--paper); padding: 14px 14px 12px; display: flex; flex-direction: column; gap: 8px; min-height: calc(130px + var(--h) * 34px); } .stp:last-child { background: linear-gradient(135deg, var(--c1), var(--c2)); } .stp .nb { }
.stp .ta { flex: 1; --lh: 1.6rem; } .stp textarea { font-size: .92rem !important; }
.cz { display: grid; grid-template-columns: minmax(240px, 380px) minmax(0, 1fr); gap: 28px; align-items: center; } .cz svg { width: 100%; height: auto; } .cz ul { display: grid; gap: 14px; }
.cz li { padding: 16px 18px; border-radius: 16px; border: 1px solid var(--line); background: var(--paper); } .cz li b { font: 700 .98rem var(--f-head); display: block; margin-bottom: 2px; } .cz li span { font-size: .9rem; color: var(--ink-2); }
.tree { display: grid; grid-template-columns: minmax(200px, 340px) minmax(0, 1fr); gap: 26px; align-items: stretch; } .tree svg { width: 100%; height: auto; } .tree .fields { align-content: center; }
.cmp { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; align-items: stretch; } .cmp .field:nth-child(1) { grid-column: 2; } .cmp .field:nth-child(2) { grid-column: 1; grid-row: 2; } .cmp .field:nth-child(3) { grid-column: 3; grid-row: 2; } .cmp .field:nth-child(4) { grid-column: 2; grid-row: 3; } .cmp .mid { grid-column: 2; grid-row: 2; display: grid; place-items: center; }
.rose { width: 130px; aspect-ratio: 1; border-radius: 50%; background: conic-gradient(var(--lav), var(--sky), var(--mint), var(--peach), var(--rose), var(--lav)); display: grid; place-items: center; position: relative; } .rose::after { content: ''; position: absolute; inset: 14px; background: var(--card); border-radius: 50%; } .rose b { position: relative; z-index: 1; font: 800 .95rem/1.1 var(--f-head); text-align: center; }
.reach { display: grid; grid-template-columns: minmax(240px, 360px) minmax(0, 1fr); gap: 24px; align-items: center; } .reach svg { width: 100%; height: auto; } .reach ol { display: grid; gap: 12px; } .reach li { display: grid; grid-template-columns: 30px 1fr; gap: 12px; } .reach li b { font: 700 .95rem var(--f-head); display: block; } .reach li span { font-size: .9rem; color: var(--ink-2); }
.tl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; } .tl .field { border-width: 0; position: relative; padding-top: 22px; } .tl .field.g { background: #dff5e9; } .tl .field.y { background: #fff3c9; } .tl .field.r { background: #ffdcdc; }
.tl .lamp { width: 22px; height: 22px; border-radius: 50%; position: absolute; top: 16px; right: 18px; } .g .lamp { background: #2fbf75; } .y .lamp { background: #f2b611; } .r .lamp { background: #ef4d4d; }
.emos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; } .emo { padding: 18px; border-radius: 18px; background: var(--paper); border: 1px solid var(--line); display: flex; flex-direction: column; gap: 6px; } .emo h3 { font: 700 1rem var(--f-head); margin-bottom: 2px; } .emo small { font: 600 .74rem/1 var(--f-body); color: var(--ink-3); margin-top: 8px; display: block; } .emo p { font-size: .9rem; line-height: 1.4; }
.feel { display: grid; grid-template-columns: minmax(200px, 300px) minmax(0, 1fr); gap: 26px 32px; } .feel svg.body { width: 100%; height: auto; background: var(--paper); border-radius: 20px; border: 1px solid var(--line); touch-action: none; cursor: crosshair; display: block; }
.paint { position: relative; } .paint canvas { width: 100%; display: block; border-radius: 20px; border: 1px solid var(--line); background: var(--paper); touch-action: none; cursor: crosshair; } .paint .pt { display: flex; gap: 8px; margin-top: 8px; align-items: center; font-size: .84rem; color: var(--ink-3); flex-wrap: wrap; }
.sizes { display: flex; gap: 14px; align-items: flex-end; flex-wrap: wrap; } .sizes button { background: none; border: 0; padding: 0; cursor: pointer; display: grid; justify-items: center; gap: 4px; font-size: .78rem; color: var(--ink-3); } .sizes i { display: block; border-radius: 50%; border: 2px solid var(--ink-3); background: var(--card); } .sizes button[aria-pressed="true"] i { background: var(--pink); border-color: var(--pink); }
.week { display: flex; flex-direction: column; gap: 10px; } .wk { display: grid; grid-template-columns: 110px minmax(0, 1fr) minmax(0, 1fr); gap: 10px 16px; padding: 14px 16px; border-radius: 18px; border: 1px solid var(--line); background: var(--paper); align-items: start; } .wk .d { font: 800 .98rem/1.3 var(--f-head); padding-top: 3px; } .wk .ta { --lh: 1.7rem; } .wk small { display: block; font-size: .76rem; color: var(--ink-3); margin-bottom: 2px; }
.wkh { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; margin-bottom: 4px; }
.daily { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.daily .box { border: 1px solid var(--line); border-radius: 20px; padding: 18px 20px; background: var(--paper); display: flex; flex-direction: column; gap: 12px; min-width: 0; } .daily .box.full { grid-column: 1 / -1; } .daily h3 { font: 700 .92rem var(--f-head); }
.wx { display: flex; flex-wrap: wrap; gap: 8px; } .wx button, .mood button { width: 52px; height: 52px; border-radius: 16px; border: 1.5px solid var(--line-2); background: var(--card); cursor: pointer; padding: 0; display: grid; place-items: center; transition: all .12s; } .wx button svg, .mood button svg { width: 30px; height: 30px; stroke: var(--ink); fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; } .wx button[aria-pressed="true"], .mood button[aria-pressed="true"] { background: var(--pink); border-color: var(--pink); } .wx button:hover, .mood button:hover { border-color: var(--ink); }
.mood { display: flex; flex-wrap: wrap; gap: 8px; } .en { display: flex; gap: 5px; flex-wrap: wrap; } .en button { width: 28px; height: 38px; border-radius: 8px; border: 1.5px solid var(--line-2); background: var(--card); cursor: pointer; padding: 0; } .en button[aria-pressed="true"] { background: linear-gradient(180deg, var(--c1), var(--c2)); border-color: var(--ink-3); } .en button.top[aria-pressed="true"] { background: var(--pink); border-color: var(--pink); }
.chkrow { display: grid; grid-template-columns: minmax(0, 1fr) repeat(5, 28px); gap: 8px; align-items: center; margin-top: 4px; } .chkrow .in { padding: 6px 4px; }
.zeug { border: 1.5px solid var(--ink); border-radius: 22px; padding: clamp(18px, 3vw, 32px); background: var(--paper); display: flex; flex-direction: column; gap: 20px; position: relative; } .zeug::before { content: ''; position: absolute; inset: 7px; border: 1px solid var(--line-2); border-radius: 16px; pointer-events: none; } .zeug > * { position: relative; }
.zrow { display: grid; grid-template-columns: minmax(150px, 220px) auto minmax(0, 1fr); gap: 10px 18px; align-items: center; padding: 10px 0; border-bottom: 1px dashed var(--line-2); } .zrow .f { font-weight: 600; }
.hearts { display: flex; gap: 4px; } .ht { width: 30px; height: 30px; background: none; border: 0; cursor: pointer; padding: 3px; } .ht svg { width: 100%; height: 100%; fill: none; stroke: var(--ink-3); stroke-width: 1.8; stroke-linejoin: round; } .ht[aria-pressed="true"] svg { fill: var(--pink); stroke: var(--pink); }
.mx { overflow-x: auto; border: 1px solid var(--line); border-radius: 20px; background: var(--paper); } .mx table { border-collapse: collapse; width: 100%; min-width: 720px; } .mx th, .mx td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: center; } .mx th { background: var(--mist); font: 700 .82rem/1.3 var(--f-head); } .mx td:first-child { text-align: left; min-width: 210px; } .mx select { border: 1.5px solid var(--line-2); border-radius: 10px; padding: 7px 10px; background: var(--card); min-width: 56px; } .mx tfoot td { font: 800 1.05rem var(--f-head); background: linear-gradient(135deg, var(--c1), var(--c2)); border-bottom: 0; } .mx tfoot td.win { background: var(--pink); }
.mx input.in { text-align: center; } .mx td:first-child input.in { text-align: left; } .mx th input.in { font-weight: 700; text-align: center; background: transparent; }
.leits { display: flex; flex-direction: column; gap: 10px; } .lt { display: grid; grid-template-columns: 40px minmax(0, 1fr) 44px; gap: 14px; align-items: center; padding: 14px 18px; border-radius: 18px; border: 1px solid var(--line); background: var(--paper); } .lt .nb { width: 34px; height: 34px; } .lt q { font: 600 1rem/1.45 var(--f-head); quotes: '„' '“'; } .lt.on { background: linear-gradient(135deg, var(--c1), var(--c2)); border-color: transparent; }
.notes .ta { --lh: 2rem; } .notes.grid textarea { background-image: linear-gradient(var(--line-2) 1px, transparent 1px), linear-gradient(90deg, var(--line-2) 1px, transparent 1px); background-size: 28px 28px; line-height: 28px; --lh: 28px; }
.portrait { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; } .avatar { width: 112px; height: 112px; border-radius: 50%; background: conic-gradient(from 200deg, var(--lav), var(--sky), var(--mint), var(--peach), var(--rose), var(--lav)); display: grid; place-items: center; overflow: hidden; position: relative; flex: none; border: 3px solid var(--card); box-shadow: 0 0 0 1px var(--line-2); } .avatar img { width: 100%; height: 100%; object-fit: cover; display: block; } .avatar svg { width: 46px; height: 46px; stroke: var(--ink); fill: none; stroke-width: 1.6; }
.pf { flex: 1 1 320px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 22px; } .pf label { font: 700 .85rem var(--f-head); display: block; }

/* ---------- Bearbeiten ---------- */
.tools, .addbar, .edonly, .addpage { display: none; }
body.editing .tools { display: flex; } body.editing .addbar { display: flex; } body.editing .edonly { display: inline-flex; } body.editing .addpage { display: flex; }
body.editing [data-ek] { outline: 1.5px dashed transparent; outline-offset: 3px; border-radius: 4px; cursor: text; transition: outline-color .15s, background .15s; }
body.editing [data-ek]:hover { outline-color: var(--line-2); background: rgba(176,106,121,.05); } body.editing [data-ek]:focus { outline: 2px solid var(--pink); background: var(--card); }
.tools { position: absolute; top: -14px; right: 6px; gap: 2px; padding: 3px; border-radius: 12px; background: var(--ink); z-index: 5; } .tools button { width: 30px; height: 30px; display: grid; place-items: center; border: 0; background: none; color: #fff; border-radius: 9px; cursor: pointer; padding: 0; } .tools button:hover { background: rgba(255,255,255,.18); } .tools .ic { width: 16px; height: 16px; }
.pg > .tools { top: 14px; right: 14px; }
.addbar { justify-content: center; margin-top: 18px; position: relative; } .addbar .btn { border-style: dashed; }
.addmenu { position: absolute; z-index: 20; bottom: 54px; left: 50%; transform: translateX(-50%); background: var(--card); border: 1px solid var(--line-2); box-shadow: var(--shadow); border-radius: 18px; padding: 8px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; width: min(420px, 92vw); } .addmenu button { text-align: left; padding: 11px 14px; border-radius: 12px; border: 0; background: none; cursor: pointer; font-weight: 500; } .addmenu button:hover { background: var(--mist); } .addmenu small { display: block; font-weight: 400; color: var(--ink-3); font-size: .78rem; }
.addpage { justify-content: center; } .addpage .btn { border-style: dashed; }
.edbar { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(18px + env(safe-area-inset-bottom, 0px)); z-index: 90; background: var(--ink); color: #fff; padding: 8px 10px 8px 20px; border-radius: 999px; box-shadow: 0 18px 50px -12px rgba(26,32,29,.6); display: none; align-items: center; gap: 12px; max-width: calc(100vw - 24px); } body.editing .edbar { display: flex; }
.edbar span { font-size: .88rem; white-space: nowrap; } .edbar .btn { border-color: rgba(255,255,255,.35); color: #fff; min-height: 38px; } .edbar .btn:hover { background: #fff; color: var(--ink); } .edbar .btn.pink { color: var(--ink); border-color: var(--pink); }
.mini-note { font-size: .8rem; color: var(--ink-3); }
.userb { box-shadow: -6px 0 0 -3px var(--c1); }
.uitem { display: flex; gap: 6px; align-items: flex-start; } .rm { display: none; } body.editing .rm { display: inline-grid; }
.rm { width: 26px; height: 26px; place-items: center; border-radius: 8px; border: 1px solid var(--line-2); background: var(--card); cursor: pointer; padding: 0; flex: none; } .rm .ic { width: 14px; height: 14px; }

/* ---------- Dialoge ---------- */
.ov { position: fixed; inset: 0; z-index: 120; background: rgba(26,32,29,.45); backdrop-filter: blur(6px); display: none; align-items: flex-start; justify-content: center; padding: 8vh 16px 16px; overflow-y: auto; } .ov.open { display: flex; }
.dlg { width: min(640px, 100%); background: var(--card); border-radius: 26px; padding: 28px; box-shadow: 0 40px 100px -20px rgba(26,32,29,.55); } .dlg h2 { font-size: 1.4rem; margin-bottom: 6px; } .dlg p.m { color: var(--ink-2); font-size: .94rem; margin-bottom: 18px; }
.dlg .acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; } .dlg .list { display: grid; gap: 10px; }
.dlg .row { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: center; padding: 14px 16px; border: 1px solid var(--line); border-radius: 16px; } .dlg .row b { display: block; font-weight: 600; } .dlg .row small { color: var(--ink-3); }
.srch input { width: 100%; font: 500 1.15rem var(--f-body); padding: 16px 20px; border-radius: 18px; border: 1.5px solid var(--line-2); background: var(--paper); } .srch input:focus { outline: none; border-color: var(--ink); box-shadow: 0 0 0 4px rgba(176,106,121,.18); }
.srch .res { margin-top: 12px; max-height: 52vh; overflow-y: auto; display: grid; gap: 4px; } .srch .res a { display: block; padding: 12px 14px; border-radius: 14px; text-decoration: none; } .srch .res a:hover, .srch .res a.sel { background: var(--mist); } .srch .res b { display: block; font: 600 .98rem var(--f-head); } .srch .res small { color: var(--ink-3); } .srch mark { background: var(--pink-soft); color: inherit; border-radius: 3px; padding: 0 2px; }
.toast { position: fixed; left: 50%; bottom: calc(86px + env(safe-area-inset-bottom, 0px)); transform: translate(-50%, 20px); opacity: 0; background: var(--ink); color: #fff; padding: 12px 20px; border-radius: 99px; z-index: 150; font-size: .92rem; transition: all .25s; pointer-events: none; max-width: calc(100vw - 32px); } .toast.on { opacity: 1; transform: translate(-50%, 0); }
.pw { width: 100%; padding: 14px 16px; border-radius: 14px; border: 1.5px solid var(--line-2); font: inherit; margin-top: 6px; }
.saved { font-size: .78rem; color: var(--ink-3); display: inline-flex; align-items: center; gap: 6px; } .saved::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #2fbf75; }

/* ---------- Responsiv ---------- */
@media (max-width: 1060px) {
  .layout { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .toc { position: sticky; top: calc(var(--hdr) + env(safe-area-inset-top, 0px)); z-index: 40; max-height: none; overflow: visible; padding: 10px 0; margin: 0 calc(-1 * var(--gut)) 0 calc(-1 * var(--gut)); padding-left: var(--gut); padding-right: var(--gut-r); background: rgba(246,244,239,.92); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--line); }
  .toc h4 { display: none; } .toc nav { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; } .toc nav::-webkit-scrollbar { display: none; } .toc a { white-space: nowrap; flex: none; border: 1px solid var(--line); background: var(--card); padding: 8px 14px; border-radius: 99px; }
  .chmenu ul { grid-template-columns: repeat(2, 1fr); } .nav .lnk.hide-m { display: none; }
  .wheel-w, .cz, .tree, .reach, .feel { grid-template-columns: minmax(0, 1fr); } .bat-w { grid-template-columns: minmax(0, 1fr); } .emos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stairs { grid-template-columns: minmax(0, 1fr); } .stp { min-height: 0 !important; }
}
@media (max-width: 760px) {
  :root { --hdr: 58px; }
  .cards { grid-template-columns: minmax(0, 1fr) !important; } .fields { grid-template-columns: minmax(0, 1fr) !important; } .vs, .myth { grid-template-columns: minmax(0, 1fr); } .flow.grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cards.ladder .card { margin-left: 0 !important; } .tl { grid-template-columns: minmax(0, 1fr); } .daily { grid-template-columns: minmax(0, 1fr); } .pf { grid-template-columns: minmax(0, 1fr); }
  .wk { grid-template-columns: minmax(0, 1fr); } .zrow { grid-template-columns: minmax(0, 1fr); } .wkh { grid-template-columns: minmax(0, 1fr); } .nextch { grid-template-columns: minmax(0, 1fr); } .nextch a:last-child { text-align: left; }
  .cmp { grid-template-columns: minmax(0, 1fr); } .cmp .field:nth-child(n) { grid-column: 1; grid-row: auto; } .cmp .mid { display: none; }
  .nav .lnk { display: none; } .menu-btn { display: inline-flex; } .pg { padding: 20px 16px 24px; border-radius: 22px; } .sc-h { display: none; } .sc-r { flex-direction: column; align-items: flex-start; } .privacy { grid-template-columns: minmax(0, 1fr); }
  .chead .row .btn { flex: 1 1 auto; } .edbar span { display: none; } .stats { gap: 14px 26px; } .lt { grid-template-columns: 34px minmax(0, 1fr) 40px; gap: 10px; }
  .chmenu ul { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 420px) { .emos { grid-template-columns: minmax(0, 1fr); } .dots5 .opt { width: 36px; min-width: 36px; height: 36px; } }
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } html { scroll-behavior: auto; } }

/* ---------- Druck / PDF ---------- */
@page { size: A4; margin: 14mm 13mm; }
@media print {
  html { scroll-behavior: auto; } body { background: #fff; font-size: 10.5pt; }
  .top, .toc, .tools, .addbar, .addpage, .edbar, .toast, .ov, .skip, .nextch, .chead .row, .foot, .btn, .rm, .hero, .sec, .chmenu { display: none !important; }
  .chead { padding: 0 0 8mm; border: 0; background: none; } .chead .big { font-size: 40pt; } .chead h1 { font-size: 22pt; margin-top: 4px; } .chead .quote { font-size: 11pt; margin-top: 8px; } .crumb { display: none; }
  .layout { display: block; padding: 0; } .pages { display: block; } .wrap { padding: 0; max-width: none; }
  .pg { border: 0; border-radius: 0; padding: 0; margin: 0; break-before: page; box-shadow: none; } .pg:first-child { break-before: avoid; }
  .pg-h, .card, .field, .q1, .ck, .scale, .sc-r, .tbl tr, .wk, .stp { break-inside: avoid; } h2, h3 { break-after: avoid; }
  .ta textarea { color: #000; } .ta .mir { visibility: visible; } .ta textarea { opacity: 0; } .ta { display: block; position: relative; } .ta textarea { position: absolute; inset: 0; height: 100%; } .ta .mir { color: var(--ink); display: block; background-image: repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--lh) - 1px), #cfcabd calc(var(--lh) - 1px), #cfcabd var(--lh)); background-size: 100% var(--lh); }
  .tbl .ta .mir { background: none; } .trk, .tbl-w, .mx { overflow: visible; border-radius: 6px; } .trk table { min-width: 0; font-size: 7pt; } .tc { width: 12px; height: 12px; } .trk th:first-child, .trk td:first-child { position: static; min-width: 90px; } table.tbl, .mx table { min-width: 0; }
  .opt, .cb, .tc, .dc, .chp, .seg, .ht, .en button, .wx button, .mood button { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .idea, .say, .vs .col, .stp:last-child, .sum, .nb, .myth .r, .cards.wide .card:first-child, .lt.on { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .flow, .cards, .fields { gap: 8px; } .motto { margin-top: 14px; }
}

/* ---------- Ergänzungen ---------- */
[data-ek]:empty { display: none; }
body.editing [data-ek]:empty { display: block; min-height: 1.4em; }
body.editing [data-ek]:empty::before { content: attr(data-ph); color: var(--ink-3); font-style: italic; }
.paint .cv { position: relative; border-radius: 20px; border: 1px solid var(--line); background: var(--paper); overflow: hidden; line-height: 0; }
.paint .cv svg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.paint .cv canvas { position: relative; border: 0; border-radius: 0; background: transparent; }
.srch .res a b { display: block; font-weight: 600; } .srch .res a small { color: var(--ink-3); display: block; line-height: 1.4; } .srch .res mark { background: var(--pink-soft); color: inherit; border-radius: 3px; }
.srch .none { padding: 18px 6px; color: var(--ink-2); }
@keyframes blobdrift { 0% { transform: translate(0,0) scale(1); } 50% { transform: translate(3%,-4%) scale(1.06); } 100% { transform: translate(-2%,3%) scale(1); } }
.hero-art .blob { animation: blobdrift 22s ease-in-out infinite alternate; transform-origin: center; transform-box: fill-box; }
.hero-art .blob:nth-child(2n) { animation-duration: 28s; animation-direction: alternate-reverse; }
.chc.hid { opacity: .55; }
.kbd { font: 600 .72rem/1 var(--f-body); padding: 3px 6px; border-radius: 6px; border: 1px solid var(--line-2); color: var(--ink-3); }
.dlg h3 { font-size: 1.02rem; margin: 18px 0 8px; } .dlg .hint { font-size: .86rem; color: var(--ink-3); }
.dlg .err { color: var(--pink-deep); font-weight: 600; font-size: .92rem; margin-top: 10px; }
.chead .saved { margin-left: 4px; opacity: 0; transition: opacity .3s; } .chead .saved.on { opacity: 1; }
body.editing .chead h1[data-ek], body.editing .chead .quote[data-ek] { cursor: text; }
.ta textarea { resize: none; }
#main:focus { outline: none; }
.addmenu[hidden] { display: none; }
@media (max-width: 760px) {
  .nav .edit-t { width: 38px; padding: 0; } .nav .edit-t span { display: none; }
  .nav [data-action="data"] { display: none; } .nav { gap: 8px; }
}
.logo { white-space: nowrap; } @media (max-width: 420px) { .logo { font-size: .92rem; gap: 8px; } }
body.editing { padding-bottom: 90px; }
.top .chmenu .wrap { height: auto; display: block; }

mark.ph { background: var(--pink-soft); color: var(--ink); border-radius: 5px; padding: 0 4px; font-weight: 600; }
.lg { max-width: 52rem; margin: 0 auto; padding-top: 44px; padding-bottom: 80px; display: flex; flex-direction: column; gap: 34px; }
.lg-s { display: flex; flex-direction: column; gap: 12px; } .lg-s h2 { font-size: 1.3rem; } .lg-s p, .lg-s li { color: var(--ink-2); max-width: 46rem; }
.lg-s ul { display: flex; flex-direction: column; gap: 8px; padding-left: 1.2rem; list-style: disc; } .lg-s li::marker { color: var(--pink); }
.lg-note { padding: 16px 20px; border-radius: 18px; background: linear-gradient(135deg, var(--c1), var(--c2)); color: var(--ink) !important; font-weight: 500; }
.lg-back { display: flex; gap: 10px; flex-wrap: wrap; }
.foot a { text-decoration: none; border-bottom: 1px solid var(--line-2); } .foot a:hover { border-color: var(--ink); }
.foot .links { display: flex; gap: 18px; flex-wrap: wrap; }
.lockscreen { position: fixed; inset: 0; z-index: 130; display: grid; place-items: center; padding: 20px; background: radial-gradient(50% 60% at 15% 15%, #e3e8e1, transparent 70%), radial-gradient(50% 60% at 90% 25%, #dbe5ea, transparent 70%), radial-gradient(60% 60% at 50% 110%, #e6d3d3, transparent 70%), var(--paper); }
.lockscreen[hidden] { display: none; }
.lockcard { width: min(440px, 100%); background: var(--card); border: 1px solid var(--line); border-radius: 28px; padding: 32px; box-shadow: 0 30px 80px -30px rgba(26,32,29,.35); display: flex; flex-direction: column; gap: 14px; }
.lockcard h1 { font-size: 1.6rem; } .lockcard p { color: var(--ink-2); font-size: .95rem; }

/* ===== Auslassen ===== */
.skipl { background: none; border: 0; padding: 4px 0; margin: 0; font: 500 .84rem/1.4 var(--f-body); color: var(--ink-2); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; min-height: 32px; }
.skipl:hover { color: var(--ink); }
.skiprow { display: flex; justify-content: flex-end; margin-top: 6px; }
.skiprow.top { margin: 0 0 8px; }
.skipitem, .skipbox { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; justify-content: space-between; padding: 12px 16px; border-radius: 14px; background: linear-gradient(135deg, var(--c1), var(--c2)); color: var(--ink); font-size: .92rem; font-weight: 500; }
.skipitem { grid-column: 2; }
.skipbox.big { margin: 0 0 18px; padding: 16px 20px; }
.q1 .skipitem, .field .skipitem { grid-column: auto; margin-top: 6px; }
.stem .skipitem { grid-column: 2; }
.stem .skipl { grid-column: 2; justify-self: start; }

/* ===== Seitenkopf-Zusätze ===== */
.lg-s h2 + p, .lg-s p + p { margin-top: 12px; }
.stmt { display: grid; grid-template-columns: auto 1fr; gap: 18px 22px; align-items: start; padding: 28px; border-radius: var(--r-lg); background: linear-gradient(135deg, var(--c1), var(--c2)); max-width: 56rem; }
.stmt .ib, .donate .ib { width: 46px; height: 46px; border-radius: 15px; background: var(--card); display: grid; place-items: center; }
.stmt p { margin-top: 10px; color: var(--ink); max-width: 62ch; }
.stmt .lg-note { background: none; padding: 0; font-weight: 600; }
.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 16px; }
.tile { display: flex; flex-direction: column; gap: 10px; padding: 24px; border-radius: var(--r-lg); background: linear-gradient(135deg, var(--c1), var(--c2)); text-decoration: none; transition: transform .2s; }
.tile:hover { transform: translateY(-3px); }
.tile .ib { width: 44px; height: 44px; border-radius: 14px; background: rgba(255,255,255,.75); display: grid; place-items: center; }
.tile h3 { font-size: 1.08rem; } .tile p { font-size: .93rem; color: var(--ink-2); }

/* ===== Spenden ===== */
.donate { display: grid; grid-template-columns: auto 1fr; gap: 18px 22px; align-items: start; padding: 28px; border-radius: var(--r-lg); background: var(--card); border: 1px solid var(--line); max-width: 56rem; margin: 34px 0 0; }
.donate .ib { background: var(--pink-soft); }
.donate h2 { font-size: 1.3rem; } .donate p { color: var(--ink-2); margin-top: 8px; max-width: 62ch; }
.donate .don-b { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 16px; }
.donate .mini-note { margin-top: 12px; }
.sec .donate { margin-top: 0; }

/* ===== Über mich ===== */
.gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: 14px; margin-top: 18px; }
.gfig { position: relative; margin: 0; border-radius: 20px; overflow: hidden; background: var(--mist); border: 1px solid var(--line); }
.gfig img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.gfig figcaption { padding: 10px 14px; font-size: .88rem; color: var(--ink-2); min-height: 2.4em; }
.gfig figcaption:empty { display: none; } body.editing .gfig figcaption:empty { display: block; }
.gfig .rm { display: none; position: absolute; top: 8px; right: 8px; width: 34px; height: 34px; border-radius: 50%; border: 0; background: rgba(255,255,255,.92); cursor: pointer; place-items: center; }
body.editing .gfig .rm { display: grid; }
.gempty { grid-column: 1 / -1; }
[data-gcap]:empty::before { content: attr(data-ph); color: var(--ink-3); }

/* ===== Downloads ===== */
.dl-all { display: flex; flex-wrap: wrap; gap: 16px 26px; align-items: center; justify-content: space-between; padding: 26px 28px; border-radius: var(--r-lg); background: linear-gradient(135deg, var(--c1), var(--c2)); }
.dl-all h2 { font-size: 1.3rem; margin-bottom: 4px; }
.dl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 14px; margin-top: 16px; }
.dl { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 16px 18px; border-radius: 20px; background: var(--card); border: 1px solid var(--line); }
.dl-n { width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center; font: 800 1rem/1 var(--f-head); background: linear-gradient(135deg, var(--c1), var(--c2)); }
.dl h3 { font-size: .98rem; line-height: 1.25; }
@media (max-width: 480px) { .dl { grid-template-columns: 52px minmax(0, 1fr); } .dl .btn { grid-column: 1 / -1; } }

/* ===== Hilfetools ===== */
.tool { padding: 28px; border-radius: var(--r-lg); background: var(--card); border: 1px solid var(--line); margin-top: 18px; }
.tool > h2 { font-size: 1.3rem; margin-bottom: 8px; } .tool > p { color: var(--ink-2); max-width: 62ch; margin-bottom: 14px; }
.tool.crisis { background: linear-gradient(135deg, var(--c1), var(--c2)); border-color: transparent; margin-top: 0; }
.tool.crisis > p { color: var(--ink); }
.numbers { display: grid; gap: 10px; margin: 12px 0; }
.numbers li { display: flex; flex-direction: column; gap: 2px; padding: 14px 18px; border-radius: 16px; background: rgba(255,255,255,.8); }
.numbers b { font: 700 .95rem/1.3 var(--f-head); } .numbers span { font: 700 1.2rem/1.4 var(--f-head); } .numbers small { color: var(--ink-2); font-size: .84rem; }
.breath { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 26px; align-items: center; }
.orb { width: 190px; height: 190px; border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle at 35% 30%, #fff, var(--c1) 45%, var(--c3)); box-shadow: 0 20px 60px -20px rgba(120,100,200,.45); transform: scale(.75); transition: transform 4s ease-in-out; text-align: center; }
.orb span { font: 700 1rem/1.3 var(--f-head); padding: 0 12px; }
.br-c { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.br-c select, .tool select { min-height: 44px; padding: 0 14px; border-radius: 12px; border: 1.5px solid var(--line-2); background: var(--card); max-width: 100%; margin-bottom: 8px; }
.timer { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.tmout { font: 800 2.6rem/1 var(--f-head); letter-spacing: -.02em; }
@media (max-width: 640px) { .breath { grid-template-columns: minmax(0, 1fr); justify-items: center; } .br-c { align-items: stretch; width: 100%; } .orb { width: 160px; height: 160px; } .stmt, .donate { grid-template-columns: minmax(0, 1fr); padding: 22px; } .tool { padding: 22px; } }

/* ===== Auswertung ===== */
.rep-top { display: grid; grid-template-columns: auto 1fr; gap: 22px 30px; align-items: center; padding: 28px; border-radius: var(--r-lg); background: linear-gradient(135deg, var(--c1), var(--c2)); }
.ring.big { width: 120px; height: 120px; } .ring.big::before { inset: 10px; background: var(--card); } .ring.big b { font-size: 1.5rem; }
.rep-top h2 { font-size: 1.3rem; margin-bottom: 6px; } .rep-act { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.rep-s { margin-top: 34px; } .rep-s > h2 { font-size: 1.3rem; margin-bottom: 14px; }
.rep-bars, .rep-tr { display: flex; flex-direction: column; gap: 10px; }
.rb { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) 64px; gap: 14px; align-items: center; font-size: .92rem; } .rb .bar { margin: 0; } .rb b { text-align: right; font-family: var(--f-head); font-size: .85rem; } .rb em { color: var(--ink-3); font-style: normal; }
.rep-tr { margin-bottom: 20px; } .rep-tr h3 { font-size: 1rem; }
.rep-wh { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 16px; } .rw { margin: 0; text-align: center; } .rw svg { max-width: 100%; height: auto; } .rw figcaption { font-size: .88rem; color: var(--ink-2); }
.chips-w { display: flex; flex-wrap: wrap; gap: 8px; }
.rep-d { border: 1px solid var(--line); border-radius: 18px; background: var(--card); margin-bottom: 10px; }
.rep-d summary { padding: 16px 20px; cursor: pointer; font: 700 1rem/1.4 var(--f-head); } .rep-d[open] summary { border-bottom: 1px solid var(--line); }
.rep-p { padding: 14px 20px 6px; } .rep-p h3 { font-size: .95rem; color: var(--ink-2); margin-bottom: 8px; }
.rep-qa { padding: 10px 0; border-top: 1px dashed var(--line-2); } .rep-qa b { font-weight: 600; font-size: .92rem; display: block; } .rep-qa p { white-space: pre-wrap; margin-top: 4px; }
@media (max-width: 640px) { .rep-top { grid-template-columns: minmax(0, 1fr); justify-items: start; padding: 22px; } .rb { grid-template-columns: minmax(0, 1fr) 60px; } .rb .bar { grid-column: 1 / -1; grid-row: 2; } .rb b { grid-row: 1; grid-column: 2; } }

/* ===== Footer / Nav ===== */
.foot .links { row-gap: 8px; }
.nav .lnk { padding: 10px 12px; }
@media (max-width: 1180px) { .nav .lnk.hide-m { display: none; } }
@media (max-width: 860px) { .nav .lnk { display: none; } .nav .btn.ico[href="#auswertung"] { display: none; } }
@media print {
  .skipl, .skiprow, .donate, .rep-act, .tool .btn, .tiles { display: none !important; }
  .rep-d { break-inside: avoid; } .rep-top { background: none; border: 1px solid #ccc; }
}

/* ===== Linktipps ===== */
.lk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 14px; margin-top: 14px; }
.lk { display: flex; flex-direction: column; gap: 8px; padding: 20px; border-radius: 20px; background: var(--card); border: 1px solid var(--line); }
.lk-h { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: flex-start; justify-content: space-between; } .lk-h h3 { font-size: 1.02rem; }
.lk p { color: var(--ink-2); font-size: .93rem; } .lk-host { font-size: .8rem !important; color: var(--ink-3) !important; }
.lk-badge { font: 600 .74rem/1 var(--f-body); padding: 6px 10px; border-radius: 99px; background: var(--mist); color: var(--ink-2); white-space: nowrap; }
.lk-badge.ad { background: var(--pink-soft); color: var(--ink); }
.lk-b { display: flex; flex-wrap: wrap; gap: 10px; margin-top: auto; padding-top: 6px; }
.adnote { margin-top: 0; }
/* ===== Leitfaden GdB ===== */
.gdb-act { margin: 18px 0 0; }
.gsteps { counter-reset: g; display: grid; gap: 16px; margin-top: 14px; }
.gsteps li { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 14px; align-items: start; }
.gsteps .gn { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; font: 800 .95rem/1 var(--f-head); background: linear-gradient(135deg, var(--c1), var(--c2)); }
.gsteps h3 { font-size: 1rem; margin-bottom: 4px; } .gsteps p { margin: 0; color: var(--ink-2); }
.gdb-t { min-width: 680px; } .gdb-t th, .gdb-t td { padding: 12px 14px; vertical-align: top; font-size: .92rem; line-height: 1.5; text-align: left; }
.gdb-t tbody th { font: 700 .9rem/1.4 var(--f-head); background: var(--mist); width: 17%; }
.gdb-t .mine .ta, .gdb-t td.mine .ta { min-width: 150px; }
.gsrc { display: grid; gap: 8px; margin-top: 12px; padding-left: 0; } .gsrc a { color: var(--ink); text-underline-offset: 3px; }
.lg-s ul li, .lg-s ol li { margin-top: 6px; }
@media print {
  .gdb .tbl-w { overflow: visible !important; border: 0; } .gdb-t { min-width: 0; width: 100%; font-size: 9.5pt; } .gdb-t th, .gdb-t td { border: 1px solid #999 !important; padding: 6px 8px; }
  .gdb section, .gdb tr { break-inside: avoid; } .gdb .chead { padding: 0 0 10px; } .gdb .crumb, .gdb-act, .lg-back, .lk-b { display: none !important; }
  .gdb .gsrc a::after { content: ' (' attr(href) ')'; font-size: 8pt; color: #555; }
  .gdb .ta textarea { border: 0 !important; }
}

/* ===== Karte, Sprungmarken, Weiterlesen ===== */
.mapbox { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: 24px 32px; align-items: start; margin: 18px 0 12px; }
.mapcol { display: flex; flex-direction: column; gap: 12px; }
.demap { width: 100%; height: auto; max-height: 560px; }
.demap path.st { fill: var(--c1); stroke: #fff; stroke-width: 1.6; cursor: pointer; transition: fill .15s; outline: none; }
.demap path.st:hover { fill: var(--rose); } .demap path.st.sel { fill: var(--pink); } .demap path.st:focus-visible { stroke: var(--ink); stroke-width: 3; }
.mapcol select { min-height: 46px; padding: 0 14px; border-radius: 12px; border: 1.5px solid var(--line-2); background: var(--card); width: 100%; }
.stinfo { padding: 24px; border-radius: var(--r-lg); background: var(--card); border: 1px solid var(--line); min-height: 220px; }
.stinfo h3 { font-size: 1.2rem; margin-bottom: 10px; } .stdl dt { font: 700 .88rem/1.3 var(--f-head); margin-top: 12px; } .stdl dd { margin: 4px 0 0; color: var(--ink-2); }
.st-links { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0 10px; }
.jump { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 0; }
.jump a { padding: 8px 14px; border-radius: 99px; border: 1px solid var(--line-2); background: var(--card); text-decoration: none; font-size: .88rem; font-weight: 500; } .jump a:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.xl-row { margin-top: 14px; font-size: .92rem; color: var(--ink-2); } .xl-row a { color: var(--ink); text-underline-offset: 3px; }
.related { margin-top: 44px; margin-bottom: 20px; } .related h2 { font-size: 1.2rem; margin-bottom: 14px; }
@media (max-width: 760px) { .mapbox { grid-template-columns: minmax(0, 1fr); } .demap { max-height: 420px; } }
@media print { .demap, .mapcol, .jump, .related { display: none !important; } .mapbox { display: block; } .stinfo { border: 1px solid #999; } .st-links { display: none; } }

/* ===== Quellen, Teilen, Feedback ===== */
.srcbtn { display: inline-flex; align-items: center; gap: 4px; font-size: .74rem; font-weight: 600; line-height: 1; padding: 6px 10px; margin: 4px 6px 0 0; border-radius: 999px; border: 1px solid var(--line-2); background: var(--card); color: var(--ink-2); text-decoration: none; vertical-align: middle; }
.srcbtn:hover { border-color: var(--ink); color: var(--ink); }
.srcbtn:focus-visible, .linkbtn:focus-visible { outline: 3px solid var(--pink); outline-offset: 2px; }
.srcrow { margin: 12px 0 0; display: flex; flex-wrap: wrap; align-items: center; }
.gdb-t th .srcbtn { display: flex; width: fit-content; margin-top: 6px; }
.numbers li .srcbtn { margin-top: 6px; }
.note .srcbtn, .pg-h .srcbtn { margin-top: 8px; }
.qlist { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 12px; }
.qi { background: var(--card); border: 1px solid var(--line); border-radius: 18px; padding: 18px 20px; scroll-margin-top: calc(var(--hdr) + 80px); }
.qi h3 { font-size: 1rem; margin: 0 0 6px; outline: none; }
.qd { margin: 0 0 8px; color: var(--ink-2); }
.ql { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0; }
.qm { font-size: .8rem; color: var(--ink-3); margin: 8px 0 0; }
.qno { font-size: .85rem; color: var(--ink-3); }
.qgd { color: var(--ink-3); margin: 4px 0 0; }
.qi.hl { border-color: var(--pink); box-shadow: 0 0 0 4px var(--pink-soft); animation: qhl 2.4s ease-out 1; }
@keyframes qhl { from { box-shadow: 0 0 0 10px var(--pink-soft); } to { box-shadow: 0 0 0 4px var(--pink-soft); } }
@media (prefers-reduced-motion: reduce) { .qi.hl { animation: none; } }
.qback { position: sticky; top: calc(var(--hdr) + 8px); z-index: 20; margin: 0 0 14px; }
.actions { margin-top: 28px; }
.act-box { display: grid; gap: 18px; padding: 20px 22px; border: 1px solid var(--line); border-radius: 20px; background: var(--card); }
.act-g { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.act-g > b { font-size: .92rem; min-width: 8.5rem; }
.act-b { display: flex; flex-wrap: wrap; gap: 8px; }
.pg-fb { margin-top: 18px; text-align: right; }
.linkbtn { background: none; border: 0; padding: 4px 0; font: inherit; font-size: .8rem; color: var(--ink-3); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.linkbtn:hover { color: var(--ink); }
.fl { display: block; font-weight: 600; font-size: .92rem; margin-bottom: 6px; }
select.pw, textarea.pw { width: 100%; font: inherit; }
textarea.pw { resize: vertical; min-height: 7em; }
.fbform { background: var(--card); border: 1px solid var(--line); border-radius: 22px; padding: clamp(18px, 4vw, 30px); }
@media (max-width: 560px) { .act-g > b { min-width: 0; width: 100%; } }
@media print { .actions, .pg-fb, .srcbtn, .srcrow, .qback { display: none !important; } .qi { break-inside: avoid; } }
.qi, .qi h3, .qd, .qm { overflow-wrap: anywhere; min-width: 0; }
.ql .btn { white-space: normal; text-align: left; max-width: 100%; height: auto; min-height: 36px; }
.qlist, .qi { max-width: 100%; }

/* ===== Zurückstellen, Favoriten, Stand, Pause, Sicherung ===== */
.laterbox { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin: 0 0 14px; padding: 12px 16px; border-radius: 14px; background: #fff4d6; border: 1.5px solid #f2d27a; color: var(--ink); font-size: .92rem; }
.laterbox .lb { font: 800 .78rem/1 var(--f-head); letter-spacing: .02em; padding: 7px 12px; border-radius: 999px; background: #f2b705; color: #3a2a00; }
.laterbox .lx { flex: 1 1 260px; min-width: 0; }
.laterbox.big { padding: 16px 20px; margin-bottom: 18px; }
.blk.later { box-shadow: -4px 0 0 #f2b705; padding-left: 14px; margin-left: -18px; border-radius: 4px; }
.pg.later { background-image: linear-gradient(#fffbee, #fffbee); }
.favb { display: inline-flex; align-items: center; gap: 6px; background: none; border: 0; padding: 4px 0; margin-right: auto; font: 500 .84rem/1.4 var(--f-body); color: var(--ink-2); cursor: pointer; min-height: 32px; }
.favb svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
.favb[aria-pressed="true"] { color: #a86d00; font-weight: 700; } .favb[aria-pressed="true"] svg { fill: #f2b705; stroke: #a86d00; }
.favb:hover { color: var(--ink); }
.btn.favb { margin-right: 0; padding: 0 18px; }
.skiprow { align-items: center; gap: 4px 18px; flex-wrap: wrap; } .skiprow.top { justify-content: flex-start; } .skiprow.top .skipl:last-child { margin-left: auto; }
.chintro { padding: 30px 0 0; }
.chintro h2 { font-size: 1.3rem; margin-bottom: 14px; }
.cigrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.cib { padding: 18px 20px; border-radius: 18px; background: var(--card); border: 1px solid var(--line); } .cib h3 { font-size: 1rem; margin-bottom: 8px; }
.cib.do { background: linear-gradient(135deg, var(--c1), var(--c3)); border-color: transparent; } .cib.dont { background: var(--mist); }
.ciall { display: flex; gap: 12px; align-items: flex-start; margin-top: 16px; padding: 14px 18px; border-radius: 14px; border: 1.5px dashed var(--line-2); color: var(--ink-2); font-size: .94rem; } .ciall .ic { width: 22px; height: 22px; flex: none; margin-top: 2px; fill: none; stroke: var(--pink-deep, #d6006f); stroke-width: 1.8; }
.stand3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.sbox { padding: 22px; border-radius: var(--r-lg, 24px); background: var(--card); border: 1px solid var(--line); min-width: 0; }
.sbox h2, .sbox h3 { display: flex; gap: 8px; align-items: center; font-size: 1.05rem; margin-bottom: 12px; } .sbox h2 { font-size: 1.3rem; } .sbox .ic { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; flex: none; }
.sbox.later { background: #fffbee; border-color: #f2d27a; } .sbox.fav { background: linear-gradient(135deg, #fff, #f6f2ff); }
.sbox p { margin-bottom: 12px; color: var(--ink-2); }
.mklist { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 10px; }
.mk { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: center; justify-content: space-between; padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,.75); border: 1px solid var(--line); }
.mk a { flex: 1 1 200px; min-width: 0; text-decoration: none; color: var(--ink); display: grid; gap: 2px; overflow-wrap: anywhere; } .mk a:hover b { text-decoration: underline; }
.mk small { color: var(--ink-3); font-size: .78rem; } .mk em { font-style: normal; font-size: .78rem; color: #8a6200; }
.pausecard { display: grid; grid-template-columns: auto 1fr; gap: 18px; margin: 34px 0 0; padding: 26px; border-radius: var(--r-lg, 24px); background: linear-gradient(135deg, var(--c1), var(--c2)); }
.pausecard .ib { width: 46px; height: 46px; border-radius: 15px; background: var(--card); display: grid; place-items: center; } .pausecard .ib .ic { width: 22px; height: 22px; fill: none; stroke: var(--ink); stroke-width: 1.8; }
.pausecard h2 { font-size: 1.3rem; margin-bottom: 8px; } .pausecard p { margin-bottom: 8px; } .pausecard .acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.pauseclock { font: 800 3rem/1 var(--f-head); text-align: center; margin: 22px 0 6px; letter-spacing: -.02em; }
.remind { position: fixed; z-index: 90; left: 16px; right: 16px; bottom: 16px; max-width: 420px; padding: 16px 18px; border-radius: 18px; background: var(--card); border: 1.5px solid var(--ink); box-shadow: 0 18px 50px rgba(26,32,29,.22); transform: translateY(24px); opacity: 0; pointer-events: none; transition: opacity .25s, transform .25s; }
.remind.on { transform: none; opacity: 1; pointer-events: auto; } .remind b { display: flex; gap: 8px; align-items: center; } .remind .ic { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; } .remind p { margin: 6px 0 10px; color: var(--ink-2); font-size: .94rem; } .remind .acts { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.radios { display: grid; gap: 10px; margin: 12px 0; } .radio { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--line); cursor: pointer; } .radio:has(input:checked) { border-color: var(--ink); background: var(--mist); }
.radio input { margin-top: 4px; accent-color: var(--ink); width: 18px; height: 18px; } .radio b { display: block; } .radio small { color: var(--ink-3); }
.remset { display: grid; gap: 8px; margin: 10px 0; } .remset label { font-weight: 600; font-size: .92rem; } .times { display: flex; flex-wrap: wrap; gap: 10px; } .times .in { width: auto; }
.bkflow { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 10px; align-items: stretch; margin: 16px 0; }
.bks { position: relative; display: grid; gap: 4px; justify-items: center; text-align: center; padding: 18px 12px 14px; border-radius: 16px; background: var(--mist); }
.bks svg { width: 44px; height: 44px; color: var(--ink); } .bks b { font-size: .92rem; } .bks small { color: var(--ink-3); font-size: .8rem; line-height: 1.35; }
.bkn { position: absolute; top: -9px; left: -9px; width: 26px; height: 26px; border-radius: 50%; background: var(--pink, #cf93a0); color: #fff; font: 800 .8rem/26px var(--f-head); text-align: center; }
.bka { display: grid; place-items: center; } .bka .ic { width: 20px; height: 20px; transform: rotate(-90deg); fill: none; stroke: var(--ink-3); stroke-width: 2; }
.bkstat { display: grid; gap: 4px; font-size: .88rem; color: var(--ink-2); padding: 12px 14px; border-radius: 12px; background: var(--mist); margin: 10px 0; }
@media (max-width: 760px) { .cigrid, .stand3 { grid-template-columns: 1fr; } .bkflow { grid-template-columns: 1fr; } .bka .ic { transform: none; } .pausecard { grid-template-columns: 1fr; } .blk.later { margin-left: 0; } }

/* ===== Mitmach-Module ===== */
.dotc { display: inline-block; width: 12px; height: 12px; border-radius: 50%; margin-right: 8px; vertical-align: -1px; border: 1px solid rgba(26,32,29,.25); }
.here svg, .brainm svg { width: 100%; height: auto; display: block; margin-bottom: 18px; max-width: 560px; }
.letter .paper { padding: 22px; border-radius: 6px 20px 20px 20px; background: #fffdf6; border: 1px solid #efe7c9; display: grid; gap: 12px; box-shadow: 0 10px 30px rgba(120,100,40,.08); }
.letter .line { display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; } .letter .line .in { flex: 1 1 200px; width: auto; }
.abtns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px 18px; margin-bottom: 18px; }
.abtn { display: grid; gap: 10px; justify-items: center; min-width: 0; }
.abtn .circ { width: 100%; aspect-ratio: 1; max-width: 190px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff, #e6d3d3 60%, #d9a3ae); border: 2px solid var(--ink); display: grid; place-items: center; padding: 16% 12%; box-shadow: 0 6px 0 var(--ink); }
.abtn textarea { width: 100%; height: 100%; border: 0; background: transparent; resize: none; text-align: center; font: 500 .84rem/1.3 var(--f-body); color: var(--ink); outline-offset: 4px; }
.abtn .segs { display: flex; flex-wrap: wrap; gap: 4px; justify-content: center; } .abtn .segs .opt { padding: 4px 9px; font-size: .74rem; min-height: 0; }
.facegrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 12px 0 20px; }
.chp.face { flex-direction: column; gap: 4px; padding: 12px 6px 10px; border-radius: 16px; height: auto; align-items: center; justify-content: center; font-size: .82rem; text-align: center; white-space: normal; }
.chp.face svg { width: 38px; height: 38px; } .chp.face::before { display: none !important; }
.pbox .pt { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; justify-content: space-between; padding-top: 10px; }
.pal { display: inline-flex; gap: 6px; align-items: center; }
.sw { width: 28px; height: 28px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px var(--line-2); cursor: pointer; padding: 0; } .sw[aria-pressed="true"] { box-shadow: 0 0 0 2.5px var(--ink); }
.sz { width: 32px; height: 32px; border-radius: 10px; border: 1px solid var(--line-2); background: var(--card); display: grid; place-items: center; cursor: pointer; padding: 0; } .sz[aria-pressed="true"] { border-color: var(--ink); background: var(--mist); } .sz i { display: block; border-radius: 50%; background: var(--ink); }
.decide .field.pro { background: #eaf8f1; border-radius: 16px; padding: 14px; } .decide .field.con { background: #fdecef; border-radius: 16px; padding: 14px; }
.stickies { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 18px; }
.sticky { padding: 16px; border-radius: 4px 4px 18px 4px; box-shadow: 0 8px 18px rgba(26,32,29,.08); display: grid; gap: 8px; min-width: 0; }
.sticky.c1 { background: #fff2b8; } .sticky.c2 { background: #d8f1e4; } .sticky.c3 { background: #d6e8fb; } .sticky.c4 { background: #f8d9ea; }
.neuh { margin: 34px 0 12px; font-size: 1.4rem; } .neul { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.neul li { display: grid; gap: 4px; padding: 14px 18px; border-radius: 16px; background: var(--card); border: 1px solid var(--line); } .neul li > span { color: var(--ink-2); }
@media (max-width: 760px) { .abtns { grid-template-columns: repeat(2, minmax(0, 1fr)); } .facegrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .stickies { grid-template-columns: 1fr; } }
@media print { .favb, .laterbox .skipl, .pausecard, .remind, .chintro .ciall { display: none !important; } }
.here svg, .brainm svg { border-radius: 22px; }

.wsdl { margin-top: 18px; display: flex; justify-content: flex-start; } @media print { .wsdl { display: none !important; } }

/* ===== Runde 3: Icon-Buttons, Badges, Erklärung/Aufgabe, kompakte mobile Ansicht ===== */
:root { --theo: #eaf0e6; --theo-ink: #2f4b3f; --task-ink: #8a4659; }
.ib2 { display: inline-flex; align-items: center; justify-content: center; height: 38px; min-width: 38px; padding: 0 10px; border-radius: 99px; border: 1px solid var(--line-2); background: var(--card); color: var(--ink-2); font: 600 .84rem/1 var(--f-body); cursor: pointer; transition: background .15s, color .15s, border-color .15s; }
.ib2 svg { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ib2 span { display: inline-block; max-width: 0; overflow: hidden; white-space: nowrap; opacity: 0; margin-left: 0; transition: max-width .28s ease, opacity .2s, margin .28s; }
.ib2:hover span, .ib2:focus-visible span { max-width: 260px; opacity: 1; margin-left: 8px; }
.ib2:hover { border-color: var(--ink); color: var(--ink); } .ib2.is-on, .ib2[aria-pressed="true"] { background: #fff4d6; border-color: #e3b93c; color: #8a5a00; } .ib2.is-on svg { fill: #f2b705; }
.ib2.favb { margin-right: 0; padding: 0 10px; min-height: 0; }
.skiprow, .skiprow.top { display: flex; justify-content: flex-end; gap: 8px; margin: 14px 0 0; flex-wrap: nowrap; } .skiprow.top { margin: 0 0 14px; }
.chead .icons { display: inline-flex; gap: 8px; } .chead .row { gap: 8px 10px; }
.stem .ib2, .q1 .ib2, .field .ib2 { height: 32px; min-width: 32px; margin-top: 6px; }
.kb { display: inline-block; font: 700 .68rem/1 var(--f-head); letter-spacing: .04em; text-transform: uppercase; padding: 5px 9px; border-radius: 99px; white-space: nowrap; }
.kb.theory { background: #e3e8e1; color: var(--theo-ink); } .kb.task { background: #f4e1e3; color: var(--task-ink); }
.blk > .kb { position: absolute; top: -10px; right: 12px; z-index: 2; box-shadow: 0 0 0 3px var(--card); }
.pbd { position: absolute; top: 0; right: 0; display: flex; gap: 6px; } .pg-h { position: relative; }
.blk.theory { background: var(--theo); border-radius: 18px; padding: 22px 18px 18px; }
.blk.theory > .kb { box-shadow: 0 0 0 3px var(--theo); }
.blk.theory .idea, .blk.theory .say, .blk.theory .card { background-color: rgba(255,255,255,.72); }
.blk.task { padding-top: 6px; }
.laterbox .lx { font-size: .9rem; }
@media (max-width: 760px) {
  :root { --gut: 14px; --gut-r: 14px; }
  body { font-size: 15px; line-height: 1.55; }
  .sec { padding: 30px 0; } .sec-h { margin-bottom: 18px; } .sec-h h2 { font-size: 1.55rem; } .sec-h p { font-size: .98rem; margin-top: 8px; }
  .hero { padding: 34px 0 70px; } .hero h1 { font-size: 2.5rem; margin: 14px 0 12px; } .hero .cta { margin-top: 20px; } .stats { margin-top: 24px; }
  .chead { padding: 22px 0 20px; } .chead .big { font-size: 3rem; } .chead h1 { font-size: 1.7rem; margin-top: 6px; } .chead .quote { margin-top: 10px; font-size: .98rem; } .chead .row { margin-top: 16px; }
  .chintro { padding-top: 16px; } .chintro h2 { font-size: 1.05rem; margin-bottom: 8px; } .cigrid { gap: 8px; } .cib { padding: 12px 14px; border-radius: 14px; } .cib h3 { font-size: .9rem; margin-bottom: 4px; } .cib p { font-size: .9rem; }
  .ciall { margin-top: 8px; padding: 10px 12px; font-size: .84rem; gap: 8px; }
  .layout { padding-top: 14px; padding-bottom: 36px; gap: 10px; }
  .pages { gap: 0; margin: 0 calc(-1 * var(--gut)); }
  .pg { border: 0; border-radius: 0; padding: 22px var(--gut) 20px; border-top: 8px solid var(--mist); background: var(--card); }
  .pg:first-child { border-top: 0; }
  .pg-h { margin-bottom: 14px; padding-top: 2px; } .pg-n { margin-bottom: 8px; font-size: .72rem; } .pg h2 { font-size: 1.3rem; } .pg .sub { margin-top: 6px; font-size: .94rem; }
  .pbd { top: -4px; }
  .blk { margin-top: 14px; }
  .blk.theory { margin-left: calc(-1 * var(--gut)); margin-right: calc(-1 * var(--gut)); border-radius: 0; padding: 22px var(--gut) 16px; }
  .blk > .kb { right: var(--gut); }
  .blk.later { margin-left: 0; box-shadow: none; padding-left: 0; }
  .idea { padding: 16px 16px; border-radius: 16px; } .idea p { font-size: 1.02rem; } .say { padding: 14px 16px; border-radius: 16px; font-size: 1rem; }
  .card { padding: 14px 15px; border-radius: 16px; gap: 7px; } .cards { gap: 9px; } .card p, .card ul.l li { font-size: .9rem; }
  .field, .q1, .stem { gap: 4px; } .fields { gap: 12px; }
  .motto { margin-top: 18px; padding-top: 12px; font-size: .88rem; } .pg-fb { margin-top: 8px; }
  .toc { padding: 8px 0; } .toc a { padding: 6px 12px; font-size: .84rem; }
  .pausecard { margin: 18px 0 0; padding: 16px; gap: 10px; } .stmt, .donate, .privacy, .sbox { padding: 16px; } .stand3 { gap: 10px; }
  .nextch { margin-top: 14px; gap: 10px; } .laterbox { padding: 10px 12px; margin-bottom: 10px; }
  .wsdl { margin-top: 12px; }
}
@media print { .ib2, .kb, .pbd { display: none !important; } .blk.theory { background: none; padding: 0; } }
.blk.theory + .blk.theory { margin-top: 0; padding-top: 4px; border-top-left-radius: 0; border-top-right-radius: 0; } .blk.theory + .blk.theory > .kb { display: none; }
.blk.theory:has(+ .blk.theory) { padding-bottom: 8px; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
@media (max-width: 760px) { .blk.theory + .blk.theory { margin-top: 0; padding-top: 4px; } .blk.theory:has(+ .blk.theory) { padding-bottom: 8px; } }

/* ===== Tagesklinik ===== */
.tkhead{background:#fff;border:1px solid var(--line,#e6e3f0);border-radius:16px;padding:16px;margin:14px 0}
.tkset{display:flex;gap:14px;flex-wrap:wrap}.tkset>div{flex:1 1 180px}
.tkend{margin:12px 0 0;display:flex;flex-direction:column;gap:2px}.tkend small{color:var(--ink-3);font-size:.8rem}
.tktabs{display:flex;gap:6px;overflow-x:auto;border-bottom:1px solid var(--line,#e6e3f0);margin:16px 0}
.tktabs button{background:none;border:0;padding:10px 14px;font:inherit;font-weight:600;color:var(--ink-3);cursor:pointer;border-bottom:3px solid transparent;white-space:nowrap}
.tktabs button[aria-selected=true]{color:#8a4659;border-bottom-color:#ff2d8a}
.tkweeks{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px}
.tkw{flex:0 0 auto;background:#fff;border:1px solid var(--line,#e6e3f0);border-radius:12px;padding:8px 12px;cursor:pointer;font:inherit;display:flex;flex-direction:column;align-items:center;gap:1px}
.tkw small{font-size:.7rem;color:var(--ink-3)}.tkw[aria-selected=true]{background:#f4e1e3;border-color:#ff2d8a;color:#8a4659}
.tkbar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:10px 0}.tkbtns{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.tkgrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;align-items:start}
.tkd{background:#fff;border:1px solid var(--line,#e6e3f0);border-radius:14px;padding:10px}.tkd.pre{opacity:.55}
.tkd summary{display:flex;align-items:baseline;gap:6px;cursor:pointer;list-style:none;margin-bottom:6px}.tkd summary small{color:var(--ink-3);font-size:.75rem}.tkc{margin-left:auto;font-size:.75rem;color:var(--ink-3)}
.tkl{display:flex;flex-direction:column;gap:6px;margin-bottom:8px}
.tke{text-align:left;background:#f6f4fb;border:1px solid transparent;border-radius:10px;padding:8px;font:inherit;cursor:pointer;display:flex;flex-direction:column;gap:2px}.tke:hover{border-color:#ff2d8a}
.tke .tt{font-size:.75rem;color:#2a4fa8;font-weight:600}.tke .tm{font-size:.78rem;color:var(--ink-3)}.tkh{font-size:.75rem;color:#8a4659}
.tkform{background:#fff;border:1px solid var(--line,#e6e3f0);border-radius:14px;padding:14px;margin:10px 0;display:flex;flex-direction:column;gap:8px}.tkform label,.tkset label,.dlg label{font-size:.82rem;font-weight:600}
.tkrow{display:flex;gap:10px;flex-wrap:wrap}.tkrow>*{flex:1 1 160px}
.tkhw{list-style:none;padding:0;margin:8px 0;display:flex;flex-direction:column;gap:6px}
.tkhw li{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line,#e6e3f0);border-radius:12px;padding:10px}.tkhw li>div{flex:1;min-width:0}.tkic{width:44px;height:44px;border-radius:10px;object-fit:cover;flex:none;background:var(--mist)}.tkhw small{display:block;color:var(--ink-3);font-size:.78rem}.tkhw li.done b{text-decoration:line-through;opacity:.6}
.tkh3{font-size:1rem;margin:16px 0 4px}.tkimg{max-width:100%;border-radius:12px;border:1px solid var(--line,#e6e3f0)}
.tkchip button{background:none;border:0;cursor:pointer;margin-left:4px;padding:0;line-height:1}.tkchip .ic{width:12px;height:12px}.chips-w{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0}
.in{width:100%;font:inherit;padding:9px 10px;border:1px solid var(--line,#d9d5e8);border-radius:10px;background:#fff}
@media (max-width:900px){.tkgrid{grid-template-columns:1fr}}
@media print{body.tkprint *{visibility:hidden}}

/* ===== Design selftherapy: Olive, warmes Off-White, Zeichen ===== */
.logo .mk { width: 34px; height: 34px; flex: none; display: block; }
.logo i { display: none; }
.foot { background: var(--olive); color: #e9efe9; border-top: 0; }
.foot a { border-bottom-color: rgba(246,244,239,.4); } .foot a:hover { border-color: var(--paper); }
.foot .links a, .foot span { color: var(--paper); }
:where(.pg, .legal, .lg-s, .privacy, .sec) a:not(.btn):not(.tile):not(.lt):not([class*=lk]) { color: var(--olive); }
::selection { background: var(--pink-soft); color: var(--ink); }
.top .logo svg.mk, .logo svg.mk { width: 36px; height: 36px; padding: 0; margin: 0; background: none; border: 0; border-radius: 0; box-shadow: none; }

/* ===== Darstellung (html[data-look]) ===== */
.lookl { display: grid; gap: 10px; margin: 14px 0; }
.lookb { display: flex; gap: 14px; align-items: center; text-align: left; padding: 12px 14px; border: 1.5px solid var(--line-2); border-radius: 16px; background: var(--card); cursor: pointer; }
.lookb[aria-checked="true"] { border-color: var(--ink); box-shadow: 0 0 0 3px var(--pink-soft); }
.lookb small { display: block; color: var(--ink-3); font-size: .8rem; line-height: 1.35; }
.lookb i { width: 44px; height: 44px; border-radius: 14px; flex: none; }
.lk-zart { background: linear-gradient(135deg, #eaeee4, #f4ebe0); } .lk-neutral { background: #e3e9df; } .lk-aquarell { background: linear-gradient(135deg, #e3e8e1, #e6d3d3 60%, #efe2d9); }
@media (max-width: 760px) { .nav .look-btn { display: none; } }

/* Zart (Standard): dieselben Farben, stark mit dem Hintergrund verdünnt */
html[data-look="zart"] { --c1: color-mix(in srgb, #e3e8e1 55%, var(--paper)); --c2: color-mix(in srgb, #d3dccf 55%, var(--paper)); --c3: color-mix(in srgb, #efe2d9 55%, var(--paper)); }
html[data-look="zart"] .h0 { --c1: color-mix(in srgb, #e3e8e1 55%, var(--paper)); --c2: color-mix(in srgb, #e6d3d3 45%, var(--paper)); --c3: color-mix(in srgb, #dbe5ea 55%, var(--paper)); }
html[data-look="zart"] .h1 { --c1: color-mix(in srgb, #dbe5ea 55%, var(--paper)); --c2: color-mix(in srgb, #d3dccf 55%, var(--paper)); --c3: color-mix(in srgb, #e3e8e1 55%, var(--paper)); }
html[data-look="zart"] .h2 { --c1: color-mix(in srgb, #d3dccf 55%, var(--paper)); --c2: color-mix(in srgb, #dbe5ea 55%, var(--paper)); --c3: color-mix(in srgb, #efe2d9 45%, var(--paper)); }
html[data-look="zart"] .h3 { --c1: color-mix(in srgb, #efe2d9 50%, var(--paper)); --c2: color-mix(in srgb, #e6d3d3 40%, var(--paper)); --c3: color-mix(in srgb, #efe2d9 45%, var(--paper)); }
html[data-look="zart"] .h4 { --c1: color-mix(in srgb, #e6d3d3 40%, var(--paper)); --c2: color-mix(in srgb, #e3e8e1 55%, var(--paper)); --c3: color-mix(in srgb, #efe2d9 45%, var(--paper)); }


/* Neutral: nur Olivtöne, Pink bleibt bei Buttons und Markierungen */
html[data-look="neutral"], html[data-look="neutral"] .h0, html[data-look="neutral"] .h1, html[data-look="neutral"] .h2, html[data-look="neutral"] .h3, html[data-look="neutral"] .h4 { --c1: #e6ebe1; --c2: #dfe7dd; --c3: #e9ece3; --pink-soft: #e9efe6; }
html[data-look="neutral"] .hero-art { filter: saturate(.35); opacity: .8; }
html[data-look="neutral"] .eyebrow::before, html[data-look="neutral"] .say::before, html[data-look="neutral"] .lg-s li::marker { background: var(--olive); color: var(--olive); }
html[data-look="neutral"] .kb.task { background: #e9efe6; color: var(--olive); }
html[data-look="neutral"] .chp[aria-pressed="true"]::before, html[data-look="neutral"] .toc a.act .dot { background: var(--sage); border-color: var(--sage); }
html[data-look="neutral"] .btn.pink { box-shadow: none; }
html[data-look="neutral"] .logo .mk circle:last-child { fill: #cf93a0; }
@media print { html[data-look] { --c1: #eef1ea; --c2: #e8eee6; --c3: #f1efe6; } }

/* ===== Buttons: nur pinker Rahmen, Text in ink ===== */
.btn.pink { background: transparent; border: 2px solid var(--pink-line); color: var(--ink); box-shadow: none; }
.btn.pink:hover, .btn.pink:focus-visible { background: var(--pink-soft); border-color: var(--pink-line); color: var(--ink); }
.btn.pink:active { background: #f0d9dc; }
.edbar .btn.pink, .edbar .btn.pink:hover { background: transparent; color: #fff; border-color: #d9a3ae; }
.edbar .btn.pink:hover { background: rgba(176,106,121,.22); }
html[data-look="neutral"] .btn.pink:hover { background: #e9efe6; }

/* Untertitel */
.hero .subtitle { font: 600 clamp(1.15rem, 2.4vw, 1.6rem)/1.3 var(--f-head); color: var(--olive); letter-spacing: -.01em; margin: 10px 0 0; }
.logo .lt2 { display: flex; flex-direction: column; gap: 3px; } .logo .lt2 small { font: 500 .68rem/1 var(--f-body); letter-spacing: .01em; color: var(--ink-3); }
.hero .subtitle + .lead { margin-top: 18px; }
.hero h1:has(+ .subtitle) { margin-bottom: 0; }
.hero .subtitle { margin-top: 8px; }
@media (max-width: 760px) { .hero h1:has(+ .subtitle) { margin-bottom: 0; } .hero .subtitle { margin-top: 6px; } }

/* ===== Kapitelfarben (je Kapitel eine eigene, gedämpfte Farbe) ===== */
:root { --mx1: 26%; --mx2: 16%; --mx3: 11%; }
html[data-look="aquarell"] { --mx1: 44%; --mx2: 30%; --mx3: 20%; }
html[data-look="neutral"] { --hb: #8fa899; --mx1: 22%; --mx2: 14%; --mx3: 10%; }
.k0 { --base: var(--hb, #b7c2ae); }
.k1 { --base: var(--hb, #e0bb6a); }
.k2 { --base: var(--hb, #9fb8c4); }
.k3 { --base: var(--hb, #a4b596); }
.k4 { --base: var(--hb, #c18472); }
.k5 { --base: var(--hb, #7f94a6); }
.k6 { --base: var(--hb, #b08b92); }
.k7 { --base: var(--hb, #d5aa5c); }
.k8 { --base: var(--hb, #8fa68f); }
.k9 { --base: var(--hb, #b9877f); }
.k10 { --base: var(--hb, #a9b8ac); }
.k11 { --base: var(--hb, #c99884); }
.k12 { --base: var(--hb, #6f8497); }
.k13 { --base: var(--hb, #b3b087); }
.k14 { --base: var(--hb, #8a9a88); }
.k0,
.k1,
.k2,
.k3,
.k4,
.k5,
.k6,
.k7,
.k8,
.k9,
.k10,
.k11,
.k12,
.k13,
.k14 { --c1: color-mix(in srgb, var(--base) var(--mx1), var(--paper)); --c2: color-mix(in srgb, var(--base) var(--mx2), var(--paper)); --c3: color-mix(in srgb, var(--base) var(--mx3), var(--paper)); --ch: color-mix(in srgb, var(--base) 70%, #1a201d); }

.chead { background: var(--c1); border-bottom: 3px solid var(--ch); }
.chc .art { background: var(--c1); }
html[data-look="aquarell"] .chead { background: radial-gradient(50% 90% at 10% 10%, var(--c1), transparent 70%), radial-gradient(45% 80% at 90% 20%, var(--c2), transparent 70%), var(--card); }
html[data-look="aquarell"] .chc .art { background: radial-gradient(60% 90% at 15% 20%, var(--c1), transparent 70%), radial-gradient(55% 80% at 85% 30%, var(--c2), transparent 70%), #fff; }
.chart { position: absolute; pointer-events: none; color: var(--ch); }
.chart svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.chead .chart { right: max(var(--gut-r), calc(50% - 600px)); top: 50%; transform: translateY(-50%); width: clamp(120px, 20vw, 250px); height: clamp(120px, 20vw, 250px); opacity: .45; }
.chc .art .chart { right: 18px; top: 50%; transform: translateY(-50%); width: 84px; height: 84px; opacity: .6; }
.chc .num { color: var(--ch); }
.chc .bar i, .cprog .bar i { background: var(--ch); }
.chc.is-last { box-shadow: 0 0 0 2px var(--ch); }
.lastb { position: absolute; left: 14px; top: 12px; font: 700 .68rem/1 var(--f-head); letter-spacing: .03em; padding: 6px 10px; border-radius: 99px; background: var(--card); color: var(--ch); border: 1.5px solid var(--ch); }
.toc a.resume { box-shadow: 0 0 0 1.5px var(--ch); background: var(--card); } .toc a.resume .dot { border-color: var(--ch); }
.rsm { font-style: normal; font: 700 .64rem/1 var(--f-head); padding: 4px 7px; border-radius: 99px; background: var(--ch); color: #fff; margin-left: auto; white-space: nowrap; align-self: center; }
.resumeb { display: inline-block; font: 700 .72rem/1 var(--f-head); padding: 6px 11px; border-radius: 99px; border: 1.5px solid var(--ch); color: var(--ch); background: var(--card); margin: 0 8px 8px 0; }
.pg-n::before { background: var(--ch); }
.k0 .nextch a:hover, .chead + * a:focus-visible { outline-color: var(--ch); }
@media (max-width: 760px) { .chead .chart { width: 96px; height: 96px; top: 22px; transform: none; right: var(--gut-r); opacity: .5; } .chc .art .chart { width: 70px; height: 70px; } }
@media print { .chart, .lastb, .rsm, .resumeb { display: none !important; } }

/* ===== Ruhige Flächen: kein Farbverlauf (Zart und Neutral) ===== */
html[data-look="zart"] :is(.k0,.k1,.k2,.k3,.k4,.k5,.k6,.k7,.k8,.k9,.k10,.k11,.k12,.k13,.k14,.h0,.h1,.h2,.h3,.h4), html[data-look="neutral"] :is(.k0,.k1,.k2,.k3,.k4,.k5,.k6,.k7,.k8,.k9,.k10,.k11,.k12,.k13,.k14,.h0,.h1,.h2,.h3,.h4) { --c2: var(--c1); --c3: var(--c1); }
.hero-art svg { animation-duration: 60s; }
@media (max-width: 760px) { .hero-art { opacity: .5; } }

/* ===== Logo IHEMIR ===== */
.logo { gap: 12px; }
.logo svg.mk { width: 40px; height: 40px; flex: none; display: block; padding: 0; margin: 0; background: none; border: 0; border-radius: 0; box-shadow: none; }
.logo .lt2 { display: flex; flex-direction: column; gap: 5px; }
.logo .lt2 b { font: 400 1.12rem/1 var(--f-head); letter-spacing: .32em; color: #4a3628; margin-right: -.32em; }
.logo .lt2 small { font: 500 .56rem/1 var(--f-body); letter-spacing: .26em; text-transform: uppercase; color: var(--ink-3); }
@media (max-width: 420px) { .logo .lt2 small { display: none; } .logo .lt2 b { font-size: 1rem; } }
.ihl { max-width: 520px; margin: 4px 0 26px; } .ihl svg { width: 100%; height: auto; display: block; }
.ihp { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; max-width: 520px; margin: 0 0 22px; }
.ihp div { background: var(--card); border: 1px solid var(--line); border-radius: var(--r-md); padding: 16px 14px; text-align: center; }
.ihp b { display: block; font: 300 2.1rem/1 var(--f-head); letter-spacing: .12em; color: #4a3628; margin-right: -.12em; }
.ihp span { display: block; margin-top: 8px; font-size: .86rem; color: var(--ink-3); }
.ihz { display: flex; flex-direction: column; gap: 12px; }
.ihz li { padding-left: 4px; }
.ihm { width: 72px; height: 72px; margin: 0 0 12px; display: block; }
@media print { .ihl, .ihp { break-inside: avoid; } }

/* Täglich */
.tktabs button[aria-selected=true]{color:var(--task-ink);border-bottom-color:var(--pink-line)}
.tdnav{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin:6px 0 4px}.tdnav label{display:block;font-size:.8rem;font-weight:600;margin-bottom:4px}
.tdpage .daily > .box.full:first-child{display:none}
.tdrange{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 18px}
.tdstats{display:flex;gap:28px;flex-wrap:wrap;margin:8px 0 14px}.tdstats b{display:block;font:800 1.9rem/1.1 var(--f-head)}.tdstats span{font-size:.85rem;color:var(--ink-3)}
.tdcols{display:grid;grid-template-columns:1fr 1fr;gap:22px}@media(max-width:700px){.tdcols{grid-template-columns:1fr}}
.tdline{width:100%;height:auto;max-width:640px}.tdline polyline{stroke:var(--pink-line);stroke-width:2.5}.tdline circle{fill:var(--pink-line)}.tdline .g{stroke:var(--line,#e6e3f0)}.tdline text{font-size:11px;fill:var(--ink-3)}
.tdpos{list-style:none;padding:0;margin:0}.tdpos li{padding:6px 0;border-bottom:1px solid var(--line,#e6e3f0)}.tdpos b{margin-right:8px}
@media print{.tdrange,.tktabs,.rep-act{display:none!important}}
.tdpage .bar i{background:var(--pink-line)}

/* Tagesklinik: Termine übernehmen, Stundenplan zum Drucken */
.tkcpt{border-collapse:collapse;width:100%;font-size:.9rem}.tkcpt th,.tkcpt td{padding:6px 8px;text-align:center;border-bottom:1px solid var(--line,#e6e3f0)}.tkcpt th[scope=row]{text-align:left}.tkcpt input{width:20px;height:20px}.tkcpt small{color:var(--ink-3)}
.tkmode{border:0;padding:0;margin:12px 0;display:flex;flex-direction:column;gap:6px}.tkmode label{font-weight:500}
.tkfig{margin:10px 0}.tkfig .btn{margin-top:6px}
.tkprintsheet{display:none}.tksheet{margin:0 0 18px;break-inside:avoid}.tksheet h3{font-size:1rem;margin:0 0 6px}
.tkst{width:100%;border-collapse:collapse;table-layout:fixed;font-size:.82rem}.tkst th,.tkst td{border:1px solid #8a8f88;padding:6px;vertical-align:top;text-align:left}.tkst th{background:#eef1ea}.tkst th small{display:block;font-weight:500}
.tse{margin-bottom:6px}.tse small{color:#555}.tksr{font-size:.8rem;margin-top:6px}
.rep .tksheet{overflow-x:auto}
@media print{
  .tkpage .tkbody,.tkpage .tktabs,.tkpage .tkhead,.tkpage .tkpriv{display:none!important}
  .tkprintsheet{display:block}.tksheet{page-break-after:always}.tksheet:last-child{page-break-after:auto}
  .tkpage .sec{display:block!important;padding:0}.tkpage .wrap{padding:0;max-width:none!important;width:100%}.tkst{width:100%}
}

/* Lageplan */
.lpfig{margin:8px 0 18px;max-width:46rem}.lpsvg{width:100%;height:auto;max-height:78vh;background:#fff;border:1px solid var(--line,#e6e3f0);border-radius:12px}.lpsvg.site{max-height:none}
.lpsvg .lr{fill:#fbfaf6;stroke:#6b716e;stroke-width:5}.lpsvg .lc{fill:#cfdccd}.lpsvg .lt{font:600 26px var(--f-head);fill:#4a504c}.lpsvg .lt.b{font-size:34px;fill:#2b4a8a;font-weight:800;paint-order:stroke;stroke:#fff;stroke-width:9px}.lpsvg .lt2{font:600 14px var(--f-head);fill:#3b413d}.lpsvg .lt2.w{fill:#fff}
.lpleg{list-style:none;padding:0;margin:10px 0;display:flex;flex-wrap:wrap;gap:8px 20px;font-size:.88rem}.lpleg li{display:flex;align-items:center;gap:8px}.lsw{width:22px;height:22px;border-radius:4px;display:inline-block;box-sizing:border-box}.lsw.dot{background:#2b4a8a;border-radius:50%}

/* Menü: Dropdowns, Handy-Menü, Fußbereich */
.dd{position:relative}.dd .lnk{display:inline-flex;align-items:center;gap:2px}.dd .lnk .ic{width:14px;height:14px;transition:transform .15s}.dd .lnk[aria-expanded=true] .ic{transform:rotate(180deg)}
.ddp{position:absolute;right:0;top:calc(100% + 8px);min-width:250px;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:10px;z-index:60}
.ddp[hidden]{display:none}.ddp h2{font:600 .78rem/1.2 var(--f-head);color:var(--ink-3);margin:8px 10px 2px}.ddp h2:first-child{margin-top:2px}
.ddl a{display:block;padding:9px 12px;border-radius:10px;text-decoration:none;font-weight:500;font-size:.94rem;color:var(--ink)}.ddl a:hover,.ddl a:focus-visible{background:var(--mist)}
.cmh{font:700 .8rem/1.2 var(--f-head);color:var(--ink-3);margin:18px 10px 6px}.cmh:first-child{margin-top:0}
@media (max-width:1060px){.nav .lnk{padding:10px 8px;font-size:.9rem}}
@media (max-width:860px){.dd{display:none}}
.foot .wrap{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:28px 36px;justify-content:stretch}
.fbrand{display:flex;flex-direction:column;gap:4px}.fbrand b{font:800 1.2rem/1 var(--f-head);letter-spacing:.2em}.fbrand .fmotto{margin-top:8px;opacity:.85}
.fcol{display:flex;flex-direction:column;gap:8px;align-items:flex-start}.fcol h2{font:700 .8rem/1.2 var(--f-head);color:#cbd8cd;margin:0 0 4px}
.flegal{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px 22px;padding-top:18px;border-top:1px solid rgba(246,244,239,.25)}
@media (max-width:860px){.foot .wrap{grid-template-columns:1fr 1fr}.fbrand{grid-column:1/-1}}
@media (max-width:480px){.foot .wrap{grid-template-columns:1fr}}

/* Lageplan: interaktiv, wie die Deutschlandkarte */
.lpseg{display:flex;gap:6px;margin:8px 0 14px;flex-wrap:wrap}.lpseg button{border:1.5px solid var(--line-2);background:var(--card);border-radius:99px;padding:8px 16px;font:600 .9rem var(--f-head);cursor:pointer;color:var(--ink-2)}.lpseg button[aria-selected=true]{border-color:var(--pink-line);background:var(--pink-soft);color:var(--pink-deep)}
.lpbox{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:20px 28px;align-items:start}.lpcol{display:flex;flex-direction:column;gap:12px}
.lpmap{width:100%;height:auto;max-height:520px}.lpmap .lpin{fill:var(--paper);stroke:var(--line-2);stroke-dasharray:4 5}.lpmap .lpflur{fill:var(--mist)}
.lpa{cursor:pointer;outline:none}.lpa rect{fill:var(--c1);stroke:#fff;stroke-width:3;transition:fill .15s}.lpa.tkr rect{fill:#d3dccf}.lpa:hover rect{fill:var(--rose)}.lpa.sel rect{fill:var(--pink)}.lpa:focus-visible rect{stroke:var(--ink);stroke-width:3}
.lpa text{font-family:var(--f-head);font-weight:600;fill:var(--ink);pointer-events:none}
.lpcol select{min-height:46px;padding:0 14px;border-radius:12px;border:1.5px solid var(--line-2);background:var(--card);width:100%}
.lpinfo2{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg,22px);padding:20px 22px;min-height:7rem}.lpinfo2 h3{margin:0 0 8px;font-size:1.15rem}.lpinfo2 p{margin:0 0 10px}
.lpdet{margin:22px 0;border:1px solid var(--line,#e6e3f0);border-radius:14px;padding:4px 14px;background:var(--card)}.lpdet summary{cursor:pointer;font-weight:600;padding:10px 0}
.lpsvg .lr{fill:#e8ece8;stroke:#fff;stroke-width:6}
@media (max-width:760px){.lpbox{grid-template-columns:minmax(0,1fr)}}
@media print{.lpseg,.lpcol select{display:none!important}.lpbox{display:block}.lpdet[open] summary{display:none}}

/* ===== Sechs Themenwelten ===== */
:root { --w1: #6f9bc4; --w2: #8db58a; --w3: #dcae52; --w4: #cf7f66; --w5: #cf93a0; --w6: #9487c0; }
.k0, .k1, .k2 { --base: var(--hb, var(--w1)); } .k3, .k4 { --base: var(--hb, var(--w2)); } .k5, .k6, .k7 { --base: var(--hb, var(--w3)); }
.k8, .k9, .k10 { --base: var(--hb, var(--w4)); } .k11, .k12 { --base: var(--hb, var(--w5)); } .k13, .k14 { --base: var(--hb, var(--w6)); }
.kx { --base: var(--hb, #8a9a88); --c1: color-mix(in srgb, var(--base) var(--mx1), var(--paper)); --c2: color-mix(in srgb, var(--base) var(--mx2), var(--paper)); --c3: color-mix(in srgb, var(--base) var(--mx3), var(--paper)); --ch: color-mix(in srgb, var(--base) 70%, #1a201d); }
html[data-look="zart"] .kx, html[data-look="neutral"] .kx { --c2: var(--c1); --c3: var(--c1); }
:root { --mx1: 30%; --mx2: 20%; --mx3: 12%; }
.sk { width: 100%; height: auto; display: block; fill: none; stroke: var(--ch); stroke-width: 3.8; stroke-linecap: round; stroke-linejoin: round; filter: url(#sketchf); overflow: visible; }
.sk .f { fill: var(--base); stroke: none; opacity: .5; } .sk .f2 { fill: var(--ch); stroke: none; opacity: .75; }
cite.qa { display: block; font: 500 .8rem/1.4 var(--f-body); font-style: normal; color: var(--ink-2); margin-top: 8px; } cite.qa::before { content: '– '; }
.chead .qa { margin-top: 8px; font-size: .86rem; color: var(--ink-2); }
.leit blockquote cite.qa { margin: 0; }
.leits .lt cite.qa, .rep-s blockquote cite.qa { font-size: .74rem; margin-top: 4px; }

/* Welt-Abschnitte auf der Startseite */
.worlds { position: relative; }
.world { position: relative; padding: clamp(64px, 9vw, 116px) 0 clamp(56px, 8vw, 96px); background: var(--c1); --wprev: var(--paper); }
.world::before { content: ''; position: absolute; left: 0; right: 0; top: -1px; height: clamp(36px, 5.5vw, 72px); background: var(--wprev); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1440V30C1180 100 900 0 640 48S200 84 0 30Z'/%3E%3C/svg%3E") center/100% 100% no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1440V30C1180 100 900 0 640 48S200 84 0 30Z'/%3E%3C/svg%3E") center/100% 100% no-repeat; }
.world:nth-of-type(odd)::before { transform: scaleX(-1); }
.world-h { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 20px 56px; align-items: center; margin-bottom: 44px; }
.world:nth-of-type(even) .world-h { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); } .world:nth-of-type(even) .world-t { order: 2; }
.world-t h3 { font: 800 clamp(2rem, 4.4vw, 3.3rem)/1.05 var(--f-head); letter-spacing: -.035em; color: var(--ink); margin: 10px 0 14px; }
.world-t p { font-size: 1.1rem; color: var(--ink-2); max-width: 32rem; }
.wchip { display: inline-flex; align-items: center; gap: 8px; font: 700 .8rem/1 var(--f-head); padding: 7px 13px; border-radius: 99px; background: #fff; color: var(--ch); border: 1.5px solid var(--ch); }
.wart { max-width: 440px; width: 100%; margin: 0 auto; }
.world .grid-ch { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); } .world .chc { background: #fff; box-shadow: 0 10px 30px -18px color-mix(in srgb, var(--ch) 60%, transparent); }
.world .chc .art { background: color-mix(in srgb, var(--base) 22%, #fff); }
.world .chc .bd h3 { font-size: 1.12rem; }
.world-end::after { content: ''; display: block; height: 0; }
.worlds + .sec { position: relative; }
.wtail { position: relative; height: clamp(36px, 5.5vw, 72px); background: var(--paper); margin-top: -1px; }
.wtail::before { content: ''; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: var(--wprev); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1440V30C1180 100 900 0 640 48S200 84 0 30Z'/%3E%3C/svg%3E") center/100% 100% no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1440V30C1180 100 900 0 640 48S200 84 0 30Z'/%3E%3C/svg%3E") center/100% 100% no-repeat; transform: scaleY(-1); }
.world.w2 { --wprev: color-mix(in srgb, var(--hb, var(--w1)) var(--mx1), var(--paper)); } .world.w3 { --wprev: color-mix(in srgb, var(--hb, var(--w2)) var(--mx1), var(--paper)); }
.world.w4 { --wprev: color-mix(in srgb, var(--hb, var(--w3)) var(--mx1), var(--paper)); } .world.w5 { --wprev: color-mix(in srgb, var(--hb, var(--w4)) var(--mx1), var(--paper)); }
.world.w6 { --wprev: color-mix(in srgb, var(--hb, var(--w5)) var(--mx1), var(--paper)); } .world.w0 { --wprev: color-mix(in srgb, var(--hb, var(--w6)) var(--mx1), var(--paper)); }
.wtail { --wprev: color-mix(in srgb, var(--hb, var(--w6)) var(--mx1), var(--paper)); }
@media (max-width: 860px) { .world-h, .world:nth-of-type(even) .world-h { grid-template-columns: 1fr; margin-bottom: 28px; } .world:nth-of-type(even) .world-t { order: 0; } .wart { max-width: 260px; margin: 0; } .world-h .wart { order: -1; } }

/* Kapitelkopf mit Welle und Sketchnote */
.chead { border-bottom: 0 !important; padding-bottom: clamp(56px, 7vw, 92px) !important; background: var(--c1) !important; overflow: visible; }
.chead::after { content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: clamp(30px, 4vw, 52px); background: var(--paper); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 80V40C240 0 460 70 720 38S1180 6 1440 44V80Z'/%3E%3C/svg%3E") center/100% 100% no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 80V40C240 0 460 70 720 38S1180 6 1440 44V80Z'/%3E%3C/svg%3E") center/100% 100% no-repeat; }
.chead .chart.wart { right: max(var(--gut-r), calc(50% - 600px)); top: 50%; transform: translateY(-50%); width: clamp(190px, 28vw, 360px); height: auto; opacity: 1; }
.chead .chart.wart svg { fill: none; stroke: var(--ch); stroke-width: 3.2; width: 100%; height: auto; }
.chead .wchip { margin: 0 0 14px; text-decoration: none; }
.chead .wchip + .big, .chead .crumb + .wchip { margin-top: 4px; }
@media (max-width: 760px) { .chead .chart.wart { width: 150px; height: auto; top: 18px; transform: none; opacity: .9; } }
.chead, .chead .wrap { position: relative; } .chead .wrap { z-index: 2; } .chead .chart { z-index: 1; }
@media print { .world-art, .wart, .worlds-end, .chead::after, .world::before { display: none !important; } }

/* ===== Mega-Menü (Kopfzeile) ===== */
.dd { position: static; }
.ddp.mega { position: absolute; left: 0; right: 0; top: 100%; min-width: 0; padding: 0; border: 0; border-top: 1px solid var(--line); border-radius: 0 0 22px 22px; background: var(--card); box-shadow: 0 30px 60px -30px rgba(26,32,29,.35); overflow: hidden; max-height: calc(100vh - var(--hdr) - 12px); overflow-y: auto; }
.mg-in { max-width: 1240px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(250px, .8fr); gap: 0 36px; padding: 34px var(--gut-l, 24px) 30px; }
.mg-in > .mgcol { padding-right: 8px; }
.mgcol2 { grid-column: span 2; }
.mg2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; }
.mgh2, .mgh { font: 600 .82rem/1.2 var(--f-head); color: var(--ink-3); margin: 0 0 6px; padding: 0 0 12px; border-bottom: 1px solid var(--line); letter-spacing: .01em; }
.mgh { display: flex; align-items: center; gap: 9px; color: var(--ink); font-size: .95rem; font-weight: 700; }
.mgh i { width: 12px; height: 12px; border-radius: 50%; background: var(--base); border: 1.5px solid var(--ch); flex: none; }
.mgw { margin-bottom: 22px; } .mgw:last-child { margin-bottom: 0; }
.mgi { display: flex; gap: 14px; align-items: flex-start; padding: 12px 10px; margin: 0 -10px; border-radius: 14px; text-decoration: none; color: var(--ink); }
.mgi:hover, .mgi:focus-visible { background: var(--mist); }
.mgt { display: flex; flex-direction: column; gap: 3px; min-width: 0; } .mgt b { font: 700 .98rem/1.25 var(--f-head); } .mgt small { font: 400 .86rem/1.4 var(--f-body); color: var(--ink-2); }
.mgic { width: 30px; height: 30px; flex: none; display: grid; place-items: center; color: var(--olive); } .mgic .ic { width: 22px; height: 22px; }
.mgc { padding: 9px 10px; } .mgn { width: 34px; height: 34px; border-radius: 50%; flex: none; display: grid; place-items: center; font: 800 .78rem/1 var(--f-head); color: var(--ch); background: color-mix(in srgb, var(--base) 28%, #fff); border: 1.5px solid color-mix(in srgb, var(--base) 70%, #fff); }
.mgc .mgt small { font-size: .8rem; }
.mgside { position: relative; padding-left: 4px; } .mgside::before { content: ''; position: absolute; top: -34px; bottom: -30px; left: -22px; right: -100vw; background: var(--mist); } .mgside > * { position: relative; }
.mgside .mgh2 { border-color: color-mix(in srgb, var(--line) 120%, transparent); }
.mgi:focus-visible { outline: 2px solid var(--olive); outline-offset: 1px; }
@media (max-width: 1100px) { .mg-in { grid-template-columns: repeat(3, minmax(0, 1fr)); } .mgside { grid-column: 1 / -1; margin-top: 18px; } .mgside::before { left: -100vw; } }
@media (max-width: 860px) { .dd { display: none; } }
@media print { .ddp { display: none !important; } }
.chmenu .mgwh { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; font: 700 .86rem/1.2 var(--f-head); margin-top: 10px; color: var(--ink); } .chmenu .mgwh i { width: 11px; height: 11px; border-radius: 50%; background: var(--base); border: 1.5px solid var(--ch); }
.chmenu li a.k0 .n, .chmenu li a[class^="k"] .n { background: color-mix(in srgb, var(--base) 30%, #fff); color: var(--ch); }
.chc .bd cite.qa { font-size: .72rem; margin-top: 4px; } .pg cite.qa-in { text-align: center; margin: 4px 0 0; }
.motto + cite.qa-in { margin-top: -6px; }
@media print { cite.qa { color: #333; } }

/* ===== Startseite: klar getrennte Bänder mit Wellen ===== */
:root { --hero-bg: #ede3d8; --sage-bg: #e3e8e1; --wv: clamp(36px, 5.5vw, 72px); }
.hero { background: var(--hero-bg); padding: clamp(56px, 8vw, 104px) 0 clamp(64px, 8vw, 96px); }
.hero .cta, .hero .stats { display: none; }
.hb { position: relative; background: var(--hbg, var(--paper)); padding-top: calc(var(--wv) + clamp(24px, 4vw, 56px)); }
.hb::before { content: ''; position: absolute; left: 0; right: 0; top: -1px; height: var(--wv); background: var(--wprev, var(--paper)); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1440V30C1180 100 900 0 640 48S200 84 0 30Z'/%3E%3C/svg%3E") center/100% 100% no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1440V30C1180 100 900 0 640 48S200 84 0 30Z'/%3E%3C/svg%3E") center/100% 100% no-repeat; pointer-events: none; }
.hb.sec { padding-bottom: clamp(48px, 7vw, 88px); } .hbw.hb { padding-bottom: 0; } .hbw.hb > .sec { padding-top: 0; }
.hb > .wrap, .hb > * { position: relative; }
.kzband { padding-top: calc(var(--wv) + 8px); padding-bottom: clamp(40px, 6vw, 72px); }
.kz-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 40px; text-align: center; }
.kz { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.kz b { font: 800 clamp(2.8rem, 6vw, 4.6rem)/1 var(--f-head); letter-spacing: -.04em; color: var(--olive); }
.kz span { font: 600 1.02rem/1.3 var(--f-head); color: var(--ink-2); margin-bottom: 14px; }
.kz .btn { max-width: 100%; white-space: normal; text-align: center; }
@media (max-width: 760px) { .kz-grid { grid-template-columns: 1fr; gap: 34px; } }
@media print { .hb::before { display: none; } }
.hb .stmt, .hb .privacy { background: #fff; }

/* ===== Klare Linien statt Wellen ===== */
.world::before, .hb::before, .wtail, .wtail::before, .chead::after, .hero-wave { display: none !important; }
.world { padding: clamp(56px, 7vw, 96px) 0; }
.hb { padding-top: clamp(48px, 6vw, 80px); } .kzband { padding-top: clamp(40px, 5vw, 64px); }
.hb.sec { padding-bottom: clamp(48px, 7vw, 88px); } .hbw.hb { padding-top: 0; }
.chead { padding-bottom: clamp(40px, 5vw, 64px) !important; border-bottom: 0 !important; }
.hero { padding-bottom: clamp(56px, 7vw, 88px); }

/* ===== Zentrierte Überschriften ohne Bild, volle Breite für Infoboxen, einheitliche Abstände ===== */
:root { --band: clamp(56px, 7vw, 96px); --hgap: clamp(28px, 4vw, 44px); }
.sec-h { max-width: 46rem; margin: 0 auto var(--hgap); text-align: center; }
.sec-h p { margin-left: auto; margin-right: auto; max-width: 38rem; }
.hero .wrap { text-align: center; display: flex; flex-direction: column; align-items: center; }
.hero h1 { max-width: none; } .hero .lead { margin-left: auto; margin-right: auto; }
.chead:not(:has(.wart)) .wrap { text-align: center; }
.chead:not(:has(.wart)) .crumb, .chead:not(:has(.wart)) .row { justify-content: center; }
.chead:not(:has(.wart)) .quote, .chead:not(:has(.wart)) .lead, .chead:not(:has(.wart)) h1 + p { margin-left: auto; margin-right: auto; }
.stmt, .privacy { max-width: none; width: 100%; grid-template-columns: auto minmax(0, 46rem); justify-content: center; }
.stmt > div:last-child, .privacy > div:last-child { min-width: 0; }
.hb.sec { padding-bottom: var(--band); } .hb { padding-top: var(--band); } .kzband { padding-top: var(--band); padding-bottom: var(--band); }
.world { padding: var(--band) 0; } .world-h { margin-bottom: var(--hgap); }
#chapters.sec { padding-bottom: 0 !important; } #chapters { padding-top: var(--band); padding-bottom: var(--hgap) !important; } #chapters .sec-h { margin-bottom: 0 !important; }
.hero { padding: var(--band) 0; }
@media (max-width: 760px) { .stmt, .privacy { grid-template-columns: minmax(0, 1fr); } .hero .wrap { align-items: center; } }
.stmt, .privacy { grid-template-columns: minmax(0, 1fr) !important; justify-items: center; text-align: center; }
.stmt p, .privacy p { margin-left: auto; margin-right: auto; } .stmt p[style], .privacy p[style] { justify-content: center; }
.stmt .lg-note, .stmt > div { text-align: center; }
.chead:not(:has(.wart)) h1, .chead:not(:has(.wart)) .big { margin-left: auto; margin-right: auto; text-align: center; max-width: none; }
.chead:not(:has(.wart)) .quote { text-align: center; }
.tiles { display: flex !important; flex-wrap: wrap; gap: 20px; justify-content: center; } .tiles > .tile { flex: 1 1 210px; min-width: 0; }

/* Dein Stand und Kapitelüberschrift: eigene Bänder mit gleichem Abstand */
.hbw.hb { padding-top: var(--band) !important; padding-bottom: var(--band) !important; } .hbw.hb > .sec { padding: 0 !important; }
#chapters.sec { padding-top: var(--band) !important; padding-bottom: var(--band) !important; } #chapters .sec-h { margin-bottom: 0 !important; }
.ckb { flex-wrap: wrap; } .ckb .ckser { flex: 1 1 100%; display: flex; align-items: flex-end; gap: 3px; height: 38px; margin: 6px 0 0; } .ckb .ckser i { flex: 1; max-width: 16px; height: var(--h); min-height: 3px; border-radius: 3px 3px 0 0; background: var(--pink); }
.ckb .cktr { flex: 1 1 100%; color: var(--ink-2); font-size: .8rem; }
.ckb .ckser, .ckb .cktr { grid-column: 1 / -1; }
.grpsel { display: flex; gap: 10px; margin: 6px 0 14px; } .grpb input { position: absolute; opacity: 0; } .grpb span { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 16px; border: 1.5px solid var(--line-2); background: var(--card); font: 800 1.2rem/1 var(--f-head); cursor: pointer; } .grpb input:checked + span { background: var(--olive); color: #fff; border-color: var(--olive); } .grpb input:focus-visible + span { outline: 2px solid var(--olive); outline-offset: 2px; }
.grpbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-bottom: 16px; } .grpbar b { font: 800 1.2rem/1 var(--f-head); } .grpbar .tkbtns { margin-left: auto; }
.grprow { display: grid; grid-template-columns: 90px 140px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 0; } .grprow small { color: var(--ink-2); }
@media (max-width: 640px) { .grprow { grid-template-columns: 1fr auto; } .grprow .in { grid-column: 1 / -1; } }
.tkgrp .tkpriv { }
.tkcsv { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; margin: 0 0 16px; padding: 10px 14px; border-radius: 14px; background: var(--mist); } .tkmode { display: grid; gap: 10px; margin: 8px 0 18px; } .tkmode label { display: flex; gap: 10px; align-items: flex-start; }
@media print { .tkcsv { display: none; } }

/* Zeichnungen der Autorin: saubere Linien, keine Wackel-Verzerrung */
.sk { fill: var(--ch); stroke: none; filter: none; max-width: 300px; margin-inline: auto; }
.chead .chart.wart svg.sk { fill: var(--ch); stroke: none; }


/* Termine mit klarem Beginn und Ende */
.tkl{gap:0}
.tke{display:grid;grid-template-columns:54px 1fr;gap:10px;align-items:stretch;background:#fff;border:1px solid var(--line,#d9d6cf);border-left:5px solid var(--sage,#7c9a86);border-radius:8px;padding:8px 10px;margin:0;text-align:left}
.tke.ro{cursor:default}.tke.ro:hover{border-color:var(--line,#d9d6cf);border-left-color:var(--sage,#7c9a86)}
.tke .tt{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;font-size:.82rem;color:var(--ink,#222);font-weight:700;min-height:44px}
.tke .tt i{display:block;width:2px;flex:1;min-height:12px;background:var(--sage,#7c9a86);margin:2px 0 2px 8px;border-radius:2px}
.tke .tt .te{font-weight:500;color:var(--ink-3,#666)}
.tke .tb{display:flex;flex-direction:column;gap:2px;min-width:0}.tke .tb b{overflow-wrap:anywhere}
.tkgap{font-size:.74rem;color:var(--ink-3,#666);text-align:center;padding:3px 0;border-left:5px dotted transparent;position:relative}
.tkgap::before,.tkgap::after{content:"";display:inline-block;width:18%;height:0;border-top:1px dashed #b9b6ae;vertical-align:middle;margin:0 8px}
.tkgap.tkov{color:#9a3b3b}.tkgap.tkov::before,.tkgap.tkov::after{border-color:#d49a9a}
.grpbar{flex-wrap:wrap;gap:10px 14px;align-items:center}
.grprole{font-size:.78rem;font-weight:700;padding:3px 10px;border-radius:99px;background:#e8eee6;color:#355a3d}
.grplc{font-size:.85rem}

/* PDF-Auswahl und Tabellen mit Beginn und Ende */
.tkpicks{display:flex;flex-direction:column;gap:8px;margin:12px 0}.tkpick{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line,#d9d6cf);border-radius:10px;cursor:pointer;background:#fff}.tkpick small{display:block;color:var(--ink-3,#666)}.tkpick.off{opacity:.55;cursor:not-allowed}.tkpick input{margin-top:4px}
#tkpdf{display:none}
.tkrows{width:100%;border-collapse:collapse;font-size:.85rem;margin:0 0 6px}.tkrows th,.tkrows td{border:1px solid #8a8f88;padding:5px 7px;vertical-align:top;text-align:left}.tkrows thead th{background:#eef1ea}.tkrows th[scope=row] small{display:block;font-weight:500}.tkrows tr.first td,.tkrows tr.first th{border-top:2px solid #333}.tkrows td.tm1{font-weight:700;white-space:nowrap}.tkrows td.tm2{white-space:nowrap}.tkrows .nt{display:block;color:#555}
.tkpdfhead{display:flex;justify-content:space-between;align-items:baseline;border-bottom:2px solid #333;padding-bottom:6px;margin-bottom:12px;font-size:1.2rem}.tkpdfhead span{font-size:.8rem;color:#555}
.tkpsec{margin:0 0 18px}.tkpsec h2{font-size:1.1rem;margin:14px 0 6px}.tkpm{font-size:.85rem;color:#333;margin:0 0 8px}.tkpl{columns:2;font-size:.9rem}.tkpfig{margin:8px 0;break-inside:avoid}.tkpfig img{max-width:100%;max-height:230mm}.tkpfig figcaption{font-size:.8rem;color:#555}
@media print{body.tkpdfing>*:not(#tkpdf){display:none!important}body.tkpdfing #tkpdf{display:block!important;position:static}.tkpsec .tksheet{page-break-inside:avoid}.tkph{font-size:1.1rem}}
.tke{grid-template-columns:44px 1fr;gap:8px;padding:8px}.tke .tb b{overflow-wrap:break-word;hyphens:auto;font-size:.92rem}
.tkd>.btn{width:100%;margin-top:6px;justify-content:center}
.tkgap{display:flex;align-items:center;gap:6px;padding:4px 0}.tkgap::before,.tkgap::after{content:"";flex:1;width:auto;margin:0}
.tkrows{table-layout:fixed}.tkrows th:nth-child(1){width:15%}.tkrows th:nth-child(2),.tkrows th:nth-child(3){width:9%}
.tke{grid-template-columns:40px 1fr;gap:6px;padding:7px 7px}.tke .tb b{font-size:.84rem;hyphens:auto;overflow-wrap:break-word}.tke .tt{font-size:.78rem}.tkd>.btn{font-size:.8rem;padding-inline:8px}

.dk-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin-top:12px}.dk{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:14px 16px;display:flex;flex-direction:column;gap:8px}.dk b{display:block}.dk span{color:var(--ink-2);font-size:.92rem}
.fdis{grid-column:1/-1;font-size:.82rem;color:var(--ink-2);max-width:60rem;margin:6px 0 0}.fdis a{text-decoration:underline}
.foot .fdis{color:#e3e8e1;font-size:.85rem}.foot .fdis a{color:#fff}

/* ===== Vollversion als PDF (nur beim Erzeugen der Datei) ===== */
@media print {
  body.fullpdf { background: #fff; }
  body.fullpdf header.top, body.fullpdf footer.foot, body.fullpdf .skip, body.fullpdf #nav, body.fullpdf .toc, body.fullpdf .related, body.fullpdf .actions, body.fullpdf .pg-fb, body.fullpdf .favb, body.fullpdf .pausecard, body.fullpdf .remind, body.fullpdf .chead .row, body.fullpdf .crumb, body.fullpdf .wchip { display: none !important; }
  body.fullpdf .fp-cover { min-height: 250mm; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 12px; break-after: page; background: #ede3d8; border-radius: 0; padding: 20mm 10mm; }
  body.fullpdf .fp-logo { width: 220px; } body.fullpdf .fp-logo svg { width: 100%; height: auto; }
  body.fullpdf .fp-cover h1 { font-size: 3.2rem; } body.fullpdf .fp-sub { font-size: 1.15rem; color: var(--ink-2); } body.fullpdf .fp-motto { font: 700 1rem var(--f-head); letter-spacing: .08em; color: var(--olive); }
  body.fullpdf .fp-art { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px 26px; margin: 18px 0; width: 100%; max-width: 150mm; } body.fullpdf .fp-art svg { fill: var(--olive); width: 100%; height: 90px; max-width: none; }
  body.fullpdf .fp-art svg:nth-child(1) { fill: #6f9bc4; } body.fullpdf .fp-art svg:nth-child(2) { fill: #6d9a6a; } body.fullpdf .fp-art svg:nth-child(3) { fill: #b98a2f; } body.fullpdf .fp-art svg:nth-child(4) { fill: #b5654c; } body.fullpdf .fp-art svg:nth-child(5) { fill: #b9707f; } body.fullpdf .fp-art svg:nth-child(6) { fill: #7a6db0; }
  body.fullpdf .fp-note { font-size: .85rem; color: var(--ink-3); }
  body.fullpdf .fp-page { break-after: page; padding: 8mm 4mm; } body.fullpdf .fp-page h1 { font-size: 2rem; margin-bottom: 14px; } body.fullpdf .fp-dis p { margin: 0 0 12px; font-size: 1.02rem; }
  body.fullpdf .fp-crisis { margin-top: 20px; padding: 14px 18px; border-radius: 16px; background: var(--pink-soft); } body.fullpdf .fp-crisis p { margin: 6px 0 0; font-size: .95rem; }
  body.fullpdf .fp-w { margin: 0 0 14px; padding: 10px 16px; border-radius: 14px; background: var(--c1, #e3e8e1); break-inside: avoid; } body.fullpdf .fp-w h2 { font-size: 1.02rem; margin-bottom: 6px; } body.fullpdf .fp-w li { display: flex; gap: 10px; margin: 3px 0; font-size: .95rem; } body.fullpdf .fp-w li span { font: 800 .85rem var(--f-head); min-width: 24px; color: var(--ch, var(--olive)); }
  body.fullpdf .fp-w.k1 { --c1: #dbe5ea; --ch: #5b86b0; } body.fullpdf .fp-w.k3 { --c1: #dde6d9; --ch: #5f8d5c; } body.fullpdf .fp-w.k5 { --c1: #f3e8cc; --ch: #a97b1f; } body.fullpdf .fp-w.k8 { --c1: #f0ddd5; --ch: #b5654c; } body.fullpdf .fp-w.k11 { --c1: #f2e0e4; --ch: #b9707f; } body.fullpdf .fp-w.k13 { --c1: #e3dff0; --ch: #7a6db0; }
  body.fullpdf .fp-ch { break-before: page; } body.fullpdf .fp-ch .chead { break-after: avoid; border-radius: 0 0 24px 24px; margin-bottom: 14px; padding: 18px 8mm; position: relative; display: block; min-height: 0; } body.fullpdf .fp-ch .chead .wrap { padding: 0; max-width: none; }
  body.fullpdf .fp-ch .chead .chart.wart { display: block !important; position: absolute; right: 8mm; top: 50%; transform: translateY(-50%); width: 38mm; max-width: 38mm; opacity: 1; } body.fullpdf .fp-ch .chead .chart.wart svg { width: 100%; height: auto; }
  body.fullpdf .fp-ch .chead h1, body.fullpdf .fp-ch .chead .big { max-width: 70%; }
  body.fullpdf .fp-ch .pg { break-before: auto; margin-top: 22px; padding-top: 14px; border-top: 3px solid var(--ch, var(--olive)); }
  body.fullpdf .fp-ch .layout { display: block; } body.fullpdf .fp-ch .pages { max-width: none; }
}
@media print {
  .q1.uitem { display: grid !important; grid-template-columns: 34px minmax(0, 1fr); gap: 4px 14px; } .q1.uitem .ta { grid-column: 2; width: 100%; } .q1.uitem .lbl, .q1.uitem label { grid-column: 2; }
  body.fullpdf .fp-ch .chead { min-height: 44mm; padding-right: 8mm; } body.fullpdf .fp-ch .chead .chart.wart { width: 32mm; max-width: 32mm; } body.fullpdf .fp-ch .chead .quote, body.fullpdf .fp-ch .chead .lead, body.fullpdf .fp-ch .chead p { max-width: 68%; }
  body.fullpdf .chead::before, body.fullpdf .chead::after, body.fullpdf .hero-wave, body.fullpdf .wtail { display: none !important; }
}

.dl-all + .dl-all{margin-top:14px}.dl-full{background:var(--sage-bg,#e3e8e1)}

/* Handy: Bewertungszeilen ohne riesige Leerräume (flex-basis wirkte in der Spalte als Höhe) */
@media (max-width: 760px) {
  .sc-r { gap: 8px; padding: 12px 14px; } .sc-r .t { flex: 0 0 auto; width: 100%; }
  .dots5 { gap: 8px; }
}

/* PDF und Druck: Module bleiben auf einer Seite zusammen (zu große Elemente dürfen weiterhin umbrechen) */
@media print {
  .card, .field, .q1, .st1, .one, .sc-r, .ask, .say, .stem, .wk, .wkh, .col, .idea, .tbl tr, .emo, .box, .vs, .stp, .sum, .ck, .week, .pk, .myth .r, .flow > *, .cards > *, .scale, .tbl-w, .trk-h, .paint, .wheel-w, .portrait, .tree, .daily, .pf, .note, .blk.theory > *, .lt, .dotsr, .bat-w, .brainm, .nums, .blk > .ib2 { break-inside: avoid; page-break-inside: avoid; }
  .subh, .pg-h, .blk > .lbl, .blk > h3, .blk > h4, .field > .lbl, .q1 > .lbl, .scale > .sc-h { break-after: avoid; page-break-after: avoid; }
  .scale { break-inside: auto; } .scale .sc-r { break-inside: avoid; }
  .tbl, .tbl-w { break-inside: auto; } .tbl tr { break-inside: avoid; } .tbl thead { display: table-header-group; }
  .ta, .ta .mir { break-inside: avoid; }
}
@media print {
  .sl { break-inside: avoid; page-break-inside: avoid; } .wheel-w { break-inside: auto; } .wheel-w > * { break-inside: avoid; }
  .scale { break-inside: avoid; page-break-inside: avoid; }
  input[type=range] { max-width: 100%; } .sl { max-width: 100%; overflow: hidden; }
}

.lg-s a[href^='mailto'], .lg-s a[href^='tel'] { text-decoration: underline; text-underline-offset: 3px; }
@media print { li, figure, blockquote, details, .ib2 li { break-inside: avoid; page-break-inside: avoid; } p { orphans: 3; widows: 3; } h1, h2, h3, h4, .pg-h, .kick { break-after: avoid; page-break-after: avoid; } }
.tkgl{display:flex;gap:14px;align-items:center;margin:14px 0 6px;padding:14px 16px;border-radius:16px;background:var(--c1,#e3e8e1);text-decoration:none;color:inherit;border:1px solid rgba(0,0,0,.08)} .tkgl:hover{border-color:var(--olive,#4b6b57)} .tkgl .ic{width:26px;height:26px} .tkgl b{display:block;font:800 1.05rem var(--f-head)} .tkgl small{color:#4a554d}
.grpmx{width:100%;border-collapse:separate;border-spacing:0 8px;text-align:center} .grpmx th{font:800 1rem var(--f-head);padding:6px 8px} .grpmx tbody th{text-align:left}
.grpang{display:inline-flex;gap:8px;align-items:center;font-size:.92rem} .tkopt{display:flex;gap:10px;align-items:flex-start;margin-top:14px;font-size:.92rem;line-height:1.4} .tkopt input{margin-top:3px}
.gkinfo{display:grid;gap:14px;margin:26px 0 8px} @media(min-width:760px){.gkinfo{grid-template-columns:repeat(3,1fr)}} .gkinfo>div{background:var(--c1,#e3e8e1);border-radius:16px;padding:14px 16px} .gkinfo h3{font-size:1rem;margin:0 0 6px}
@media print{.tkgl,.gkinfo,.grpang{display:none!important}}
@media(max-width:760px){.grpmx{border-spacing:0 6px;table-layout:fixed}.grpmx th{padding:4px 2px;font-size:.82rem}.grpmx td{padding:0 2px}.grpmx .btn{padding:8px 2px;font-size:.74rem;min-width:0;width:100%}.grpmx tbody th{width:20%;font-size:.78rem}}
.duckcard{display:flex;gap:16px;align-items:center;min-height:96px;margin:12px 0;padding:18px 20px;border-radius:20px;background:#fff3c4;border:1px solid #ecd47a} .duckcard p{margin:0;font:700 1.15rem/1.4 var(--f-head)} .duckcard .dn{flex:none;display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:#f4c430;color:#3b2f00;font:800 1.3rem var(--f-head)}
.ducks{display:grid;grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:10px;margin:14px 0} .duck{aspect-ratio:1;border-radius:50% 50% 46% 46%;border:2px solid #e0b92a;background:#ffe27a;color:#3b2f00;font:800 1rem var(--f-head);cursor:pointer} .duck:hover{background:#ffd23f} .duck.on{background:#f4c430;box-shadow:0 0 0 3px var(--olive,#4b6b57)} .duck:focus-visible{outline:3px solid var(--olive,#4b6b57);outline-offset:2px}
@media print{.ducks,.duckcard{display:none!important}}
.hello{background:var(--sage-bg,#e3e8e1);font:700 .95rem var(--f-head);padding:8px 0}.hello .wrap{display:block}@media print{.hello{display:none!important}}
li > a.sub{padding-left:28px!important;font-size:.95em}
.tkpage > .sec{padding-top:26px;padding-bottom:18px}.tkpage .tkpriv{margin:0 0 18px}.tkpage .tiles{margin-top:0;gap:16px}.tkpage .tile h3{margin:0 0 6px}.tkpage .tile p{margin:0}.tkpage .tkbody{margin-top:14px}.tkpage .chead{padding-bottom:22px}
.tkpage + .actions, .tkpage ~ .actions{margin-top:8px}
.logo .lt2 b{font:800 1.2rem/1 var(--f-head);letter-spacing:-.01em;text-transform:none}

.edtog{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:89;display:inline-flex;align-items:center;gap:8px;background:var(--ink);color:#fff;border:0;border-radius:999px;padding:12px 18px;font:inherit;font-weight:600;font-size:.9rem;cursor:pointer;box-shadow:0 14px 40px -12px rgba(26,32,29,.6)}.edtog:hover{background:var(--olive)}.edtog svg{width:18px;height:18px}body.editing .edtog{display:none}
@media print{.edtog{display:none!important}}

.tkgh{font-family:var(--f-head);font-weight:800;font-size:clamp(1.5rem,3vw,2rem);letter-spacing:-.01em;margin:44px 0 18px}.tkgh:first-child{margin-top:8px}
.tkcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.tkcard{background:#fff;border:1px solid var(--line);border-radius:6px;padding:26px 18px 22px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:0}
.tkav{width:80px;height:80px;border-radius:50%;object-fit:cover;margin-bottom:14px;background:var(--mist)}
.tkcard h3{font-size:1rem;font-weight:700;margin:0 0 6px;line-height:1.3}.tkpos{margin:0;color:var(--ink-2);font-size:.95rem;line-height:1.5}.tktx{margin:12px 0 0;color:var(--ink-2);font-size:.88rem;line-height:1.55}.tkact{margin:auto 0 0;padding-top:14px}

/* Lageplan: Schnellübersicht und Gesamtplan */
.lpmode{margin-top:0}.lpmode button{font-size:1rem;padding:10px 20px}
.lptip{position:fixed;z-index:130;display:none;max-width:270px;background:var(--ink);color:#fff;border-radius:10px;padding:10px 13px;font-size:.85rem;line-height:1.45;pointer-events:none;box-shadow:0 14px 34px -10px rgba(26,32,29,.55)}.lptip b{display:block;font-family:var(--f-head);font-size:.92rem}.lptip span{display:block;margin-top:3px;opacity:.9}
.lpgs{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:20px 28px;align-items:start}
.lpzoom{overflow:auto;max-height:78vh;border:1px solid var(--line);border-radius:14px;background:#fff}.lpzoom .lpsvg{display:block;max-height:none;border:0;border-radius:0;height:auto}
.lpzoomtools{display:flex;gap:6px;margin:0 0 8px}
.lpsitewrap .lpsvg{max-width:640px}.lpteil{cursor:pointer;outline:none}.lpteil rect{transition:filter .15s}.lpteil:hover rect,.lpteil:focus-visible rect{filter:brightness(1.12);stroke:var(--pink);stroke-width:3}.lpsvg .lt2.w{fill:#fff}
.lpside{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg,22px);padding:18px 20px}.lpside h3{margin:0 0 10px;font-size:1.05rem}
.lpleg2{list-style:none;padding:0;margin:0 0 12px;display:flex;flex-direction:column;gap:9px;font-size:.92rem}.lpleg2 li{display:flex;gap:10px;align-items:center}.lpleg2 small{display:block;color:var(--ink-3);font-size:.78rem}
.lpem{background:var(--pink-soft);border-radius:12px;padding:10px 12px;font-size:.9rem;margin:10px 0 0}
.lpsvg [data-tip]{outline:none}
@media (max-width:860px){.lpgs{grid-template-columns:minmax(0,1fr)}}
@media print{.lpmode,.lpzoomtools{display:none!important}.lpzoom{max-height:none;overflow:visible}.lpgs{display:block}}

.lpsvg.site{background:#edefe8;border:0;max-height:78vh}.lpsvg .lts{font:700 34px var(--f-head);fill:#4a524e;paint-order:stroke;stroke:rgba(255,255,255,.7);stroke-width:6px}.lpsvg .lts.w{fill:#fff;stroke:none;font-size:38px}
.lpb1{fill:#2f4b3f}.lpb2{fill:#5f7f70}.lpb3{fill:#9fb8a8}.lpb3+text{fill:#1a201d}.lpteil polygon{stroke:#fff;stroke-width:4;stroke-linejoin:round;transition:filter .15s}.lpteil:hover polygon,.lpteil:focus-visible polygon{filter:brightness(1.15);stroke:var(--pink)}
.lpsitewrap .lpsvg{max-width:560px;border-radius:14px}

.lroom .lr{transition:fill .15s}.lrt{font-family:var(--f-head);font-weight:600;fill:var(--ink);pointer-events:none}.lroom.named .lr{fill:var(--mint,#d3dccf)}
body.editing .lroom{cursor:pointer}body.editing .lroom:hover .lr{fill:var(--pink-soft);stroke:var(--pink)}
.lprooms{list-style:none;padding:0;margin:14px 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}.lprooms li{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:9px 12px}.lprooms small{display:block;color:var(--ink-3);font-size:.8rem;margin-top:2px}
@media print{.lped{display:none}}

/* WordPress: Leiste für angemeldete Redakteurinnen, Inhalt außerhalb der App */
body.admin-bar .top { top: 32px; }
@media (max-width: 782px) { body.admin-bar .top { top: 46px; } }
.ih-content > :not(.ik-app) { max-width: 880px; margin-left: auto; margin-right: auto; padding-left: 16px; padding-right: 16px; }
.ik-noscript { padding: 40px 16px; text-align: center; }
