
:root {
  --ink:#233e33;
  --muted:#6f847b;
  --blue:#499776;
  --blue2:#387d60;
  --light:#f2fbf7;
  --bg:#f7faf9;
  --white:#fff;
  --line:#e3ece8;
  --orange:#f29a49;
  --shadow:0 8px 28px rgba(33,65,51,.055);
  --radius:20px
}

* {
  box-sizing:border-box
}

html {
  scroll-behavior:smooth
}

body {
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  -webkit-font-smoothing:antialiased
}

button,input,select,textarea {
  font:inherit
}

button {
  cursor:pointer
}

button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible {
  outline:3px solid #98ddc0;
  outline-offset:2px
}

button:disabled {
  cursor:not-allowed;
  opacity:.45
}

a {
  color:var(--blue)
}

.site {
  width:min(1180px,calc(100% - 36px));
  margin:0 auto
}

.site-header {
  background:#fff;
  border-bottom:1px solid var(--line)
}

.head-row {
  min-height:73px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px
}

.brand {
  display:flex;
  align-items:center;
  gap:12px;
  font-weight:800;
  font-size:19px;
  letter-spacing:-.8px
}

.brand-icon {
  width:38px;
  height:38px;
  border-radius:13px;
  background:#eaf7f1;
  display:grid;
  place-items:center;
  font-size:21px
}

.brand em {
  font-style:normal;
  color:var(--blue)
}

.private-pill {
  display:flex;
  gap:7px;
  align-items:center;
  border-radius:50px;
  border:1px solid #d8eadf;
  background:#f2faf5;
  color:#397c56;
  padding:6px 11px;
  font-size:11px;
  font-weight:750;
  white-space:nowrap
}

.private-pill:before {
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:#41a36a
}

.nav-shell {
  background:#fff;
  border-bottom:1px solid var(--line);
  position:sticky;
  top:0;
  z-index:8
}

.nav-wrap {
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px 0;
  overflow:auto
}

.tab {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:0;
  background:transparent;
  color:#6f827a;
  padding:11px 17px;
  border-radius:12px;
  font-weight:750;
  white-space:nowrap
}

.tab.active {
  background:#eefaf5;
  color:#378263
}

.tab:hover {
  background:#f3faf7
}

.nav-count {
  background:#d8f1e6;
  padding:1px 6px;
  border-radius:7px;
  font-size:11px
}

.nav-push {
  margin-left:auto
}

.nav-share {
  border:1px solid #cae3d9;
  background:#fff;
  color:#44866a;
  border-radius:11px;
  padding:10px 14px;
  font-weight:800;
  white-space:nowrap
}

.nav-share:hover {
  background:#f5fcf9
}

.hero {
  margin:27px 0 26px;
  border-radius:25px;
  padding:34px 37px;
  position:relative;
  overflow:hidden;
  background:linear-gradient(113deg,#284b3c 0%,#397058 65%,#498b6f 100%);
  color:#fff;
  box-shadow:0 12px 32px rgba(38,73,58,.14)
}

.hero:before,.hero:after {
  content:"";
  position:absolute;
  pointer-events:none;
  border-radius:50%
}

.hero:before {
  right:-93px;
  top:-170px;
  width:420px;
  height:420px;
  border:70px solid rgba(185,232,212,.11)
}

.hero:after {
  right:260px;
  bottom:-115px;
  width:240px;
  height:240px;
  background:radial-gradient(circle,rgba(242,154,73,.20),transparent 72%)
}

.eyebrow {
  text-transform:uppercase;
  letter-spacing:1.6px;
  font-size:11px;
  font-weight:850;
  color:#c9edde;
  margin:0 0 7px
}

.hero h1 {
  font-size:clamp(32px,4.5vw,49px);
  font-weight:850;
  line-height:1.08;
  letter-spacing:-1.8px;
  margin:0 0 11px
}

.hero p {
  max-width:580px;
  color:#e1f0e9;
  margin:0;
  font-size:15px
}

.hero-meta {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:25px;
  position:relative;
  z-index:1
}

.stat {
  display:flex;
  gap:9px;
  align-items:center;
  padding:8px 12px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:11px;
  background:rgba(255,255,255,.09);
  font-weight:750;
  font-size:12px
}

.stat b {
  font-size:18px;
  color:white
}

.main {
  padding-bottom:75px
}

.section-header {
  display:flex;
  gap:16px;
  justify-content:space-between;
  align-items:flex-end;
  margin:24px 0 16px
}

.section-header h2 {
  margin:0;
  font-size:26px;
  letter-spacing:-.8px;
  line-height:1.15
}

.section-header p {
  margin:6px 0 0;
  color:var(--muted);
  font-size:13px
}

.toolbar {
  display:flex;
  gap:7px;
  align-items:center;
  flex-wrap:wrap
}

.btn {
  border-radius:11px;
  border:1px solid var(--line);
  padding:10px 14px;
  background:white;
  color:#3a584b;
  font-weight:750;
  display:inline-flex;
  gap:7px;
  justify-content:center;
  align-items:center;
  line-height:1.15
}

.btn:hover {
  background:#f6fbf9
}

.btn.blue {
  border-color:var(--blue);
  background:var(--blue);
  color:#fff
}

.btn.blue:hover {
  background:#387d60
}

.btn.orange {
  border-color:#f5bb84;
  background:#fff4e8;
  color:#a35c20
}

.btn.sm {
  font-size:12px;
  padding:9px 11px
}

.btn.light {
  background:#effaf5;
  border-color:#d7ece3;
  color:#3a7f62
}

.btn.full {
  width:100%
}

.portion-bar {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  background:#fff;
  border:1px solid var(--line);
  padding:16px 19px;
  border-radius:16px;
  margin-bottom:20px;
  box-shadow:var(--shadow)
}

.portion-bar strong {
  display:block;
  font-size:14px
}

.small-muted {
  font-size:12px;
  color:var(--muted)
}

.counter {
  display:flex;
  align-items:center;
  gap:12px;
  background:#f6faf8;
  border:1px solid var(--line);
  padding:4px;
  border-radius:12px
}

.counter button {
  width:33px;
  height:33px;
  border:0;
  background:white;
  color:var(--blue);
  border-radius:9px;
  font-size:20px;
  font-weight:700;
  box-shadow:0 1px 3px rgba(0,0,0,.07)
}

.counter output {
  min-width:25px;
  text-align:center;
  font-size:17px;
  font-weight:850
}

.group-title {
  display:flex;
  align-items:center;
  gap:12px;
  margin:29px 0 14px
}

.group-title h3 {
  margin:0;
  font-size:18px;
  letter-spacing:-.4px
}

.group-title .group-line {
  height:1px;
  flex:1;
  background:#dee8e4
}

.group-label {
  padding:4px 9px;
  border:1px solid #e0ebe7;
  background:#fff;
  color:#72877e;
  border-radius:8px;
  font-size:11px;
  font-weight:750
}

.recipe-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px
}

.recipe-card {
  background:white;
  border:1.5px solid #e4eeea;
  border-radius:19px;
  overflow:hidden;
  box-shadow:var(--shadow);
  display:flex;
  flex-direction:column;
  transition:border-color .2s,transform .2s
}

.recipe-card:hover {
  transform:translateY(-2px)
}

.recipe-card.is-selected {
  border-color:#9bceb9;
  box-shadow:0 8px 30px rgba(73,151,118,.10)
}

.recipe-top {
  height:100px;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  padding:16px 18px;
  position:relative;
  overflow:hidden
}

.recipe-top:before {
  content:"";
  height:170px;
  width:170px;
  right:-55px;
  top:-64px;
  border-radius:50%;
  position:absolute;
  border:30px solid rgba(255,255,255,.22)
}

