:root{
  --ink:#16324f;
  --sea:#2e7d9a;
  --sea-light:#e8f2f6;
  --sand:#faf7f0;
  --sand-rgb:250,247,240;
  --shell:#ffffff;
  --shell-rgb:255,255,255;
  --alga:#4c8a63;
  --sole:#c9861f;
  --line:#d9e4ea;
  --muted:#7a8fa0;
  --muted2:#4a6274;
}
@media (prefers-color-scheme: dark){
  :root{
    --ink:#e9f1f6;
    --sea:#6fc3e4;
    --sea-light:#173040;
    --sand:#0f1b23;
    --sand-rgb:15,27,35;
    --shell:#16262f;
    --shell-rgb:22,38,47;
    --alga:#7bc496;
    --sole:#e4ac52;
    --line:#274252;
    --muted:#8ba2b2;
    --muted2:#a9bdc9;
  }
}
:root[data-theme="dark"]{
  --ink:#e9f1f6;
  --sea:#6fc3e4;
  --sea-light:#173040;
  --sand:#0f1b23;
  --sand-rgb:15,27,35;
  --shell:#16262f;
  --shell-rgb:22,38,47;
  --alga:#7bc496;
  --sole:#e4ac52;
  --line:#274252;
  --muted:#8ba2b2;
  --muted2:#a9bdc9;
}
:root[data-theme="light"]{
  --ink:#16324f;
  --sea:#2e7d9a;
  --sea-light:#e8f2f6;
  --sand:#faf7f0;
  --sand-rgb:250,247,240;
  --shell:#ffffff;
  --shell-rgb:255,255,255;
  --alga:#4c8a63;
  --sole:#c9861f;
  --line:#d9e4ea;
  --muted:#7a8fa0;
  --muted2:#4a6274;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{-webkit-text-size-adjust:100%;}
body{
  font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  background:var(--sand);
  color:var(--ink);
  line-height:1.5;
  padding:26px 16px calc(88px + env(safe-area-inset-bottom));
  transition:background .25s ease,color .25s ease;
}
.page{max-width:720px;margin:0 auto;}

header{text-align:center;margin-bottom:6px;}
.eyebrow{
  font-family:-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:12px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--sea);margin-bottom:10px;
}
h1{font-size:34px;font-weight:600;letter-spacing:-.01em;line-height:1.15;}
.subtitle{font-size:16px;font-style:italic;color:var(--muted2);margin-top:8px;}

.tide{display:block;width:100%;height:24px;margin:16px 0 22px;}
.tide path{stroke:var(--sea);stroke-width:1.6;fill:none;opacity:.55;}
@media (prefers-reduced-motion: no-preference){
  .tide path{stroke-dasharray:900;stroke-dashoffset:900;animation:tide-draw 2.4s ease-out forwards;}
}
@keyframes tide-draw{to{stroke-dashoffset:0;}}

.intro{
  background:var(--sea-light);
  border:1px solid var(--line);
  border-radius:12px;
  padding:16px 20px;
  margin-bottom:18px;
  font-size:15px;
}
.intro strong{color:var(--sea);}

.legend{
  display:flex;gap:18px;flex-wrap:wrap;justify-content:center;
  font-family:-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:12.5px;margin-bottom:20px;color:var(--muted2);
}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:baseline;}
.dot.alga{background:var(--alga);}
.dot.sole{background:var(--sole);}

/* ---------- sticky toolbar: week switch + day pills ---------- */
.toolbar{
  position:sticky;top:0;z-index:30;
  margin:0 -16px 18px;padding:10px 16px 8px;
  background:rgba(var(--sand-rgb),.86);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  transition:box-shadow .2s ease;
}
.toolbar.scrolled{box-shadow:0 6px 16px rgba(0,0,0,.08);}
.toolbar-row1{display:flex;align-items:center;gap:10px;}

