/* Club-Bereich (app.js). Dasselbe System wie Startphase und Startseite: die Farbwerte und Schriften
   stehen weiter unten im Block „Gestaltungssystem“; die alten Namen zeigen nur noch darauf.
   Flächen sind leicht abgesetzt und umrandet, nie mit Schatten. Ein dunkler Block je Seite:
   „Für dich offen“ im Kopf der Aufgabenliste. */
:root{--muted:var(--ink-2);--line:var(--rule);--bg:var(--paper);--blue:var(--kobalt);--green:var(--gruen);--nav:var(--ink);background:var(--paper);color:var(--ink);font-family:var(--font-ui)}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font-ui);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,input,select,textarea{font:inherit}
button{cursor:pointer;border:0;color:inherit}
button:disabled{cursor:not-allowed;opacity:.45}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2.5px solid var(--kobalt);outline-offset:3px}
a{color:var(--ink);text-decoration-color:color-mix(in srgb,var(--ink) 35%,transparent);text-underline-offset:3px}

/* Rahmen: Seitenleiste auf Papier, Linie statt Farbblock */
.shell{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh}
.sidebar{background:var(--paper);color:var(--ink);border-right:1px solid var(--rule);padding:28px 18px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column}
.brand{display:flex;align-items:center;gap:10px;font:750 22px/1 var(--font-ui);letter-spacing:-.03em;padding:0 10px 28px}
.mark{height:24px;width:24px;border:5px solid var(--kobalt);border-radius:50%;position:relative;flex:none}
.mark:after{content:'';position:absolute;width:11px;height:11px;border:2.5px solid var(--paper);background:var(--flieder);border-radius:50%;right:-9px;bottom:-6px}
.club-switch{padding:12px 14px;border:1px solid var(--rule);border-radius:16px;margin-bottom:24px;background:var(--field)}
.club-switch label{display:block;font-size:13px;color:var(--ink-2)}
.club-switch b{display:block;font-size:15px}
.club-switch small{color:var(--ink-2);font-size:12px}
.club-switch select{width:100%;border:0;border-radius:6px;padding:4px 0;margin-top:2px;background:transparent;color:var(--ink);font:650 16px var(--font-ui)}
.nav{display:grid;gap:4px}
.nav button{color:var(--ink-2);display:flex;align-items:center;gap:12px;text-align:left;background:none;padding:11px 14px;border-radius:999px;font-size:15px;font-weight:500;transition:background .15s,color .15s}
.nav button.active{background:var(--ink);color:var(--paper);font-weight:600}
.nav button:not(.active):hover{background:var(--paper-2);color:var(--ink)}
.icon{width:19px;height:19px;flex-shrink:0;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}
.sidebar-bottom{margin-top:auto;font-size:13px;color:var(--ink-2);padding:28px 10px 0;line-height:1.6}
.sidebar-bottom strong{color:var(--ink);display:block;margin-bottom:6px}
.light{color:var(--ink-2)}
.main{min-width:0}
.topbar{min-height:76px;padding:0 40px;border-bottom:1px solid var(--rule);display:flex;align-items:center;justify-content:space-between;background:var(--paper);gap:15px}
.breadcrumb{font-size:14px;color:var(--ink-2)}
.breadcrumb span{color:var(--ink);margin-left:10px;font-weight:600}
.top-actions{display:flex;align-items:center;gap:12px}
.tag{display:inline-flex;gap:6px;align-items:center;font:600 12px var(--font-ui);padding:5px 10px;border-radius:999px;background:var(--paper-2);color:var(--ink-2);white-space:nowrap}
.tag.green{color:var(--gruen);background:color-mix(in srgb,var(--gruen) 13%,transparent)}
.tag.purple{color:color-mix(in srgb,var(--flieder) 45%,var(--ink));background:color-mix(in srgb,var(--flieder) 24%,transparent)}
.tag.orange{color:var(--ocker);background:color-mix(in srgb,var(--ocker) 13%,transparent)}
.avatar{border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--flieder) 35%,var(--paper));color:var(--ink);width:36px;height:36px;font-size:12px;font-weight:700;flex-shrink:0}
.profile{display:flex;align-items:center;gap:9px}
.profile select{border:0;background:transparent;color:var(--ink);font-size:13px;max-width:155px}
.content{max-width:1240px;margin:auto;padding:36px 40px}

/* Schrift */
.page-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:26px}
h1,h2,h3,p{margin:0}
h1{font:760 36px/1.08 var(--font-ui);letter-spacing:-.035em;text-wrap:balance}
h2{font:700 19px/1.3 var(--font-ui);letter-spacing:-.02em}
h3{font-size:16px;font-weight:650;letter-spacing:-.01em}
.subtitle{font:400 18px/1.5 var(--font-doc);color:var(--ink-2);margin-top:8px;max-width:60ch}
.text{font-size:15px;line-height:1.65;color:var(--ink-2);max-width:72ch}

/* Knöpfe wie in der Startphase */
.btn{min-height:44px;padding:0 20px;border-radius:999px;background:var(--btn);color:var(--btn-ink);display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 15px/1 var(--font-ui);letter-spacing:-.01em;white-space:nowrap;text-decoration:none;transition:background .15s,box-shadow .15s}
.btn:hover{background:color-mix(in srgb,var(--btn) 86%,var(--kobalt))}
.btn.secondary{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--ink) 30%,transparent)}
.btn.secondary:hover{background:var(--paper-2);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--ink) 55%,transparent)}
.btn.soft{background:var(--paper-2);color:var(--ink)}
.btn.small{font-size:14px;min-height:36px;padding:0 14px}
.linkbtn{color:var(--ink);background:none;font-size:14px;min-height:44px;padding:10px 6px;text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--ink) 30%,transparent);text-underline-offset:3px}
.linkbtn:hover{text-decoration-color:currentColor}
.demo-note{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-2);margin-bottom:23px}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--flieder)}