.tone-chicken {
  background:linear-gradient(120deg,#ebf9f3,#e3f6ee)
}

.tone-beef {
  background:linear-gradient(120deg,#fbeadf,#ffe3c8)
}

.tone-other {
  background:linear-gradient(120deg,#e9f4e4,#dcf2e0)
}

.dish-emoji {
  font-size:51px;
  filter:drop-shadow(0px 6px 4px rgba(0,0,0,.08));
  line-height:1
}

.picked {
  border-radius:25px;
  background:rgba(255,255,255,.9);
  color:#287348;
  font-weight:850;
  padding:5px 10px;
  font-size:11px
}

.not-picked {
  color:#7b9087;
  background:rgba(255,255,255,.75)
}

.recipe-content {
  padding:18px;
  display:flex;
  flex:1;
  flex-direction:column
}

.recipe-name {
  margin:0;
  font-size:18px;
  line-height:1.25;
  letter-spacing:-.5px
}

.recipe-desc {
  font-size:12px;
  line-height:1.5;
  color:var(--muted);
  margin:8px 0 13px;
  min-height:36px
}

.facts {
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-bottom:14px
}

.fact {
  padding:5px 8px;
  background:#f5f8f7;
  border-radius:7px;
  color:#5f766c;
  font-size:11px;
  font-weight:750
}

.fact.protein {
  color:#449171;
  background:#ecf9f3
}

.ingredient-preview {
  border-top:1px solid #eff3f1;
  padding-top:12px;
  flex:1
}

.ingredient-preview small {
  color:#9caba5;
  font-weight:800;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.8px
}

.ingredient-preview p {
  font-size:12px;
  color:#657870;
  margin:5px 0 13px
}

.card-actions {
  display:flex;
  gap:8px
}

.card-actions .btn {
  flex:1
}

.btn.picked-btn {
  border-color:#c9e1d0;
  background:#ebf8ed;
  color:#25804c
}

.details {
  border-top:1px solid #e9f0ed;
  padding:0 18px 17px;
  background:#fcfefd
}

.details h4 {
  font-size:13px;
  color:#38594b;
  margin:17px 0 8px
}

.detail-ingredients {
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:5px
}

.detail-ingredients li {
  display:flex;
  justify-content:space-between;
  gap:8px;
  font-size:12px;
  border-bottom:1px dashed #e9f0ed;
  padding:4px 0
}

.detail-ingredients li strong {
  white-space:nowrap
}

.steps {
  margin:0;
  padding-left:20px;
  font-size:12px;
  color:#546b61
}

.steps li {
  padding:0 0 8px 2px
}

.freeze-note {
  padding:10px;
  border-radius:10px;
  background:#eef7f3;
  font-size:12px;
  color:#506e61;
  margin:10px 0 0
}

.notice {
  color:#74867e;
  font-size:12px;
  margin:16px 0
}

.panel {
  background:#fff;
  border:1px solid var(--line);
  border-radius:19px;
  box-shadow:var(--shadow);
  padding:22px
}

.shopping-head {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  flex-wrap:wrap
}

.shopping-progress {
  height:7px;
  width:100%;
  border-radius:20px;
  background:#f0f5f3;
  overflow:hidden;
  margin:20px 0 0
}

.shopping-progress-inner {
  background:linear-gradient(90deg,#4e9f7c,#71b498);
  height:100%;
  width:0%;
  transition:width .2s
}

.progress-label {
  font-size:12px;
  color:var(--muted);
  margin-top:7px
}

.shopping-columns {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin-top:17px
}

.shopping-group {
  border:1px solid #e9f0ed;
  background:#fff;
  border-radius:15px;
  padding:16px 17px
}

.shopping-group h3 {
  font-size:14px;
  margin:0 0 10px;
  display:flex;
  gap:9px;
  align-items:center
}

.shopping-row {
  display:flex;
  gap:11px;
  align-items:center;
  min-height:39px;
  border-top:1px solid #f2f5f4;
  padding:6px 0
}

.shopping-row:first-child {
  border-top:0
}

.shopping-row input {
  width:18px;
  height:18px;
  accent-color:#4d9677;
  flex:none;
  cursor:pointer
}

.item-name {
  flex:1;
  font-size:13px;
  min-width:0
}

.item-name.done {
  text-decoration:line-through;
  color:#a2afaa
}

.item-qty {
  font-size:12px;
  font-weight:800;
  color:#647d73;
  white-space:nowrap
}

.remove-item {
  border:0;
  background:transparent;
  font-size:19px;
  color:#8fa099;
  padding:0 3px
}

.add-custom {
  display:flex;
  gap:8px;
  margin-top:18px
}

.add-custom input,.share-input,.search-input {
  min-width:0;
  flex:1;
  border:1px solid #d9e5e0;
  background:#fff;
  border-radius:10px;
  padding:11px 12px;
  color:var(--ink)
}

.extra-summary {
  font-size:12px;
  color:var(--muted);
  margin-top:9px
}

.empty-state {
  border:1px dashed #ccdcd5;
  border-radius:14px;
  text-align:center;
  background:#fbfefd;
  padding:45px 15px;
  color:#6b8077
}

.empty-state strong {
  display:block;
  margin:8px 0;
  color:#314f42
}

.guide-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px
}

.guide-card {
  border:1px solid var(--line);
  background:white;
  border-radius:16px;
  padding:21px
}

.guide-card h3 {
  margin:0 0 13px;
  font-size:17px
}

.guide-card ol {
  margin:0;
  padding-left:21px;
  color:#5d746a;
  font-size:13px
}

.guide-card li {
  margin-bottom:13px
}

.guide-card li strong {
  color:var(--ink)
}

.week-grid {
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:10px;
  margin-top:18px
}

.weekday {
  border:1px solid #e4ede9;
  background:white;
  border-radius:14px;
  padding:15px;
  min-height:145px
}

.weekday small {
  font-weight:850;
  color:#859b92;
  text-transform:uppercase;
  letter-spacing:.8px
}

.weekday .day-icon {
  font-size:29px;
  margin:8px 0
}

.weekday strong {
  font-size:13px;
  line-height:1.25;
  display:block
}

.weekday span {
  font-size:11px;
  color:var(--muted);
  display:block;
  margin-top:7px
}

.footer {
  padding:25px 0 38px;
  color:#8c9d96;
  font-size:12px;
  border-top:1px solid var(--line);
  display:flex;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap
}

.hidden {
  display:none!important
}

.share-dialog {
  border:0;
  border-radius:20px;
  box-shadow:0 35px 95px rgba(27,54,43,.27);
  width:min(620px,calc(100% - 25px));
  max-height:88vh;
  overflow:auto;
  padding:0;
  color:var(--ink)
}

.share-dialog::backdrop {
  background:rgba(26,53,42,.5)
}

.dialog-head {
  padding:21px 23px;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
  border-bottom:1px solid var(--line)
}

.dialog-head h2 {
  margin:0;
  font-size:23px
}

.dialog-head p {
  font-size:13px;
  color:var(--muted);
  margin:5px 0 0
}

.close {
  border:0;
  background:#f0f5f3;
  color:#667b72;
  font-size:22px;
  line-height:1;
  border-radius:9px;
  width:33px;
  height:33px
}

.dialog-body {
  padding:20px 23px 24px
}

.share-options {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px
}

.share-option {
  padding:16px;
  text-align:left;
  border:1px solid var(--line);
  border-radius:13px;
  background:#fcfefd
}

.share-option b {
  display:block;
  font-size:14px
}

.share-option small {
  display:block;
  color:var(--muted);
  margin-top:5px;
  line-height:1.4
}

.code-section {
  border-top:1px solid var(--line);
  margin-top:23px;
  padding-top:20px
}

.code-section h3 {
  margin:0 0 5px;
  font-size:16px
}

.code-section p {
  font-size:12px;
  color:var(--muted);
  margin:0 0 13px
}

.code-line {
  display:flex;
  gap:7px
}

.share-input {
  width:100%;
  font-size:12px
}

.dialog-actions {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px
}

.toast {
  position:fixed;
  z-index:30;
  bottom:24px;
  left:50%;
  transform:translateX(-50%) translateY(18px);
  border-radius:12px;
  background:#284a3c;
  color:#fff;
  font-weight:750;
  padding:12px 17px;
  box-shadow:0 12px 40px #12385333;
  opacity:0;
  pointer-events:none;
  transition:opacity .18s,transform .18s;
  text-align:center;
  max-width:calc(100vw - 30px)
}

.toast.show {
  opacity:1;
  transform:translateX(-50%) translateY(0)
}

.copy-fallback {
  margin-top:8px;
  width:100%;
  min-height:90px;
  border:1px solid var(--line);
  border-radius:9px;
  padding:10px
}

.hint {
  font-size:12px;
  color:var(--muted)
}

.section-intro {
  margin-top:0;
  color:#6c847a;
  font-size:13px
}

.main-view {
  animation:fade .2s ease-out
}

@keyframes fade {
  from {
    opacity:.5;
    transform:translateY(4px)
  }
  to {
    opacity:1;
    transform:translateY(0)
  }
}

@media(max-width:960px) {
  .recipe-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .week-grid {
    grid-template-columns:repeat(3,minmax(0,1fr))
  }
}

@media(max-width:640px) {
  .site {
    width:min(100% - 24px,1180px)
  }
  .head-row {
    min-height:63px
  }
  .brand {
    font-size:18px
  }
  .private-pill {
    font-size:10px;
    padding:6px 8px
  }
  .nav-wrap {
    gap:3px
  }
  .tab {
    padding:10px 12px;
    font-size:12px
  }
  .nav-share {
    font-size:12px;
    padding:9px 12px
  }
  .hero {
    margin:16px 0 22px;
    padding:27px 22px;
    border-radius:19px
  }
  .hero h1 {
    font-size:37px
  }
  .hero p {
    font-size:13px
  }
  .hero-meta {
    gap:7px;
    margin-top:22px
  }
  .stat {
    padding:7px 9px;
    font-size:10px
  }
  .stat b {
    font-size:15px
  }
  .section-header {
    align-items:flex-start;
    flex-direction:column;
    gap:12px;
    margin-top:22px
  }
  .section-header h2 {
    font-size:24px
  }
  .toolbar {
    width:100%
  }
  .btn.sm {
    font-size:12px
  }
  .portion-bar {
    padding:15px
  }
  .recipe-grid,.shopping-columns,.guide-grid {
    grid-template-columns:1fr
  }
  .recipe-top {
    height:90px
  }
  .recipe-content {
    padding:15px
  }
  .recipe-desc {
    min-height:0
  }
  .recipe-name {
    font-size:18px
  }
  .week-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .panel {
    padding:15px
  }
  .share-options {
    grid-template-columns:1fr
  }
  .dialog-head {
    padding:17px
  }
  .dialog-body {
    padding:17px
  }
  .shopping-group {
    padding:13px
  }
  .toast {
    bottom:20px
  }
  .footer {
    padding-bottom:75px
  }
}

@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after {
    animation:none!important;
    transition:none!important
  }
}

.version {
  font-size:10px;
  color:#85a095;
  letter-spacing:.2px;
  vertical-align:middle;
  background:#f3fbf8;
  padding:3px 5px;
  border-radius:6px
}

.nutrition-note {
  background:#f5fbf8;
  border:1px solid #d8ebe3;
  padding:14px 16px;
  border-radius:13px;
  color:#537164;
  font-size:12px;
  margin:10px 0 19px;
  line-height:1.55
}

.macro-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;
  margin:10px 0 14px
}

.macro-box {
  background:#f5fbf8;
  border:1px solid #eaf4f0;
  border-radius:9px;
  padding:8px 5px;
  text-align:center;
  line-height:1.35
}

.macro-box b {
  display:block;
  font-size:15px;
  color:#284c3d
}

.macro-box span {
  font-size:10px;
  color:#70887e
}

.macro-box.prot {
  background:#ebf9f3;
  border-color:#def2ea
}

.macro-box.energy {
  background:#fff5ea;
  border-color:#fbe8d6
}

.weekly-table {
  display:grid;
  gap:11px
}

.day-card {
  border:1px solid var(--line);
  background:#fff;
  border-radius:17px;
  padding:16px;
  box-shadow:var(--shadow)
}

.day-card-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px
}