.week-switch{
  position:relative;flex:1;display:flex;background:var(--sea-light);
  border-radius:999px;padding:4px;
}
.week-thumb{
  position:absolute;top:4px;left:4px;
  width:calc(50% - 4px);height:calc(100% - 8px);
  background:var(--sea);border-radius:999px;
  transition:transform .32s cubic-bezier(.4,0,.2,1);
  box-shadow:0 2px 8px rgba(0,0,0,.15);
}
html[data-week="B"] .week-thumb{transform:translateX(100%);}
.week-btn{
  position:relative;z-index:1;flex:1;border:none;background:none;
  font:600 14px/1 -apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  color:var(--ink);padding:11px 0;border-radius:999px;cursor:pointer;
  transition:color .25s ease;
}
.week-btn[aria-selected="true"]{color:#fff;}

.theme-toggle{
  flex:0 0 auto;width:40px;height:40px;border-radius:50%;
  border:1px solid var(--line);background:var(--shell);
  font-size:17px;display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:transform .15s ease;
}
.theme-toggle:active{transform:scale(.88);}

.day-pills{
  display:flex;gap:8px;overflow-x:auto;padding:10px 2px 2px;
  scrollbar-width:none;-ms-overflow-style:none;
}
.day-pills::-webkit-scrollbar{display:none;}
.pill{
  flex:0 0 auto;padding:8px 15px;border-radius:999px;
  border:1px solid var(--line);background:var(--shell);
  font:600 13px -apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  color:var(--ink);cursor:pointer;transition:background .2s,color .2s,border-color .2s;
}
.pill.active{background:var(--sea);color:#fff;border-color:var(--sea);}
.pill.is-today:not(.active){border-color:var(--sole);color:var(--sole);}

.days-controls{display:flex;justify-content:flex-end;margin-bottom:12px;}
.toggle-all{
  font:600 12.5px -apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  color:var(--sea);background:none;border:1px solid var(--sea);
  padding:7px 14px;border-radius:999px;cursor:pointer;
}
.toggle-all:active{transform:scale(.96);}

/* ---------- day accordion ---------- */
.day{
  background:var(--shell);
  border:1px solid var(--line);
  border-radius:14px;
  margin-bottom:14px;
  overflow:hidden;
}
.day-header{
  width:100%;display:flex;flex-direction:column;gap:6px;
  background:none;border:none;padding:17px 20px;
  text-align:left;font:inherit;color:inherit;cursor:pointer;
  -webkit-tap-highlight-color:transparent;transition:background .15s ease;
}
.day-header:active{background:var(--sea-light);}
.day-header-top{display:flex;align-items:center;gap:10px;}
.day-name{
  font-size:20px;font-weight:700;letter-spacing:.01em;
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
}
.today-badge{
  font:700 10px -apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  background:var(--sole);color:#fff;padding:3px 8px;border-radius:999px;
  letter-spacing:.05em;text-transform:uppercase;
}
.chevron{
  margin-left:auto;flex:0 0 auto;width:9px;height:9px;
  border-right:2px solid var(--sea);border-bottom:2px solid var(--sea);
  transform:rotate(45deg);transition:transform .3s ease;
}
.day.expanded .chevron{transform:rotate(225deg);}
.day-preview{
  font-size:13px;color:var(--muted);white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;max-width:100%;
}
.day.expanded .day-preview{display:none;}

.day-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s cubic-bezier(.4,0,.2,1);}
.day.expanded .day-body{grid-template-rows:1fr;}
.day-body-inner{overflow:hidden;min-height:0;}
.day-body-content{padding:2px 20px 20px;}

.meal{margin-bottom:14px;}
.meal:last-child{margin-bottom:0;}
.meal-label{
  font-family:-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--sea);margin-bottom:6px;
}
.week{border-left:3px solid var(--sea-light);padding-left:12px;}
.week .wk{display:none;}
.dish{font-size:16px;font-weight:600;margin-top:2px;}
.plus{font-size:15px;font-weight:600;color:var(--sea);margin-top:3px;}
.plus::before{content:"+ ";font-weight:700;}
.side{font-size:14px;color:var(--muted2);font-style:italic;margin-top:2px;}
.badge{
  display:inline-block;
  font-family:-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:10px;font-weight:700;letter-spacing:.06em;
  padding:2px 7px;border-radius:999px;
  vertical-align:middle;margin-left:6px;
  color:#fff;
}
.badge.alga{background:var(--alga);}
.badge.sole{background:var(--sole);}
.unico{
  display:inline-block;
  font-family:-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:10px;font-weight:700;letter-spacing:.06em;
  padding:2px 7px;border-radius:999px;
  vertical-align:middle;margin-left:6px;
  color:var(--sea);border:1px solid var(--sea);
}

html[data-week="A"] .week[data-week="B"]{display:none;}
html[data-week="B"] .week[data-week="A"]{display:none;}

