*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
:root{
  --bg:#F9F6F1;--white:#FFFFFF;--accent:#C17B4E;--accent-l:#F6EDE3;
  --sage:#7A9E7E;--sage-l:#EEF4EF;--text:#1E1A15;--muted:#9A8A78;
  --border:#EDE8DF;--shadow:0 2px 20px rgba(30,26,21,.07);
  --r:16px;--rs:10px;
}
html,body{height:100%;overflow-x:hidden}
body{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text);
  font-size:16px;line-height:1.55;max-width:430px;margin:0 auto;position:relative}

/* ── HEADER ── */
.hdr{background:var(--white);padding:18px 22px 0;border-bottom:1px solid var(--border);
  position:sticky;top:0;z-index:100;box-shadow:0 1px 0 var(--border)}
.hdr-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.app-logo{display:flex;align-items:center;gap:10px}
.logo-mark{width:38px;height:38px;background:var(--text);border-radius:10px;
  display:flex;align-items:center;justify-content:center;font-size:20px}
.app-name{font-family:'Cormorant Garamond',serif;font-size:28px;font-weight:600;
  letter-spacing:-.3px;line-height:1}
.app-sub{font-size:12px;color:var(--muted);font-weight:300;letter-spacing:.8px;
  text-transform:uppercase;margin-top:2px}
.week-badge{background:var(--accent-l);color:var(--accent);
  font-size:15px;font-weight:500;padding:5px 10px;border-radius:20px}
.tabs{display:flex;gap:3px;padding:4px;background:var(--bg);
  border-radius:12px;margin-bottom:12px}
.tab{flex:1;padding:9px 8px;border:none;background:transparent;
  border-radius:10px;font-family:'DM Sans',sans-serif;font-size:17px;
  font-weight:500;color:var(--muted);cursor:pointer;transition:all .2s;
  display:flex;align-items:center;justify-content:center;gap:5px}
.tab.active{background:var(--white);color:var(--text);
  box-shadow:0 1px 4px rgba(0,0,0,.1)}

/* ── DAYS BAR ── */
.days-wrap{background:var(--white);border-bottom:1px solid var(--border);
  padding-bottom:14px}
.days-scroll{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;padding:10px 22px 0;cursor:grab}
.days-scroll:active,.days-scroll.grabbing{cursor:grabbing}
.days-scroll::-webkit-scrollbar{display:none}
.day-btn{display:flex;flex-direction:column;align-items:center;gap:3px;
  padding:9px 10px;border:1.5px solid var(--border);border-radius:14px;
  background:transparent;cursor:pointer;transition:all .25s;flex-shrink:0;
  min-width:50px;font-family:'DM Sans',sans-serif}
.day-abbr{font-size:18px;font-weight:500;color:var(--muted);
  text-transform:uppercase;letter-spacing:.6px}
.day-num{font-family:'Cormorant Garamond',serif;font-size:26px;
  font-weight:600;color:var(--text);line-height:1}
.day-kcal{font-size:17px;color:var(--muted)}
.day-btn.active{background:var(--text);border-color:var(--text)}
.day-btn.active .day-abbr,.day-btn.active .day-num,.day-btn.active .day-kcal{color:var(--white)}

/* ── DAILY BANNER ── */
.day-banner{margin:18px 18px 0;background:var(--text);color:var(--white);
  border-radius:var(--r);padding:16px 20px;display:flex;justify-content:space-between;
  align-items:center}
.banner-block .b-label{font-size:16px;text-transform:uppercase;letter-spacing:.8px;
  color:rgba(255,255,255,.55);margin-bottom:3px}
