:root{
  --cream:#FBF3E4;
  --cream-deep:#F3E7D1;
  --barn:#E2543E;
  --barn-dark:#C43F2C;
  --sun:#F2B134;
  --herb:#5B8C5A;
  --herb-dark:#436B43;
  --ink:#3A2E28;
  --ink-soft:#7A6A5D;
  --white:#FFFDF9;
  --line: rgba(58,46,40,0.12);
  --nav-h: 64px;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:'Nunito',sans-serif;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.display{
  font-family:'Fredoka',sans-serif;
  font-weight:600;
  letter-spacing:-0.01em;
}
.mono{font-family:'JetBrains Mono',monospace;}
button{font:inherit;}

/* ---- shell ---- */
.app{
  max-width:1180px;
  margin:0 auto;
  padding:16px 14px calc(var(--nav-h) + 24px);
}
@media (min-width:760px){
  .app{padding:28px 24px 80px;}
}

.topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:20px;
  gap:16px;
  flex-wrap:wrap;
}
.brand{display:flex; align-items:center; gap:10px;}
.brand .mark{
  width:38px;height:38px;
  border-radius:12px;
  background:var(--barn);
  display:flex;align-items:center;justify-content:center;
  color:white;
  transform:rotate(-4deg);
  flex-shrink:0;
}
.brand h1{font-size:20px;margin:0;color:var(--ink);}
.brand span{font-size:11px;color:var(--ink-soft);font-weight:700;text-transform:uppercase;letter-spacing:.08em;}

/* top tabs: shown on wide screens (kiosk / tablet / desktop) */
.tabs{
  display:none;
  background:var(--cream-deep);
  border-radius:14px;
  padding:5px;
  gap:4px;
}
@media (min-width:640px){
  .tabs{display:flex;}
}
.tab{
  border:none;
  background:transparent;
  font-family:'Fredoka',sans-serif;
  font-weight:600;
  font-size:14px;
  color:var(--ink-soft);
  padding:10px 16px;
  border-radius:10px;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:6px;
  transition:all .15s ease;
}
.tab.active{
  background:var(--white);
  color:var(--barn-dark);
  box-shadow:0 2px 8px rgba(58,46,40,0.10);
}

/* bottom nav: shown on phones */
.bottom-nav{
  position:fixed;
  left:0; right:0; bottom:0;
  height:var(--nav-h);
  background:var(--white);
  border-top:1px solid var(--line);
  display:flex;
  box-shadow:0 -2px 12px rgba(58,46,40,0.08);
  z-index:20;
}
@media (min-width:640px){
  .bottom-nav{display:none;}
}
.bottom-nav button{
  flex:1;
  border:none;
  background:transparent;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2px;
  font-family:'Fredoka',sans-serif;
  font-weight:600;
  font-size:11px;
  color:var(--ink-soft);
  cursor:pointer;
  min-height:44px;
}
.bottom-nav button .icon{font-size:19px;}
.bottom-nav button.active{color:var(--barn-dark);}

.view{display:none;}
.view.active{display:block; animation:fade .25s ease;}
@keyframes fade{from{opacity:0;transform:translateY(4px);}to{opacity:1;transform:translateY(0);}}

.section-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  margin-bottom:16px;
  flex-wrap:wrap;
  gap:8px;
}
.section-head h2{font-size:22px;margin:0;}
@media (min-width:760px){ .section-head h2{font-size:26px;} }
.section-head p{margin:2px 0 0;color:var(--ink-soft);font-size:13px;}
.download-list-btn{
  border:none;background:var(--barn);color:white;border-radius:10px;
  min-height:42px;padding:9px 16px;white-space:nowrap;cursor:pointer;
  font-family:'Fredoka',sans-serif;font-weight:700;font-size:13px;
}
.download-list-btn:active{transform:translateY(1px);}

.empty-note{
  color:var(--ink-soft);
  font-size:14px;
  padding:24px;
  text-align:center;
  background:var(--white);
  border-radius:16px;
  border:1px dashed var(--line);
}