h2{font-size:23px;margin:34px 0 14px;text-align:center;font-weight:600;}
.box{
  background:var(--shell);
  border:1px solid var(--line);
  border-radius:14px;
  padding:20px 22px;
  margin-bottom:16px;
  font-size:15.5px;
  scroll-margin-top:110px;
}
.box h3{font-size:17px;color:var(--sea);margin-bottom:8px;font-weight:700;}
.box p{margin-bottom:8px;}
.box p:last-child{margin-bottom:0;}

.pantry{
  display:grid;grid-template-columns:1fr 1fr;gap:14px 18px;
  margin:12px 0 10px;
}
@media (max-width:560px){.pantry{grid-template-columns:1fr;}}
.pantry-group{
  background:var(--sand);
  border:1px solid var(--line);
  border-radius:10px;
  padding:12px 14px;
}
.pantry-title-row{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
.pantry-title{
  font-family:-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:11.5px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--sea);
}
.pantry-count{
  margin-left:auto;font:700 11px -apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  color:var(--muted);
}
.pantry-list{list-style:none;font-size:14.5px;}
.pantry-item{display:flex;align-items:flex-start;gap:10px;padding:5px 0;cursor:pointer;}
.pantry-item input[type="checkbox"]{
  appearance:none;-webkit-appearance:none;
  width:19px;height:19px;flex:0 0 19px;margin-top:1px;
  border:1.6px solid var(--sea);border-radius:6px;
  position:relative;cursor:pointer;background:var(--shell);
  transition:background .15s ease,border-color .15s ease;
}
.pantry-item input[type="checkbox"]:checked{background:var(--sea);border-color:var(--sea);}
.pantry-item input[type="checkbox"]:checked::after{
  content:"";position:absolute;left:5.5px;top:1.5px;
  width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;
  transform:rotate(45deg);
}
.pantry-item span{flex:1;}
.pantry-item input:checked ~ span{color:var(--muted);text-decoration:line-through;}
.pantry-item em{color:var(--muted);font-size:13px;font-style:italic;text-decoration:none !important;}
.pantry-note{font-size:14px;color:var(--muted2);font-style:italic;}
.pantry-actions{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  margin:14px 0 12px;
}
.pantry-reset{
  font:600 12px -apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  color:var(--sea);background:none;border:1px solid var(--sea);
  padding:7px 13px;border-radius:999px;cursor:pointer;flex:0 0 auto;
}
.pantry-reset:active{transform:scale(.96);}
.pantry-hint{font-size:12.5px;color:var(--muted);}

footer{
  text-align:center;margin-top:30px;
  font-family:-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:12px;color:var(--muted);letter-spacing:.04em;
}

/* ---------- bottom app nav ---------- */
.bottom-nav{
  position:fixed;left:0;right:0;bottom:0;z-index:40;
  display:flex;
  background:rgba(var(--shell-rgb),.92);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border-top:1px solid var(--line);
  padding:6px 4px calc(6px + env(safe-area-inset-bottom));
  box-shadow:0 -4px 14px rgba(0,0,0,.06);
}
.nav-btn{
  flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;
  background:none;border:none;color:var(--muted);
  font:600 10px -apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  padding:6px 2px;border-radius:12px;cursor:pointer;transition:color .2s ease,transform .15s ease;
}
.nav-btn .ic{font-size:19px;line-height:1;}
.nav-btn.active{color:var(--sea);}
.nav-btn:active{transform:scale(.9);}

/* ---------- reveal-on-scroll ---------- */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .5s ease,transform .5s ease;}
.reveal.visible{opacity:1;transform:none;}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1;transform:none;transition:none;}
  .tide path{animation:none;stroke-dashoffset:0;}
}

/* ---------- data load error ---------- */
.load-error{
  background:var(--shell);border:1px solid var(--line);border-radius:14px;
  padding:20px;text-align:center;color:var(--muted2);
}

@media print{
  body{background:#fff;padding:0;color:#000;}
  .toolbar,.bottom-nav,.theme-toggle,.days-controls,.tide,.day-preview,.chevron{display:none !important;}
  .day .week{display:block !important;margin-bottom:10px;}
  .week .wk{display:block !important;}
  .day-body{grid-template-rows:1fr !important;}
  .day,.box{box-shadow:none;break-inside:avoid;}
  .reveal{opacity:1 !important;transform:none !important;}
}