.banner-block .b-val{font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:600;color:#fff}
.banner-block .b-sub{font-size:16px;color:rgba(255,255,255,.55)}

/* ── MAIN CONTENT ── */
.main{padding:6px 18px 100px}
.meal-label{font-size:18px;font-weight:500;color:var(--muted);text-transform:uppercase;
  letter-spacing:1.2px;margin:18px 0 10px;display:flex;align-items:center;gap:8px}
.meal-label::after{content:'';flex:1;height:1px;background:var(--border)}

/* ── MEAL CARD ── */
.meal-card{background:var(--white);border-radius:var(--r);overflow:hidden;
  box-shadow:var(--shadow);cursor:pointer;transition:transform .18s,box-shadow .18s;
  display:flex;align-items:stretch;margin-bottom:10px;
  animation:fadeUp .3s ease both}
.meal-card:active{transform:scale(.97);box-shadow:none}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.card-visual{width:82px;flex-shrink:0;display:flex;align-items:center;
  justify-content:center;font-size:36px;position:relative}
.card-body{flex:1;padding:13px 10px 13px 14px}
.card-name{font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:800;
  color:var(--text);line-height:1.3;margin-bottom:8px}
.card-row{display:flex;gap:10px;flex-wrap:wrap}
.chip{font-size:15px;color:var(--muted);display:flex;align-items:center;gap:2px}
.chip b{color:var(--text);font-weight:500}
.card-arrow{padding:0 14px 0 0;display:flex;align-items:center;
  color:var(--muted);font-size:25px;font-weight:300}

/* ── RECIPE MODAL ── */
.overlay{position:fixed;inset:0;background:rgba(20,16,10,.55);z-index:200;
  display:none;align-items:flex-end;justify-content:center;padding:24px 0 0;
  max-width:430px;margin:0 auto}
.overlay.open{display:flex}
.modal{background:var(--white);border-radius:24px 24px 0 0;width:100%;
  max-height:calc(90vh - 32px);overflow-y:auto;transform:translateY(100%);
  transition:transform .38s cubic-bezier(.4,0,.2,1)}
.overlay.open .modal{transform:translateY(0)}
.modal-hero{height:210px;display:flex;align-items:center;justify-content:center;
  position:sticky;top:0;z-index:2;font-size:72px;overflow:hidden}
.m-close{position:absolute;top:14px;right:14px;background:rgba(255,255,255,.92);
  border:none;width:36px;height:36px;border-radius:50%;cursor:pointer;font-size:14px;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 8px rgba(0,0,0,.12);color:var(--text);font-weight:600;z-index:3}
.m-tag{position:absolute;top:14px;left:14px;background:rgba(255,255,255,.92);
  font-size:14px;font-weight:500;padding:4px 10px;border-radius:20px;
  color:var(--muted);text-transform:uppercase;letter-spacing:.6px;z-index:3}
.modal-body{padding:22px 22px 40px;}
.m-name{font-family:'Cormorant Garamond',serif;font-size:36px;font-weight:600;
  line-height:1.2;margin-bottom:6px}
.m-meta{display:flex;gap:14px;color:var(--muted);font-size:18px;margin-bottom:20px}
.m-meta span{display:flex;align-items:center;gap:4px}

/* ── NUTRITION ── */
.nutr-panel{background:var(--bg);border-radius:var(--r);padding:16px;margin-bottom:22px}
.nutr-head{font-size:16px;font-weight:600;text-transform:uppercase;letter-spacing:1px;
  color:var(--muted);margin-bottom:12px}
.kcal-big{text-align:center;margin-bottom:14px}
.kcal-n{font-family:'Cormorant Garamond',serif;font-size:44px;font-weight:600;
  color:var(--accent);line-height:1}
.kcal-l{font-size:16px;color:var(--muted);margin-top:2px}
.mbar-row{display:flex;align-items:center;gap:8px;margin-bottom:7px}
.mbar-l{font-size:16px;color:var(--muted);width:62px;flex-shrink:0}
.mbar-track{flex:1;height:5px;background:var(--border);border-radius:3px;overflow:hidden}
.mbar-fill{height:100%;border-radius:3px;transition:width .6s ease}
.mbar-v{font-size:16px;font-weight:500;color:var(--text);width:32px;text-align:right;flex-shrink:0}

/* ── SECTION TITLE ── */
.s-title{font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:600;
  margin-bottom:12px;color:var(--text)}

/* ── INGREDIENTS ── */
.ing-list{list-style:none;margin-bottom:22px}
.ing-item{display:flex;align-items:flex-start;gap:10px;
  padding:10px 0;border-bottom:1px solid var(--border);font-size:18px;line-height:1.5}
.ing-item:last-child{border-bottom:none}
.ing-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);
  margin-top:4px;flex-shrink:0}

