/* ============================================================================
   RECIPE HUB — the single consolidated recipe surface.
   Absorbs: page-recipe-hub (mood search/sort/cook-as), page-recipe-hub..3 (full detail,
   mood science, plate breakdown), page-recipe-hub, page-recipe-hub,
   page-recipe-hub, page-recipe-hub, page-recipe-hub and the
   page-recipe-hub explainer. Nothing else renders recipes any more.
   Existing .rh-* classes are kept; everything new is .rhx-* so it can never
   collide with the shared #page-recipe-hub tokens in <style id="hu-rh-css">.
   ============================================================================ */
#page-recipe-hub{ background:#FBFAF8; }
#page-recipe-hub *{ box-sizing:border-box; }
#page-recipe-hub section{ padding:0; }

/* ── hero ───────────────────────────────────────────────────────────────── */
#page-recipe-hub .rh-hero{ background:linear-gradient(160deg,#f3f8f1 0%,#eef4f8 100%); padding:52px 5% 40px; text-align:center; position:relative; overflow:hidden; }
#page-recipe-hub .rh-hero-emojis{ font-size:1.6rem; letter-spacing:8px; margin-bottom:14px; opacity:.9; }
#page-recipe-hub .rh-hero-eyebrow{ font-size:.7rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; color:#7d9e77; margin-bottom:8px; }
#page-recipe-hub .rh-hero h1{ font-family:'Playfair Display',Georgia,serif; font-size:clamp(2rem,5vw,2.9rem); font-weight:700; color:#243447 !important; margin:0 0 12px; line-height:1.1; }
#page-recipe-hub .rh-hero p{ font-size:clamp(.95rem,2.2vw,1.08rem); color:#5a6a78; max-width:660px; margin:0 auto; line-height:1.6; }
#page-recipe-hub .rhx-herocta{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:22px; }

/* ── buttons ────────────────────────────────────────────────────────────── */
#page-recipe-hub .rhx-btn{ display:inline-flex; align-items:center; gap:7px; border-radius:999px; padding:10px 20px; font-family:inherit; font-size:.85rem; font-weight:700; cursor:pointer; border:1.5px solid #cdd9ce; background:#fff; color:#3a5540; transition:transform .16s,box-shadow .16s,background .16s; }
#page-recipe-hub .rhx-btn:hover{ transform:translateY(-1px); box-shadow:0 6px 16px rgba(36,52,71,.10); }
#page-recipe-hub .rhx-btn.is-primary{ background:#5F7350; border-color:#5F7350; color:#fff; }
#page-recipe-hub .rhx-btn.is-primary:hover{ background:#54663f; }
#page-recipe-hub .rhx-btn.is-navy{ background:#243447; border-color:#243447; color:#fff; }
#page-recipe-hub .rhx-btn.is-ghost{ background:transparent; border-color:rgba(36,52,71,.18); color:#243447; }
#page-recipe-hub .rhx-btn[disabled]{ opacity:.5; cursor:not-allowed; }

/* ── cook-as profile bar (from page-recipe-hub) ────────────────────────────── */
#page-recipe-hub .rhx-cookas{ background:#fff; border-bottom:1px solid #ece8e2; padding:10px 0; position:sticky; top:64px; z-index:60; }
#page-recipe-hub .rhx-cookas-in{ max-width:1180px; margin:0 auto; padding:0 5%; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
#page-recipe-hub .rhx-cookas-lbl{ font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; color:#7a6a52; white-space:nowrap; }
#page-recipe-hub .rhx-pill{ display:inline-flex; align-items:center; gap:6px; background:#fff; border:1.5px solid #e4e0d8; border-radius:999px; padding:5px 13px 5px 6px; font-size:.75rem; font-weight:700; color:#243447; cursor:pointer; font-family:inherit; }
#page-recipe-hub .rhx-pill.is-on{ border-color:#5F7350; background:#f2f6ef; color:#3a5540; }
#page-recipe-hub .rhx-pill-av{ width:21px; height:21px; border-radius:50%; display:grid; place-items:center; font-size:.78rem; background:#f0ece4; }
#page-recipe-hub .rhx-cookas-note{ width:100%; font-size:.72rem; color:#8a9099; margin-top:2px; }

