:root {
    --bg: #f6f7f2;
    --surface: #ffffff;
    --surface-soft: #eef3ee;
    --ink: #17231e;
    --muted: #68736e;
    --muted-strong: #435048;
    --line: #dfe6e1;
    --accent: #176d52;
    --accent-dark: #0f503c;
    --accent-soft: #dff1e8;
    --success: #247458;
    --danger: #a33d3d;
    --danger-soft: #faeaea;
    --shadow: 0 22px 70px rgba(27, 48, 39, .10);
    --shadow-soft: 0 10px 34px rgba(27, 48, 39, .07);
    --radius-lg: 30px;
    --radius-md: 20px;
    --radius-sm: 13px;
    --max: 1180px;
}

* { box-sizing: border-box; }

/* Das native hidden-Attribut muss auch gegen komponentenspezifische display-Regeln gewinnen. */
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at 8% 0%, rgba(207, 232, 219, .48), transparent 31rem),
        radial-gradient(circle at 100% 17%, rgba(225, 237, 225, .55), transparent 28rem),
        var(--bg);
    color: var(--ink);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 16px;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
}

button, input, textarea, select { font: inherit; }
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }

.page-shell {
    width: min(calc(100% - 32px), var(--max));
    margin: 0 auto;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.site-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 84px;
    gap: 24px;
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    font-weight: 780;
    letter-spacing: -.035em;
    font-size: 1.3rem;
}

.brand-mark {
    position: relative;
    width: 31px;
    height: 31px;
    display: block;
}
.brand-mark span {
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: var(--accent);
    transform-origin: 15.5px 15.5px;
}
.brand-mark span:nth-child(1) { left: 12px; top: 1px; }
.brand-mark span:nth-child(2) { right: 2px; top: 7px; }
.brand-mark span:nth-child(3) { right: 2px; bottom: 6px; }
.brand-mark span:nth-child(4) { left: 12px; bottom: 0; }
.brand-mark span:nth-child(5) { left: 2px; bottom: 6px; }
.brand-mark span:nth-child(6) {
    left: 1px;
    top: 7px;
    animation: join-mark .9s cubic-bezier(.2,.8,.2,1) .18s both;
}
@keyframes join-mark {
    from { opacity: 0; transform: translate(-9px,-6px) scale(.4); }
    to { opacity: 1; transform: translate(0,0) scale(1); }
}

.header-action {
    text-decoration: none;
    color: var(--accent-dark);
    font-weight: 680;
    padding: 10px 15px;
    border-radius: 999px;
}
.header-action:hover { background: rgba(255,255,255,.66); }

main { flex: 1; }
.site-footer {
    border-top: 1px solid var(--line);
    margin-top: 80px;
    padding: 28px 0 40px;
    color: var(--muted);
    display: flex;
    justify-content: space-between;
    gap: 24px;
    font-size: .9rem;
}
.site-footer nav { display: flex; gap: 20px; }
.site-footer a { text-decoration: none; }
.site-footer a:hover { color: var(--ink); }