/* ---- KIOSK / VOTING VIEW ---- */
.home-lineup{margin-bottom:24px;padding:14px;background:#FFF8E7;border:1px solid #E6D5B9;border-radius:20px;box-shadow:0 4px 16px rgba(58,46,40,.06);}
.home-lineup-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:11px;}
.home-lineup-head>div{display:flex;align-items:center;gap:7px;font-family:'Fredoka',sans-serif;font-size:16px;}
.home-lineup-head button{border:none;background:transparent;color:var(--barn-dark);font-size:12px;font-weight:800;cursor:pointer;}
.home-lineup-scroll{display:flex;gap:10px;overflow-x:auto;padding:1px 1px 7px;scroll-snap-type:x proximity;scrollbar-width:thin;}
.home-meal-card{display:flex;flex:0 0 255px;min-width:0;background:var(--white);border:1px solid var(--line);border-radius:14px;overflow:hidden;cursor:pointer;scroll-snap-align:start;}
.home-meal-image{display:flex;align-items:center;justify-content:center;width:88px;min-height:92px;flex-shrink:0;font-size:30px;overflow:hidden;}
.home-meal-image img{width:100%;height:100%;object-fit:cover;}
.home-meal-copy{display:flex;flex-direction:column;justify-content:center;min-width:0;padding:10px;}
.home-meal-copy>strong{font-size:13px;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.home-meal-copy>small{font-size:10px;color:var(--ink-soft);margin-top:4px;}
.home-meal-when{display:flex;flex-direction:column;gap:1px;margin-bottom:5px;color:var(--barn-dark);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;}
.home-lineup-empty{display:flex;align-items:center;gap:11px;padding:14px;background:var(--white);border:1px dashed var(--line);border-radius:13px;cursor:pointer;}
.home-lineup-empty>span{font-size:27px;}.home-lineup-empty>div{display:flex;flex-direction:column;}.home-lineup-empty strong{font-size:13px;}.home-lineup-empty small{color:var(--ink-soft);font-size:11px;margin-top:2px;}
.home-vote-head{margin-top:0;}
@media (min-width:760px){.home-lineup{padding:17px;}.home-lineup-scroll{display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));overflow:visible;}.home-meal-card{flex-basis:auto;}}
.voter-strip{
  display:flex;
  gap:10px;
  margin-bottom:20px;
  flex-wrap:wrap;
}
.voter-pill{
  display:flex;align-items:center;gap:8px;
  background:var(--white);
  border:2px solid var(--line);
  border-radius:100px;
  padding:6px 16px 6px 6px;
  font-weight:800;
  font-size:14px;
  cursor:pointer;
  min-height:44px;
}
.voter-pill.active{border-color:var(--barn); background:#FFF3EE;}
.voter-avatar{
  width:30px;height:30px;border-radius:100px;
  display:flex;align-items:center;justify-content:center;
  font-family:'Fredoka',sans-serif;
  color:white;font-size:13px;
  flex-shrink:0;
}
.meal-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:16px;
}
@media (min-width:760px){
  .meal-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:20px;}
}
.meal-card{
  background:var(--white);
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 2px 10px rgba(58,46,40,0.08);
  border:1px solid var(--line);
  position:relative;
}
.meal-art{
  height:120px;
  display:flex;align-items:center;justify-content:center;
  font-size:48px;
  position:relative;
  overflow:hidden;
}
.meal-art img{
  width:100%;height:100%;
  object-fit:cover;
}
@media (min-width:760px){ .meal-art{height:130px; font-size:52px;} }
.meal-body{padding:14px 16px 16px;}
.meal-body h3{font-size:16px;margin:0 0 4px;}
.meal-body .tag{font-size:12px;color:var(--ink-soft);font-weight:700;}
.vote-row{
  display:flex;align-items:center;justify-content:space-between;
  margin-top:12px;
  gap:8px;
}
.vote-btn{
  border:none;
  color:white;
  font-family:'Fredoka',sans-serif;
  font-weight:600;
  font-size:14px;
  padding:11px 14px;
  border-radius:12px;
  display:flex;align-items:center;gap:6px;
  cursor:pointer;
  transition:transform .08s ease;
  min-height:44px;
}
.vote-btn.up{background:var(--herb); box-shadow:0 3px 0 var(--herb-dark);}
.vote-btn.down{background:var(--ink-soft); box-shadow:0 3px 0 var(--ink);}
.vote-btn.active.up{background:var(--herb-dark);}
.vote-btn.active.down{background:var(--ink);}
.vote-btn:active{transform:translateY(3px); box-shadow:0 0 0;}
.star-picker{display:flex; gap:4px;}
.star-picker button{
  border:none;background:transparent;font-size:22px;cursor:pointer;
  padding:4px; line-height:1; min-width:32px; min-height:44px;
}
.vote-count{
  display:flex;align-items:center;gap:4px;
  font-family:'JetBrains Mono',monospace;
  font-weight:600;
  font-size:13px;
  color:var(--ink-soft);
}