/* ── toolbar: search + sort ─────────────────────────────────────────────── */
#page-recipe-hub .rhx-wrap{ max-width:1180px; margin:0 auto; padding:0 5%; }
#page-recipe-hub .rhx-toolbar{ padding:22px 0 4px; }
#page-recipe-hub .rhx-searchrow{ position:relative; }
#page-recipe-hub .rhx-search{ width:100%; border:1.5px solid #e4e0d8; border-radius:999px; padding:14px 18px 14px 46px; font-family:inherit; font-size:.95rem; color:#243447; background:#fff; }
#page-recipe-hub .rhx-search:focus{ outline:none; border-color:#7d9e77; box-shadow:0 0 0 3px rgba(125,158,119,.16); }
#page-recipe-hub .rhx-search-ic{ position:absolute; left:18px; top:50%; transform:translateY(-50%); font-size:.95rem; opacity:.55; pointer-events:none; }
#page-recipe-hub .rhx-sortrow{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-top:14px; }
#page-recipe-hub .rhx-count{ font-size:.82rem; font-weight:700; color:#5a6a78; }
#page-recipe-hub .rhx-sort{ border:1.5px solid #e4e0d8; border-radius:999px; padding:8px 16px; font-family:inherit; font-size:.8rem; font-weight:700; color:#243447; background:#fff; cursor:pointer; }

/* ── tabs ───────────────────────────────────────────────────────────────── */
#page-recipe-hub .rhx-tabs{ display:flex; gap:4px; overflow-x:auto; border-bottom:1px solid #ece8e2; margin-top:18px; scrollbar-width:none; }
#page-recipe-hub .rhx-tabs::-webkit-scrollbar{ display:none; }
#page-recipe-hub .rhx-tab{ flex:0 0 auto; background:transparent; border:none; border-bottom:2.5px solid transparent; padding:12px 16px; font-family:inherit; font-size:.86rem; font-weight:800; color:#8a9099; cursor:pointer; white-space:nowrap; }
#page-recipe-hub .rhx-tab.is-on{ color:#243447; border-bottom-color:#5F7350; }
#page-recipe-hub .rhx-panel{ display:none; padding-bottom:70px; }
#page-recipe-hub .rhx-panel.is-on{ display:block; }

/* ── chips ──────────────────────────────────────────────────────────────── */
#page-recipe-hub .rhx-chips{ display:flex; flex-wrap:wrap; gap:7px; margin:16px 0 4px; }
#page-recipe-hub .rhx-chip{ background:#fff; border:1.5px solid #e4e0d8; border-radius:999px; padding:6px 14px; font-family:inherit; font-size:.75rem; font-weight:700; color:#46566a; cursor:pointer; }
#page-recipe-hub .rhx-chip:hover{ border-color:#c3cfc2; }
#page-recipe-hub .rhx-chip.is-on{ background:#243447; border-color:#243447; color:#fff; }
#page-recipe-hub .rh-moodfilter{ display:flex; flex-wrap:wrap; gap:7px; margin-bottom:18px; }
#page-recipe-hub .rh-moodbtn{ background:#fff; border:1.5px solid #e4e0d8; border-radius:999px; padding:6px 14px; font-family:inherit; font-size:.76rem; font-weight:700; color:#46566a; cursor:pointer; }
#page-recipe-hub .rh-moodbtn.rh-moodon{ background:#5F7350; border-color:#5F7350; color:#fff; }