/* Flächen */
.overview-grid,.lower-grid{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(270px,1fr);gap:22px}
.lower-grid{margin-top:22px}
.panel{background:var(--field);border:1px solid var(--rule);border-radius:20px;overflow:hidden}
.panel-pad{padding:26px}
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:22px}
.value-label{font-size:14px;color:var(--ink-2)}
.big-value{font:760 40px/1.2 var(--font-ui);letter-spacing:-.035em;margin:8px 0 4px}
.return{color:var(--gruen);font-size:13px}
.return span{color:var(--ink-2);margin-left:7px}
.chart{width:100%;height:175px;display:block;margin:20px 0 5px}
.chart text{font-family:var(--font-ui);font-size:11px;fill:var(--ink-2)}
.stat-row{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--rule);padding-top:20px;gap:15px}
.stat-row b{display:block;font:700 20px var(--font-ui);margin:7px 0 0}
.stat-row small{font-size:12px;color:var(--ink-2)}
.accent-panel{background:color-mix(in srgb,var(--flieder) 16%,var(--field));border-color:transparent}
.accent-panel .panel-head{margin-bottom:20px}
.proposal-feature{margin-top:21px}
.ticker{width:48px;height:48px;display:flex;align-items:center;justify-content:center;font:700 10px var(--font-ui);letter-spacing:-.02em;border-radius:50%;background:var(--paper-2);color:var(--ink);flex-shrink:0}
.stock-id{display:flex;align-items:center;gap:12px}
.stock-id small{display:block;color:var(--ink-2);font-size:12px;margin-top:4px}
.feature-amount{font:760 28px var(--font-ui);letter-spacing:-.03em;margin:22px 0 7px}
.votes-meter{display:flex;gap:5px;margin:22px 0 10px}
.votes-meter i{height:7px;flex:1;border-radius:5px;background:var(--paper-2)}
.votes-meter i.yes{background:var(--kobalt)}
.votes-meter i.no{background:var(--rot)}
.vote-caption{display:flex;justify-content:space-between;color:var(--ink-2);font-size:12px;margin-bottom:22px}
.wide{width:100%}
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:14px}
th{font-weight:500;color:var(--ink-2);font-size:12px;text-align:left;padding:0 13px 12px;border-bottom:1px solid var(--rule)}
td{padding:16px 13px;border-bottom:1px solid var(--rule)}
tbody tr:last-child td{border:0}
td:first-child,th:first-child{padding-left:0}
td:last-child,th:last-child{padding-right:0}
.num{text-align:right;white-space:nowrap}
.pos{color:var(--gruen)}
.neg{color:var(--rot)}
.allocation{height:9px;display:flex;gap:4px;margin:20px 0;border-radius:6px;overflow:hidden}
.allocation span{height:100%}
.legend{display:grid;gap:16px}
.legend-item{display:flex;align-items:center;justify-content:space-between;font-size:13px}
.legend-item em{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:9px}
.legend-item b{font-weight:500}
.footnote{font-size:13px;color:var(--ink-2);line-height:1.6;margin-top:20px}
.activity{margin-top:22px}
.event{display:flex;align-items:flex-start;gap:12px;padding:14px 0;border-bottom:1px solid var(--rule);font-size:14px;line-height:1.6}
.event:last-child{border:0}
.event time{color:var(--ink-2);white-space:nowrap;font-size:12px}
.event-text{flex:1}
.split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.proposal-card{padding:26px}
.proposal-card .text{min-height:65px;margin:20px 0}
.flex{display:flex;align-items:center;gap:10px}
.between{justify-content:space-between}
.stack{display:grid;gap:20px}
.empty{padding:40px;text-align:center;color:var(--ink-2);font-size:15px}
.document{padding:22px 0;display:flex;align-items:center;justify-content:space-between;gap:18px;border-bottom:1px solid var(--rule)}
.document:last-child{border:0}
.document p{font-size:13px;color:var(--ink-2);margin-top:7px;line-height:1.6}
.roadmap{display:grid;gap:22px}
.roadmap-item{border-left:3px solid var(--rule);padding-left:20px}
.roadmap-item.done{border-color:var(--gruen)}
.roadmap-item h3{margin:5px 0 9px}
.roadmap-item p{font-size:14px;line-height:1.7;color:var(--ink-2)}
.broker-card{display:grid;grid-template-columns:44px 1fr auto;gap:16px;align-items:center;padding:22px 0;border-bottom:1px solid var(--rule)}
.broker-card:last-child{border:0}
.broker-card p{font-size:13px;color:var(--ink-2);line-height:1.6;margin-top:6px}
.statusbox{background:var(--paper-2);padding:18px;border-radius:14px;font-size:14px;line-height:1.65;color:var(--ink-2)}
.statusbox strong{color:var(--ink)}
.summary-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;margin-bottom:25px;background:var(--field);border:1px solid var(--rule);border-radius:20px;padding:24px}
.summary-strip b{display:block;font:720 24px var(--font-ui);letter-spacing:-.02em;margin-top:7px}
.summary-strip small{color:var(--ink-2)}