.day-card-head h3 {
  margin:0;
  font-size:15px
}

.day-selects {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px
}

.day-selects label {
  display:block;
  font-size:11px;
  font-weight:750;
  color:#758d83;
  margin-bottom:5px
}

.day-selects select {
  width:100%;
  border:1px solid #dbe8e3;
  background:#fcfefd;
  color:var(--ink);
  padding:11px 8px;
  border-radius:10px;
  font-size:12px;
  min-width:0
}

.daily-macros {
  font-size:12px;
  color:#577e6e;
  font-weight:750;
  margin-top:12px;
  background:#f1f9f6;
  padding:8px 10px;
  border-radius:9px
}

.macro-summary {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px
}

.macro-summary .macro-box {
  padding:13px 7px
}

.macro-summary .macro-box b {
  font-size:23px
}

.nutrition-list {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-top:15px
}

.nutrition-recipe {
  border:1px solid var(--line);
  border-radius:13px;
  background:white;
  padding:15px
}

.nutrition-recipe h4 {
  margin:0 0 9px;
  font-size:14px
}

.category-heading {
  margin:25px 0 12px;
  font-size:18px
}

@media(max-width:640px) {
  .nutrition-list {
    grid-template-columns:1fr
  }
  .macro-summary {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .day-selects {
    grid-template-columns:1fr
  }
  .day-card {
    padding:13px
  }
  .macro-grid {
    gap:5px
  }
  .macro-box b {
    font-size:13px
  }
  .macro-box span {
    font-size:9px
  }
}

.cost-teaser {
  margin-top:19px;
  padding:12px 14px;
  border-radius:14px;
  background:#f2fbf7;
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  align-items:center;
  justify-content:space-between
}

.cost-teaser strong {
  color:#407b62
}

.big-cost {
  font-size:37px;
  font-weight:850;
  letter-spacing:-1.2px;
  color:var(--blue);
  margin:5px 0
}

.cost-list {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px
}

.cost-card {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:15px 17px;
  background:white;
  border:1px solid var(--line);
  border-radius:15px
}

.cost-card strong {
  font-size:13px
}

.cost-fig {
  text-align:right;
  flex:none
}

.cost-fig b {
  font-size:18px;
  color:#368161;
  display:block
}

.cost-fig span,.cost-fig small {
  display:block;
  color:var(--muted);
  font-size:11px
}

.price-row {
  border-top:1px solid #edf2f0;
  padding:11px 0;
  display:grid;
  grid-template-columns:minmax(0,1fr) 116px 65px;
  gap:10px;
  align-items:center
}

.price-row:first-of-type {
  border-top:0
}

.price-row strong {
  font-size:12px
}

.price-entry span {
  display:block;
  font-size:11px;
  color:var(--muted)
}

.price-entry input {
  width:100%;
  height:37px;
  border:1px solid var(--line);
  border-radius:8px;
  padding:6px 8px;
  background:#fcfefd
}

.price-total {
  text-align:right;
  color:var(--blue);
  white-space:nowrap
}

.goals-panel {
  margin:20px 0
}

.goals-panel h3 {
  margin:0 0 8px
}

.goals-panel h4 {
  margin:20px 0 13px
}

.targets-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  margin:18px 0
}

.targets-grid label,.cloud-fields label {
  font-size:12px;
  font-weight:750;
  color:#5e756b
}

.targets-grid input,.cloud-fields input {
  display:block;
  width:100%;
  padding:10px;
  margin-top:6px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#fcfefd;
  min-width:0
}

.goal-grid {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:12px
}

.goal-card {
  border:1px solid var(--line);
  border-radius:12px;
  padding:12px
}

.goal-top {
  display:flex;
  gap:10px;
  justify-content:space-between;
  font-size:12px;
  margin-bottom:8px
}

.goal-top b {
  white-space:nowrap
}

.goal-track {
  background:#edf5f2;
  height:8px;
  overflow:hidden;
  border-radius:99px;
  margin-bottom:8px
}

.goal-track>div {
  height:100%;
  border-radius:99px
}

.cloud-top {
  margin-bottom:16px
}

.cloud-pill {
  display:inline-flex;
  padding:5px 9px;
  border-radius:25px;
  background:#f2f6f4;
  color:#70837b;
  font-size:12px;
  font-weight:800
}

.cloud-pill.active {
  background:#e5f7ef;
  color:#267350
}

.sync-status {
  display:flex;
  gap:13px;
  align-items:center;
  flex-wrap:wrap
}

.sync-status strong {
  font-size:13px
}

.sync-status strong[data-tone="error"] {
  color:#b33c36
}

.sync-status strong[data-tone="good"] {
  color:#267350
}

.cloud-fields {
  display:grid;
  gap:13px;
  margin:18px 0
}

.cloud-setup h3,.cloudConnected h3 {
  margin-top:0
}

.cloud-textarea {
  width:100%;
  resize:vertical;
  min-height:90px
}

.cloud-setup p {
  font-size:13px;
  color:var(--muted)
}

.cloud-setup code {
  font-size:12px
}

.cloud-top .small-muted {
  margin-bottom:0
}