/* ── STEPS ── */
.step-list{list-style:none;margin-bottom:22px}
.step{display:flex;gap:13px;margin-bottom:13px}
.step-n{width:26px;height:26px;border-radius:50%;background:var(--accent);
  color:white;font-size:15px;font-weight:600;display:flex;
  align-items:center;justify-content:center;flex-shrink:0}
.step-t{font-size:17px;line-height:1.65;color:var(--text);padding-top:2px}

/* ── SHOPPING ── */
.shop-hdr{background:var(--white);border-bottom:1px solid var(--border);padding:20px 22px 0}
.shop-title{font-family:'Cormorant Garamond',serif;font-size:36px;font-weight:600;margin-bottom:4px}
.shop-sub{font-size:20px;color:var(--muted);margin-bottom:14px}
.shop-scale{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.shop-scale label{font-size:14px;color:var(--text);font-weight:600}
.shop-scale select{padding:8px 12px;border:1px solid var(--border);border-radius:14px;background:var(--white);color:var(--text);font-size:14px;cursor:pointer}
.shop-stats{display:flex;align-items:center;gap:14px;padding-bottom:16px}
.shop-stat{font-size:18px;color:var(--muted)}
.shop-stat b{font-family:'Cormorant Garamond',serif;font-size:26px;font-weight:600;color:var(--accent)}
.reset-btn{margin-left:auto;display:flex;align-items:center;gap:5px;background:var(--bg);
  border:1.5px solid var(--border);border-radius:20px;padding:5px 12px;
  font-size:16px;font-weight:500;color:var(--muted);cursor:pointer;
  font-family:'DM Sans',sans-serif;transition:all .2s}
.reset-btn:hover{border-color:var(--accent);color:var(--accent)}
.shop-body{padding:14px 18px 100px}
.shop-cat{margin-bottom:18px}
.cat-hdr{font-size:18px;font-weight:500;text-transform:uppercase;letter-spacing:1.5px;
  color:var(--accent);margin-bottom:8px;display:flex;align-items:center;gap:8px}
.cat-hdr::after{content:'';flex:1;height:1px;background:var(--accent-l)}
.shop-item{display:flex;align-items:center;gap:11px;padding:11px 14px;
  background:var(--white);border-radius:var(--rs);margin-bottom:5px;
  cursor:pointer;transition:opacity .2s,transform .15s;user-select:none}
.shop-item:active{transform:scale(.98)}
.shop-item.done{opacity:.42}
.shop-item.done .i-name{text-decoration:line-through;color:var(--muted)}
.i-chk{width:22px;height:22px;border-radius:50%;border:2px solid var(--border);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  transition:all .2s;font-size:13px;color:transparent}
.shop-item.done .i-chk{background:var(--sage);border-color:var(--sage);color:white}
.i-name{flex:1;font-size:18px}
.i-amt{font-size:16px;color:var(--muted);font-weight:500}

/* ── WEEK SUMMARY (compra) ── */
.week-sum{background:var(--text);color:white;border-radius:var(--r);
  padding:16px 20px;margin-bottom:18px;display:grid;
  grid-template-columns:repeat(4,1fr);gap:4px}
.ws-item{text-align:center}
.ws-val{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:600;color:var(--white)}
.ws-l{font-size:14px;color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:.5px;margin-top:2px}