/* Dialoge */
dialog{width:min(580px,calc(100% - 30px));border:0;border-radius:22px;padding:28px;background:var(--paper);color:var(--ink);box-shadow:0 30px 80px rgba(10,14,30,.28);max-height:90vh}
dialog::backdrop{background:color-mix(in srgb,#0f1326 45%,transparent);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.dialog-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px}
.dialog-head h2{font-size:22px}
.close{background:var(--paper-2);border-radius:50%;font-size:20px;width:34px;height:34px;color:var(--ink-2)}
.form{display:grid;gap:18px}
.form label{font-size:14px;font-weight:600;display:grid;gap:8px}
.form input,.form select,.form textarea{width:100%;border:1px solid var(--rule);border-radius:12px;padding:12px 13px;background:var(--field);color:var(--ink);font-size:16px}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--kobalt);outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--kobalt) 22%,transparent)}
.form textarea{min-height:110px;resize:vertical;font:400 17px/1.5 var(--font-doc)}
.form input[type=checkbox],.form input[type=radio]{width:20px;height:20px;min-height:0;padding:0;margin:0;flex:none;accent-color:var(--kobalt)}
.form-footer{display:flex;justify-content:flex-end;gap:10px;margin-top:10px}
.vote-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:18px 0}
.vote-buttons button{border:1px solid var(--rule);border-radius:999px;background:transparent;padding:13px 5px;color:var(--ink-2);font-size:14px;font-weight:600}
.vote-buttons button.selected{border-color:var(--kobalt);color:var(--kobalt);background:color-mix(in srgb,var(--kobalt) 9%,transparent)}
.voter{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--rule);padding:10px 0;font-size:14px}
.error{color:var(--rot);font-size:14px;line-height:1.5}
.review-grid{display:grid;grid-template-columns:1fr auto;gap:12px;font-size:14px;margin:22px 0}
.review-grid span{color:var(--ink-2)}
#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:var(--btn);color:var(--btn-ink);padding:12px 20px;border-radius:999px;font:500 15px var(--font-ui);z-index:99;max-width:90%;display:none}
.toolbar{display:flex;gap:10px;flex-wrap:wrap}
.notice{padding:14px 18px;background:color-mix(in srgb,var(--kobalt) 6%,transparent);border-left:3px solid var(--kobalt);border-radius:0 12px 12px 0;color:var(--ink);font-size:14px;line-height:1.65;margin-bottom:22px}
.footer{font-size:13px;color:var(--ink-2);padding:24px 0 4px;margin-top:40px;border-top:1px solid var(--rule);display:flex;justify-content:space-between;gap:15px}
.footer a{color:var(--ink-2)}
.check-list{list-style:none;padding:0;margin:18px 0;display:grid;gap:12px;font-size:14px}
.check-list li{display:flex;gap:10px;line-height:1.6}
.check-list li::before{content:'✓';color:var(--gruen)}
.onboarding{max-width:640px;margin:10vh auto;padding:36px;background:var(--field);border:1px solid var(--rule);border-radius:24px}
.onboarding .brand{padding-left:0}
.onboarding .mark:after{border-color:var(--field)}
.digest{word-break:break-all;font-size:11px;display:block;margin-top:8px;color:var(--ink-2)}
.profile b{display:inline-block;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Alltag: persönliche Aufgabenliste mit dunklem Kopf, vier stabile Hauptwege */
.mode-note{display:flex;align-items:center;gap:12px;font-size:14px;color:var(--ink-2);margin:0 0 24px;line-height:1.6}
.today-sheet{background:var(--field);border:1px solid var(--rule);border-radius:22px;overflow:hidden}
.today-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:26px 28px;background:var(--block);color:var(--block-ink)}
.today-heading h2{font:720 24px/1.2 var(--font-ui);letter-spacing:-.025em}
.today-heading p{font-size:15px;color:var(--block-2);line-height:1.6;margin-top:7px}
.task-count{font:750 21px var(--font-ui);min-width:50px;height:50px;border-radius:50%;display:grid;place-items:center;box-shadow:inset 0 0 0 3px var(--flieder);color:var(--block-ink);font-variant-numeric:tabular-nums}
.task-row{display:flex;align-items:center;gap:18px;padding:24px 28px;border-bottom:1px solid var(--rule)}
.task-first{background:color-mix(in srgb,var(--kobalt) 5%,transparent)}
.task-symbol{color:var(--kobalt);background:color-mix(in srgb,var(--kobalt) 11%,transparent);border-radius:50%;width:46px;height:46px;display:grid;place-items:center;flex-shrink:0}
.task-content{flex:1;min-width:0}
.task-kind{font-size:13px;font-weight:600;color:var(--kobalt);margin-bottom:6px}
.task-content h3{font-size:18px;line-height:1.35;overflow-wrap:anywhere}
.task-content p:not(.task-kind){font-size:15px;line-height:1.6;color:var(--ink-2);margin-top:5px}
.task-content time{display:block;font-size:13px;font-weight:600;margin-top:9px}
.today-bottom{padding:18px 28px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.calm-empty{padding:30px 28px;display:flex;gap:18px;align-items:flex-start}
.calm-empty>.icon{width:30px;height:30px;color:var(--gruen)}
.calm-empty h3{line-height:1.5}
.calm-empty p{font-size:15px;color:var(--ink-2);line-height:1.65;margin-top:6px;max-width:62ch}
.club-snapshot{display:flex;align-items:center;gap:30px;padding:28px 0;border-bottom:1px solid var(--rule)}
.club-snapshot>div{flex:1}
.club-snapshot small{font-size:13px;color:var(--ink-2)}
.club-snapshot b{display:block;font:720 24px var(--font-ui);letter-spacing:-.02em;margin-top:8px}
.journal{padding:8px 0}
.journal .panel-head{margin-bottom:4px}
.journal .event{font-size:14px}
.club-subnav{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 26px;padding-bottom:16px;border-bottom:1px solid var(--rule)}
.club-subnav button{font-size:14px;min-height:40px;padding:8px 16px;background:transparent;border-radius:999px;color:var(--ink-2);font-weight:500}
.club-subnav button:hover{background:var(--paper-2);color:var(--ink)}
.club-subnav .selected,.club-subnav .selected:hover{background:var(--ink);color:var(--paper);font-weight:600}
.club-links{display:grid;gap:0;background:var(--field);border:1px solid var(--rule);border-radius:20px;overflow:hidden}
.club-link{display:flex;align-items:center;gap:16px;text-align:left;background:transparent;padding:24px;color:var(--ink);border-bottom:1px solid var(--rule);min-height:92px}
.club-link:last-child{border-bottom:0}
.club-link>span{flex:1;min-width:0}
.club-link b{display:block;font-size:17px}
.club-link small{display:block;font-size:14px;color:var(--ink-2);line-height:1.6;margin-top:5px}
.club-link:hover{background:var(--paper-2)}
.secondary-details summary{cursor:pointer;font-size:15px;line-height:1.6;min-height:44px;padding:10px 0;color:var(--ink);font-weight:600}
.secondary-details .toolbar{margin-top:14px}
.secondary-details>p{margin:12px 0}
.secondary-details{margin-top:20px}

/* Geführte Abläufe: Vertragsentwurf in der Dokumentschrift */
.form fieldset{border:0;padding:0;margin:0;min-width:0}
.form fieldset[hidden],.form button[hidden]{display:none}
.form legend{font-weight:700;margin-bottom:18px;font-size:19px;letter-spacing:-.015em}
.form fieldset>label{display:block;margin-bottom:16px}
.form fieldset>label:last-child{margin-bottom:0}
.contract-preview{white-space:pre-wrap;overflow-wrap:anywhere;font:400 16px/1.7 var(--font-doc);color:var(--ink);background:var(--field);border:1px solid var(--rule);padding:24px;border-radius:16px;margin:20px 0;max-width:100%}
.form .contract-preview{max-height:45vh;overflow:auto}
.checkline{display:flex!important;align-items:flex-start;gap:12px}
.checkline input{width:20px!important;min-height:20px;margin-top:4px;flex-shrink:0;accent-color:var(--kobalt)}
.plain-steps{padding-left:22px;line-height:2.2;margin:16px 0}

/* Beschlüsse */
.decision-controls{display:grid;gap:20px;margin:24px 0}
.decision-filters{display:flex;gap:8px;flex-wrap:wrap}
.filter-chip{padding:10px 16px;border:1px solid var(--rule);border-radius:999px;background:transparent;color:var(--ink-2);min-height:44px;font-size:14px;font-weight:500}
.filter-chip:hover{background:var(--paper-2);color:var(--ink)}
.filter-chip[aria-pressed="true"],.filter-chip[aria-pressed="true"]:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.decision-search{display:grid;gap:8px;font-size:14px;font-weight:600;max-width:440px}
.decision-search input{border:1px solid var(--rule);border-radius:12px;padding:13px;background:var(--field);color:var(--ink);min-width:0;font:inherit}
.decision-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.decision-row{background:var(--field);border:1px solid var(--rule);border-radius:20px;padding:24px;display:flex;flex-direction:column;gap:20px}
.decision-main{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
.decision-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:18px 0;margin:0}
.decision-facts dt{font-size:12px;color:var(--ink-2);margin-bottom:8px}
.decision-facts dd{margin:0;font:700 20px var(--font-ui);overflow-wrap:anywhere}
.decision-reason{font:400 17px/1.55 var(--font-doc);color:var(--ink-2);overflow-wrap:anywhere;flex:1;white-space:pre-wrap}
.decision-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;line-height:1.8;color:var(--ink-2)}
.decision-guidance{padding:14px 18px;background:color-mix(in srgb,var(--kobalt) 6%,transparent);border-left:3px solid var(--kobalt);border-radius:0 12px 12px 0;line-height:1.65;font-size:15px;margin-bottom:20px}
.decision-row .stock-id{min-width:0}
.decision-row .stock-id b{overflow-wrap:anywhere}

