:root {
    --bg: #f5f8f4;
    --surface: #ffffff;
    --surface-soft: #edf5ef;
    --text: #173226;
    --muted: #60736a;
    --line: #dce7df;
    --primary: #1f7654;
    --primary-dark: #15563d;
    --accent: #f0a24a;
    --danger: #a43c3c;
    --shadow: 0 18px 45px rgba(22, 61, 43, 0.09);
    --radius: 20px;
    --border-color: var(--line);
    color-scheme: light;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background: var(--bg);
    color: var(--text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.55;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, select { font: inherit; }
button { cursor: pointer; }

.shell { width: min(1180px, calc(100% - 32px)); margin: 0 auto; }
.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: rgba(245, 248, 244, 0.92);
    backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(220, 231, 223, 0.85);
}
.header-inner { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 11px; font-weight: 800; font-size: 1.08rem; }
.brand-mark {
    width: 38px; height: 38px; border-radius: 13px; display: grid; place-items: center;
    color: white; background: var(--primary); box-shadow: 0 8px 22px rgba(31, 118, 84, .25);
}
.main-nav { display: flex; align-items: center; gap: 22px; color: var(--muted); font-weight: 650; }
.main-nav a:hover, .link-button:hover { color: var(--primary); }
.main-nav form { margin: 0; }
.link-button { border: 0; background: transparent; color: var(--muted); padding: 0; font-weight: 650; }
.nav-toggle { display: none; border: 1px solid var(--line); background: var(--surface); border-radius: 10px; padding: 8px 12px; }

.main-content { min-height: calc(100vh - 150px); padding-top: 42px; padding-bottom: 70px; }
.site-footer { border-top: 1px solid var(--line); color: var(--muted); background: var(--surface); }
.footer-inner { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 20px; font-size: .9rem; }

h1, h2, h3 { line-height: 1.12; margin-top: 0; letter-spacing: -.025em; }
h1 { font-size: clamp(2.05rem, 5vw, 4.25rem); margin-bottom: 18px; }
h2 { font-size: clamp(1.45rem, 2.4vw, 2.25rem); margin-bottom: 12px; }
h3 { font-size: 1.12rem; margin-bottom: 8px; }
p { margin-top: 0; }
.lead { color: var(--muted); font-size: clamp(1.05rem, 1.8vw, 1.25rem); max-width: 720px; }
.muted { color: var(--muted); }
.eyebrow { color: var(--primary); font-weight: 800; letter-spacing: .12em; text-transform: uppercase; font-size: .75rem; margin-bottom: 10px; }
.hint { margin: -2px 0 4px; color: var(--muted); font-size: .9rem; }

.panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 28px; }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(330px, .85fr); gap: 44px; align-items: center; padding: 28px 0 44px; }
.plan-form-panel h2 { margin-bottom: 20px; }
.stack-form { display: grid; gap: 17px; }
.stack-form label, .filter-bar label { display: grid; gap: 7px; font-weight: 700; font-size: .94rem; }
input, select {
    width: 100%; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); color: var(--text);
    padding: 12px 13px; outline: none; transition: border-color .2s, box-shadow .2s;
}
input:focus, select:focus { border-color: var(--primary); box-shadow: 0 0 0 4px rgba(31, 118, 84, .12); }
.form-grid-two { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

.button {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 43px;
    border-radius: 12px; border: 1px solid transparent; padding: 10px 16px; font-weight: 780;
    transition: transform .15s, background .2s, border-color .2s;
}
.button:hover { transform: translateY(-1px); }
.button-primary { background: var(--primary); color: white; }
.button-primary:hover { background: var(--primary-dark); }
.button-secondary { background: var(--surface); border-color: var(--line); color: var(--text); }
.button-secondary:hover { border-color: var(--primary); color: var(--primary); }
.button-selected { background: var(--surface-soft); border-color: var(--primary); color: var(--primary-dark); }
.button-ghost { background: transparent; border-color: var(--line); color: var(--muted); }
.button-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }

.stats-row { display: flex; gap: 36px; margin-top: 30px; flex-wrap: wrap; }
.stats-row div { display: grid; }
.stats-row strong { font-size: 1.65rem; }
.stats-row span { color: var(--muted); font-size: .86rem; }

.section-block { padding-top: 46px; }
.section-heading, .split-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 22px; }
.section-heading.compact { align-items: center; }
.section-heading h2 { margin: 0; }
.text-link { color: var(--primary); font-weight: 750; }
.page-heading { margin-bottom: 30px; }
.page-heading h1 { font-size: clamp(2rem, 4.3vw, 3.5rem); margin-bottom: 12px; }

