/* FoodiePlan */
@font-face{font-family:Nunito;src:url("../fonts/nunito-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Nunito;src:url("../fonts/nunito-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Nunito;src:url("../fonts/nunito-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:Nunito;src:url("../fonts/nunito-800.woff2") format("woff2");font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:Fredoka;src:url("../fonts/fredoka-latin.woff2") format("woff2");font-weight:500 700;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Fredoka;src:url("../fonts/fredoka-latin-ext.woff2") format("woff2");font-weight:500 700;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1E00-1EFF,U+2020,U+20A0-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --bg:#FFF6EA;
  --bg-deep:#FFE7C2;
  --ink:#2B1248;
  --ink-soft:#4A2468;
  --muted:#5C3A62;
  --tomato:#E23D2A;
  --tomato-btn:#C4271A;
  --tomato-deep:#9B1C14;
  --tomato-soft:#FFE1D6;
  --coral:#FF7A59;
  --mango:#FFC43A;
  --mango-soft:#FFE9A8;
  --mint:#12A57A;
  --mint-deep:#0B7A62;
  --mint-soft:#D4F5E8;
  --lime:#7BC247;
  --berry:#7B1E5B;
  --berry-soft:#F8D7EC;
  --navy:#2B1248;
  --card:#FFFFFF;
  --card-2:#FFFBF3;
  --line:rgba(43,18,72,.10);
  --line-strong:rgba(43,18,72,.16);
  --shadow:0 12px 28px rgba(43,18,72,.10);
  --shadow-sm:0 4px 14px rgba(43,18,72,.08);
  --radius:24px;
  --radius-sm:16px;
  --nav-h:68px;
  --safe-top:env(safe-area-inset-top,0px);
  --safe-bot:env(safe-area-inset-bottom,0px);
  --font:Nunito,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --display:Fredoka,Nunito,system-ui,sans-serif;
  --focus:#C4271A;
  /* aliases so leftover sage/terra/gold hooks pick up the new theme */
  --sage:var(--tomato-btn);
  --sage-2:var(--tomato);
  --sage-deep:var(--tomato-deep);
  --sage-soft:var(--tomato-soft);
  --terra:var(--tomato);
  --terra-soft:var(--tomato-soft);
  --gold:var(--mango);
  --gold-soft:var(--mango-soft);
}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.45;min-height:100%}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{padding:0;overflow-x:hidden;background:
  radial-gradient(1200px 500px at 10% -10%, #FFE08A 0%, transparent 55%),
  radial-gradient(900px 420px at 110% 8%, #FFC4B0 0%, transparent 50%),
  var(--bg)}
img{max-width:100%;display:block}
button,input,select{font:inherit;color:inherit}
button{border:0;background:none;cursor:pointer}
h1,h2,h3{font-family:var(--display);font-weight:650;letter-spacing:-.02em;line-height:1.15;margin:0}
p{margin:0}

#app{min-height:100dvh;padding-bottom:calc(var(--nav-h) + var(--safe-bot) + 12px)}
#app.no-nav{padding-bottom:var(--safe-bot)}

.screen{padding:calc(var(--safe-top) + 16px) 18px 24px;max-width:560px;margin:0 auto}
.screen-head{margin-bottom:18px}
.eyebrow{font-family:var(--display);font-size:.78rem;font-weight:650;letter-spacing:.08em;text-transform:uppercase;color:var(--tomato-btn);margin-bottom:6px}
.tagline{color:var(--ink-soft);font-size:1.02rem;margin-top:8px;max-width:28em}
.lede{color:var(--muted);font-size:.92rem;margin-top:8px;max-width:34em}
.row{display:flex;align-items:center;gap:10px}
.spread{display:flex;align-items:center;justify-content:space-between;gap:10px}

/* Cards & surfaces */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm)}
.card-pad{padding:16px}
.section-title{font-family:var(--display);font-size:1.25rem;margin:22px 0 10px}

/* Buttons — chunky and friendly */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:12px 20px;border-radius:999px;font-weight:800;transition:transform .12s ease,background .12s ease,box-shadow .12s ease;border:2px solid transparent}
.btn:active{transform:scale(.96)}
.btn-primary{background:var(--tomato-btn);color:#fff;border-color:var(--tomato-deep);box-shadow:0 5px 0 var(--tomato-deep),0 10px 18px rgba(196,39,26,.28);width:100%;font-size:1.08rem;font-family:var(--display);font-weight:650}
.btn-primary:hover{background:var(--tomato)}
.btn-primary:active{transform:translateY(3px) scale(.99);box-shadow:0 2px 0 var(--tomato-deep),0 4px 10px rgba(196,39,26,.2)}
.btn-primary[disabled]{opacity:.55;box-shadow:none}
.btn-ghost{background:var(--card);color:var(--ink-soft);border:2px solid var(--line-strong);min-height:44px;padding:8px 14px;font-weight:800}
.btn-ghost:active{background:var(--mango-soft)}
.btn-soft{background:var(--mint-soft);color:var(--mint-deep);min-height:44px;border-color:#8FDCBE}
.btn-terra{background:var(--tomato-soft);color:var(--tomato-deep)}
.btn-small{min-height:40px;padding:6px 14px;font-size:.88rem;border-radius:14px}
.btn-icon{width:44px;height:44px;border-radius:14px;background:var(--card);border:2px solid var(--line);display:inline-flex;align-items:center;justify-content:center;font-size:1.1rem}
.fab-area{margin:20px 0 8px}

/* Setup */
.setup-hero{background:linear-gradient(145deg,#FFE38A 0%,#FFC43A 46%,#FF7A59 100%);color:var(--ink);border-radius:28px;padding:20px 18px 22px;margin:0 0 18px;box-shadow:0 12px 28px rgba(226,61,42,.18)}
.setup-hero .eyebrow{color:var(--tomato-deep)}
.setup-hero .tagline{color:var(--ink-soft)}
.setup-hero h1{color:var(--ink)}
.welcome-mark{width:76px;height:76px;border-radius:22px;overflow:hidden;margin:0 0 14px;box-shadow:0 6px 0 rgba(43,18,72,.12),var(--shadow);border:3px solid #fff}
.welcome-mark img{width:100%;height:100%;object-fit:cover}
.field{margin:14px 0}
.field label{display:block;font-weight:800;font-size:.82rem;margin-bottom:8px;color:var(--ink-soft)}
.hint{font-weight:600;color:var(--muted);font-size:.8rem;display:block;margin-top:6px}
.input,.select{width:100%;background:var(--card);border:2px solid var(--line-strong);border-radius:16px;padding:12px 14px;min-height:50px;outline:none}
.input:focus,.select:focus{border-color:var(--tomato-btn);box-shadow:0 0 0 3px rgba(196,39,26,.18)}
.budget-wrap{position:relative}
.budget-wrap .gbp{position:absolute;left:14px;top:50%;transform:translateY(-50%);font-weight:800;color:var(--muted)}
.budget-wrap .input{padding-left:30px;font-weight:800;font-size:1.15rem}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:2px solid var(--line-strong);background:var(--card);border-radius:999px;padding:9px 13px;min-height:44px;font-weight:800;font-size:.9rem;color:var(--ink-soft);transition:transform .12s ease,background .12s ease,box-shadow .12s ease}
.chip:active{transform:scale(.96)}
.chip[aria-pressed="true"],.chip.on{background:var(--tomato-btn);border-color:var(--tomato-deep);color:#fff;box-shadow:0 3px 0 var(--tomato-deep)}
.chip.store{padding:9px 14px}
.chip.course{border-width:2px}
.chip.course[aria-disabled="true"],.chip.course-dinner[aria-pressed="true"]{background:var(--tomato-btn);border-color:var(--tomato-deep);color:#fff}
.chip.course[data-course="breakfast"]{background:var(--mango-soft);border-color:#E0A61F;color:#6A4300}
.chip.course[data-course="breakfast"][aria-pressed="true"]{background:#E0A61F;border-color:#9A6D00;color:#2B1248;box-shadow:0 3px 0 #9A6D00}
.chip.course[data-course="lunch"]{background:var(--mint-soft);border-color:#5BC4A0;color:var(--mint-deep)}
.chip.course[data-course="lunch"][aria-pressed="true"]{background:var(--mint-deep);border-color:#08604C;color:#fff;box-shadow:0 3px 0 #08604C}
.chip.course[data-course="dessert"]{background:var(--berry-soft);border-color:#E59AC8;color:var(--berry)}
.chip.course[data-course="dessert"][aria-pressed="true"]{background:var(--berry);border-color:#4E0E38;color:#fff;box-shadow:0 3px 0 #4E0E38}
.stepper{display:flex;align-items:center;gap:0;background:var(--card);border:2px solid var(--line-strong);border-radius:16px;overflow:hidden;min-height:50px}
.stepper button{width:50px;height:50px;font-size:1.3rem;font-weight:700;color:var(--tomato-deep)}
.stepper .val{flex:1;text-align:center;font-weight:800;font-variant-numeric:tabular-nums}
.people-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.seg{display:grid;grid-template-columns:1fr 1fr;background:var(--bg-deep);border-radius:16px;padding:4px;gap:4px}
.seg button{min-height:42px;border-radius:12px;font-weight:800;color:var(--ink-soft)}
.seg button[aria-pressed="true"]{background:var(--card);color:var(--ink);box-shadow:var(--shadow-sm)}

/* Savings / budget banner */
.savings{background:linear-gradient(135deg,var(--mint-deep),#16B88A 60%,#7BC247);color:#fff;border-radius:var(--radius);padding:16px 18px;box-shadow:0 10px 24px rgba(11,122,98,.25);margin:4px 0 16px}
.savings .amt{font-family:var(--display);font-size:1.9rem;font-weight:650;letter-spacing:-.03em}
.savings .sub{opacity:.95;font-size:.92rem;margin-top:4px;font-weight:700}
.savings .bar{height:10px;background:rgba(255,255,255,.28);border-radius:99px;margin-top:12px;overflow:hidden}
.savings .bar > i{display:block;height:100%;background:var(--mango);border-radius:99px}
.savings.over{background:linear-gradient(135deg,var(--tomato-deep),var(--tomato))}
.savings.over .bar > i{background:#fff}

/* Meal cards */
.day-block{margin:0 0 18px}
.day-name{font-family:var(--display);font-weight:650;font-size:.95rem;letter-spacing:.02em;color:#fff;margin:0 0 10px;background:linear-gradient(90deg,var(--berry),#C4271A);display:inline-flex;align-items:center;padding:6px 14px;border-radius:999px;box-shadow:0 3px 0 #4E0E38}
.day-block:nth-child(5n+1) .day-name{background:linear-gradient(90deg,#C4271A,#FF7A59);box-shadow:0 3px 0 var(--tomato-deep)}
.day-block:nth-child(5n+2) .day-name{background:linear-gradient(90deg,#0B7A62,#12A57A);box-shadow:0 3px 0 #08604C}
.day-block:nth-child(5n+3) .day-name{background:linear-gradient(90deg,#9A6D00,#E0A61F);color:var(--ink);box-shadow:0 3px 0 #6A4300}
.day-block:nth-child(5n+4) .day-name{background:linear-gradient(90deg,#7B1E5B,#C45193);box-shadow:0 3px 0 #4E0E38}
.meal-card{background:var(--card);border-radius:var(--radius);overflow:hidden;border:2px solid var(--line);box-shadow:var(--shadow-sm);position:relative}
.meal-card + .meal-card{margin-top:12px}
.meal-photo{position:relative;aspect-ratio:3/2;background:var(--bg-deep);overflow:hidden}
.meal-photo img{width:100%;height:100%;object-fit:cover;background:
  radial-gradient(ellipse at 50% 55%, #fff 0%, #fff3dd 55%, #ffd9a8 100%)}
.meal-photo .ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:.85rem;background:
  radial-gradient(ellipse at 50% 55%, #fff 0%, #fff3dd 55%, #ffd9a8 100%)}
.badge{position:absolute;left:10px;top:10px;background:rgba(255,255,255,.94);color:var(--ink);border-radius:999px;padding:5px 10px;font-size:.72rem;font-weight:800;letter-spacing:.02em;box-shadow:var(--shadow-sm)}
.badge.lock{background:rgba(43,18,72,.82);color:#fff}
.badge.reuse{left:auto;right:10px;background:var(--mint-soft);color:var(--mint-deep)}
.badge.col{background:var(--mango-soft);color:#6A4300}
.badge.col-fakeaway{background:#FFE1D6;color:#9B1C14}
.badge.col-roast{background:#FFE9A8;color:#6A4300}
.badge.col-treat{background:#F8D7EC;color:#7B1E5B}
.badge.col-batch{background:#D4F5E8;color:#0B7A62}
.meal-body{padding:12px 14px 14px}
.meal-kicker{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:6px}
.course-chip{display:inline-flex;align-items:center;border-radius:999px;padding:3px 9px;font-size:.7rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.course-chip.course-breakfast{background:var(--mango-soft);color:#6A4300}
.course-chip.course-lunch{background:var(--mint-soft);color:var(--mint-deep)}
.course-chip.course-dinner{background:var(--tomato-soft);color:var(--tomato-deep)}
.course-chip.course-dessert{background:var(--berry-soft);color:var(--berry)}
.meal-title{font-family:var(--display);font-size:1.22rem;font-weight:650}
.meal-meta{display:flex;flex-wrap:wrap;gap:8px 12px;margin-top:6px;color:var(--muted);font-size:.85rem;font-weight:600}
.meal-actions{display:flex;gap:8px;margin-top:12px}
.locked-card .meal-photo img{filter:saturate(.7) brightness(.85)}
.locked-veil{position:absolute;inset:auto 0 0 0;background:linear-gradient(transparent,rgba(43,18,72,.78));color:#fff;padding:28px 14px 14px;font-weight:700;font-size:.9rem}
.lock-icon{display:inline-block;margin-right:6px}

@keyframes card-pop{
  0%{transform:rotate(-2.2deg) scale(.94);opacity:.45}
  55%{transform:rotate(1.4deg) scale(1.03)}
  100%{transform:none;opacity:1}
}
.meal-card.just-swapped{animation:card-pop .55s ease}

/* Plan header */
.topbar{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:8px}
.topbar h1{font-size:1.7rem}
.icon-btns{display:flex;gap:6px}

.day-tabs{display:flex;gap:6px;overflow-x:auto;margin:4px 0 14px;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:2px 0 6px}
.day-tabs::-webkit-scrollbar{display:none}
.day-tab{flex:none;min-width:48px;padding:8px 12px;border-radius:999px;background:var(--card);border:2px solid var(--line-strong);font-weight:800;font-size:.8rem;color:var(--ink-soft);text-decoration:none;text-align:center}
.day-tab:nth-child(7n+1){background:var(--tomato-soft);border-color:#F5A898;color:var(--tomato-deep)}
.day-tab:nth-child(7n+2){background:var(--mango-soft);border-color:#E0A61F;color:#6A4300}
.day-tab:nth-child(7n+3){background:var(--mint-soft);border-color:#5BC4A0;color:var(--mint-deep)}
.day-tab:nth-child(7n+4){background:var(--berry-soft);border-color:#E59AC8;color:var(--berry)}
.day-tab:nth-child(7n+5){background:#FFE1D6;border-color:#FF7A59;color:var(--tomato-deep)}
.day-tab:nth-child(7n+6){background:#E8F8C9;border-color:#7BC247;color:#2A5A10}
.day-tab:nth-child(7n+7){background:#E3D7FF;border-color:#A78BFA;color:#3B1D7A}

/* Shopping list */
.aisle{margin:0 0 16px}
.aisle h3{font-size:1.05rem;margin:0 0 8px;padding:0 4px}
.shop-item{display:flex;align-items:flex-start;gap:12px;padding:12px 12px;border-bottom:1px solid var(--line);background:var(--card)}
.shop-item:first-of-type{border-radius:var(--radius-sm) var(--radius-sm) 0 0}
.shop-item:last-of-type{border-radius:0 0 var(--radius-sm) var(--radius-sm);border-bottom:0}
.aisle .list{border:2px solid var(--line);border-radius:var(--radius-sm);overflow:hidden;box-shadow:var(--shadow-sm)}
.shop-item.checked .name,.shop-item.checked .qty{text-decoration:line-through;color:var(--muted)}
.tick{width:24px;height:24px;flex:none;border:2px solid var(--mint-deep);border-radius:8px;margin-top:2px;display:flex;align-items:center;justify-content:center;background:#fff}
.shop-item.checked .tick{background:var(--mint-deep)}
.shop-item.checked .tick::after{content:"";width:6px;height:11px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg);margin-bottom:3px}
.shop-item .name{font-weight:700}
.shop-item .qty{font-weight:800;font-variant-numeric:tabular-nums;margin-left:auto;white-space:nowrap;color:var(--ink-soft)}
.shop-item .used{display:block;font-size:.75rem;color:var(--muted);font-weight:600}
.progress{font-weight:800;color:var(--mint-deep);font-size:.9rem;background:var(--mint-soft);border-radius:999px;padding:4px 10px}
.pantry-note{font-size:.85rem;color:var(--muted);margin:-4px 4px 8px}

/* Bottom nav */
.nav{position:fixed;left:0;right:0;bottom:0;height:calc(var(--nav-h) + var(--safe-bot));padding:6px 10px var(--safe-bot);background:rgba(255,255,255,.94);backdrop-filter:saturate(1.2) blur(14px);-webkit-backdrop-filter:saturate(1.2) blur(14px);border-top:2px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr);max-width:560px;margin:0 auto;z-index:20;box-shadow:0 -8px 24px rgba(43,18,72,.06)}
.nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:.7rem;font-weight:800;color:var(--muted);min-height:54px;border-radius:16px;transition:transform .12s ease,background .12s ease}
.nav button:active{transform:scale(.96)}
.nav button svg{width:22px;height:22px}
.nav button[aria-current="page"]{color:var(--tomato-deep);background:var(--mango-soft);box-shadow:0 2px 0 #E0A61F}
.nav button[aria-current="page"] svg{stroke:var(--tomato-btn)}

/* Meal sheet */
.sheet-back{position:fixed;inset:0;background:rgba(43,18,72,.45);z-index:30;opacity:0;pointer-events:none;transition:opacity .2s}
.sheet-back.on{opacity:1;pointer-events:auto}
.sheet{position:fixed;left:0;right:0;bottom:0;max-height:min(92dvh,920px);background:var(--bg);border-radius:28px 28px 0 0;z-index:31;transform:translateY(110%);transition:transform .28s ease;max-width:560px;margin:0 auto;box-shadow:0 -12px 40px rgba(43,18,72,.18);overflow:auto;padding-bottom:var(--safe-bot)}
.sheet.on{transform:translateY(0)}
.sheet .hero{position:relative;aspect-ratio:3/2;background:var(--bg-deep)}
.sheet .hero img{width:100%;height:100%;object-fit:cover}
.sheet .close{position:absolute;right:12px;top:12px;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.94);font-size:1.2rem;font-weight:700;box-shadow:var(--shadow-sm);z-index:3}
.sheet .hero .heart{right:auto;left:12px;top:12px}
.sheet .inner{padding:16px 18px 28px}
.steps{counter-reset:step;margin:8px 0 0;padding:0;list-style:none}
.steps li{position:relative;padding:10px 0 10px 44px;border-bottom:1px solid var(--line)}
.steps li::before{counter-increment:step;content:counter(step);position:absolute;left:0;top:10px;width:28px;height:28px;border-radius:50%;background:var(--mango);color:var(--ink);font-weight:800;font-size:.85rem;display:flex;align-items:center;justify-content:center}
.ing-list{margin:8px 0 0;padding:0;list-style:none}
.ing-list li{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line);font-weight:600}
.ing-list .q{color:var(--ink-soft);font-weight:800;white-space:nowrap}

/* Collections / loyalty */
.collection{overflow:hidden;margin:0 0 12px}
.collection .banner{position:relative;height:120px;background:var(--bg-deep)}
.collection .banner img{width:100%;height:100%;object-fit:cover}
.collection.locked .banner img{filter:grayscale(.25) brightness(.75)}
.collection .banner .pad{position:absolute;inset:0;background:linear-gradient(to top,rgba(43,18,72,.72),transparent 60%);display:flex;align-items:flex-end;padding:12px 14px;color:#fff}
.collection h3{font-size:1.2rem}
.collection .body{padding:12px 14px 14px}
.teaser{color:var(--muted);font-size:.9rem;margin-top:4px}
.unlock-pill{display:inline-flex;align-items:center;gap:6px;margin-top:10px;background:var(--mango-soft);color:#6A4300;border-radius:999px;padding:6px 10px;font-size:.8rem;font-weight:800}
.unlock-pill.free{background:var(--mint-soft);color:var(--mint-deep)}
.col-pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:5px 10px;font-size:.78rem;font-weight:800;margin-bottom:6px}
.col-pill.col-fakeaway{background:#FFE1D6;color:#9B1C14}
.col-pill.col-roast,.col-pill.col-roasts{background:#FFE9A8;color:#6A4300}
.col-pill.col-treat{background:#F8D7EC;color:#7B1E5B}
.col-pill.col-batch{background:#D4F5E8;color:#0B7A62}
.col-pill.col-core{background:#E3D7FF;color:#3B1D7A}
.month-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.month-grid button{min-height:40px;border-radius:10px;border:2px solid var(--line-strong);background:var(--card);font-weight:800;font-size:.85rem}
.month-grid button[aria-pressed="true"]{background:var(--tomato-btn);color:#fff;border-color:var(--tomato-deep)}
.dev-box{margin-top:28px;padding:14px;border:2px dashed var(--line-strong);border-radius:16px;background:rgba(255,255,255,.45)}
.dev-box h3{font-family:var(--font);font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}

/* Settings lists */
.setting-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.est-note{background:var(--mango-soft);color:#6A4300;border-radius:14px;padding:12px 14px;font-size:.88rem;font-weight:600;margin:12px 0}

/* Install tip */
.install-tip{background:var(--card);border:2px solid var(--line);border-radius:16px;padding:12px 14px;font-size:.88rem;color:var(--ink-soft);margin-top:16px}

/* Credits */
.credits{font-size:.82rem;color:var(--muted);line-height:1.5}
.credits li{margin:0 0 8px}

/* Toast */
.toast{position:fixed;left:50%;bottom:calc(var(--nav-h) + var(--safe-bot) + 16px);transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:10px 16px;border-radius:999px;font-weight:700;font-size:.9rem;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:40;white-space:nowrap;max-width:90vw;overflow:hidden;text-overflow:ellipsis}
.toast.on{opacity:1;transform:translate(-50%,0)}

.hidden{display:none !important}
.center{text-align:center}
.fine{font-size:.8rem;color:var(--muted);font-weight:600}

@media (min-width:700px){
  body{background:linear-gradient(180deg,#FFD9A0,#FFF6EA 30%)}
  #app{max-width:560px;margin:0 auto;background:var(--bg);min-height:100dvh;box-shadow:0 0 80px rgba(43,18,72,.08)}
}

/* Nutrition & allergens */
.nutrition{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.nut-pill{background:var(--mint-soft);color:var(--mint-deep);border-radius:999px;padding:4px 9px;font-size:.75rem;font-weight:800}
.nut-pill.cal{background:var(--mango-soft);color:#6A4300}
.nut-pill .est{font-weight:600;opacity:.8}
.allergen-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.al-badge{background:var(--tomato-soft);color:var(--tomato-deep);border-radius:999px;padding:3px 8px;font-size:.7rem;font-weight:800}
.disclaimer{font-size:.78rem;color:var(--muted);line-height:1.45;margin:10px 0 0;font-weight:600}
.protein-week{background:var(--card);border:2px solid var(--line);border-radius:var(--radius);padding:14px 16px;margin:0 0 16px;box-shadow:var(--shadow-sm)}
.protein-week .big{font-family:var(--display);font-size:1.45rem;font-weight:650}
.protein-week .sub{color:var(--muted);font-size:.88rem;font-weight:600;margin-top:2px}

/* Heart / favourites */
.heart{position:absolute;right:8px;top:8px;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.94);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm);z-index:2;color:#C45193}
.heart svg{width:22px;height:22px}
.heart.on{color:var(--tomato-btn);background:#fff}
.heart.on svg{fill:var(--tomato-btn)}
.meal-photo .heart{top:8px;right:8px}
.badge.reuse{right:52px}
.fav-grid{display:grid;grid-template-columns:1fr;gap:12px}
.fav-empty{text-align:center;padding:36px 16px;color:var(--muted)}
.fav-empty h2{color:var(--ink);margin-bottom:8px}
.day-pick{display:grid;grid-template-columns:1fr;gap:6px;margin-top:8px}
.day-pick button{min-height:48px;border-radius:14px;border:2px solid var(--line-strong);background:var(--card);font-weight:700;text-align:left;padding:10px 14px;display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.day-pick button small{font-weight:600;color:var(--muted)}
.day-pick button:active{background:var(--mango-soft)}
.toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0}
.toggle .txt{flex:1}
.toggle .txt strong{display:block}
.toggle .txt span{font-size:.85rem;color:var(--muted);font-weight:600}
.switch{width:48px;height:28px;border-radius:999px;background:#E4D5C4;position:relative;flex:none;transition:background .15s}
.switch::after{content:"";position:absolute;left:3px;top:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.15);transition:transform .15s}
.switch.on{background:var(--mint-deep)}
.switch.on::after{transform:translateX(20px)}
.filter-group{margin:16px 0}
.filter-group h3{font-family:var(--font);font-size:.82rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);margin:0 0 8px}
.chips.allergens .chip{font-size:.8rem;padding:8px 11px;min-height:38px}
.chip.warn[aria-pressed="true"],.chip.warn.on{background:var(--tomato-deep);border-color:var(--tomato-deep);color:#fff}
details.more-filters{background:var(--card);border:2px solid var(--line);border-radius:16px;padding:4px 14px 10px;margin:12px 0}
details.more-filters > summary{font-weight:800;cursor:pointer;padding:12px 0;list-style:none}
details.more-filters > summary::-webkit-details-marker{display:none}
details.more-filters > summary::after{content:"＋";float:right;color:var(--tomato-btn)}
details.more-filters[open] > summary::after{content:"–"}

/* Plans + Plus */
.badge.plus{left:auto;right:52px;background:var(--berry);color:#fff;top:10px}
.badge.col{top:10px;left:10px}
.plan-grid{display:grid;gap:12px;margin:16px 0}
.plan-card .body{padding:16px 16px 18px}
.plan-card.current{border:3px solid var(--tomato-btn);box-shadow:var(--shadow)}
.plan-price{font-family:var(--display);font-size:1.35rem;font-weight:650;margin:6px 0 8px}
.plan-feats{margin:10px 0 8px;padding:0 0 0 1.1em;color:var(--ink-soft);font-weight:600;font-size:.92rem}
.plan-feats li{margin:0 0 6px}
.icon-btns{flex-wrap:wrap;justify-content:flex-end}

.vs-takeaway{margin:6px 0 0;font-weight:700;font-size:.82rem;color:var(--mint-deep)}
.gift-card{margin:16px 0}
.gift-card h3{margin:0 0 6px}
.gift-card .field{display:block;margin:12px 0 8px}
.gift-card .field span{display:block;font-weight:700;font-size:.85rem;margin-bottom:6px}
.gift-card input{width:100%;box-sizing:border-box;border:2px solid var(--line-strong);border-radius:12px;padding:10px 12px;font:inherit}

.card.collection[data-open-tier]{cursor:pointer}
.card.collection[data-open-tier]:focus-visible{outline:2px solid var(--tomato-btn);outline-offset:2px}

.addon-cta{margin-top:10px}
.addon-card{margin:12px 0}
.addon-card .btn{margin-top:8px}
.collection .addon-cta .btn{width:100%}

.chip.kitchen{display:inline-flex;align-items:center;gap:6px}
.chip.kitchen .appliance-icon{display:inline-flex;color:currentColor}
.chip.kitchen .appliance-icon svg{width:16px;height:16px}
.nutrition .appliance-icons{display:inline-flex;align-items:center;gap:4px;margin-left:2px;color:var(--ink-soft)}
.appliance-icons{display:inline-flex;align-items:center;gap:4px}
.appliance-icon{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:6px;background:var(--mint-soft);color:var(--mint-deep)}
.appliance-icon svg{display:block}
.appliance-icons.no-cook .appliance-icon{background:var(--bg-deep);color:var(--muted);font-weight:800;font-size:.85rem}
.method-badge{display:inline-block;margin-left:4px;background:var(--mint-soft);color:var(--mint-deep);border-radius:999px;padding:2px 8px;font-size:.72rem;font-weight:800;letter-spacing:.01em;vertical-align:middle}
.method-note,.kitchen-need,.method-kicker{margin:8px 0 0;font-size:.88rem;color:var(--ink-soft);font-weight:600}
.kitchen-need{color:var(--tomato-deep)}
.method-kicker{margin:0 0 8px;color:var(--mint-deep)}

.protein-tag{display:inline-block;background:var(--berry-soft);color:var(--berry);border-radius:999px;padding:2px 8px;font-size:.72rem;font-weight:800;letter-spacing:.01em}
.swap-sheet{position:relative;padding-top:20px}
.swap-options{display:flex;flex-direction:column;gap:12px;margin:14px 0 8px}
.swap-option{display:grid;grid-template-columns:112px 1fr;gap:12px;align-items:center;background:var(--card);border:2px solid var(--line-strong);border-radius:18px;overflow:hidden;box-shadow:var(--shadow-sm);transition:transform .12s ease}
.swap-option:active{transform:scale(.98)}
.swap-photo{aspect-ratio:3/2;background:var(--bg-deep);min-height:76px}
.swap-photo img{width:100%;height:100%;object-fit:cover;display:block}
.swap-body{padding:8px 12px 10px 0}
.swap-body h3{margin:2px 0 6px;font-size:1rem}
.chip.course{display:inline-flex;align-items:center}
.chip.course[aria-disabled="true"]{opacity:.95;cursor:default}

/* Empty states */
.empty-state{text-align:center;padding-top:calc(var(--safe-top) + 36px)}
.empty-illu{font-size:3.4rem;line-height:1;margin:8px 0 14px;filter:drop-shadow(0 6px 0 rgba(43,18,72,.08))}
.empty-state h1{margin-top:4px}
.empty-state .tagline{margin-left:auto;margin-right:auto}

/* Confetti */
.confetti-burst{position:fixed;inset:0;pointer-events:none;z-index:80;overflow:hidden}
.confetti-burst i{position:absolute;top:-8px;left:50%;width:8px;height:12px;border-radius:2px;background:var(--c,#FFC43A);transform:translateX(-50%) rotate(var(--r,0deg));animation:confetti-fly var(--d,.9s) ease-out forwards}
@keyframes confetti-fly{
  0%{transform:translate(-50%,0) rotate(var(--r,0deg));opacity:1}
  100%{transform:translate(var(--x,0),var(--h,70vh)) rotate(calc(var(--r,0deg) + 240deg));opacity:0}
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none !important;transition:none !important;scroll-behavior:auto !important}
  .btn:active,.chip:active,.nav button:active,.swap-option:active{transform:none}
  .btn-primary:active{transform:none;box-shadow:0 5px 0 var(--tomato-deep),0 10px 18px rgba(196,39,26,.28)}
  .confetti-burst{display:none !important}
}


/* Store-branded shopping list */
.shop-item{display:grid;grid-template-columns:1fr auto;flex-wrap:unset;gap:6px 10px;align-items:start}
.shop-item .shop-main{display:flex;align-items:flex-start;gap:12px;grid-column:1;min-width:0;cursor:pointer}
.shop-item .shop-text{min-width:0;flex:1}
.shop-item .name{font-weight:800;display:block;line-height:1.3}
.find-at{grid-column:2;grid-row:1;flex:none;margin-left:0;align-self:start;display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:4px 12px;border-radius:999px;background:var(--mango-soft);color:var(--ink);border:2px solid #E0A61F;font-weight:800;font-size:.75rem;text-decoration:none;box-shadow:0 2px 0 #9A6D00;transition:transform .12s ease}
.find-at:active{transform:scale(.96)}
.find-at:focus-visible{outline:2px solid var(--tomato-btn);outline-offset:2px}
@media (prefers-reduced-motion: reduce){
  .find-at:active{transform:none}
}

/* Seafood allergy chip — prominent, sits on its own row at the top */
.chips.allergens .seafood-chip{flex:1 0 100%;font-weight:800;font-size:.9rem;min-height:44px;background:#FDE8EF;color:var(--berry);border-color:var(--berry);box-shadow:0 2px 0 var(--berry)}
.chips.allergens .seafood-chip[aria-pressed="true"]{background:var(--berry);color:#fff;box-shadow:0 2px 0 #4A1036}
.allergen-tip{margin:10px 0 8px;line-height:1.45}

/* Free tier + upgrade sheet */
.access-banner{margin:4px 0 14px;padding:14px 16px;border-radius:18px;line-height:1.45;color:var(--ink)}
.access-banner strong{display:block;font-family:var(--display),Fredoka,sans-serif;font-size:1.05rem;font-weight:650;margin-bottom:4px}
.access-banner span{display:block;font-size:.92rem;color:var(--ink-soft)}
.free-banner{background:var(--mango-soft);border:2px solid #E0A61F;box-shadow:0 3px 0 #9A6D00}
.trial-banner{background:var(--mint-soft);border:2px solid #5BC4A0;box-shadow:0 3px 0 #0B7A62}
.trial-days{margin:8px 0 0;font-weight:800;color:var(--mint-deep);font-size:.92rem}
.upgrade-sheet{padding-top:8px}
.upgrade-sheet h2{font-family:var(--display),Fredoka,sans-serif;font-size:1.45rem;line-height:1.25;color:var(--berry);margin:4px 0 10px}
.upgrade-sheet .lede{margin-bottom:16px}
#dev-access button[aria-pressed="true"]{background:var(--mint-soft);border-color:var(--mint-deep);color:var(--mint-deep);font-weight:800}

.shop-item .qty{display:block;margin:3px 0 0;text-align:left;white-space:normal;flex:none;font-weight:800}
.shop-item .pack-price{display:inline;margin-left:8px;font-size:.78rem;font-weight:700;color:var(--ink-soft)}
.shop-item .shop-meta{grid-column:1 / -1;flex:unset;padding:0 0 2px 36px;font-size:.78rem;color:var(--muted);font-weight:600;line-height:1.4}