@media(max-width:1150px){.shell{grid-template-columns:212px minmax(0,1fr)}
.sidebar{padding:28px 12px}
.content{padding:28px 26px}
.topbar{padding:0 26px}
.overview-grid,.lower-grid{grid-template-columns:minmax(0,1.5fr) minmax(245px,1fr)}
.panel-pad,.proposal-card{padding:20px}
.big-value{font-size:32px}
.stat-row b{font-size:17px}
}
@media(max-width:1050px){.decision-list{grid-template-columns:1fr}}
@media(max-width:900px){.overview-grid,.lower-grid,.split{grid-template-columns:1fr}
.content{padding:25px 23px}
.profile select{max-width:105px}
.breadcrumb{font-size:13px}
.summary-strip b{font-size:20px}
}
/* Handy: Club-Wahl oben, Hauptwege als Leiste unten */
@media(max-width:650px){
 .shell{display:block}
 .sidebar{position:relative;height:auto;padding:16px 18px;border-right:0;border-bottom:1px solid var(--rule);display:grid;grid-template-columns:1fr;gap:12px}
 .brand{padding:0;font-size:22px}
 .sidebar-bottom{display:none}
 .club-switch{display:block;padding:8px 14px;margin:0}
 .club-switch .linkbtn{font-size:13px;min-height:32px;padding:4px 0}
 .club-switch label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .club-switch select{margin:0;font-size:15px}
 .nav{position:fixed;bottom:0;left:0;right:0;z-index:20;display:grid;grid-template-columns:repeat(4,1fr);padding:7px 8px calc(7px + env(safe-area-inset-bottom));gap:4px;background:var(--paper);border-top:1px solid var(--rule)}
 .nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:54px;padding:6px 2px;font-size:12px;border-radius:16px}
 .nav .icon{width:20px;height:20px}
 .topbar{padding:12px 18px;min-height:56px;flex-wrap:wrap}
 .breadcrumb{display:none}
 .top-actions{width:100%;justify-content:space-between;gap:8px;flex-wrap:wrap}
 .content{padding:24px 18px 96px}
 .page-heading{display:block}
 .page-heading>.btn{margin-top:15px;padding:0 16px;font-size:14px}
 .page-heading>.btn .icon{display:none}
 h1{font-size:28px}
 .subtitle{font-size:17px}
 .mode-note{align-items:flex-start;font-size:13px;gap:9px}
 .big-value{font-size:34px}
 .summary-strip{gap:12px;padding:18px}
 .summary-strip b{font-size:17px}
 .summary-strip small{font-size:11px}
 .panel-pad{padding:20px}
 .table-wrap{margin-right:-4px}
 table{font-size:13px;min-width:470px}
 .member-table{min-width:560px}
 .footer{display:block;line-height:1.9}
 .footer>span{display:block}
 .broker-card{grid-template-columns:36px 1fr}
 .broker-card>.tag{grid-column:2}
 .document{align-items:flex-start;flex-wrap:wrap}
 .document .btn{font-size:13px;padding:0 12px}
 .vote-caption{font-size:11px}
 .stat-row b{font-size:15px}
 .stat-row{gap:8px}
 .event{flex-wrap:wrap}
 .event time{width:100%;margin-left:18px}
 .profile select{max-width:145px}
 .profile b{max-width:95px}
 .dialog-head h2{font-size:18px}
 .onboarding{margin:24px 16px;padding:26px}
 .today-heading{padding:22px 20px}
 .today-heading h2{font-size:21px}
 .today-heading p{font-size:14px}
 .task-count{font-size:19px;min-width:44px;height:44px}
 .task-row{padding:20px;gap:12px;flex-wrap:wrap;align-items:flex-start}
 .task-symbol{width:36px;height:36px}
 .task-content{flex-basis:calc(100% - 48px)}
 .task-row>.btn{width:100%;margin-top:4px}
 .task-content h3{font-size:17px}
 .task-content p:not(.task-kind){font-size:14px}
 .today-bottom{padding:16px 20px;gap:8px}
 .today-bottom>.btn,.today-bottom>.linkbtn{width:100%}
 .calm-empty{padding:24px 20px;gap:12px}
 .calm-empty>.icon{width:24px;height:24px}
 .calm-empty p{font-size:14px}
 .club-snapshot{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:22px 0}
 .club-snapshot b{font-size:20px}
 .club-snapshot>.linkbtn{justify-self:start}
 .club-snapshot small{line-height:1.5;display:block}
 .club-subnav{gap:4px}
 .club-subnav button{padding:8px 12px;font-size:13px}
 .club-link{padding:20px 18px;gap:12px}
 .club-link small{font-size:13px}
 .close{min-width:44px;min-height:44px}
}
@media(max-width:540px){
 .topbar{align-items:flex-start;gap:10px}
 .contract-preview{padding:16px}
 .document{gap:12px}
}
@media(max-width:480px){
 .decision-row{padding:18px}
 .decision-facts dd{font-size:16px}
 .decision-facts dt{font-size:11px}
 .decision-bottom{align-items:flex-start;flex-direction:column}
 .decision-bottom .btn{width:100%}
 .decision-search{max-width:none}
 .filter-chip{font-size:13px;padding:9px 12px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

/* Startphase, Startseite und Rechtsseiten (start.js, app/rechtliches).
   Tinte auf Papier: kühles Papierweiß, tiefe Tinte für Text und Knöpfe, Kobalt nur für den Kreis.
   Schibsted Grotesk für Oberfläche und Überschriften, Newsreader für alles, was ein Dokument ist.
   Einziges Schmuckelement ist der Kreis (.kr-ring); sonst tragen Schrift, Linie und Abstand. */
@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:400 900;font-display:swap;src:url(/fonts/schibsted-grotesk-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-weight:400 900;font-display:swap;src:url(/fonts/schibsted-grotesk-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Newsreader";font-style:normal;font-weight:200 800;font-display:swap;src:url(/fonts/newsreader-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Newsreader";font-style:normal;font-weight:200 800;font-display:swap;src:url(/fonts/newsreader-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Newsreader";font-style:italic;font-weight:200 800;font-display:swap;src:url(/fonts/newsreader-latin-wght-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F,U+20AC}

:root{
 --paper:#f3f4f0;--paper-2:#e8eae3;--field:#fcfcfa;--rule:#cdd1c6;--ink:#18213a;--ink-2:#4e5568;
 --kobalt:#2f47d6;--flieder:#a99fdb;--gruen:#1d7550;--ocker:#94600f;--rot:#b0352a;
 --block:#18213a;--block-ink:#f3f4f0;--block-2:#b9bed0;--btn:#18213a;--btn-ink:#f3f4f0;
 --font-ui:"Schibsted Grotesk",-apple-system,"Segoe UI",system-ui,sans-serif;
 --font-doc:"Newsreader",Georgia,"Times New Roman",serif;
 --ease:cubic-bezier(.2,.8,.2,1);
 /* Alte Namen zeigen auf die neuen Werte, damit nichts ohne Farbe bleibt. */
 --sk-bg:var(--paper);--sk-card:var(--paper);--sk-ink:var(--ink);--sk-sub:var(--ink-2);--sk-sep:var(--rule);--sk-fill:var(--paper-2);
 --sk-tint:var(--ink);--sk-tint-ink:var(--paper);--sk-tint-soft:var(--paper-2);--sk-green:var(--gruen);--sk-amber:var(--ocker);--sk-red:var(--rot);
 --sk-font:var(--font-ui);--sk-display:var(--font-ui);--sk-ease:var(--ease);
 color-scheme:light dark;
}
@media (prefers-color-scheme:dark){:root{
 --paper:#0f1326;--paper-2:#1a1f3a;--field:#141933;--rule:#2d3456;--ink:#e8eaf2;--ink-2:#a6acc2;
 --kobalt:#8d9cff;--flieder:#bbb2ec;--gruen:#62cf9e;--ocker:#e0b15e;--rot:#ff8c7f;
 --block:#222a56;--block-ink:#eef0f8;--block-2:#b4bbdc;--btn:#e8eaf2;--btn-ink:#0f1326;
}}

:root:has(.sk-page){background:var(--paper)}
body:has(.sk-page){margin:0;background:var(--paper);color:var(--ink);font-family:var(--font-ui);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-feature-settings:"ss01"}
.sk-page{box-sizing:border-box;max-width:720px;margin:0 auto;padding:0 max(20px,env(safe-area-inset-right)) calc(48px + env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));font-size:17px;line-height:1.5;color:var(--ink)}
.sk-page *,.sk-dialog *{box-sizing:border-box}
.sk-page a{color:var(--ink);text-decoration-color:color-mix(in srgb,var(--ink) 35%,transparent);text-underline-offset:3px}
.sk-page a:hover{text-decoration-color:currentColor}

/* Kopf */
.sk-top{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;min-height:64px;margin:0 -20px;padding:env(safe-area-inset-top) 20px 0;background:var(--paper)}
.sk-brand{display:inline-flex;align-items:center;gap:10px;font:750 21px/1 var(--font-ui);letter-spacing:-.03em;color:var(--ink)!important;text-decoration:none}
.sk-brand .mark{width:22px;height:22px;border:5px solid var(--kobalt);border-radius:50%;position:relative}
.sk-brand .mark:after{content:"";position:absolute;width:10px;height:10px;right:-8px;bottom:-6px;border:2.5px solid var(--paper);background:var(--flieder);border-radius:50%}
.sk-who{font-size:15px;color:var(--ink-2);display:inline-flex;align-items:center;gap:8px}
.sk-back{display:inline-flex;align-items:center;min-height:44px;font-size:15px;color:var(--ink-2)!important;text-decoration:none}

/* Schrift */
.sk-hero{padding:40px 0 8px}
.sk-hero h1,.sk-card h1,.sk-ideahead h1,.sk-h1{font:760 clamp(34px,6.4vw,52px)/1.02 var(--font-ui);letter-spacing:-.035em;margin:0 0 14px;color:var(--ink);text-wrap:balance;hyphens:auto;overflow-wrap:break-word}
.sk-h1{margin:28px 0 20px}
.sk-lead{font:400 20px/1.5 var(--font-doc);color:var(--ink-2);margin:0 0 24px;max-width:36em;text-wrap:pretty}
.sk-muted{color:var(--ink-2);font-size:16px;margin:0}
.sk-small{font-size:14px;color:var(--ink-2);margin:12px 0 0;line-height:1.45}
.sk-opt{font-weight:400;color:var(--ink-2);font-size:14px}
.sk-eyebrow{font-size:15px;color:var(--ink-2);font-weight:500;margin:0 0 8px}
.sk-num{font-variant-numeric:tabular-nums}

/* Knöpfe: rund wie der Kreis, gefüllt in Tinte oder als Umriss */
.sk-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 24px;border:0;border-radius:999px;background:var(--btn);color:var(--btn-ink)!important;font:600 17px/1 var(--font-ui);letter-spacing:-.01em;text-decoration:none;cursor:pointer;transition:background .15s,box-shadow .15s,transform .1s}
.sk-btn:hover{background:color-mix(in srgb,var(--btn) 86%,var(--kobalt))}
.sk-btn:active{transform:scale(.98)}
.sk-btn.ghost{background:transparent;color:var(--ink)!important;box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--ink) 32%,transparent)}
.sk-btn.ghost:hover{background:var(--paper-2);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--ink) 55%,transparent)}
.sk-btn.small{min-height:38px;padding:0 16px;font-size:15px}
.sk-btn.selected,.sk-btn.selected:hover{background:var(--gruen);color:var(--paper)!important;box-shadow:none}
.sk-btn.danger{background:transparent;color:var(--rot)!important;box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--rot) 45%,transparent)}
.sk-btn.danger:not(.ghost):not(.small){background:var(--rot);color:var(--paper)!important;box-shadow:none}
.sk-btn:focus-visible,.sk-link:focus-visible,.sk-path:focus-visible,.sk-item:focus-visible,.sk-x:focus-visible{outline:2.5px solid var(--kobalt);outline-offset:3px}
.sk-link{display:inline-flex;align-items:center;min-height:44px;border:0;background:none;padding:0;color:var(--ink);font:500 15px var(--font-ui);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--ink) 30%,transparent);text-underline-offset:3px;cursor:pointer}
.sk-link:hover{text-decoration-color:currentColor}
.sk-link.danger{color:var(--rot);text-decoration-color:color-mix(in srgb,var(--rot) 40%,transparent)}