/* ── pantry strip (from page-recipe-hub) ───────────────────────────────────── */
#page-recipe-hub .rhx-pantry{ background:linear-gradient(135deg,#f4f9f2,#eef4ec); border:1px solid #dde8dd; border-radius:22px; padding:20px 24px; display:flex; align-items:center; gap:18px; margin-top:20px; }
#page-recipe-hub .rhx-pantry-ic{ width:52px; height:52px; border-radius:16px; background:#fff; display:grid; place-items:center; font-size:1.5rem; flex:0 0 auto; }
#page-recipe-hub .rhx-pantry-b{ flex:1; min-width:0; }
#page-recipe-hub .rhx-kick{ display:block; font-size:.64rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase; color:#2f5d3a; margin-bottom:5px; }
#page-recipe-hub .rhx-pantry-h{ font-family:'Playfair Display',Georgia,serif; font-weight:700; color:#243447 !important; font-size:1.2rem; margin:0 0 3px; line-height:1.2; }
#page-recipe-hub .rhx-pantry-p{ color:#5b6470; font-size:.88rem; line-height:1.5; margin:0; }

/* ── sections + meal grid (kept from the original hub) ──────────────────── */
#page-recipe-hub .rh-sec{ margin-top:42px; }
#page-recipe-hub .rh-sec-eyebrow{ font-size:.66rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#7d9e77; margin-bottom:6px; }
#page-recipe-hub .rh-sec-title{ font-family:'Playfair Display',Georgia,serif; font-size:clamp(1.4rem,3vw,1.85rem); font-weight:700; color:#243447 !important; margin:0 0 5px; line-height:1.15; }
#page-recipe-hub .rh-sec-desc{ font-size:.92rem; color:#6a7a88; margin:0 0 18px; max-width:640px; line-height:1.55; }
#page-recipe-hub .rh-sub-head{ font-size:.82rem; font-weight:800; color:#243447; margin:24px 0 12px; }
#page-recipe-hub .rh-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(232px,1fr)); gap:18px; }
#page-recipe-hub .rh-meal{ background:#fff; border:1px solid #eaeef0; border-radius:20px; overflow:hidden; box-shadow:0 4px 18px rgba(36,52,71,.05); display:flex; flex-direction:column; transition:transform .18s,box-shadow .18s; cursor:pointer; }
#page-recipe-hub .rh-meal:hover{ transform:translateY(-4px); box-shadow:0 12px 30px rgba(36,52,71,.10); }
#page-recipe-hub .rh-meal-img{ height:124px; display:flex; align-items:center; justify-content:center; position:relative; }
#page-recipe-hub .rh-meal-emoji{ font-size:3.1rem; line-height:1; }
#page-recipe-hub .rh-fam{ position:absolute; top:9px; left:9px; font-size:.6rem; font-weight:800; color:#3a6635; background:rgba(255,255,255,.92); border:1px solid rgba(125,164,126,.4); border-radius:999px; padding:3px 9px; }
#page-recipe-hub .rhx-score{ position:absolute; top:9px; right:9px; font-size:.62rem; font-weight:800; color:#243447; background:rgba(255,255,255,.94); border:1px solid rgba(36,52,71,.12); border-radius:999px; padding:3px 9px; }
#page-recipe-hub .rh-meal-body{ padding:14px 15px 15px; display:flex; flex-direction:column; flex:1; }
#page-recipe-hub .rh-meal-labels{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-bottom:8px; }
#page-recipe-hub .rh-cat{ font-size:.62rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:#4a7a4e; background:rgba(125,164,126,.14); border-radius:7px; padding:3px 8px; }
#page-recipe-hub .rh-mood{ font-size:.68rem; font-weight:700; color:#46566a; }
#page-recipe-hub .rh-meal-title{ font-weight:800; font-size:.93rem; color:#243447; line-height:1.32; margin-bottom:6px; }
#page-recipe-hub .rh-meal-meta{ display:flex; flex-wrap:wrap; gap:10px; font-size:.72rem; color:#7d8a96; margin-bottom:10px; }
#page-recipe-hub .rhx-plate{ display:flex; height:6px; border-radius:999px; overflow:hidden; margin-bottom:11px; background:#f0efe9; }
#page-recipe-hub .rhx-plate i{ display:block; height:100%; }
#page-recipe-hub .rh-meal-actions{ display:flex; gap:7px; margin-top:auto; }
#page-recipe-hub .rh-save,#page-recipe-hub .rh-view{ flex:1; border-radius:10px; padding:8px; font-size:.75rem; font-weight:800; cursor:pointer; font-family:inherit; border:1.5px solid #cdd9ce; background:#fff; color:#3a6635; }
#page-recipe-hub .rh-save.rh-saved{ background:#5a8a55; border-color:#5a8a55; color:#fff; }
#page-recipe-hub .rh-view{ background:#243447; border-color:#243447; color:#fff; }
#page-recipe-hub .rhx-src{ font-size:.62rem; font-weight:800; color:#7a6a52; margin-bottom:6px; letter-spacing:.03em; text-transform:uppercase; }