.flash { border-radius: 13px; padding: 13px 16px; margin-bottom: 20px; border: 1px solid var(--line); background: var(--surface); }
.flash-success { border-color: #aad7bd; background: #effaf3; }
.flash-warning { border-color: #e9ca8d; background: #fff8e9; }
.flash-error { border-color: #efb2b2; background: #fff0f0; color: var(--danger); }

.login-wrap { min-height: 68vh; display: grid; place-items: center; }
.login-panel { width: min(460px, 100%); }
.login-panel h1 { font-size: 2.5rem; }

.history-list { display: grid; gap: 12px; }
.history-item {
    background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: 18px 20px;
    display: flex; align-items: center; justify-content: space-between; gap: 20px;
    transition: border-color .2s, transform .2s;
}
.history-item:hover { border-color: var(--primary); transform: translateY(-1px); }
.history-item div { display: grid; gap: 3px; }
.history-item span, .history-item small { color: var(--muted); }
.history-list.detailed .history-item small { margin-top: 7px; max-width: 850px; }
.history-arrow { font-size: 1.4rem; color: var(--primary) !important; }

.empty-state { border: 1px dashed #b8c9bd; background: rgba(255,255,255,.64); border-radius: var(--radius); padding: 34px; color: var(--muted); text-align: center; }
.error-state { max-width: 760px; margin: 70px auto; }
.error-state h1 { color: var(--danger); font-size: 2.2rem; }

.day-section { margin: 38px 0 52px; scroll-margin-top: 95px; }
.day-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 17px; }
.day-heading > div { display: flex; align-items: center; gap: 14px; }
.day-heading h2 { margin: 0 0 2px; }
.day-heading p { margin: 0; color: var(--muted); }
.day-badge { width: 49px; height: 49px; border-radius: 16px; display: grid; place-items: center; background: var(--primary); color: white; font-weight: 850; }
.scroll-hint { color: var(--muted); font-size: .88rem; }
.recipe-scroller { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(290px, 31%); gap: 16px; overflow-x: auto; padding: 4px 4px 18px; scroll-snap-type: x proximity; scrollbar-color: #a8bdb0 transparent; }
.recipe-scroller .recipe-card { scroll-snap-align: start; }

.recipe-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 19px; }
.recipe-card { background: var(--surface); border: 1px solid var(--line); border-radius: 18px; overflow: hidden; display: flex; flex-direction: column; min-width: 0; transition: transform .2s, border-color .2s, box-shadow .2s; }
.recipe-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.recipe-card.is-selected { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(31,118,84,.12); }
.recipe-image-link { aspect-ratio: 16/9; overflow: hidden; background: var(--surface-soft); }
.recipe-image { width: 100%; height: 100%; object-fit: cover; transition: transform .35s; }
.recipe-card:hover .recipe-image { transform: scale(1.025); }
.recipe-card-body { padding: 17px; display: flex; flex-direction: column; flex: 1; }
.recipe-card-body h3 a:hover { color: var(--primary); }
.recipe-card-body p { color: var(--muted); font-size: .91rem; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.card-actions { margin-top: auto; display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.card-actions form:first-child { flex: 1; }
.card-actions form:first-child .button { width: 100%; font-size: .87rem; }
.icon-button { width: 43px; height: 43px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface); color: #9ba9a1; font-size: 1.35rem; }
.icon-button.is-favorite { color: #c44652; background: #fff1f2; border-color: #f1c4c8; }
.chip-row { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 11px; }
.chip { display: inline-flex; align-items: center; min-height: 25px; border-radius: 999px; padding: 4px 9px; background: #f1f4f2; color: var(--muted); font-size: .72rem; font-weight: 800; }
.chip-health { background: #e8f6ed; color: #246747; }
.chip-meat { background: #fff0e7; color: #9a5229; }
.chip-translation-pending { background: #fff8df; color: #76530a; border-color: #ead58b; }
.chip-veg { background: #eaf7f0; color: #246747; }

.sticky-plan-bar { position: sticky; bottom: 16px; z-index: 30; background: rgba(23,50,38,.94); color: white; border-radius: 18px; padding: 13px 14px 13px 20px; display: flex; align-items: center; justify-content: space-between; gap: 18px; box-shadow: 0 18px 45px rgba(18,45,32,.25); }

.shopping-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.shopping-group { background: var(--surface); border: 1px solid var(--line); border-radius: 18px; overflow: hidden; }
.shopping-group-heading { display: flex; justify-content: space-between; gap: 18px; align-items: center; padding: 18px 20px; background: var(--surface-soft); border-bottom: 1px solid var(--line); }
.shopping-group-heading h2 { margin: 0; font-size: 1.15rem; }
.shopping-group-heading span { color: var(--muted); font-size: .85rem; }
.shopping-items { display: grid; }
.shopping-item + .shopping-item { border-top: 1px solid var(--line); }
.check-button { width: 100%; border: 0; background: transparent; display: grid; grid-template-columns: 28px 1fr auto; align-items: center; gap: 10px; padding: 14px 18px; text-align: left; color: var(--text); }
.check-button:hover { background: #fafcfb; }
.fake-check { width: 23px; height: 23px; border-radius: 7px; border: 2px solid #a9bbb0; display: grid; place-items: center; color: white; font-size: .85rem; }
.shopping-item.is-checked .fake-check { background: var(--primary); border-color: var(--primary); }
.shopping-item.is-checked .shopping-name { text-decoration: line-through; color: #8a9a91; }
.shopping-item.is-checked strong { color: #8a9a91; }

.filter-bar { display: grid; grid-template-columns: 1fr 190px auto; gap: 12px; margin-bottom: 24px; }
.filter-bar-extended { grid-template-columns: minmax(220px, 2fr) repeat(4, minmax(145px, 1fr)) auto; align-items: end; }
@media (max-width: 1100px) and (min-width: 721px) {
    .filter-bar-extended { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .filter-bar-extended button { width: 100%; }
}
.pagination { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 30px; color: var(--muted); }

.recipe-detail-hero { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 42px; align-items: center; margin-bottom: 42px; }
.recipe-detail-hero > img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 24px; border: 1px solid var(--line); background: var(--surface-soft); }
.recipe-detail-hero h1 { font-size: clamp(2.2rem, 4.7vw, 4rem); }
.nutrition-row { display: flex; gap: 13px; flex-wrap: wrap; margin: 24px 0; }
.nutrition-row div { min-width: 105px; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 12px; display: grid; }
.nutrition-row strong { font-size: 1.18rem; }
.nutrition-row span { color: var(--muted); font-size: .76rem; }
.recipe-content-grid { display: grid; grid-template-columns: minmax(300px, .78fr) minmax(0, 1.22fr); gap: 28px; align-items: start; }
.ingredients-panel { position: sticky; top: 94px; }
.servings-control { display: flex; align-items: center; gap: 8px; font-size: .85rem; color: var(--muted); }
.servings-control input { width: 76px; padding: 7px 9px; }
.ingredient-list { list-style: none; padding: 0; margin: 20px 0 0; display: grid; }
.ingredient-list li { display: flex; justify-content: space-between; gap: 18px; padding: 11px 0; border-bottom: 1px solid var(--line); }
.ingredient-list li:last-child { border-bottom: 0; }
.steps-panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 30px; }
.steps-list { list-style: none; padding: 0; margin: 25px 0 0; display: grid; gap: 22px; }
.steps-list li { display: grid; grid-template-columns: 42px 1fr; gap: 14px; align-items: start; }
.steps-list p { margin: 4px 0 0; }
.step-number { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 13px; background: var(--primary); color: white; font-weight: 850; }
.source-box { margin-top: 25px; background: #fff9ec; border: 1px solid #ecd9aa; border-radius: 15px; padding: 16px 18px; display: flex; gap: 10px 18px; flex-wrap: wrap; color: #67583a; font-size: .9rem; }
.source-box a { text-decoration: underline; }

@media (max-width: 930px) {
    .hero-grid, .recipe-detail-hero, .recipe-content-grid { grid-template-columns: 1fr; }
    .recipe-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .recipe-scroller { grid-auto-columns: minmax(285px, 54%); }
    .ingredients-panel { position: static; }
    .shopping-grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
    .shell { width: min(100% - 22px, 1180px); }
    .main-content { padding-top: 26px; }
    .nav-toggle { display: inline-flex; }
    .main-nav { display: none; position: absolute; left: 11px; right: 11px; top: 66px; background: var(--surface); border: 1px solid var(--line); border-radius: 15px; box-shadow: var(--shadow); padding: 16px; flex-direction: column; align-items: stretch; gap: 14px; }
    .main-nav.is-open { display: flex; }
    .main-nav form, .main-nav .link-button { width: 100%; text-align: left; }
    .hero-grid { padding-top: 10px; gap: 25px; }
    .form-grid-two, .filter-bar, .recipe-grid { grid-template-columns: 1fr; }
    .stats-row { gap: 22px; }
    .section-heading, .split-heading, .day-heading, .sticky-plan-bar, .footer-inner { align-items: flex-start; flex-direction: column; }
    .recipe-scroller { grid-auto-columns: 87%; }
    .scroll-hint { display: none; }
    .sticky-plan-bar { bottom: 8px; padding: 14px; }
    .sticky-plan-bar .button { width: 100%; }
    .recipe-detail-hero { gap: 24px; }
    .recipe-detail-hero h1 { font-size: 2.45rem; }
    .panel, .steps-panel { padding: 21px; }
    .button-row { width: 100%; }
    .button-row > * { flex: 1; }
}

/* Zugang, Anmeldung und Personalisierung */
textarea {
    width: 100%; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); color: var(--text);
    padding: 12px 13px; outline: none; resize: vertical; font: inherit; min-height: 120px;
}
textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 4px rgba(31, 118, 84, .12); }
.button-large { min-height: 50px; }
.site-header-minimal .header-inner { justify-content: center; }
.auth-screen {
    min-height: calc(100vh - 235px); display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, 480px);
    align-items: stretch; gap: 28px; max-width: 1040px; margin: 0 auto;
}
.auth-visual {
    min-height: 580px; border-radius: 28px; padding: 34px; display: flex; align-items: flex-end;
    background:
        radial-gradient(circle at 20% 18%, rgba(255,255,255,.9), transparent 29%),
        radial-gradient(circle at 78% 34%, rgba(240,162,74,.32), transparent 28%),
        linear-gradient(145deg, #dff2e5 0%, #9fd4b6 52%, #287657 100%);
    box-shadow: var(--shadow); overflow: hidden; position: relative;
}
.auth-visual::before, .auth-visual::after {
    content: ""; position: absolute; border-radius: 999px; background: rgba(255,255,255,.16);
}
.auth-visual::before { width: 260px; height: 260px; right: -90px; top: 42px; }
.auth-visual::after { width: 180px; height: 180px; left: -55px; bottom: 80px; }
.auth-visual-card {
    position: relative; z-index: 1; width: min(390px, 100%); color: white; padding: 24px;
    border: 1px solid rgba(255,255,255,.28); border-radius: 22px; background: rgba(16,67,47,.42);
    backdrop-filter: blur(12px); display: grid; gap: 7px;
}
.auth-visual-card strong { font-size: 1.55rem; }
.auth-visual-card span:last-child { color: rgba(255,255,255,.86); }
.auth-icon { font-size: 2.3rem; margin-bottom: 5px; }
.auth-panel { align-self: center; padding: 34px; }
.auth-panel h1 { font-size: clamp(2.2rem, 5vw, 3.35rem); margin-bottom: 12px; }
.auth-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 5px; margin-bottom: 28px; border-radius: 13px; background: var(--surface-soft); }
.auth-tabs a { padding: 9px 12px; text-align: center; border-radius: 9px; color: var(--muted); font-weight: 800; }
.auth-tabs a.is-active { color: var(--primary-dark); background: var(--surface); box-shadow: 0 4px 14px rgba(23,50,38,.08); }
.auth-note, .auth-switch { color: var(--muted); font-size: .88rem; margin: 18px 0 0; }
.auth-switch a { color: var(--primary); font-weight: 800; }
.settings-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .55fr); gap: 24px; align-items: start; }
.settings-info { position: sticky; top: 94px; }
.check-row { display: grid !important; grid-template-columns: 24px 1fr; align-items: start; gap: 10px !important; font-weight: 600 !important; }
.check-row input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--primary); }
.inline-settings-link { display: inline-block; margin-top: -2px; font-size: .9rem; }
.chip-photo { background: #eef0ff; color: #4b56a0; }

@media (max-width: 850px) {
    .auth-screen { grid-template-columns: 1fr; min-height: auto; }
    .auth-visual { min-height: 230px; order: 2; }
    .auth-panel { order: 1; width: 100%; }
    .settings-grid { grid-template-columns: 1fr; }
    .settings-info { position: static; }
}

@media (max-width: 520px) {
    input, select, textarea { font-size: 16px; }
    .main-content { padding-bottom: calc(55px + env(safe-area-inset-bottom)); }
    .auth-screen { gap: 16px; }
    .auth-panel { padding: 22px 18px; border-radius: 18px; }
    .auth-visual { min-height: 185px; padding: 18px; border-radius: 18px; }
    .auth-visual-card { padding: 17px; }
    .auth-visual-card strong { font-size: 1.25rem; }
    .auth-panel h1 { font-size: 2.15rem; }
    .recipe-scroller { grid-auto-columns: 91%; gap: 12px; }
    .shopping-group-heading, .check-button { padding-left: 14px; padding-right: 14px; }
    .site-footer-minimal { display: none; }
}

.pantry-panel { min-height: 320px; }
.pantry-list { display: grid; margin-top: 18px; }
.pantry-item { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.pantry-item:last-child { border-bottom: 0; }
.pantry-item > div { display: grid; gap: 2px; }
.pantry-item span { color: var(--muted); font-size: .9rem; }
.button-small { min-height: 36px; padding: 7px 10px; font-size: .82rem; }
.compact-empty { margin-top: 18px; padding: 22px; }
@media (max-width: 520px) {
    .pantry-item { align-items: flex-start; }
}

.recipe-source { margin: -.2rem 0 .65rem; font-size: .82rem; color: var(--muted); }

/* Mobile-first Verfeinerungen und installierbare Web-App */
.main-nav a.is-active { color: var(--primary-dark); position: relative; }
.main-nav a.is-active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -9px; height: 3px; border-radius: 999px; background: var(--primary); }
.mobile-nav { display: none; }
.scroll-tools { display: flex; align-items: center; gap: 8px; }
.scroll-button {
    width: 40px; height: 40px; display: inline-grid; place-items: center; border-radius: 12px;
    border: 1px solid var(--line); background: var(--surface); color: var(--primary-dark);
    font-size: 1.45rem; line-height: 1; box-shadow: 0 5px 16px rgba(22,61,43,.06);
}
.scroll-button:hover { border-color: var(--primary); }
.recipe-scroller {
    scroll-snap-type: x mandatory; scroll-padding-inline: 4px; overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch; touch-action: pan-x pan-y;
}
.recipe-card { content-visibility: auto; contain-intrinsic-size: 430px; }
.recipe-image { background: var(--surface-soft); }
.button, .icon-button, .check-button, .nav-toggle, .scroll-button { -webkit-tap-highlight-color: transparent; }
.button:focus-visible, .icon-button:focus-visible, .check-button:focus-visible, .nav-toggle:focus-visible,
.scroll-button:focus-visible, .main-nav a:focus-visible, .mobile-nav a:focus-visible,
.mobile-nav button:focus-visible, .recipe-scroller:focus-visible {
    outline: 3px solid rgba(31,118,84,.28); outline-offset: 3px;
}

@media (max-width: 720px) {
    body { padding-bottom: calc(74px + env(safe-area-inset-bottom)); }
    .site-header { padding-top: env(safe-area-inset-top); }
    .header-inner { min-height: 62px; }
    .brand-mark { width: 35px; height: 35px; border-radius: 11px; }
    .brand { font-size: 1rem; }
    .nav-toggle { min-height: 44px; padding-inline: 14px; font-weight: 750; }
    .main-nav { top: calc(62px + env(safe-area-inset-top)); max-height: calc(100dvh - 90px); overflow-y: auto; }
    .main-nav a, .main-nav .link-button { min-height: 44px; display: flex; align-items: center; padding: 8px 6px; }
    .main-nav a.is-active::after { display: none; }

    .main-content { padding-top: 22px; padding-bottom: 34px; }
    .site-footer { display: none; }
    .page-heading { margin-bottom: 22px; }
    .page-heading h1 { font-size: clamp(2rem, 10vw, 2.75rem); }
    .panel { border-radius: 17px; box-shadow: 0 10px 28px rgba(22,61,43,.07); }
    .button { min-height: 46px; }
    .button:hover, .recipe-card:hover, .history-item:hover { transform: none; }

    .mobile-nav {
        position: fixed; display: grid; grid-template-columns: repeat(6, 1fr); left: 0; right: 0; bottom: 0;
        z-index: 80; padding: 7px 7px calc(7px + env(safe-area-inset-bottom));
        border-top: 1px solid rgba(220,231,223,.95); background: rgba(255,255,255,.96);
        backdrop-filter: blur(16px); box-shadow: 0 -10px 30px rgba(22,61,43,.08);
    }
    .mobile-nav a {
        min-width: 0; min-height: 54px; border-radius: 13px; display: grid; place-items: center; align-content: center;
        gap: 1px; color: var(--muted); font-weight: 750;
    }
    .mobile-nav a span { font-size: 1.25rem; line-height: 1; }
    .mobile-nav a small { max-width: 100%; overflow: hidden; text-overflow: ellipsis; font-size: .68rem; }
    .mobile-nav a.is-active { color: var(--primary-dark); background: var(--surface-soft); }

    .filter-bar {
        position: sticky; top: calc(63px + env(safe-area-inset-top)); z-index: 20; margin-inline: -4px;
        padding: 10px; border: 1px solid var(--line); border-radius: 16px; background: rgba(245,248,244,.96);
        backdrop-filter: blur(12px); box-shadow: 0 7px 22px rgba(22,61,43,.06);
    }
    .filter-bar input, .filter-bar select, .filter-bar button { min-height: 46px; }

    .day-section { margin: 30px 0 42px; }
    .day-heading { gap: 12px; margin-bottom: 13px; }
    .day-heading > div { width: 100%; align-items: flex-start; }
    .day-badge { width: 44px; height: 44px; border-radius: 14px; flex: 0 0 auto; }
    .scroll-tools { width: 100%; justify-content: flex-end; }
    .scroll-hint { display: inline; margin-right: auto; }
    .scroll-button { width: 44px; height: 44px; }
    .recipe-scroller { margin-inline: -11px; padding: 4px 11px 16px; grid-auto-columns: minmax(278px, 88%); gap: 12px; }
    .recipe-card-body { padding: 15px; }
    .recipe-card-body p { -webkit-line-clamp: 2; }
    .card-actions { align-items: stretch; }
    .icon-button { width: 46px; height: 46px; flex: 0 0 46px; }

    .sticky-plan-bar {
        position: fixed; left: 11px; right: 11px; bottom: calc(72px + env(safe-area-inset-bottom));
        width: auto; max-width: none; border-radius: 16px; box-shadow: 0 12px 34px rgba(18,45,32,.3);
    }
    .sticky-plan-bar span { font-size: .84rem; }

    .recipe-detail-hero > img { border-radius: 18px; aspect-ratio: 16/10; }
    .recipe-detail-hero h1 { font-size: clamp(2rem, 10vw, 2.65rem); }
    .nutrition-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    .nutrition-row div { min-width: 0; padding: 10px; }
    .ingredients-panel .section-heading { flex-direction: row; align-items: center; }
    .ingredient-list li { align-items: flex-start; gap: 10px; }
    .ingredient-list strong { text-align: right; flex: 0 0 auto; }
    .steps-list { gap: 18px; }
    .steps-list li { grid-template-columns: 36px minmax(0, 1fr); gap: 11px; }
    .step-number { width: 34px; height: 34px; border-radius: 11px; }
    .source-box { overflow-wrap: anywhere; }

    .shopping-group { border-radius: 16px; }
    .check-button { min-height: 54px; grid-template-columns: 28px minmax(0, 1fr) auto; }
    .shopping-name { overflow-wrap: anywhere; }
    .history-item { align-items: flex-start; padding: 16px; }
}

@media (max-width: 430px) {
    .shell { width: min(100% - 18px, 1180px); }
    .brand span:last-child { display: none; }
    .recipe-scroller { margin-inline: -9px; padding-inline: 9px; grid-auto-columns: 92%; }
    .scroll-hint { font-size: .76rem; }
    .chip-photo { display: none; }
    .nutrition-row strong { font-size: 1.02rem; }
    .nutrition-row span { font-size: .67rem; }
    .mobile-nav { padding-inline: 4px; }
    .mobile-nav a small { font-size: .63rem; }
    .auth-visual { display: none; }
    .auth-panel { padding: 22px 16px; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* Produktivbetrieb, Wartung und persoenliche Rezeptdaten */
textarea {
    width: 100%; min-height: 110px; resize: vertical; border: 1px solid var(--line); border-radius: 12px;
    background: var(--surface); color: var(--text); padding: 12px 13px; outline: none; font: inherit;
    transition: border-color .2s, box-shadow .2s;
}
textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 4px rgba(31, 118, 84, .12); }
.recipe-personal { margin-top: 30px; }
.personal-recipe-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(250px, .8fr); gap: 24px; align-items: stretch; }
.cooked-card { border: 1px solid var(--line); border-radius: 16px; padding: 24px; background: var(--surface-soft); display: flex; flex-direction: column; align-items: flex-start; }
.cooked-card > span { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 14px; background: var(--primary); color: white; font-size: 1.45rem; font-weight: 900; margin-bottom: 18px; }
.cooked-card p { color: var(--muted); flex: 1; }
.status-pill { display: inline-flex; align-items: center; min-height: 38px; border-radius: 999px; padding: 8px 14px; font-weight: 800; }
.status-ok { background: #e8f6ed; color: #246747; }
.status-degraded { background: #fff0e7; color: #9a5229; }
.system-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.system-card { min-width: 0; }
.health-list, .compact-list { display: grid; gap: 0; margin-top: 16px; }
.health-row, .compact-list > div { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.health-row:last-child, .compact-list > div:last-child { border-bottom: 0; }
.health-row > span:last-child, .compact-list span { color: var(--muted); font-size: .86rem; }
.compact-list > div { grid-template-columns: 1fr auto; }
.health-dot { width: 11px; height: 11px; border-radius: 50%; background: var(--danger); box-shadow: 0 0 0 4px rgba(164,60,60,.1); }
.health-dot.is-ok { background: var(--primary); box-shadow: 0 0 0 4px rgba(31,118,84,.12); }
.metric-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin-top: 16px; }
.metric-grid div { min-width: 0; padding: 12px 8px; border-radius: 13px; text-align: center; background: var(--surface-soft); }
.metric-grid strong { display: block; font-size: 1.35rem; }
.metric-grid span { display: block; overflow: hidden; text-overflow: ellipsis; color: var(--muted); font-size: .72rem; }
.system-actions { margin-top: 18px; }
.system-maintenance { margin-top: 30px; }
.maintenance-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 20px; }
.maintenance-action { display: flex; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid var(--line); border-radius: 15px; padding: 15px; background: var(--surface-soft); }
.maintenance-action > div { display: grid; gap: 3px; }
.maintenance-action span { color: var(--muted); font-size: .84rem; }
.table-wrap { overflow-x: auto; padding: 0; }
.system-table { width: 100%; border-collapse: collapse; min-width: 840px; }
.system-table th, .system-table td { padding: 13px 15px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: top; }
.system-table th { color: var(--muted); font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; background: var(--surface-soft); }
.job-status { display: inline-flex; border-radius: 999px; padding: 4px 8px; font-size: .72rem; font-weight: 800; background: #eef1ef; }
.job-succeeded { background: #e8f6ed; color: #246747; }
.job-running { background: #eef0ff; color: #4b56a0; }
.job-retry, .job-pending { background: #fff8e9; color: #8a651c; }
.job-dead { background: #fff0f0; color: var(--danger); }
.job-error { max-width: 330px; overflow-wrap: anywhere; color: var(--danger); font-size: .82rem; }

@media (max-width: 850px) {
    .personal-recipe-grid, .system-grid { grid-template-columns: 1fr; }
    .maintenance-actions { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
    .recipe-personal { padding: 20px 16px; }
    .recipe-personal .section-heading { align-items: flex-start; flex-direction: column; }
    .metric-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .maintenance-action { align-items: flex-start; flex-direction: column; }
    .maintenance-action .button { width: 100%; }
}

@media print {
    .site-header, .site-footer, .mobile-nav, .page-heading .button-row, .flash { display: none !important; }
    body { padding: 0 !important; background: white; color: black; }
    .shell { width: 100%; }
    .main-content { padding: 0; }
    .shopping-grid { display: block; }
    .shopping-group { break-inside: avoid; margin-bottom: 16px; box-shadow: none; }
    .shopping-item.is-checked { opacity: .45; }
}
.recent-cooked-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.recent-cooked-card { display: grid; grid-template-columns: 82px minmax(0, 1fr); gap: 14px; align-items: center; padding: 12px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
.recent-cooked-card:hover { border-color: var(--primary); }
.recent-cooked-card img { width: 82px; height: 68px; object-fit: cover; border-radius: 12px; }
.recent-cooked-card div { min-width: 0; display: grid; gap: 4px; }
.recent-cooked-card strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.recent-cooked-card span { color: var(--muted); font-size: .8rem; }
@media (max-width: 850px) { .recent-cooked-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .recent-cooked-grid { grid-template-columns: 1fr; } }


/* Erweiterte Planverwaltung, Worker und mobile Performance */
.button-danger { background: var(--danger); color: #fff; border-color: var(--danger); }
.button-danger:hover { filter: brightness(.95); }
.danger-zone { margin-top: 28px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-color: rgba(164,60,60,.25); }
.danger-zone > div { display: grid; gap: 4px; }
.danger-zone span { color: var(--muted); font-size: .9rem; }
.settings-links { display: grid; gap: 10px; margin-top: 22px; }
.recipe-primary-actions { margin-top: 16px; }
.worker-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 18px; }
.worker-card { display: grid; gap: 5px; padding: 15px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-soft); min-width: 0; }
.worker-card span { color: var(--muted); font-size: .82rem; overflow-wrap: anywhere; }
.recipe-image { aspect-ratio: 4 / 3; }
.recipe-detail-hero > img { aspect-ratio: 4 / 3; }
@media (max-width: 850px) {
    .worker-grid { grid-template-columns: 1fr 1fr; }
    .danger-zone { align-items: stretch; flex-direction: column; }
    .danger-zone form, .danger-zone .button { width: 100%; }
}
@media (max-width: 520px) {
    .worker-grid { grid-template-columns: 1fr; }
    .scroll-tools { align-items: stretch; flex-wrap: wrap; }
    .scroll-tools form { width: 100%; }
    .scroll-tools form .button { width: 100%; }
    .recipe-primary-actions { align-items: stretch; flex-direction: column; }
    .recipe-primary-actions form, .recipe-primary-actions .button { width: 100%; }
}

.plan-adjustment { margin: 18px 0 24px; display: flex; align-items: end; justify-content: space-between; gap: 22px; }
.plan-adjustment h2 { margin-bottom: 4px; }
.inline-control-form { display: flex; align-items: end; gap: 12px; }
.inline-control-form label { min-width: 120px; }
.inline-control-form input { width: 120px; }
.account-security { margin-top: 24px; display: grid; grid-template-columns: minmax(220px, .7fr) minmax(280px, 1fr); gap: 28px; align-items: start; }
.account-password-form { max-width: 560px; width: 100%; }
@media (max-width: 720px) {
    .plan-adjustment, .inline-control-form { align-items: stretch; flex-direction: column; }
    .inline-control-form, .inline-control-form label, .inline-control-form input, .inline-control-form .button { width: 100%; }
    .account-security { grid-template-columns: 1fr; }
}


/* 2.5: eigene Einkaufsartikel und kompakte mobile Eingabe */
.custom-shopping-panel { display: grid; grid-template-columns: minmax(220px, .75fr) minmax(0, 1.65fr); gap: 24px; align-items: end; margin-bottom: 24px; }
.custom-shopping-panel h2 { margin: 0 0 6px; }
.custom-shopping-form { display: grid; grid-template-columns: minmax(160px, 2fr) minmax(90px, .75fr) minmax(100px, .85fr) minmax(160px, 1.25fr) auto; gap: 10px; align-items: end; }
.custom-shopping-form label { display: grid; gap: 6px; font-size: .86rem; font-weight: 700; }
.shopping-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: stretch; }
.shopping-item > form:first-child { min-width: 0; }
.shopping-item .shopping-name { display: grid; gap: 2px; }
.shopping-item .shopping-name small { color: var(--muted); font-size: .72rem; font-weight: 600; text-decoration: none; }
.shopping-delete { width: 46px; height: 100%; border: 0; border-left: 1px solid var(--line); background: transparent; color: var(--danger); font-size: 1.45rem; cursor: pointer; }
.shopping-delete:hover, .shopping-delete:focus-visible { background: #fff0f0; }
.shopping-item.is-checked .shopping-name small { color: #8a9a91; }
@media (max-width: 980px) {
    .custom-shopping-panel { grid-template-columns: 1fr; align-items: stretch; }
    .custom-shopping-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .custom-shopping-form .button { width: 100%; }
}
@media (max-width: 560px) {
    .custom-shopping-form { grid-template-columns: 1fr 1fr; }
    .custom-shopping-form label:first-of-type, .custom-shopping-form label:nth-of-type(4), .custom-shopping-form .button { grid-column: 1 / -1; }
}
@media print {
    .custom-shopping-panel, .shopping-delete { display: none !important; }
}
.plan-copy-panel { display: grid; grid-template-columns: minmax(240px, 1fr) minmax(0, 1.2fr); gap: 24px; align-items: end; margin-bottom: 28px; }
.plan-copy-panel h2 { margin: 0 0 6px; }
@media (max-width: 760px) { .plan-copy-panel { grid-template-columns: 1fr; align-items: stretch; } }

/* 2.5: Accessibility, Verbindungsstatus und sichere Formulare */
.skip-link { position: fixed; left: 12px; top: 10px; z-index: 1000; transform: translateY(-160%); background: var(--text); color: #fff; padding: 10px 14px; border-radius: 10px; font-weight: 800; }
.skip-link:focus { transform: translateY(0); }
.network-status { position: fixed; z-index: 1000; left: 50%; top: 12px; transform: translateX(-50%); width: min(620px, calc(100% - 24px)); border: 1px solid #a9d6bd; background: #effaf3; color: var(--primary-dark); border-radius: 12px; padding: 10px 14px; text-align: center; box-shadow: var(--shadow); font-size: .9rem; font-weight: 750; }
.network-status.is-offline { border-color: #e2b66e; background: #fff7e7; color: #73501e; }
button[aria-busy="true"], input[aria-busy="true"] { opacity: .7; cursor: wait; transform: none !important; }
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* 2.6: Allergene, Vorratspriorität und mobiler Kochmodus */
.allergen-fieldset { border: 1px solid var(--line); border-radius: 16px; padding: 16px; display: grid; gap: 12px; }
.allergen-fieldset legend { padding: 0 8px; font-weight: 850; }
.allergen-option-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 14px; }
.chip-allergen { background: #fff4de; color: #75501a; border-color: #efd39c; }
.allergen-summary { margin: 22px 0; display: grid; grid-template-columns: minmax(210px, .8fr) minmax(0, 1fr); align-items: center; gap: 18px; }
.allergen-summary h2 { margin: 0; }
.allergen-summary .muted { grid-column: 1 / -1; margin: 0; }
.allergen-chip-list { display: flex; flex-wrap: wrap; gap: 8px; }

.cook-mode[hidden] { display: none !important; }
.cook-mode { position: fixed; inset: 0; z-index: 2000; display: grid; place-items: center; padding: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); background: rgba(20, 28, 24, .82); backdrop-filter: blur(12px); }
.cook-mode-active { overflow: hidden; }
.cook-mode-shell { width: min(860px, 100%); max-height: 100%; overflow: auto; border-radius: 24px; background: var(--surface); box-shadow: 0 28px 90px rgba(0,0,0,.35); display: grid; grid-template-rows: auto auto minmax(240px, 1fr) auto auto; }
.cook-mode-header, .cook-mode-footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 24px; }
.cook-mode-header { border-bottom: 1px solid var(--line); }
.cook-mode-header h2 { margin: 0; }
.cook-mode-close { font-size: 1.7rem; }
.cook-mode-progress { width: 100%; height: 7px; border: 0; background: var(--surface-soft); overflow: hidden; }
.cook-mode-content { padding: clamp(24px, 6vw, 64px); display: grid; align-items: center; }
.cook-step { display: grid; gap: 18px; }
.cook-step > span { color: var(--primary); font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.cook-step p { margin: 0; font-size: clamp(1.35rem, 3.2vw, 2.15rem); line-height: 1.45; font-weight: 700; }
.cook-timer { margin: 0 24px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 16px; display: grid; grid-template-columns: minmax(180px, 1fr) auto auto; gap: 12px; align-items: end; background: var(--surface-soft); }
.cook-timer label { display: grid; gap: 6px; font-weight: 750; }
.cook-timer input { max-width: 160px; }
.cook-timer strong { min-width: 92px; text-align: center; font-size: 1.8rem; font-variant-numeric: tabular-nums; }
.cook-mode-footer { border-top: 1px solid var(--line); }
.cook-mode-footer .button { min-width: 140px; }
@media (max-width: 720px) {
    .allergen-option-grid { grid-template-columns: 1fr; }
    .allergen-summary { grid-template-columns: 1fr; }
    .allergen-summary .muted { grid-column: auto; }
    .cook-mode { padding: 0; place-items: stretch; }
    .cook-mode-shell { width: 100%; height: 100%; max-height: none; border-radius: 0; grid-template-rows: auto auto 1fr auto auto; }
    .cook-mode-header, .cook-mode-footer { padding: 16px; padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right)); }
    .cook-mode-header { padding-top: max(16px, env(safe-area-inset-top)); }
    .cook-mode-footer { padding-bottom: max(16px, env(safe-area-inset-bottom)); }
    .cook-mode-content { padding: 26px 18px; }
    .cook-timer { margin: 0 16px; grid-template-columns: 1fr 1fr; }
    .cook-timer strong { grid-column: 1 / -1; text-align: left; }
    .cook-mode-footer .button { min-width: 0; flex: 1; }
}

.system-health-metrics { margin-top: 18px; }

/* 2.7: flexible Tagesportionen, Vorratsfristen und Bestandsuebernahme */
.settings-subgroup { border: 1px solid var(--line); border-radius: 16px; padding: 16px; display: grid; gap: 12px; }
.settings-subgroup legend { padding: 0 8px; font-weight: 850; }
.settings-subgroup .muted { margin: 0; font-size: .86rem; }
.pantry-alert-panel { margin: 0 0 28px; display: flex; align-items: center; justify-content: space-between; gap: 22px; border-color: #efd39c; background: #fffaf0; }
.pantry-alert-panel h2 { margin-bottom: 6px; }
.pantry-alert-panel p:last-child { margin-bottom: 0; }
.day-settings-row { margin: 0 0 14px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-soft); display: grid; grid-template-columns: minmax(180px, .55fr) minmax(0, 1.45fr); gap: 16px; align-items: center; }
.day-settings-summary { min-width: 0; display: grid; gap: 3px; }
.day-settings-summary span { overflow-wrap: anywhere; font-size: .86rem; }
.day-settings-details summary, .pantry-edit-details summary { color: var(--primary); font-weight: 800; cursor: pointer; }
.day-settings-form { margin-top: 12px; display: grid; grid-template-columns: minmax(180px, .55fr) minmax(220px, 1.2fr) auto; gap: 10px; align-items: end; }
.day-settings-form label { display: grid; gap: 6px; font-size: .84rem; font-weight: 750; }
.pantry-layout { grid-template-columns: minmax(260px, .7fr) minmax(0, 1.5fr); align-items: start; }
.pantry-add-form { position: sticky; top: 96px; }
.pantry-list-extended { gap: 12px; }
.pantry-card { border: 1px solid var(--line); border-radius: 16px; padding: 15px; background: var(--surface); display: grid; gap: 13px; }
.pantry-card.is-expiring { border-color: #e5bf78; background: #fffaf0; }
.pantry-card.is-expired { border-color: rgba(164,60,60,.4); background: #fff5f5; }
.pantry-card.is-low:not(.is-expired) { box-shadow: inset 4px 0 0 #d69a33; }
.pantry-card-main { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.pantry-card-main > div:first-child { display: grid; gap: 3px; }
.pantry-card-main > div:first-child span { color: var(--muted); }
.pantry-status-row { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.status-chip { display: inline-flex; align-items: center; min-height: 28px; padding: 4px 9px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface-soft); color: var(--muted); font-size: .72rem; font-weight: 800; }
.status-warning { border-color: #e5bf78; background: #fff4dc; color: #7a551c; }
.status-danger { border-color: #e7b0b0; background: #fff0f0; color: var(--danger); }
.pantry-quick-actions { display: flex; align-items: end; justify-content: space-between; gap: 12px; }
.pantry-consume-form { display: flex; align-items: end; gap: 8px; }
.pantry-consume-form label { display: grid; gap: 5px; font-size: .78rem; font-weight: 750; }
.pantry-consume-form input { width: 110px; }
.pantry-edit-details { border-top: 1px solid var(--line); padding-top: 10px; }
.pantry-edit-form { margin-top: 12px; display: grid; grid-template-columns: repeat(3, minmax(120px, 1fr)) auto; gap: 9px; align-items: end; }
.pantry-edit-form label { display: grid; gap: 5px; font-size: .78rem; font-weight: 750; }
@media (max-width: 900px) {
    .pantry-layout { grid-template-columns: 1fr; }
    .pantry-add-form { position: static; }
    .day-settings-row { grid-template-columns: 1fr; }
    .day-settings-form { grid-template-columns: 1fr 1fr; }
    .day-settings-form .button { grid-column: 1 / -1; width: 100%; }
    .pantry-edit-form { grid-template-columns: 1fr 1fr; }
    .pantry-edit-form .button { grid-column: 1 / -1; width: 100%; }
}
@media (max-width: 560px) {
    .pantry-alert-panel, .pantry-card-main, .pantry-quick-actions { align-items: stretch; flex-direction: column; }
    .pantry-alert-panel .button, .pantry-quick-actions > form:last-child .button { width: 100%; }
    .pantry-status-row { justify-content: flex-start; }
    .day-settings-form, .pantry-edit-form { grid-template-columns: 1fr; }
    .day-settings-form .button, .pantry-edit-form .button { grid-column: auto; }
    .pantry-consume-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
    .pantry-consume-form label, .pantry-consume-form input { width: 100%; }
}
@media print {
    .day-settings-row, .pantry-alert-panel { display: none !important; }
}
.system-health-metrics { grid-template-columns: repeat(6, minmax(0, 1fr)); }
@media (max-width: 900px) { .system-health-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 520px) { .system-health-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.shopping-day-summary { margin-bottom: 20px; display: grid; grid-template-columns: minmax(180px, .55fr) minmax(0, 1.45fr); gap: 20px; align-items: center; }
.shopping-day-summary h2 { margin-bottom: 0; }
.shopping-day-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.shopping-day-chips span { display: inline-grid; gap: 1px; min-width: 108px; padding: 9px 11px; border-radius: 12px; background: var(--surface-soft); color: var(--muted); font-size: .76rem; }
.shopping-day-chips strong { color: var(--text); font-size: .82rem; }
@media (max-width: 720px) { .shopping-day-summary { grid-template-columns: 1fr; } }
@media print { .shopping-day-summary { display: block !important; } .shopping-day-chips { margin-top: 10px; } }

/* 2.8: Resteverwertung, Nährwertübersicht und Einkaufslisten-Komfort */
.leftover-capture { border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; background: var(--surface-soft); }
.leftover-capture summary { color: var(--primary); font-weight: 800; cursor: pointer; }
.leftover-capture[open] summary { margin-bottom: 12px; }
.leftover-capture label { font-size: .82rem; }
.leftovers-stats { margin: 0 0 30px; padding: 18px 20px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); }
.leftover-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.leftover-card { overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: 0 8px 24px rgba(22,61,43,.06); }
.leftover-card.is-expiring { border-color: #e5bf78; }
.leftover-card.is-expired { border-color: #e7b0b0; }
.leftover-image { display: block; aspect-ratio: 16 / 10; background: var(--surface-soft); overflow: hidden; }
.leftover-image img { width: 100%; height: 100%; object-fit: cover; }
.leftover-card-body { padding: 16px; display: grid; gap: 10px; }
.leftover-card-body h3 { margin: 0; }
.leftover-card-body p { margin: 0; }
.leftover-actions { margin-top: 4px; }
.leftovers-history { margin-top: 34px; }
.leftover-history-list { display: grid; margin-top: 16px; }
.leftover-history-list article { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 13px 0; border-top: 1px solid var(--line); }
.leftover-history-list article > div:first-child { display: grid; gap: 3px; }
.leftover-history-list span { color: var(--muted); font-size: .84rem; }
.dashboard-leftover-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.dashboard-leftover-card { display: grid; grid-template-columns: 84px minmax(0, 1fr); align-items: center; gap: 12px; padding: 10px; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); }
.dashboard-leftover-card img { width: 84px; height: 68px; object-fit: cover; border-radius: 11px; background: var(--surface-soft); }
.dashboard-leftover-card div { min-width: 0; display: grid; gap: 3px; }
.dashboard-leftover-card strong, .dashboard-leftover-card span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-leftover-card span { color: var(--muted); font-size: .8rem; }
.plan-nutrition-panel { margin-bottom: 26px; display: grid; grid-template-columns: minmax(220px, .7fr) minmax(0, 1.3fr); align-items: center; gap: 22px; }
.plan-nutrition-panel h2 { margin-bottom: 5px; }
.plan-nutrition-row { margin: 0; justify-content: flex-end; }
.pantry-restock-panel { margin-bottom: 24px; display: flex; align-items: end; justify-content: space-between; gap: 22px; border-color: #b9dbc8; background: #f5fcf7; }
.pantry-restock-panel h2 { margin-bottom: 5px; }
.shopping-group-heading > div:first-child { display: grid; gap: 2px; }
.shopping-category-actions { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; justify-content: flex-end; }
.shopping-category-actions .button { min-height: 32px; padding: 5px 8px; font-size: .72rem; }

@media (max-width: 980px) {
    .leftover-grid, .dashboard-leftover-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .plan-nutrition-panel { grid-template-columns: 1fr; }
    .plan-nutrition-row { justify-content: flex-start; }
}
@media (max-width: 720px) {
    .mobile-nav { grid-template-columns: repeat(6, 1fr); }
    .leftover-grid, .dashboard-leftover-grid { grid-template-columns: 1fr; }
    .leftover-history-list article, .pantry-restock-panel { align-items: stretch; flex-direction: column; }
    .pantry-restock-panel .inline-control-form { width: 100%; grid-template-columns: 1fr; }
    .shopping-group-heading { align-items: flex-start; flex-direction: column; }
    .shopping-category-actions { width: 100%; justify-content: flex-start; }
}
@media (max-width: 420px) {
    .mobile-nav a small { font-size: .58rem; }
    .dashboard-leftover-card { grid-template-columns: 70px minmax(0, 1fr); }
    .dashboard-leftover-card img { width: 70px; height: 60px; }
    .leftover-actions { display: grid; grid-template-columns: 1fr 1fr; }
    .leftover-actions form, .leftover-actions .button { width: 100%; }
}
@media print {
    .leftovers-history, .shopping-category-actions, .pantry-restock-panel { display: none !important; }
}

/* 2.9: Sammlungen, Tagesstatus, Fortschritt und Exporte */
.plan-progress-panel { margin-bottom: 24px; display: grid; gap: 12px; }
.plan-progress-copy { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.plan-progress-copy h2 { margin-bottom: 0; }
.plan-progress-copy > strong { font-size: 1.7rem; color: var(--primary); }
.plan-progress-track { width: 100%; height: 12px; overflow: hidden; border-radius: 999px; background: var(--surface-soft); border: 1px solid var(--line); }
.meal-status-badge { display: inline-flex; width: fit-content; align-items: center; min-height: 27px; padding: 4px 9px; border-radius: 999px; font-size: .72rem; font-weight: 850; border: 1px solid var(--line); background: var(--surface-soft); color: var(--muted); }
.meal-status-cooked { border-color: #9fcdb5; background: #eef9f2; color: #1f6849; }
.meal-status-skipped { border-color: #d6c7b5; background: #f7f3ee; color: #725d47; }
.day-status-actions { margin: 0 0 14px; display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.day-status-actions > span { color: var(--muted); font-size: .8rem; font-weight: 800; }
.day-status-actions form { margin: 0; }
.status-button { min-height: 34px; padding: 6px 11px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); color: var(--muted); font: inherit; font-size: .76rem; font-weight: 800; cursor: pointer; }
.status-button:hover, .status-button:focus-visible { border-color: var(--primary); color: var(--primary); }
.status-button.is-active { background: var(--primary); border-color: var(--primary); color: white; }
.status-button-skipped.is-active { background: #725d47; border-color: #725d47; }
.day-status-skipped .recipe-scroller { opacity: .62; }
.day-status-skipped .day-settings-row { border-style: dashed; }
.shopping-day-chips span.is-skipped { text-decoration: line-through; opacity: .65; }

.today-meal-panel { margin: 0 0 28px; display: grid; grid-template-columns: minmax(180px, 300px) minmax(0, 1fr); gap: 24px; align-items: center; overflow: hidden; }
.today-meal-image { display: block; border-radius: 16px; overflow: hidden; aspect-ratio: 16 / 10; background: var(--surface-soft); }
.today-meal-image img { width: 100%; height: 100%; object-fit: cover; }
.today-meal-panel h2 { margin-bottom: 8px; }
.today-meal-panel h2 a { color: inherit; }
.today-status-cooked { border-color: #9fcdb5; background: #f7fcf9; }
.today-status-skipped { border-color: #d6c7b5; background: #fbf9f6; }

.collection-create-panel { margin-bottom: 28px; display: grid; grid-template-columns: minmax(220px, .7fr) minmax(0, 1.3fr); gap: 24px; align-items: end; }
.collection-create-panel h2 { margin-bottom: 5px; }
.collection-create-form { display: grid; grid-template-columns: minmax(150px, .65fr) minmax(220px, 1.35fr) auto; gap: 10px; align-items: end; }
.collection-create-form label { display: grid; gap: 6px; font-size: .82rem; font-weight: 800; }
.collection-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.collection-card { min-height: 150px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 20px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: 0 8px 24px rgba(22,61,43,.05); }
.collection-card:hover { border-color: #9fcdb5; transform: translateY(-1px); }
.collection-card h2 { margin: 0 0 6px; color: var(--text); }
.collection-card p { margin: 0 0 8px; color: var(--muted); }
.collection-card span { color: var(--muted); font-size: .82rem; }
.collection-card-icon { width: 48px; height: 48px; border-radius: 15px; display: grid; place-items: center; background: var(--surface-soft); color: var(--primary) !important; font-size: 1.35rem !important; }
.collection-recipe-item { min-width: 0; }
.collection-recipe-item .recipe-card { height: auto; }
.collection-note { margin: 10px 4px 6px; padding: 10px 12px; border-left: 3px solid var(--primary); background: var(--surface-soft); border-radius: 0 10px 10px 0; }
.danger-link { color: var(--danger); }
.recipe-collections-panel { margin-top: 28px; }
.collection-picker-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.collection-picker-grid form { margin: 0; }
.collection-picker { width: 100%; min-height: 62px; display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 9px; align-items: center; text-align: left; padding: 10px 12px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); color: var(--text); font: inherit; font-weight: 800; cursor: pointer; }
.collection-picker span { grid-row: 1 / 3; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 10px; background: var(--surface-soft); color: var(--primary); }
.collection-picker small { color: var(--muted); font-size: .7rem; font-weight: 650; }
.collection-picker:hover, .collection-picker:focus-visible { border-color: var(--primary); }
.collection-picker.is-selected { border-color: #9fcdb5; background: #f2faf5; }

@media (max-width: 900px) {
    .collection-create-panel { grid-template-columns: 1fr; }
    .collection-create-form { grid-template-columns: 1fr 1fr; }
    .collection-create-form .button { grid-column: 1 / -1; width: 100%; }
    .collection-picker-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
    .mobile-nav { grid-template-columns: repeat(7, 1fr); }
    .today-meal-panel { grid-template-columns: 1fr; padding: 14px; gap: 16px; }
    .today-meal-image { max-height: 230px; }
    .collection-grid { grid-template-columns: 1fr; }
    .plan-progress-copy { align-items: flex-start; }
}
@media (max-width: 560px) {
    .collection-create-form, .collection-picker-grid { grid-template-columns: 1fr; }
    .collection-create-form .button { grid-column: auto; }
    .day-status-actions { display: grid; grid-template-columns: repeat(3, 1fr); }
    .day-status-actions > span { grid-column: 1 / -1; }
    .day-status-actions form, .status-button { width: 100%; }
    .plan-progress-copy > strong { font-size: 1.4rem; }
}
@media (max-width: 420px) {
    .mobile-nav a small { font-size: .52rem; }
    .mobile-nav a span { font-size: 1.05rem; }
}
@media print {
    .day-status-actions, .plan-progress-panel, .recipe-collections-panel, .collection-create-panel { display: none !important; }
}


/* v2.9 collection editing and history progress */
.collection-edit-panel { margin-bottom: 1.25rem; }
.collection-edit-panel summary { cursor: pointer; font-weight: 750; }
.collection-edit-panel[open] summary { margin-bottom: 1rem; }
.history-item-content { min-width: 0; flex: 1; }
.history-status-row { display: flex; flex-wrap: wrap; gap: .45rem .8rem; margin: .45rem 0; color: var(--muted); font-size: .88rem; }
.mini-progress { display: block; width: min(28rem, 100%); height: .42rem; border: 0; border-radius: 999px; overflow: hidden; background: color-mix(in srgb, var(--border) 75%, transparent); margin: .35rem 0 .55rem; }
@media (max-width: 640px) {
  .history-item-progress { align-items: flex-start; }
  .history-status-row { gap: .35rem .65rem; }
}

/* 3.0: Wochenvorlagen, Benachrichtigungen und Import-Transparenz */
.header-notification {
    position: relative; margin-left: auto; width: 42px; height: 42px; flex: 0 0 42px;
    display: grid; place-items: center; border: 1px solid var(--line); border-radius: 13px;
    background: var(--surface); color: var(--primary-dark); font-size: 1.35rem;
}
.header-notification:hover, .header-notification.is-active { border-color: var(--primary); background: var(--surface-soft); }
.header-notification strong {
    position: absolute; top: -6px; right: -6px; min-width: 21px; height: 21px; padding: 0 5px;
    display: grid; place-items: center; border-radius: 999px; background: var(--danger); color: white;
    border: 2px solid var(--bg); font-size: .66rem; line-height: 1;
}
@media (min-width: 721px) {
    .main-nav { gap: 14px; font-size: .88rem; }
}
.dashboard-quick-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: -12px 0 30px; }
.quick-link-card {
    min-width: 0; display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 13px; align-items: center;
    padding: 15px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface);
    box-shadow: 0 8px 24px rgba(22,61,43,.05); transition: border-color .2s, transform .2s;
}
.quick-link-card:hover { border-color: var(--primary); transform: translateY(-1px); }
.quick-link-card > span { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; background: var(--surface-soft); color: var(--primary); font-size: 1.35rem; }
.quick-link-card div { min-width: 0; display: grid; gap: 2px; }
.quick-link-card small { color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.notification-list { display: grid; gap: 13px; }
.notification-card { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 15px; padding: 20px; box-shadow: none; }
.notification-card.is-unread { border-color: #9dcbb4; box-shadow: 0 8px 24px rgba(22,61,43,.07); }
.notification-card.is-read { opacity: .72; }
.notification-card.severity-warning { border-left: 5px solid #d59b32; }
.notification-card.severity-error { border-left: 5px solid var(--danger); }
.notification-card.severity-success { border-left: 5px solid var(--primary); }
.notification-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; background: var(--surface-soft); font-weight: 900; color: var(--primary-dark); }
.severity-warning .notification-icon { background: #fff5df; color: #8a5b09; }
.severity-error .notification-icon { background: #fff0f0; color: var(--danger); }
.notification-copy { min-width: 0; }
.notification-copy h2 { margin-bottom: 4px; font-size: 1.15rem; }
.notification-copy p { margin: 0; color: var(--muted); }
.notification-copy time { color: var(--muted); font-size: .78rem; white-space: nowrap; }
.notification-copy .button-row { margin-top: 13px; }

.template-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.template-card { display: grid; align-content: start; gap: 15px; box-shadow: 0 10px 30px rgba(22,61,43,.06); }
.template-card .section-heading { align-items: flex-start; }
.template-recipes { min-height: 3.1em; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.template-apply-form { display: grid; grid-template-columns: minmax(150px, 1fr) 120px auto; align-items: end; gap: 10px; padding: 14px; background: var(--surface-soft); border-radius: 15px; }
.template-apply-form label, .template-save-form label { display: grid; gap: 6px; font-size: .82rem; font-weight: 750; }
.template-edit { border-top: 1px solid var(--line); padding-top: 12px; }
.template-edit summary { cursor: pointer; color: var(--primary); font-weight: 800; }
.template-edit[open] summary { margin-bottom: 14px; }
.template-edit form + form { margin-top: 10px; }
.plan-template-panel { margin: 0 0 26px; display: grid; grid-template-columns: minmax(250px, .75fr) minmax(0, 1.25fr); gap: 22px; align-items: end; }
.template-save-form { grid-template-columns: minmax(180px, 1fr) minmax(220px, 1.3fr) auto; }
.source-stats-table td:first-child { max-width: 240px; overflow-wrap: anywhere; }

@media (max-width: 980px) {
    .template-grid { grid-template-columns: 1fr; }
    .plan-template-panel { grid-template-columns: 1fr; align-items: stretch; }
    .template-save-form { grid-template-columns: 1fr 1fr; }
    .template-save-form .button { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
    .header-notification { margin-left: auto; width: 44px; height: 44px; flex-basis: 44px; }
    .dashboard-quick-links { grid-template-columns: 1fr; margin-top: 0; }
    .quick-link-card { grid-template-columns: 44px minmax(0, 1fr); }
    .quick-link-card > span { width: 44px; height: 44px; }
    .notification-card { grid-template-columns: 38px minmax(0, 1fr); padding: 16px; gap: 11px; }
    .notification-icon { width: 36px; height: 36px; border-radius: 11px; }
    .notification-copy .section-heading { gap: 6px; }
    .notification-copy time { white-space: normal; }
    .template-apply-form, .template-save-form { grid-template-columns: 1fr; }
    .template-save-form .button { grid-column: auto; }
    .template-card { padding: 20px; }
}
@media print {
    .dashboard-quick-links, .notification-list .button-row, .plan-template-panel { display: none !important; }
}

/* 3.1: sichere Freigaben, Vorbereitung und Einkaufsanpassungen */
.share-create-form { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(160px, .7fr) auto; gap: 14px; align-items: end; }
.share-create-form label, .shopping-edit-form label { display: grid; gap: 6px; font-size: .84rem; font-weight: 750; }
.share-created-panel { border-color: #8fc7ac; background: linear-gradient(135deg, var(--surface), #effaf4); }
.share-copy-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; margin: 14px 0; }
.share-copy-row input { min-width: 0; }
.share-list { display: grid; gap: 11px; }
.share-row { display: flex; justify-content: space-between; gap: 18px; align-items: center; padding: 15px; border: 1px solid var(--line); border-radius: 15px; background: var(--surface-soft); }
.share-row > div { min-width: 0; display: grid; gap: 3px; }
.share-row span, .share-row small { color: var(--muted); }
.share-row.is-expired { opacity: .62; }
.shared-page-heading { text-align: center; max-width: 780px; margin-inline: auto; }
.shared-plan-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-bottom: 28px; }
.shared-day-card { overflow: hidden; display: grid; grid-template-columns: 180px minmax(0, 1fr); border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: 0 9px 28px rgba(22,61,43,.06); }
.shared-day-card > img { width: 100%; height: 100%; min-height: 170px; object-fit: cover; }
.shared-day-card > div { padding: 18px; }
.shared-day-card h2 { margin: 2px 0 8px; }
.shared-day-card.is-skipped { opacity: .7; }
.shared-note { padding: 9px 11px; border-radius: 11px; background: var(--surface-soft); }
.shared-shopping-panel { margin-top: 24px; }
.shared-shopping-item { width: 100%; display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 13px 14px; }
.shared-privacy-note { max-width: 780px; margin: 24px auto; text-align: center; color: var(--muted); font-size: .86rem; }
.prep-grid { display: grid; gap: 22px; }
.prep-day { break-inside: avoid; }
.prep-day-heading { display: grid; grid-template-columns: minmax(0, 1fr) 180px; gap: 18px; align-items: center; margin-bottom: 18px; }
.prep-day-heading img { width: 180px; height: 120px; border-radius: 14px; object-fit: cover; }
.prep-columns { display: grid; grid-template-columns: minmax(220px, .75fr) minmax(0, 1.25fr); gap: 26px; }
.prep-ingredient-list, .prep-step-list { margin: 0; padding-left: 1.25rem; }
.prep-ingredient-list li, .prep-step-list li { margin-bottom: .6rem; }
.shopping-item-edit { grid-column: 1 / -1; width: 100%; margin: 0 12px 11px 52px; padding-top: 8px; border-top: 1px dashed var(--line); }
.shopping-item-edit summary { cursor: pointer; width: fit-content; color: var(--primary); font-size: .78rem; font-weight: 800; }
.shopping-item-edit[open] summary { margin-bottom: 9px; }
.shopping-edit-form { display: grid; grid-template-columns: 110px 110px minmax(180px, 1fr) auto; gap: 9px; align-items: end; }
.shopping-note-field { min-width: 0; }
.manual-adjustment-note { display: inline-block; margin-top: 6px; color: var(--muted); }
@media (max-width: 860px) {
    .share-create-form, .shopping-edit-form { grid-template-columns: 1fr 1fr; }
    .share-create-form .button, .shopping-edit-form .button, .shopping-note-field { grid-column: 1 / -1; }
    .shared-plan-grid { grid-template-columns: 1fr; }
    .prep-columns { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
    .share-create-form, .shopping-edit-form, .share-copy-row { grid-template-columns: 1fr; }
    .share-row { align-items: flex-start; flex-direction: column; }
    .shared-day-card { grid-template-columns: 1fr; }
    .shared-day-card > img { height: 210px; min-height: 0; }
    .prep-day-heading { grid-template-columns: 1fr; }
    .prep-day-heading img { width: 100%; height: 190px; }
    .shopping-item-edit { margin-left: 12px; }
}
@media print {
    .site-header, .site-footer, .mobile-nav, .page-heading .button-row, .shopping-item-edit, .shared-privacy-note { display: none !important; }
    .prep-day, .shared-day-card, .shared-shopping-panel { box-shadow: none !important; }
    .prep-columns { grid-template-columns: 38% 62%; }
}

/* Haushalt und gemeinsame Planung */
.household-layout {
    display: grid;
    grid-template-columns: minmax(280px, .8fr) minmax(0, 1.5fr);
    gap: 1.25rem;
    align-items: start;
}
.household-members {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}
.household-card {
    display: grid;
    gap: 1rem;
}
.household-card.is-muted {
    opacity: .68;
}
.household-card-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .75rem;
    align-items: end;
}
.household-active {
    min-height: 2.75rem;
    align-self: end;
}
.compact-fieldset {
    padding: .85rem;
}
.details-grid {
    margin-top: .85rem;
}
.day-household-fieldset {
    grid-column: 1 / -1;
    border: 1px solid var(--border-color, #d8e2dc);
    border-radius: .9rem;
    padding: .9rem;
}
.household-choice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem;
    margin: .75rem 0;
}
.household-choice {
    border: 1px solid var(--border-color, #d8e2dc);
    border-radius: .75rem;
    padding: .65rem .75rem;
    background: rgba(255, 255, 255, .5);
}
.household-choice:has(input:checked) {
    border-color: #3d8a69;
    background: rgba(61, 138, 105, .09);
}

@media (max-width: 900px) {
    .household-layout { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
    .household-members,
    .household-choice-grid { grid-template-columns: 1fr; }
    .household-card-heading { grid-template-columns: 1fr; }
}


/* Version 3.3: automatische Wochenplanung */
.schedule-builder { overflow: hidden; }
.schedule-form {
    display: grid;
    grid-template-columns: minmax(150px, 1.2fr) minmax(170px, 1.4fr) repeat(3, minmax(120px, .8fr)) auto auto;
    gap: .8rem;
    align-items: end;
}
.schedule-form label { min-width: 0; }
.schedule-active { align-self: center; padding-bottom: .65rem; }
.schedule-help { margin: .8rem 0 0; }
.schedule-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 330px), 1fr)); gap: 1rem; }
.schedule-card { display: flex; flex-direction: column; gap: .8rem; }
.schedule-card.is-muted { opacity: .78; }
.schedule-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; margin: 0; }
.schedule-meta div { background: var(--surface-soft, #f3f7f5); border-radius: .75rem; padding: .7rem; }
.schedule-meta dt { color: var(--muted, #64736d); font-size: .78rem; }
.schedule-meta dd { margin: .15rem 0 0; font-weight: 700; }
.inline-warning { border-left: 4px solid #b45309; background: #fff7ed; border-radius: .5rem; padding: .75rem; overflow-wrap: anywhere; }
.schedule-form-edit { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: .8rem; }
.schedule-form-edit .schedule-active, .schedule-form-edit button { align-self: end; }
@media (max-width: 1100px) {
    .schedule-form { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
    .schedule-form, .schedule-form-edit { grid-template-columns: 1fr; }
    .schedule-active { padding-bottom: 0; }
    .schedule-meta { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 430px) {
    .schedule-meta { grid-template-columns: 1fr; }
}

/* 3.4: gemeinsame Rezeptabstimmung und Import-Audit */
.chip-vote { background: color-mix(in srgb, var(--accent, #2f6f4e) 14%, white); }
.plan-vote-summary { display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; }
.shared-vote-days { display: grid; gap: 1.5rem; }
.shared-vote-day { min-width: 0; }
.vote-day-hint { color: var(--muted, #66736b); font-size: .92rem; }
.shared-vote-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
    gap: 1rem;
}
.shared-vote-card {
    overflow: hidden;
    border: 1px solid var(--border, #dbe5de);
    border-radius: 1.1rem;
    background: var(--surface, #fff);
    box-shadow: 0 10px 30px rgba(24, 58, 40, .07);
}
.shared-vote-card.is-selected { outline: 3px solid color-mix(in srgb, var(--accent, #2f6f4e) 55%, transparent); }
.shared-vote-card > img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block; }
.shared-vote-card-body { display: grid; gap: .75rem; padding: 1rem; }
.shared-vote-card-body h3, .shared-vote-card-body p { margin: 0; }
.vote-result { display: flex; align-items: baseline; gap: .6rem; padding: .6rem .75rem; border-radius: .8rem; background: var(--surface-soft, #f4f7f5); }
.vote-result strong { font-size: 1.35rem; }
.vote-result span { color: var(--muted, #66736b); font-size: .88rem; }
.vote-buttons { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; }
.vote-buttons form { margin: 0; }
.vote-button { width: 100%; min-height: 44px; border: 1px solid var(--border, #dbe5de); border-radius: .8rem; background: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.vote-button:hover, .vote-button:focus-visible { border-color: var(--accent, #2f6f4e); }
.vote-up.is-active { background: #e7f6ec; border-color: #69a97d; }
.vote-down.is-active { background: #fff0ef; border-color: #cf7f78; }
.import-audit-metrics { margin: 1rem 0; }
.import-audit-table td:nth-child(5) { min-width: 18rem; max-width: 34rem; white-space: normal; }
.job-created, .job-updated, .job-unchanged { background: #e7f6ec; color: #245d37; }
.job-duplicate { background: #fff7df; color: #745b16; }
.job-rejected { background: #fff0ef; color: #8b332d; }
@media (max-width: 720px) {
    .plan-vote-summary { align-items: stretch; flex-direction: column; }
    .plan-vote-summary form, .plan-vote-summary .button { width: 100%; }
    .shared-vote-grid { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding: .15rem .1rem .75rem; }
    .shared-vote-card { flex: 0 0 min(86vw, 330px); scroll-snap-align: start; }
    .vote-buttons { position: sticky; bottom: .25rem; }
}

.share-row-actions {
    justify-content: flex-end;
    flex-wrap: wrap;
}

@media (max-width: 680px) {
    .share-row-actions,
    .share-row-actions form,
    .share-row-actions .button {
        width: 100%;
    }
}

/* 3.5: Smart-Plan, Rückgängig-Verlauf und mobiler Einkaufsassistent */
.smart-plan-panel {
    margin: 0 0 24px;
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, .8fr);
    gap: 24px;
    align-items: center;
    border-color: #a9d8bf;
    background: linear-gradient(135deg, var(--surface), #f0faf4);
}
.smart-plan-panel h2 { margin: 0 0 6px; }
.smart-plan-metrics {
    display: grid;
    grid-template-columns: repeat(5, minmax(88px, 1fr));
    gap: 8px;
    margin-top: 16px;
}
.smart-plan-metrics span {
    min-width: 0;
    padding: 10px;
    border: 1px solid rgba(66, 130, 96, .16);
    border-radius: 12px;
    background: rgba(255, 255, 255, .72);
    color: var(--muted);
    font-size: .74rem;
}
.smart-plan-metrics strong { display: block; color: var(--text); font-size: 1rem; }
.smart-plan-actions, .smart-plan-form, .smart-plan-undo { display: grid; gap: 10px; }
.smart-plan-form label { display: grid; gap: 6px; font-size: .84rem; font-weight: 750; }
.smart-plan-undo { padding-top: 10px; border-top: 1px solid rgba(66, 130, 96, .18); }
.smart-plan-undo small { color: var(--muted); }
.nutrition-target-note { margin: 12px 0 0; color: var(--muted); font-size: .84rem; }
.smart-plan-settings { border-color: #b6dcc6; }
.nutrition-target-grid { margin-top: 10px; }

.shopping-assistant {
    margin-bottom: 20px;
    display: grid;
    gap: 13px;
    border-color: #acd6bf;
    background: linear-gradient(135deg, #ffffff, #f1faf5);
}
.shopping-assistant-progress { display: flex; align-items: end; justify-content: space-between; gap: 18px; }
.shopping-assistant-progress h2 { margin: 0; font-size: 1.15rem; }
.shopping-assistant-progress > strong { font-size: 1.45rem; color: var(--primary-dark); }
.shopping-progress-track {
    width: 100%;
    height: 10px;
    overflow: hidden;
    border: 0;
    border-radius: 999px;
    background: #dfe9e3;
}
.shopping-assistant-controls {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) auto auto auto;
    gap: 9px;
    align-items: center;
}
.shopping-search input { width: 100%; min-height: 42px; }
.shopping-filter-group { display: flex; gap: 5px; flex-wrap: wrap; }
.shopping-filter-group .button.is-active,
.shopping-assistant-controls > .button.is-active {
    color: #fff;
    background: var(--primary);
    border-color: var(--primary);
}
.shopping-result-summary { margin: 0; color: var(--muted); font-size: .8rem; }
.shopping-item[hidden], .shopping-group[hidden] { display: none !important; }
.shopping-grid.is-compact { gap: 12px; }
.shopping-grid.is-compact .shopping-group-heading { padding-top: 11px; padding-bottom: 11px; }
.shopping-grid.is-compact .check-button { padding-top: 9px; padding-bottom: 9px; }
.shopping-grid.is-compact .shopping-item-edit { display: none; }
.shopping-grid.is-compact .shopping-name small { display: none; }
.shopping-grid.is-compact .shopping-delete { width: 40px; }

@media (max-width: 980px) {
    .smart-plan-panel { grid-template-columns: 1fr; align-items: stretch; }
    .smart-plan-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .shopping-assistant-controls { grid-template-columns: minmax(180px, 1fr) auto auto; }
    .shopping-search { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
    .smart-plan-panel { padding: 18px; }
    .smart-plan-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .shopping-assistant {
        position: sticky;
        top: 8px;
        z-index: 34;
        margin-inline: -4px;
        padding: 14px;
        box-shadow: 0 12px 35px rgba(23, 50, 38, .16);
    }
    .shopping-assistant-controls { grid-template-columns: 1fr 1fr; }
    .shopping-search, .shopping-filter-group { grid-column: 1 / -1; }
    .shopping-filter-group { display: grid; grid-template-columns: repeat(3, 1fr); }
    .shopping-filter-group .button { width: 100%; }
    .shopping-assistant-progress > strong { font-size: 1.25rem; }
    .shopping-grid.is-compact .shopping-group { border-radius: 12px; }
    .shopping-grid.is-compact .shopping-group-heading { padding: 10px 12px; }
    .shopping-grid.is-compact .shopping-category-actions { display: none; }
}
@media (max-width: 420px) {
    .shopping-assistant-controls { grid-template-columns: 1fr; }
    .shopping-search, .shopping-filter-group { grid-column: auto; }
    .shopping-filter-group { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .shopping-filter-group .button { padding-inline: 6px; }
}
@media print {
    .shopping-assistant, .smart-plan-panel { display: none !important; }
}

/* 3.5: responsive Bildvarianten, Importsteuerung und Zutaten-Aliase */
.system-import-tools .stacked-form { margin-bottom: 0; }
.panel-divider { border: 0; border-top: 1px solid var(--border, #dbe5de); margin: 1.15rem 0; }
.system-crawl-form {
    display: grid;
    grid-template-columns: minmax(110px, .45fr) minmax(110px, .45fr) minmax(190px, 1fr);
    gap: .75rem;
    align-items: end;
}
.system-crawl-form label,
.ingredient-alias-form label { display: grid; gap: .35rem; min-width: 0; }
.ingredient-alias-form {
    display: grid;
    grid-template-columns: minmax(170px, 1fr) minmax(170px, 1fr) minmax(155px, .7fr) auto;
    gap: .8rem;
    align-items: end;
    margin: 1rem 0;
}
.alias-table-wrap { max-height: 28rem; overflow: auto; border: 1px solid var(--border, #dbe5de); border-radius: .9rem; }
.alias-table-wrap table { margin: 0; }
.alias-table-wrap thead { position: sticky; top: 0; z-index: 1; background: var(--surface, #fff); }
.recipe-image,
.today-card img,
.history-card img,
.leftover-card img,
.shared-vote-card img { background: var(--surface-soft, #eef4f0); }

@media (max-width: 820px) {
    .ingredient-alias-form { grid-template-columns: 1fr 1fr; }
    .ingredient-alias-form button { width: 100%; }
}
@media (max-width: 620px) {
    .system-crawl-form,
    .ingredient-alias-form { grid-template-columns: 1fr; }
    .system-crawl-form .button,
    .ingredient-alias-form .button { width: 100%; }
    .alias-table-wrap { max-height: 22rem; }
}

/* Version 3.6: gemeinsam bearbeitbare Einkaufsliste */
.shared-category-actions,
.shared-shopping-activity .activity-list {
    display: flex;
    gap: .55rem;
    flex-wrap: wrap;
}
.shared-shopping-edit {
    display: block;
}
.shared-check-button {
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr) auto;
    gap: .75rem;
    width: 100%;
    align-items: center;
    padding: .8rem;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
    cursor: pointer;
    border-radius: .8rem;
}
.shared-check-button:hover,
.shared-check-button:focus-visible {
    background: rgba(25, 105, 76, .08);
    outline: 2px solid transparent;
}
.shared-check-button .fake-check {
    display: inline-grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    border: 2px solid currentColor;
    border-radius: .55rem;
    font-weight: 800;
}
.shared-shopping-activity .activity-list {
    flex-direction: column;
}
.activity-row {
    display: grid;
    grid-template-columns: 7.5rem minmax(0, 1fr);
    gap: .75rem;
    padding: .7rem 0;
    border-bottom: 1px solid var(--border, #dfe6e2);
}
.activity-row:last-child {
    border-bottom: 0;
}
.activity-row span {
    color: var(--muted, #68736d);
    font-size: .9rem;
}
@media (max-width: 640px) {
    .shared-category-actions {
        width: 100%;
    }
    .shared-category-actions form,
    .shared-category-actions .button {
        flex: 1 1 auto;
    }
    .shared-check-button {
        grid-template-columns: 2.25rem minmax(0, 1fr);
    }
    .shared-check-button strong {
        grid-column: 2;
    }
    .activity-row {
        grid-template-columns: 1fr;
        gap: .2rem;
    }
}

/* 3.7 Benutzerverwaltung und Rezept-Qualitätsmeldungen */
.recipe-quality-report { margin-top: 28px; }
.recipe-report-form { display: grid; grid-template-columns: minmax(220px,.7fr) minmax(280px,1.3fr) auto; gap: 14px; align-items: end; }
.recipe-report-form label { display: grid; gap: 7px; }
.recipe-issue-history { display: grid; gap: 10px; margin: 16px 0; }
.recipe-issue-row { display: grid; grid-template-columns: minmax(220px,1fr) auto auto; gap: 10px 16px; align-items: center; padding: 12px 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-soft); }
.recipe-issue-row p { grid-column: 1 / -1; margin: 0; color: var(--muted); }
.recipe-quality-admin { overflow: hidden; }
.recipe-issue-table { min-width: 1080px; }
.issue-action-stack { display: flex; flex-wrap: wrap; gap: 7px; }
.user-admin-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; margin-top: 24px; }
.user-admin-card.is-disabled { opacity: .72; background: var(--surface-soft); }
.user-account-metrics { margin: 16px 0; }
.account-meta { display: grid; gap: 7px; margin: 14px 0; }
.account-meta div { display: flex; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--line); padding-bottom: 7px; }
.account-meta dt { color: var(--muted); }
.account-meta dd { margin: 0; text-align: right; }
.user-admin-actions { display: flex; flex-wrap: wrap; gap: 9px; align-items: center; margin-top: 16px; }
.password-reset-details { margin-top: 16px; border-top: 1px solid var(--line); padding-top: 14px; }
.password-reset-details summary { cursor: pointer; font-weight: 750; }
.password-reset-details[open] summary { margin-bottom: 14px; }
@media (max-width: 820px) {
  .user-admin-grid { grid-template-columns: 1fr; }
  .recipe-report-form { grid-template-columns: 1fr; }
  .recipe-report-form .button { width: 100%; }
  .recipe-issue-row { grid-template-columns: 1fr auto; }
  .recipe-issue-row small { grid-column: 1 / -1; }
}
@media print { .recipe-quality-report, .recipe-quality-admin, .user-admin-actions, .password-reset-details { display:none !important; } }
.user-create-panel { margin-top: 24px; display: grid; grid-template-columns: minmax(220px,.65fr) minmax(0,1.35fr); gap: 24px; align-items: end; }
.user-create-form { display: grid; grid-template-columns: repeat(3,minmax(150px,1fr)) auto auto; gap: 12px; align-items: end; }
@media (max-width: 1000px) { .user-create-panel, .user-create-form { grid-template-columns: 1fr 1fr; } }
@media (max-width: 620px) { .user-create-panel, .user-create-form { grid-template-columns: 1fr; } .user-create-form .button { width:100%; } }

/* Native Fortschrittsanzeigen bleiben mit der strikten CSP kompatibel. */
progress.plan-progress-track,
progress.shopping-progress-track,
progress.mini-progress,
progress.cook-mode-progress {
    appearance: none;
    -webkit-appearance: none;
    padding: 0;
    color: var(--primary);
}
progress.plan-progress-track::-webkit-progress-bar,
progress.shopping-progress-track::-webkit-progress-bar,
progress.mini-progress::-webkit-progress-bar,
progress.cook-mode-progress::-webkit-progress-bar {
    background: var(--surface-soft);
    border-radius: inherit;
}
progress.plan-progress-track::-webkit-progress-value,
progress.shopping-progress-track::-webkit-progress-value,
progress.mini-progress::-webkit-progress-value,
progress.cook-mode-progress::-webkit-progress-value {
    background: var(--primary);
    border-radius: inherit;
    transition: width .2s ease;
}
progress.plan-progress-track::-moz-progress-bar,
progress.shopping-progress-track::-moz-progress-bar,
progress.mini-progress::-moz-progress-bar,
progress.cook-mode-progress::-moz-progress-bar {
    background: var(--primary);
    border-radius: inherit;
}


/* 4.4: Quellenzentrum, erweiterte Discovery und mobile Filter */
.recipe-discovery-actions { margin-top: 14px; }
.source-center-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin:18px 0; }
.source-hosts summary { cursor:pointer; font-weight:700; }
.source-host-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px 14px; margin-top:14px; }
.source-host-grid a { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding:8px 10px; border:1px solid var(--line); border-radius:10px; background:var(--surface-soft); }
.status-pill.warning { display:inline-flex; padding:7px 10px; border-radius:999px; background:#fff3cd; color:#6b4f00; font-weight:700; }
@media (max-width:980px) { .source-host-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:720px) {
  .filter-bar-extended { position:relative; }
  .filter-bar-extended input, .filter-bar-extended select, .filter-bar-extended button { min-height:48px; width:100%; }
  .recipe-discovery-actions .button, .source-center-actions .button { width:100%; }
  .source-host-grid { grid-template-columns:1fr; }
}


/* 4.5: sprachuebergreifende Zutaten und Uebersetzungszentrum */
.translation-center { overflow:hidden; }
.translation-metrics { margin:18px 0; }
.translation-progress { margin: 14px 0 18px; display: grid; gap: 8px; }
.translation-progress-head { display:flex; justify-content:space-between; gap:12px; color:var(--muted); font-size:.9rem; }
.translation-progress-native { width:100%; height:10px; overflow:hidden; border:1px solid var(--line); border-radius:999px; background:var(--surface-soft); appearance:none; }
.translation-progress-native::-webkit-progress-bar { background:var(--surface-soft); border-radius:999px; }
.translation-progress-native::-webkit-progress-value { background:var(--primary); border-radius:999px; transition:width .25s ease; }
.translation-progress-native::-moz-progress-bar { background:var(--primary); border-radius:999px; transition:width .25s ease; }
.translation-actions { display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }
.translation-actions .form-hint { margin:0; max-width:760px; }
.translation-failures { margin-top:18px; }
.translation-failures summary { cursor:pointer; font-weight:750; }
.translation-failures[open] summary { margin-bottom:14px; }
.translation-failures .system-table { min-width:920px; }
@media (max-width:720px) {
  .translation-actions, .translation-actions form, .translation-actions .button { width:100%; }
  .translation-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* 4.6: Lebensmittelrettung und adaptive Resteverwertung */
.use-up-filter {
    display: flex;
    align-items: end;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.25rem;
}
.use-up-filter label { display: grid; gap: .4rem; min-width: 12rem; }
.use-up-filter .muted { flex: 1 1 26rem; }
.use-up-summary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.2rem;
    margin: 1.25rem 0 2rem;
}
.use-up-ingredient-list,
.use-up-leftovers { display: grid; gap: .65rem; margin-top: 1rem; }
.use-up-ingredient-list > div,
.use-up-leftovers > a {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .75rem 0;
    border-bottom: 1px solid var(--line);
}
.use-up-ingredient-list > div:last-child,
.use-up-leftovers > a:last-child { border-bottom: 0; }
.use-up-ingredient-list span,
.use-up-leftovers span { color: var(--muted); text-align: right; }
.use-up-recipe-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.1rem;
}
.use-up-recipe-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: var(--surface);
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
}
.use-up-recipe-image { aspect-ratio: 16 / 10; overflow: hidden; background: var(--surface-soft); }
.use-up-recipe-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.use-up-recipe-body { padding: 1rem; display: flex; flex-direction: column; gap: .7rem; height: 100%; }
.use-up-recipe-body h3 { margin: 0; line-height: 1.25; }
.use-up-recipe-body p { margin: 0; }
.use-up-score-row { display: flex; gap: .4rem; flex-wrap: wrap; }
.use-up-match { min-height: 2.8rem; }
.use-up-recipe-body .button { margin-top: auto; align-self: flex-start; }
.alert-panel-danger { border-color: #e6b3b3; background: #fff8f8; }
.status-chip.status-success { background: #e3f5ea; color: #155c39; }
@media (max-width: 1050px) {
    .use-up-recipe-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
    .use-up-summary-grid,
    .use-up-recipe-grid { grid-template-columns: 1fr; }
    .use-up-filter,
    .use-up-filter label,
    .use-up-filter select { width: 100%; }
    .use-up-ingredient-list > div,
    .use-up-leftovers > a { align-items: flex-start; }
    .use-up-ingredient-list span,
    .use-up-leftovers span { text-align: left; }
    .use-up-recipe-card { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); }
    .use-up-recipe-image { aspect-ratio: auto; min-height: 100%; }
    .use-up-recipe-body { padding: .85rem; }
    .use-up-match { min-height: 0; }
}
@media (max-width: 460px) {
    .use-up-recipe-card { grid-template-columns: 1fr; }
    .use-up-recipe-image { aspect-ratio: 16 / 9; }
}
.provider-health-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; margin:1rem 0; }
.provider-health-card { border:1px solid var(--line); border-radius:.9rem; padding:.9rem; background:var(--surface-soft); }
.provider-health-card > div { display:flex; align-items:center; justify-content:space-between; gap:.8rem; }
.provider-health-card small { display:block; margin-top:.45rem; color:var(--muted); }
.provider-health-card p { margin:.55rem 0 0; color:var(--muted); font-size:.9rem; overflow-wrap:anywhere; }
.provider-health-card.is-paused { border-color:#e7cc8a; background:#fffaf0; }
@media (max-width:720px) { .provider-health-grid { grid-template-columns:1fr; } }

/* 4.6: App-Installation, Koch-Timer und horizontale Mobilnavigation */
.footer-actions { display: inline-flex; align-items: center; justify-content: flex-end; gap: 12px; flex-wrap: wrap; }
.footer-install-button { border: 0; padding: 0; background: transparent; color: var(--primary); font: inherit; font-weight: 800; cursor: pointer; }
.footer-install-button:hover { text-decoration: underline; }
.cook-timer-suggestions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px; }
.cook-timer-suggestions[hidden] { display: none; }
.timer-suggestion { min-height: 36px; border: 1px solid var(--primary); border-radius: 999px; padding: 7px 12px; background: var(--surface); color: var(--primary-dark); font: inherit; font-size: .82rem; font-weight: 800; cursor: pointer; }
.timer-suggestion:hover { background: var(--primary); color: white; }
@media (max-width: 720px) {
    .mobile-nav {
        grid-template-columns: none;
        grid-auto-flow: column;
        grid-auto-columns: minmax(68px, 1fr);
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scrollbar-width: none;
    }
    .mobile-nav::-webkit-scrollbar { display: none; }
}


.source-scan-form { margin: 1rem 0; align-items: end; }
.source-scan-form label { min-width: 9rem; }
.source-scan-form .checkbox-row { min-width: 15rem; padding-bottom: .55rem; }
@media (max-width: 760px) {
  .source-scan-form { display: grid; grid-template-columns: 1fr; }
  .source-scan-form label, .source-scan-form button { width: 100%; min-width: 0; }
  .source-scan-form input, .source-scan-form select { width: 100%; }
}

/* 5.2: kompakter, kollisionsfreier Plan-Schnellzugriff auf Mobilgeraeten */
.sticky-plan-bar {
    transition: transform .2s ease, opacity .2s ease, visibility .2s ease;
}
.sticky-plan-bar.is-obscuring-danger {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(calc(100% + 28px));
}
.translation-runtime-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px 14px;
    align-items: center;
    margin: 16px 0 18px;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: var(--surface-soft);
}
.translation-runtime-card > div { min-width: 0; display: grid; gap: 3px; }
.translation-runtime-card > div span,
.translation-runtime-card small { color: var(--muted); overflow-wrap: anywhere; }
.translation-runtime-card small { grid-column: 1 / -1; }
.translation-runtime-card.is-ready { border-color: rgba(31,118,84,.28); background: #f2faf5; }
.translation-runtime-card.is-degraded { border-color: rgba(181,125,30,.3); background: #fff9ec; }
.translation-runtime-card.is-offline { border-color: rgba(164,60,60,.25); background: #fff6f6; }

@media (max-width: 720px) {
    .sticky-plan-bar {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        flex-direction: row;
        gap: 10px;
        left: 9px;
        right: 9px;
        bottom: calc(70px + env(safe-area-inset-bottom));
        padding: 9px 10px 9px 13px;
        min-height: 64px;
        border-radius: 15px;
    }
    .sticky-plan-bar .sticky-plan-copy {
        min-width: 0;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
        line-height: 1.25;
        font-size: .78rem;
    }
    .sticky-plan-bar .button {
        width: auto;
        min-height: 46px;
        padding-inline: 16px;
        white-space: nowrap;
    }
    .danger-zone {
        margin-bottom: calc(150px + env(safe-area-inset-bottom));
        scroll-margin-bottom: calc(165px + env(safe-area-inset-bottom));
    }
    .translation-runtime-card { grid-template-columns: 1fr; align-items: start; }
    .translation-runtime-card .status-pill { justify-self: start; }
}

@media (max-width: 430px) {
    .sticky-plan-bar { grid-template-columns: 1fr; min-height: 58px; }
    .sticky-plan-bar .sticky-plan-copy { display: none; }
    .sticky-plan-bar .button { width: 100%; }
}

/* 5.3: Betriebsassistent, selbstheilende Worker und robuste mobile Aktionen */
.self-heal-card { overflow: hidden; }
.self-heal-card .self-heal-metrics { margin: 1rem 0; }
.self-heal-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; }
.self-heal-actions form { margin: 0; }
.self-heal-details { margin-top: 1rem; border-top: 1px solid var(--line); padding-top: .9rem; }
.self-heal-details summary { cursor: pointer; font-weight: 800; }
.self-heal-details h3 { margin: 1rem 0 .35rem; font-size: .95rem; }
.self-heal-details ul { margin: .35rem 0 0; padding-left: 1.25rem; display: grid; gap: .35rem; }
.self-heal-details .error-list { color: #7b312f; }
@media (max-width: 720px) {
    .self-heal-actions, .self-heal-actions form, .self-heal-actions .button { width: 100%; }
    .self-heal-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .translation-actions .button-row { display: grid; grid-template-columns: 1fr; width: 100%; }
    .translation-actions .button-row form, .translation-actions .button-row .button { width: 100%; }
}


/* 5.5: Originaldaten, Sprachmodell-Abdeckung und Visual-Viewport-Sicherheit */
.original-recipe-panel { margin: 1.25rem 0; border-style: dashed; }
.original-recipe-panel > summary { cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 1rem; font-weight: 850; }
.original-recipe-panel > summary small { color: var(--muted); }
.original-recipe-content { display: grid; gap: 1.2rem; padding-top: 1rem; }
.original-recipe-content h2, .original-recipe-content h3 { margin-bottom: .5rem; }
.original-recipe-content ul, .original-recipe-content ol { margin: 0; padding-left: 1.25rem; display: grid; gap: .45rem; }
.original-recipe-content ul { list-style: none; padding-left: 0; }
.original-recipe-content ul li { display: flex; justify-content: space-between; gap: 1rem; padding: .45rem 0; border-bottom: 1px solid var(--line); }
.translation-language-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: .7rem; margin: 1rem 0 1.25rem; }
.translation-language-card { display: grid; gap: .35rem; padding: .8rem; border: 1px solid var(--line); border-radius: .85rem; background: var(--surface-soft); }
.translation-language-card > div { display: flex; justify-content: space-between; gap: .5rem; }
.translation-language-card > div span, .translation-language-card small { color: var(--muted); }
.translation-language-card.is-missing { border-color: #e6be78; background: #fff9ed; }
.import-status-card { display: grid; gap: .35rem; margin: .9rem 0; padding: .8rem 1rem; border: 1px solid var(--line); border-radius: .85rem; background: var(--surface-soft); }
.import-status-card > div { display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.import-status-card small { color: var(--muted); }
@media (max-width: 980px) { .translation-language-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 720px) {
    .translation-language-grid { grid-template-columns: 1fr; }
    .original-recipe-content ul li { align-items: flex-start; flex-direction: column; gap: .15rem; }
    html.keyboard-visible .mobile-nav, html.keyboard-visible .sticky-plan-bar { transform: translateY(120%); pointer-events: none; }
}

/* 5.6.0: reversible shopping actions and source-health overview */
.action-toast {
    position: fixed;
    z-index: 1200;
    left: 50%;
    bottom: calc(1rem + env(safe-area-inset-bottom));
    transform: translateX(-50%);
    width: min(92vw, 42rem);
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: .85rem 1rem;
    border-radius: 1rem;
    color: #fff;
    background: rgba(24, 55, 43, .97);
    box-shadow: 0 18px 50px rgba(13, 35, 27, .28);
}
.action-toast[hidden] { display: none; }
.action-toast span { flex: 1; font-weight: 750; }
.action-toast button { border: 0; color: #fff; background: transparent; font: inherit; font-weight: 850; cursor: pointer; }
.action-toast [data-action-toast-undo] { padding: .45rem .7rem; border-radius: .7rem; background: rgba(255,255,255,.16); }
.action-toast-close { font-size: 1.35rem; line-height: 1; padding: .25rem; }
.source-health-summary { margin: 1rem 0; }
.source-health-table td { vertical-align: top; }
.source-health-table .job-error { display: inline-block; max-width: 28rem; white-space: normal; overflow-wrap: anywhere; }
.source-health-reset-form { display: grid; gap: .4rem; min-width: 10rem; }
.checkbox-row.compact { font-size: .78rem; }

@media (max-width: 760px) {
    .action-toast {
        bottom: calc(5.6rem + env(safe-area-inset-bottom));
        width: calc(100vw - 1rem);
        border-radius: .9rem;
    }
    html.keyboard-visible .action-toast { bottom: .5rem; }
    .source-health-table { min-width: 58rem; }
}

@media (prefers-reduced-motion: reduce) {
    .action-toast { scroll-behavior: auto; }
}

/* 5.7.0: resumable crawls, duplicate review and compact admin cards */
.duplicate-center .duplicate-metrics { margin: 1rem 0; }
.duplicate-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; margin-top: 1rem; }
.duplicate-card { display: grid; grid-template-columns: auto minmax(0,1fr); gap: .75rem 1rem; padding: 1rem; border: 1px solid var(--line); border-radius: 1rem; background: var(--surface-soft); }
.duplicate-score { display: grid; align-content: start; justify-items: center; min-width: 5rem; padding: .65rem; border-radius: .8rem; background: var(--surface); border: 1px solid var(--line); }
.duplicate-score strong { font-size: 1.2rem; }
.duplicate-score span, .duplicate-subscore, .duplicate-pair small { color: var(--muted); font-size: .8rem; }
.duplicate-pair { display: grid; gap: .25rem; min-width: 0; }
.duplicate-pair a { color: inherit; overflow-wrap: anywhere; }
.duplicate-pair > span { color: var(--muted); }
.duplicate-subscore { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: .7rem; }
.duplicate-actions { grid-column: 1 / -1; align-items: stretch; }
.duplicate-actions form { margin: 0; }

@media (max-width: 900px) {
    .duplicate-card-grid { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
    .duplicate-card { grid-template-columns: 1fr; }
    .duplicate-score { justify-items: start; min-width: 0; }
    .duplicate-subscore, .duplicate-actions { grid-column: auto; }
    .duplicate-actions, .duplicate-actions form, .duplicate-actions .button { width: 100%; }
}

/* 5.8: Qualitätsaudit, Queue-Steuerung und lokale Zutaten-Checkliste */
.job-inline-actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.job-inline-actions form { margin: 0; }
.button-danger-text { color: #9a2f2f; }
.job-cancelled { background: #eef0f2; color: #5f6670; border-color: #d7dce1; }
.queue-type-details { margin-top: 12px; }
.queue-type-details .compact-list { margin-top: 10px; max-height: 260px; overflow: auto; }
.quality-card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 12px; margin-top: 16px; }
.quality-card { display: grid; grid-template-columns: 1fr auto; gap: 10px 14px; align-items: start; padding: 15px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface-soft); }
.quality-card > div { display: grid; gap: 3px; min-width: 0; }
.quality-card > div strong { overflow-wrap: anywhere; }
.quality-card small { color: var(--muted); }
.quality-card ul { grid-column: 1 / -1; margin: 0; padding-left: 20px; color: var(--muted); font-size: .88rem; }
.quality-score { display: inline-flex; align-items: center; justify-content: center; min-width: 64px; padding: 7px 9px; border-radius: 999px; font-weight: 850; font-variant-numeric: tabular-nums; }
.quality-score-low { background: #fff0ed; color: #9a352a; }
.ingredient-heading > div { display: grid; gap: 3px; }
.ingredient-check-reset { justify-self: start; padding: 0; font-size: .8rem; }
.ingredient-check-hint { margin-top: -4px; }
.ingredient-check-label { display: flex; align-items: center; gap: 10px; min-width: 0; cursor: pointer; }
.ingredient-check-label input { width: 20px; height: 20px; flex: 0 0 auto; accent-color: var(--primary); }
.ingredient-check-list li { transition: opacity .18s ease, background-color .18s ease; border-radius: 10px; padding: 8px 6px; }
.ingredient-check-list li.is-checked { opacity: .58; background: var(--surface-soft); }
.ingredient-check-list li.is-checked .ingredient-check-label span { text-decoration: line-through; }
@media (max-width: 620px) {
    .quality-card-grid { grid-template-columns: 1fr; }
    .job-inline-actions { flex-direction: column; align-items: stretch; }
    .job-inline-actions .button { width: 100%; }
    .ingredient-check-list li { align-items: flex-start; gap: 12px; }
    .ingredient-check-list li > strong { padding-top: 3px; white-space: nowrap; }
}

/* 5.9.0: gespeicherte Rezeptfilter und Meal-Prep-Zusammenfassung */
.saved-search-panel { display: grid; gap: 14px; margin-bottom: 18px; }
.saved-search-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.saved-search-heading h2 { margin: 0; }
.saved-search-heading > span { color: var(--muted); font-size: .82rem; white-space: nowrap; }
.saved-search-chips { display: flex; flex-wrap: wrap; gap: 9px; }
.saved-search-chip { display: inline-flex; align-items: stretch; overflow: hidden; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); }
.saved-search-chip > a { padding: 8px 12px; color: var(--text); font-weight: 700; text-decoration: none; }
.saved-search-chip form { display: flex; margin: 0; border-left: 1px solid var(--line); }
.saved-search-chip button { width: 34px; border: 0; background: transparent; color: var(--muted); cursor: pointer; font-size: 1.1rem; }
.saved-search-chip button:hover, .saved-search-chip button:focus-visible { color: var(--danger); background: color-mix(in srgb, var(--danger) 8%, transparent); }
.filter-check { min-height: 46px; display: inline-flex; align-items: center; gap: 8px; padding: 0 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); font-weight: 700; }
.filter-check input { width: 18px; height: 18px; margin: 0; }
.save-current-search { margin: -4px 0 24px; }
.save-current-search form { display: flex; align-items: end; flex-wrap: wrap; gap: 10px; }
.save-current-search label { display: grid; gap: 5px; flex: 1 1 260px; color: var(--muted); font-size: .8rem; font-weight: 700; }
.save-current-search input[type="text"] { width: 100%; }
.plan-prep-summary { margin-bottom: 26px; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr); gap: 22px; align-items: stretch; }
.plan-prep-summary-copy h2 { margin-bottom: 6px; }
.plan-prep-metrics { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 16px; }
.plan-prep-metrics span { display: inline-flex; align-items: baseline; gap: 5px; padding: 8px 10px; border-radius: 12px; background: var(--surface); border: 1px solid var(--line); color: var(--muted); font-size: .78rem; }
.plan-prep-metrics strong { color: var(--text); font-size: 1rem; }
.batch-prep-card { padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
.batch-prep-card h3 { margin: 0 0 10px; }
.batch-prep-list { list-style: none; padding: 0; margin: 0 0 14px; display: grid; gap: 8px; }
.batch-prep-list li { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 8px; border-bottom: 1px dashed var(--line); }
.batch-prep-list li:last-child { border-bottom: 0; }
.batch-prep-list span { color: var(--muted); font-size: .8rem; white-space: nowrap; }

@media (max-width: 760px) {
    .saved-search-heading { align-items: flex-start; }
    .saved-search-chips { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; scroll-snap-type: x proximity; }
    .saved-search-chip { flex: 0 0 auto; scroll-snap-align: start; }
    .save-current-search form { align-items: stretch; }
    .save-current-search .button { flex: 1 1 auto; }
    .plan-prep-summary { grid-template-columns: 1fr; }
    .batch-prep-list li { align-items: baseline; }
}

/* 6.0.0: persoenliche Zutaten-Alternativen und Vorratsabdeckung */
.ingredient-preference-notice { margin: 10px 0 14px; }
.ingredient-label-text { display: grid; gap: 2px; min-width: 0; }
.ingredient-label-text small { color: var(--muted); font-size: .78rem; line-height: 1.3; }
.ingredient-preferred-name { color: var(--text); }
.ingredient-substitution-settings { margin-top: 18px; }
.ingredient-substitution-layout { display: grid; grid-template-columns: minmax(280px, .85fr) minmax(320px, 1.15fr); gap: 22px; align-items: start; }
.ingredient-substitution-form { padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: color-mix(in srgb, var(--surface) 88%, var(--accent) 12%); }
.ingredient-substitution-list { display: grid; gap: 10px; }
.ingredient-substitution-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.ingredient-substitution-row > div { display: grid; gap: 4px; min-width: 0; }
.ingredient-substitution-row small { color: var(--muted); overflow-wrap: anywhere; }
.ingredient-substitution-row p { margin: 2px 0 0; color: var(--muted); }
.compact-empty { padding: 18px; }
.plan-coverage-panel { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(260px, .7fr); gap: 22px; align-items: center; }
.plan-coverage-copy { display: grid; gap: 10px; }
.plan-coverage-copy h2, .plan-coverage-missing h3 { margin: 0; }
.plan-coverage-missing { padding: 16px; border-radius: 16px; background: color-mix(in srgb, var(--surface) 82%, var(--accent) 18%); }
.plan-coverage-missing ul { list-style: none; padding: 0; margin: 12px 0 14px; display: grid; gap: 8px; }
.plan-coverage-missing li { display: flex; justify-content: space-between; gap: 14px; border-bottom: 1px solid color-mix(in srgb, var(--line) 70%, transparent); padding-bottom: 7px; }
.plan-coverage-missing li span { min-width: 0; overflow-wrap: anywhere; }
.plan-coverage-missing li strong { white-space: nowrap; }

@media (max-width: 780px) {
    .ingredient-substitution-layout, .plan-coverage-panel { grid-template-columns: 1fr; }
    .ingredient-substitution-row { align-items: stretch; flex-direction: column; }
    .ingredient-substitution-row form, .ingredient-substitution-row button { width: 100%; }
    .plan-coverage-missing { padding: 14px; }
}

/* 6.1.0: persönliches Kochjournal */
.cooking-journal-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}
.cooking-journal-summary > div {
    display: grid;
    gap: .2rem;
    min-width: 0;
}
.cooking-journal-summary strong { font-size: clamp(1.25rem, 3vw, 2rem); }
.cooking-journal-summary span { color: var(--muted); font-size: .9rem; }
.cooking-journal-list,
.recipe-cook-history-list {
    display: grid;
    gap: .75rem;
}
.cooking-journal-row,
.recipe-cook-history-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .85rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-small);
    background: var(--surface-soft);
}
.cooking-journal-recipe {
    display: flex;
    align-items: center;
    gap: .9rem;
    min-width: 0;
    color: inherit;
    text-decoration: none;
    flex: 1;
}
.cooking-journal-recipe img {
    width: 96px;
    height: 72px;
    object-fit: cover;
    border-radius: .7rem;
    flex: 0 0 auto;
}
.cooking-journal-recipe > div,
.recipe-cook-history-row > div { display: grid; gap: .2rem; min-width: 0; }
.cooking-journal-recipe strong { overflow-wrap: anywhere; }
.cooking-journal-recipe span,
.cooking-journal-recipe small,
.recipe-cook-history-row span { color: var(--muted); }
.cooking-journal-recipe p,
.recipe-cook-history-row p { margin: .2rem 0 0; }
.recipe-cook-history {
    margin-top: 1.25rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--border);
}

@media (max-width: 760px) {
    .cooking-journal-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cooking-journal-row,
    .recipe-cook-history-row { align-items: stretch; flex-direction: column; }
    .cooking-journal-row form,
    .recipe-cook-history-row form { align-self: flex-end; }
    .cooking-journal-recipe { align-items: flex-start; }
    .cooking-journal-recipe img { width: 78px; height: 64px; }
}

/* 6.2.0: persoenliches Preisbuch und transparente Einkaufskostenschaetzung */
.input-with-suffix { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: stretch; }
.input-with-suffix input { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.input-with-suffix span { display: grid; place-items: center; min-width: 44px; padding: 0 12px; border: 1px solid var(--line); border-left: 0; border-radius: 0 12px 12px 0; background: var(--surface-soft); color: var(--muted); font-weight: 800; }
.ingredient-price-settings { margin-top: 18px; }
.ingredient-price-layout { display: grid; grid-template-columns: minmax(300px, .9fr) minmax(340px, 1.1fr); gap: 22px; align-items: start; }
.ingredient-price-form { padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: color-mix(in srgb, var(--surface) 88%, var(--primary) 12%); }
.ingredient-price-list { display: grid; gap: 10px; max-height: 620px; overflow: auto; padding-right: 2px; }
.ingredient-price-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.ingredient-price-row.is-stale { border-color: color-mix(in srgb, var(--accent) 58%, var(--line)); background: color-mix(in srgb, var(--surface) 92%, var(--accent) 8%); }
.ingredient-price-row > div { display: grid; gap: 3px; min-width: 0; }
.ingredient-price-row p { margin: 0; overflow-wrap: anywhere; }
.ingredient-price-row small { color: var(--muted); }
.plan-budget-panel, .shopping-budget-card { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); gap: 22px; align-items: center; }
.plan-budget-primary, .shopping-budget-main, .plan-budget-summary, .shopping-budget-details { display: grid; gap: 10px; }
.plan-budget-primary h2, .shopping-budget-main h2 { margin: 0; }
.plan-budget-summary, .shopping-budget-details { padding: 16px; border-radius: 16px; background: color-mix(in srgb, var(--surface) 82%, var(--primary) 18%); }
.budget-difference { display: grid; gap: 2px; color: var(--muted); }
.budget-difference strong { color: var(--text); font-size: 1.35rem; }
.budget-difference.is-over strong { color: var(--danger); }
.budget-difference.is-within strong { color: var(--primary-dark); }
.budget-unpriced { display: grid; gap: 7px; }
.budget-unpriced-links { display: flex; flex-wrap: wrap; gap: 7px; }
.budget-unpriced-links a { padding: 6px 9px; border-radius: 999px; background: var(--surface); border: 1px solid var(--line); color: var(--primary-dark); font-size: .8rem; font-weight: 750; }
.compact-notice { margin: 0; padding: 9px 11px; font-size: .84rem; }
.shopping-item-cost { margin: -2px 56px 8px 48px; color: var(--muted); font-size: .78rem; font-weight: 700; }
.shopping-item-cost.is-missing { color: var(--primary); text-decoration: underline; text-underline-offset: 2px; }

@media (max-width: 780px) {
    .ingredient-price-layout, .plan-budget-panel, .shopping-budget-card { grid-template-columns: 1fr; }
    .ingredient-price-row { flex-direction: column; align-items: stretch; }
    .ingredient-price-row form, .ingredient-price-row button { width: 100%; }
    .ingredient-price-list { max-height: none; overflow: visible; }
    .shopping-item-cost { margin-left: 46px; margin-right: 10px; }
}

/* 6.3.0: fixierte Plantage und Plancheck */
.plan-readiness-panel { margin-bottom: 24px; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr); gap: 22px; align-items: start; }
.plan-readiness-main { display: grid; gap: 10px; }
.plan-readiness-main h2 { margin: 0; }
.plan-readiness-metrics { display: flex; flex-wrap: wrap; gap: 8px 14px; color: var(--muted); }
.plan-readiness-metrics span { display: inline-flex; align-items: baseline; gap: 5px; }
.plan-readiness-metrics strong { color: var(--ink); }
.plan-readiness-actions { display: grid; gap: 12px; }
.plan-readiness-issues { margin: 0; padding-left: 20px; display: grid; gap: 6px; }
.plan-lock-bulk-actions { align-items: stretch; }
.plan-lock-bulk-actions form { margin: 0; }
.day-lock-badge { display: inline-flex; align-items: center; width: fit-content; margin-top: 6px; padding: 4px 9px; border-radius: 999px; background: #efe4b8; color: #5f4a00; font-size: .78rem; font-weight: 800; }
.day-is-locked { border-color: #d7bc55; box-shadow: 0 0 0 1px rgba(199, 160, 32, .12); }
.day-is-locked .recipe-scroller { background: linear-gradient(90deg, rgba(239,228,184,.16), transparent 20%); }
.day-lock-form .button-selected { white-space: nowrap; }
.button:disabled, button:disabled { cursor: not-allowed; opacity: .55; }
.success-copy { margin: 0; color: var(--muted); }
.success-copy strong { color: var(--success, #247344); }

@media (max-width: 800px) {
    .plan-readiness-panel { grid-template-columns: 1fr; gap: 16px; }
    .plan-readiness-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .plan-lock-bulk-actions { display: grid; grid-template-columns: 1fr; }
    .plan-lock-bulk-actions form, .plan-lock-bulk-actions .button { width: 100%; }
    .scroll-tools .day-lock-form { width: 100%; }
}

@media (max-width: 430px) {
    .plan-readiness-metrics { grid-template-columns: 1fr; }
}


/* 6.4.0: Tages-Zeitbudgets und planbare Kochlast */
.plan-time-budget-panel { margin-bottom: 24px; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(250px, .75fr); gap: 22px; align-items: center; }
.plan-time-budget-panel h2 { margin: 0 0 8px; }
.plan-time-budget-summary { display: grid; gap: 9px; }
.plan-time-budget-summary > span, .time-budget-warning { display: flex; justify-content: space-between; gap: 12px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); text-decoration: none; color: inherit; }
.time-budget-warning { display: grid; justify-content: initial; border-color: #d79a35; background: #fff4df; color: #6b4300; }
.day-time-budget-badge { display: inline-flex; align-items: center; width: fit-content; margin: 6px 0 0 6px; padding: 4px 9px; border-radius: 999px; background: #e6f2ff; color: #174f7c; font-size: .78rem; font-weight: 800; }
.day-time-budget-badge.is-over { background: #ffe4dc; color: #8a2e16; }
.day-over-time-budget { border-color: #e4a14b; box-shadow: 0 0 0 2px rgba(228, 161, 75, .14); }
@media (max-width: 760px) {
    .plan-time-budget-panel { grid-template-columns: 1fr; gap: 14px; }
    .plan-time-budget-summary > span, .time-budget-warning { align-items: flex-start; }
    .day-time-budget-badge { margin-left: 0; }
}

/* 8.0.2: robuster Saisonkalender ohne horizontales Seitenlayout */
.seasonal-page,
.seasonal-page > *,
.filter-bar-extended > *,
.save-current-search,
.save-current-search form {
    min-width: 0;
}
.seasonal-page {
    overflow: clip;
}
.chip-seasonal {
    background: #eef8df;
    color: #315f22;
    border-color: #bddc9c;
}
.chip-seasonal.is-strong {
    background: #dff1c6;
    color: #214b18;
    border-color: #91c466;
}
.seasonal-heading .button-row {
    margin-top: 1rem;
}
.season-month-selector {
    min-width: 0;
    margin: 0 0 1.25rem;
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: 1rem;
    background: var(--surface);
    box-shadow: 0 10px 30px rgba(22, 61, 43, .05);
}
.season-month-selector-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .8rem;
}
.season-month-selector-heading h2,
.season-month-selector-heading p {
    margin-bottom: 0;
}
.season-month-stepper {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .5rem;
    flex-wrap: wrap;
}
.season-month-stepper .icon-button {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    font-size: 1.15rem;
    text-decoration: none;
}
.season-months {
    display: flex;
    gap: .45rem;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    padding: .15rem .1rem .55rem;
    scroll-padding-inline: .1rem;
    scroll-snap-type: x proximity;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
}
.season-months a {
    display: grid;
    place-items: center;
    flex: 0 0 3.4rem;
    min-width: 0;
    min-height: 2.65rem;
    padding: .55rem .4rem;
    border: 1px solid var(--line);
    border-radius: .8rem;
    background: var(--surface);
    color: inherit;
    font-weight: 700;
    text-decoration: none;
    scroll-snap-align: center;
}
.season-months a:hover,
.season-months a:focus-visible,
.season-months a.is-active {
    border-color: #4f8f68;
    background: #e8f4ec;
    color: #1e5a3c;
}
.season-months a.is-active {
    box-shadow: inset 0 0 0 1px #4f8f68;
}
.seasonal-produce-panel,
.seasonal-recipe-grid,
.seasonal-recipes-heading {
    min-width: 0;
}
.seasonal-produce-heading > div,
.seasonal-recipes-heading > div {
    min-width: 0;
}
.seasonal-produce-heading h2,
.seasonal-recipes-heading h2,
.seasonal-heading h1,
.seasonal-heading p {
    overflow-wrap: anywhere;
}
.seasonal-ingredient-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
    min-width: 0;
}
.seasonal-ingredient-cloud a {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    min-width: 0;
    min-height: 2.5rem;
    padding: .55rem .8rem;
    border-radius: 999px;
    border: 1px solid #c8dbc9;
    background: #f5faf5;
    color: #285c3e;
    font-weight: 700;
    text-decoration: none;
    overflow-wrap: anywhere;
}
.seasonal-ingredient-cloud a:hover,
.seasonal-ingredient-cloud a:focus-visible {
    background: #e4f3e7;
    border-color: #79ae88;
}
.recipe-seasonality .seasonality-meter {
    width: 100%;
    height: 1rem;
    margin: .65rem 0 1rem;
    accent-color: #4d9a62;
}
.seasonality-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}
.seasonality-columns > div {
    min-width: 0;
    padding: .9rem;
    border-radius: .9rem;
    background: #f7faf7;
    border: 1px solid #e0e8e1;
}
.seasonality-columns p {
    margin: .35rem 0 0;
    overflow-wrap: anywhere;
}
.filter-bar-extended select,
.filter-bar-extended input,
.filter-check span {
    min-width: 0;
}
.filter-bar-extended select {
    max-width: 100%;
    text-overflow: ellipsis;
}
@media (max-width: 760px) {
    .seasonal-page {
        overflow: visible;
    }
    .seasonal-primary-actions .button {
        width: 100%;
    }
    .season-month-selector {
        padding: .8rem;
        margin-inline: 0;
    }
    .season-month-selector-heading,
    .seasonal-produce-heading,
    .seasonal-recipes-heading {
        align-items: flex-start;
        flex-direction: column;
    }
    .season-month-stepper {
        width: 100%;
        justify-content: space-between;
    }
    .season-month-stepper .button {
        flex: 1 1 auto;
    }
    .season-months {
        margin-inline: -.15rem;
    }
    .season-months a {
        flex-basis: 3.55rem;
        min-height: 2.85rem;
    }
    .seasonality-columns {
        grid-template-columns: 1fr;
    }
    .seasonal-ingredient-cloud {
        gap: .5rem;
    }
    .seasonal-ingredient-cloud a {
        min-height: 2.75rem;
    }
}

/* 6.6.0: erweiterte Naehrwerte und CO2e-Orientierung */
.nutrition-row-expanded { display: grid; grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); max-width: 760px; }
.metric-source-note { margin: -14px 0 20px; color: var(--muted); font-size: .8rem; }
.environmental-metrics, .plan-environment-panel { display: grid; gap: 18px; }
.environmental-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.environmental-grid > div { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 14px; display: grid; gap: 3px; }
.environmental-grid strong { font-size: 1.2rem; }
.environmental-grid span { color: var(--muted); font-size: .78rem; }
.environmental-primary { background: color-mix(in srgb, var(--accent) 10%, var(--surface)) !important; }
.co2-breakdown summary { cursor: pointer; font-weight: 700; }
.co2-breakdown ol { margin: 12px 0 0; padding-left: 20px; }
.co2-breakdown li { display: flex; justify-content: space-between; gap: 16px; padding: 7px 0; border-bottom: 1px solid var(--line); }
.co2-rating-very_low, .co2-rating-low, .chip-co2.is-low { background: #e4f6e8; color: #176b31; border-color: #b9e2c2; }
.co2-rating-high, .co2-rating-very_high, .chip-co2.is-high { background: #fff0e8; color: #9b3d13; border-color: #f2c7b2; }
.plan-environment-panel { grid-template-columns: minmax(240px, .8fr) minmax(0, 1.2fr); align-items: center; }
.plan-environment-grid { grid-template-columns: repeat(4, minmax(100px, 1fr)); }
@media (max-width: 760px) {
    .nutrition-row-expanded { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .environmental-grid, .plan-environment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .plan-environment-panel { grid-template-columns: 1fr; }
    .co2-breakdown li { align-items: flex-start; flex-direction: column; gap: 2px; }
}

/* 6.7.0: Katalogskalierung und parallele Worker ohne Layoutbruch */

/* 6.8.0: sichere Daueranmeldung und MFA */
/* 6.9.0: universeller, vorab prüfbarer Upgradepfad */
/* 7.0.0: Release-Bootstrap, additive Migrationen und lokale Preserve-Pfade */
.auth-remember-row { margin-top: -2px; padding: 12px 13px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); }
.auth-remember-row span { display: grid; gap: 3px; }
.auth-remember-row small { color: var(--muted); font-weight: 500; line-height: 1.45; }
.auth-cancel-form { margin-top: 12px; }
.account-security { align-items: start; }
.security-intro { position: sticky; top: 94px; }
.security-settings-stack { display: grid; gap: 16px; min-width: 0; }
.security-card { display: grid; gap: 16px; padding: 20px; border: 1px solid var(--line); border-radius: 17px; background: var(--surface-soft); }
.security-card h3 { margin: 0 0 4px; }
.security-card-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.security-card-heading > div { min-width: 0; }
.security-card-heading .status-pill { flex: 0 0 auto; }
.status-pill.status-success { border-color: #a9d6ba; background: #e3f5ea; color: #155c39; }
.status-pill.status-warning { border-color: #e5bf78; background: #fff4dc; color: #7a551c; }
.compact-security-form { max-width: 560px; }
.security-fact { margin: 0; padding: 12px 14px; border-radius: 12px; background: #fff; border: 1px solid var(--line); color: var(--muted); }
.security-details { border-top: 1px solid var(--line); padding-top: 12px; }
.security-details summary { cursor: pointer; font-weight: 800; color: var(--primary-dark); }
.security-details[open] summary { margin-bottom: 15px; }
.danger-details summary { color: var(--danger); }
.mfa-setup-grid { display: grid; grid-template-columns: minmax(210px, 250px) minmax(0, 1fr); gap: 22px; align-items: start; }
.mfa-qr-wrap { display: grid; gap: 10px; justify-items: center; text-align: center; }
.mfa-qr-wrap small { color: var(--muted); line-height: 1.45; }
.mfa-qr { display: block; width: min(240px, 100%); height: auto; padding: 8px; border: 1px solid var(--line); border-radius: 15px; background: #fff; }
.mfa-qr-placeholder { display: grid; place-items: center; width: min(240px, 100%); aspect-ratio: 1; padding: 18px; border: 1px dashed var(--line-strong, #a9b8af); border-radius: 15px; background: #fff; color: var(--muted); font-weight: 800; }
.secret-copy-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 11px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.secret-copy-row code { overflow-wrap: anywhere; letter-spacing: .08em; }
.recovery-code-card { border-color: #a9d6ba; background: #f2fbf5; }
.mfa-recovery-codes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 14px; margin: 0; padding: 0; list-style: none; }
.mfa-recovery-codes li { padding: 9px 11px; border: 1px solid #cbe5d4; border-radius: 10px; background: #fff; text-align: center; }
.mfa-recovery-codes code { font-size: 1rem; letter-spacing: .08em; }
@media (max-width: 720px) {
    .security-intro { position: static; }
    .mfa-setup-grid { grid-template-columns: 1fr; }
    .security-card-heading { align-items: stretch; flex-direction: column; }
    .security-card-heading .status-pill { align-self: flex-start; }
}
@media (max-width: 460px) {
    .security-card { padding: 16px; }
    .mfa-recovery-codes { grid-template-columns: 1fr; }
    .secret-copy-row { align-items: stretch; flex-direction: column; }
    .secret-copy-row .button { width: 100%; }
}

/* 7.1.0: aktive Sitzungen, Login-Drosselung und Sicherheitsprotokoll */
.active-session-list { display: grid; gap: 10px; }
.active-session-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: start; padding: 15px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.active-session-item.is-current { border-color: #a9d6ba; background: #f3fbf6; }
.active-session-main { min-width: 0; display: grid; gap: 5px; }
.active-session-title { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.active-session-main p, .active-session-main small { margin: 0; }
.active-session-main small { color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.session-revoke-details { min-width: 150px; border-top: 0; padding-top: 0; }
.session-revoke-details summary { text-align: right; }
.security-event-list { list-style: none; display: grid; gap: 0; margin: 0; padding: 0; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: #fff; }
.security-event-item { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; padding: 13px 15px; border-bottom: 1px solid var(--line); }
.security-event-item:last-child { border-bottom: 0; }
.security-event-item > div { min-width: 0; display: grid; gap: 3px; }
.security-event-item span, .security-event-item time { color: var(--muted); font-size: .8rem; }
.security-event-item time { flex: 0 0 auto; white-space: nowrap; }
.security-event-item.severity-warning { box-shadow: inset 4px 0 0 #d99a2b; }
.security-event-item.severity-critical { box-shadow: inset 4px 0 0 var(--danger); }
@media (max-width: 680px) {
    .active-session-item { grid-template-columns: 1fr; }
    .session-revoke-details { min-width: 0; }
    .session-revoke-details summary { text-align: left; }
    .security-event-item { display: grid; gap: 7px; }
    .security-event-item time { white-space: normal; }
}


/* 7.2.0: Darstellung, sichere PWA-Aktualisierung und Offline-Fallback */
html[data-theme="dark"] {
    --bg: #0f1713;
    --surface: #17231d;
    --surface-soft: #1d2c24;
    --text: #edf5ef;
    --muted: #a9bcb0;
    --line: #33463a;
    --primary: #65c49a;
    --primary-dark: #98dfbd;
    --accent: #f1b66d;
    --danger: #ff9b9b;
    --shadow: 0 18px 45px rgba(0, 0, 0, .3);
    color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
    html[data-theme="system"] {
        --bg: #0f1713;
        --surface: #17231d;
        --surface-soft: #1d2c24;
        --text: #edf5ef;
        --muted: #a9bcb0;
        --line: #33463a;
        --primary: #65c49a;
        --primary-dark: #98dfbd;
        --accent: #f1b66d;
        --danger: #ff9b9b;
        --shadow: 0 18px 45px rgba(0, 0, 0, .3);
        color-scheme: dark;
    }
}
html[data-theme="dark"] .site-header,
html[data-theme="system"] .site-header { background: color-mix(in srgb, var(--bg) 92%, transparent); border-bottom-color: var(--line); }
html[data-theme="dark"] .empty-state,
html[data-theme="dark"] .active-session-item.is-current,
html[data-theme="dark"] .recovery-code-card,
html[data-theme="dark"] .flash-success,
html[data-theme="dark"] .flash-warning,
html[data-theme="dark"] .flash-error,
html[data-theme="dark"] .status-pill,
html[data-theme="dark"] .chip,
html[data-theme="dark"] .seasonality-columns > div,
html[data-theme="system"] .empty-state,
html[data-theme="system"] .active-session-item.is-current,
html[data-theme="system"] .recovery-code-card,
html[data-theme="system"] .flash-success,
html[data-theme="system"] .flash-warning,
html[data-theme="system"] .flash-error,
html[data-theme="system"] .status-pill,
html[data-theme="system"] .chip,
html[data-theme="system"] .seasonality-columns > div {
    background: color-mix(in srgb, var(--surface) 84%, var(--primary) 16%);
    color: var(--text);
    border-color: var(--line);
}
@media (prefers-color-scheme: light) {
    html[data-theme="system"] .active-session-item.is-current { background: #f3fbf6; }
}
html[data-text-scale="large"] { font-size: 112.5%; }
html[data-density="compact"] { --radius: 15px; }
html[data-density="compact"] .main-content { padding-top: 28px; padding-bottom: 52px; }
html[data-density="compact"] .panel { padding: 20px; }
html[data-density="compact"] .section-block { padding-top: 32px; }
html[data-density="compact"] .recipe-grid { gap: 13px; }
html[data-density="compact"] .recipe-card-body { padding: 13px; }
html[data-density="compact"] .security-card { padding: 15px; gap: 12px; }
html[data-motion="reduce"] { scroll-behavior: auto; }
html[data-motion="reduce"] *,
html[data-motion="reduce"] *::before,
html[data-motion="reduce"] *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
@media (prefers-reduced-motion: reduce) {
    html[data-motion="full"] { scroll-behavior: auto; }
    html[data-motion="full"] *,
    html[data-motion="full"] *::before,
    html[data-motion="full"] *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}
.appearance-settings { margin-top: 24px; display: grid; grid-template-columns: minmax(220px, .7fr) minmax(280px, 1fr); gap: 28px; align-items: start; }
.appearance-form { min-width: 0; }
.appearance-motion-option { align-content: center; min-height: 48px; margin-top: 25px; }
.session-actions { min-width: 180px; display: grid; gap: 10px; }
.session-rename-details { border-top: 0; padding-top: 0; }
.session-rename-details summary { text-align: right; }
.pwa-update { position: fixed; z-index: 1001; right: 16px; bottom: max(16px, env(safe-area-inset-bottom)); width: min(430px, calc(100% - 32px)); display: flex; align-items: center; gap: 10px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); box-shadow: var(--shadow); }
.pwa-update[hidden] { display: none; }
.pwa-update span { flex: 1; font-weight: 750; }
.pwa-update button { border: 0; border-radius: 9px; padding: 8px 10px; background: var(--primary); color: #fff; font-weight: 750; }
.pwa-update [data-pwa-update-dismiss] { background: transparent; color: var(--muted); }
@media (max-width: 720px) {
    .appearance-settings { grid-template-columns: 1fr; }
    .appearance-motion-option { margin-top: 0; }
    .session-actions { min-width: 0; }
    .session-rename-details summary { text-align: left; }
    .pwa-update { left: 12px; right: 12px; bottom: calc(76px + env(safe-area-inset-bottom)); width: auto; flex-wrap: wrap; }
}

/* 7.3.0: private calendar feed and privacy controls */
.calendar-feed-settings, .privacy-settings { margin-top: 24px; }
.calendar-feed-secret { display: grid; gap: 12px; }
.calendar-feed-copy-row { align-items: stretch; }
.calendar-feed-copy-row code { min-width: 0; overflow-wrap: anywhere; word-break: break-all; }
.calendar-feed-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 16px; }
.security-fact-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.privacy-settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.danger-zone { border-color: color-mix(in srgb, var(--danger) 32%, var(--line)); }
.danger-zone .security-card-heading h3 { color: var(--danger); }

@media (max-width: 760px) {
    .calendar-feed-actions, .security-fact-grid, .privacy-settings-grid { grid-template-columns: 1fr; }
    .calendar-feed-copy-row { grid-template-columns: 1fr; }
    .calendar-feed-copy-row .button { width: 100%; }
}

/* 7.4.0: globale Schnellsuche, Rezeptverlauf und direktes Einplanen */
.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; }
.header-search {
    margin-left: auto; min-height: 42px; display: inline-flex; align-items: center; gap: 8px;
    border: 1px solid var(--line); border-radius: 13px; padding: 0 11px;
    background: var(--surface); color: var(--muted); font: inherit; font-weight: 750; cursor: pointer;
}
.header-search:hover { border-color: var(--primary); color: var(--primary-dark); background: var(--surface-soft); }
.header-search kbd, .quick-search-input-wrap kbd { border: 1px solid var(--line); border-bottom-width: 2px; border-radius: 7px; padding: 2px 6px; background: var(--surface-soft); color: var(--muted); font: inherit; font-size: .7rem; }
.header-notification { margin-left: 0; }
.quick-search-overlay {
    position: fixed; inset: 0; z-index: 1500; display: grid; align-items: start; justify-items: center;
    padding: max(7vh, 48px) 16px 24px; background: rgba(10, 20, 15, .58); backdrop-filter: blur(8px);
}
.quick-search-overlay[hidden] { display: none; }
.quick-search-dialog { width: min(720px, 100%); max-height: min(82dvh, 760px); overflow: hidden; display: grid; grid-template-rows: auto auto auto auto minmax(0, 1fr); gap: 14px; padding: 22px; border: 1px solid var(--line); border-radius: 22px; background: var(--surface); box-shadow: 0 28px 90px rgba(0, 0, 0, .28); }
.quick-search-header { display: flex; justify-content: space-between; gap: 16px; align-items: start; }
.quick-search-header h2 { margin: 0; }
.quick-search-close { width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); color: var(--text); font-size: 1.55rem; cursor: pointer; }
.quick-search-input-wrap { position: relative; display: block; }
.quick-search-input-wrap input { min-height: 54px; padding-right: 62px; font-size: 1.05rem; }
.quick-search-input-wrap kbd { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); }
.quick-search-links { display: flex; flex-wrap: wrap; gap: 8px; }
.quick-search-links a { border: 1px solid var(--line); border-radius: 999px; padding: 7px 11px; color: var(--muted); font-size: .82rem; font-weight: 750; }
.quick-search-links a:hover { border-color: var(--primary); color: var(--primary-dark); }
.quick-search-status { color: var(--muted); font-size: .82rem; min-height: 1.25rem; }
.quick-search-results { min-height: 0; overflow-y: auto; display: grid; align-content: start; gap: 8px; padding-right: 3px; }
.quick-search-result { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 12px; align-items: center; padding: 9px; border: 1px solid transparent; border-radius: 14px; color: var(--text); }
.quick-search-result:hover, .quick-search-result.is-active { border-color: var(--primary); background: var(--surface-soft); }
.quick-search-result img { width: 64px; height: 52px; object-fit: cover; border-radius: 10px; background: var(--surface-soft); }
.quick-search-result > span { min-width: 0; display: grid; gap: 2px; }
.quick-search-result strong, .quick-search-result small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.quick-search-result small { color: var(--muted); }
.quick-search-summary { font-size: .76rem; }
html.quick-search-open { overflow: hidden; }
.mobile-nav button { min-width: 0; min-height: 54px; border: 0; border-radius: 13px; display: grid; place-items: center; align-content: center; gap: 1px; background: transparent; color: var(--muted); font: inherit; font-weight: 750; }
.mobile-nav button span { font-size: 1.25rem; line-height: 1; }
.mobile-nav button small { font-size: .68rem; }
.recipe-quick-plan { margin: 24px 0; }
.quick-plan-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: end; }
.quick-plan-form label { display: grid; gap: 7px; font-weight: 750; }
.compact-empty-state { padding: 18px; }

@media (max-width: 900px) {
    .header-search span:nth-child(2), .header-search kbd { display: none; }
    .header-search { width: 42px; justify-content: center; padding: 0; }
}
@media (max-width: 720px) {
    .header-search { margin-left: auto; }
    .quick-search-overlay { padding: calc(env(safe-area-inset-top) + 10px) 8px calc(env(safe-area-inset-bottom) + 10px); align-items: stretch; }
    .quick-search-dialog { max-height: none; height: 100%; border-radius: 18px; padding: 17px; }
    .quick-search-result { grid-template-columns: 54px minmax(0, 1fr); }
    .quick-search-result img { width: 54px; height: 48px; }
    .quick-search-summary { display: none; }
    .quick-plan-form { grid-template-columns: 1fr; }
    .quick-plan-form .button { width: 100%; }
}

/* 7.5.0: persönliche Rezept-Schlagwörter */
.chip-personal-tag { background: color-mix(in srgb, var(--accent) 12%, var(--surface)); border-color: color-mix(in srgb, var(--accent) 30%, var(--line)); color: var(--text); }
.recipe-tag-form { display: grid; gap: 18px; }
.recipe-tag-options { display: flex; flex-wrap: wrap; gap: 10px; }
.tag-check { position: relative; cursor: pointer; }
.tag-check input { position: absolute; opacity: 0; pointer-events: none; }
.tag-check span, .tag-chip-link { display: inline-flex; align-items: center; min-height: 38px; padding: 8px 13px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface-soft); color: var(--text); font-weight: 750; text-decoration: none; }
.tag-check input:checked + span { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 16%, var(--surface)); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 18%, transparent); }
.tag-check input:focus-visible + span, .tag-chip-link:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 40%, transparent); outline-offset: 2px; }
.recipe-tag-create { display: grid; grid-template-columns: minmax(220px, 1fr) auto; gap: 12px; align-items: end; }
.recipe-tag-create label { display: grid; gap: 6px; }
.recipe-tag-management-list { display: grid; gap: 10px; }
.recipe-tag-management-row { display: grid; grid-template-columns: minmax(150px, 1fr) auto auto; align-items: center; gap: 14px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-soft); }
.recipe-tag-management-row > span { color: var(--muted); font-variant-numeric: tabular-nums; }

/* 7.5.0: fortsetzbarer Kochmodus */
.cook-mode-footer { flex-wrap: wrap; }
.cook-mode-navigation { display: flex; gap: 12px; margin-left: auto; }
.cook-mode-navigation .button { min-width: 140px; }

@media (max-width: 680px) {
    .recipe-tag-create { grid-template-columns: 1fr; }
    .recipe-tag-management-row { grid-template-columns: minmax(0, 1fr) auto; }
    .recipe-tag-management-row form { grid-column: 1 / -1; }
    .recipe-tag-management-row form .button { width: 100%; }
    .cook-mode-footer > [data-cook-reset] { width: 100%; }
    .cook-mode-navigation { width: 100%; margin-left: 0; }
    .cook-mode-navigation .button { flex: 1; min-width: 0; }
}

/* 7.5.0: druckoptimierte Rezeptansicht */
@media print {
    @page { margin: 14mm; }
    html, body { background: #fff !important; color: #000 !important; font-size: 10.5pt; }
    body > header, body > footer, nav, .site-header, .site-footer, .flash-stack, .pwa-update-banner,
    .recipe-primary-actions, .recipe-quick-plan, .recipe-seasonality, .recipe-personal,
    .recipe-quality-report, .recipe-tags-panel, .recipe-collections-panel, .cook-mode,
    .source-warning, .button, form { display: none !important; }
    main, .page-shell, .content-shell, .recipe-detail { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; box-shadow: none !important; }
    .recipe-detail-hero { display: grid !important; grid-template-columns: 70mm 1fr !important; gap: 10mm !important; align-items: start; }
    .recipe-detail-hero > img { width: 70mm !important; height: auto !important; max-height: 55mm; object-fit: cover; border-radius: 6mm; }
    .recipe-detail h1 { font-size: 22pt; margin-top: 0; }
    .recipe-content-grid { display: grid !important; grid-template-columns: minmax(55mm, .8fr) 1.2fr !important; gap: 10mm !important; align-items: start; }
    .panel, .ingredients-panel, .steps-panel { border: 0 !important; box-shadow: none !important; padding: 0 !important; background: transparent !important; break-inside: avoid; }
    .ingredient-check-label input, .ingredient-check-reset, .servings-control { display: none !important; }
    .ingredient-list li, .steps-list li { break-inside: avoid; }
    .chip { border: 1px solid #777 !important; background: transparent !important; color: #000 !important; }
    a { color: #000 !important; text-decoration: none !important; }
}

/* 7.6.0: Vorrats-CSV und zurückstellbare Hinweise */
.pantry-transfer-panel { display: grid; gap: 18px; margin-bottom: 22px; }
.pantry-import-form { align-items: end; }
.pantry-import-form label { min-width: min(100%, 320px); }
.notification-actions { align-items: center; }
.notification-snooze-form { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.notification-snooze-form select { min-width: 150px; min-height: 38px; }
@media (max-width: 680px) {
    .pantry-transfer-panel .section-heading { align-items: stretch; }
    .pantry-transfer-panel .button, .pantry-import-form, .pantry-import-form label, .pantry-import-form .button { width: 100%; }
    .notification-snooze-form { width: 100%; display: grid; grid-template-columns: 1fr; }
    .notification-snooze-form select, .notification-snooze-form .button { width: 100%; }
}

/* 7.7.0: Vorratsautomation, Lagerorte und reversible Koch-Abbuchungen */
.pantry-automation-panel { display: grid; gap: 16px; margin-bottom: 22px; border-color: color-mix(in srgb, var(--primary) 28%, var(--line)); }
.pantry-consumption-option { padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); }
.pantry-consumption-preview { border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; background: var(--surface-soft); }
.pantry-consumption-preview summary { cursor: pointer; color: var(--primary); font-weight: 800; }
.pantry-consumption-preview ul { margin: 10px 0 8px; padding-left: 20px; }
.pantry-consumption-preview small { color: var(--muted); }
.pantry-consumption-history { margin-top: 24px; }
.pantry-consumption-list { display: grid; gap: 10px; }
.pantry-consumption-row { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.pantry-consumption-row > div { display: grid; gap: 3px; min-width: 0; }
.pantry-consumption-row span, .pantry-consumption-row small { color: var(--muted); }
.pantry-consumption-row p { margin: 5px 0 0; overflow-wrap: anywhere; }
.pantry-consumption-row.is-undone { opacity: .72; background: var(--surface-soft); }

@media (min-width: 861px) {
    .pantry-edit-form { grid-template-columns: repeat(4, minmax(110px, 1fr)) auto; }
}
@media (max-width: 680px) {
    .pantry-consumption-row { align-items: stretch; flex-direction: column; }
    .pantry-consumption-row form, .pantry-consumption-row .button { width: 100%; }
}

/* 7.8.0: grafische CO2e-Klimaansicht */
.climate-page-heading { align-items: end; }
.climate-hero-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(280px, .75fr); gap: 20px; margin-bottom: 22px; }
.climate-current-card, .climate-reference-card, .climate-history-panel, .climate-active-plan, .climate-reference-table, .climate-method-panel { overflow: hidden; }
.climate-current-card { background: radial-gradient(circle at 85% 0%, color-mix(in srgb, var(--accent) 18%, transparent), transparent 42%), var(--surface); }
.climate-gauge-wrap { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 26px; align-items: center; margin-top: 16px; }
.climate-gauge { --gauge-color: #317e58; position: relative; width: 190px; aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; background: conic-gradient(var(--gauge-color) min(var(--climate-value), 100%), color-mix(in srgb, var(--line) 70%, transparent) 0); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--line) 70%, transparent), 0 18px 42px color-mix(in srgb, var(--text) 10%, transparent); }
.climate-gauge::before { content: ''; position: absolute; inset: 19px; border-radius: 50%; background: var(--surface); box-shadow: inset 0 0 0 1px var(--line); }
.climate-gauge > div { position: relative; z-index: 1; display: grid; justify-items: center; gap: 2px; text-align: center; }
.climate-gauge strong { font-size: clamp(2rem, 5vw, 3.25rem); line-height: 1; font-variant-numeric: tabular-nums; }
.climate-gauge span { max-width: 110px; color: var(--muted); font-size: .83rem; }
.climate-gauge-above { --gauge-color: #b45d2a; }
.climate-gauge-equal { --gauge-color: #9b7b22; }
.climate-current-copy { display: grid; gap: 8px; }
.climate-current-copy > strong { font-size: clamp(1.2rem, 2.4vw, 1.65rem); line-height: 1.25; }
.climate-current-copy p { margin: 0; }
.climate-projection { margin-top: 6px !important; padding: 12px 14px; border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--line)); border-radius: 14px; background: color-mix(in srgb, var(--accent) 8%, var(--surface-soft)); }
.climate-projection strong { display: block; font-size: 1.4rem; }
.climate-reference-card { display: grid; align-content: start; gap: 12px; background: linear-gradient(150deg, color-mix(in srgb, var(--accent) 12%, var(--surface)), var(--surface)); }
.climate-reference-card h2 { margin: 0; }
.climate-reference-numbers { display: grid; gap: 10px; }
.climate-reference-numbers > div { display: grid; gap: 2px; padding: 14px; border-radius: 16px; background: var(--surface-soft); border: 1px solid var(--line); }
.climate-reference-numbers strong { font-size: 1.6rem; font-variant-numeric: tabular-nums; }
.climate-reference-numbers span { color: var(--muted); font-size: .88rem; }
.climate-week-chart { display: grid; grid-template-columns: repeat(12, minmax(34px, 1fr)); gap: 9px; align-items: end; min-height: 255px; padding: 20px 8px 0; overflow-x: auto; }
.climate-week-column { min-width: 34px; display: grid; gap: 5px; justify-items: center; }
.climate-week-column > strong { font-size: .78rem; font-variant-numeric: tabular-nums; }
.climate-week-column > small { color: var(--muted); font-size: .72rem; white-space: nowrap; }
.climate-week-plot { position: relative; width: min(34px, 100%); height: 180px; border-radius: 11px 11px 4px 4px; background: color-mix(in srgb, var(--line) 35%, transparent); overflow: hidden; }
.climate-week-bar { position: absolute; inset-inline: 5px; bottom: 0; min-height: 3px; border-radius: 8px 8px 3px 3px; background: linear-gradient(to top, color-mix(in srgb, var(--accent) 88%, #123), var(--accent)); }
.climate-week-bar-above { background: linear-gradient(to top, #9c451d, #d97a3d); }
.climate-week-bar-equal { background: linear-gradient(to top, #7c6519, #c7a436); }
.climate-week-reference { position: absolute; z-index: 2; left: 2px; right: 2px; height: 2px; background: var(--text); box-shadow: 0 0 0 2px var(--surface); }
.climate-plan-summary-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.climate-plan-summary-grid > div { display: grid; gap: 3px; padding: 14px; border: 1px solid var(--line); border-radius: 15px; background: var(--surface-soft); }
.climate-plan-summary-grid strong { font-size: 1.2rem; }
.climate-plan-summary-grid span { color: var(--muted); font-size: .86rem; }
.climate-plan-summary-grid .is-below { border-color: color-mix(in srgb, #2d8a57 45%, var(--line)); }
.climate-plan-summary-grid .is-above { border-color: color-mix(in srgb, #b45d2a 45%, var(--line)); }
.climate-profile-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.climate-profile-card { display: grid; gap: 9px; padding: 15px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface-soft); }
.climate-profile-card.is-selected { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.climate-profile-card > div:first-child { display: flex; justify-content: space-between; gap: 12px; }
.climate-profile-card > div:first-child span, .climate-profile-card small { color: var(--muted); }
.climate-profile-track { height: 11px; border-radius: 999px; background: color-mix(in srgb, var(--line) 60%, transparent); overflow: hidden; }
.climate-profile-track span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 70%, #255), var(--accent)); }
.climate-source-list { display: grid; gap: 9px; padding: 0; list-style: none; }
.climate-source-list li { display: grid; gap: 2px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); }
.climate-source-list a { font-weight: 760; }
.climate-source-list span { color: var(--muted); font-size: .86rem; }
.climate-reference-setting { display: grid; gap: 9px; margin-top: 16px; padding: 14px; border-radius: 16px; border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--line)); background: color-mix(in srgb, var(--accent) 7%, var(--surface-soft)); }
.recipe-climate-comparison { display: grid; grid-template-columns: minmax(120px, 190px) minmax(0, 1fr) auto; align-items: center; gap: 16px; margin-top: 16px; padding: 14px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface-soft); }
.recipe-climate-comparison p { margin: 4px 0 0; color: var(--muted); }
.recipe-climate-meter { position: relative; height: 13px; border-radius: 999px; background: linear-gradient(90deg, color-mix(in srgb, #2d8a57 18%, var(--surface)), color-mix(in srgb, #b45d2a 18%, var(--surface))); overflow: hidden; }
.recipe-climate-meter::after { content: ''; position: absolute; left: 62.5%; top: 0; bottom: 0; width: 2px; background: var(--text); opacity: .55; }
.recipe-climate-meter span { display: block; width: min(var(--climate-value), 100%); height: 100%; border-radius: inherit; background: var(--accent); }
.climate-comparison-above .recipe-climate-meter span { background: #c66a31; }
.plan-climate-comparison { display: grid; grid-template-columns: minmax(240px, 1fr) minmax(240px, 1fr); gap: 18px; align-items: center; margin-top: 18px; padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface-soft); }
.plan-climate-comparison > div:first-child { display: grid; gap: 4px; }
.plan-climate-comparison > div:first-child > strong { font-size: 1.25rem; }
.plan-climate-comparison > div:first-child > span { color: var(--muted); }
.plan-climate-scale { position: relative; height: 18px; border-radius: 999px; background: color-mix(in srgb, var(--line) 55%, transparent); overflow: visible; }
.plan-climate-scale i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #3d9a68, var(--accent)); }
.climate-comparison-above .plan-climate-scale i { background: linear-gradient(90deg, #d69555, #b65426); }
.plan-climate-reference-marker { position: absolute; right: 0; top: -23px; color: var(--muted); font-size: .75rem; }
.plan-climate-reference-marker::after { content: ''; position: absolute; right: 0; top: 20px; width: 2px; height: 22px; background: var(--text); opacity: .55; }
.plan-climate-days { display: grid; grid-template-columns: repeat(7, minmax(44px, 1fr)); gap: 10px; align-items: end; margin-top: 18px; padding-top: 8px; min-height: 165px; }
.plan-climate-day { display: grid; justify-items: center; gap: 4px; }
.plan-climate-day-plot { position: relative; width: min(52px, 100%); height: 105px; border-radius: 12px 12px 4px 4px; overflow: hidden; background: color-mix(in srgb, var(--line) 40%, transparent); }
.plan-climate-day-bar { position: absolute; inset-inline: 7px; bottom: 0; border-radius: 8px 8px 3px 3px; background: linear-gradient(to top, color-mix(in srgb, var(--accent) 85%, #123), var(--accent)); }
.plan-climate-day-reference { position: absolute; z-index: 2; left: 3px; right: 3px; height: 2px; background: var(--text); box-shadow: 0 0 0 2px var(--surface); }
.plan-climate-day > strong { font-size: .8rem; }
.plan-climate-day > small { color: var(--muted); }

@media (max-width: 860px) {
    .climate-hero-grid { grid-template-columns: 1fr; }
    .climate-profile-grid { grid-template-columns: 1fr; }
    .climate-plan-summary-grid { grid-template-columns: 1fr; }
    .plan-climate-comparison { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
    .climate-gauge-wrap { grid-template-columns: 1fr; justify-items: center; text-align: center; }
    .climate-current-copy { justify-items: center; }
    .recipe-climate-comparison { grid-template-columns: 1fr; align-items: stretch; }
    .recipe-climate-comparison .text-link { justify-self: start; }
    .plan-climate-days { overflow-x: auto; grid-template-columns: repeat(7, 52px); justify-content: start; }
    .climate-week-chart { grid-template-columns: repeat(12, 42px); justify-content: start; }
}

@media print {
    .climate-method-panel, .climate-page-heading .button, .climate-source-list { display: none !important; }
    .climate-gauge, .climate-week-bar, .plan-climate-day-bar, .climate-profile-track span { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}

/* 7.8.0: geführte Vorratsinventur */
.pantry-inventory-form{display:grid;gap:1rem}.pantry-inventory-list{display:grid;gap:.55rem}.pantry-inventory-row{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(11rem,15rem);align-items:center;gap:.85rem;padding:.8rem;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface-soft)}.pantry-inventory-row>input[type="checkbox"]{width:1.2rem;height:1.2rem}.pantry-inventory-name{display:grid;gap:.15rem;min-width:0}.pantry-inventory-name small{color:var(--muted)}.pantry-inventory-count{display:grid;grid-template-columns:minmax(6rem,1fr) auto;align-items:center;gap:.5rem}.pantry-inventory-count input{width:100%}
@media (max-width:720px){.pantry-inventory-row{grid-template-columns:auto minmax(0,1fr)}.pantry-inventory-count{grid-column:2}}
.climate-projection{display:grid;gap:3px}.climate-projection b{font-size:.95rem}.climate-projection small{color:var(--muted)}.climate-projection-below{border-color:color-mix(in srgb,#2d8a57 42%,var(--line));background:color-mix(in srgb,#2d8a57 8%,var(--surface-soft))}.climate-projection-above{border-color:color-mix(in srgb,#b45d2a 42%,var(--line));background:color-mix(in srgb,#b45d2a 8%,var(--surface-soft))}

/* 7.8.0: CSP-sichere SVG- und Progress-Klimagrafiken */
.climate-gauge{background:none;box-shadow:0 18px 42px color-mix(in srgb,var(--text) 10%,transparent)}
.climate-gauge::before{display:none}
.climate-gauge-svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.climate-gauge-track,.climate-gauge-value{fill:none;stroke-width:12}
.climate-gauge-track{stroke:color-mix(in srgb,var(--line) 70%,transparent)}
.climate-gauge-value{stroke:var(--gauge-color);stroke-linecap:round}
.climate-gauge>div{padding:30px;border-radius:50%;background:var(--surface);box-shadow:inset 0 0 0 1px var(--line)}
.climate-week-svg,.plan-climate-day-svg{display:block;width:100%;height:100%;overflow:visible}
.climate-week-reference,.plan-climate-day-reference{position:static;stroke:var(--text);stroke-width:2;filter:drop-shadow(0 0 1px var(--surface))}
.climate-week-bar,.plan-climate-day-bar{position:static;fill:var(--accent)}
.climate-week-bar-above{fill:#d97a3d}.climate-week-bar-equal{fill:#c7a436}
.climate-profile-track,.recipe-climate-progress,.plan-climate-progress{appearance:none;-webkit-appearance:none;border:0;overflow:hidden;background:color-mix(in srgb,var(--line) 60%,transparent)}
.climate-profile-track{display:block;width:100%;height:11px;border-radius:999px}
.climate-profile-track::-webkit-progress-bar,.recipe-climate-progress::-webkit-progress-bar,.plan-climate-progress::-webkit-progress-bar{background:color-mix(in srgb,var(--line) 60%,transparent);border-radius:999px}
.climate-profile-track::-webkit-progress-value{background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 70%,#255),var(--accent));border-radius:999px}
.climate-profile-track::-moz-progress-bar{background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 70%,#255),var(--accent));border-radius:999px}
.recipe-climate-progress{width:100%;height:13px;border-radius:999px}
.recipe-climate-progress::-webkit-progress-value,.plan-climate-progress::-webkit-progress-value{background:linear-gradient(90deg,#3d9a68,var(--accent));border-radius:999px}
.recipe-climate-progress::-moz-progress-bar,.plan-climate-progress::-moz-progress-bar{background:linear-gradient(90deg,#3d9a68,var(--accent));border-radius:999px}
.climate-comparison-above .recipe-climate-progress::-webkit-progress-value,.climate-comparison-above .plan-climate-progress::-webkit-progress-value{background:linear-gradient(90deg,#d69555,#b65426)}
.climate-comparison-above .recipe-climate-progress::-moz-progress-bar,.climate-comparison-above .plan-climate-progress::-moz-progress-bar{background:linear-gradient(90deg,#d69555,#b65426)}
.plan-climate-progress{display:block;width:100%;height:18px;border-radius:999px}
@media print{.climate-gauge-value,.climate-week-bar,.plan-climate-day-bar,.climate-profile-track,.recipe-climate-progress,.plan-climate-progress{print-color-adjust:exact;-webkit-print-color-adjust:exact}}


/* 7.9.0: persönliche Klimaziele, Serien und Zutaten-Hotspots */
.climate-action-row{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}.climate-goal-panel{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(0,1.2fr);gap:20px;align-items:center}.climate-goal-meter{display:grid;gap:10px}.climate-goal-meter progress{width:100%;height:18px}.climate-goal-copy{display:grid;gap:6px}.climate-goal-copy strong{font-size:clamp(1.45rem,3vw,2.25rem);line-height:1.1}.climate-goal-copy p{margin:0}.climate-stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.climate-stat-card{display:grid;gap:4px;padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--surface-soft)}.climate-stat-card strong{font-size:1.45rem;font-variant-numeric:tabular-nums}.climate-stat-card span{color:var(--muted);font-size:.86rem}.climate-pattern-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.85fr);gap:20px}.climate-band-list{display:grid;gap:10px}.climate-band-row{display:grid;grid-template-columns:110px minmax(0,1fr) 64px;gap:10px;align-items:center}.climate-band-row progress{width:100%;height:12px}.climate-hotspot-list{display:grid;gap:12px}.climate-hotspot-item{display:grid;grid-template-columns:minmax(120px,.65fr) minmax(180px,1fr);gap:14px;padding:14px;border:1px solid var(--line);border-radius:15px;background:var(--surface-soft)}.climate-hotspot-heading{display:grid;gap:3px}.climate-hotspot-heading strong{font-size:1.05rem}.climate-hotspot-heading span,.climate-hotspot-item p{color:var(--muted);font-size:.86rem}.climate-hotspot-detail{display:grid;gap:7px}.climate-hotspot-detail progress{width:100%;height:11px}.climate-hotspot-detail p{margin:0}.plan-climate-goal{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-top:10px;padding:13px 16px;border:1px solid var(--line);border-radius:14px;background:var(--surface-soft)}.plan-climate-goal>div{display:grid;gap:2px}.plan-climate-goal>span{color:var(--muted);text-align:right}.plan-climate-goal.climate-comparison-below{border-color:color-mix(in srgb,#2d8a57 45%,var(--line))}.plan-climate-goal.climate-comparison-above{border-color:color-mix(in srgb,#b45d2a 45%,var(--line))}
@media(max-width:900px){.climate-goal-panel,.climate-pattern-grid{grid-template-columns:1fr}.climate-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.climate-action-row{justify-content:stretch}.climate-action-row .button{flex:1}.climate-stats-grid{grid-template-columns:1fr 1fr}.climate-hotspot-item{grid-template-columns:1fr}.climate-band-row{grid-template-columns:90px minmax(0,1fr) 54px}.plan-climate-goal{align-items:flex-start;flex-direction:column}.plan-climate-goal>span{text-align:left}}

.climate-plan-summary-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}

/* 8.0.0: handlungsorientierte Klima-Empfehlungen */
.climate-action-panel{display:grid;gap:18px}.climate-opportunity-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}.climate-opportunity-card{display:grid;gap:10px;padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--surface-soft)}.climate-opportunity-heading{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px}.climate-opportunity-heading span{color:var(--muted)}.climate-opportunity-saving{display:grid;gap:2px}.climate-opportunity-saving strong{font-size:1.35rem;color:var(--accent-strong)}.climate-opportunity-saving span,.climate-opportunity-card p{font-size:.88rem;color:var(--muted)}.climate-opportunity-card p{margin:0}.climate-alternative-heading{margin-top:6px}.climate-alternative-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}.climate-alternative-card{display:grid;grid-template-columns:120px minmax(0,1fr);gap:14px;overflow:hidden;border:1px solid var(--line);border-radius:17px;background:var(--surface-soft)}.climate-alternative-image{display:block;min-height:150px;background:var(--surface-muted)}.climate-alternative-image img{width:100%;height:100%;object-fit:cover}.climate-alternative-card>div{display:grid;align-content:center;gap:7px;padding:14px 14px 14px 0}.climate-alternative-card h4,.climate-alternative-card p{margin:0}.climate-alternative-card p{color:var(--muted);font-size:.88rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.climate-saving-label{font-size:.88rem;color:var(--accent-strong)}.climate-method-note{margin:0}.climate-swap-panel{display:grid;gap:16px}.climate-swap-list{display:grid;gap:10px}.climate-swap-card{display:grid;grid-template-columns:76px minmax(0,1fr) auto;align-items:center;gap:14px;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--surface-soft)}.climate-swap-date{display:grid;justify-items:center;gap:2px;padding:10px;border-radius:13px;background:var(--surface)}.climate-swap-date strong{font-size:1.1rem}.climate-swap-date span,.climate-swap-from,.climate-swap-copy small{color:var(--muted)}.climate-swap-copy{display:grid;gap:5px;min-width:0}.climate-swap-copy>strong{font-size:1.05rem}.climate-swap-from{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.climate-swap-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.climate-swap-actions form{margin:0}.climate-dashboard-swaps{margin-top:20px}
@media(max-width:760px){.climate-alternative-card{grid-template-columns:96px minmax(0,1fr)}.climate-alternative-card>div{padding:12px 12px 12px 0}.climate-swap-card{grid-template-columns:58px minmax(0,1fr)}.climate-swap-actions{grid-column:1/-1;justify-content:stretch}.climate-swap-actions .button,.climate-swap-actions form{flex:1}.climate-swap-actions form .button{width:100%}}
@media(max-width:520px){.climate-alternative-card{grid-template-columns:1fr}.climate-alternative-image{min-height:180px}.climate-alternative-card>div{padding:14px}.climate-opportunity-grid{grid-template-columns:1fr}.climate-swap-card{grid-template-columns:1fr}.climate-swap-date{grid-template-columns:auto auto;justify-content:start;gap:8px}.climate-swap-from{white-space:normal}}
@media print{.climate-swap-actions,.climate-action-panel .button{display:none!important}.climate-opportunity-card,.climate-alternative-card,.climate-swap-card{break-inside:avoid}}

/* 8.0.1: Argos-Bootstrap-Diagnose und APT-/venv-Härtung */