/* Listen: Zeilen zwischen Linien, keine Kacheln */
.sk-paths,.sk-list{display:grid;margin:32px 0 0;padding:0;list-style:none;border-top:1px solid var(--rule)}
.sk-list{margin:4px 0 0}
.sk-path,.sk-item{position:relative;display:grid;gap:3px;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--rule);border-radius:0;padding:16px 44px 16px 0;color:var(--ink)!important;text-decoration:none;min-height:64px;font-family:var(--font-ui);cursor:pointer;transition:padding .2s var(--ease),background .2s}
.sk-path:hover,.sk-item:hover{padding-left:8px;background:linear-gradient(90deg,var(--paper-2),transparent 70%)}
.sk-path:after,.sk-item:after{content:"";position:absolute;right:10px;top:50%;width:9px;height:9px;border:solid var(--ink-2);border-width:1.75px 1.75px 0 0;transform:translateY(-50%) rotate(45deg)}
.sk-path b,.sk-item b{font-size:18px;font-weight:600;letter-spacing:-.01em}.sk-path span,.sk-item span{font-size:15px;color:var(--ink-2)}

/* Abschnitte: Linie oben, Luft, keine Karten */
.sk-card,.sk-section{padding:28px 0 32px;margin:0;border-top:1px solid var(--rule)}
.sk-card:first-of-type{border-top:0;padding-top:36px}
.sk-quiet{padding-top:20px}
.sk-section h2{font:700 23px/1.2 var(--font-ui);letter-spacing:-.02em;margin:0}
.sk-section h3{font:650 16px/1.3 var(--font-ui);color:var(--ink);margin:24px 0 8px}
.sk-row{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.sk-row .sk-actions{margin:0}

/* „Als Nächstes“: der eine dunkle Block je Seite */
.sk-next{margin:8px 0 28px;padding:26px 26px 28px;border-radius:22px;background:var(--block);color:var(--block-ink)}
.sk-next .sk-eyebrow{color:var(--flieder);margin-bottom:10px}
.sk-next h2{font:720 27px/1.15 var(--font-ui);letter-spacing:-.025em;margin:0 0 8px;color:var(--block-ink);text-wrap:balance}
.sk-next p{margin:0 0 20px;color:var(--block-2);font-size:17px;max-width:34em}
.sk-next .sk-btn{background:var(--block-ink);color:var(--block)!important}
.sk-next .sk-btn:hover{background:color-mix(in srgb,var(--block-ink) 88%,var(--flieder))}
.sk-next .sk-btn.ghost{background:transparent;color:var(--block-ink)!important;box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--block-ink) 45%,transparent)}
.sk-ideahead{padding:20px 0 18px}