/* ── panels / empty states ──────────────────────────────────────────────── */
#page-recipe-hub .rhx-panelbox{ background:#fff; border:1px solid #eaeef0; border-radius:20px; padding:22px 24px; margin-top:18px; }
#page-recipe-hub .rhx-empty{ background:#fff; border:1px dashed #dcd8ce; border-radius:20px; padding:36px 24px; text-align:center; margin-top:18px; }
#page-recipe-hub .rhx-empty p{ color:#6a7a88; font-size:.9rem; margin:6px 0 16px; }
#page-recipe-hub .rhx-empty strong{ display:block; font-family:'Playfair Display',Georgia,serif; font-size:1.15rem; color:#243447; }
#page-recipe-hub .rh-reviews{ background:#fff; border:1px solid #eaeef0; border-radius:18px; padding:20px 22px; margin-top:24px; }
#page-recipe-hub .rh-reviews strong{ color:#243447; font-size:.92rem; }
#page-recipe-hub .rh-reviews p{ color:#6a7a88; font-size:.86rem; line-height:1.6; margin:6px 0 0; }

/* ── add-a-recipe options ───────────────────────────────────────────────── */
#page-recipe-hub .rhx-opts{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:16px; margin-top:20px; }
#page-recipe-hub .rhx-opt{ background:#fff; border:1px solid #eaeef0; border-radius:18px; padding:20px; text-align:left; cursor:pointer; font-family:inherit; transition:transform .16s,box-shadow .16s; }
#page-recipe-hub .rhx-opt:hover{ transform:translateY(-3px); box-shadow:0 10px 26px rgba(36,52,71,.09); }
#page-recipe-hub .rhx-opt-ic{ font-size:1.5rem; margin-bottom:10px; display:block; }
#page-recipe-hub .rhx-opt-t{ font-weight:800; color:#243447; font-size:.95rem; margin-bottom:4px; }
#page-recipe-hub .rhx-opt-d{ font-size:.82rem; color:#6a7a88; line-height:1.55; }
#page-recipe-hub .rhx-lock{ display:inline-block; font-size:.6rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:#8a6d2f; background:rgba(211,160,68,.16); border-radius:6px; padding:2px 7px; margin-left:6px; }