.flash {
    border-radius: 14px;
    padding: 14px 18px;
    margin: 0 0 18px;
    font-weight: 650;
    box-shadow: var(--shadow-soft);
}
.flash-error { background: var(--danger-soft); color: #7c2d2d; }
.flash-success { background: var(--accent-soft); color: var(--accent-dark); }

.hero {
    min-height: 680px;
    display: grid;
    grid-template-columns: 1.03fr .97fr;
    gap: clamp(46px, 8vw, 110px);
    align-items: center;
    padding: 68px 0 92px;
}
.hero-copy h1,
.form-intro h1,
.public-room-header h1,
.confirmation-page h1,
.admin-heading h1,
.legal-page h1,
.error-page h1 {
    font-size: clamp(2.55rem, 6vw, 5.45rem);
    line-height: .98;
    letter-spacing: -.066em;
    margin: 0;
    max-width: 900px;
}
.hero-copy h1 { max-width: 680px; }
.hero-text {
    max-width: 650px;
    font-size: clamp(1.1rem, 2vw, 1.35rem);
    color: var(--muted);
    margin: 28px 0 30px;
}
.eyebrow {
    margin: 0 0 14px;
    color: var(--accent);
    text-transform: uppercase;
    letter-spacing: .14em;
    font-size: .76rem;
    font-weight: 820;
}
.hero-actions, .share-actions, .confirmation-actions, .settings-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}
.button {
    border: 0;
    border-radius: 999px;
    padding: 13px 20px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-weight: 740;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
}
.button:hover { transform: translateY(-1px); }
.button:active { transform: translateY(0); }
.button:disabled { opacity: .4; cursor: not-allowed; transform: none; }
.button-primary {
    color: #fff;
    background: var(--accent);
    box-shadow: 0 10px 26px rgba(23, 109, 82, .22);
}
.button-primary:hover { background: var(--accent-dark); }
.button-secondary {
    background: rgba(255,255,255,.78);
    color: var(--ink);
    border: 1px solid var(--line);
}
.button-secondary:hover { background: #fff; box-shadow: var(--shadow-soft); }
.button-whatsapp { background: #1f8f61; color: #fff; }
.button-danger { background: var(--danger); color: #fff; }
.button-large { padding: 16px 25px; font-size: 1.02rem; }
.full-width { width: 100%; }
.text-link { color: var(--accent-dark); font-weight: 720; text-decoration: none; padding: 12px 4px; }
.text-link:hover { text-decoration: underline; }

.trust-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 22px;
    margin-top: 30px;
    color: var(--muted);
    font-size: .9rem;
}
.trust-row span::before { content: "✓"; color: var(--accent); margin-right: 7px; font-weight: 900; }

.demo-card-wrap { position: relative; }
.demo-card-wrap::before {
    content: "";
    position: absolute;
    inset: 8% -10% -8% 8%;
    border-radius: 40px;
    background: linear-gradient(145deg, rgba(219,238,228,.8), rgba(246,247,242,.2));
    transform: rotate(4deg);
}
.demo-card {
    position: relative;
    background: rgba(255,255,255,.93);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255,255,255,.9);
    border-radius: 32px;
    padding: clamp(24px, 4vw, 38px);
    box-shadow: var(--shadow);
}
.demo-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; }
.demo-card h2 { font-size: clamp(1.55rem, 3vw, 2.15rem); line-height: 1.1; letter-spacing: -.04em; margin: 13px 0 0; }
.pill { display: inline-flex; border-radius: 999px; background: var(--accent-soft); color: var(--accent-dark); padding: 6px 10px; font-size: .78rem; font-weight: 760; }
.status-dot { width: 12px; height: 12px; border-radius: 50%; background: #42a277; box-shadow: 0 0 0 7px rgba(66,162,119,.12); margin-top: 8px; }
.progress-block { margin: 34px 0 26px; }
.progress-label { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; margin-bottom: 10px; }
.progress-label strong { font-size: 1.45rem; letter-spacing: -.04em; }
.progress-label span { color: var(--muted); font-size: .9rem; }
.progress { height: 9px; background: #e9eeea; border-radius: 999px; overflow: hidden; }
.progress span { display: block; height: 100%; background: var(--accent); border-radius: inherit; }
.demo-list { display: grid; gap: 10px; }
.demo-list > div { display: flex; justify-content: space-between; gap: 20px; padding: 14px 16px; background: var(--bg); border-radius: 14px; }
.demo-list strong { color: var(--accent-dark); font-size: .88rem; }
.demo-list .done { opacity: .62; }
.demo-cta { margin-top: 22px; text-align: center; background: var(--accent); color: #fff; padding: 14px; border-radius: 999px; font-weight: 760; }

.section { padding: 86px 0; }
.compact-section { padding-top: 44px; }
.section-heading { margin-bottom: 34px; }
.section-heading h2, .closing-cta h2, .publish-panel h2, .confirmation-card h2, .admin-section h2 {
    margin: 0;
    font-size: clamp(2rem, 4vw, 3.5rem);
    line-height: 1.02;
    letter-spacing: -.055em;
}
.split-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 28px; }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.feature-card { background: rgba(255,255,255,.76); border: 1px solid rgba(255,255,255,.86); border-radius: var(--radius-md); padding: 30px; box-shadow: var(--shadow-soft); }
.feature-number { color: var(--accent); font-size: .8rem; font-weight: 820; }
.feature-card h3 { font-size: 1.45rem; margin: 38px 0 10px; letter-spacing: -.035em; }
.feature-card p { margin: 0; color: var(--muted); }
.closing-cta { margin: 46px 0 18px; padding: 42px; border-radius: var(--radius-lg); background: var(--ink); color: white; display: flex; justify-content: space-between; align-items: center; gap: 30px; }
.closing-cta .eyebrow { color: #91cbb5; }
.recent-list { display: grid; gap: 10px; }
.recent-list a { background: #fff; border: 1px solid var(--line); border-radius: 15px; padding: 17px 19px; text-decoration: none; display: flex; justify-content: space-between; gap: 18px; }
.recent-list a:hover { border-color: #b7cabf; box-shadow: var(--shadow-soft); }
.recent-list strong { color: var(--accent); }
.muted { color: var(--muted); }

.form-page, .public-page, .admin-page, .confirmation-page, .legal-page, .error-page { padding: 46px 0 20px; }
.narrow-page { max-width: 760px; margin: 0 auto; }
.form-intro { margin: 34px 0 34px; }
.form-intro h1 { font-size: clamp(2.5rem, 5vw, 4.45rem); }
.form-intro > p:last-child { color: var(--muted); font-size: 1.08rem; max-width: 680px; }

.stepper { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; max-width: 760px; }
.stepper span { display: flex; align-items: center; gap: 8px; color: #98a29d; font-size: .84rem; font-weight: 700; }
.stepper i { width: 27px; height: 27px; border-radius: 50%; border: 1px solid #cad3ce; display: inline-flex; align-items: center; justify-content: center; font-style: normal; font-size: .78rem; }
.stepper span.active { color: var(--ink); }
.stepper span.active i { background: var(--accent); border-color: var(--accent); color: #fff; }
.stepper span.done { color: var(--accent-dark); }
.stepper span.done i { background: var(--accent-soft); border-color: transparent; color: var(--accent); }

.choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.choice-card { width: 100%; border: 1px solid var(--line); border-radius: 25px; background: rgba(255,255,255,.9); padding: 28px; display: grid; grid-template-columns: auto 1fr auto; gap: 18px; text-align: left; color: var(--ink); cursor: pointer; box-shadow: var(--shadow-soft); transition: .2s ease; }
.choice-card:hover { transform: translateY(-3px); border-color: #b6cbbf; box-shadow: var(--shadow); }
.choice-icon { width: 46px; height: 46px; border-radius: 14px; background: var(--accent-soft); color: var(--accent); display: inline-flex; align-items: center; justify-content: center; font-weight: 900; font-size: 1.25rem; }
.choice-card strong { display: block; font-size: 1.28rem; margin-bottom: 8px; letter-spacing: -.025em; }
.choice-card small { display: block; color: var(--muted); line-height: 1.5; }
.choice-card b { color: var(--accent); font-size: 1.45rem; font-weight: 500; }

.form-card, .option-editor, .soft-box, .share-card, .confirmation-card, .admin-section, .room-progress-card, .legal-card {
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(255,255,255,.9);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-soft);
}
.form-card { padding: clamp(22px, 4vw, 38px); }
.stack-form { display: grid; gap: 22px; }
.field { display: grid; gap: 8px; }
.field > span, fieldset legend { font-weight: 740; letter-spacing: -.015em; }
.field small, fieldset small { color: var(--muted); font-weight: 500; }
.field input, .field textarea, .field select {
    width: 100%;
    border: 1px solid #d7e0da;
    border-radius: 13px;
    padding: 13px 14px;
    background: #fbfcfa;
    color: var(--ink);
    outline: none;
    transition: border .18s ease, box-shadow .18s ease, background .18s ease;
}
.field input:focus, .field textarea:focus, .field select:focus { border-color: #7eb29d; box-shadow: 0 0 0 4px rgba(23,109,82,.10); background: #fff; }
.field textarea { resize: vertical; }
.field-large input { font-size: 1.12rem; padding: 16px; }
.field-group { display: grid; gap: 16px; }
.two-columns { grid-template-columns: 1fr 1fr; }
.three-columns { grid-template-columns: 1.4fr 1fr 1fr; }
.option-main-grid { grid-template-columns: minmax(0, 1fr) 150px; }
.soft-box { border: 1px solid var(--line); box-shadow: none; padding: 18px 20px 8px; margin: 0; }
.soft-box legend { padding: 0 7px; }
.soft-box > p { margin: 0 0 10px; font-size: .9rem; }
.switch-row, .radio-row { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 13px 0; border-top: 1px solid #edf0ee; cursor: pointer; }
.switch-row span, .radio-row span { display: grid; gap: 2px; }
.switch-row input { appearance: none; width: 46px; height: 26px; border-radius: 999px; background: #d5ddd8; position: relative; flex: 0 0 auto; transition: .2s ease; }
.switch-row input::after { content: ""; position: absolute; width: 20px; height: 20px; left: 3px; top: 3px; background: #fff; border-radius: 50%; box-shadow: 0 2px 6px #0002; transition: .2s ease; }
.switch-row input:checked { background: var(--accent); }
.switch-row input:checked::after { transform: translateX(20px); }
.radio-row { justify-content: flex-start; }
.radio-row input { accent-color: var(--accent); width: 18px; height: 18px; }
.form-actions { display: flex; justify-content: space-between; gap: 14px; padding-top: 6px; }
.back-link { text-decoration: none; color: var(--accent-dark); font-weight: 700; }

.option-editor-list { display: grid; gap: 18px; }
.option-editor { padding: 22px; display: grid; gap: 18px; }
.option-editor-head { display: flex; justify-content: space-between; align-items: center; }
.icon-button { width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--line); background: #fff; color: var(--muted); cursor: pointer; font-size: 1.3rem; line-height: 1; }
.icon-button:hover { color: var(--danger); border-color: #e6baba; }
.suggestions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: var(--muted); font-size: .9rem; }
.suggestions button { border: 1px solid var(--line); background: rgba(255,255,255,.75); border-radius: 999px; padding: 8px 12px; cursor: pointer; color: var(--accent-dark); font-weight: 650; }
.suggestions button:hover { background: var(--accent-soft); }
.add-option-button { justify-self: start; }

.preview-layout { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: clamp(28px, 5vw, 64px); align-items: start; }
.phone-preview { max-width: 520px; margin: 0 auto; padding: 16px; border: 8px solid #1d2923; background: #edf1ed; border-radius: 42px; box-shadow: var(--shadow); }
.phone-speaker { width: 70px; height: 6px; border-radius: 999px; background: #1d2923; margin: 0 auto 16px; opacity: .8; }
.preview-room { border-radius: 24px; box-shadow: none; }
.publish-panel { position: sticky; top: 28px; display: grid; gap: 16px; background: var(--ink); color: #fff; border-radius: 28px; padding: 30px; }
.publish-panel h2 { font-size: 2.4rem; }
.publish-panel p { color: #c8d1cc; margin: 0; }
.publish-panel .button-secondary { background: transparent; color: #fff; border-color: #52605a; }
.publish-panel .fine-print { font-size: .8rem; }
.success-symbol, .neutral-symbol { width: 58px; height: 58px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--accent-soft); color: var(--accent); font-size: 1.65rem; font-weight: 900; }
.success-symbol.large, .neutral-symbol { width: 78px; height: 78px; font-size: 2.1rem; }
.neutral-symbol { background: #e9ecea; color: var(--muted); }

.public-page { max-width: 820px; margin: 0 auto; }
.public-room-header { text-align: center; padding: 34px 0 28px; }
.public-room-header h1 { font-size: clamp(2.55rem, 7vw, 5rem); }
.room-kicker { color: var(--accent); font-size: .78rem; text-transform: uppercase; letter-spacing: .13em; font-weight: 820; margin: 0 0 12px; }
.public-description { color: var(--muted); font-size: 1.08rem; max-width: 650px; margin: 24px auto 0; }
.event-meta { display: flex; flex-wrap: wrap; gap: 8px 18px; color: var(--muted); font-size: .92rem; }
.prominent-meta { justify-content: center; margin-top: 22px; }
.event-meta span { display: inline-flex; align-items: center; }
.event-meta span + span::before { content: "•"; margin-right: 18px; color: #a5aea9; }
.room-progress-card { padding: 22px 24px; margin: 16px 0 24px; }
.room-progress-card > div:first-child { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 11px; }
.room-progress-card strong { font-size: 1.3rem; letter-spacing: -.035em; }
.room-progress-card span, .room-progress-card p { color: var(--muted); }
.room-progress-card p { margin: 10px 0 0; font-size: .9rem; }
.closed-notice { margin: 18px 0; padding: 17px 19px; border-radius: 16px; background: #edecea; display: grid; gap: 3px; }
.closed-notice span { color: var(--muted); }
.public-option-list { display: grid; gap: 12px; }
.public-option { background: rgba(255,255,255,.94); border: 1px solid var(--line); border-radius: 18px; padding: 19px; display: flex; gap: 16px; align-items: flex-start; box-shadow: var(--shadow-soft); }
.preview-room { padding: 22px; }
.preview-room h2 { margin: 0; font-size: 2rem; letter-spacing: -.05em; }
.preview-room > p { color: var(--muted); }
.preview-room .public-option { justify-content: space-between; align-items: center; }
.preview-room .public-option h3 { margin: 0; }
.preview-room .public-option p { margin: 3px 0; color: var(--accent-dark); font-weight: 700; }
.preview-room .public-option small { color: var(--muted); }
.mini-action { color: var(--accent); font-weight: 760; font-size: .85rem; }
.selectable-list .public-option { cursor: pointer; transition: .18s ease; }
.selectable-list .public-option:hover { border-color: #abc5b8; transform: translateY(-1px); }
.selectable-list .public-option:has(input:checked) { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(23,109,82,.11), var(--shadow-soft); }
.selectable-list .public-option.is-full { opacity: .58; cursor: default; }
.public-option input { position: absolute; opacity: 0; pointer-events: none; }
.selection-indicator { width: 24px; height: 24px; border: 2px solid #bdc9c2; border-radius: 7px; flex: 0 0 auto; margin-top: 1px; position: relative; }
input[type="radio"] + .selection-indicator { border-radius: 50%; }
.public-option input:checked + .selection-indicator { background: var(--accent); border-color: var(--accent); }
.public-option input:checked + .selection-indicator::after { content: "✓"; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; font-size: .8rem; font-weight: 900; }
.option-content { flex: 1; min-width: 0; }
.option-title-row { display: flex; justify-content: space-between; gap: 14px; align-items: baseline; }
.option-title-row strong { font-size: 1.08rem; }
.option-title-row em { font-style: normal; color: var(--accent-dark); font-size: .82rem; font-weight: 760; white-space: nowrap; }
.option-time { display: block; color: var(--ink); font-size: .88rem; margin-top: 3px; }
.option-content small { display: block; color: var(--muted); margin-top: 8px; }
.sticky-action { padding: 16px 0 0; display: flex; justify-content: flex-end; }
.privacy-note { color: var(--muted); text-align: center; font-size: .82rem; margin: 24px 0; }

.selected-summary { display: grid; gap: 9px; margin-bottom: 18px; }
.selected-summary > div { display: flex; justify-content: space-between; gap: 16px; padding: 14px 17px; background: var(--accent-soft); border-radius: 14px; }
.selected-summary span { color: var(--accent-dark); font-size: .9rem; }
.fine-print { color: var(--muted); font-size: .82rem; }
.centered { text-align: center; }

.confirmation-page { max-width: 780px; margin: 0 auto; text-align: center; padding-top: 64px; }
.confirmation-page h1 { font-size: clamp(2.5rem, 6vw, 4.8rem); margin-top: 20px; }
.confirmation-lead { color: var(--muted); font-size: 1.08rem; max-width: 660px; margin: 22px auto 30px; }
.confirmation-card { padding: 26px; text-align: left; margin: 28px 0; }
.confirmation-card h2 { font-size: 1.7rem; }
.booking-option-summary { display: grid; gap: 9px; margin-top: 18px; }
.booking-option-summary > div { display: flex; justify-content: space-between; gap: 18px; padding: 13px 15px; border-radius: 13px; background: var(--bg); }
.booking-option-summary .cancelled { opacity: .52; text-decoration: line-through; }
.confirmation-actions { justify-content: center; }
.danger-zone { margin-top: 26px; border-top: 1px solid var(--line); padding-top: 18px; text-align: left; }
.danger-zone summary { cursor: pointer; font-weight: 730; color: var(--danger); }
.danger-zone p { color: var(--muted); }
.compact-danger { max-width: 520px; margin-left: auto; margin-right: auto; }
.admin-created .share-card { text-align: left; margin: 14px 0; }
.share-card { padding: 24px; }
.share-card > span { display: block; color: var(--muted); font-size: .84rem; margin-bottom: 7px; }
.share-card > strong { display: block; word-break: break-all; font-size: 1.06rem; }
.share-card p { color: var(--muted); }
.primary-share { border-color: #b9d7c8; }

.admin-page { max-width: 1050px; margin: 0 auto; }
.admin-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 30px; margin-bottom: 34px; }
.admin-heading h1 { font-size: clamp(2.5rem, 5vw, 4.3rem); }
.admin-heading .event-meta { margin-top: 15px; }
.status-label { padding: 4px 9px; border-radius: 999px; font-size: .76rem; font-weight: 750; }
.status-label.open { color: var(--accent-dark); background: var(--accent-soft); }
.status-label.closed { color: #5f625f; background: #e6e7e5; }
.admin-dashboard-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: 14px; }
.metric-card { background: #fff; border-radius: 19px; padding: 22px; border: 1px solid var(--line); box-shadow: var(--shadow-soft); }
.metric-card > span { color: var(--muted); font-size: .82rem; }
.metric-card > strong { display: block; font-size: 2rem; letter-spacing: -.05em; margin-top: 7px; }
.metric-card p { color: var(--muted); margin: 0; }
.metric-main .progress { margin-top: 17px; }
.share-strip { margin: 18px 0 32px; background: var(--ink); color: #fff; border-radius: 20px; padding: 22px; display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.share-strip p { color: #bdc8c2; margin: 4px 0 0; }
.share-strip .button-secondary { background: transparent; color: #fff; border-color: #53625b; }
.admin-section { padding: 27px; margin: 18px 0; }
.admin-section .section-heading { margin-bottom: 20px; }
.admin-section .section-heading h2 { font-size: 2rem; }
.admin-option-list { display: grid; gap: 10px; }
.admin-option-list article { padding: 16px; background: var(--bg); border-radius: 14px; }
.admin-option-head { display: flex; justify-content: space-between; gap: 18px; }
.admin-option-head h3 { margin: 0; font-size: 1.05rem; }
.admin-option-head p { margin: 3px 0 0; color: var(--muted); font-size: .88rem; }
.admin-option-head > strong { white-space: nowrap; color: var(--accent-dark); }
.small-progress { height: 6px; margin-top: 12px; }
.empty-state { padding: 34px; text-align: center; border: 1px dashed #cad3ce; border-radius: 15px; }
.empty-state p { color: var(--muted); margin-bottom: 0; }
.booking-list { display: grid; gap: 8px; }
.booking-row { display: flex; justify-content: space-between; gap: 18px; padding: 15px 16px; background: var(--bg); border-radius: 14px; }
.booking-row > div:first-child { display: grid; }
.booking-row span, .booking-row small { color: var(--muted); }
.booking-row small { font-size: .78rem; }
.booking-row.inactive { opacity: .55; }
.booking-row-actions { display: flex; align-items: center; gap: 12px; }
.booking-row-actions em { font-style: normal; font-size: .78rem; color: var(--accent-dark); font-weight: 720; }
.text-button { border: 0; padding: 0; background: none; cursor: pointer; font-weight: 700; }
.danger-text { color: var(--danger); }
.settings-section { margin-top: 26px; }

.legal-page, .error-page { max-width: 800px; margin: 0 auto; }
.legal-page h1, .error-page h1 { font-size: clamp(2.5rem, 5vw, 4.5rem); }
.legal-card { margin-top: 30px; padding: 30px; }
.legal-card h2 { margin-top: 30px; letter-spacing: -.03em; }
.legal-card h2:first-child { margin-top: 0; }
.legal-card a { color: var(--accent-dark); }
.legal-warning { margin-top: 26px; padding: 15px; background: #fff4d8; border-radius: 13px; color: #67521d; }
.prose p { color: #4f5b55; }
.error-page { text-align: center; padding-top: 100px; }
.error-page .neutral-symbol { margin-bottom: 18px; }
.error-page p:not(.eyebrow) { color: var(--muted); font-size: 1.08rem; margin: 22px auto 30px; }

@media (max-width: 900px) {
    .hero { grid-template-columns: 1fr; min-height: auto; padding-top: 55px; }
    .demo-card-wrap { max-width: 650px; }
    .feature-grid { grid-template-columns: 1fr; }
    .choice-grid { grid-template-columns: 1fr; }
    .preview-layout { grid-template-columns: 1fr; }
    .publish-panel { position: static; max-width: 520px; margin: 0 auto; }
    .admin-dashboard-grid { grid-template-columns: 1fr 1fr; }
    .metric-main { grid-column: 1 / -1; }
}

@media (max-width: 700px) {
    .page-shell { width: min(calc(100% - 22px), var(--max)); }
    .site-header { min-height: 70px; }
    .header-action { font-size: .88rem; padding: 8px 10px; }
    .hero { padding: 42px 0 60px; gap: 48px; }
    .hero-copy h1 { font-size: clamp(2.75rem, 15vw, 4.25rem); }
    .hero-actions { align-items: stretch; flex-direction: column; }
    .hero-actions .button, .hero-actions .text-link { width: 100%; text-align: center; }
    .section { padding: 62px 0; }
    .closing-cta, .split-heading, .admin-heading, .share-strip { flex-direction: column; align-items: stretch; }
    .closing-cta { padding: 28px; }
    .closing-cta .button { width: 100%; }
    .site-footer { flex-direction: column; }
    .stepper { overflow-x: auto; grid-template-columns: repeat(4, minmax(105px, 1fr)); padding-bottom: 5px; }
    .stepper span { font-size: .74rem; }
    .form-page, .public-page, .admin-page, .confirmation-page { padding-top: 28px; }
    .form-intro { margin-top: 25px; }
    .field-group, .two-columns, .three-columns, .option-main-grid { grid-template-columns: 1fr; }
    .compact-number { max-width: 160px; }
    .form-actions { flex-direction: column-reverse; }
    .form-actions .button { width: 100%; }
    .phone-preview { border-width: 5px; padding: 9px; border-radius: 30px; }
    .public-option { padding: 16px; }
    .option-title-row { align-items: flex-start; }
    .option-title-row em { white-space: normal; text-align: right; }
    .sticky-action { position: sticky; bottom: 8px; padding: 12px 0; background: linear-gradient(transparent, var(--bg) 34%); }
    .sticky-action .button { width: 100%; }
    .event-meta span + span::before { display: none; }
    .event-meta { gap: 6px 13px; }
    .selected-summary > div { flex-direction: column; gap: 2px; }
    .confirmation-actions, .settings-actions { flex-direction: column; }
    .confirmation-actions .button, .settings-actions .button, .settings-actions form { width: 100%; }
    .admin-dashboard-grid { grid-template-columns: 1fr; }
    .metric-main { grid-column: auto; }
    .share-strip .share-actions { flex-direction: column; align-items: stretch; }
    .share-strip .button { width: 100%; }
    .booking-row { flex-direction: column; }
    .booking-row-actions { justify-content: space-between; }
    .admin-section { padding: 20px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}
.participant-names { color: var(--accent-dark) !important; font-weight: 700; }

/* Version 0.2: E-Mail-Sicherung und Wiederverwendung */
.flash-notice { background: #edf4f7; color: #294f5c; border-color: #cbdde3; }
.admin-tool-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 18px 0 32px; }
.admin-tool-card { background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 25px; box-shadow: var(--shadow-soft); }
.admin-tool-card h2 { font-size: 1.45rem; margin: 6px 0 10px; }
.admin-tool-card > p:not(.eyebrow) { color: var(--muted); }
.compact-stack { gap: 12px; }
.mail-hint { color: var(--muted); }
.inline-mail-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 12px; margin-top: 16px; }
.inline-mail-form .field { margin: 0; }
.mail-status-card { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 15px 18px; margin: -10px 0 24px; background: var(--accent-soft); border-radius: 14px; text-align: left; }
.mail-status-card > div { display: grid; gap: 3px; }
.mail-status-card span { color: var(--muted); font-size: .85rem; }
.mail-status-card .text-button { color: var(--accent-dark); }
.template-summary { display: flex; flex-wrap: wrap; gap: 8px; padding: 16px; border-radius: 14px; background: var(--accent-soft); }
.template-summary strong { width: 100%; }
.template-summary span { background: rgba(255,255,255,.75); padding: 6px 10px; border-radius: 999px; font-size: .82rem; color: var(--accent-dark); }

@media (max-width: 700px) {
    .admin-tool-grid { grid-template-columns: 1fr; }
    .inline-mail-form { grid-template-columns: 1fr; }
    .inline-mail-form .button { width: 100%; }
    .mail-status-card { align-items: stretch; flex-direction: column; }
}

/* Version 0.3.2: freigegebene Logoform */
.brand {
    gap: 14px;
    min-height: 64px;
}
.brand-logo-mark {
    width: 58px;
    height: 58px;
    flex: 0 0 58px;
    display: block;
    overflow: visible;
    filter: none;
    transition: transform .22s ease;
}
.brand:hover .brand-logo-mark { transform: scale(1.025); }
.brand-word {
    font-family: "Avenir Next", "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif;
    font-size: 2rem;
    font-weight: 650;
    line-height: 1;
    letter-spacing: -.06em;
    color: #111922;
}
.brand-joining-piece {
    transform-origin: 96px 36px;
    animation: brand-join .75s cubic-bezier(.2,.8,.2,1) .12s both;
}
@keyframes brand-join {
    from { opacity: 0; transform: translate(8px,-5px) scale(.88); }
    to { opacity: 1; transform: translate(0,0) scale(1); }
}

.compact-heading { margin-bottom: 4px; }
.compact-heading h2 { font-size: clamp(1.55rem, 3vw, 2.25rem); }
.check-row {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    padding: 15px 0;
    border-top: 1px solid #edf0ee;
    cursor: pointer;
}
.check-row input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--accent); }
.check-row span { display: grid; gap: 2px; }
.check-row small { color: var(--muted); }
.option-editor-meta { display: flex; align-items: center; gap: 10px; }
.option-editor-meta > span { font-size: .78rem; color: var(--accent-dark); background: var(--accent-soft); padding: 5px 9px; border-radius: 999px; }
.sticky-save-bar {
    position: sticky;
    bottom: 12px;
    z-index: 5;
    background: rgba(246,247,242,.9);
    backdrop-filter: blur(14px);
    border: 1px solid rgba(223,230,225,.9);
    border-radius: 999px;
    padding: 10px;
    box-shadow: 0 12px 34px rgba(27,48,39,.12);
}

.admin-heading-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.quick-action-bar {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin: 18px 0 32px;
}
.quick-action-bar a {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 12px;
    row-gap: 2px;
    align-items: center;
    padding: 17px 18px;
    text-decoration: none;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--line);
    border-radius: 17px;
    box-shadow: var(--shadow-soft);
    transition: .18s ease;
}
.quick-action-bar a:hover { transform: translateY(-2px); border-color: #b6cbbf; box-shadow: var(--shadow); }
.quick-action-bar a > span { grid-row: 1 / 3; width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; background: var(--accent-soft); color: var(--accent-dark); font-size: 1.15rem; }
.quick-action-bar strong { font-size: .95rem; }
.quick-action-bar small { color: var(--muted); font-size: .77rem; line-height: 1.35; }

.booking-section-heading { align-items: center; }
.booking-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.search-field input {
    width: min(300px, 72vw);
    border: 1px solid #d7e0da;
    border-radius: 999px;
    padding: 11px 15px;
    background: #fbfcfa;
    outline: none;
}
.search-field input:focus { border-color: #7eb29d; box-shadow: 0 0 0 4px rgba(23,109,82,.10); background: #fff; }
.compact-button { padding: 10px 15px; font-size: .88rem; }
.booking-contact-line { display: flex; flex-wrap: wrap; gap: 6px 13px; }
.compact-empty { margin-top: 10px; padding: 22px; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

.booking-edit-options { display: grid; gap: 10px; }
.selectable-option {
    position: relative;
    display: flex;
    gap: 14px;
    align-items: flex-start;
    padding: 17px;
    background: #fbfcfa;
    border: 1px solid var(--line);
    border-radius: 15px;
    cursor: pointer;
    transition: .18s ease;
}
.selectable-option:hover { border-color: #abc5b8; transform: translateY(-1px); }
.selectable-option:has(input:checked) { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(23,109,82,.10); background: #fff; }
.selectable-option.is-full { opacity: .55; cursor: default; transform: none; }
.selectable-option input { position: absolute; opacity: 0; pointer-events: none; }
.selectable-check { width: 24px; height: 24px; flex: 0 0 auto; border: 2px solid #bdc9c2; border-radius: 7px; position: relative; margin-top: 1px; }
.selectable-option input[type="radio"] + .selectable-check { border-radius: 50%; }
.selectable-option input:checked + .selectable-check { background: var(--accent); border-color: var(--accent); }
.selectable-option input:checked + .selectable-check::after { content: "✓"; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 900; font-size: .8rem; }
.selectable-content { display: grid; gap: 3px; }
.selectable-content strong { font-size: 1rem; }
.selectable-content small { color: var(--muted); }

@media (max-width: 900px) {
    .quick-action-bar { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
    .brand-logo-mark { width: 48px; height: 48px; flex-basis: 48px; }
    .brand-word { font-size: 1.58rem; }
    .admin-heading-actions, .booking-tools { width: 100%; }
    .admin-heading-actions .button, .booking-tools .button, .search-field, .search-field input { width: 100%; }
    .sticky-save-bar { border-radius: 20px; bottom: 7px; }
    .quick-action-bar { margin-top: 12px; }
}


/* Version 0.3.3: exakt freigegebene Logo-Grafik, nicht nachgezeichnet */
.brand {
    gap: 0;
    min-height: 64px;
}
.brand-logo-approved {
    display: block;
    width: clamp(230px, 24vw, 305px);
    height: auto;
    max-height: 76px;
    object-fit: contain;
    object-position: left center;
}
.brand:hover .brand-logo-approved {
    transform: none;
}
@media (max-width: 700px) {
    .brand-logo-approved {
        width: clamp(190px, 56vw, 235px);
        max-height: 66px;
    }
}

/* Version 0.4: Vorlagen und Wartelisten */
.admin-dashboard-grid { grid-template-columns: 1.4fr repeat(3, minmax(0, .75fr)); }
.quick-action-bar { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.metric-waitlist {
    background: linear-gradient(145deg, #fff9e8, #fffdf7);
    border-color: #eadfbf;
}
.metric-waitlist strong { color: #8b6716; }
.option-waitlist-toggle { max-width: 430px; }
.public-option.is-waitlist {
    border-color: #decf9b;
    background: linear-gradient(135deg, #fffdf7, #fff9e8);
}
.public-option.is-waitlist .option-title-row em { color: #8b6716; background: #f5e9bd; }
.waitlist-notice {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 16px 18px;
    border: 1px solid #e6d8a9;
    background: #fffaf0;
    border-radius: 16px;
    color: #695116;
    margin: -4px 0 20px;
}
.waitlist-summary { border-color: #e3d3a2 !important; background: #fffaf0 !important; }
.waitlist-summary em {
    margin-left: auto;
    font-style: normal;
    font-size: .78rem;
    font-weight: 800;
    color: #806214;
    background: #f3e7bd;
    padding: 5px 9px;
    border-radius: 999px;
}
.waitlist-symbol {
    width: 62px;
    height: 62px;
    display: inline-grid;
    place-items: center;
    border-radius: 50%;
    color: #806214;
    background: #f6ebc5;
    font-size: 2rem;
    font-weight: 800;
}
.booking-option-summary > div.waitlisted {
    border-color: #e5d6a6;
    background: #fffaf0;
}
.booking-option-summary > div.waitlisted span { color: #806214; }
.option-count-stack { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; }
.option-count-stack small { color: #806214; font-size: .78rem; }
.waitlist-admin-section { border-color: #eadfbd; background: linear-gradient(180deg, #fffefb, #fffaf0); }
.waitlist-admin-list { display: grid; gap: 10px; }
.waitlist-admin-list article {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 15px 17px;
    background: #fff;
    border: 1px solid #e6dfc9;
    border-radius: 15px;
}
.waitlist-admin-list article > div { display: flex; flex-direction: column; gap: 3px; }
.waitlist-admin-list article span, .waitlist-admin-list article small { color: var(--muted); }
.booking-waitlist-text { color: #806214 !important; }
.template-summary-card {
    padding: 20px;
    margin-bottom: 22px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: #fff;
}
.template-option-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.template-option-chips span {
    padding: 8px 11px;
    border-radius: 999px;
    background: var(--surface-soft);
    color: var(--muted-strong);
    font-size: .86rem;
}
.template-home-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.template-home-grid a {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: #fff;
    text-decoration: none;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.template-home-grid a:hover { transform: translateY(-2px); border-color: var(--accent); box-shadow: 0 12px 30px rgba(22,77,58,.08); }
.template-home-grid a div { display: flex; flex-direction: column; gap: 3px; flex: 1; }
.template-home-grid a small { color: var(--muted); }
.template-home-grid a em { font-style: normal; font-size: 1.2rem; }
.template-home-icon {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: var(--accent-soft);
    color: var(--accent);
    font-size: 1.35rem;
}
@media (max-width: 980px) {
    .admin-dashboard-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .quick-action-bar { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 700px) {
    .admin-dashboard-grid, .quick-action-bar, .template-home-grid { grid-template-columns: 1fr; }
    .waitlist-admin-list article { align-items: stretch; flex-direction: column; }
    .waitlist-admin-list form .button { width: 100%; }
}
.recent-room-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.recent-room-grid > a {
    display: flex;
    flex-direction: column;
    gap: 9px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: #fff;
    text-decoration: none;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.recent-room-grid > a:hover { transform: translateY(-2px); border-color: var(--accent); box-shadow: 0 12px 30px rgba(22,77,58,.08); }
.recent-room-grid > a > span { color: var(--muted); }
.recent-room-grid > a > em { font-style: normal; color: var(--accent); font-weight: 750; }
.recent-room-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.recent-room-head small { color: var(--muted); }
@media (max-width: 700px) { .recent-room-grid { grid-template-columns: 1fr; } }

/* Version 0.5: Terminreihen und zentrale Serienübersicht */
.quick-action-bar { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
.series-term-list { display: grid; gap: 12px; margin-bottom: 14px; }
.series-term-row {
    display: grid;
    grid-template-columns: minmax(155px, .8fr) minmax(220px, 1.6fr) auto;
    align-items: end;
    gap: 12px;
    padding: 15px;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: #fbfcfa;
}
.series-term-row .field { margin: 0; }
.series-title-field { min-width: 0; }
.series-remove { margin-bottom: 2px; }
.series-info-card { margin-top: 0; }
.series-page { display: grid; gap: 24px; }
.series-heading { margin-bottom: 0; }
.series-metrics {
    display: grid;
    grid-template-columns: 1.4fr repeat(2, minmax(0, .8fr));
    gap: 14px;
}
.series-share-section { background: linear-gradient(145deg, #f7fbf8, #ffffff); }
.share-message-box {
    margin: 14px 0;
    padding: 16px 18px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
}
.share-message-box pre {
    margin: 0;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    font: inherit;
    line-height: 1.55;
    color: var(--muted-strong);
}
.series-room-list { display: grid; gap: 12px; }
.series-room-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    padding: 17px;
    border: 1px solid var(--line);
    border-radius: 19px;
    background: #fff;
    box-shadow: var(--shadow-soft);
}
.series-date-tile {
    width: 66px;
    min-height: 66px;
    display: grid;
    place-content: center;
    text-align: center;
    border-radius: 17px;
    background: var(--accent-soft);
    color: var(--accent-dark);
}
.series-date-tile strong { font-size: 1.55rem; line-height: 1; }
.series-date-tile span { margin-top: 4px; font-size: .75rem; font-weight: 750; }
.series-room-main { min-width: 0; display: grid; gap: 10px; }
.series-room-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; }
.series-room-head h3 { margin: 0 0 4px; }
.series-room-head p { margin: 0; color: var(--muted); font-size: .88rem; }
.series-room-status { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 14px; font-size: .86rem; }
.series-room-status span { color: var(--muted); }
.series-room-actions { display: grid; gap: 8px; min-width: 168px; }
.series-room-actions .button { width: 100%; }
.series-room-actions .text-button { text-align: center; }
.series-access-card { display: flex; align-items: center; justify-content: space-between; gap: 22px; }
.series-access-card p { margin-bottom: 0; }
.series-home-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.series-home-grid a {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: #fff;
    text-decoration: none;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.series-home-grid a:hover { transform: translateY(-2px); border-color: var(--accent); box-shadow: 0 12px 30px rgba(22,77,58,.08); }
.series-home-grid a div { display: flex; flex-direction: column; gap: 3px; flex: 1; min-width: 0; }
.series-home-grid a small { color: var(--muted); }
.series-home-grid a em { font-style: normal; font-size: 1.2rem; }
.series-home-icon {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: var(--accent-soft);
    color: var(--accent);
    font-size: 1.4rem;
    font-weight: 850;
}
@media (max-width: 900px) {
    .series-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .series-room-card { grid-template-columns: auto minmax(0, 1fr); }
    .series-room-actions { grid-column: 1 / -1; grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 700px) {
    .series-term-row { grid-template-columns: 1fr auto; }
    .series-term-row .series-title-field { grid-column: 1 / -1; grid-row: 2; }
    .series-term-row .series-remove { grid-column: 2; grid-row: 1; }
    .series-metrics, .series-home-grid { grid-template-columns: 1fr; }
    .series-room-card { grid-template-columns: 1fr; }
    .series-date-tile { width: 100%; min-height: 54px; grid-auto-flow: column; gap: 7px; align-items: center; }
    .series-date-tile span { margin-top: 0; }
    .series-room-head, .series-room-status, .series-access-card { align-items: stretch; flex-direction: column; }
    .series-room-actions { grid-template-columns: 1fr; min-width: 0; }
    .series-access-card .button { width: 100%; }
}

/* Version 0.6: zentrale Organisationsübersicht */
.header-navigation {
    display: flex;
    align-items: center;
    gap: 8px;
}
.header-overview-link {
    color: var(--muted-strong);
    font-weight: 680;
    text-decoration: none;
    padding: 10px 13px;
    border-radius: 999px;
}
.header-overview-link:hover { color: var(--accent-dark); background: rgba(255,255,255,.66); }

.dashboard-page { display: grid; gap: 26px; }
.dashboard-hero {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    padding: 40px 0 8px;
}
.dashboard-hero > div:first-child { max-width: 790px; }
.dashboard-hero h1 {
    margin: 4px 0 12px;
    max-width: 820px;
    font-size: clamp(2.2rem, 5.1vw, 4.45rem);
    line-height: 1.01;
    letter-spacing: -.055em;
}
.dashboard-hero p:not(.eyebrow) { margin: 0; max-width: 720px; color: var(--muted); font-size: 1.08rem; }
.dashboard-hero-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; }

.dashboard-loading,
.dashboard-empty {
    min-height: 330px;
    display: grid;
    place-content: center;
    justify-items: center;
    text-align: center;
    padding: 40px;
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    background: rgba(255,255,255,.76);
    box-shadow: var(--shadow-soft);
}
.dashboard-loading { gap: 14px; color: var(--muted-strong); }
.dashboard-spinner {
    width: 34px;
    height: 34px;
    border: 3px solid var(--accent-soft);
    border-top-color: var(--accent);
    border-radius: 999px;
    animation: dashboard-spin .8s linear infinite;
}
@keyframes dashboard-spin { to { transform: rotate(360deg); } }
.dashboard-empty-mark {
    width: 62px;
    height: 62px;
    display: grid;
    place-items: center;
    margin-bottom: 12px;
    border-radius: 20px;
    background: var(--accent-soft);
    color: var(--accent);
    font-size: 2rem;
    font-weight: 800;
}
.dashboard-empty h2 { margin: 0 0 8px; font-size: clamp(1.5rem, 3vw, 2.2rem); }
.dashboard-empty p { margin: 0; max-width: 600px; color: var(--muted); }
.dashboard-empty-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 22px; }

.dashboard-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 13px;
}
.dashboard-metric {
    min-width: 0;
    text-align: left;
    padding: 19px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: var(--surface);
    color: var(--ink);
    cursor: pointer;
    box-shadow: var(--shadow-soft);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.dashboard-metric:hover { transform: translateY(-2px); border-color: rgba(23,109,82,.45); box-shadow: 0 15px 38px rgba(27,48,39,.10); }
.dashboard-metric span, .dashboard-metric small { display: block; }
.dashboard-metric span { color: var(--muted-strong); font-weight: 710; }
.dashboard-metric strong { display: block; margin: 6px 0 2px; font-size: 2.15rem; line-height: 1; letter-spacing: -.04em; }
.dashboard-metric small { color: var(--muted); }
.dashboard-metric.metric-attention { background: linear-gradient(145deg, #fff, #f0f8f3); }
.dashboard-metric.metric-waiting { background: linear-gradient(145deg, #fff, #f8f5ea); }

.dashboard-toolbar {
    position: sticky;
    top: 8px;
    z-index: 8;
    display: grid;
    grid-template-columns: minmax(240px, 1fr) auto;
    align-items: center;
    gap: 14px;
    padding: 12px;
    border: 1px solid rgba(223,230,225,.9);
    border-radius: 20px;
    background: rgba(246,247,242,.9);
    backdrop-filter: blur(16px);
    box-shadow: 0 8px 30px rgba(27,48,39,.06);
}
.dashboard-search input {
    width: 100%;
    min-height: 44px;
    padding: 10px 14px 10px 42px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background-color: #fff;
    background-image: radial-gradient(circle, transparent 48%, var(--muted) 50%, var(--muted) 58%, transparent 60%), linear-gradient(45deg, transparent 47%, var(--muted) 49%, var(--muted) 55%, transparent 57%);
    background-size: 16px 16px, 8px 8px;
    background-position: 14px 13px, 27px 27px;
    background-repeat: no-repeat;
    color: var(--ink);
    outline: none;
}
.dashboard-search input:focus { border-color: var(--accent); box-shadow: 0 0 0 4px rgba(23,109,82,.1); }
.dashboard-filter-row { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.dashboard-filter {
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--muted-strong);
    padding: 9px 12px;
    font-size: .88rem;
    font-weight: 690;
    cursor: pointer;
}
.dashboard-filter:hover { background: #fff; }
.dashboard-filter.is-active { background: var(--ink); color: #fff; }

.dashboard-section {
    scroll-margin-top: 100px;
    padding: 24px;
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    background: rgba(255,255,255,.74);
    box-shadow: var(--shadow-soft);
}
.dashboard-section .section-heading { margin-bottom: 16px; }
.dashboard-section-count { color: var(--muted); font-size: .88rem; font-weight: 680; }
.dashboard-room-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.dashboard-room-card {
    position: relative;
    display: grid;
    gap: 13px;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 21px;
    background: #fff;
    overflow: hidden;
}
.dashboard-room-card::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--line);
}
.dashboard-room-card.is-attention::before { background: linear-gradient(#8bd53f, #31bb91); }
.dashboard-room-card.is-waitlist::before { background: #c59d3a; }
.dashboard-room-card.is-complete::before { background: var(--accent); }
.dashboard-room-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.dashboard-room-card h3 { margin: 3px 0 0; font-size: 1.18rem; line-height: 1.25; }
.dashboard-room-date { color: var(--muted); font-size: .82rem; font-weight: 670; }
.dashboard-status {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    min-height: 27px;
    padding: 5px 9px;
    border-radius: 999px;
    background: var(--surface-soft);
    color: var(--muted-strong);
    font-size: .75rem;
    font-weight: 760;
}
.dashboard-status.is-attention { background: #e8f5e7; color: #356629; }
.dashboard-status.is-complete { background: var(--accent-soft); color: var(--accent-dark); }
.dashboard-status.is-waitlist { background: #f5edd4; color: #765b19; }
.dashboard-status.is-closed { background: #eef0ef; color: #65706b; }
.dashboard-room-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; color: var(--muted); font-size: .84rem; }
.dashboard-card-progress { display: grid; gap: 8px; }
.dashboard-card-progress > div:first-child { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 5px 14px; font-size: .86rem; }
.dashboard-card-progress > div:first-child span { color: var(--muted); }
.dashboard-waitlist-hint {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 11px;
    border-radius: 12px;
    background: #faf5e6;
    color: #6e571d;
    font-size: .82rem;
}
.dashboard-card-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding-top: 2px; }
.dashboard-forget {
    margin-left: auto;
    padding: 6px;
    border: 0;
    background: transparent;
    color: var(--muted);
    font-size: .76rem;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.dashboard-forget:hover { color: var(--danger); }
.dashboard-no-results { padding: 36px 12px 12px; text-align: center; color: var(--muted); }
.dashboard-no-results strong { color: var(--ink); }
.dashboard-no-results p { margin: 5px 0 0; }

.dashboard-series-grid,
.dashboard-template-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.dashboard-series-card,
.dashboard-template-card {
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    align-items: center;
    gap: 14px;
    padding: 17px;
    border: 1px solid var(--line);
    border-radius: 19px;
    background: #fff;
}
.dashboard-type-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: var(--accent-soft);
    color: var(--accent);
    font-size: 1.4rem;
    font-weight: 850;
}
.dashboard-series-body,
.dashboard-template-body { min-width: 0; }
.dashboard-series-body small,
.dashboard-template-body small { color: var(--muted); }
.dashboard-series-body h3,
.dashboard-template-body h3 { margin: 2px 0 3px; font-size: 1.06rem; }
.dashboard-series-body p,
.dashboard-template-body p { margin: 0; color: var(--muted); font-size: .84rem; }
.dashboard-inline-alert { display: inline-block; margin-top: 7px; padding: 3px 8px; border-radius: 999px; background: #f5edd4; color: #765b19; font-size: .75rem; font-weight: 720; }
.dashboard-series-actions,
.dashboard-template-actions { display: grid; justify-items: end; gap: 5px; }

.dashboard-access-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    padding: 26px;
    border-radius: var(--radius-lg);
    background: linear-gradient(135deg, #153e32, #176d52);
    color: #fff;
}
.dashboard-access-section .eyebrow { color: #a9e2cc; }
.dashboard-access-section h2 { margin: 3px 0 8px; max-width: 690px; }
.dashboard-access-section p:not(.eyebrow) { margin: 0; max-width: 760px; color: rgba(255,255,255,.75); }
.dashboard-access-actions { flex: 0 0 auto; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 9px; }
.dashboard-access-section .button-secondary { border-color: rgba(255,255,255,.28); background: rgba(255,255,255,.1); color: #fff; }
.dashboard-access-section .button-secondary:hover { background: rgba(255,255,255,.18); }
.dashboard-toast {
    position: fixed;
    z-index: 40;
    left: 50%;
    bottom: max(22px, env(safe-area-inset-bottom));
    transform: translateX(-50%);
    width: max-content;
    max-width: calc(100vw - 32px);
    padding: 12px 16px;
    border-radius: 999px;
    background: var(--ink);
    color: #fff;
    box-shadow: var(--shadow);
    font-weight: 680;
    text-align: center;
}

@media (max-width: 980px) {
    .dashboard-hero { align-items: flex-start; flex-direction: column; }
    .dashboard-hero-actions { justify-content: flex-start; }
    .dashboard-metrics { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .dashboard-toolbar { position: static; grid-template-columns: 1fr; }
    .dashboard-filter-row { justify-content: flex-start; }
    .dashboard-room-grid { grid-template-columns: 1fr; }
    .dashboard-series-grid, .dashboard-template-grid { grid-template-columns: 1fr; }
    .dashboard-access-section { align-items: flex-start; flex-direction: column; }
    .dashboard-access-actions { justify-content: flex-start; }
}
@media (max-width: 700px) {
    .site-header { align-items: center; }
    .header-navigation { gap: 2px; }
    .header-overview-link { padding: 8px 9px; font-size: .84rem; }
    .header-action { display: none; }
    .dashboard-hero { padding-top: 24px; }
    .dashboard-hero h1 { font-size: clamp(2.1rem, 12vw, 3.15rem); }
    .dashboard-hero-actions, .dashboard-hero-actions .button { width: 100%; }
    .dashboard-metrics { grid-template-columns: 1fr 1fr; gap: 9px; }
    .dashboard-metric { padding: 15px; }
    .dashboard-metric strong { font-size: 1.8rem; }
    .dashboard-metric small { font-size: .74rem; line-height: 1.3; }
    .dashboard-toolbar { padding: 9px; border-radius: 17px; }
    .dashboard-filter-row { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 3px; scrollbar-width: none; }
    .dashboard-filter-row::-webkit-scrollbar { display: none; }
    .dashboard-filter { flex: 0 0 auto; }
    .dashboard-section { padding: 16px; border-radius: 23px; }
    .dashboard-room-card { padding: 16px; }
    .dashboard-room-card-head { align-items: flex-start; }
    .dashboard-card-actions .button { flex: 1 1 calc(50% - 5px); }
    .dashboard-card-actions .text-button { width: 100%; text-align: left; }
    .dashboard-forget { width: 100%; margin-left: 0; text-align: left; }
    .dashboard-series-card, .dashboard-template-card { grid-template-columns: auto minmax(0,1fr); }
    .dashboard-series-actions, .dashboard-template-actions { grid-column: 1 / -1; width: 100%; grid-template-columns: 1fr auto; align-items: center; }
    .dashboard-series-actions .button, .dashboard-template-actions .button { width: 100%; }
    .dashboard-access-section { padding: 21px; }
    .dashboard-access-actions, .dashboard-access-actions .button { width: 100%; }
    .dashboard-toast { border-radius: 16px; }
}


/* Version 0.6.2: robuste, nicht blockierende Organisationsübersicht */
.dashboard-sync-notice {
    margin: 0 0 18px;
    padding: 14px 18px;
    border-radius: 16px;
    border: 1px solid rgba(22, 112, 84, .18);
    background: rgba(229, 246, 239, .72);
    color: var(--muted-strong);
    font-weight: 650;
}
.dashboard-sync-notice.is-warning {
    border-color: rgba(168, 119, 20, .24);
    background: rgba(255, 247, 221, .88);
    color: #6f5319;
}
.dashboard-room-card.is-local::before { background: #b7c8c1; }
.dashboard-status.is-local { background: #eef3f0; color: #53635d; }
.dashboard-local-status {
    padding: 13px 14px;
    border-radius: 14px;
    background: #f4f7f5;
    color: var(--muted);
    line-height: 1.45;
}


/* Version 0.6.4: freigegebene moderne, abstrakte Produktmarke */
.brand {
    gap: 10px;
    min-height: 64px;
}
.brand-logo-approved {
    display: none !important;
}
.brand-logo-mark {
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    display: block;
    overflow: visible;
    filter: none;
    transition: transform .18s ease;
}
.brand-word {
    font-family: "Avenir Next", "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif;
    font-size: 1.82rem;
    font-weight: 760;
    line-height: 1;
    letter-spacing: -.055em;
    color: #0C3438;
}
.brand:hover .brand-logo-mark {
    transform: translateY(-1px);
}
@media (max-width: 700px) {
    .brand {
        gap: 8px;
    }
    .brand-logo-mark {
        width: 42px;
        height: 42px;
        flex-basis: 42px;
    }
    .brand-word {
        font-size: 1.5rem;
    }
}


/* Version 0.6.5: gemeinsamer Markenaufbau der Produktfamilie */
.brand {
    align-items: center;
    gap: 10px;
    white-space: nowrap;
    flex: 0 0 auto;
}
.brand-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 2px;
    line-height: 1;
}
.brand-word {
    display: block;
    line-height: .92;
}
.brand-byline {
    display: block;
    margin-left: 2px;
    color: var(--muted-strong);
    font-family: "Snell Roundhand", "Segoe Script", "Bradley Hand", cursive;
    font-size: .77rem;
    font-weight: 400;
    line-height: 1.05;
    letter-spacing: .01em;
}
@media (max-width: 700px) {
    .site-header {
        gap: 10px;
    }
    .brand {
        gap: 7px;
        min-width: 0;
    }
    .brand-logo-mark {
        width: 39px;
        height: 39px;
        flex-basis: 39px;
    }
    .brand-word {
        font-size: 1.38rem;
    }
    .brand-byline {
        margin-left: 1px;
        font-size: .65rem;
    }
    .header-navigation {
        flex: 0 0 auto;
    }
}
@media (max-width: 380px) {
    .brand-logo-mark {
        width: 36px;
        height: 36px;
        flex-basis: 36px;
    }
    .brand-word {
        font-size: 1.25rem;
    }
    .brand-byline {
        font-size: .6rem;
    }
    .header-overview-link {
        padding-inline: 6px;
        font-size: .78rem;
    }
}


/* Version 0.7.0: Schnellstart, Sammelwerkzeuge und Kommunikationszentrale */
.quick-start-section {
    margin-top: 34px;
    padding-top: 30px;
    border-top: 1px solid var(--line);
}
.quick-start-section .section-heading { max-width: 820px; }
.quick-start-section .section-heading > p:last-child { color: var(--muted); }
.quick-start-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: 20px;
}
.quick-start-card {
    min-width: 0;
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: rgba(255,255,255,.9);
    color: var(--ink);
    text-align: left;
    cursor: pointer;
    display: grid;
    grid-template-columns: auto minmax(0,1fr);
    gap: 13px;
    align-items: start;
    box-shadow: var(--shadow-soft);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.quick-start-card:hover { transform: translateY(-2px); border-color: #aec8ba; box-shadow: var(--shadow); }
.quick-start-icon {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-size: 1.15rem;
}
.quick-start-card strong { display: block; font-size: 1.05rem; margin: 2px 0 6px; }
.quick-start-card small { display: block; color: var(--muted); line-height: 1.45; }
.quick-start-card b { grid-column: 2; margin-top: 4px; color: var(--accent-dark); font-size: .84rem; }
.option-editor-actions { display: inline-flex; align-items: center; gap: 10px; }
.option-duplicate { color: var(--accent-dark); font-size: .82rem; }
.option-comfort-panel {
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: 24px;
    background: rgba(246,249,247,.88);
}
.option-comfort-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 17px; }
.option-comfort-heading h2 { margin: 2px 0 0; font-size: 1.45rem; }
.option-comfort-heading > small { color: var(--muted); max-width: 360px; text-align: right; }
.option-comfort-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); gap: 12px; }
.bulk-option-box, .shared-option-settings {
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: #fff;
}
.bulk-option-box summary { cursor: pointer; font-weight: 740; }
.bulk-option-box p { margin: 10px 0; color: var(--muted); font-size: .84rem; line-height: 1.45; }
.bulk-option-box textarea { width: 100%; margin-bottom: 10px; }
.shared-option-settings { display: grid; align-content: start; gap: 11px; }
.shared-option-settings > strong { font-size: .95rem; }
.admin-section-nav {
    position: sticky;
    top: 8px;
    z-index: 12;
    display: flex;
    gap: 6px;
    overflow-x: auto;
    margin: 8px 0 18px;
    padding: 7px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: rgba(247,248,244,.94);
    backdrop-filter: blur(12px);
    box-shadow: 0 8px 24px rgba(11,43,34,.06);
    scrollbar-width: none;
}
.admin-section-nav::-webkit-scrollbar { display: none; }
.admin-section-nav a {
    flex: 0 0 auto;
    padding: 9px 13px;
    border-radius: 12px;
    color: var(--muted-strong);
    text-decoration: none;
    font-size: .84rem;
    font-weight: 700;
}
.admin-section-nav a:hover { background: #fff; color: var(--ink); }
.next-action-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 18px;
    padding: 24px 26px;
    border-radius: 24px;
    background: var(--accent-soft);
    border: 1px solid rgba(22,112,84,.14);
}
.next-action-card h2 { margin: 2px 0 6px; font-size: clamp(1.45rem,3vw,2.15rem); }
.next-action-card p:last-child { margin: 0; color: var(--muted-strong); }
.communication-section { scroll-margin-top: 88px; }
.communication-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.communication-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: #fff;
}
.communication-card.is-recommended { border-color: rgba(22,112,84,.28); background: linear-gradient(180deg,#fff,#f4fbf7); }
.communication-card.is-complete { border-color: rgba(57,211,158,.28); background: #f4fbf8; }
.communication-badge {
    align-self: flex-start;
    margin-bottom: 12px;
    padding: 5px 9px;
    border-radius: 999px;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-size: .72rem;
    font-weight: 760;
}
.communication-card h3 { margin: 0 0 9px; font-size: 1.13rem; }
.communication-card p { flex: 1; margin: 0 0 18px; color: var(--muted); line-height: 1.55; overflow-wrap: anywhere; }
.communication-actions { display: flex; flex-wrap: wrap; gap: 8px; }
#auswahl, #teilnehmende, #einstellungen, #raumsteuerung, #warteliste { scroll-margin-top: 88px; }

@media (max-width: 900px) {
    .quick-start-grid { grid-template-columns: 1fr; }
    .communication-grid { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
    .option-comfort-heading, .next-action-card { align-items: stretch; flex-direction: column; }
    .option-comfort-heading > small { text-align: left; }
    .next-action-card .button { width: 100%; }
    .admin-section-nav { margin-inline: -4px; }
    .communication-actions, .communication-actions .button { width: 100%; }
    .option-editor-head { align-items: flex-start; }
    .option-editor-actions { gap: 6px; }
    .option-duplicate { font-size: .76rem; }
}


/* Version 0.8.0: Unterstützung, Feedback und Systemcheck */
.utility-hero { max-width: 820px; padding: 58px 0 28px; }
.compact-utility-hero { padding-bottom: 20px; }
.utility-hero h1 { margin: 4px 0 14px; font-size: clamp(2.5rem, 7vw, 5.2rem); letter-spacing: -.055em; line-height: .98; }
.utility-hero > p:last-child { max-width: 720px; color: var(--muted); font-size: 1.08rem; line-height: 1.65; }
.utility-card { padding: 28px; border: 1px solid var(--line); border-radius: 26px; background: #fff; box-shadow: var(--shadow-soft); }
.feedback-card { max-width: 900px; }
.feedback-form { display: grid; gap: 20px; }
.honeypot-field { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.feedback-category-fieldset { margin: 0; padding: 0; border: 0; }
.feedback-category-fieldset legend { margin-bottom: 11px; font-weight: 760; }
.feedback-category-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 9px; }
.feedback-category-option { cursor: pointer; }
.feedback-category-option input { position: absolute; opacity: 0; pointer-events: none; }
.feedback-category-option span { display: flex; min-height: 50px; align-items: center; justify-content: center; padding: 10px 12px; border: 1px solid var(--line); border-radius: 15px; background: var(--surface-soft); color: var(--muted-strong); text-align: center; font-size: .88rem; font-weight: 720; transition: .16s ease; }
.feedback-category-option input:checked + span { border-color: var(--accent); background: var(--accent-soft); color: var(--accent-dark); box-shadow: inset 0 0 0 1px var(--accent); }
.field-label { display: block; margin-bottom: 7px; font-weight: 740; }
.field-label span { color: var(--muted); font-size: .8rem; font-weight: 500; }
.field-help, .privacy-note { margin: -10px 0 0; color: var(--muted); font-size: .8rem; line-height: 1.5; }
.form-grid.two-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.form-actions, .utility-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.utility-result-card { max-width: 720px; margin: 70px auto; padding: 48px; border: 1px solid var(--line); border-radius: 30px; background: #fff; text-align: center; box-shadow: var(--shadow); }
.utility-result-icon { display: inline-flex; width: 64px; height: 64px; align-items: center; justify-content: center; margin-bottom: 18px; border-radius: 50%; background: var(--accent-soft); color: var(--accent-dark); font-size: 2rem; font-weight: 800; }
.utility-result-card h1 { margin: 4px 0 12px; font-size: clamp(2rem,5vw,3.5rem); letter-spacing: -.045em; }
.utility-result-card > p:not(.eyebrow) { color: var(--muted); }
.utility-result-card .utility-actions { justify-content: center; margin-top: 26px; }
.support-layout { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(280px,.75fr); gap: 18px; align-items: start; }
.support-main-card { padding: 38px; }
.support-icon { display: inline-flex; width: 54px; height: 54px; align-items: center; justify-content: center; margin-bottom: 14px; border-radius: 18px; background: var(--accent-soft); color: var(--accent-dark); font-size: 1.8rem; }
.support-main-card h2, .support-side-card h2 { margin: 0 0 12px; font-size: clamp(1.55rem,3vw,2.25rem); }
.support-main-card > p, .support-side-card > p:not(.eyebrow) { color: var(--muted); line-height: 1.65; }
.setup-notice { margin-top: 24px; padding: 18px; border: 1px solid #ddcda3; border-radius: 18px; background: #fffaf0; }
.setup-notice p { margin: 7px 0 0; color: #685d43; line-height: 1.5; }
.setup-notice code { overflow-wrap: anywhere; }
.system-summary { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin: 8px 0 18px; padding: 24px 28px; border: 1px solid var(--line); border-radius: 25px; background: #fff; }
.system-summary > div { display: flex; align-items: center; gap: 16px; }
.system-summary h2 { margin: 1px 0 4px; }
.system-summary p:last-child { margin: 0; color: var(--muted); }
.system-summary-dot { width: 18px; height: 18px; flex: 0 0 18px; border-radius: 50%; background: #d33; box-shadow: 0 0 0 8px #d331; }
.system-summary-ok .system-summary-dot { background: var(--accent); box-shadow: 0 0 0 8px rgba(57,211,158,.15); }
.system-summary-warning .system-summary-dot { background: #d49a25; box-shadow: 0 0 0 8px rgba(212,154,37,.15); }
.system-check-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.system-check-card { display: flex; align-items: flex-start; gap: 13px; padding: 19px; border: 1px solid var(--line); border-radius: 19px; background: #fff; }
.system-check-card h2 { margin: 0 0 4px; font-size: 1.02rem; }
.system-check-card p { margin: 0; color: var(--muted); font-size: .88rem; line-height: 1.45; }
.system-check-icon { display: inline-flex; width: 30px; height: 30px; flex: 0 0 30px; align-items: center; justify-content: center; border-radius: 10px; background: #fcebea; color: #9d2923; font-weight: 800; }
.system-check-ok .system-check-icon { background: var(--accent-soft); color: var(--accent-dark); }
.system-check-warning .system-check-icon { background: #fff4d9; color: #8b651a; }
.system-meta { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin-top: 18px; }
.system-meta > div { display: flex; flex-direction: column; gap: 5px; }
.system-meta span { color: var(--muted); font-size: .78rem; }
.site-footer nav { flex-wrap: wrap; justify-content: flex-end; }
@media (max-width: 800px) {
    .feedback-category-grid { grid-template-columns: 1fr 1fr; }
    .support-layout, .system-check-grid { grid-template-columns: 1fr; }
    .system-meta { grid-template-columns: 1fr; }
}
@media (max-width: 650px) {
    .utility-hero { padding-top: 38px; }
    .utility-card, .support-main-card { padding: 22px; }
    .form-grid.two-columns { grid-template-columns: 1fr; }
    .system-summary { align-items: stretch; flex-direction: column; }
    .system-summary .button { width: 100%; }
    .feedback-category-grid { grid-template-columns: 1fr; }
    .form-actions, .form-actions .button, .utility-actions, .utility-actions .button { width: 100%; }
    .utility-result-card { margin: 35px auto; padding: 30px 22px; }
    .site-footer { align-items: flex-start; flex-direction: column; }
    .site-footer nav { justify-content: flex-start; }
}


/* Version 0.8.2: kompakte freiwillige Unterstützung nach Familienschema */
.contribution-card {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(430px, .95fr);
    gap: clamp(28px, 5vw, 72px);
    align-items: center;
    margin-top: 28px;
    padding: clamp(28px, 4vw, 48px);
    border: 1px solid var(--line);
    border-radius: 30px;
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}
.contribution-copy h1 {
    max-width: 650px;
    margin: 6px 0 8px;
    font-size: clamp(1.65rem, 3.2vw, 2.45rem);
    line-height: 1.12;
    letter-spacing: -.045em;
}
.contribution-copy > p:not(.eyebrow) {
    max-width: 660px;
    margin: 0;
    color: var(--muted);
    font-size: clamp(1rem, 1.5vw, 1.15rem);
    line-height: 1.55;
}
.contribution-copy .contribution-note {
    margin-top: 24px !important;
    color: var(--text) !important;
    font-size: .92rem !important;
}
.contribution-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(84px, 1fr)) minmax(155px, 1.25fr);
    gap: 12px;
    align-items: stretch;
}
.contribution-button {
    display: inline-flex;
    min-height: 58px;
    align-items: center;
    justify-content: center;
    padding: 12px 18px;
    border: 1px solid var(--line-strong, var(--line));
    border-radius: 17px;
    background: var(--surface);
    color: var(--text);
    font-weight: 760;
    text-align: center;
    text-decoration: none;
    transition: transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease;
}
.contribution-button:hover {
    transform: translateY(-1px);
    border-color: var(--accent);
}
.contribution-button-featured {
    border-color: var(--accent-dark);
    background: var(--accent-dark);
    color: #fff;
    box-shadow: 0 13px 28px rgba(12, 52, 56, .12);
}
.contribution-button-featured:hover {
    border-color: var(--accent-dark);
    background: var(--accent-dark);
    color: #fff;
}
.contribution-button-custom {
    border-color: transparent;
    background: transparent;
    color: var(--accent-dark);
}
.contribution-button-custom:hover {
    border-color: var(--line);
    background: var(--surface-soft, var(--accent-soft));
}
@media (max-width: 920px) {
    .contribution-card {
        grid-template-columns: 1fr;
    }
    .contribution-actions {
        max-width: 680px;
    }
}
@media (max-width: 620px) {
    .contribution-card {
        gap: 24px;
        padding: 24px 20px;
        border-radius: 24px;
    }
    .contribution-actions {
        grid-template-columns: repeat(3, 1fr);
    }
    .contribution-button-custom {
        grid-column: 1 / -1;
    }
}


/* Version 0.8.3: freiwillige Unterstützung zusätzlich auf der Startseite */
.support-home-section {
    padding-top: 4px;
}
.contribution-card-home {
    margin-top: 0;
}
.contribution-card-home .contribution-copy h2 {
    max-width: 650px;
    margin: 6px 0 8px;
    font-size: clamp(1.65rem, 3.2vw, 2.45rem);
    line-height: 1.12;
    letter-spacing: -.045em;
}


/* Version 0.8.4: präziser Systemcheck und kontrollierter Mailtest */
.system-mail-test-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    margin-top: 24px;
}
.system-mail-test-card h2 {
    margin: 4px 0 8px;
}
.system-mail-test-card p:not(.eyebrow) {
    max-width: 820px;
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}
.system-mail-test-card form {
    flex: 0 0 auto;
}
.system-mail-test-unavailable {
    max-width: 360px !important;
    padding: 14px 16px;
    border-radius: 14px;
    background: var(--accent-soft);
}
@media (max-width: 760px) {
    .system-mail-test-card {
        align-items: stretch;
        flex-direction: column;
    }
    .system-mail-test-card .button {
        width: 100%;
    }
}


/* Version 0.9.0: Meine Beteiligungen */
.nav-short { display: none; }
.header-participations-link {
    color: var(--text);
    font-weight: 720;
    text-decoration: none;
    white-space: nowrap;
}
.header-participations-link:hover { color: var(--accent-dark); }

.participant-page,
.participant-link-page {
    padding: 48px 0 24px;
}
.participant-hero {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    padding: clamp(30px, 5vw, 58px);
    border: 1px solid var(--line);
    border-radius: 32px;
    background: linear-gradient(135deg, var(--surface) 0%, var(--accent-soft) 180%);
}
.participant-hero h1,
.participant-link-page h1 {
    margin: 6px 0 14px;
    font-size: clamp(2.6rem, 7vw, 5.7rem);
    line-height: .98;
    letter-spacing: -.065em;
}
.participant-hero > div > p:not(.eyebrow),
.participant-link-lead {
    max-width: 790px;
    margin: 0;
    color: var(--muted);
    font-size: clamp(1.05rem, 2vw, 1.28rem);
    line-height: 1.55;
}
.participant-summary {
    flex: 0 0 auto;
    min-width: 148px;
    padding: 24px;
    border-radius: 24px;
    background: var(--surface);
    text-align: center;
}
.participant-summary strong {
    display: block;
    font-size: 2.7rem;
    line-height: 1;
}
.participant-summary span { color: var(--muted); }

.participant-empty {
    max-width: 850px;
    margin: 34px auto 0;
    padding: clamp(30px, 5vw, 56px);
    text-align: center;
}
.participant-empty h2 {
    margin: 16px 0 10px;
    font-size: clamp(1.8rem, 4vw, 2.8rem);
}
.participant-empty p {
    max-width: 670px;
    margin: 0 auto;
    color: var(--muted);
    line-height: 1.6;
}
.participant-empty-actions {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 26px;
}
.participant-privacy-note {
    display: flex;
    gap: 10px;
    max-width: 760px;
    margin: 22px auto 0;
    color: var(--muted);
    font-size: .9rem;
    text-align: center;
}
.participant-privacy-note strong { color: var(--text); }

.participant-section { margin-top: 44px; }
.participation-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}
.participation-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 26px;
    border: 1px solid var(--line);
    border-radius: 26px;
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}
.participation-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}
.participation-card h3 {
    margin: 5px 0 4px;
    font-size: clamp(1.35rem, 2.6vw, 1.8rem);
    line-height: 1.15;
}
.participation-location {
    margin: 0;
    color: var(--muted);
}
.participant-status {
    flex: 0 0 auto;
    padding: 7px 10px;
    border-radius: 999px;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-size: .75rem;
    font-weight: 760;
}
.participant-status-waitlist {
    background: #fff2d8;
    color: #815600;
}
.participant-status-mixed {
    background: #edf1ff;
    color: #364c8b;
}
.participant-status-cancelled {
    background: #f5ecec;
    color: #8a3c3c;
}
.participation-role-list {
    display: grid;
    gap: 8px;
    margin: 22px 0;
}
.participation-role-list > div {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    padding: 11px 13px;
    border-radius: 14px;
    background: var(--surface-soft, var(--accent-soft));
}
.participation-role-list span {
    color: var(--muted);
    font-size: .86rem;
    text-align: right;
}
.participation-card-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 13px;
    margin-top: auto;
}
.participation-card-actions form { margin: 0; }

.participant-past {
    margin-top: 34px;
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: 24px;
    background: var(--surface);
}
.participant-past > summary {
    cursor: pointer;
    font-weight: 760;
}
.participant-past > summary span {
    display: inline-flex;
    min-width: 28px;
    justify-content: center;
    margin-left: 7px;
    padding: 3px 8px;
    border-radius: 999px;
    background: var(--accent-soft);
}
.participant-past .participation-grid { margin-top: 20px; }

.participant-device-panel {
    margin-top: 48px;
    padding: clamp(26px, 4vw, 42px);
    border: 1px solid var(--line);
    border-radius: 30px;
    background: var(--surface);
}
.device-count {
    padding: 8px 12px;
    border-radius: 999px;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-size: .82rem;
    font-weight: 720;
}
.participant-tool-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-top: 24px;
}
.participant-tool-card {
    padding: 24px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: var(--surface-soft, #f8faf8);
}
.participant-tool-icon {
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    border-radius: 14px;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-size: 1.2rem;
    font-weight: 800;
}
.participant-tool-card h3 { margin: 0 0 8px; }
.participant-tool-card > p {
    margin: 0 0 20px;
    color: var(--muted);
    line-height: 1.5;
}
.participant-email-form {
    display: grid;
    gap: 12px;
}
.participant-email-form .field { margin: 0; }
.participant-email-form small { color: var(--muted); }
.participant-ready {
    display: inline-flex;
    padding: 9px 12px;
    border-radius: 999px;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-weight: 720;
}
.participant-security-details {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid var(--line);
}
.participant-security-details > summary {
    cursor: pointer;
    font-weight: 720;
}
.participant-security-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 20px 0 12px;
}
.participant-security-actions form { margin: 0; }
.participant-security-details > p {
    color: var(--muted);
    font-size: .9rem;
}

.participation-memory-card {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 14px;
    margin: 24px 0;
    padding: 15px 17px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--accent-soft);
    color: var(--text);
    text-align: left;
    text-decoration: none;
}
.participation-memory-card > span {
    display: inline-flex;
    width: 34px;
    height: 34px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--accent-dark);
    color: #fff;
}
.participation-memory-card strong,
.participation-memory-card small { display: block; }
.participation-memory-card small { color: var(--muted); }
.participation-memory-card em { color: var(--accent-dark); font-style: normal; font-weight: 720; }

.participant-link-page {
    max-width: 900px;
    margin: 0 auto;
}
.participant-link-page h1 { max-width: 850px; }
.one-time-link-card,
.participant-confirm-card {
    margin-top: 30px;
    padding: clamp(24px, 5vw, 42px);
    border: 1px solid var(--line);
    border-radius: 28px;
    background: var(--surface);
    box-shadow: var(--shadow-soft);
}
.one-time-link-card code {
    display: block;
    overflow-wrap: anywhere;
    padding: 16px;
    border-radius: 14px;
    background: var(--surface-soft, var(--accent-soft));
    color: var(--text);
}
.one-time-link-actions,
.participant-confirm-card {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.one-time-link-actions { margin-top: 18px; }
.participant-confirm-card {
    align-items: center;
}
.participant-confirm-card.stack-form {
    display: grid;
}
.privacy-callout {
    display: flex;
    gap: 12px;
    margin: 20px 0 26px;
    padding: 16px;
    border-radius: 16px;
    background: #fff7e6;
    color: #6f5420;
}
.privacy-callout strong { color: #4f390f; }

@media (max-width: 980px) {
    .participation-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .nav-long { display: none; }
    .nav-short { display: inline; }
    .participant-hero {
        align-items: stretch;
        flex-direction: column;
    }
    .participant-summary {
        min-width: 0;
        align-self: flex-start;
    }
    .participant-tool-grid { grid-template-columns: 1fr; }
    .participation-card-head {
        flex-direction: column;
    }
    .participation-card-actions,
    .participant-security-actions,
    .one-time-link-actions,
    .participant-confirm-card {
        align-items: stretch;
        flex-direction: column;
    }
    .participation-card-actions .button,
    .participant-security-actions .button,
    .one-time-link-actions .button,
    .participant-confirm-card .button {
        width: 100%;
    }
}
@media (max-width: 520px) {
    .header-navigation { gap: 6px; }
    .header-participations-link { font-size: .82rem; }
    .participant-page,
    .participant-link-page { padding-top: 26px; }
    .participant-hero { padding: 24px 20px; border-radius: 24px; }
    .participant-hero h1,
    .participant-link-page h1 { font-size: clamp(2.25rem, 13vw, 3.7rem); }
    .participation-card { padding: 20px; }
    .participation-role-list > div { flex-direction: column; gap: 3px; }
    .participation-role-list span { text-align: left; }
    .participant-device-panel { padding: 22px 18px; }
    .participation-memory-card { grid-template-columns: auto 1fr; }
    .participation-memory-card em { grid-column: 2; }
}


/* Version 0.9.1: intuitive Terminwerkstatt */
.next-step-hint {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 14px;
    align-items: start;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--accent-soft);
}
.next-step-hint > span {
    display: inline-flex;
    width: 34px;
    height: 34px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--accent-dark);
    color: #fff;
    font-weight: 800;
}
.next-step-hint strong,
.next-step-hint small { display: block; }
.next-step-hint small { margin-top: 4px; color: var(--muted); line-height: 1.45; }

.term-workbench {
    padding: clamp(22px, 4vw, 36px);
    border: 1px solid var(--line);
    border-radius: 28px;
    background: linear-gradient(135deg, var(--surface) 0%, var(--accent-soft) 190%);
}
.term-workbench-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 22px;
}
.term-workbench-heading h2 { margin: 3px 0 0; font-size: clamp(1.5rem, 3vw, 2.2rem); }
.term-workbench-heading > span { max-width: 300px; color: var(--muted); font-size: .88rem; text-align: right; }
.term-workbench-grid {
    display: grid;
    grid-template-columns: 1.15fr 1fr .95fr;
    gap: 14px;
}
.term-tool {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 12px;
    min-width: 0;
    padding: 18px;
    border: 1px solid rgba(12, 52, 56, .09);
    border-radius: 20px;
    background: rgba(255,255,255,.82);
}
.term-tool-icon {
    display: inline-flex;
    width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-size: 1.1rem;
}
.term-tool strong { display: block; margin-bottom: 10px; }
.term-tool .field { margin: 0; }
.term-apply-button { margin-top: 8px; color: var(--accent-dark); }
.compact-time-pair { gap: 8px; }
.capacity-helper { display: grid; grid-template-columns: .65fr 1.35fr; gap: 8px; }

.term-editor-list { gap: 20px; }
.term-editor {
    overflow: hidden;
    padding: 0;
    border-radius: 26px;
}
.term-editor .option-editor-head {
    padding: 19px 22px;
    border-bottom: 1px solid var(--line);
    background: var(--surface-soft, #f7faf7);
}
.term-editor .option-editor-head > div > strong,
.term-editor .option-editor-head > div > small { display: block; }
.term-editor .option-editor-head > div > small {
    margin-top: 3px;
    color: var(--muted);
    font-size: .82rem;
}
.term-primary-grid,
.term-secondary-grid,
.term-more {
    margin-left: 22px;
    margin-right: 22px;
}
.term-primary-grid {
    display: grid;
    grid-template-columns: minmax(180px, .8fr) minmax(360px, 1.7fr);
    gap: 18px;
    align-items: start;
    padding-top: 22px;
}
.term-secondary-grid {
    display: grid;
    grid-template-columns: minmax(260px, 1.7fr) minmax(100px, .55fr) minmax(180px, .8fr);
    gap: 14px;
    align-items: end;
    padding: 18px 0;
}
.time-field-group {
    padding: 14px;
    border-radius: 18px;
    background: var(--accent-soft);
}
.field-group-label {
    display: block;
    margin-bottom: 8px;
    color: var(--muted);
    font-size: .78rem;
    font-weight: 720;
    text-transform: uppercase;
    letter-spacing: .05em;
}
.time-pair {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.time-pair .field { margin: 0; }
.duration-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 10px;
}
.duration-chips button {
    padding: 6px 10px;
    border: 1px solid rgba(12, 52, 56, .14);
    border-radius: 999px;
    background: rgba(255,255,255,.72);
    color: var(--text);
    font-size: .78rem;
    cursor: pointer;
}
.duration-chips button:hover,
.duration-chips button.is-active {
    border-color: var(--accent-dark);
    background: var(--accent-dark);
    color: #fff;
}
.term-more {
    margin-bottom: 22px;
    padding: 0;
    border-top: 1px solid var(--line);
}
.term-more > summary {
    padding: 16px 0 0;
    cursor: pointer;
    color: var(--accent-dark);
    font-weight: 720;
}
.term-more-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    padding-top: 14px;
}
.option-add-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}
.option-add-actions small {
    flex-basis: 100%;
    color: var(--muted);
}
.option-date,
.option-location {
    display: block;
    color: var(--muted);
    font-size: .9rem;
}
.option-date { font-weight: 720; color: var(--text); }
.preview-option .option-date,
.preview-option .option-time,
.preview-option .option-location { margin: 3px 0; }

@media (max-width: 980px) {
    .term-workbench-grid { grid-template-columns: 1fr; }
    .term-workbench-heading { align-items: flex-start; flex-direction: column; }
    .term-workbench-heading > span { text-align: left; }
    .term-primary-grid { grid-template-columns: 1fr; }
    .term-secondary-grid { grid-template-columns: 1fr 1fr; }
    .term-secondary-grid .field-location { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
    .term-workbench { padding: 18px; border-radius: 22px; }
    .term-tool { grid-template-columns: 1fr; }
    .term-tool-icon { display: none; }
    .term-editor .option-editor-head {
        align-items: flex-start;
        gap: 10px;
        padding: 16px 17px;
    }
    .option-editor-actions { flex-wrap: wrap; justify-content: flex-end; }
    .term-primary-grid,
    .term-secondary-grid,
    .term-more {
        margin-left: 17px;
        margin-right: 17px;
    }
    .term-secondary-grid,
    .term-more-grid,
    .time-pair,
    .capacity-helper { grid-template-columns: 1fr; }
    .term-secondary-grid .field-location { grid-column: auto; }
    .option-add-actions .button { width: 100%; }
}


/* Version 0.9.2: geschützter Systemcheck und tiefer angeordnete Schnellhilfe */
.suggestions-lower {
    margin-top: 4px;
    padding-top: 18px;
    border-top: 1px solid var(--line);
}
.suggestions-lower > span {
    color: var(--muted);
    font-weight: 680;
}

.system-access-page {
    display: grid;
    min-height: min(720px, 72vh);
    place-items: center;
    padding: 48px 0;
}
.system-access-card {
    width: min(760px, 100%);
    padding: clamp(30px, 6vw, 58px);
    border: 1px solid var(--line);
    border-radius: 30px;
    background: var(--surface);
    box-shadow: var(--shadow-soft);
    text-align: center;
}
.system-access-symbol {
    display: inline-flex;
    width: 62px;
    height: 62px;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
    border-radius: 20px;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-size: 1.8rem;
    font-weight: 800;
}
.system-access-card h1 {
    margin: 5px 0 14px;
    font-size: clamp(2rem, 5vw, 3.6rem);
    line-height: 1.02;
    letter-spacing: -.055em;
}
.system-access-card > p:not(.eyebrow) {
    max-width: 650px;
    margin: 0 auto 26px;
    color: var(--muted);
    line-height: 1.6;
}
.system-access-card > form {
    display: flex;
    justify-content: center;
}
.system-emergency-access {
    margin-top: 28px;
    padding-top: 22px;
    border-top: 1px solid var(--line);
    text-align: left;
}
.system-emergency-access > summary {
    cursor: pointer;
    color: var(--accent-dark);
    font-weight: 720;
}
.system-emergency-access > p {
    color: var(--muted);
    line-height: 1.5;
}
.system-emergency-access code {
    padding: 2px 6px;
    border-radius: 6px;
    background: var(--surface-soft, var(--accent-soft));
}
.system-summary-actions {
    display: flex;
    align-items: center;
    gap: 15px;
}
.system-summary-actions form {
    margin: 0;
}
@media (max-width: 640px) {
    .system-access-card > form .button {
        width: 100%;
    }
    .system-summary-actions {
        align-items: stretch;
        flex-direction: column;
    }
}


/* Version 0.9.3: menschlicher Einstieg und zurückhaltende Zusatzangaben */
.invitation-start-page .form-intro {
    max-width: 780px;
}
.invitation-choice-card strong {
    font-size: clamp(1.2rem, 2vw, 1.48rem);
}
.invitation-choice-card small {
    max-width: 430px;
    line-height: 1.5;
}

.creation-settings {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: var(--surface-soft, #f8faf8);
}
.creation-settings > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 22px;
    cursor: pointer;
    list-style: none;
}
.creation-settings > summary::-webkit-details-marker {
    display: none;
}
.creation-settings > summary::after {
    content: "+";
    display: inline-flex;
    width: 32px;
    height: 32px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-size: 1.2rem;
    font-weight: 800;
}
.creation-settings[open] > summary::after {
    content: "–";
}
.creation-settings > summary > span {
    min-width: 0;
}
.creation-settings > summary strong,
.creation-settings > summary small {
    display: block;
}
.creation-settings > summary small {
    margin-top: 4px;
    color: var(--muted);
    line-height: 1.4;
}
.creation-settings > summary em {
    margin-left: auto;
    padding: 6px 10px;
    border-radius: 999px;
    background: var(--surface);
    color: var(--muted);
    font-size: .74rem;
    font-style: normal;
    font-weight: 720;
}
.creation-settings-content {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    padding: 0 22px 22px;
    border-top: 1px solid var(--line);
}
.creation-settings-group {
    min-width: 0;
    padding-top: 20px;
}
.creation-settings-group h2 {
    margin: 0 0 5px;
    font-size: 1.1rem;
}
.creation-settings-group > div > p {
    margin: 0 0 16px;
    color: var(--muted);
    font-size: .9rem;
    line-height: 1.5;
}
.creation-settings-group .switch-row,
.creation-settings-group .radio-row {
    background: var(--surface);
}
@media (max-width: 760px) {
    .creation-settings-content {
        grid-template-columns: 1fr;
    }
    .creation-settings > summary {
        align-items: flex-start;
    }
    .creation-settings > summary em {
        display: none;
    }
}


/* Version 0.9.4: Bedarfsarten, Mitbringlisten und klare Kartenaktionen */
.creation-settings-content {
    grid-template-columns: 1fr;
    gap: 0;
}
.creation-settings-group + .creation-settings-group {
    margin-top: 4px;
    padding-top: 22px;
    border-top: 1px solid var(--line);
}
.creation-settings-group .switch-row,
.creation-settings-group .radio-row {
    padding-left: 0;
    padding-right: 0;
    border: 0;
    border-top: 1px solid var(--line);
    border-radius: 0;
    background: transparent;
}
.creation-settings-group .switch-row:first-of-type,
.creation-settings-group .radio-row:first-of-type {
    border-top: 0;
}

.option-editor-actions,
.option-editor-meta {
    display: flex;
    align-items: center;
    gap: 8px;
}
.option-booking-count {
    padding: 6px 9px;
    border-radius: 999px;
    background: var(--accent-soft);
    color: var(--muted);
    font-size: .76rem;
    font-weight: 720;
}
.option-card-action {
    display: inline-flex;
    min-height: 39px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 8px 11px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface);
    color: var(--accent-dark);
    font: inherit;
    font-size: .82rem;
    font-weight: 760;
    cursor: pointer;
}
.option-card-action svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.option-card-action:hover {
    border-color: var(--accent-dark);
    background: var(--accent-soft);
}
.option-card-action-delete {
    color: #a43f3f;
}
.option-card-action-delete:hover {
    border-color: #d8a2a2;
    background: #fff0f0;
}
.option-card-action[hidden] {
    display: none !important;
}

.task-editor {
    overflow: hidden;
    padding: 0;
    border-radius: 26px;
}
.task-editor > :not(.option-editor-head) {
    margin-left: 22px;
    margin-right: 22px;
}
.task-editor .option-editor-head {
    padding: 18px 22px;
    border-bottom: 1px solid var(--line);
    background: var(--surface-soft, #f7faf7);
}
.task-editor .option-editor-head > div:first-child > strong,
.task-editor .option-editor-head > div:first-child > small {
    display: block;
}
.task-editor .option-editor-head > div:first-child > small {
    margin-top: 3px;
    color: var(--muted);
}

.task-core-grid {
    display: grid;
    grid-template-columns: minmax(230px, .85fr) minmax(430px, 1.4fr);
    gap: 18px;
    align-items: start;
    padding-top: 22px;
}
.task-title-field {
    margin: 0;
}
.field-label {
    display: block;
    margin-bottom: 8px;
    color: var(--muted);
    font-size: .78rem;
    font-weight: 720;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.need-mode-picker {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 7px;
}
.need-mode-picker button {
    min-width: 0;
    padding: 10px 9px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--surface);
    color: var(--text);
    text-align: left;
    cursor: pointer;
}
.need-mode-picker button strong,
.need-mode-picker button small {
    display: block;
}
.need-mode-picker button small {
    margin-top: 3px;
    color: var(--muted);
    font-size: .72rem;
    line-height: 1.25;
}
.need-mode-picker button:hover {
    border-color: var(--accent);
}
.need-mode-picker button.is-active {
    border-color: var(--accent-dark);
    background: var(--accent-dark);
    color: #fff;
}
.need-mode-picker button.is-active small {
    color: rgba(255,255,255,.78);
}

.task-need-settings {
    display: grid;
    grid-template-columns: minmax(120px, .4fr) minmax(240px, 1fr);
    gap: 14px;
    align-items: end;
    padding: 18px 0;
}
.task-need-settings > * {
    margin: 0;
}
.task-need-settings [hidden] {
    display: none !important;
}
.open-need-hint {
    grid-column: 1 / -1;
    padding: 14px 16px;
    border-radius: 16px;
    background: var(--accent-soft);
}
.open-need-hint strong,
.open-need-hint small {
    display: block;
}
.open-need-hint small {
    margin-top: 3px;
    color: var(--muted);
}

.task-shortcuts {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 0 18px;
}
.task-preset-button {
    padding: 8px 12px;
    border: 1px solid var(--accent);
    border-radius: 999px;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font: inherit;
    font-size: .82rem;
    font-weight: 760;
    cursor: pointer;
}
.task-shortcuts small {
    color: var(--muted);
}

.task-more {
    margin-bottom: 22px !important;
    border-top: 1px solid var(--line);
}
.task-more > summary {
    padding: 16px 0 0;
    color: var(--accent-dark);
    font-weight: 720;
    cursor: pointer;
}
.task-more-content {
    display: grid;
    gap: 14px;
    padding-top: 16px;
}
.response-question-box {
    display: grid;
    gap: 13px;
    padding: 17px;
    border-radius: 18px;
    background: var(--surface-soft, var(--accent-soft));
}
.response-question-box > div:first-child strong,
.response-question-box > div:first-child small {
    display: block;
}
.response-question-box > div:first-child small {
    color: var(--muted);
}
.response-question-settings {
    display: grid;
    grid-template-columns: 1fr 1.2fr;
    gap: 12px;
    align-items: end;
}
.response-question-settings[hidden] {
    display: none !important;
}
.compact-switch {
    min-height: 58px;
    margin: 0;
    background: var(--surface);
}

.bulk-option-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 12px;
}
.bulk-option-footer > span {
    color: var(--muted);
    font-size: .84rem;
}

.need-mode-badge {
    display: inline-flex;
    align-self: flex-start;
    margin-top: 7px;
    padding: 5px 8px;
    border-radius: 999px;
    background: var(--surface-soft, var(--accent-soft));
    color: var(--accent-dark);
    font-size: .75rem;
    font-weight: 740;
}
.need-mode-minimum {
    background: #eaf5ed;
    color: #25623d;
}
.need-mode-open {
    background: #eef0fa;
    color: #485287;
}
.public-option.is-flexible-need {
    border-style: solid;
}
.response-prompt-preview {
    color: var(--accent-dark) !important;
}
.public-contribution-list {
    display: grid;
    gap: 7px;
    margin-top: 9px;
}
.public-contribution-list > small {
    color: var(--muted);
}
.public-contribution-list > span {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.public-contribution-list b {
    padding: 5px 8px;
    border-radius: 999px;
    background: var(--accent-soft);
    color: var(--text);
    font-size: .75rem;
    font-weight: 680;
}

.contribution-answer-field {
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: var(--surface-soft, var(--accent-soft));
}
.duplicate-answer-warning {
    display: block;
    margin-top: 7px;
    color: #8a5b09;
    font-size: .83rem;
    font-style: normal;
    font-weight: 680;
}
.booking-response {
    display: block;
    margin-top: 5px;
    color: var(--accent-dark);
}
.booking-edit-option-group {
    display: grid;
    gap: 8px;
}
.booking-edit-answer {
    margin: -4px 0 10px 42px;
    padding: 12px;
    border-radius: 14px;
    background: var(--surface-soft, var(--accent-soft));
}

.admin-response-list {
    display: grid;
    gap: 7px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
}
.admin-response-list > span {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 10px;
    border-radius: 10px;
    background: var(--surface-soft, var(--accent-soft));
}
.admin-response-list small,
.booking-answer-text {
    color: var(--muted);
}
.booking-answer-text {
    margin-top: 4px;
}
.participation-role-list > div {
    flex-wrap: wrap;
}
.participation-role-list > div > small {
    flex-basis: 100%;
    color: var(--accent-dark);
}

@media (max-width: 900px) {
    .task-core-grid {
        grid-template-columns: 1fr;
    }
    .response-question-settings {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 660px) {
    .option-editor-actions,
    .option-editor-meta {
        width: 100%;
        flex-wrap: wrap;
        justify-content: flex-end;
    }
    .option-card-action {
        flex: 1 1 auto;
    }
    .task-editor > :not(.option-editor-head) {
        margin-left: 16px;
        margin-right: 16px;
    }
    .task-need-settings,
    .need-mode-picker {
        grid-template-columns: 1fr;
    }
    .task-shortcuts,
    .bulk-option-footer {
        align-items: stretch;
        flex-direction: column;
    }
    .task-preset-button,
    .bulk-option-footer .button {
        width: 100%;
    }
    .booking-edit-answer {
        margin-left: 0;
    }
}


/* Version 0.9.5: natürlicher Abschluss der Aufgabenbearbeitung */
.task-add-flow {
    display: grid;
    gap: 14px;
    margin-top: 8px;
}
.quick-task-section {
    padding: 20px 22px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: var(--surface);
}
.quick-task-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 14px;
}
.quick-task-heading h2,
.quick-task-heading h3 {
    margin: 2px 0 0;
}
.quick-task-heading h2 {
    font-size: clamp(1.25rem, 2vw, 1.6rem);
}
.quick-task-heading h3 {
    font-size: 1.15rem;
}
.quick-task-heading > span {
    max-width: 320px;
    color: var(--muted);
    font-size: .84rem;
    line-height: 1.4;
    text-align: right;
}
.quick-task-suggestions {
    margin: 0;
    padding: 0;
    border: 0;
}
.quick-task-suggestions > span {
    display: none;
}
.custom-task-add {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 8px 0 12px;
}
.custom-task-add > span {
    color: var(--muted);
    font-size: .88rem;
}
.custom-task-add .button {
    min-width: 190px;
}
.compact-task-add-flow {
    margin-top: 4px;
}
.compact-task-add-flow .quick-task-section {
    background: var(--surface-soft, #f7faf7);
}

.optional-tools-panel {
    overflow: hidden;
    margin-top: 20px;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: var(--surface-soft, #f7faf7);
}
.optional-tools-panel > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 18px 22px;
    cursor: pointer;
    list-style: none;
}
.optional-tools-panel > summary::-webkit-details-marker {
    display: none;
}
.optional-tools-panel > summary::after {
    content: "+";
    display: inline-flex;
    width: 32px;
    height: 32px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-size: 1.15rem;
    font-weight: 800;
}
.optional-tools-panel[open] > summary::after {
    content: "–";
}
.optional-tools-panel > summary > span {
    min-width: 0;
}
.optional-tools-panel > summary strong,
.optional-tools-panel > summary small {
    display: block;
}
.optional-tools-panel > summary small {
    margin-top: 3px;
    color: var(--muted);
    line-height: 1.4;
}
.optional-tools-panel > summary em {
    margin-left: auto;
    padding: 6px 10px;
    border-radius: 999px;
    background: var(--surface);
    color: var(--muted);
    font-size: .74rem;
    font-style: normal;
    font-weight: 720;
}
.optional-tools-content {
    padding: 20px 22px 22px;
    border-top: 1px solid var(--line);
}
.optional-tools-panel .option-comfort-grid {
    margin: 0;
}
.optional-tools-panel + .form-actions {
    margin-top: 22px;
}

@media (max-width: 700px) {
    .quick-task-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }
    .quick-task-heading > span {
        max-width: none;
        text-align: left;
    }
    .custom-task-add {
        align-items: stretch;
        flex-direction: column;
        text-align: center;
    }
    .custom-task-add .button {
        width: 100%;
    }
    .optional-tools-panel > summary em {
        display: none;
    }
}


/* Version 0.9.6: Zusatzfrage direkt an der ausgewählten Aufgabe */
.response-question-settings {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.public-option-group {
    display: grid;
    gap: 8px;
}
.public-option-group.is-selected .public-option,
.public-option-group:has(.public-option input:checked) .public-option {
    border-color: var(--accent);
}
.inline-option-question {
    margin: -2px 12px 8px 52px;
    padding: 15px 16px;
    border: 1px solid rgba(23,109,82,.24);
    border-radius: 16px;
    background: linear-gradient(135deg, #f4faf6, #fff);
    box-shadow: 0 8px 24px rgba(27,48,39,.05);
}
.inline-option-question[hidden] {
    display: none !important;
}
.inline-option-question .field {
    margin: 0;
}
.inline-option-question .field > span {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
}
.inline-option-question .field > span em,
.required-note {
    padding: 3px 7px;
    border-radius: 999px;
    background: var(--accent-dark);
    color: #fff;
    font-size: .68rem;
    font-style: normal;
    font-weight: 760;
    letter-spacing: .02em;
    text-transform: uppercase;
}
.inline-option-question input {
    position: static;
    width: 100%;
    opacity: 1;
    pointer-events: auto;
}
.selected-answer {
    display: grid;
    gap: 2px;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--line);
}
.selected-answer small {
    color: var(--muted);
}
.selected-answer b {
    color: var(--accent-dark);
}
@media (max-width: 900px) {
    .response-question-settings {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 640px) {
    .inline-option-question {
        margin-left: 0;
        margin-right: 0;
    }
}


/* Version 0.9.7: kompakte Zusatzfrage ohne Formular-im-Formular-Wirkung */
.response-question-box {
    display: block;
    overflow: hidden;
    gap: 0;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 19px;
    background: var(--surface);
    box-shadow: none;
}
.response-question-heading {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 15px 18px;
    border-bottom: 1px solid var(--line);
    background: var(--surface-soft, #f7faf7);
}
.response-question-heading > div {
    min-width: 0;
}
.response-question-heading strong,
.response-question-heading small {
    display: block;
}
.response-question-heading strong {
    font-size: 1rem;
}
.response-question-heading small {
    margin-top: 2px;
    color: var(--muted);
    font-size: .82rem;
}
.response-question-icon {
    display: inline-flex;
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-size: 1rem;
    font-weight: 850;
}
.response-question-box > .response-question-input {
    margin: 17px 18px 15px;
}
.response-question-box > .response-question-input input {
    padding: 13px 15px;
    font-size: 1rem;
}
.response-question-settings {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, .85fr);
    gap: 0 20px;
    align-items: stretch;
    padding: 0 18px 17px;
    border-top: 1px solid var(--line);
}
.response-question-settings[hidden] {
    display: none !important;
}
.response-setting {
    min-width: 0;
    min-height: 70px;
    margin: 0;
    padding: 14px 0 0;
}
.response-setting > span,
.response-setting > span strong,
.response-setting > span small {
    display: block;
}
.response-setting > span strong {
    font-size: .94rem;
}
.response-setting > span small {
    margin-top: 3px;
    color: var(--muted);
    font-size: .78rem;
    line-height: 1.35;
}
.response-setting-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    cursor: pointer;
}
.response-setting-toggle input {
    position: relative;
    width: 44px;
    height: 25px;
    flex: 0 0 auto;
    appearance: none;
    border: 0;
    border-radius: 999px;
    background: #d5ddd8;
    box-shadow: none;
    cursor: pointer;
    transition: .2s ease;
}
.response-setting-toggle input::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 19px;
    height: 19px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 6px rgba(0,0,0,.14);
    transition: .2s ease;
}
.response-setting-toggle input:checked {
    background: var(--accent);
}
.response-setting-toggle input:checked::after {
    transform: translateX(19px);
}
.response-setting-select {
    display: grid;
    align-content: center;
    gap: 7px;
    padding-left: 20px;
    border-left: 1px solid var(--line);
}
.response-setting-select > span {
    color: var(--text);
    font-size: .86rem;
    font-weight: 720;
}
.response-setting-select select {
    width: 100%;
    min-height: 44px;
    padding: 10px 38px 10px 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background-color: var(--surface);
    color: var(--text);
    font: inherit;
}
.response-duplicate-setting {
    grid-column: 1 / -1;
    min-height: 58px;
    margin-top: 4px;
    padding-top: 13px;
    border-top: 1px solid var(--line);
}
.response-duplicate-setting[hidden] {
    display: none !important;
}

@media (max-width: 820px) {
    .response-question-settings {
        grid-template-columns: 1fr;
    }
    .response-setting-select {
        padding-left: 0;
        border-left: 0;
        border-top: 1px solid var(--line);
    }
    .response-duplicate-setting {
        grid-column: auto;
    }
}


/* Version 0.10.0: schlichte Startseite, Begleitmodus und kompakte Aufgaben */

/* Startseite */
.home-hero-simple {
    display: flex;
    justify-content: center;
    padding: clamp(58px, 8vw, 104px) 0 clamp(34px, 5vw, 58px);
    text-align: center;
}
.home-hero-copy {
    max-width: 850px;
}
.home-hero-copy h1 {
    max-width: 780px;
    margin: 8px auto 18px;
    font-size: clamp(3rem, 8vw, 6.3rem);
    line-height: .96;
    letter-spacing: -.065em;
}
.home-hero-copy > p:not(.eyebrow) {
    max-width: 700px;
    margin: 0 auto;
    color: var(--muted);
    font-size: clamp(1.08rem, 2.1vw, 1.34rem);
    line-height: 1.55;
}
.home-hero-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 12px 16px;
    margin-top: 30px;
}
.home-trust-line {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 24px;
}
.home-trust-line span {
    padding: 7px 11px;
    border-radius: 999px;
    background: var(--surface-soft, #f1f5f1);
    color: var(--muted);
    font-size: .78rem;
    font-weight: 700;
}

.home-start-panel {
    padding: clamp(24px, 4vw, 42px);
    border: 1px solid var(--line);
    border-radius: 30px;
    background: var(--surface);
    box-shadow: 0 22px 65px rgba(12, 52, 56, .07);
}
.home-start-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 22px;
}
.home-start-heading h2 {
    margin: 3px 0 0;
    font-size: clamp(1.8rem, 3.2vw, 2.7rem);
}
.home-start-heading > p {
    max-width: 430px;
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}
.home-start-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.home-start-grid form {
    margin: 0;
}
.home-start-choice {
    display: grid;
    width: 100%;
    min-height: 160px;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: var(--surface-soft, #f7faf7);
    color: var(--text);
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.home-start-choice:hover {
    transform: translateY(-2px);
    border-color: var(--accent);
    background: var(--accent-soft);
}
.home-start-choice > span:nth-child(2) {
    min-width: 0;
}
.home-start-choice strong,
.home-start-choice small {
    display: block;
}
.home-start-choice strong {
    font-size: clamp(1.16rem, 2vw, 1.42rem);
}
.home-start-choice small {
    margin-top: 7px;
    color: var(--muted);
    line-height: 1.45;
}
.home-start-choice b {
    color: var(--accent-dark);
    font-size: 1.35rem;
}
.home-start-symbol {
    display: inline-flex;
    width: 48px;
    height: 48px;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-size: 1.35rem;
    font-weight: 850;
}
.home-quickstarts {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 18px;
}
.home-quickstarts > span {
    margin-right: 4px;
    color: var(--muted);
    font-size: .86rem;
}
.home-quickstarts form {
    margin: 0;
}
.home-quickstarts button {
    padding: 8px 12px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: transparent;
    color: var(--accent-dark);
    font: inherit;
    font-size: .82rem;
    font-weight: 730;
    cursor: pointer;
}
.home-quickstarts button:hover {
    border-color: var(--accent);
    background: var(--accent-soft);
}

.home-flow {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    margin: 26px 0 clamp(48px, 8vw, 92px);
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 24px;
    background: var(--line);
}
.home-flow article {
    display: flex;
    gap: 14px;
    padding: 23px;
    background: var(--surface);
}
.home-flow article > span {
    display: inline-flex;
    width: 31px;
    height: 31px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-weight: 800;
}
.home-flow strong,
.home-flow p {
    display: block;
}
.home-flow p {
    margin: 5px 0 0;
    color: var(--muted);
    font-size: .88rem;
    line-height: 1.45;
}

/* Kompakte Aufgaben */
.option-card-action-collapse {
    color: var(--accent-dark);
}
.task-editor.is-collapsed {
    border-color: rgba(23, 109, 82, .25);
}
.task-editor.is-collapsed > :not(.option-editor-head) {
    display: none !important;
}
.task-editor.is-collapsed .option-editor-head {
    border-bottom: 0;
}
.task-editor.is-collapsed .option-card-action-copy,
.task-editor.is-collapsed .option-card-action-delete {
    opacity: .66;
}
.invitation-check-card {
    display: grid;
    grid-template-columns: minmax(200px, .75fr) minmax(260px, 1fr);
    gap: 16px 28px;
    align-items: center;
    padding: 22px 24px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: var(--surface-soft, #f7faf7);
}
.invitation-check-card h2 {
    margin: 2px 0 0;
    font-size: 1.2rem;
}
.invitation-check-card > strong {
    font-size: 1rem;
    line-height: 1.45;
}
.invitation-check-notes {
    display: flex;
    grid-column: 1 / -1;
    flex-wrap: wrap;
    gap: 7px;
}
.invitation-check-notes span {
    padding: 6px 9px;
    border-radius: 999px;
    background: var(--surface);
    color: var(--muted);
    font-size: .78rem;
    font-weight: 680;
}

/* Begleitmodus */
.companion-setup-card {
    margin: 24px 0;
    padding: clamp(22px, 4vw, 34px);
    border: 1px solid var(--line);
    border-radius: 26px;
    background: linear-gradient(135deg, var(--surface) 0%, var(--surface-soft, #f4f8f4) 100%);
}
.companion-setup-card.is-active {
    border-color: rgba(23, 109, 82, .32);
}
.companion-setup-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
}
.companion-setup-heading h2,
.companion-setup-heading h3 {
    margin: 4px 0 8px;
}
.companion-setup-heading p:last-child {
    max-width: 720px;
    margin: 0;
    color: var(--muted);
    line-height: 1.55;
}
.companion-active-badge {
    flex: 0 0 auto;
    padding: 7px 11px;
    border-radius: 999px;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-size: .76rem;
    font-weight: 800;
}
.companion-current-status {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    margin: 20px 0 4px;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--line);
}
.companion-current-status span {
    padding: 13px 14px;
    background: var(--surface);
    color: var(--muted);
    font-size: .78rem;
}
.companion-current-status strong {
    display: block;
    margin-bottom: 4px;
    color: var(--text);
    font-size: .8rem;
}
.companion-settings-form {
    display: grid;
    gap: 18px;
    margin-top: 22px;
}
.companion-email-field {
    max-width: 560px;
}
.companion-reminder-field {
    display: grid;
    grid-template-columns: minmax(220px, .8fr) minmax(280px, 1fr);
    gap: 14px 24px;
    align-items: end;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--surface);
}
.companion-reminder-field > div:first-child {
    grid-column: 1 / -1;
}
.companion-reminder-field strong,
.companion-reminder-field small {
    display: block;
}
.companion-reminder-field small {
    margin-top: 3px;
    color: var(--muted);
}
.companion-reminder-quick {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    align-self: center;
}
.companion-reminder-quick button,
.companion-snooze-form button {
    padding: 9px 12px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--surface-soft, #f7faf7);
    color: var(--accent-dark);
    font: inherit;
    font-size: .8rem;
    font-weight: 720;
    cursor: pointer;
}
.companion-reminder-quick button:hover,
.companion-reminder-quick button.is-active,
.companion-snooze-form button:hover {
    border-color: var(--accent);
    background: var(--accent-soft);
}
.companion-core-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.companion-core-options .response-setting {
    padding: 15px 17px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface);
}
.companion-more-settings {
    border-top: 1px solid var(--line);
}
.companion-more-settings > summary {
    padding-top: 15px;
    color: var(--accent-dark);
    font-weight: 740;
    cursor: pointer;
}
.companion-more-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    padding-top: 15px;
}
.companion-form-actions {
    display: flex;
    align-items: center;
    gap: 14px;
}
.companion-form-actions small {
    color: var(--muted);
}
.companion-disable-form {
    margin-top: 14px;
}
.companion-mail-missing {
    margin-top: 18px;
    padding: 16px;
    border-radius: 16px;
    background: var(--surface);
}
.companion-mail-missing p {
    margin: 5px 0 0;
    color: var(--muted);
}

/* Begleitlink aus der E-Mail */
.companion-action-page {
    max-width: 980px;
    margin: 0 auto;
    padding: clamp(34px, 6vw, 72px) 0;
}
.companion-action-hero {
    max-width: 720px;
    margin-bottom: 24px;
}
.companion-action-hero h1 {
    margin: 4px 0 10px;
    font-size: clamp(2.3rem, 5vw, 4rem);
}
.companion-action-hero > p:last-child {
    color: var(--muted);
}
.companion-status-card {
    display: flex;
    gap: 18px;
    padding: 24px;
    border: 1px solid var(--line);
    border-radius: 24px;
    background: var(--surface-soft, #f7faf7);
}
.companion-status-card.is-complete {
    background: #edf8f1;
}
.companion-status-symbol {
    display: inline-flex;
    width: 48px;
    height: 48px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-size: 1.35rem;
    font-weight: 850;
}
.companion-status-card h2 {
    margin: 3px 0 8px;
}
.companion-status-card p:last-child {
    margin-bottom: 0;
    color: var(--muted);
}
.companion-open-list {
    display: grid;
    gap: 7px;
    margin: 14px 0 0;
    padding: 0;
    list-style: none;
}
.companion-open-list li {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 9px 11px;
    border-radius: 11px;
    background: var(--surface);
}
.companion-open-list span {
    color: var(--muted);
}
.companion-action-grid {
    display: grid;
    grid-template-columns: 1.25fr .75fr;
    gap: 16px;
    margin-top: 16px;
}
.companion-action-card {
    padding: 22px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: var(--surface);
}
.companion-action-card h2 {
    margin: 3px 0 10px;
    font-size: 1.25rem;
}
.companion-action-card > p:not(.eyebrow) {
    color: var(--muted);
    line-height: 1.55;
}
.companion-action-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 18px;
}
.companion-snooze-form {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 16px;
}
.companion-action-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 20px;
}

@media (max-width: 900px) {
    .home-start-heading,
    .companion-setup-heading {
        align-items: flex-start;
        flex-direction: column;
    }
    .home-start-grid,
    .home-flow,
    .companion-action-grid {
        grid-template-columns: 1fr;
    }
    .home-flow {
        gap: 1px;
    }
    .companion-current-status {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 680px) {
    .home-hero-copy h1 {
        font-size: clamp(2.75rem, 15vw, 4.4rem);
    }
    .home-hero-actions,
    .home-hero-actions .button {
        width: 100%;
    }
    .home-start-choice {
        min-height: 0;
        grid-template-columns: auto 1fr;
    }
    .home-start-choice b {
        display: none;
    }
    .home-quickstarts {
        align-items: stretch;
        flex-direction: column;
    }
    .home-quickstarts form,
    .home-quickstarts button {
        width: 100%;
    }
    .invitation-check-card,
    .companion-reminder-field,
    .companion-core-options,
    .companion-more-grid {
        grid-template-columns: 1fr;
    }
    .companion-current-status {
        grid-template-columns: 1fr;
    }
    .companion-form-actions,
    .companion-action-footer {
        align-items: stretch;
        flex-direction: column;
    }
}


/* Version 0.10.0: ruhige Alternative zur automatischen Begleitung */
.access-mail-details {
    overflow: hidden;
    padding: 0;
}
.access-mail-details > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 20px;
    cursor: pointer;
    list-style: none;
}
.access-mail-details > summary::-webkit-details-marker {
    display: none;
}
.access-mail-details > summary::after {
    content: "+";
    display: inline-flex;
    width: 32px;
    height: 32px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-weight: 800;
}
.access-mail-details[open] > summary::after {
    content: "–";
}
.access-mail-details > summary strong,
.access-mail-details > summary small {
    display: block;
}
.access-mail-details > summary small {
    margin-top: 4px;
    color: var(--muted);
    line-height: 1.4;
}
.access-mail-details-content {
    padding: 0 20px 20px;
    border-top: 1px solid var(--line);
}
.access-mail-details-content .inline-mail-form {
    padding-top: 18px;
}


/* Version 0.10.1: geschützter Cronjob mit Funktionsnachweis */
.companion-cron-card {
    display: grid;
    gap: 20px;
}
.companion-cron-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
}
.companion-cron-heading h2 {
    margin-bottom: 7px;
}
.companion-cron-heading p:last-child {
    max-width: 820px;
    margin-bottom: 0;
}
.cron-state {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    padding: 8px 12px;
    border-radius: 999px;
    background: #fff3d8;
    color: #835c09;
    font-size: .8rem;
    font-weight: 780;
}
.cron-state-active {
    background: #def3e9;
    color: #12624b;
}
.cron-credential-grid {
    display: grid;
    grid-template-columns: 1.4fr .8fr 1.2fr .75fr;
    gap: 12px;
}
.cron-credential {
    display: grid;
    align-content: start;
    gap: 7px;
    min-width: 0;
    padding: 15px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface-soft, #f7faf7);
}
.cron-credential > span {
    color: var(--muted);
    font-size: .75rem;
    font-weight: 740;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.cron-credential code {
    display: block;
    overflow-wrap: anywhere;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--text);
    font-size: .86rem;
}
.cron-credential strong {
    font-size: 1rem;
}
.cron-credential small {
    color: var(--muted);
    line-height: 1.4;
}
.cron-credential .text-button {
    justify-self: start;
    font-size: .78rem;
}
.cron-last-run {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 5px 14px;
    padding: 14px 16px;
    border-radius: 15px;
    background: #fff3d8;
    color: #6f500e;
}
.cron-last-run-ok {
    background: #def3e9;
    color: #125844;
}
.cron-last-run strong {
    grid-row: 1 / span 2;
}
.cron-last-run small {
    grid-column: 2;
    opacity: .8;
}
.cron-system-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.cron-system-actions form {
    margin: 0;
}
.cron-rotate-access {
    text-align: right;
}
.cron-rotate-access summary {
    color: var(--muted);
    cursor: pointer;
    font-size: .82rem;
    font-weight: 720;
}
.cron-rotate-access p {
    max-width: 430px;
    margin: 9px 0;
    color: var(--muted);
    font-size: .8rem;
}
.danger-text-button {
    color: #a43f3f;
}

@media (max-width: 980px) {
    .cron-credential-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 680px) {
    .companion-cron-heading,
    .cron-system-actions {
        align-items: stretch;
        flex-direction: column;
    }
    .cron-state {
        align-self: flex-start;
    }
    .cron-credential-grid {
        grid-template-columns: 1fr;
    }
    .cron-last-run {
        grid-template-columns: 1fr;
    }
    .cron-last-run strong,
    .cron-last-run small {
        grid-column: auto;
        grid-row: auto;
    }
    .cron-rotate-access {
        text-align: left;
    }
}


/* Version 0.11.0: anonymer Geräteverbund */
.dashboard-device-sync {
    display: inline-flex; align-items: center; min-height: 36px; padding: 7px 11px;
    border-radius: 999px; background: #fff3d8; color: #78570f; font-size: .78rem; font-weight: 760;
}
.dashboard-device-sync.is-ready { background: #def3e9; color: #12624b; }
.device-sync-overview {
    display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; margin: 18px 0;
}
.device-sync-overview > div { padding: 15px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
.device-sync-overview strong, .device-sync-overview span { display:block; }
.device-sync-overview strong { font-size: 1.35rem; }
.device-sync-overview span { margin-top:3px; color:var(--muted); font-size:.8rem; }
.participant-tool-primary { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); background: var(--accent-soft); }
.connected-device-list { display:grid; gap:9px; margin-top:22px; }
.connected-device-heading { display:flex; justify-content:space-between; align-items:end; gap:18px; margin-bottom:4px; }
.connected-device-heading h3 { margin:0; }
.connected-device-heading span { color:var(--muted); font-size:.82rem; }
.connected-device { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:13px; align-items:center; padding:13px 15px; border:1px solid var(--line); border-radius:16px; background:var(--surface); }
.connected-device.is-current { border-color: color-mix(in srgb, var(--accent) 48%, var(--line)); background:var(--surface-soft); }
.connected-device-icon { display:inline-flex; width:38px; height:38px; align-items:center; justify-content:center; border-radius:12px; background:var(--accent-soft); color:var(--accent-dark); font-size:1.2rem; }
.connected-device-copy strong, .connected-device-copy small { display:block; }
.connected-device-copy strong em { display:inline-flex; margin-left:6px; padding:3px 7px; border-radius:999px; background:#def3e9; color:#12624b; font-size:.68rem; font-style:normal; }
.connected-device-copy small { margin-top:3px; color:var(--muted); }
.connected-device-actions { position:relative; }
.connected-device-actions > summary { padding:7px 10px; border:1px solid var(--line); border-radius:10px; color:var(--accent-dark); cursor:pointer; font-size:.78rem; font-weight:740; list-style:none; }
.connected-device-actions > summary::-webkit-details-marker { display:none; }
.connected-device-actions[open] { align-self:start; min-width:230px; padding:10px; border:1px solid var(--line); border-radius:14px; background:var(--surface); box-shadow:0 12px 35px #0001; }
.connected-device-actions[open] > summary { margin-bottom:10px; }
.connected-device-actions form + form { margin-top:10px; padding-top:9px; border-top:1px solid var(--line); }
.watch-device-note { display:flex; gap:14px; margin-top:18px; padding:14px 16px; border-radius:15px; background:var(--surface-soft); }
.watch-device-note strong { flex:0 0 auto; }
.watch-device-note span { color:var(--muted); line-height:1.45; }
.device-transfer-summary { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:15px 0; }
.device-transfer-summary span { padding:13px; border:1px solid var(--line); border-radius:14px; background:var(--surface); }
.device-transfer-summary strong { font-size:1.25rem; }
.one-time-link-card > small { display:block; margin-top:10px; color:var(--muted); line-height:1.45; }
@media (max-width:720px) {
    .device-sync-overview, .device-transfer-summary { grid-template-columns:1fr; }
    .connected-device-heading { align-items:flex-start; flex-direction:column; gap:3px; }
    .connected-device { grid-template-columns:auto 1fr; }
    .connected-device-actions { grid-column:1 / -1; width:100%; }
    .connected-device-actions[open] { min-width:0; }
    .watch-device-note { flex-direction:column; gap:4px; }
}


/* Version 0.11.1: eine persönliche Ansicht für Mitmachen, Organisieren und Geräte */
.my-overview-page {
    width: min(1500px, calc(100% - 36px));
    margin: 0 auto;
    padding: 34px 0 70px;
}
.my-overview-page > * {
    scroll-margin-top: 24px;
}
.my-overview-hero {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    padding: 12px 4px 28px;
}
.my-overview-hero > div {
    max-width: 900px;
}
.my-overview-hero h1 {
    margin: 6px 0 10px;
    font-size: clamp(2.5rem, 5vw, 5rem);
    line-height: .98;
}
.my-overview-hero p:last-child {
    max-width: 820px;
    margin-bottom: 0;
    color: var(--muted);
    font-size: 1.08rem;
    line-height: 1.55;
}

.my-overview-nav {
    position: sticky;
    top: 10px;
    z-index: 8;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 9px;
    margin-bottom: 18px;
    padding: 9px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: color-mix(in srgb, var(--surface) 92%, transparent);
    box-shadow: 0 12px 32px rgba(12, 52, 56, .08);
    backdrop-filter: blur(14px);
}
.my-overview-nav a {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 11px;
    padding: 11px 14px;
    border-radius: 15px;
    color: var(--text);
    text-decoration: none;
}
.my-overview-nav a:hover,
.my-overview-nav a:focus-visible {
    background: var(--accent-soft);
}
.my-overview-nav-icon {
    display: inline-flex;
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-weight: 820;
}
.my-overview-nav a > span:last-child,
.my-overview-nav strong,
.my-overview-nav small {
    display: block;
    min-width: 0;
}
.my-overview-nav small {
    margin-top: 2px;
    overflow: hidden;
    color: var(--muted);
    font-size: .76rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.my-overview-section {
    margin-top: 18px;
    padding: clamp(22px, 3vw, 40px);
    border: 1px solid var(--line);
    border-radius: 30px;
    background: var(--surface);
    box-shadow: 0 16px 45px rgba(12, 52, 56, .06);
}
.my-section-heading {
    align-items: flex-start;
    margin-bottom: 24px;
}
.my-section-heading h2 {
    margin: 4px 0 5px;
    font-size: clamp(1.65rem, 3vw, 2.4rem);
}
.my-section-heading p:last-child {
    max-width: 760px;
    margin: 0;
    color: var(--muted);
}
.section-count-pill,
.device-count {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    padding: 8px 12px;
    border-radius: 999px;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-size: .8rem;
    font-weight: 760;
}
.my-section-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}
.my-subsection-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 26px 0 13px;
}
.my-subsection-heading:first-child {
    margin-top: 0;
}
.my-subsection-heading h3 {
    margin: 0;
    font-size: 1.15rem;
}
.my-subsection-heading > span {
    color: var(--muted);
    font-size: .82rem;
}
.my-past-section {
    margin-top: 24px;
}

.my-empty-state {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 0;
    padding: 20px 22px;
    border: 1px dashed var(--line);
    border-radius: 19px;
    background: var(--surface-soft, #f7faf7);
    text-align: left;
}
.my-empty-state > div:first-child {
    max-width: 780px;
}
.my-empty-state strong {
    display: block;
    font-size: 1.02rem;
}
.my-empty-state p {
    margin: 5px 0 0;
    color: var(--muted);
    line-height: 1.5;
}
.my-empty-actions {
    display: flex;
    flex: 0 0 auto;
    gap: 9px;
}
.my-inline-notice {
    display: grid;
    gap: 3px;
    padding: 15px 17px;
    border-radius: 15px;
    background: var(--accent-soft);
}
.my-inline-notice span {
    color: var(--muted);
}
.my-inline-notice.is-warning {
    background: #fff3d8;
}
.my-dashboard-loading {
    min-height: 70px;
}
.my-overview-section .dashboard-toolbar {
    margin-top: 18px;
}
.my-overview-section .dashboard-section {
    margin-top: 25px;
}
.my-overview-section .dashboard-room-grid {
    align-items: start;
}
.my-overview-section .dashboard-room-card {
    min-height: 0;
}
.my-overview-section .dashboard-empty {
    min-height: 0;
}

.my-access-backup {
    margin: 18px 0;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: var(--surface-soft, #f7faf7);
}
.my-access-backup > summary {
    padding: 15px 17px;
    color: var(--accent-dark);
    font-weight: 750;
    cursor: pointer;
}
.my-access-backup > div {
    padding: 0 17px 17px;
}
.my-access-backup p {
    margin-top: 0;
    color: var(--muted);
}
.my-backup-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.my-overview-section .participant-tool-grid {
    margin-top: 18px;
}
.my-overview-section .connected-device-list {
    margin-top: 22px;
}
.my-overview-section .watch-device-note {
    margin-top: 17px;
}
.my-overview-section .participant-security-details {
    margin-top: 17px;
}
.my-overview-section .device-sync-overview {
    margin-bottom: 0;
}

@media (max-width: 900px) {
    .my-overview-page {
        width: min(100% - 24px, 1500px);
        padding-top: 20px;
    }
    .my-overview-hero {
        align-items: flex-start;
        flex-direction: column;
    }
    .my-overview-nav {
        position: static;
    }
    .my-section-heading,
    .my-section-actions {
        align-items: flex-start;
        flex-direction: column;
    }
}
@media (max-width: 680px) {
    .my-overview-page {
        width: min(100% - 16px, 1500px);
    }
    .my-overview-nav {
        grid-template-columns: 1fr;
    }
    .my-overview-nav a {
        padding: 9px 11px;
    }
    .my-overview-section {
        padding: 20px 16px;
        border-radius: 23px;
    }
    .my-empty-state,
    .my-empty-actions {
        align-items: stretch;
        flex-direction: column;
    }
    .my-empty-actions .button,
    .my-empty-state > .button {
        width: 100%;
    }
}


/* Version 0.11.2: verständliche Teilfehler im persönlichen Bereich */
.my-personal-area-error {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.my-personal-area-error > div {
    display: grid;
    gap: 4px;
}
.device-count.is-warning {
    background: #fff3d8;
    color: #7a570c;
}
.connected-device-unavailable {
    display: grid;
    gap: 4px;
    padding: 15px 17px;
    border: 1px dashed #d9bd79;
    border-radius: 15px;
    background: #fff8e7;
}
.connected-device-unavailable span {
    color: var(--muted);
}
@media (max-width: 700px) {
    .my-personal-area-error {
        align-items: stretch;
        flex-direction: column;
    }
    .my-personal-area-error .button {
        width: 100%;
    }
}


/* Version 0.11.4: ein gemeinsamer persönlicher Einstieg */
.home-hero-actions-unified {
    justify-content: center;
}
.home-hero-actions-unified .button {
    min-width: 250px;
}
@media (max-width: 640px) {
    .home-hero-actions-unified .button {
        width: 100%;
        min-width: 0;
    }
}


/* Version 0.12.0: Testreife, klare Abschlüsse und direkte Rückmeldung */
.test-feedback-trigger {
    position: fixed;
    right: max(16px, env(safe-area-inset-right));
    bottom: max(16px, env(safe-area-inset-bottom));
    z-index: 40;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 13px 10px 10px;
    border: 1px solid rgba(12, 52, 56, .16);
    border-radius: 999px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 12px 32px rgba(12, 52, 56, .14);
    color: var(--accent-dark);
    text-decoration: none;
    backdrop-filter: blur(14px);
}
.test-feedback-trigger span {
    display: inline-flex;
    width: 27px;
    height: 27px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--accent-soft);
    font-weight: 850;
}
.test-feedback-trigger strong {
    font-size: .82rem;
}
.test-feedback-trigger:hover {
    transform: translateY(-1px);
    border-color: var(--accent);
}

.feedback-category-grid-test {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.feedback-context-card {
    display: grid;
    gap: 5px;
    margin-top: 18px;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: var(--surface-soft, #f7faf7);
}
.feedback-context-card > div {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
}
.feedback-context-card span,
.feedback-context-card small {
    color: var(--muted);
    font-size: .8rem;
}
form[data-submitting="1"] {
    cursor: progress;
}
form[data-submitting="1"] button[type="submit"] {
    opacity: .72;
}

.publication-ready-page {
    max-width: 1180px;
}
.publication-ready-page .confirmation-lead {
    max-width: 760px;
    margin-inline: auto;
}
.publication-next-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin: 28px 0 22px;
    text-align: left;
}
.publication-next-card {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 14px;
    align-items: start;
    padding: 20px;
    border: 1px solid var(--line);
    border-radius: 21px;
    background: var(--surface);
}
.publication-next-card.is-primary {
    border-color: rgba(57, 211, 158, .55);
    background: linear-gradient(145deg, #f7fffb, var(--accent-soft));
}
.publication-next-card > .button,
.publication-next-card > .text-link {
    grid-column: 2;
    justify-self: start;
}
.publication-next-card p {
    margin: 5px 0 0;
    color: var(--muted);
}
.publication-step-number {
    display: inline-flex;
    width: 34px;
    height: 34px;
    align-items: center;
    justify-content: center;
    border-radius: 11px;
    background: var(--accent-soft);
    color: var(--accent-dark);
    font-weight: 850;
}
.publication-status-list {
    display: grid;
    gap: 5px;
    margin: 9px 0 0;
    padding: 0;
    list-style: none;
}
.publication-status-list li {
    position: relative;
    padding-left: 20px;
    color: var(--muted);
    font-size: .84rem;
}
.publication-status-list li::before {
    content: "○";
    position: absolute;
    left: 0;
    color: var(--muted);
}
.publication-status-list li.is-ok::before {
    content: "✓";
    color: var(--accent-dark);
    font-weight: 850;
}
.publication-status-list li.is-open::before {
    content: "·";
}
.publication-primary-actions {
    display: flex;
    justify-content: center;
    gap: 11px;
    margin: 20px 0;
}
.publication-links {
    margin: 20px 0;
    border: 1px solid var(--line);
    border-radius: 19px;
    background: var(--surface-soft, #f7faf7);
    text-align: left;
}
.publication-links > summary {
    padding: 16px 18px;
    color: var(--accent-dark);
    font-weight: 760;
    cursor: pointer;
}
.publication-links-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 13px;
    padding: 0 18px 18px;
}
.publication-links-content .share-card {
    margin: 0;
}

.publish-check-card {
    display: grid;
    gap: 12px;
    margin: 18px 0;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface-soft, #f7faf7);
}
.publish-check-card > div {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.publish-check-card > div span {
    padding: 7px 9px;
    border-radius: 999px;
    background: var(--surface);
    color: var(--muted);
    font-size: .78rem;
}
.publish-check-card > div b {
    color: var(--text);
}
.publish-check-card small {
    color: var(--muted);
    line-height: 1.4;
}

.admin-access-status {
    display: grid;
    grid-template-columns: minmax(220px, .8fr) minmax(520px, 1.8fr) auto;
    gap: 22px;
    align-items: center;
    margin: 18px 0;
    padding: 18px 20px;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: var(--surface-soft, #f7faf7);
}
.admin-access-status h2 {
    margin: 4px 0 0;
    font-size: 1.18rem;
}
.admin-access-status ul {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 9px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.admin-access-status li {
    display: grid;
    gap: 3px;
    padding: 10px 12px;
    border-radius: 13px;
    background: var(--surface);
}
.admin-access-status li strong {
    font-size: .82rem;
}
.admin-access-status li span {
    color: var(--muted);
    font-size: .75rem;
}
.admin-access-status li.is-ok {
    box-shadow: inset 3px 0 0 var(--accent);
}
.admin-access-status li.is-open {
    box-shadow: inset 3px 0 0 #d9bd79;
}
.action-meaning-guide {
    margin: 18px 0;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface-soft, #f7faf7);
}
.action-meaning-guide summary {
    padding: 14px 16px;
    color: var(--accent-dark);
    font-weight: 750;
    cursor: pointer;
}
.action-meaning-guide > div {
    display: grid;
    gap: 8px;
    padding: 0 16px 16px;
}
.action-meaning-guide p {
    margin: 0;
    color: var(--muted);
}
.action-meaning-guide strong {
    color: var(--text);
}

.test-readiness-card {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 18px;
    align-items: center;
    margin: 18px 0 24px;
    padding: 22px;
    border: 1px solid #d9bd79;
    border-radius: 23px;
    background: #fff8e7;
}
.test-readiness-card.is-ready {
    border-color: rgba(57, 211, 158, .48);
    background: #edf9f3;
}
.test-readiness-icon {
    display: inline-flex;
    width: 46px;
    height: 46px;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    background: #fff1c9;
    color: #805b0c;
    font-size: 1.2rem;
    font-weight: 850;
}
.test-readiness-card.is-ready .test-readiness-icon {
    background: #d9f2e7;
    color: #11604a;
}
.test-readiness-card h2 {
    margin: 4px 0 5px;
}
.test-readiness-card p {
    margin: 0;
    color: var(--muted);
}
.test-readiness-card > strong {
    align-self: start;
    padding: 7px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,.7);
    font-size: .76rem;
}
.test-readiness-blockers {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
}
.test-readiness-blockers span {
    padding: 6px 8px;
    border-radius: 999px;
    background: rgba(255,255,255,.8);
    color: #74530e;
    font-size: .75rem;
    font-weight: 690;
}
.test-readiness-success {
    margin-top: 8px !important;
    color: #245f4c !important;
}

@media (max-width: 940px) {
    .admin-access-status {
        grid-template-columns: 1fr;
    }
    .admin-access-status ul {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 760px) {
    .publication-next-grid,
    .publication-links-content,
    .feedback-category-grid-test {
        grid-template-columns: 1fr;
    }
    .publication-primary-actions {
        align-items: stretch;
        flex-direction: column;
    }
    .publication-primary-actions .button {
        width: 100%;
    }
    .feedback-context-card > div {
        align-items: flex-start;
        flex-direction: column;
    }
    .test-readiness-card {
        grid-template-columns: 1fr;
    }
    .test-readiness-card > strong {
        justify-self: start;
    }
}
@media (max-width: 560px) {
    .test-feedback-trigger {
        right: 10px;
        bottom: 10px;
    }
    .test-feedback-trigger strong {
        display: none;
    }
    .test-feedback-trigger {
        padding: 8px;
    }
}


/* Version 0.12.1: mobile Aufgabenkarten mit verständlichem Abschluss */
.task-editor-heading-copy {
    display: grid;
    min-width: 0;
    gap: 2px;
}
.task-editor-index {
    color: var(--muted);
    font-size: .72rem;
    font-weight: 760;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.task-editor-heading-copy > strong {
    overflow-wrap: anywhere;
    font-size: 1.08rem;
    line-height: 1.25;
}
.task-editor-heading-copy > small {
    color: var(--muted);
    line-height: 1.4;
}
.task-edit-action {
    display: none;
}
.task-editor.is-collapsed .task-edit-action {
    display: inline-flex;
}
.task-editor.is-collapsed .option-card-action-copy,
.task-editor.is-collapsed .option-card-action-delete {
    display: none;
}
.task-editor-complete {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    padding: 0 0 22px;
}
.task-editor-complete small {
    max-width: 430px;
    color: var(--muted);
    font-size: .8rem;
    line-height: 1.4;
}
.task-editor-complete .button {
    flex: 0 0 auto;
}
.task-editor.is-collapsed .option-editor-head {
    align-items: center;
    background: linear-gradient(145deg, var(--surface-soft, #f7faf7), var(--surface));
}
.preview-summary .clean-list {
    display: grid;
    gap: 8px;
    padding: 0;
    list-style: none;
}
.preview-summary .clean-list li {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    padding: 9px 0;
    border-bottom: 1px solid var(--line);
}
.preview-summary .clean-list li > span {
    min-width: 0;
    overflow-wrap: anywhere;
}
.preview-summary .clean-list li > strong {
    flex: 0 0 auto;
    white-space: nowrap;
}

@media (max-width: 700px) {
    .task-editor .option-editor-head {
        gap: 12px;
    }
    .task-editor-heading-copy {
        flex: 1 1 auto;
    }
    .task-editor:not(.is-collapsed) .option-editor-actions {
        justify-content: flex-end;
    }
    .task-editor.is-collapsed .option-editor-actions {
        width: auto;
        flex: 0 0 auto;
    }
    .task-editor.is-collapsed .task-edit-action {
        flex: 0 0 auto;
    }
    .task-editor-complete {
        align-items: stretch;
        flex-direction: column-reverse;
        padding-bottom: 18px;
        text-align: left;
    }
    .task-editor-complete .button {
        width: 100%;
    }
    .task-editor-complete small {
        max-width: none;
    }
}


/* Version 0.12.2: mobile Schritt- und Verwaltungsnavigation */
@media (max-width: 520px) {
    .stepper {
        overflow: visible;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        max-width: none;
        padding-bottom: 0;
    }
    .stepper span {
        min-width: 0;
        display: grid;
        grid-template-columns: 24px minmax(0, 1fr);
        align-items: center;
        gap: 10px;
        padding: 10px 12px;
        border: 1px solid var(--line);
        border-radius: 14px;
        background: rgba(255,255,255,.86);
        box-shadow: none;
        font-size: .78rem;
        line-height: 1.25;
    }
    .stepper span.active {
        border-color: rgba(23,109,82,.22);
        background: #fff;
        box-shadow: 0 6px 18px rgba(11,43,34,.05);
    }
    .stepper span.done {
        border-color: rgba(23,109,82,.12);
        background: #f5faf7;
    }
    .stepper i {
        width: 24px;
        height: 24px;
        font-size: .72rem;
    }

    .admin-section-nav {
        position: static;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        overflow: visible;
        gap: 8px;
        margin: 10px 0 18px;
        padding: 10px;
    }
    .admin-section-nav a {
        min-width: 0;
        padding: 11px 10px;
        text-align: center;
        line-height: 1.25;
        white-space: normal;
        background: rgba(255,255,255,.72);
    }
}