/* Formulare */
.sk-form{display:grid;gap:18px}
.sk-form label{display:grid;gap:7px;font-weight:600;font-size:15px}
.sk-form input:not([type=radio]):not([type=checkbox]),.sk-form textarea,.sk-form select,.sk-inline input,.sk-linkbox input{width:100%;min-height:48px;padding:12px 14px;border:1px solid var(--rule);border-radius:12px;background:var(--field);font:400 17px var(--font-ui);color:var(--ink);outline:none;transition:border-color .15s,box-shadow .15s}
.sk-form textarea{font-family:var(--font-doc);font-size:18px;line-height:1.45}
.sk-form input:focus,.sk-form textarea:focus,.sk-form select:focus,.sk-inline input:focus,.sk-linkbox input:focus{border-color:var(--kobalt);box-shadow:0 0 0 3px color-mix(in srgb,var(--kobalt) 22%,transparent)}
.sk-form fieldset{border:0;padding:0;margin:0;display:grid}
.sk-form fieldset>.sk-radio:first-of-type{border-top:1px solid var(--rule)}
.sk-form legend{font-weight:600;font-size:15px;margin-bottom:8px;padding:0}
.sk-radio{position:relative;display:flex!important;align-items:center;gap:12px;font-weight:400!important;font-size:17px!important;padding:13px 4px 13px 36px;min-height:50px;border-bottom:1px solid var(--rule);cursor:pointer}
.sk-radio input{position:absolute;opacity:0;pointer-events:none}
.sk-radio:before{content:"";position:absolute;left:4px;top:50%;width:20px;height:20px;margin-top:-10px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--ink-2);transition:box-shadow .15s}
.sk-radio:has(input:checked){font-weight:600!important}
.sk-radio:has(input:checked):before{box-shadow:inset 0 0 0 6px var(--kobalt)}
/* Kontrollkästchen in derselben Zeile: eckig mit Haken, damit sie nicht wie eine Auswahl aussehen */
.sk-radio:has(input[type=checkbox]):before{border-radius:6px}
.sk-radio:has(input[type=checkbox]:checked):before{box-shadow:none;background:var(--kobalt)}
.sk-radio:has(input[type=checkbox]:checked):after{content:"";position:absolute;left:11px;top:50%;width:5px;height:10px;margin-top:-7px;border:solid var(--paper);border-width:0 2px 2px 0;transform:rotate(45deg)}
.sk-radio:has(input:focus-visible){outline:2.5px solid var(--kobalt);outline-offset:2px}
.sk-invite .sk-form{margin:24px 0 0}
.sk-dialog .sk-form .sk-radio{margin:0}
.sk-inline{display:flex;gap:10px;margin-top:14px}
.sk-inline input{flex:1}
.sk-taskform{margin-top:18px;padding-top:18px;border-top:1px solid var(--rule)}
.sk-actions,.sk-choices{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.sk-choices .sk-btn{flex:1 1 180px}
.sk-hidden{display:none}

/* Hinweise: farbige Linie links statt farbiger Kachel */
.sk-idea{display:grid;gap:4px;border-left:3px solid var(--kobalt);padding:4px 0 4px 16px;margin:0 0 22px}
.sk-idea b{font-size:19px;letter-spacing:-.01em}.sk-idea span{font:400 18px/1.45 var(--font-doc);color:var(--ink-2)}
.sk-note,.sk-banner,.sk-demo{border-left:3px solid var(--ocker);background:color-mix(in srgb,var(--ocker) 7%,transparent);border-radius:0 12px 12px 0;padding:12px 16px;font-size:15px;margin:12px 0}
.sk-banner{border-left-color:var(--kobalt);background:color-mix(in srgb,var(--kobalt) 6%,transparent);margin:0 0 14px}
.sk-demo{display:flex;gap:12px;align-items:baseline;margin:0 0 20px}
.sk-demo b{flex:none;font-size:15px;color:var(--ocker)}
.sk-note.sk-passkey{border-left-color:var(--kobalt);background:color-mix(in srgb,var(--kobalt) 6%,transparent)}
.sk-note.sk-passkey .sk-actions{margin-top:12px}
.sk-linkbox{display:flex;gap:10px;margin:10px 0}
.sk-linkbox input{font-size:15px}
.sk-copy{width:100%;min-height:90px}

/* Personen, Aufgaben, Gesamtbild */
.sk-people,.sk-plain,.sk-tasks,.sk-summary{list-style:none;margin:0;padding:0;display:grid}
.sk-person{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--rule)}
.sk-person:last-child{border-bottom:0}
.sk-avatar{grid-row:span 2;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font:650 16px var(--font-ui);color:#fff;background:#3a4a8c}
.sk-avatar.c1{background:#1d7550}.sk-avatar.c2{background:#a5641a}.sk-avatar.c3{background:#6b5bb5}.sk-avatar.c4{background:#2f6f8f}
.sk-person>div:not(.sk-tools){font-size:17px}
.sk-tools{grid-column:2;display:flex;flex-wrap:wrap;gap:0 18px;margin-top:-6px}
.sk-plain li{padding:12px 0;font:400 18px/1.45 var(--font-doc);border-bottom:1px solid var(--rule)}
.sk-plain li:last-child{border-bottom:0}
.sk-plain li .sk-small,.sk-plain li .sk-link{font-family:var(--font-ui)}
/* Status als Wort mit Punkt davor, nicht als bunte Pille */
.sk-chip{display:inline-flex;align-items:center;gap:6px;font:500 14px var(--font-ui);color:var(--ink-2);margin-left:10px;vertical-align:1px}
.sk-chip:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ink-2);opacity:.6}
.sk-chip.green:before{background:var(--gruen);opacity:1}.sk-chip.blue:before{background:var(--kobalt);opacity:1}.sk-chip.amber:before{background:var(--ocker);opacity:1}.sk-chip.grey:before{opacity:.45}
.sk-chip.plain:before{display:none}
.sk-summary li{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:14px 0;border-bottom:1px solid var(--rule)}
.sk-summary li:last-child{border-bottom:0}
.sk-summary li span{font-weight:650}.sk-summary li .sk-chip{grid-column:2;grid-row:1;margin:0}
.sk-summary li p{grid-column:1/-1;margin:0;font:400 18px/1.45 var(--font-doc);color:var(--ink-2)}
.sk-agenda{margin:0;padding-left:26px;display:grid;gap:10px;font:400 18px/1.45 var(--font-doc)}
.sk-agenda li::marker{color:var(--ink-2);font:500 15px var(--font-ui);font-variant-numeric:tabular-nums}
.sk-agenda .sk-chip,.sk-agenda .sk-link{font-family:var(--font-ui)}
.sk-meet{margin:0 0 6px;font-size:18px}
.sk-tasks li{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:12px 0;border-bottom:1px solid var(--rule)}
.sk-tasks li:last-child{border-bottom:0}
.sk-tasks label{display:flex;gap:14px;align-items:flex-start;cursor:pointer}
.sk-tasks input{appearance:none;-webkit-appearance:none;flex:none;width:24px;height:24px;margin:1px 0 0;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--ink-2);display:grid;place-items:center;transition:background .15s,box-shadow .15s;cursor:pointer}
.sk-tasks input:checked{background:var(--gruen);box-shadow:none}
.sk-tasks input:checked:after{content:"";width:5px;height:10px;border:solid var(--paper);border-width:0 2px 2px 0;transform:translateY(-1px) rotate(45deg)}
.sk-tasks input:disabled{opacity:.45;cursor:default}
.sk-tasks small{display:block;color:var(--ink-2);font-size:14px}
.sk-tasks li.done b{text-decoration:line-through;color:var(--ink-2)}
.sk-foot{margin-top:56px;padding-top:20px;border-top:1px solid var(--rule);font-size:14px;color:var(--ink-2);line-height:1.6}
.sk-foot a{color:var(--ink-2)}

/* Passkeys */
.sk-item.static{padding-right:0;grid-template-columns:1fr auto;align-items:center;column-gap:12px;cursor:default}
.sk-item.static:hover{padding-left:0;background:none}
.sk-item.static:after{display:none}
.sk-item.static>.sk-btn{grid-row:1/3;grid-column:2}
.sk-stack .sk-btn{width:100%}
.sk-or{text-align:center;margin:16px 0 6px}