/* ---- PLANNING VIEW ---- */
.plan-toolbar{
  display:flex;justify-content:space-between;align-items:center;
  margin-bottom:16px;flex-wrap:wrap;gap:10px;
}
.plan-week-nav{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:14px;}
.plan-week-nav>button{border:1px solid var(--line);background:var(--white);border-radius:11px;min-width:42px;min-height:42px;color:var(--ink);font-size:25px;cursor:pointer;}
.plan-week-nav .week-current{display:flex;flex-direction:column;align-items:center;min-width:190px;padding:6px 14px;font-size:13px;}
.plan-week-nav .week-current strong{font-family:'Fredoka',sans-serif;}
.plan-week-nav .week-current small{font-size:9px;color:var(--ink-soft);}
.week-grid{
  display:flex;
  flex-direction:column;
  gap:10px;
}
@media (min-width:760px){
  .week-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:14px;}
}
.day-col{
  background:var(--white);
  border-radius:16px;
  padding:12px;
  border:1px solid var(--line);
}
@media (min-width:760px){ .day-col{min-height:190px;} }
.day-col .day-label{
  font-family:'Fredoka',sans-serif;
  font-weight:600;
  font-size:13px;
  color:var(--ink-soft);
  text-transform:uppercase;
  letter-spacing:.05em;
  margin-bottom:10px;
  display:flex;
  justify-content:space-between;
}
.slot{
  background:var(--cream-deep);
  border-radius:12px;
  padding:10px;
  font-size:13px;
}
.meal-period{margin-top:10px;min-height:76px;}
.meal-period:first-of-type{margin-top:0;}
.meal-period-label{
  display:flex;align-items:center;gap:5px;margin:0 2px 5px;
  color:var(--ink-soft);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;
}
.slot.empty{
  display:flex;align-items:center;justify-content:center;
  color:var(--ink-soft);
  border:1.5px dashed var(--line);
  background:transparent;
  min-height:44px;
  font-weight:700;
  cursor:pointer;
  text-align:center;
  padding:10px;
}
.planned-slot{cursor:grab;border:1px solid transparent;}
.planned-slot:active{cursor:grabbing;}
.meal-period:has(.planned-slot):hover .planned-slot{border-color:var(--line);}
.slot .meal-name{font-weight:800;margin-bottom:8px;display:block;}
.slot .clear-btn{
  border:none;background:none;color:var(--ink-soft);
  font-size:11px;font-weight:700;cursor:pointer;text-decoration:underline;
  padding:4px 0;
}
.meal-slot-actions{display:flex;align-items:center;justify-content:space-between;margin-top:5px;}
.move-btn{border:none;background:none;color:var(--barn-dark);font-size:11px;font-weight:800;cursor:pointer;padding:4px 0;}
.stepper{
  display:flex;align-items:center;justify-content:space-between;
  background:var(--white);
  border-radius:10px;
  padding:5px 8px;
}
.stepper button{
  width:30px;height:30px;border-radius:100px;border:none;
  background:var(--barn); color:white; font-weight:800;
  cursor:pointer; display:flex;align-items:center;justify-content:center;
  font-size:16px;
}
.stepper .count{font-family:'JetBrains Mono',monospace;font-weight:600;}