@media(max-width:780px) {
  .cost-list,.goal-grid {
    grid-template-columns:1fr
  }
  .targets-grid {
    grid-template-columns:repeat(2,1fr)
  }
  .price-row {
    grid-template-columns:minmax(0,1fr) 100px 60px
  }
  .price-total {
    font-size:11px
  }
}

@media(max-width:460px) {
  .cost-teaser .btn {
    width:100%
  }
  .targets-grid {
    gap:8px
  }
  .price-row {
    grid-template-columns:minmax(0,1fr) 88px 54px;
    gap:6px
  }
  .price-row strong {
    font-size:11px
  }
  .price-entry input {
    font-size:13px
  }
  .price-total {
    font-size:10px
  }
}

/* 4.1 - authentic photo placeholders + genuinely thumb-friendly mobile controls */
.header-actions {
  display:flex;
  align-items:center;
  gap:9px
}

.mobile-share {
  display:none
}

.recipe-discover {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:13px;
  margin:4px 0 15px;
  flex-wrap:wrap
}

.recipe-search-label {
  display:flex;
  align-items:center;
  gap:8px;
  flex:1;
  min-width:230px;
  max-width:415px;
  border:1px solid #dbe8e3;
  border-radius:14px;
  background:white;
  padding:0 13px;
  font-weight:800;
  color:#859c92;
  box-shadow:var(--shadow)
}

.recipe-search-label input {
  height:45px;
  width:100%;
  min-width:0;
  border:0;
  background:transparent;
  outline:none;
  font-size:13px
}

.meal-filters {
  display:flex;
  gap:7px;
  overflow:auto
}

.filter-pill {
  background:#fff;
  border:1px solid #dfeae5;
  border-radius:999px;
  padding:9px 14px;
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
  color:#6c8178
}

.filter-pill.active {
  background:#3e8e6c;
  color:white;
  border-color:#3e8e6c
}

.recipe-top {
  height:175px;
  padding:13px 14px;
  align-items:flex-end;
  background:linear-gradient(125deg,#e4f1ec,#f5faf8)
}

.recipe-top:before {
  display:none
}

.recipe-img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center
}

.recipe-top:after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 32%,rgba(14,30,23,.45) 100%)
}

.recipe-top .dish-emoji,.recipe-top .picked {
  position:relative;
  z-index:1
}

.recipe-top .dish-emoji {
  font-size:26px;
  background:rgba(255,255,255,.86);
  border-radius:12px;
  padding:7px;
  line-height:1
}

.recipe-top .picked {
  box-shadow:0 2px 8px rgba(0,0,0,.10)
}

.recipe-top.photo-top {
  background:#cddfd7
}

.recipe-card {
  border-radius:22px
}

.recipe-card .facts {
  margin-top:2px
}

.recipe-editor-btn {
  margin-top:8px
}

.recipe-editor-dialog {
  border:0;
  padding:0;
  border-radius:22px;
  max-width:710px;
  width:min(94vw,710px);
  max-height:90dvh;
  overflow:auto;
  box-shadow:0 30px 100px #092a4b50
}

.recipe-editor-dialog::backdrop {
  background:rgba(24,47,37,.62)
}

.recipe-editor-dialog .dialog-head {
  position:sticky;
  top:0;
  z-index:2;
  background:#fff
}

.recipe-form-content {
  padding:19px 23px;
  display:grid;
  gap:15px
}

.recipe-form-content>label,.form-two label,.editor-macros label {
  font-size:12px;
  font-weight:780;
  color:#597268;
  display:block
}

.recipe-form-content label>span,.editor-subhead h3>span {
  color:#a75c20
}

.recipe-form-content input:not([type=file]),.recipe-form-content select,.recipe-form-content textarea {
  width:100%;
  display:block;
  min-width:0;
  margin-top:5px;
  border:1px solid #dae6e1;
  background:#fcfefd;
  padding:11px;
  border-radius:10px;
  color:#2c453a;
  font-size:14px
}

.recipe-form-content textarea {
  resize:vertical
}

.form-two {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:13px
}

.editor-subhead {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px
}

.editor-subhead h3,.recipe-form-content h3 {
  margin:0;
  font-size:16px
}

.recipe-form-content h3 small {
  font-size:11px;
  color:#7f978d
}

.editor-footnote {
  font-size:12px;
  color:#6e857b;
  margin:-7px 0 0
}

.photo-input {
  padding:12px;
  background:#f5faf8;
  border-radius:12px
}

.photo-input input {
  display:block;
  margin-top:6px;
  font-size:12px;
  max-width:100%
}

.ingredient-editor-list {
  display:grid;
  gap:8px
}

.ingredient-edit-row {
  display:grid;
  grid-template-columns:minmax(0,1fr) 80px 80px 96px 32px;
  gap:6px;
  align-items:center
}

.ingredient-edit-row input,.ingredient-edit-row select {
  margin:0!important;
  padding:9px 6px!important;
  font-size:12px!important
}

.ingredient-edit-row button {
  border:0;
  background:#ffefed;
  border-radius:9px;
  color:#a25148;
  font-size:20px;
  height:38px
}

.editor-macros {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:9px
}

.editor-actions {
  position:sticky;
  bottom:0;
  background:#fff;
  border-top:1px solid var(--line);
  padding:13px 22px;
  display:flex;
  justify-content:flex-end;
  gap:10px
}

.editor-error {
  color:#aa332d;
  background:#fff2f0;
  border:1px solid #f5c8c5;
  padding:11px;
  border-radius:11px;
  font-size:13px
}

.instruction-actions {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:14px
}

.instruction-actions .btn {
  flex:1 1 180px
}

.instruction-note {
  margin-top:8px;
  font-size:11px;
  color:#6c8379
}

.photo-notice {
  font-size:11px;
  color:#72847d
}

@media(max-width:640px) {
  .site {
    width:calc(100% - 22px)
  }
  .head-row {
    min-height:60px
  }
  .brand-icon {
    width:34px;
    height:34px
  }
  .private-pill {
    font-size:9px
  }
  .mobile-share {
    display:block;
    width:36px;
    height:36px;
    border:1px solid #daebe4;
    background:#f4fbf8;
    border-radius:11px;
    color:#397f62;
    font-size:21px
  }
  .nav-shell {
    position:fixed;
    bottom:0;
    top:auto;
    width:100%;
    z-index:16;
    border-top:1px solid #dce7e2;
    border-bottom:0;
    box-shadow:0 -7px 28px #14334b17;
    padding-bottom:env(safe-area-inset-bottom)
  }
  .nav-wrap {
    gap:1px;
    padding:5px 3px;
    overflow:visible;
    justify-content:space-around
  }
  .nav-wrap .tab {
    display:grid;
    gap:1px;
    min-width:0;
    flex:1;
    padding:7px 2px;
    border-radius:9px;
    font-size:10px;
    line-height:1.15;
    white-space:normal
  }
  .nav-wrap .tab span {
    font-size:9px
  }
  .nav-count {
    display:none
  }
  .nav-push,.nav-share {
    display:none
  }
  .main {
    padding-bottom:115px
  }
  .hero {
    padding:20px;
    border-radius:18px;
    margin-top:12px;
    margin-bottom:14px
  }
  .hero h1 {
    font-size:31px
  }
  .hero p {
    font-size:12px
  }
  .hero-meta {
    margin-top:14px;
    gap:5px
  }
  .stat {
    font-size:9px;
    padding:6px 7px
  }
  .stat b {
    font-size:13px
  }
  .recipe-top {
    height:190px
  }
  .recipe-discover {
    gap:10px
  }
  .recipe-search-label {
    max-width:none;
    min-width:100%
  }
  .meal-filters {
    width:100%;
    padding-bottom:3px
  }
  .filter-pill {
    font-size:11px
  }
  .recipe-form-content {
    padding:14px 13px
  }
  .recipe-editor-dialog {
    width:100%;
    max-height:94dvh;
    border-radius:22px 22px 0 0;
    margin:auto 0 0
  }
  .form-two {
    grid-template-columns:1fr 1fr;
    gap:9px
  }
  .ingredient-edit-row {
    grid-template-columns:minmax(0,1fr) 62px 65px 30px
  }
  .ingredient-edit-row select[data-ing-cat] {
    grid-column:1/5
  }
  .ingredient-edit-row button {
    grid-column:4;
    grid-row:1
  }
  .editor-macros {
    grid-template-columns:1fr 1fr
  }
  .editor-actions {
    padding:10px 13px;
    padding-bottom:calc(10px + env(safe-area-inset-bottom))
  }
  .editor-actions .btn {
    flex:1
  }
}