/* Dialoge: auf dem Handy als Blatt von unten, auf dem Desktop mittig */
.sk-dialog{border:0;border-radius:22px;padding:0;width:min(560px,calc(100vw - 32px));max-height:calc(100vh - 32px);background:var(--paper);color:var(--ink);font-family:var(--font-ui);box-shadow:0 30px 80px rgba(10,14,30,.28)}
.sk-dialog[open]{animation:sk-pop .26s var(--ease)}
.sk-dialog::backdrop{background:color-mix(in srgb,#0f1326 45%,transparent);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.sk-modal-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:20px 20px 0 24px}
.sk-modal-head h2{margin:0;font:720 22px/1.2 var(--font-ui);letter-spacing:-.02em}
.sk-x{display:grid;place-items:center;width:34px;height:34px;min-width:34px;border:0;border-radius:50%;background:var(--paper-2);font-size:20px;line-height:1;color:var(--ink-2);position:relative;cursor:pointer}
.sk-x:before{content:"";position:absolute;inset:-6px}
.sk-modal-body{padding:14px 24px calc(24px + env(safe-area-inset-bottom))}
@keyframes sk-pop{from{opacity:0;transform:translateY(6px) scale(.98)}to{opacity:1;transform:none}}
@keyframes sk-sheet{from{transform:translateY(100%)}to{transform:none}}
body:has(.sk-page) #toast{border-radius:999px;background:var(--btn);color:var(--btn-ink);font:500 15px var(--font-ui);padding:12px 20px;bottom:calc(24px + env(safe-area-inset-bottom))}
.sk-dialog #toast{border-radius:999px;background:var(--btn);color:var(--btn-ink);font:500 15px var(--font-ui);padding:12px 20px}

/* Rechtsseiten */
.sk-legal .sk-section h2{font-size:18px;margin:24px 0 6px}.sk-legal .sk-section h2:first-child{margin-top:0}
.sk-legal p,.sk-legal li{font:400 17px/1.55 var(--font-doc);color:var(--ink-2)}.sk-legal ul{padding-left:20px;display:grid;gap:6px}

/* Der Kreis: Plätze um einen Ring. Umriss gestrichelt = eingeladen, Umriss = interessiert,
   gefüllt = macht mit. Die Liste darunter bleibt die eigentliche Auskunft. */
.kr-ring{display:block;width:100%;height:auto;overflow:visible}
.kr-track{fill:none;stroke:var(--kobalt);stroke-width:2}
.kr-seat circle{fill:var(--paper);stroke:var(--kobalt);stroke-width:2}
.kr-seat text{fill:var(--kobalt);font-family:var(--font-ui);font-weight:650;text-anchor:middle;dominant-baseline:central;letter-spacing:-.01em}
.kr-seat.in circle{fill:var(--kobalt)}
.kr-seat.in text{fill:var(--paper)}
.kr-seat.open circle{stroke:var(--ink-2);stroke-dasharray:3 4}
.kr-seat.open text{fill:var(--ink-2)}
.kr-seat.out{opacity:.35}
.kr-seat.out circle{stroke:var(--ink-2)}.kr-seat.out text{fill:var(--ink-2)}
.kr-seat.more circle{stroke:var(--ink-2);stroke-dasharray:3 4}.kr-seat.more text{fill:var(--ink-2)}
.kr-seat.me circle{stroke:var(--flieder);stroke-width:4}
.kr-ring.play .kr-track{stroke-dasharray:100;animation:kr-draw 1.2s var(--ease) .15s both}
.kr-ring.play .kr-seat{transform-box:fill-box;transform-origin:center;animation:kr-seat .45s var(--ease) calc(.55s + var(--i) * .11s) both}
.kr-ring.play .kr-seat.in circle{animation:kr-fill .5s ease calc(1.75s + var(--i) * .09s) both}
.kr-ring.play .kr-seat.in text{animation:kr-text .5s ease calc(1.75s + var(--i) * .09s) both}
@keyframes kr-draw{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
@keyframes kr-seat{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:none}}
@keyframes kr-fill{from{fill:var(--paper)}to{fill:var(--kobalt)}}
@keyframes kr-text{from{fill:var(--kobalt)}to{fill:var(--paper)}}
.kr-count{font:500 15px var(--font-ui);color:var(--ink-2);text-align:center;margin:10px 0 0}

/* Vorhaben-Kopf: Titel links, Kreis rechts */
.sk-ideahead.with-ring{display:grid;grid-template-columns:1fr 168px;gap:8px 28px;align-items:center}
.sk-ideahead.with-ring .kr-wrap{grid-column:2;grid-row:1/span 3}
.sk-ideahead .kr-track,.sk-ideahead .kr-seat circle{stroke-width:4}
.sk-ideahead .kr-seat.me circle{stroke-width:7}

/* Startseite: breiter als die App-Seiten */
.sk-page.sk-wide{max-width:1120px}
.kr-hero{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:40px 56px;align-items:center;padding:48px 0 72px}
.kr-hero h1{font:780 clamp(38px,5.6vw,72px)/.98 var(--font-ui);letter-spacing:-.045em;margin:0 0 24px;text-wrap:balance}
.kr-hero .sk-lead{font-size:21px;max-width:31em}
.kr-hero .sk-actions{margin-top:28px}
.kr-hero .kr-wrap{max-width:470px;justify-self:end;width:100%}
.kr-hero .kr-track{stroke-width:2.5}
.kr-band{border-top:1px solid var(--rule);padding:56px 0 64px;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,2fr);gap:24px 72px}
.kr-band h2{font:740 30px/1.1 var(--font-ui);letter-spacing:-.03em;margin:0;text-wrap:balance}
.kr-band>p{grid-column:2;margin:0}
.kr-band.stack{grid-template-columns:1fr;gap:36px}
.kr-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px;counter-reset:schritt}
.kr-steps li{counter-increment:schritt;position:relative;padding-top:44px}
.kr-steps li:before{content:counter(schritt);position:absolute;top:0;left:0;width:30px;height:30px;border-radius:50%;box-shadow:inset 0 0 0 2px var(--kobalt);color:var(--kobalt);font:700 14px/30px var(--font-ui);text-align:center}
.kr-steps li:last-child:before{background:var(--kobalt);color:var(--paper)}
.kr-steps li:not(:last-child):after{content:"";position:absolute;top:15px;left:40px;right:-18px;height:2px;background:color-mix(in srgb,var(--kobalt) 30%,transparent)}
.kr-steps b{display:block;font:680 18px/1.25 var(--font-ui);letter-spacing:-.015em;margin-bottom:6px}
.kr-steps span{display:block;font:400 17px/1.45 var(--font-doc);color:var(--ink-2)}
.kr-terms{display:grid;gap:22px;margin:0;padding:0;list-style:none}
.kr-terms li{font:400 20px/1.5 var(--font-doc);color:var(--ink-2);max-width:38em}
.kr-terms b{font:650 20px/1.4 var(--font-ui);color:var(--ink);letter-spacing:-.015em}
.kr-band .sk-paths{margin:0}

@media (max-width:860px){
 .kr-hero{grid-template-columns:1fr;padding:28px 0 48px;gap:36px}
 .kr-hero .kr-wrap{max-width:320px}
 .kr-band{grid-template-columns:1fr;padding:40px 0 44px}
 .kr-band>p{grid-column:1}
 .kr-steps{grid-template-columns:1fr;gap:0}
 .kr-steps li{padding:0 0 26px 48px}
 .kr-steps li:before{top:-2px}
 .kr-steps li:not(:last-child):after{top:34px;bottom:4px;left:14px;right:auto;width:2px;height:auto}
}
@media (max-width:600px){
 .sk-page{font-size:16px}
 .sk-inline,.sk-linkbox{flex-direction:column}
 .sk-next{padding:22px 20px 24px;border-radius:18px}
 .sk-ideahead.with-ring{grid-template-columns:1fr 112px;gap:4px 16px}
 .sk-ideahead .kr-seat text{display:none}
 .sk-ideahead .kr-count{font-size:13px;line-height:1.3}
 .sk-dialog{width:100%;max-width:100%;margin:auto 0 0;border-radius:22px 22px 0 0;max-height:92vh}
 .sk-dialog[open]{animation:sk-sheet .32s var(--ease)}
 .sk-dialog:before{content:"";display:block;width:36px;height:5px;border-radius:3px;background:var(--rule);margin:8px auto 0}
}
@media (prefers-reduced-motion:reduce){.kr-ring.play *,.sk-dialog,.sk-path,.sk-item{animation:none!important;transition:none!important}}


/* Club-App: Aufgaben je Person */
.duty-tags{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:8px}
.duty-choices{border:0;padding:0;margin:0 0 12px;display:grid;gap:8px}
.duty-choices label.check{display:flex;gap:14px;align-items:center;justify-content:flex-start;min-height:48px;margin:0;font-size:16px;font-weight:500;border-bottom:1px solid var(--rule)}
.duty-choices label.check:last-of-type{border-bottom:0}

/* Club-App: nächste Sitzung */
.session-card{margin:18px 0}
.session-card h2{margin:0 0 4px}
.session-items{margin:8px 0 0;padding-left:18px;display:grid;gap:6px}