.winner-note{
  display:flex;align-items:center;gap:6px;
  font-size:11px;
  color:var(--herb-dark);
  font-weight:800;
  margin-top:8px;
}
.move-sheet-close{float:right;border:none;background:var(--cream-deep);border-radius:50%;width:32px;height:32px;cursor:pointer;}
.move-meal-sheet>p{font-size:12px;color:var(--ink-soft);margin:4px 0 14px;}
.move-destination-list{display:flex;flex-direction:column;gap:11px;}
.move-day-group{background:var(--white);border:1px solid var(--line);border-radius:13px;padding:9px;}
.move-week-divider{margin:-9px -9px 8px;padding:8px 10px;border-radius:12px 12px 0 0;background:var(--cream-deep);color:var(--barn-dark);font-family:'Fredoka',sans-serif;font-size:12px;font-weight:700;}
.move-day-label{display:flex;justify-content:space-between;margin-bottom:7px;color:var(--ink-soft);font-size:11px;font-weight:800;text-transform:uppercase;}
.move-day-slots{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;}
.move-day-slots button{display:flex;flex-direction:column;align-items:flex-start;min-width:0;border:1px dashed var(--line);border-radius:9px;background:var(--cream);padding:8px;cursor:pointer;text-align:left;}
.move-day-slots button.occupied{border-style:solid;background:#FFF3EE;}.move-day-slots button:disabled{opacity:.4;cursor:default;}
.move-day-slots button span{font-size:11px;font-weight:800;}.move-day-slots button small{width:100%;margin-top:3px;color:var(--ink-soft);font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
@media (max-width:420px){.move-day-slots{grid-template-columns:1fr;}.move-day-slots button{flex-direction:row;justify-content:space-between;gap:8px;}.move-day-slots button small{width:auto;max-width:55%;margin:0;}}

.recipe-picker{
  position:fixed; inset:0; background:rgba(58,46,40,0.4);
  display:flex; align-items:flex-end; justify-content:center;
  z-index:30;
}
@media (min-width:640px){ .recipe-picker{align-items:center;} }
.recipe-picker-sheet{
  background:var(--cream);
  border-radius:20px 20px 0 0;
  width:100%; max-width:480px;
  max-height:80vh; overflow-y:auto;
  padding:18px;
}
@media (min-width:640px){ .recipe-picker-sheet{border-radius:20px;} }
.recipe-picker-row{
  display:flex; align-items:center; gap:12px;
  background:var(--white); border:1px solid var(--line);
  border-radius:14px; padding:10px 12px; margin-bottom:8px;
  cursor:pointer; min-height:44px;
}
.recipe-picker-row .emoji{font-size:26px;}
.picker-search{display:flex;align-items:center;gap:7px;position:sticky;top:-18px;z-index:2;background:var(--cream);padding:10px 0 8px;margin-bottom:2px;}
.picker-search span{font-size:22px;color:var(--ink-soft);}
.picker-search input{width:100%;border:1.5px solid var(--line);border-radius:11px;background:var(--white);padding:11px 12px;font:inherit;}
.picker-recipe-list{display:flex;flex-direction:column;}
.picker-thumb{display:flex;align-items:center;justify-content:center;width:64px;height:54px;border-radius:10px;overflow:hidden;flex-shrink:0;font-size:25px;}
.picker-thumb img{width:100%;height:100%;object-fit:cover;}
.picker-recipe-meta{font-size:11px;color:var(--ink-soft);margin-top:3px;line-height:1.3;}

/* ---- SHOPPING LIST VIEW ---- */
.list-columns{
  display:grid;
  grid-template-columns:1fr;
  gap:20px;
}
@media (min-width:900px){ .list-columns{grid-template-columns:1fr 1fr; gap:24px;} }
.mobile-needed-toggle{display:none;}

.list-group{
  background:var(--white);
  border-radius:18px;
  border:1px solid var(--line);
  margin-bottom:16px;
  overflow:hidden;
}
.list-group .group-head{
  padding:12px 16px;
  font-family:'Fredoka',sans-serif;
  font-weight:600;
  font-size:14px;
  background:var(--cream-deep);
  display:flex;align-items:center;gap:8px;
}
.group-head.collapsible{cursor:pointer; user-select:none;}
.collapse-chevron{
  display:inline-block;
  transition:transform .15s ease;
  color:var(--ink-soft);
}
.collapse-chevron.open{transform:rotate(180deg);}
.item-row{
  display:flex;align-items:center;gap:12px;
  padding:12px 16px;
  border-top:1px solid var(--line);
}
.item-row input[type=checkbox]{
  width:22px;height:22px;
  accent-color:var(--herb);
  flex-shrink:0;
}
.item-row.checked .item-name{ text-decoration:line-through; color:var(--ink-soft); }
.item-info{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px;}
.item-main{display:flex; align-items:baseline; gap:8px;}
.item-name{font-weight:700; flex:1;}
.item-qty{font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--ink-soft);}
.item-meta{font-size:11px; color:var(--ink-soft);}
.item-row .remove-btn{
  border:none;background:none;color:var(--ink-soft);
  font-size:16px;cursor:pointer;padding:6px;
}
.item-row.flagged{background:#FFF8E9;}
.confirm-row{
  display:flex; align-items:center; justify-content:space-between;
  padding:8px 16px 12px; gap:8px; font-size:12px; color:var(--ink-soft);
}
.confirm-row .confirm-btn{
  border:none;background:var(--sun);color:var(--ink);
  font-family:'Fredoka',sans-serif;font-weight:700;font-size:12px;
  padding:8px 12px;border-radius:8px;cursor:pointer;
}
.added-by{
  width:24px;height:24px;border-radius:100px;
  display:flex;align-items:center;justify-content:center;
  font-size:10px;color:white;font-weight:800;
  font-family:'Fredoka',sans-serif;
  flex-shrink:0;
}
.add-item-row{
  display:flex;gap:8px;
  padding:12px 16px;
}
.add-item-row input{
  flex:1;
  border:1.5px solid var(--line);
  border-radius:10px;
  padding:10px 12px;
  font-family:'Nunito',sans-serif;
  font-size:14px;
}
.add-item-row button{
  border:none;background:var(--barn);color:white;
  width:44px;border-radius:10px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font-size:18px;font-weight:800;
}

.from-meals{
  background:#FFFCF5;
  border:1px solid #E6D5B9;
  border-radius:20px;
  padding:14px;
  box-shadow:0 5px 18px rgba(58,46,40,.07);
}
.needed-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px;}
.needed-panel-head h3{font-size:17px;margin:0;line-height:1.25;}
.needed-panel-head p{font-size:12px;color:var(--ink-soft);margin:4px 0 0;line-height:1.4;}
.needed-panel-head .confirm-btn{
  border:none;background:var(--sun);color:var(--ink);border-radius:10px;
  min-height:42px;padding:8px 13px;white-space:nowrap;cursor:pointer;
  font-family:'Fredoka',sans-serif;font-weight:700;
}
.needed-head-actions{display:flex;align-items:center;gap:7px;}
.needed-mobile-close{display:none;}
.meal-source{
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 0;
  border-top:1px solid var(--line);
  font-size:13px;
}
.meal-source:first-of-type{border-top:none;}
.needed-row{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:13px;
  margin-top:10px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--white);
}
.needed-info{min-width:0;flex:1;}
.needed-title-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.needed-name{font-size:15px;font-weight:800;line-height:1.25;}
.needed-qty{
  padding:3px 7px;border-radius:100px;background:var(--cream-deep);
  font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:700;white-space:nowrap;
}
.needed-category{margin-top:3px;color:var(--ink-soft);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;}
.needed-source{margin-top:5px;color:var(--ink-soft);font-size:12px;line-height:1.35;}
.needed-statuses{display:flex;flex-direction:column;align-items:flex-start;gap:5px;margin-top:8px;}
.needed-badge{padding:5px 8px;border-radius:8px;font-size:11px;font-weight:800;line-height:1.3;}
.needed-badge.on-list{background:#E0F0E2;color:var(--herb-dark);}
.needed-badge.duplicate{background:#FBE4DF;color:var(--barn-dark);}
.needed-badge.recent{background:#FFF0C7;color:#765817;}
.needed-add-btn{
  flex-shrink:0;white-space:nowrap;border:none;background:var(--barn);color:white;
  border-radius:10px;min-height:44px;padding:9px 12px;cursor:pointer;
  font-family:'Fredoka',sans-serif;font-size:12px;font-weight:700;
}
.needed-decision-actions{display:flex;flex-direction:column;gap:7px;flex-shrink:0;}
.needed-have-btn{
  border:1px solid #A8C9AD;background:#EDF7EE;color:var(--herb-dark);
  border-radius:10px;min-height:42px;padding:8px 12px;cursor:pointer;
  font-family:'Fredoka',sans-serif;font-size:12px;font-weight:700;white-space:nowrap;
}
.needed-all-done{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:24px 14px;color:var(--herb-dark);
}
.needed-all-done>span{display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;background:#E0F0E2;font-size:22px;margin-bottom:8px;}
.needed-all-done strong{font-family:'Fredoka',sans-serif;font-size:16px;}
.needed-all-done small{color:var(--ink-soft);margin-top:3px;}
.handled-toggle{
  display:flex;align-items:center;justify-content:space-between;width:100%;margin-top:10px;
  border:none;border-top:1px solid var(--line);background:transparent;padding:12px 4px 4px;
  color:var(--ink-soft);font-family:'Fredoka',sans-serif;font-weight:600;cursor:pointer;
}
.handled-toggle span:last-child{transition:transform .15s ease;}.handled-toggle span:last-child.open{transform:rotate(180deg);}
.handled-list{margin-top:7px;border-top:1px solid var(--line);}
.handled-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 3px;border-bottom:1px solid var(--line);}
.handled-row div{display:flex;flex-direction:column;min-width:0;}.handled-row strong{font-size:13px;}.handled-row small{font-size:11px;color:var(--ink-soft);}
.handled-row button{border:none;background:var(--cream-deep);border-radius:8px;padding:7px 10px;color:var(--ink-soft);font-size:11px;font-weight:700;cursor:pointer;}
@media (min-width:900px){.meal-needs-column{position:sticky;top:20px;align-self:start;}}
@media (max-width:899px){
  .mobile-needed-toggle{
    display:flex;align-items:center;width:100%;gap:11px;margin-bottom:14px;padding:12px 13px;
    border:1px solid #E6D5B9;border-radius:15px;background:#FFFCF5;color:var(--ink);
    box-shadow:0 3px 12px rgba(58,46,40,.06);text-align:left;cursor:pointer;
  }
  .mobile-needed-toggle.open{border-color:var(--sun);background:#FFF8E7;}
  .mobile-needed-icon{font-size:23px;}.mobile-needed-copy{display:flex;flex-direction:column;flex:1;min-width:0;}
  .mobile-needed-copy strong{font-family:'Fredoka',sans-serif;font-size:15px;}.mobile-needed-copy small{font-size:11px;color:var(--ink-soft);margin-top:1px;}
  .mobile-needed-count{display:flex;align-items:center;justify-content:center;min-width:25px;height:25px;padding:0 5px;box-sizing:border-box;border-radius:100px;background:var(--barn);color:white;font-size:11px;font-weight:800;}
  .mobile-needed-chevron{color:var(--ink-soft);transition:transform .15s ease;}.mobile-needed-chevron.open{transform:rotate(180deg);}
  .meal-needs-column{display:none;order:-1;}
  .meal-needs-column.mobile-open{display:block;}
  .from-meals{margin-bottom:2px;}
  .needed-mobile-close{display:block;border:none;background:var(--cream-deep);border-radius:9px;padding:9px 11px;color:var(--ink);font-family:'Fredoka',sans-serif;font-weight:600;cursor:pointer;}
}
@media (max-width:520px){
  .from-meals{padding:12px;border-radius:16px;}
  .needed-panel-head{align-items:center;}
  .needed-panel-head h3{font-size:16px;}
  .needed-panel-head p{font-size:11px;}
  .needed-row{align-items:stretch;flex-direction:column;padding:12px;}
  .needed-decision-actions{display:grid;grid-template-columns:1fr 1fr;}
  .needed-add-btn,.needed-have-btn{width:100%;font-size:13px;}
  .needed-name{font-size:16px;}
  .needed-badge{width:100%;box-sizing:border-box;}
}

.footnote{
  margin-top:32px;
  font-size:12px;
  color:var(--ink-soft);
  text-align:center;
}

/* ---- SETTINGS VIEW ---- */
.settings-row{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:14px 16px;
  border-top:1px solid var(--line);
}
.settings-row:first-of-type{border-top:none;}
.settings-row-label{font-weight:700; margin-bottom:2px;}
.settings-row-desc{font-size:12px; color:var(--ink-soft); max-width:420px;}
.switch{
  width:44px;height:26px;border-radius:100px;
  background:var(--herb);
  position:relative;cursor:pointer;
  flex-shrink:0;
  transition:background .15s ease;
}
.switch .knob{
  width:20px;height:20px;border-radius:100px;background:white;
  position:absolute;top:3px;left:21px;
  transition:left .15s ease;
  box-shadow:0 1px 3px rgba(58,46,40,0.3);
}
.switch.off{background:var(--line);}
.switch.off .knob{left:3px;}
.settings-user-row{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:14px 16px; border-top:1px solid var(--line);
}
.settings-user-identity{display:flex; align-items:center; gap:10px; min-width:0;}
.settings-user-avatar{
  width:36px; height:36px; border-radius:100px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  color:white; font-family:'Fredoka',sans-serif; font-weight:700;
}
.settings-name-form{display:flex; align-items:center; gap:8px; flex-wrap:wrap; justify-content:flex-end;}
.settings-name-form input{
  width:180px; max-width:100%; border:1.5px solid var(--line); border-radius:10px;
  padding:9px 11px; font-family:'Nunito',sans-serif; font-size:14px;
}
.settings-name-form button{
  border:none; background:var(--barn); color:white; border-radius:10px;
  padding:10px 14px; font-family:'Fredoka',sans-serif; font-weight:600; cursor:pointer;
}
.settings-name-form button:disabled{opacity:.55; cursor:default;}
.settings-name-error{width:100%; text-align:right; font-size:11px; color:var(--barn-dark);}
@media (max-width:640px){
  .settings-user-row{align-items:flex-start; flex-direction:column;}
  .settings-name-form{width:100%; justify-content:stretch;}
  .settings-name-form input{flex:1; width:auto; min-width:0;}
}

/* ---- RECIPE LIBRARY VIEW ---- */
.import-bar{
  display:flex;gap:10px;flex-wrap:wrap;
  background:var(--white);
  border:1px solid var(--line);
  border-radius:16px;
  padding:10px 10px 10px 16px;
  margin-bottom:18px;
  align-items:center;
}
.import-bar input{
  flex:1;min-width:160px;border:none;outline:none;
  font-family:'Nunito',sans-serif;
  font-size:14px;
  background:transparent;
}
.import-bar button{
  border:none;background:var(--barn);color:white;
  font-family:'Fredoka',sans-serif;font-weight:600;font-size:13px;
  padding:11px 18px;border-radius:10px;cursor:pointer;
  min-height:44px;
}
.import-status{font-size:12px;color:var(--ink-soft); width:100%;}
.import-status.error{color:var(--barn-dark);}
.suggest-btn{
  border:none; background:var(--herb); color:white;
  font-family:'Fredoka',sans-serif; font-weight:600; font-size:13px;
  padding:11px 16px; border-radius:10px; cursor:pointer; white-space:nowrap;
}
.suggest-btn:disabled{opacity:.6; cursor:default;}
.suggestion-actions{display:flex; gap:8px; flex-wrap:wrap; margin:-4px 0 18px;}
.spoonacular-quota{
  display:flex; align-items:center; gap:5px; flex-wrap:wrap;
  width:max-content; max-width:100%; margin:-8px 0 18px; padding:6px 10px;
  border:1px solid var(--line); border-radius:100px; background:var(--white);
  color:var(--ink-soft); font-size:11px;
}
.spoonacular-quota strong{color:var(--herb-dark);}

.chip-row{
  display:flex;gap:8px;margin-bottom:18px;flex-wrap:wrap;
}
.chip{
  background:var(--cream-deep);
  border-radius:100px;
  padding:8px 14px;
  font-size:13px;font-weight:700;
  color:var(--ink-soft);
  cursor:pointer;
}
.chip.active{background:var(--sun); color:var(--ink);}

.recipe-card{position:relative;}
.source-badge{
  position:absolute;top:10px;left:10px;
  background:rgba(255,253,249,0.92);
  border-radius:100px;
  padding:4px 10px;
  font-size:10px;font-weight:800;
  color:var(--ink-soft);
  z-index:2;
}
.rating-row{
  display:flex;align-items:center;justify-content:space-between;
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid var(--line);
}
.stars{font-size:13px;letter-spacing:1px;}
.thumb-count{
  display:flex;align-items:center;gap:4px;
  font-family:'JetBrains Mono',monospace;
  font-size:12px;color:var(--ink-soft);
}
.catalog-btn{
  width:100%;
  margin-top:10px;
  border:none;background:var(--cream-deep);color:var(--ink);
  font-family:'Fredoka',sans-serif;font-weight:600;font-size:13px;
  padding:11px;border-radius:10px;cursor:pointer;
  min-height:44px;
}
.catalog-btn:hover{background:var(--sun);}
.catalog-edit-toggle{
  border:1px solid var(--line); background:var(--white); color:var(--ink);
  border-radius:10px; padding:10px 14px; cursor:pointer;
  font-family:'Fredoka',sans-serif; font-weight:600; white-space:nowrap;
}
.catalog-edit-toggle.active{background:var(--barn); border-color:var(--barn); color:white;}
.edit-mode-note{
  margin:-8px 0 14px; padding:9px 12px; border-radius:10px;
  background:#FFF3EE; color:var(--barn-dark); font-size:12px; font-weight:700;
}
.recipe-card.edit-mode{
  cursor:pointer; outline:2px dashed var(--barn); outline-offset:-2px;
  transition:transform .12s ease, outline-color .12s ease;
}
.recipe-card.edit-mode:hover{transform:translateY(-2px); outline-style:solid;}
.edit-card-prompt{
  margin-top:10px; padding:10px; border-radius:10px; text-align:center;
  background:#FFF3EE; color:var(--barn-dark); font-family:'Fredoka',sans-serif; font-weight:600;
}

.recipe-detail{
  position:fixed; inset:0; background:rgba(58,46,40,0.4);
  display:flex; align-items:flex-end; justify-content:center;
  z-index:30;
}
@media (min-width:640px){ .recipe-detail{align-items:center;} }
.recipe-detail-sheet{
  background:var(--cream);
  border-radius:20px 20px 0 0;
  width:100%; max-width:560px;
  max-height:85vh; overflow-y:auto;
  padding:20px;
}
@media (min-width:640px){ .recipe-detail-sheet{border-radius:20px;} }
.recipe-detail-sheet .close-btn{
  float:right; border:none; background:var(--cream-deep); border-radius:100px;
  width:32px;height:32px; cursor:pointer; font-size:16px;
}
.recipe-detail-image{
  width:100%; height:160px; object-fit:cover;
  border-radius:14px; margin-bottom:12px;
}
.recipe-detail-sheet h3{margin:0 0 4px;}
.recipe-detail-sheet .ing-list, .recipe-detail-sheet .step-list{
  padding-left:18px; font-size:14px; line-height:1.7;
}
.recipe-editor h3{margin-bottom:18px;}
.recipe-editor label{
  display:block; margin-top:13px; font-size:12px; font-weight:800; color:var(--ink-soft);
}
.recipe-editor label span{font-weight:500;}
.recipe-editor input, .recipe-editor textarea{
  display:block; width:100%; box-sizing:border-box; margin-top:5px;
  border:1.5px solid var(--line); border-radius:10px; padding:10px 12px;
  background:var(--white); color:var(--ink); font-family:'Nunito',sans-serif; font-size:14px;
}
.recipe-editor textarea{resize:vertical; line-height:1.45;}
.recipe-editor-grid{display:grid; grid-template-columns:130px 1fr; gap:12px;}
.recipe-editor-error{margin-top:12px; color:var(--barn-dark); font-size:12px; font-weight:700;}
.recipe-editor-actions{display:flex; justify-content:space-between; gap:12px; margin-top:20px;}
.recipe-editor-actions button{
  border:none; border-radius:10px; padding:11px 16px;
  font-family:'Fredoka',sans-serif; font-weight:700; cursor:pointer;
}
.recipe-editor-actions button:disabled{opacity:.55; cursor:default;}
.danger-btn{background:#F7D8D3; color:var(--barn-dark);}
.save-recipe-btn{background:var(--barn); color:white; margin-left:auto;}
@media (max-width:480px){.recipe-editor-grid{grid-template-columns:1fr; gap:0;}}