/* Authentic-photo edition: neutral cover until user provides a genuine picture. */
.recipe-top:not(.photo-top) {
  background:linear-gradient(135deg,#eef7f3 0%,#e3f0ea 49%,#f6f9f8 100%);
  position:relative
}

.recipe-top:not(.photo-top):after {
  display:none
}

.recipe-top:not(.photo-top) .dish-emoji {
  font-size:35px;
  padding:12px 13px;
  background:white;
  box-shadow:0 8px 25px #1d547d15
}

.photo-placeholder-label {
  position:absolute;
  left:16px;
  top:18px;
  color:#6f8e81;
  letter-spacing:1.3px;
  font-size:10px;
  font-weight:900
}

.photo-dialog {
  border:0;
  border-radius:22px;
  padding:0;
  width:min(94vw,510px);
  max-height:90dvh;
  overflow:auto;
  box-shadow:0 24px 90px #15324a46
}

.photo-dialog::backdrop {
  background:#122a3f9a
}

.photo-panel {
  padding:22px;
  display:grid;
  gap:15px;
  color:#4d665c;
  font-size:13px
}

.photo-panel label {
  display:block;
  font-weight:750
}

.photo-panel input[type=url],.photo-panel input[type=file] {
  display:block;
  width:100%;
  margin-top:7px;
  padding:10px;
  border:1px solid #d1e1da;
  border-radius:12px;
  background:#f8fdfb;
  font:inherit
}

.photo-preview {
  min-height:100px;
  border-radius:13px;
  background:#eff6f3;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden
}

.photo-preview img {
  width:100%;
  height:180px;
  object-fit:cover
}

.photo-links {
  display:flex;
  gap:12px;
  flex-wrap:wrap
}

.photo-links a {
  color:#3a8a68;
  font-weight:800;
  text-decoration:underline
}

.photo-actions {
  display:flex;
  gap:9px;
  flex-wrap:wrap;
  justify-content:flex-end;
  padding:15px 20px;
  border-top:1px solid #e1eae6
}

.photo-actions .btn {
  font-size:12px
}

@media(max-width:640px) {
  .photo-dialog {
    width:100%;
    max-height:90dvh;
    margin:auto 0 0;
    border-radius:22px 22px 0 0
  }
  .photo-panel {
    padding:17px
  }
  .photo-actions {
    justify-content:stretch;
    padding-bottom:calc(12px + env(safe-area-inset-bottom))
  }
  .photo-actions .btn {
    flex:1
  }
}

/* 4.2: clear raw/dry measures and cooked-weight portioning */
.ingredient-line {
  align-items:flex-start!important
}

.ingredient-line>span {
  min-width:0
}

.ingredient-line small {
  display:block;
  color:#8b9c95;
  font-size:10px;
  margin-top:2px;
  line-height:1.4
}

.ingredient-line strong {
  font-variant-numeric:tabular-nums
}

.measure-hint {
  font-size:11px;
  color:#7f9a8e;
  font-weight:600
}

.ingredient-helper {
  font-size:11px;
  color:#718a7f;
  margin:-2px 0 11px;
  line-height:1.55
}

.portioning-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px
}

.portioning-card {
  background:#fff;
  border:1px solid #e0ece7;
  box-shadow:var(--shadow);
  border-radius:19px;
  padding:17px;
  min-width:0
}

.portioning-card h3 {
  margin:0;
  font-size:16px
}

.portioning-topline {
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
  color:#71897f;
  font-size:11px;
  margin:6px 0 12px
}

.portioning-card .cooked-calc {
  border:0;
  padding:0;
  background:transparent;
  margin:0
}

.cooked-calc {
  background:#f4faf7;
  border:1px solid #d4e7df;
  border-radius:14px;
  margin-top:16px;
  padding:14px
}

.cooked-heading {
  display:flex;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  font-size:13px;
  font-weight:850;
  color:#3b6f59
}

.recorded-tag {
  color:#287d58;
  font-weight:800;
  background:#ddf4e6;
  padding:4px 7px;
  border-radius:30px;
  font-size:10px
}

.cooked-help {
  font-size:11px;
  color:#70897e;
  margin:5px 0 12px;
  line-height:1.55
}

.cooked-controls {
  display:grid;
  grid-template-columns:minmax(0,1.3fr) auto minmax(0,1fr);
  gap:10px;
  align-items:end
}

.cooked-input-label {
  font-size:11px;
  color:#657870;
  font-weight:800;
  line-height:1.3
}

.cooked-input-label span {
  font-weight:500
}

.cooked-input-label input {
  display:block;
  height:47px;
  margin-top:6px;
  width:100%;
  border:1px solid #c5dbd2;
  border-radius:10px;
  padding:9px 10px;
  background:#fff;
  color:#264136;
  font-size:18px;
  font-weight:800;
  min-width:0;
  font-variant-numeric:tabular-nums
}

.calc-divide {
  height:47px;
  align-self:end;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  font-size:16px;
  color:#748980;
  line-height:1.1
}

.calc-divide strong {
  font-size:17px;
  color:#3f6454
}

.calc-divide small {
  font-size:9px
}

.calc-answer {
  background:#e5f6ee;
  border:1px solid #d2ebe1;
  border-radius:10px;
  text-align:center;
  min-height:54px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:5px
}

.calc-answer span {
  font-size:9px;
  letter-spacing:.4px;
  color:#5e8273;
  font-weight:900
}

.calc-answer strong {
  font-size:21px;
  white-space:nowrap;
  color:#35765b;
  font-variant-numeric:tabular-nums;
  line-height:1.15
}

.cooked-bottom {
  margin-top:10px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px
}

.cooked-bottom small {
  color:#7a9087;
  font-size:10px;
  line-height:1.4
}

.cooked-bottom button {
  flex:none;
  font-size:10px!important;
  padding:7px!important
}

.portion-banner {
  margin-bottom:17px
}

@media(max-width:850px) {
  .portioning-grid {
    grid-template-columns:1fr
  }
}

@media(max-width:380px) {
  .cooked-controls {
    gap:5px
  }
  .calc-answer strong {
    font-size:17px
  }
  .cooked-input-label input {
    font-size:16px;
    padding:6px
  }
  .cooked-calc {
    padding:10px
  }
}

/* 4.3: family discovery */
.kid-fact {
  background:#fff2df;
  color:#955d21
}

.kid-tip {
  background:#fff8eb;
  border:1px solid #ffe2b6;
  border-radius:11px;
  padding:11px;
  color:#72502b;
  font-size:12px;
  line-height:1.5;
  margin-top:10px
}

.kid-tip em {
  display:block;
  font-style:normal;
  margin-top:6px;
  color:#87663c
}

.family-note {
  border:1px solid #f0ddb9;
  background:#fff9f0;
  border-radius:12px;
  padding:13px 16px;
  color:#6a5538;
  font-size:12px;
  line-height:1.6;
  margin:16px 0
}

.kid-editor-label {
  display:flex!important;
  align-items:center;
  gap:10px;
  background:#fff8ed;
  padding:12px;
  border-radius:12px;
  border:1px solid #f3dcba;
  color:#7c542a!important;
  font-size:13px!important
}

.kid-editor-label input {
  accent-color:#b66a2d;
  width:19px;
  height:19px;
  flex:none
}

.kid-editor-label input[type=checkbox] {
  display:inline!important;
  width:19px!important;
  margin:0!important
}

/* 4.4 discovery + vegetable badge */
.cuisine-label {
  font-size:12px;
  font-weight:800;
  color:#537164;
  display:flex;
  align-items:center;
  gap:8px;
  white-space:nowrap
}

.cuisine-label select {
  border:1px solid #d9e8e1;
  border-radius:11px;
  padding:10px 12px;
  background:white;
  color:#3d5e50;
  font-weight:700;
  max-width:175px
}

.added-veg {
  display:inline-flex;
  align-items:center;
  gap:5px;
  background:#e6f7e4;
  color:#246337;
  border:1px solid #bde5c2
}

.added-veg img {
  width:23px;
  height:23px;
  object-fit:contain
}

.veg-detail {
  display:flex;
  align-items:center;
  gap:10px;
  border:1px solid #c4e8c9;
  background:#f1f9ef;
  color:#35623d;
  border-radius:11px;
  font-size:12px;
  padding:9px 11px;
  margin-top:12px;
  font-weight:750
}

