*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{
  --bg:#faf9f6;--white:#fff;--ink:#1a1a2e;
  --accent:#c0392b;--accent-l:#fdf0ef;
  --border:#ebebeb;--border-s:#d5d5d5;
  --text:#111;--muted:#888;--subtle:#f4f3f0;
  --danger:#dc2626;--r:10px;--r-sm:8px;
  --max:1180px;
  --sh-sm:0 1px 4px rgba(0,0,0,.07);
  --sh-md:0 4px 20px rgba(0,0,0,.11);
  --sh-lg:0 20px 60px rgba(0,0,0,.18);
  --f:'Outfit',sans-serif;
}
html{scroll-behavior:smooth;overflow-x:hidden;}
body{font-family:var(--f);background:var(--bg);color:var(--text);overflow-x:hidden;-webkit-font-smoothing:antialiased;}
.hidden{display:none!important;}
img{display:block;max-width:100%;}
.container{max-width:var(--max);margin:0 auto;padding:0 1.25rem;}

/* Buttons */
button,label[class]{cursor:pointer;font-family:var(--f);border:none;transition:all .15s;}
.btn-ink{background:var(--ink);color:#fff;font-weight:600;padding:.62rem 1.3rem;border-radius:var(--r);font-size:.875rem;display:inline-flex;align-items:center;gap:.4rem;}
.btn-ink:hover{background:#2d2d4a;}
.btn-ink.full{width:100%;justify-content:center;}
.btn-ink-sm{background:var(--ink);color:#fff;font-weight:600;padding:.4rem .9rem;border-radius:var(--r);font-size:.78rem;}
.btn-ink-sm:hover{background:#2d2d4a;}
.btn-outline-sm{background:transparent;color:var(--text);border:1.5px solid var(--border-s);padding:.38rem .85rem;border-radius:var(--r);font-size:.78rem;font-weight:500;}
.btn-outline-sm:hover{border-color:var(--ink);}
.btn-outline-sm.full{width:100%;display:flex;align-items:center;justify-content:center;gap:.4rem;}
.btn-sm{background:transparent;color:var(--text);border:1.5px solid var(--border-s);padding:.35rem .75rem;border-radius:var(--r);font-size:.75rem;font-weight:500;display:inline-flex;align-items:center;gap:.3rem;white-space:nowrap;}
.btn-sm:hover{border-color:var(--ink);}
.btn-danger{color:var(--danger);border-color:var(--danger);}
.btn-danger:hover{background:var(--danger);color:#fff;}
.btn-dashed{background:transparent;border:1.5px dashed var(--border-s);color:var(--muted);padding:.5rem 1rem;border-radius:var(--r);font-size:.82rem;width:100%;font-family:var(--f);font-weight:500;}
.btn-dashed:hover{border-color:var(--accent);color:var(--accent);}

/* Nav */
#nav{position:sticky;top:0;z-index:80;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:2px solid var(--ink);}
.nav-inner{max-width:var(--max);margin:0 auto;display:flex;align-items:center;gap:.4rem;padding:0 1.25rem;height:56px;overflow:hidden;}
.nav-logo{background:transparent;border:none;font-size:1.05rem;font-weight:700;color:var(--ink);cursor:pointer;white-space:nowrap;flex-shrink:1;min-width:0;overflow:hidden;text-overflow:ellipsis;}
.nav-cats{display:flex;align-items:center;gap:.15rem;flex:1;overflow:hidden;}
.nav-cat-btn{background:transparent;color:var(--muted);border:none;padding:.32rem .65rem;border-radius:20px;font-size:.78rem;font-weight:500;white-space:nowrap;font-family:var(--f);cursor:pointer;}
.nav-cat-btn:hover{background:var(--subtle);color:var(--text);}
.nav-cat-btn.active{background:var(--ink);color:#fff;}
.nav-right{display:flex;align-items:center;gap:.3rem;flex-shrink:0;margin-left:auto;}
.nav-role{font-size:.68rem;color:var(--muted);background:var(--subtle);padding:.2rem .5rem;border-radius:20px;font-weight:500;}
.nav-icon-btn{background:transparent;border:none;color:var(--muted);padding:.38rem;display:flex;align-items:center;cursor:pointer;border-radius:var(--r);position:relative;}
.nav-icon-btn:hover{background:var(--subtle);color:var(--text);}
#nav-hamburger{display:none;}
.search-bar{background:var(--ink);padding:.55rem 1.25rem;}
.search-inner{max-width:var(--max);margin:0 auto;display:flex;align-items:center;gap:.55rem;}
.search-inner svg{color:rgba(255,255,255,.4);flex-shrink:0;}
.search-inner input{flex:1;background:transparent;border:none;color:#fff;font-family:var(--f);font-size:.9rem;outline:none;}
.search-inner input::placeholder{color:rgba(255,255,255,.38);}
#search-close-btn{background:transparent;border:none;color:rgba(255,255,255,.5);cursor:pointer;font-size:.9rem;}
.nav-mobile{background:var(--white);border-top:1px solid var(--border);padding:.9rem 1.25rem;display:flex;flex-direction:column;gap:.5rem;}
.mobile-search{width:100%;padding:.58rem 1rem;border:1.5px solid var(--border);border-radius:var(--r);font-family:var(--f);font-size:16px;background:var(--subtle);outline:none;color:var(--text);}
.mobile-search:focus{border-color:var(--ink);}
.mobile-cats{display:flex;flex-wrap:wrap;gap:.35rem;}
.mobile-auth{display:flex;flex-direction:column;gap:.35rem;padding-top:.45rem;border-top:1px solid var(--border);}

/* Slider */
.slider-wrap{max-width:var(--max);margin:1.25rem auto;padding:0 1.25rem;}
.slider{position:relative;overflow:hidden;background:#111;border-radius:16px;}
.slider-track{display:flex;transition:transform 1.4s cubic-bezier(.4,0,.2,1);will-change:transform;}
.slider-slide{min-width:100%;position:relative;cursor:pointer;overflow:hidden;}
.slider-slide img{width:100%;height:400px;object-fit:cover;display:block;transform:scale(1.0);transition:transform 9s linear;}
.slider-slide.active img{transform:scale(1.05);}
.slider-slide-ph{width:100%;height:400px;display:flex;align-items:center;justify-content:center;font-size:7rem;background:#1a1a1a;}
.slider-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.55) 0%,rgba(0,0,0,.1) 45%,transparent 100%);}
.slider-content{position:absolute;bottom:0;left:0;right:0;padding:1.75rem 2rem 1.5rem;}
.slider-cat{font-size:.65rem;font-weight:700;color:var(--accent);background:rgba(255,255,255,.1);backdrop-filter:blur(6px);padding:.22rem .65rem;border-radius:20px;display:inline-block;margin-bottom:.55rem;letter-spacing:.06em;text-transform:uppercase;}
.slider-title{font-size:clamp(1.4rem,3vw,2.1rem);font-weight:700;color:#fff;line-height:1.15;letter-spacing:-.02em;margin-bottom:.45rem;}
.slider-meta{font-size:.78rem;color:rgba(255,255,255,.65);display:flex;flex-wrap:wrap;gap:.4rem .85rem;margin-bottom:.75rem;}
.slider-cta{display:inline-flex;align-items:center;gap:.4rem;background:var(--white);color:var(--ink);font-size:.78rem;font-weight:600;padding:.45rem 1.1rem;border-radius:var(--r);}
.slider-arrow{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.14);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.2);color:#fff;width:40px;height:40px;border-radius:50%;font-size:1.4rem;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:5;transition:background .15s;}
.slider-arrow:hover{background:rgba(255,255,255,.28);}
.slider-prev{left:.85rem;}
.slider-next{right:.85rem;}
.slider-dots{position:absolute;bottom:.85rem;left:50%;transform:translateX(-50%);display:flex;gap:.35rem;z-index:5;}
.slider-dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.35);border:none;cursor:pointer;padding:0;transition:all .2s;}
.slider-dot.active{background:#fff;width:18px;border-radius:3px;}
.slider-pause{position:absolute;top:.75rem;right:.75rem;background:rgba(0,0,0,.3);backdrop-filter:blur(4px);color:#fff;border:none;border-radius:8px;padding:.28rem .5rem;font-size:.75rem;cursor:pointer;z-index:5;opacity:.55;}
.slider-pause:hover{opacity:1;}

/* Sections */
.main{}
.section{padding:1.5rem 0;}
.section+.section{border-top:1px solid var(--border);}
.section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.9rem;flex-wrap:wrap;gap:.4rem;}
.section-title{font-size:1.25rem;font-weight:700;letter-spacing:-.02em;}
.season-badge{background:var(--accent-l);color:var(--accent);font-size:.7rem;font-weight:600;padding:.22rem .65rem;border-radius:20px;}

/* Zuletzt angesehen */
.recent-grid{display:flex;gap:.65rem;overflow-x:auto;padding-bottom:.35rem;scrollbar-width:none;}
.recent-grid::-webkit-scrollbar{display:none;}
.recent-card{background:var(--white);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;cursor:pointer;flex-shrink:0;width:140px;transition:transform .18s,box-shadow .18s;}
.recent-card:hover{transform:translateY(-2px);box-shadow:var(--sh-sm);}
.recent-card img{width:100%;height:85px;object-fit:cover;}
.recent-card-ph{width:100%;height:85px;display:flex;align-items:center;justify-content:center;font-size:2rem;background:var(--subtle);}
.recent-card-body{padding:.45rem .6rem;}
.recent-card-title{font-size:.78rem;font-weight:600;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.recent-card-meta{font-size:.65rem;color:var(--muted);margin-top:.15rem;}

/* Filter */
.filter-bar{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:var(--white);position:sticky;top:56px;z-index:70;}
.filter-inner{display:flex;gap:.4rem;padding:.5rem 1.25rem;overflow-x:auto;scrollbar-width:none;}
.filter-inner::-webkit-scrollbar{display:none;}
.filter-chip{background:transparent;border:1.5px solid var(--border);color:var(--muted);padding:.3rem .8rem;border-radius:20px;font-size:.75rem;font-weight:500;white-space:nowrap;font-family:var(--f);cursor:pointer;display:inline-flex;align-items:center;gap:.3rem;transition:all .15s;}
.filter-chip:hover{border-color:var(--ink);color:var(--text);}
.filter-chip.active{background:var(--ink);color:#fff;border-color:var(--ink);}

/* Kategorien */
.cats-grid{display:flex;flex-wrap:wrap;gap:.4rem;}
.cat-chip{background:var(--white);border:1.5px solid var(--border);padding:.4rem .9rem;border-radius:20px;font-size:.8rem;font-weight:500;cursor:pointer;font-family:var(--f);transition:all .15s;}
.cat-chip:hover{border-color:var(--ink);}
.cat-chip.active{background:var(--ink);color:#fff;border-color:var(--ink);}
.sort-select{background:var(--white);border:1.5px solid var(--border);color:var(--muted);padding:.32rem .6rem;border-radius:var(--r);font-family:var(--f);font-size:.75rem;font-weight:500;cursor:pointer;}

/* Recipe Grid */
.recipe-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem;}
.recipe-card{background:var(--white);border-radius:14px;overflow:hidden;border:1px solid var(--border);cursor:pointer;transition:transform .2s,box-shadow .2s;}
.recipe-card:hover{transform:translateY(-3px);box-shadow:var(--sh-md);}
.card-img-wrap{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--accent-l);}
.card-img-wrap img{width:100%;height:100%;object-fit:cover;transition:transform .4s;}
.recipe-card:hover .card-img-wrap img{transform:scale(1.04);}
.card-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:3rem;}
.card-badge{position:absolute;top:.6rem;left:.6rem;background:rgba(255,255,255,.92);color:var(--accent);font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;padding:.2rem .5rem;border-radius:20px;}
.card-body{padding:.85rem .9rem .95rem;}
.card-title{font-size:.98rem;font-weight:600;line-height:1.3;margin-bottom:.3rem;letter-spacing:-.01em;}
.card-meta{font-size:.7rem;color:var(--muted);margin-bottom:.35rem;}
.card-stars{display:flex;align-items:center;gap:.25rem;margin-bottom:.3rem;}
.card-star{font-size:.82rem;color:#ddd;}
.card-star.filled{color:#f59e0b;}
.card-tags{display:flex;flex-wrap:wrap;gap:.22rem;}
.tag{font-size:.62rem;padding:.1rem .42rem;background:var(--subtle);border:1px solid var(--border);border-radius:20px;color:var(--muted);font-weight:500;}

.empty-state{text-align:center;padding:3.5rem 1rem;display:flex;flex-direction:column;align-items:center;gap:.65rem;}
.empty-icon{font-size:3rem;}
.empty-state h3{font-size:1.2rem;font-weight:700;}
.empty-state p{color:var(--muted);font-size:.875rem;}

.footer{border-top:2px solid var(--ink);margin-top:2rem;padding:1.25rem 0;}
.footer-inner{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.4rem;font-size:.78rem;color:var(--muted);}
.footer-logo{font-size:.95rem;font-weight:700;color:var(--ink);}

/* Login */
.overlay{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:1rem;min-height:100dvh;}
.overlay-bg{position:fixed;inset:0;background:rgba(0,0,0,.5);backdrop-filter:blur(6px);cursor:pointer;}
.login-card{position:relative;z-index:1;background:var(--white);border-radius:20px;padding:2.25rem 1.75rem;width:min(360px,94vw);box-shadow:var(--sh-lg);display:flex;flex-direction:column;gap:.85rem;text-align:center;}
.login-icon{font-size:2.5rem;}
.login-card h2{font-size:1.5rem;font-weight:700;letter-spacing:-.02em;}
.login-card p{color:var(--muted);font-size:.875rem;}
.login-card input{padding:.68rem 1rem;border:1.5px solid var(--border);border-radius:var(--r);font-family:var(--f);font-size:16px;background:var(--subtle);outline:none;width:100%;color:var(--text);}
.login-card input:focus{border-color:var(--ink);background:var(--white);}
.err-msg{color:var(--danger);font-size:.8rem;font-weight:500;}

/* Modal */
.modal-panel{position:relative;z-index:1;background:var(--white);border-radius:20px;width:min(900px,96vw);max-height:92vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:var(--sh-lg);}
.modal-topbar{display:flex;align-items:center;gap:.5rem;padding:.85rem 1.1rem;border-bottom:1px solid var(--border);flex-shrink:0;}
.topbar-close{background:var(--subtle);border:none;color:var(--text);width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;}
.topbar-close:hover{background:var(--border);}
.modal-heading{flex:1;font-size:1rem;font-weight:700;letter-spacing:-.01em;}
.topbar-actions{display:flex;align-items:center;gap:.28rem;margin-left:auto;flex-wrap:wrap;justify-content:flex-end;}
.modal-scroll{overflow-y:auto;flex:1;overscroll-behavior:contain;}

/* View */
.view-gallery{background:#000;border-radius:20px 20px 0 0;overflow:hidden;}
.vg-main{position:relative;overflow:hidden;cursor:zoom-in;}
.vg-main img{width:100%;height:280px;object-fit:cover;display:block;}
.vg-zoom-btn{position:absolute;top:.6rem;right:.6rem;background:rgba(0,0,0,.45);color:#fff;border:none;border-radius:var(--r);padding:.28rem .55rem;font-size:.72rem;cursor:pointer;backdrop-filter:blur(4px);font-family:var(--f);}
.vg-arrow{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.88);border:none;border-radius:50%;width:32px;height:32px;font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:var(--sh-sm);z-index:2;}
.vg-arrow:hover{background:#fff;}
.vg-prev{left:.6rem;}
.vg-next{right:.6rem;}
.vg-dots{position:absolute;bottom:.5rem;left:50%;transform:translateX(-50%);display:flex;gap:.3rem;}
.vg-dot{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.45);border:none;cursor:pointer;padding:0;transition:all .15s;}
.vg-dot.active{background:#fff;transform:scale(1.35);}
.vg-thumbs{display:flex;gap:.3rem;padding:.4rem .55rem;background:#111;overflow-x:auto;scrollbar-width:none;}
.vg-thumbs::-webkit-scrollbar{display:none;}
.vg-thumb{width:46px;height:46px;border-radius:6px;overflow:hidden;cursor:pointer;opacity:.48;border:2px solid transparent;flex-shrink:0;transition:opacity .15s,border-color .15s;}
.vg-thumb.active{opacity:1;border-color:#fff;}
.vg-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.view-content{padding:1.35rem 1.5rem;display:flex;flex-direction:column;gap:1.1rem;}
.view-cat{font-size:.65rem;color:var(--accent);font-weight:700;text-transform:uppercase;letter-spacing:.08em;}
.view-title{font-size:1.7rem;font-weight:700;line-height:1.2;letter-spacing:-.03em;}
.view-meta-row{display:flex;flex-wrap:wrap;gap:.35rem 1rem;color:var(--muted);font-size:.83rem;}
.view-meta-row strong{color:var(--text);font-weight:600;}
.view-tags{display:flex;flex-wrap:wrap;gap:.28rem;}
.view-divider{border:none;border-top:1px solid var(--border);}
.view-section-h{font-size:1rem;font-weight:700;margin-bottom:.7rem;letter-spacing:-.01em;}
.portions-ctrl{display:flex;align-items:center;gap:.65rem;margin-bottom:.7rem;font-size:.875rem;color:var(--muted);}
.portions-ctrl button{width:28px;height:28px;border-radius:50%;background:var(--subtle);border:1.5px solid var(--border);color:var(--text);display:flex;align-items:center;justify-content:center;font-size:.95rem;cursor:pointer;font-weight:600;}
.portions-ctrl button:hover{border-color:var(--accent);color:var(--accent);}
.ing-table{width:100%;border-collapse:collapse;font-size:.875rem;}
.ing-table td{padding:.4rem .45rem;border-bottom:1px solid var(--border);}
.ing-table td:first-child{color:var(--muted);width:130px;white-space:nowrap;font-weight:500;}
.ing-table tr:last-child td{border-bottom:none;}
.ing-group-title{font-size:.8rem;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:.06em;margin:1rem 0 .4rem;padding-bottom:.3rem;border-bottom:1.5px solid var(--accent-l);}
.step-ol{list-style:none;display:flex;flex-direction:column;gap:.75rem;}
.step-ol li{display:flex;gap:.75rem;align-items:flex-start;font-size:.875rem;line-height:1.65;}
.step-num{min-width:26px;height:26px;border-radius:50%;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:700;flex-shrink:0;margin-top:.1rem;}
.view-notes{background:var(--accent-l);border-left:3px solid var(--accent);border-radius:0 var(--r) var(--r) 0;padding:.75rem .95rem;font-size:.85rem;color:var(--muted);line-height:1.65;}

/* Nährwerte */
.nut-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:.55rem;}
.nut-card{background:var(--subtle);border-radius:var(--r);padding:.6rem .4rem;text-align:center;}
.nut-val{font-size:1.05rem;font-weight:700;color:var(--ink);}
.nut-label{font-size:.65rem;color:var(--muted);margin-top:.1rem;font-weight:500;}

/* Bewertung */
.star-row{display:flex;align-items:center;gap:.45rem;}
.stars{display:flex;gap:.1rem;}
.star{font-size:1.3rem;cursor:pointer;color:#e0e0e0;transition:color .1s;line-height:1;}
.star.filled{color:#f59e0b;}
.star-count{font-size:.78rem;color:var(--muted);font-weight:500;}

/* Ähnliche */
.similar-grid{display:flex;gap:.6rem;overflow-x:auto;padding-bottom:.35rem;scrollbar-width:none;}
.similar-grid::-webkit-scrollbar{display:none;}
.similar-card{background:var(--subtle);border-radius:var(--r);overflow:hidden;cursor:pointer;flex-shrink:0;width:140px;transition:transform .18s;border:1px solid var(--border);}
.similar-card:hover{transform:translateY(-2px);}
.similar-card img{width:100%;height:85px;object-fit:cover;}
.similar-card-ph{width:100%;height:85px;display:flex;align-items:center;justify-content:center;font-size:1.9rem;background:var(--accent-l);}
.similar-card p{padding:.4rem .55rem;font-size:.78rem;font-weight:600;line-height:1.3;}

/* Edit Form */
.gal-editor{padding:1rem 1.1rem 0;}
.gal-editor-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:.55rem;}
.form-label{font-size:.7rem;color:var(--muted);text-transform:uppercase;letter-spacing:.07em;font-weight:600;}
.form-label-sm{font-size:.65rem;color:var(--muted);font-weight:500;}
.gal-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.35rem;min-height:68px;}
.gal-empty{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;color:var(--muted);font-size:.78rem;padding:1.1rem;border:1.5px dashed var(--border-s);border-radius:var(--r);background:var(--subtle);text-align:center;}
.gal-empty svg{color:var(--accent);}
.gal-item{position:relative;aspect-ratio:1;border-radius:var(--r);overflow:hidden;border:2px solid transparent;}
.gal-item.is-main{border-color:var(--accent);}
.gal-item img{width:100%;height:100%;object-fit:cover;display:block;}
.gal-del{position:absolute;top:.18rem;right:.18rem;background:rgba(0,0,0,.62);color:#fff;border:none;width:18px;height:18px;border-radius:50%;font-size:.62rem;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transition:opacity .15s;}
.gal-item:hover .gal-del{opacity:1;}
.gal-badge{position:absolute;bottom:.18rem;left:.18rem;background:var(--accent);color:#fff;font-size:.5rem;font-weight:700;padding:.08rem .25rem;border-radius:4px;text-transform:uppercase;}
.edit-form{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;padding:1rem 1.1rem;}
.form-field{display:flex;flex-direction:column;gap:.3rem;}
.form-field.span2{grid-column:1/-1;}
.form-input{background:var(--subtle);border:1.5px solid var(--border);color:var(--text);padding:.6rem .8rem;border-radius:var(--r);font-family:var(--f);font-size:16px;width:100%;font-weight:400;}
.form-input:focus{outline:none;border-color:var(--ink);background:var(--white);}
textarea.form-input{resize:vertical;min-height:76px;}
.season-picker{display:flex;flex-wrap:wrap;gap:.35rem;}
.season-btn{background:var(--subtle);border:1.5px solid var(--border);color:var(--muted);padding:.38rem .85rem;border-radius:20px;font-size:.8rem;font-family:var(--f);cursor:pointer;font-weight:500;transition:all .15s;}
.season-btn:hover{border-color:var(--ink);color:var(--text);}
.season-btn.active{background:var(--ink);color:#fff;border-color:var(--ink);}
.nut-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.45rem;}
.nut-grid>div{display:flex;flex-direction:column;gap:.25rem;}
.ing-row{display:flex;gap:.35rem;align-items:center;margin-bottom:.32rem;}
.ing-row input[type="text"]{flex:1;background:var(--subtle);border:1.5px solid var(--border);color:var(--text);padding:.5rem .6rem;border-radius:var(--r);font-family:var(--f);font-size:16px;font-weight:400;}
.ing-row input[type="text"]:focus{outline:none;border-color:var(--ink);background:var(--white);}
.ing-row .ing-qty{flex:0 0 65px;}
.ing-row .ing-unit{flex:0 0 72px;}
.ing-header-row .ing-name{background:var(--accent-l);border-color:var(--accent);color:var(--accent);font-weight:600;}
.row-del{background:transparent;border:none;color:var(--muted);padding:.25rem;font-size:.9rem;cursor:pointer;border-radius:6px;flex-shrink:0;}
.row-del:hover{color:var(--danger);}
.step-row{display:flex;gap:.55rem;align-items:flex-start;margin-bottom:.4rem;}
.step-row .step-num{margin-top:.42rem;flex-shrink:0;}
.step-row textarea{flex:1;background:var(--subtle);border:1.5px solid var(--border);color:var(--text);padding:.5rem .6rem;border-radius:var(--r);font-family:var(--f);font-size:16px;min-height:50px;resize:vertical;font-weight:400;}
.step-row textarea:focus{outline:none;border-color:var(--ink);background:var(--white);}

/* Einkaufsliste */
.cart-badge{position:absolute;top:-3px;right:-3px;background:var(--accent);color:#fff;font-size:.58rem;font-weight:700;width:15px;height:15px;border-radius:50%;display:flex;align-items:center;justify-content:center;}
.cart-body{padding:1.1rem;}
.cart-group{margin-bottom:1.1rem;}
.cart-group-title{font-size:.95rem;font-weight:700;color:var(--muted);margin-bottom:.45rem;padding-bottom:.3rem;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;}
.cart-item{display:flex;align-items:center;gap:.65rem;padding:.35rem 0;font-size:.875rem;}
.cart-item input[type=checkbox]{width:17px;height:17px;accent-color:var(--ink);cursor:pointer;flex-shrink:0;}
.cart-item label{cursor:pointer;flex:1;font-weight:400;}
.cart-item.checked label{text-decoration:line-through;color:var(--muted);}
.cart-empty{text-align:center;padding:2.5rem 1rem;color:var(--muted);}
.cart-empty-icon{font-size:2.5rem;margin-bottom:.6rem;}

/* Confirm */
.confirm-box{position:relative;z-index:1;background:var(--white);border-radius:var(--r);padding:1.6rem;width:min(320px,92vw);box-shadow:var(--sh-lg);}
.confirm-box h3{font-size:1.1rem;font-weight:700;margin-bottom:.4rem;}
.confirm-box p{color:var(--muted);font-size:.85rem;margin-bottom:1.1rem;line-height:1.5;}
.confirm-btns{display:flex;gap:.5rem;justify-content:flex-end;}

/* Lightbox */
#lightbox{z-index:200;}
#lightbox .overlay-bg{background:rgba(0,0,0,.96);}
.lb-close{position:absolute;top:.85rem;right:.85rem;z-index:1;background:rgba(255,255,255,.1);border:none;color:#fff;width:36px;height:36px;border-radius:50%;font-size:.95rem;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.lb-close:hover{background:rgba(255,255,255,.25);}
.lb-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:1;background:rgba(255,255,255,.1);border:none;color:#fff;width:44px;height:44px;border-radius:50%;font-size:1.75rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s;}
.lb-arrow:hover{background:rgba(255,255,255,.25);}
.lb-prev{left:.85rem;}
.lb-next{right:.85rem;}
.lb-img-wrap{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:100%;height:100%;max-width:92vw;max-height:86vh;}
.lb-img-wrap img{max-width:92vw;max-height:86vh;object-fit:contain;border-radius:var(--r);display:block;margin:auto;}
.lb-counter{position:absolute;bottom:1.1rem;left:50%;transform:translateX(-50%);z-index:1;background:rgba(0,0,0,.5);color:#fff;font-size:.78rem;padding:.26rem .75rem;border-radius:20px;backdrop-filter:blur(4px);font-weight:500;}

/* Toast */
.toast{position:fixed;bottom:1.75rem;left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;padding:.6rem 1.3rem;border-radius:24px;font-size:.82rem;font-weight:500;z-index:999;box-shadow:var(--sh-lg);white-space:nowrap;pointer-events:none;}

/* Print */
#print-area{display:none;}
@media print {
  body > *:not(#print-area) { display: none !important; }
  #print-area {
    display: block !important;
    font-family: Arial, sans-serif;
    color: #111;
    padding: 1.5rem;
    max-width: 800px;
    margin: 0 auto;
  }
  #print-area img { max-width: 100%; height: auto; max-height: 350px; object-fit: cover; margin-bottom: 1rem; }
  #print-area h2 { font-size: 1.6rem; margin-bottom: .75rem; }
  #print-area .view-cat { font-size: .7rem; color: #c0392b; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
  #print-area .view-divider { border: none; border-top: 1px solid #eee; margin: .75rem 0; }
  #print-area .view-section-h { font-size: 1rem; font-weight: 700; margin: .75rem 0 .5rem; }
  #print-area .ing-group-title { font-size: .8rem; color: #c0392b; font-weight: 700; text-transform: uppercase; margin: .75rem 0 .35rem; padding-bottom: .25rem; border-bottom: 1.5px solid #fdf0ef; }
  #print-area .ing-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
  #print-area .ing-table td { padding: .35rem .4rem; border-bottom: 1px solid #eee; }
  #print-area .step-ol { list-style: none; padding: 0; }
  #print-area .step-ol li { display: flex; gap: .6rem; margin-bottom: .5rem; font-size: .9rem; line-height: 1.5; }
  #print-area .step-num { min-width: 22px; height: 22px; border-radius: 50%; background: #1a1a2e; color: #fff; display: flex; align-items: center; justify-content: center; font-size: .65rem; font-weight: 700; flex-shrink: 0; }
  #print-area .view-notes { background: #fdf0ef; border-left: 3px solid #c0392b; padding: .75rem; font-size: .85rem; color: #666; margin-top: .5rem; }
  #print-area .portions-ctrl button,
  #print-area .vg-zoom-btn,
  #print-area .vg-arrow,
  #print-area .vg-dots,
  #print-area .vg-thumbs,
  #print-area .star-row,
  #print-area .similar-grid,
  #print-area .view-tags { display: none !important; }
  #print-area .cart-item.checked label { text-decoration: line-through; color: #888; }
}

/* Responsive */
@media(max-width:860px){
  .nav-cats{display:none;}
  #nav-hamburger{display:flex;}
  .slider-prev,.slider-next{display:none;}
  .slider-slide img,.slider-slide-ph{height:300px;}
  .slider-content{padding:1.25rem 1.5rem;}
  .slider-title{font-size:1.4rem;}
}
@media(max-width:580px){
  .nav-inner{padding:0 .85rem;height:52px;}
  .nav-logo{font-size:.92rem;}
  #nav-login-btn,#nav-logout-btn{display:none;}
  .slider-wrap{margin:.65rem;padding:0;}
  .slider{border-radius:12px;}
  .slider-slide img,.slider-slide-ph{height:220px;}
  .slider-content{padding:.9rem 1.1rem 1rem;}
  .slider-title{font-size:1.1rem;}
  .slider-cta{font-size:.72rem;padding:.38rem .9rem;}
  .section{padding:1.1rem 0;}
  .section-title{font-size:1.1rem;}
  .recipe-grid{grid-template-columns:repeat(2,1fr);gap:.7rem;}
  .overlay{padding:0;align-items:flex-end;}
  .modal-panel{border-radius:20px 20px 0 0;width:100%;max-height:96dvh;}
  .modal-topbar{padding:.7rem .9rem;}
  .topbar-actions{gap:.2rem;}
  .topbar-actions .btn-sm{padding:.28rem .45rem;font-size:.68rem;}
  .vg-main img{height:185px;}
  .view-content{padding:.95rem .9rem;gap:.9rem;}
  .view-title{font-size:1.35rem;}
  .edit-form{grid-template-columns:1fr;gap:.65rem;padding:.85rem .9rem;}
  .form-field.span2{grid-column:1;}
  .gal-editor{padding:.85rem .9rem 0;}
  .gal-grid{grid-template-columns:repeat(4,1fr);}
  .nut-grid{grid-template-columns:repeat(2,1fr);}
  .nut-cards{grid-template-columns:repeat(2,1fr);}
  .ing-row{flex-wrap:wrap;}
  .ing-row .ing-qty,.ing-row .ing-unit{flex:0 0 calc(40% - .2rem);}
  .ing-row input[type="text"]:not(.ing-qty):not(.ing-unit){flex:1 1 100%;}
  .filter-inner{padding:.45rem .85rem;}
  .footer-inner{flex-direction:column;align-items:center;text-align:center;gap:.3rem;}
}
@media(max-width:380px){.recipe-grid{grid-template-columns:1fr;}}
@supports(padding:env(safe-area-inset-bottom)){
  .modal-panel{padding-bottom:env(safe-area-inset-bottom);}
  .footer{padding-bottom:env(safe-area-inset-bottom);}
}

/* Allergene */
.allergen-row{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.35rem;}
.allergen-badge{font-size:.68rem;font-weight:600;padding:.18rem .5rem;border-radius:20px;background:#fff3cd;color:#856404;border:1px solid #ffc107;white-space:nowrap;}
.card-body .allergen-row{margin-top:.25rem;}
.card-body .allergen-badge{font-size:.6rem;padding:.12rem .38rem;}

/* Kostenkalkulation */
.kosten-row{font-size:.82rem;color:var(--muted);background:var(--subtle);border-radius:var(--r);padding:.45rem .75rem;margin-top:.35rem;}
.kosten-row strong{color:var(--ink);}
.preis-row{display:flex;gap:.35rem;align-items:center;margin-bottom:.32rem;}
.preis-row .form-input{padding:.45rem .55rem;font-size:15px;}

/* Menüplan */
.menu-nav{display:flex;align-items:center;gap:1rem;margin-bottom:1rem;}
.menu-section-title{font-size:.9rem;font-weight:700;margin-bottom:.6rem;letter-spacing:-.01em;}
.menu-monat-grid{display:flex;flex-wrap:wrap;gap:.4rem;}
.menu-gericht-chip{background:var(--ink);color:#fff;padding:.3rem .7rem;border-radius:20px;font-size:.78rem;font-weight:500;display:inline-flex;align-items:center;gap:.4rem;}
.menu-chip-sm{font-size:.72rem;padding:.22rem .5rem;background:var(--accent);}
.menu-chip-del{background:transparent;border:none;color:rgba(255,255,255,.7);cursor:pointer;padding:0;font-size:.75rem;line-height:1;}
.menu-chip-del:hover{color:#fff;}
.menu-woche{margin-bottom:1rem;}
.menu-woche-label{font-size:.75rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.4rem;}
.menu-tage-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:.4rem;}
.menu-tag{background:var(--subtle);border-radius:var(--r);padding:.45rem .4rem;min-height:70px;}
.menu-tag-grau{opacity:.35;}
.menu-tag-label{font-size:.68rem;font-weight:600;color:var(--muted);margin-bottom:.3rem;}
.menu-add-tag-btn{background:transparent;border:1.5px dashed var(--border-s);color:var(--muted);width:100%;border-radius:6px;font-size:.75rem;padding:.15rem;cursor:pointer;margin-top:.25rem;font-family:var(--f);}
.menu-add-tag-btn:hover{border-color:var(--accent);color:var(--accent);}
.menu-pick-item{padding:.6rem .75rem;border-bottom:1px solid var(--border);cursor:pointer;font-size:.875rem;border-radius:var(--r);}
.menu-pick-item:hover{background:var(--subtle);}

/* Einkaufsliste Mobile Fix */
.cart-item {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .6rem .5rem;
  border-bottom: 1px solid var(--border);
}
.cart-item input[type="checkbox"] {
  width: 22px;
  height: 22px;
  min-width: 22px;
  cursor: pointer;
  accent-color: var(--accent);
}
.cart-item label {
  font-size: .95rem;
  line-height: 1.4;
  cursor: pointer;
  flex: 1;
}
.cart-group-title {
  padding: .6rem .5rem .3rem;
}

/* Slider Hoehe PC */
@media (min-width: 768px) {
  .slider-slide { height: 420px; }
  .slider-slide img { height: 420px; }
}
