/* 家常食谱：更清晰的手机选菜与收藏入口 */
:root { --bg:#f7f5ef; --ink:#343d32; --ink2:#65705e; --ink3:#7c826e; --brand:#769154; --brand-deep:#496637; --line:#e5e8db; --shadow:0 5px 18px #35432d09; --shadow-sm:0 2px 8px #35432d08; }
.userbar { background:rgba(247,245,239,.96); border-bottom:1px solid #e5e8db; margin-bottom:12px; }
.brand-title { letter-spacing:0; }
.hero { background:linear-gradient(115deg,#e6edda,#f0ecd9); box-shadow:none; border:1px solid #dfe6d0; border-radius:24px; }
.hero-inner { padding:24px 24px 22px; }
.hero-text { color:#33472b; }
.hero-eyebrow { color:#6b7c55; font-size:11px; font-weight:700; letter-spacing:2px; margin-bottom:9px; }
.hero-hi { font-size:26px; line-height:1.35; letter-spacing:-.5px; }
.hero-menu-note { font-size:12px; color:#5f7251; margin:9px 0 13px; }
.hero-sub { color:#5c6e50; font-size:12px; }
.hero-cart { box-shadow:0 4px 12px #43572d13; width:58px; height:58px; }
.cart-num { background:#9a522e; }
.hero .mealbar { background:#ffffff75; padding:8px; margin:0; gap:6px; }
.hero .mealtab { border-radius:12px; min-height:42px; }
.hero .mealtab.on { background:#496637; color:#fff; box-shadow:none; }
.searchrow { gap:10px; margin:20px 0 14px; }
.search { border:1px solid #e1e5d8; border-radius:14px; box-shadow:none; padding:0 12px; height:48px; min-width:0; }
.search input { font-size:13px; }
.search:focus-within { border-color:#769154; box-shadow:0 0 0 3px #76915412; }
.search-clear { width:28px; height:32px; border:0; background:transparent; font-size:22px; color:#6a735f; flex-shrink:0; }
[hidden] { display:none !important; }
.filterbtn { width:48px; height:48px; border-radius:14px; border:1px solid #e1e5d8; box-shadow:none; flex-shrink:0; }
.collections { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:9px; margin-bottom:20px; }
.collection { text-align:left; border:1px solid #e0e5d6; background:#fefefa; border-radius:14px; padding:13px 12px; min-width:0; transition:background .15s,border .15s; }
.collection b,.collection span { display:block; }
.collection b { font-size:14px; margin-bottom:4px; }
.collection span { font-size:10px; color:#72795f; }
.collection.on { border-color:#769154; background:#eaf0df; box-shadow:0 0 0 1px #769154 inset; }
.collection.on b { color:#40592f; }
.cats { border-bottom:1px solid #e1e5d8; padding-bottom:14px; margin-bottom:18px; gap:6px; }
.cat { box-shadow:none; background:#eeeee6; padding:10px 14px; font-size:12px; min-height:40px; }
.cat.on { background:#394a31; box-shadow:none; }
.section-head { margin:0 0 14px; align-items:center; }
.section-head h2 { font-size:20px; display:flex; align-items:center; gap:9px; }
#resultCount { font-size:11px; font-weight:500; color:#6d775e; background:#e9eddf; border-radius:20px; padding:3px 9px; }
.sortsel { box-shadow:none; border:1px solid #e1e5d8; min-height:40px; color:#526147; }
.grid { gap:14px; }
.card { border:1px solid #e5e8dd; border-radius:18px; box-shadow:none; min-width:0; }
.card:hover { box-shadow:0 9px 24px #35432d12; transform:translateY(-2px); }
.card.ordered { border-color:#6e8952; box-shadow:0 0 0 1px #6e8952; }
.pic { aspect-ratio:1.6; background:radial-gradient(ellipse at 50% 20%,#ffffffc9,transparent 70%),var(--accent); }
.pic svg { width:68%; height:90%; filter:drop-shadow(0 5px 8px #593b2214); }
.pic-blob { opacity:.5; width:64%; left:18%; top:6%; }
.card-body { padding:13px 12px 17px; gap:5px; }
.card-body h3 { font-size:16px; font-weight:750; line-height:1.45; }
.card-body .sub { color:#747b67; font-size:11px; }
.card-body .meta { gap:4px 9px; font-size:10.5px; }
.card-body .tags { padding-right:35px; min-height:29px; }
.card-body .tags span { background:#edf1e5; color:#63784e; border-radius:5px; font-size:10px; }
.card-add { width:40px; height:40px; bottom:12px; right:10px; background:#496637; box-shadow:none; }
.card-add.on { color:#496637; box-shadow:0 0 0 2px #496637 inset; }
.card-fav { position:absolute; right:9px; top:9px; z-index:5; display:grid; place-items:center; width:34px; height:34px; border:1px solid #ffffff80; background:#fffffff0; border-radius:50%; color:#647156; font-size:25px; line-height:1; }
.card-fav.on { color:#b65c44; background:#fff9f4; }
.badge.regional { background:#496637; color:#fff; }
.badge.time { background:#fffffff0; color:#7e623b; }
.badge.baby { font-size:9px; }
.others { right:8px; top:auto; bottom:7px; }
.footer-note { color:#78806a; max-width:600px; margin:auto; }
.nav { border-top:1px solid #e1e5d8; }
.btn.primary { background:#496637; box-shadow:none; }
.nutri-head { flex-wrap:wrap; gap:5px; }
@media(max-width:560px) {
 .main { padding:0 12px; }
 .hero-inner { padding:15px 16px; }
 .hero-hi { font-size:21px; }
 .hero-eyebrow { margin-bottom:6px; }
 .hero-menu-note { max-width:220px; line-height:1.5; margin:6px 0; }
 .collections { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-bottom:18px; }
 .collection { padding:11px 13px; position:relative; }
 .collection::after { content:'↗'; position:absolute; right:13px; top:15px; color:#859473; font-size:14px; }
 .collection b { font-size:13px; }
 .grid { gap:10px; }
 .card-body { padding:11px 10px 15px; }
 .card-body h3 { font-size:15px; }
 .card-body .meta { font-size:10px; gap:4px 7px; }
 .sub-meta span:last-child { display:none; }
 .section-head h2 { font-size:18px; }
}
@media(max-width:360px) { .hero-hi { font-size:19px; } .hero-cart { width:46px; height:46px; } .card-body h3 { font-size:14px; } .card-body .tags span { padding:2px 5px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; } }