/* ── capability + journey (from the feature page) ───────────────────────── */
#page-recipe-hub .rhx-capgrid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:14px; margin-top:18px; }
#page-recipe-hub .rhx-cap{ background:#fff; border:1px solid #eaeef0; border-radius:16px; padding:17px 18px; }
#page-recipe-hub .rhx-cap-t{ font-weight:800; color:#243447; font-size:.9rem; margin:0 0 5px; }
#page-recipe-hub .rhx-cap-d{ font-size:.82rem; color:#6a7a88; line-height:1.55; margin:0; }
#page-recipe-hub .rhx-jsteps{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:14px; margin-top:18px; }
#page-recipe-hub .rhx-jstep{ background:#fff; border:1px solid #eaeef0; border-radius:16px; padding:17px 18px; text-align:left; font-family:inherit; cursor:pointer; }
#page-recipe-hub .rhx-jstep:hover{ border-color:#c3cfc2; }
#page-recipe-hub .rhx-jstep-n{ width:26px; height:26px; border-radius:50%; background:#eef4ec; color:#3a6635; font-weight:800; font-size:.78rem; display:grid; place-items:center; margin-bottom:9px; }
#page-recipe-hub .rhx-flow{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:18px; }
#page-recipe-hub .rhx-flow-s{ background:#fff; border:1px solid #e4e0d8; border-radius:999px; padding:8px 15px; font-size:.78rem; font-weight:700; color:#243447; }
#page-recipe-hub .rhx-flow-a{ color:#a9b0a4; font-weight:800; }
#page-recipe-hub .rhx-conns{ display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:12px; margin-top:20px; }
#page-recipe-hub .rhx-conn{ display:flex; align-items:center; gap:11px; background:#fff; border:1px solid #eaeef0; border-radius:14px; padding:13px 15px; cursor:pointer; font-family:inherit; text-align:left; }
#page-recipe-hub .rhx-conn:hover{ border-color:#c3cfc2; }
#page-recipe-hub .rhx-conn-ic{ font-size:1.15rem; }
#page-recipe-hub .rhx-conn-t{ display:block; font-weight:800; font-size:.84rem; color:#243447; }
#page-recipe-hub .rhx-conn-d{ display:block; font-size:.74rem; color:#8a9099; margin-top:1px; }
#page-recipe-hub .rhx-oneflow{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; background:#fff; border:1px solid #eaeef0; border-radius:999px; padding:10px; margin-top:26px; }

/* ── admin ──────────────────────────────────────────────────────────────── */
#page-recipe-hub .rhx-stats{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px; margin-top:18px; }
#page-recipe-hub .rhx-stat{ background:#fff; border:1px solid #eaeef0; border-radius:14px; padding:15px 16px; }
#page-recipe-hub .rhx-stat b{ display:block; font-family:'Playfair Display',Georgia,serif; font-size:1.6rem; color:#243447; line-height:1; }
#page-recipe-hub .rhx-stat span{ font-size:.74rem; color:#8a9099; font-weight:700; }
#page-recipe-hub .rhx-row{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; background:#fff; border:1px solid #eaeef0; border-radius:14px; padding:14px 16px; margin-top:10px; }
#page-recipe-hub .rhx-row-b{ flex:1; min-width:180px; }
#page-recipe-hub .rhx-row-t{ font-weight:800; color:#243447; font-size:.9rem; }
#page-recipe-hub .rhx-row-m{ font-size:.75rem; color:#8a9099; margin-top:2px; }
#page-recipe-hub .rhx-mini{ border-radius:8px; padding:6px 12px; font-size:.72rem; font-weight:800; cursor:pointer; font-family:inherit; border:1.5px solid #cdd9ce; background:#fff; color:#3a5540; }
#page-recipe-hub .rhx-mini.is-warn{ border-color:#d8c9a8; color:#8a6d2f; }