.veg-detail img {
  width:45px;
  height:45px;
  object-fit:contain
}

@media(max-width:640px) {
  .cuisine-label {
    width:100%;
    justify-content:space-between
  }
  .cuisine-label select {
    flex:1;
    max-width:none
  }
}

  

.protein-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 16px}
.protein-label{font:700 17px var(--serif);margin-right:2px}
.protein-chips{display:flex;flex-wrap:wrap;gap:8px}
.protein-count{display:inline-block;min-width:1.7em;margin-left:4px;padding:0 6px;border-radius:999px;background:var(--tape);color:var(--ink);font-size:11px;font-weight:800;text-align:center}
.filter-pill.active .protein-count{background:var(--tape)}
.protein-row .cuisine-label{margin-left:auto}
@media(max-width:640px){.protein-row .cuisine-label{margin-left:0;width:100%}.protein-row .cuisine-label select{flex:1}}
.header-btns{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.backup-panel{margin-top:16px;padding:18px 22px}.backup-panel h3{margin:0 0 6px;font-size:20px}
.backup-actions{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}

/* 4.5 – quick-reference per serving / whole batch macro selectors.
   Uses the customised The Family Prep Co. green / paper-tape styling. */
.macro-choice{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:4px 0 7px;flex-wrap:wrap}
.macro-choice-label{font-size:11px;font-weight:750;color:var(--muted)}
.macro-segments{display:inline-flex;gap:0;border:1.5px solid var(--ink);background:white;border-radius:999px;overflow:hidden}
.macro-segments button{border:0;background:transparent;color:var(--ink);font:750 11px/1.15 -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;padding:7px 10px;cursor:pointer;white-space:nowrap;min-height:30px}
.macro-segments button+button{border-left:1.5px solid var(--ink)}
.macro-segments button[aria-pressed="true"]{color:var(--ink);background:var(--tape,#e1f3d2)}
.macro-segments button:focus-visible{outline:3px solid #73b797;outline-offset:-3px}
.recipe-content>.macro-choice{margin-top:3px}
.nutrition-recipe .macro-choice{margin:9px 0}
.macro-basis-note{display:block;font-size:11px;color:var(--muted);margin:-7px 0 12px}
@media(max-width:420px){.macro-segments button{font-size:10px;padding:7px 8px}}
/* 4.7 — Carbohydrate discovery follows the user's green + tape theme. */
.carb-filter-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:-2px 0 18px;padding:10px 0;border-top:1px dashed var(--line)}
.carb-explore{margin-left:auto}
.carb-hub-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:20px}
.carb-hub-card{border:1.5px solid var(--ink);border-radius:5px;padding:18px 20px;background:#fff;min-width:0}
.carb-hub-card .carb-heading{display:flex;align-items:center;gap:12px;margin-bottom:9px}
.carb-hub-card .carb-symbol{font-size:34px;background:#f4f7f3;border:1px solid var(--line);width:56px;height:56px;display:grid;place-items:center;border-radius:50%;flex:none}
.carb-hub-card h3{margin:0;font:700 25px/1.1 var(--serif)}
.carb-hub-card .carb-count{margin-left:auto;font-size:12px;font-weight:800;background:var(--tape);border:1px solid var(--ink);border-radius:999px;white-space:nowrap;padding:4px 9px}
.carb-hub-card p{font-size:13px;color:var(--muted);margin:6px 0 16px}
.carb-recipe-list{list-style:none;margin:0 0 15px;padding:0}
.carb-recipe-list li{display:flex;align-items:center;gap:12px;justify-content:space-between;font-size:13px;border-top:1px dashed var(--line);padding:9px 0}
.carb-recipe-list li b{line-height:1.3;font-weight:700}
.carb-recipe-list li small{color:var(--muted);display:block;font-size:11px;margin-top:2px}
.carb-recipe-list .carb-selected{color:#286f46;background:#e7f4e9;border-radius:50%;font-weight:800;min-width:20px;text-align:center}
.carb-recipe-list .btn{white-space:nowrap;font-size:11px;padding:7px 10px;min-width:68px;flex:none}
.carb-card-footer{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.carb-card-footer .small-muted{font-size:11px}
.carb-plan-summary{background:#fff;border:1.5px solid var(--ink);padding:18px;border-radius:4px}
.carb-plan-summary h3{margin:0 0 8px;font-size:19px}
.carb-count-list{display:flex;flex-wrap:wrap;gap:7px}
.carb-count-pill{font-size:12px;padding:7px 10px;border:1.5px solid var(--ink);border-radius:999px;background:#f7faf8}
.carb-count-pill b{color:var(--ink)}
.carb-ideas{margin-top:20px}.carb-ideas h3{margin:0 0 6px}.carb-ideas p{color:var(--muted);font-size:13px;max-width:75ch}
.carb-recipe-fact{background:#f1f7f1;color:#315b3e}
@media(max-width:700px){.carb-hub-grid{grid-template-columns:1fr}.carb-explore{margin-left:0}.carb-hub-card{padding:15px}.carb-hub-card h3{font-size:22px}}


/* 4.9: simpler browsing and progressive disclosure, retaining the customised theme. */
.hero{padding-top:25px;padding-bottom:24px}.hero h1{font-size:clamp(29px,4vw,43px);line-height:1.15}.hero p{max-width:600px}.hero-meta{margin-top:18px}
.nav-wrap{overflow:visible;gap:5px}.nav-wrap>.tab{flex:0 0 auto}.more-nav{position:relative;margin-left:auto}.more-nav summary{cursor:pointer;padding:14px 16px;list-style:none;font-weight:700}.more-nav summary:after{content:' ▾'}.more-nav-menu{position:absolute;right:0;top:100%;z-index:100;background:#f7fbf7;border:1px solid #8ba298;border-radius:12px;padding:8px;min-width:210px;box-shadow:0 8px 28px #20382f22;display:grid}.more-nav-menu .tab,.more-nav-menu .nav-share{width:100%;text-align:left;justify-content:flex-start;padding:12px;white-space:nowrap}
.simple-search{margin:15px 0}.simple-search .recipe-search-label{max-width:none;width:100%}.simple-browse{display:flex;gap:16px;flex-wrap:wrap;align-items:start}.simple-browse>.meal-filters{flex:1}.simple-disclosure{border:1px solid #c6d6ce;border-radius:12px;background:#f5f9f5}.simple-disclosure summary{padding:12px 16px;cursor:pointer;font-weight:600}.disclosure-content{padding:0 16px 16px}.simple-browse>.simple-disclosure{flex-basis:100%}.simple-disclosure .protein-row,.simple-disclosure .carb-filter-row{margin-top:18px}.simple-disclosure .cuisine-label{margin:18px 0;display:flex}.filter-status{display:flex;justify-content:space-between;align-items:center;min-height:42px;color:#637a70;font-size:13px}.portion-bar{display:flex;gap:16px;align-items:center;flex-wrap:wrap}.portion-bar>div:first-child{flex:1}.portion-bar .counter{flex:0 0 auto}.plan-tools{margin:28px 0}
.recipe-top:not(.photo-top){display:none}.recipe-desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.recipe-content>.ingredient-preview{display:none}.recipe-content>.facts>.fact:nth-child(n+3){display:none}.recipe-content{padding:22px}.recipe-content .recipe-name{font-size:20px;line-height:1.3}.simple-card-macros{font-size:15px;font-weight:700;margin:16px 0;color:#315d4a}.simple-card-macros span{font-size:12px;font-weight:400;color:#697e74}.recipe-card .details .recipe-editor-btn{margin:16px 0}.browse-more{text-align:center;padding:22px;color:#637a70}.group-title{margin-top:25px}.recipe-grid{align-items:start}.recipe-card{height:auto}
@media(max-width:620px){.hero{padding-top:18px}.hero h1{font-size:30px}.hero-meta{gap:14px;flex-wrap:wrap}.nav-wrap>.tab{padding:13px 9px;font-size:14px}.more-nav summary{padding:13px 9px;font-size:14px}.portion-bar>div:first-child{flex-basis:100%}.portion-bar>.btn{margin-left:auto}.simple-browse .meal-filters{gap:7px}.simple-browse>.meal-filters .filter-pill{padding:9px 12px}.disclosure-content{padding:0 12px 12px}.recipe-content{padding:18px}.recipe-grid{grid-template-columns:1fr}.simple-disclosure .cuisine-label{margin-left:0}.recipe-card .details{padding:18px}}


.simple-browse>.main-cuisine-filter{display:flex;align-items:center;gap:10px;margin:0;min-height:42px;font-weight:600;color:#315d4a;white-space:nowrap}
.main-cuisine-filter select{min-width:170px;min-height:42px;border:1px solid #a6beb1;border-radius:10px;background:#fff;padding:9px 30px 9px 12px;color:#233E33;font:inherit;font-weight:400}
@media(max-width:620px){.simple-browse>.main-cuisine-filter{width:100%;flex-basis:100%;justify-content:space-between}.main-cuisine-filter select{flex:1;max-width:260px}}


/* The Family Prep Co. — approved brand palette and unchanged logo artwork. */
:root{--ink:#233E33;--muted:#5d7669;--blue:#387D60;--blue2:#2c634b;--light:#F2FBF7;--bg:#F2FBF7;--white:#fff;--line:#d9e9e0;--orange:#F29A49;--tape:#dfefe5;--shadow:0 5px 20px #233e3308;--radius:16px;--serif:"Helvetica Neue",Arial,sans-serif}
body{background:var(--bg);color:var(--ink);font-family:"Helvetica Neue",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}h1,h2,h3,.recipe-name{font-family:"Helvetica Neue",Arial,sans-serif;letter-spacing:-.025em}h2,h3{color:var(--blue)}
.site-header{background:#fff;border-bottom:1px solid var(--line)}.head-row{min-height:144px;gap:18px}.brand{display:block;margin:0;padding:0}.brand picture{display:block}.family-brand-logo{display:block;width:600px;max-width:100%;height:auto;object-fit:contain}.brand .family-brand-logo{max-height:160px}.private-pill{background:var(--light);border:1px solid var(--line);color:var(--blue);font-size:11px}.mobile-share{background:var(--light);border:1px solid var(--line);color:var(--blue);border-radius:12px}
.nav-shell{background:#fff;border-bottom:1px solid var(--line);box-shadow:0 2px 8px #233e3304}.nav-wrap .tab{background:transparent;border:0;border-bottom:3px solid transparent;border-radius:0;color:var(--muted);font-weight:600}.nav-wrap .tab.active{color:var(--blue);border-bottom-color:var(--blue);background:transparent}.nav-count{background:#e2f0e8;color:var(--blue)}.nav-share{background:var(--blue);color:white;border:0;border-radius:10px}.more-nav summary{color:var(--blue)}.more-nav-menu{background:#fff;border-color:var(--line);box-shadow:0 12px 32px #233e3314}
.hero{position:relative;background:#fff;background-image:none;border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow);padding:32px 36px;overflow:hidden}.hero::before{display:none}.hero::after{display:none}.brand-eyebrow{font-size:11px;letter-spacing:2px;font-weight:700;color:var(--blue);margin-bottom:14px;display:flex;align-items:center;gap:10px}.brand-eyebrow:before{content:'';width:22px;height:3px;background:var(--orange)}.hero h1{display:block;background:none;color:var(--ink);font-size:clamp(32px,4vw,48px);font-weight:500;line-height:1.1;letter-spacing:-.035em;padding:0;margin:0 0 16px;transform:none}.hero p{color:var(--muted);font-size:15px}.hero-meta{display:flex;gap:28px;border-top:1px solid var(--line);padding-top:18px;margin-top:24px;flex-wrap:wrap}.hero-meta .stat{background:transparent;border:0;padding:0;color:var(--muted);border-radius:0}.hero-meta .stat b{font:600 24px/1.2 "Helvetica Neue",Arial,sans-serif;color:var(--blue);margin-right:6px}
.section-header h2{display:block;background:none;padding:0;transform:none;font-size:26px;font-weight:500}.section-header p{color:var(--muted);margin-top:8px}.group-title,.category-heading{font-family:inherit;font-size:18px}.group-line{height:1px;background:var(--line)}
.panel,.recipe-card,.day-card,.cost-card,.guide-card,.goal-card,.portioning-card,.photo-panel{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}.recipe-card.is-selected{outline:2px solid var(--blue);outline-offset:-1px}.recipe-name{font-weight:500!important;color:var(--ink);font-size:20px}.recipe-desc{color:var(--muted)}.recipe-card .details{border-top:1px solid var(--line);background:#fff}.simple-card-macros{color:var(--blue)}.fact{background:var(--light);color:var(--muted);border:0}.recipe-card .card-actions{gap:8px}
.btn{border-radius:10px;border:1px solid var(--line);background:#fff;color:var(--blue);font-weight:600;box-shadow:none}.btn.blue,.btn.picked-btn,.btn.orange{background:var(--blue);border-color:var(--blue);color:#fff}.btn.picked-btn{background:#e4f2e9;color:var(--blue);border-color:#c6dfd0}.btn.light{background:var(--light);color:var(--blue)}.btn:hover{filter:brightness(.98)}.filter-pill{background:#fff;border:1px solid #c8ded1;border-radius:10px;color:var(--blue);font-weight:500}.filter-pill.active,.filter-pill.is-active,.filter-pill[aria-pressed=true]{background:var(--blue);border-color:var(--blue);color:#fff}.protein-count{background:#e4f1e9;color:var(--blue)}
.simple-disclosure,.portion-bar,.recipe-search-label{background:#fff;border:1px solid var(--line);border-radius:14px}.simple-disclosure summary{color:var(--blue);font-weight:500}.portion-bar strong{color:var(--ink)}.portion-bar .counter{border:1px solid var(--line);border-radius:12px}.counter button{color:var(--blue);border-radius:9px;background:#fff}.main-cuisine-filter select{border-color:#c8ded1;color:var(--ink);background:#fff}.main-cuisine-filter{color:var(--blue)!important}.filter-status{color:var(--muted)}
.macro-grid{gap:6px;border:0;border-radius:0}.macro-grid .macro-box{background:var(--light)!important;border:1px solid var(--line);border-radius:10px}.macro-box b{color:var(--blue)}.macro-segments button[aria-pressed=true]{background:var(--blue);color:#fff}.macro-segments{border-color:var(--line)}
.shopping-group,.cost-teaser,.cooked-calc,.nutrition-note,.notice,.guide-card,.share-dialog,.sync-status{border-radius:12px!important;border-color:var(--line)!important}.cost-teaser,.cooked-calc,.nutrition-note,.notice{background:var(--light)!important}.footer{background:transparent;border-top:1px solid var(--line);color:var(--muted);padding:24px 0;gap:18px}.footer strong{color:var(--blue);font-weight:500}dialog{border:1px solid var(--line)!important;border-radius:18px!important}.toast{background:var(--ink);color:#fff;border-radius:12px}:focus-visible{outline:3px solid #499776;outline-offset:3px}
@media(max-width:900px){.family-brand-logo{width:480px}.head-row{min-height:128px}.header-actions{gap:7px}}
@media(max-width:640px){.head-row{min-height:0;padding:8px 0 14px;display:flex;flex-direction:column;gap:0}.brand{width:100%;display:flex;justify-content:center}.family-brand-logo{width:310px;max-width:100%;height:auto;max-height:none!important;aspect-ratio:1500/720}.header-actions{width:100%;justify-content:center;gap:12px}.private-pill{font-size:10px;padding:5px 9px}.mobile-share{width:30px;height:30px;font-size:17px}.hero{padding:25px 22px;border-radius:18px}.hero h1{font-size:34px}.hero-meta{gap:18px}.hero-meta .stat b{font-size:22px}.hero-meta .stat{font-size:11px}.brand-eyebrow{font-size:10px}.section-header h2{font-size:24px}.nav-shell{background:#fff}.footer{font-size:11px;flex-direction:column}.more-nav-menu{bottom:100%;top:auto}.recipe-content{padding:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}


.recipe-title-row{display:flex;align-items:flex-start;gap:10px}.recipe-title-row .recipe-name{flex:1;margin-top:0;min-width:0}.favourite-toggle{flex:0 0 38px;width:38px;height:38px;display:grid;place-items:center;border:1px solid #d9e9e0;border-radius:50%;background:#fff;color:#387D60;font:27px/1 Arial,sans-serif;padding:0;cursor:pointer}.favourite-toggle[aria-pressed=true]{background:#e3f1e9;border-color:#b3d2c0}.favourite-toggle:hover{background:#F2FBF7}.family-rating-badge{font-size:12px;font-weight:500;color:#387D60;margin:4px 0 10px}.family-rating-control{padding:14px;background:#F2FBF7;border:1px solid #d9e9e0;border-radius:12px;margin:0 0 16px}.family-rating-control label{display:flex;gap:12px;align-items:center;justify-content:space-between;color:#233E33;font-size:13px;font-weight:600}.family-rating-control select{min-height:40px;background:#fff;border:1px solid #c8ded1;border-radius:8px;padding:8px;color:#233E33;font:inherit;font-weight:400;max-width:175px}.family-rating-control small{display:block;margin-top:8px;font-size:11px;color:#5d7669}#favouriteCount{font-size:11px;min-width:18px;display:inline-block;text-align:center;margin-left:3px}.recipe-content .simple-card-macros{margin-top:14px}
@media(max-width:620px){.favourite-toggle{width:42px;height:42px;flex-basis:42px}.family-rating-control label{align-items:stretch;flex-direction:column;gap:8px}.family-rating-control select{max-width:none;width:100%}}


.contact-intro{padding:25px 28px;margin-bottom:20px}.contact-intro h3{margin:0 0 4px;font-weight:500}.contact-intro p{margin:6px 0 14px;color:var(--muted)}.contact-email{display:inline-block;font-size:24px;font-weight:500;color:var(--blue);text-decoration:none;margin:6px 0}.contact-email:hover{text-decoration:underline}.contact-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.contact-card{padding:24px;display:flex;flex-direction:column;align-items:flex-start}.contact-card h3{margin:0 0 8px;font-size:19px;font-weight:500}.contact-card p{color:var(--muted);font-size:14px;line-height:1.6;flex:1;margin:0 0 20px}.contact-card a{text-decoration:none}.contact-faq{margin:30px 0 18px}.contact-faq>h3{font-size:20px;font-weight:500}.contact-faq details{margin:10px 0}.contact-faq p{margin:0 0 10px;color:var(--muted);font-size:14px;line-height:1.6}.contact-privacy{margin:22px 0}.footer-contact-link{padding:0;margin-top:8px;background:none;border:0;font:inherit;color:var(--blue);text-decoration:underline;cursor:pointer}
@media(max-width:760px){.contact-grid{grid-template-columns:1fr}.contact-intro{padding:22px}.contact-card{padding:22px}.contact-email{font-size:23px}}


.recipe-open-link{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.recipe-route .hero,.recipe-route .nav-shell,.recipe-route .site-header,.recipe-route .footer{display:none}.recipe-route .main{padding-top:22px;padding-bottom:36px}.recipe-document-toolbar{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 auto 18px;max-width:1080px}.recipe-document{max-width:1080px;margin:auto;background:#fff;border:1px solid #d9e9e0;border-radius:20px;padding:34px}.recipe-document-brand{width:450px;max-width:100%;height:auto;display:block;margin:0 0 18px}.recipe-document-category{font-size:12px;color:#387D60;letter-spacing:.6px;text-transform:uppercase}.recipe-document h1{font-size:clamp(29px,4vw,43px);font-weight:500;line-height:1.15;color:#233E33;margin:12px 0}.recipe-document-head>p{color:#5d7669}.recipe-document-facts{font-size:13px}.recipe-document-photo{width:100%;max-height:420px;object-fit:cover;border-radius:12px}.recipe-page-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:20px 0}.recipe-servings-label{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:14px;color:#233E33}.recipe-servings-label select{padding:9px 12px;border:1px solid #c8ded1;border-radius:9px;background:#fff;min-height:42px;color:#233E33}.recipe-document-columns{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:38px;margin-top:26px}.recipe-document h2{font-size:23px;font-weight:500;margin:10px 0 16px}.recipe-document-steps{list-style:none;padding:0;margin:0}.recipe-document-steps li{display:flex;gap:14px;margin:0 0 22px;line-height:1.75;color:#233E33;scroll-margin-top:16px}.step-number{background:#e5f2eb;color:#387D60;border-radius:50%;width:30px;height:30px;display:grid;place-items:center;flex:none;font-size:13px;font-weight:600}.recipe-document-nutrition{border-top:1px solid #d9e9e0;margin-top:28px;padding-top:20px}.recipe-document .macro-choice{max-width:460px}.recipe-document .macro-grid{max-width:540px}.recipe-extra-tools{margin-top:22px}.recipe-source{margin:22px 0}.recipe-unavailable{padding:28px}.recipe-document .detail-ingredients{padding:0}.recipe-document .freeze-note{margin-top:24px}.recipe-document .family-rating-control{margin-top:14px}
@media(max-width:760px){.recipe-document{padding:22px;border-radius:14px}.recipe-document-columns{grid-template-columns:1fr;gap:12px}.recipe-document h1{font-size:30px}.recipe-document-brand{width:350px}.recipe-servings-label{margin-left:0}.recipe-document-toolbar .btn{font-size:12px;padding:10px 12px}.recipe-route .main{padding-bottom:30px}.recipe-route{padding-bottom:0!important}}
@media print{.recipe-document-toolbar,.recipe-page-actions,.recipe-extra-tools,.recipe-document .instruction-actions{display:none!important}.recipe-document{border:0;padding:0}.recipe-route .main{width:100%;padding:0}.recipe-document-columns{grid-template-columns:1fr 1.3fr}.recipe-document{break-inside:auto}}


.recipe-top.photo-top:after{display:none}.recipe-top .recipe-image-label{z-index:2}.recipe-top .picked{position:absolute;z-index:2}
/* Recipe images: locally bundled real photos and branded vector illustrations. */
.recipe-top.photo-top{height:190px;overflow:hidden;background:#F2FBF7}.recipe-top.photo-top .recipe-img{width:100%;height:100%;object-fit:cover;display:block}.recipe-top.illustration .recipe-img{object-fit:contain}.recipe-image-label{position:absolute;bottom:10px;left:12px;background:#fffffff0;padding:4px 8px;border-radius:6px;font-size:10px;color:#233E33;line-height:1.4}.recipe-top .picked{top:12px;right:12px;bottom:auto}.recipe-visual{margin:22px 0 0}.recipe-visual .recipe-document-photo{display:block;height:320px;width:100%;max-height:none;object-fit:contain;background:#F2FBF7;border-radius:12px}.recipe-visual.illustration .recipe-document-photo{height:220px}.recipe-visual figcaption{font-size:12px;color:#5d7669;margin-top:8px;line-height:1.6}.recipe-visual a{color:#387D60}.image-fallback-note{display:none;font-size:12px;color:#5d7669}.image-fallback figcaption,.image-fallback .recipe-image-label{display:none}.image-fallback .image-fallback-note{display:block}.recipe-top.image-fallback .image-fallback-note{position:absolute;bottom:12px;left:12px;background:#fff;padding:4px 8px;border-radius:6px}.recipe-top.image-fallback img{object-fit:contain}.photo-credits-list{columns:2;column-gap:30px;font-size:13px;line-height:1.8;padding-left:20px}.photo-credits-list li{break-inside:avoid;margin-bottom:8px}@media(max-width:600px){.recipe-top.photo-top{height:180px}.recipe-visual .recipe-document-photo{height:230px}.recipe-visual.illustration .recipe-document-photo{height:180px}.photo-credits-list{columns:1}}@media print{.recipe-visual{display:none}}

.recipe-top.illustration,.recipe-visual.illustration .recipe-document-photo{background:#fbfdfb}.recipe-top.illustration .recipe-image-label{background:transparent;color:#7d9789;letter-spacing:.15px}
/* Real stock photos throughout. No recipe illustrations. */.recipe-top.photo-top{background:#f5f8f6}.recipe-visual .recipe-document-photo{background:#f5f8f6}.recipe-top .recipe-image-label{z-index:2;background:#fffffff0;color:#233E33}.recipe-top.image-unavailable img,.recipe-visual.image-unavailable img{display:none!important}.image-unavailable .recipe-image-label,.image-unavailable figcaption{display:none}.image-unavailable .image-fallback-note{display:block}.recipe-top.image-unavailable{display:flex;align-items:center;justify-content:center}.recipe-top.image-unavailable .image-fallback-note{font-size:13px;color:#5d7669}.recipe-visual.image-unavailable{padding:28px;background:#f5f8f6;border-radius:12px}.photo-credits-list{columns:2}@media(max-width:600px){.photo-credits-list{columns:1}}
.recipe-route #appShellMount .main{display:none}