.home-screen { background:#fff; }
.home-page { max-width:none; min-height:100dvh; }
.home-layout { display:grid; grid-template-columns:80px 160px minmax(0,1fr); align-items:start; align-content:start; min-height:100dvh; }
.home-primary { position:sticky; top:0; height:100dvh; display:flex; flex-direction:column; align-items:center; gap:16px; padding:16px 8px; overflow-y:auto; background:#f1f3f2; border-right:1px solid #dfe5e1; }
.home-brand { display:grid; place-items:center; width:48px; min-height:56px; margin:0; }
.home-brand img { max-width:44px; height:46px; object-fit:contain; transition:filter 200ms ease; }
.home-brand:hover img,.home-brand:active img { filter:brightness(0) saturate(100%) invert(27%) sepia(50%) saturate(600%) hue-rotate(110deg) brightness(85%); }
.home-brand span { font-size:15px; color:var(--primary); font-weight:600; overflow-wrap:anywhere; }
.home-chat,.home-member,.home-knowledge { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px; width:100%; min-height:68px; padding:10px 2px; border-radius:6px; color:#69746e; font-size:12px; }
.home-chat:hover,.home-member:hover,.home-knowledge:hover { background:#e6eee8; color:var(--primary); }
#home-groups { width:100%; }
.home-primary button { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px; width:100%; min-height:68px; padding:10px 2px; border-radius:6px; color:#69746e; font-size:12px; transition:background-color 180ms ease,color 180ms ease; }
.home-primary button[aria-current] { background:#fff; color:var(--primary); font-weight:600; box-shadow:0 1px 3px #203e2c12; }
.home-primary [data-home-icon],.home-actions [data-home-icon],.home-header [data-home-icon] { display:flex; }
.home-secondary { position:sticky; top:0; height:100dvh; overflow-y:auto; min-width:0; padding:26px 10px 24px; border-right:1px solid #dfe5e1; background:#edf4f0; }
.home-secondary h1 { margin:0 10px 24px; font-size:15px; font-weight:600; }
.home-screen .sidebar { position:static; width:auto; max-height:none; overflow:visible; border-radius:0; background:none; }
.home-screen .sidebar button { padding:12px 10px; margin-bottom:5px; border-radius:6px; font-size:14px; text-align:left; color:#4e6155; background:transparent; overflow-wrap:anywhere; transition:background-color 180ms ease,color 180ms ease; }
.home-screen .sidebar .icon { display:inline-block; margin:0 6px 0 0; font-size:17px; }
.home-screen .sidebar button.active { background:#d9e9df; color:var(--primary-dark); font-weight:600; }
.home-screen .sidebar button.active::before { display:none; }
.home-content { min-width:0; background:#fff; }
.home-screen .home-header { display:flex; align-items:center; gap:24px; padding:18px 24px; position:sticky; top:0; z-index:20; background:#fff; border-bottom:1px solid #e7ebe8; }
.home-screen .home-header .search-box { flex:1; min-width:0; max-width:640px; margin:0; gap:8px; padding:4px 4px 4px 12px; border:1px solid #dfe6e0; border-radius:8px; background:#f6f8f6; }
.home-screen .home-header .search-box:focus-within { border-color:#86ad95; box-shadow:0 0 0 3px #2d6a4f08; }
.home-screen .search-box input { font-size:14px; }
.home-screen .search-box button[type=submit] { padding:8px 16px; border-radius:5px; font-size:14px; font-weight:500; }
.home-screen .search-box .search-clear { width:28px; height:32px; margin:0; }
.home-actions { display:flex; flex-direction:column; align-items:center; gap:12px; margin-top:auto; padding-top:24px; width:100%; flex-shrink:0; }
.home-actions a { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; color:#657169; font-size:12px; min-height:48px; width:100%; border-radius:6px; }
.home-actions .snav-badge { top:calc(50% - 22px); left:calc(50% + 5px); right:auto; }
.home-primary #open-search { width:44px; height:44px; min-height:44px; padding:0; border-radius:50%; background:#fff; flex-shrink:0; }
.home-primary #open-search[aria-pressed=true] { color:var(--primary); background:#daeade; }
.search-discovery { padding:8px 24px 32px; min-height:55vh; }
.search-discovery section { padding:20px 0; }
.search-discovery h2 { margin:0 0 16px; font-size:15px; color:#44584b; }
.search-terms { display:flex; flex-wrap:wrap; gap:10px; }
.search-term { padding:8px 12px; background:#f1f5f2; border-radius:6px; font-size:14px; color:#4e6155; overflow-wrap:anywhere; text-align:left; }
.search-term:hover { background:#e0ebe3; }
.search-history-heading { display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.search-history-heading > button { font-size:12px; color:#7b857d; }
.history-term { display:inline-flex; align-items:stretch; min-width:0; max-width:100%; border-radius:6px; background:#f1f5f2; }
.history-term .search-term { min-width:0; }
.history-remove { display:grid; place-items:center; flex-shrink:0; width:30px; color:#879087; }
.history-remove svg { width:14px; height:14px; }
.history-remove:hover { color:#a03939; }
.history-empty { margin:0; font-size:13px; color:#909991; }
.home-screen .list { min-width:0; padding:0; }
.home-screen .list.secs { display:block; }
.home-screen .sec,.home-screen .list:not(.secs) { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:18px; padding:24px; align-items:stretch; scroll-margin-top:96px; }
.home-section-title { grid-column:1/-1; display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.home-section-title h2 { margin:0; font-size:17px; font-weight:600; color:#304538; }
.home-section-title span { color:#879087; font-size:12px; }
.home-screen .item { display:flex; flex-direction:column; min-width:0; gap:0; padding:0; border:1px solid #e4e9e4; border-radius:8px; overflow:hidden; background:#fff; transition:box-shadow 180ms ease,border-color 180ms ease; }
.home-screen .item:last-child { border-bottom:1px solid #e4e9e4; }
.home-screen .item-img { width:100%; height:auto; aspect-ratio:1; border-radius:0; background:#f1f4f0; }
.home-screen .item-body { padding:14px; min-height:144px; }
.home-screen .item-name { font-size:17px; line-height:1.5; }
.home-screen .item-name .first { font-size:inherit; line-height:inherit; }
.home-screen .item-sub { font-size:12px; line-height:1.6; margin-top:6px; color:#778278; }
.home-screen .item-foot { margin-top:auto; padding-top:14px; gap:8px; }
.home-screen .img-cat { border-radius:0 0 6px 0; font-size:11px; }
.home-screen .search-info { grid-column:1/-1; padding:0 0 6px; }
.home-screen .empty { grid-column:1/-1; }
.home-screen.searching #home-display { display:none; }
.home-screen .sfooter { margin-top:0; background:#fff; border-top-color:#e7ebe8; }
.home-screen a:focus-visible,.home-screen button:focus-visible { outline:2px solid var(--primary); outline-offset:3px; }
@media (hover:hover) and (pointer:fine) {
  .home-primary button:hover { background:#e6eee8; }
  .home-screen .sidebar button:hover { background:#e0ebe3; }
  .home-screen .item:hover { border-color:#a5bfad; box-shadow:0 4px 14px #203e2c0b; }
  .home-actions a:hover { color:var(--primary); }
}
@media (min-width:1000px) {
  .home-page.with-tabbar { padding-bottom:0; }
  .home-screen .tabbar { display:none; }
  .home-screen .bag-bar { left:240px; }
  .home-screen .bag-bar-inner { max-width:none; padding-left:24px; padding-right:24px; }
  .home-screen .bag-sheet { left:auto; right:24px; bottom:72px; width:min(560px,calc(100vw - 288px)); max-width:none; margin:0; }
  .home-screen:has(.bag-bar:not([hidden])) .home-content { padding-bottom:76px; }
}
@media (max-width:999px) {
  .home-layout { grid-template-columns:68px minmax(0,1fr); }
  .home-primary { grid-column:1/-1; grid-row:1; flex-direction:row; gap:6px; height:60px; padding:6px 8px; z-index:30; border-right:0; border-bottom:1px solid #e1e7e2; overflow:visible; }
  .home-brand { width:36px; min-height:44px; margin:0; flex-shrink:0; }
  .home-brand img { max-width:34px; height:38px; }
  .home-chat,.home-member,.home-knowledge { width:40px; min-height:42px; padding:4px 0; gap:2px; flex-shrink:0; font-size:10px; }
  .home-chat svg,.home-member svg,.home-knowledge svg { width:18px; height:18px; }
  #home-groups { display:flex; flex:1; min-width:0; width:auto; gap:8px; overflow-x:auto; }
  .home-primary button { flex-direction:row; width:auto; flex-shrink:0; min-height:42px; padding:8px; font-size:13px; }
  .home-primary #open-search { width:40px; height:40px; min-height:40px; margin:0; }
  .home-primary button svg { width:18px; height:18px; }
  .home-content { display:contents; }
  .searching .home-layout { grid-template-rows:60px 0 0 0 auto 1fr auto; }
  .home-screen .home-header { grid-column:1/-1; grid-row:2; position:static; padding:10px 14px; gap:14px; }
  .home-screen .home-header .search-box { max-width:none; }
  .home-screen .search-box button[type=submit] { padding:8px 10px; font-size:13px; }
  .home-actions { flex-direction:row; gap:4px; width:auto; margin:0 0 0 auto; padding:0; }
  .home-actions a { min-height:40px; width:32px; }
  .searching .home-header { grid-column:2; grid-row:5; align-self:start; padding:16px 12px; }
  .searching .search-discovery { grid-column:2; grid-row:6; padding:0 12px 24px; }
  .searching .list { grid-row:6; }
  .searching .home-secondary { grid-row:5/7; }
  .searching .home-content > .sfooter { grid-row:7; }
  #home-display { grid-column:1/-1; grid-row:3; }
  .home-secondary { grid-column:1; grid-row:5; top:60px; height:calc(100dvh - 60px - var(--tabbar-h)); padding:8px 0; border-right:0; }
  .home-secondary h1 { display:none; }
  .home-screen .sidebar button { padding:14px 5px; text-align:center; border-radius:6px 0 0 6px; font-size:13px; }
  .home-screen .sidebar .icon { display:block; margin:0 0 4px; font-size:19px; }
  .home-screen .list { grid-column:2; grid-row:5; }
  .home-screen .sec,.home-screen .list:not(.secs) { display:block; padding:4px 12px 12px; scroll-margin-top:72px; }
  .home-section-title { padding:14px 0 4px; }
  .home-section-title h2 { font-size:14px; }
  .home-section-title span { display:none; }
  .home-screen .item { flex-direction:row; gap:10px; border:0; border-bottom:1px solid #e7ebe8; border-radius:0; padding:14px 0; background:transparent; overflow:visible; }
  .home-screen .item:last-child { border-bottom:0; }
  .home-screen .item-img { width:100px; height:100px; aspect-ratio:1; border-radius:8px; }
  .home-screen .item-body { padding:0; min-height:100px; }
  .home-screen .item-name { font-size:17px; line-height:1.45; }
  .home-screen .item-sub { margin-top:4px; font-size:12px; }
  .home-screen .item-foot { padding-top:6px; flex-wrap:wrap; }
  .home-screen .img-cat { border-radius:8px 0 6px 0; }
  .home-content > .sfooter { grid-column:2; grid-row:6; min-width:0; max-width:100%; padding:20px 16px 90px; white-space:normal; overflow-wrap:anywhere; line-height:1.8; }
  .home-screen .search-info { padding:12px 0; }
}
@media (max-width:600px) {
  #home-groups button { flex-direction:column; gap:2px; padding:4px; min-width:48px; font-size:10px; }
}
@media (max-width:360px) {
  .home-screen .home-header { gap:10px; padding-left:10px; padding-right:12px; }
  .home-screen .home-header .search-box { gap:5px; padding-left:8px; }
  .home-screen .item-img { width:88px; height:88px; }
  .home-screen .item-body { min-height:88px; }
  .home-screen .item-name { font-size:16px; }
}
@media (prefers-reduced-motion:reduce) {
  .home-layout * { transition:none !important; animation:none !important; scroll-behavior:auto !important; }
}

/* Match recipe cards: quiet secondary text, a clear main price, and a separate chat target. */
.home-screen .card-consult-price{color:var(--text-3,#78877e);font-size:14px;font-weight:400}
.home-screen .card-price-note{color:var(--text-3);font-size:12px;font-weight:400;margin-right:4px}
.home-screen .item-special .item-foot{flex-wrap:wrap}
.home-screen .item-special .item-price-chat{flex:1 1 160px;flex-wrap:nowrap;row-gap:6px}
.home-screen .item-special .member-hint{white-space:normal}
.home-screen .item-special .product-chat{flex-shrink:0}
.home-screen .item-special .item-price{min-width:0;display:flex;align-items:baseline;flex-wrap:wrap;row-gap:4px}