/* ── detail overlay ─────────────────────────────────────────────────────── */
.rh-view-overlay{ position:fixed; inset:0; background:rgba(20,30,40,.55); display:none; align-items:flex-start; justify-content:center; z-index:100000; overflow-y:auto; padding:24px 16px; }
.rh-view-overlay.open{ display:flex; }
.rh-view-sheet{ background:#fff; border-radius:24px; width:100%; max-width:880px; overflow:hidden; box-shadow:0 30px 80px rgba(20,30,40,.3); position:relative; margin:auto; }
.rh-view-x{ position:absolute; top:14px; right:16px; z-index:3; background:rgba(255,255,255,.9); border:1px solid #e4e0d8; border-radius:50%; width:34px; height:34px; color:#5a6659; font-size:1rem; font-weight:700; cursor:pointer; }
.rh-view-hero{ display:flex; gap:18px; align-items:center; padding:26px 26px 16px; background:linear-gradient(160deg,#f3f8f1,#eef4f8); }
.rh-view-emoji{ font-size:3rem; line-height:1; flex:0 0 auto; }
.rh-view-title{ font-family:'Playfair Display',Georgia,serif; font-size:1.5rem; font-weight:700; color:#243447 !important; line-height:1.15; }
.rh-view-labels{ display:flex; flex-wrap:wrap; gap:7px; margin-top:8px; align-items:center; }
.rh-view-body{ padding:4px 26px 26px; }
.rh-view-desc{ font-size:.94rem; color:#46566a; line-height:1.65; margin:16px 0; }
.rh-view-grid{ display:flex; flex-wrap:wrap; gap:16px; font-size:.84rem; color:#46566a; margin-bottom:16px; }
.rh-view-grid b{ color:#243447; }
.rh-view-tags{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:18px; }
.rhx-tg{ font-size:.66rem; font-weight:700; color:#4a7a4e; background:rgba(125,164,126,.14) !important; border-radius:7px; padding:4px 9px; }
.rhx-story{ background:#FBFAF7; border-left:3px solid #7d9e77; border-radius:0 12px 12px 0; padding:14px 16px; font-size:.88rem; color:#4a5560; line-height:1.65; font-style:italic; margin-bottom:18px; }
.rhx-dcols{ display:grid; grid-template-columns:1.5fr 1fr; gap:26px; }
.rhx-h{ font-family:'Playfair Display',Georgia,serif; font-size:1.08rem; font-weight:700; color:#243447 !important; margin:20px 0 10px; }
.rhx-ings{ list-style:none; padding:0; margin:0; }
.rhx-ings li{ display:flex; justify-content:space-between; gap:12px; padding:9px 0; border-bottom:1px solid #f1efe9; font-size:.88rem; color:#3d4a55; }
.rhx-ings li span{ color:#8a9099; font-weight:700; white-space:nowrap; }
.rhx-steps{ counter-reset:s; padding:0; margin:0; list-style:none; }
.rhx-steps li{ display:flex; gap:12px; margin-bottom:13px; }
.rhx-stepn{ width:26px; height:26px; flex:0 0 auto; border-radius:50%; background:#eef4ec; color:#3a6635; font-weight:800; font-size:.78rem; display:grid; place-items:center; }
.rhx-stept{ font-size:.88rem; color:#3d4a55; line-height:1.6; }
.rhx-sci{ display:flex; gap:12px; margin-bottom:12px; }
.rhx-sci-ic{ width:38px; height:38px; flex:0 0 auto; border-radius:12px; display:grid; place-items:center; font-size:1.1rem; }
.rhx-sci-l{ font-weight:800; font-size:.84rem; color:#243447; margin-bottom:3px; }
.rhx-sci-v{ font-size:.82rem; color:#5a6a78; line-height:1.6; }
.rhx-donut{ width:150px; height:150px; border-radius:50%; margin:0 auto 14px; position:relative; }
.rhx-donut::after{ content:''; position:absolute; inset:26%; background:#fff; border-radius:50%; }
.rhx-key{ display:flex; flex-direction:column; gap:7px; }
.rhx-keyi{ display:flex; align-items:center; gap:8px; font-size:.8rem; color:#4a5560; }
.rhx-keyd{ width:11px; height:11px; border-radius:3px; flex:0 0 auto; }
.rhx-side{ background:#FBFAF7; border:1px solid #eee9e0; border-radius:18px; padding:18px; position:sticky; top:20px; }
.rhx-side .rhx-btn{ width:100%; justify-content:center; margin-top:8px; }
.rhx-stars{ color:#D3A044; font-size:1rem; letter-spacing:2px; }
.rhx-cmt{ border-top:1px solid #f1efe9; padding:12px 0; }
.rhx-cmt-w{ font-weight:800; font-size:.82rem; color:#243447; }
.rhx-cmt-t{ font-size:.85rem; color:#4a5560; line-height:1.6; margin-top:3px; }

@media(max-width:860px){
  .rhx-dcols{ grid-template-columns:1fr; }
  .rhx-side{ position:static; }
}
@media(max-width:620px){
  #page-recipe-hub .rhx-cookas{ position:static; }
  #page-recipe-hub .rhx-pantry{ flex-direction:column; align-items:flex-start; }
  .rh-view-hero{ flex-direction:column; text-align:center; }
}