/* Club: Aufgaben, Leitfäden und Depot-Dashboard */
.back-link{margin:0 0 6px;padding-left:0}
.duty-strip{margin-top:28px}
.duty-strip .club-links{margin-top:6px}
.guide-list{list-style:none;margin:0;padding:0;counter-reset:schritt}
.guide-list li{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 0;border-bottom:1px solid var(--rule)}
.guide-list li:last-child{border-bottom:0}
.guide-list label{display:flex;align-items:flex-start;gap:14px;cursor:pointer;font-size:16px;line-height:1.5;flex:1}
.guide-list input{appearance:none;-webkit-appearance:none;flex:none;width:24px;height:24px;margin:1px 0 0;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--ink-2);display:grid;place-items:center;cursor:pointer;transition:background .15s,box-shadow .15s}
.guide-list input:checked{background:var(--gruen);box-shadow:none}
.guide-list input:checked:after{content:"";width:5px;height:10px;border:solid var(--paper);border-width:0 2px 2px 0;transform:translateY(-1px) rotate(45deg)}
.guide-list li.done label span{color:var(--ink-2);text-decoration:line-through;text-decoration-color:color-mix(in srgb,var(--ink-2) 50%,transparent)}
.guide-list .linkbtn{flex:none;white-space:nowrap}
.guide-decisions>h2{margin-bottom:6px}
.guide-decisions>.text{margin-bottom:16px}
.decision-card{margin-top:16px}
.decision-card h3{font-size:19px;letter-spacing:-.015em}
.decision-q{font:400 19px/1.45 var(--font-doc);color:var(--ink);margin:8px 0 18px}
.decision-cols{display:grid;grid-template-columns:1fr 1fr;gap:20px 32px;border-top:1px solid var(--rule);padding-top:16px}
.decision-cols h4{margin:0 0 8px;font-size:14px;font-weight:650;color:var(--ink-2)}
.option-list,.consider-list{margin:0;padding-left:20px;display:grid;gap:8px;font:400 17px/1.45 var(--font-doc)}
.option-list li::marker{color:var(--kobalt);font:700 14px var(--font-ui)}
.consider-list{list-style:none;padding:0}
.consider-list li{position:relative;padding-left:18px;color:var(--ink-2)}
.consider-list li:before{content:"";position:absolute;left:2px;top:.65em;width:6px;height:6px;border-radius:50%;background:var(--ocker)}
.decision-card .toolbar{margin-top:18px}
.share-text{width:100%;min-height:220px;margin:16px 0 14px;padding:14px;border:1px solid var(--rule);border-radius:14px;background:var(--field);color:var(--ink);font:400 15px/1.5 var(--font-ui);resize:vertical}

.depot-switch{margin:0 0 18px}
.depot-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:24px 40px;align-items:center;padding:30px 32px}
.depot-big{font:780 clamp(40px,5vw,60px)/1 var(--font-ui);letter-spacing:-.04em;margin:10px 0 10px}
.depot-sub{font:400 18px/1.45 var(--font-doc);color:var(--ink-2);margin:0 0 22px}
.depot-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0;padding-top:18px;border-top:1px solid var(--rule)}
.depot-stats dt{font-size:13px;color:var(--ink-2);margin-bottom:6px}
.depot-stats dd{margin:0;font:700 20px var(--font-ui);letter-spacing:-.015em}
.depot-ring{display:grid;grid-template-columns:minmax(150px,200px) minmax(0,1fr);gap:20px;align-items:center}
.owner-ring{width:100%;height:auto;display:block}
.owner-ring .track{fill:none;stroke:var(--paper-2);stroke-width:13}
.owner-ring .seg{fill:none;stroke-width:13;transition:opacity .2s}
.owner-ring .seg.dim,.owner-legend li.dim{opacity:.25}
.owner-ring text{text-anchor:middle;font-family:var(--font-ui)}
.owner-ring .ring-big{font-size:19px;font-weight:760;fill:var(--ink);letter-spacing:-.02em}
.owner-ring .ring-small{font-size:9px;font-weight:500;fill:var(--ink-2)}
.c0{--c:var(--kobalt)}.c1{--c:var(--flieder)}.c2{--c:var(--gruen)}.c3{--c:var(--ocker)}.c4{--c:color-mix(in srgb,var(--kobalt) 45%,var(--gruen))}.c5{--c:var(--ink-2)}
.owner-ring .seg{stroke:var(--c)}
.owner-legend{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.owner-legend li{display:grid;grid-template-columns:12px minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:10px;align-items:baseline;transition:opacity .2s}
.owner-legend i{width:10px;height:10px;border-radius:50%;background:var(--c);align-self:center}
.owner-legend span{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.owner-legend b{font-weight:650}
.owner-legend li>small{grid-column:2/4;color:var(--ink-2);font-size:13px}
.alloc{display:flex;gap:3px;height:12px;border-radius:999px;overflow:hidden;margin:4px 0 12px}
.alloc span{height:100%;min-width:3px}
.p0{background:var(--kobalt)}.p1{background:var(--flieder)}.p2{background:var(--gruen)}.p3{background:var(--ocker)}.p4{background:var(--ink-2)}.cash{background:color-mix(in srgb,var(--ink-2) 55%,var(--paper))}
.alloc-legend{list-style:none;margin:0 0 8px;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px;color:var(--ink-2)}
.alloc-legend li{display:flex;align-items:center;gap:7px}
.alloc-legend i{width:9px;height:9px;border-radius:50%}
.alloc-legend b{color:var(--ink);font-weight:600}
.holding-list{list-style:none;margin:8px 0 0;padding:0}
.holding{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(90px,1fr) 190px;gap:12px 28px;align-items:center;padding:16px 0;border-bottom:1px solid var(--rule)}
.holding:last-child{border-bottom:0}
.holding-bar{height:8px;border-radius:999px;background:var(--paper-2);overflow:hidden}
.holding-bar span{display:block;height:100%;border-radius:999px;min-width:2px}
.holding-num{text-align:right}
.holding-num b{display:block;font-size:17px;font-weight:700}
.holding-num small{display:block;color:var(--ink-2);font-size:13px;margin-top:3px}
.holding-num .pos{color:var(--gruen)}.holding-num .neg{color:var(--rot)}
.depot-empty{padding:18px 0 6px;display:grid;gap:14px;justify-items:start}
.owner-table td,.owner-table th{white-space:nowrap}
.owner-table tr.sum td{border-top:1.5px solid var(--ink);font-weight:700}
.owner-section .text{margin:-8px 0 18px}
@media(max-width:900px){
 .depot-hero{grid-template-columns:1fr;padding:24px}
 .decision-cols{grid-template-columns:1fr}
}
@media(max-width:650px){
 .depot-big{font-size:42px}
 .depot-stats{grid-template-columns:1fr 1fr}
 .depot-stats>div:last-child{grid-column:1/-1}
 .depot-ring{grid-template-columns:132px minmax(0,1fr);gap:16px}
 .holding{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"id val" "bar bar" "meta meta";gap:10px 14px}
 .holding .stock-id{grid-area:id}
 .holding-bar{grid-area:bar}
 .holding-num{display:contents}
 .holding-num b{grid-area:val;text-align:right;align-self:center}
 .holding-num small{grid-area:meta;text-align:left;margin-top:-4px}
 .guide-list li{flex-wrap:wrap;gap:6px 14px}
 .guide-list label{flex:1 1 100%}
 .guide-list .linkbtn{margin-left:38px}
 .decision-q{font-size:18px}
}
.cash-ticker{font-size:18px;font-weight:600}
