/* Our Command Center v24 — soft dimensional boho polish */
:root{
  --bg:#f3eee8;
  --card:#fffdfa;
  --ink:#49433f;
  --muted:#8e8179;
  --line:rgba(177,159,148,.28);
  --rose:#cfa3a3;
  --rose-deep:#c59595;
  --sage:#98a98f;
  --surface-low:0 4px 14px rgba(77,61,51,.045),0 1px 2px rgba(77,61,51,.035);
  --surface-mid:0 12px 30px rgba(77,61,51,.075),0 2px 6px rgba(77,61,51,.04);
  --surface-high:0 22px 55px rgba(77,61,51,.12),0 5px 14px rgba(77,61,51,.055);
  --inner-highlight:inset 0 1px 0 rgba(255,255,255,.82);
}

html{
  background:#eee7e0;
}
body{
  min-height:100dvh;
  background:
    radial-gradient(540px 430px at 8% 8%,rgba(207,163,163,.11),transparent 64%),
    radial-gradient(520px 460px at 95% 19%,rgba(152,169,143,.105),transparent 66%),
    radial-gradient(460px 420px at 46% 78%,rgba(203,190,213,.075),transparent 68%),
    linear-gradient(180deg,#f7f3ef 0%,#f3eee8 42%,#f5f0ea 100%);
  background-attachment:fixed;
}

.app{position:relative}
.app:before{
  content:"";
  position:absolute;
  z-index:-1;
  width:240px;
  height:240px;
  top:92px;
  left:-145px;
  border-radius:50%;
  border:1px solid rgba(205,163,162,.075);
  box-shadow:0 0 0 28px rgba(154,169,143,.035),0 0 0 58px rgba(216,194,216,.025);
  pointer-events:none;
}

header:not(.compact){position:relative}
.brand{color:#443e3a;text-shadow:0 1px 0 rgba(255,255,255,.7)}
.tag{color:#94867d}

/* Elevation system */
.utility-button,.today-item,.glance-card,.summary-tile,.store-progress-stat,.search-page-box,
.task-list-card,.store-card,.more-card,.person-card,.note-card,.month-planner,
.collapsible-card,.data-card,.income-card,.budget-progress-card,.recipe-row,.v23-household-bar{
  box-shadow:var(--surface-low),var(--inner-highlight);
}
.module-card,.shopping-card,.system-form-card,.section-list .empty,.day,.list-card,
.aisle-finder-card,.v23-onboard-card,.v23-account-summary,.v23-store-empty{
  box-shadow:var(--surface-mid),var(--inner-highlight);
}
.hero-v19,.recipe-sheet,.quick-add-sheet,.store-picker-sheet,.v23-auth-card,.v23-account-sheet,.v23-migrate-card{
  box-shadow:var(--surface-high),var(--inner-highlight);
}

/* Hero: make the daily command center the visual anchor */
.hero-v19{
  border:1px solid rgba(190,171,160,.30);
  background:
    radial-gradient(210px 190px at 92% 8%,rgba(207,163,163,.16),transparent 64%),
    radial-gradient(220px 200px at 8% 105%,rgba(152,169,143,.105),transparent 68%),
    linear-gradient(145deg,rgba(255,253,250,.98),rgba(248,242,237,.96));
  transform:translateZ(0);
}
.hero-v19:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(112deg,rgba(255,255,255,.40),transparent 34%,transparent 72%,rgba(255,255,255,.18));
  pointer-events:none;
}
.hero-v19:after{
  border-color:rgba(197,149,149,.34);
  box-shadow:0 0 0 24px rgba(152,169,143,.07),0 0 0 48px rgba(216,194,216,.045);
}
.hero-v19 .eyebrow{color:#8d8078}
.hero-v19 .greeting{color:#48413d;text-shadow:0 1px 0 rgba(255,255,255,.62)}
.hero-v19 .hero-line-art{opacity:.68;filter:drop-shadow(0 6px 10px rgba(123,91,91,.08))}

/* Utility and Today cards stay lighter so hierarchy is obvious */
.utility-button,.today-item,.today-empty{
  background:rgba(255,253,250,.86);
  border-color:rgba(185,168,157,.26);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.utility-button{position:relative;overflow:hidden}
.utility-button:after{
  content:"";
  position:absolute;
  width:70px;height:70px;border-radius:50%;right:-28px;bottom:-40px;
  background:radial-gradient(circle,rgba(207,163,163,.105),transparent 67%);
  pointer-events:none;
}

/* Feature shopping card */
.shopping-card{
  position:relative;
  overflow:hidden;
  border-color:rgba(171,156,146,.29);
  background:
    radial-gradient(210px 180px at 100% 0%,rgba(152,169,143,.12),transparent 66%),
    linear-gradient(145deg,rgba(255,253,250,.98),rgba(247,240,234,.96));
}
.shopping-card:after{
  content:"";
  position:absolute;
  width:160px;height:160px;border-radius:50%;right:-96px;bottom:-106px;
  border:1px solid rgba(154,169,143,.12);
  box-shadow:0 0 0 20px rgba(207,163,163,.025);
  pointer-events:none;
}

/* Command-center tiles: layered, not busy */
.module-card,.store-card,.more-card{
  position:relative;
  overflow:hidden;
  border-color:rgba(184,167,156,.27);
  background:linear-gradient(155deg,rgba(255,253,250,.98),rgba(250,246,242,.96));
}
.module-card:after,.more-card:after,.store-card:after{
  content:"";
  position:absolute;
  width:108px;height:108px;border-radius:50%;right:-64px;bottom:-68px;
  border:1px solid rgba(179,159,148,.085);
  box-shadow:0 0 0 18px rgba(202,188,180,.028);
  pointer-events:none;
}

/* Icon tiles get a tiny translucent highlight and lift */
.module-visual,.shopping-visual,.glance-icon,.system-icon,.more-card-visual,.store-card-visual,.meal-thumb,.person-avatar{
  border:1px solid rgba(255,255,255,.66);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.74),0 8px 18px rgba(79,63,52,.055);
}
.module-visual.meal,.glance-icon.meals{background:linear-gradient(145deg,#f4e5e4,#eedad9)}
.module-visual.calendar,.glance-icon.events,.shopping-visual,.store-card-visual{background:linear-gradient(145deg,#edf2e9,#e2eadc)}
.module-visual.family{background:linear-gradient(145deg,#f5efe7,#eee4d8)}
.module-visual.budget{background:linear-gradient(145deg,#edf2f5,#e2eaf0)}
.module-visual.home{background:linear-gradient(145deg,#f2ebe5,#eae0d8)}
.module-visual.notes,.glance-icon.tasks{background:linear-gradient(145deg,#f1ebf4,#e8dfed)}

/* Buttons feel pressable without becoming glossy */
.add,.pill,.nav-add-circle,.v23-migrate-actions .primary,.v23-store-empty button{
  background:linear-gradient(180deg,#d5aaaa 0%,#c99b9b 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.42),0 8px 18px rgba(126,88,87,.14);
}
.tab,.delete,.quick-add-close,.locator-action,.v23-close{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 3px 8px rgba(77,61,51,.035);
}

/* Form fields sit slightly inside the page */
input,select,textarea,.recipe-category-select,.grocery-category-select,.calendar-jump{
  box-shadow:inset 0 1px 2px rgba(82,65,54,.028),0 1px 0 rgba(255,255,255,.62);
}
input:focus,select:focus,textarea:focus,.recipe-category-select:focus{
  outline:none;
  border-color:rgba(197,149,149,.62)!important;
  box-shadow:0 0 0 4px rgba(207,163,163,.11),inset 0 1px 2px rgba(82,65,54,.02)!important;
}

/* Navigation: still familiar, but clearly floats above content */
.nav{
  background:rgba(255,253,250,.94);
  border-top:1px solid rgba(185,168,157,.24);
  box-shadow:0 -14px 34px rgba(74,58,49,.085),inset 0 1px 0 rgba(255,255,255,.88);
  backdrop-filter:blur(22px) saturate(1.04);
  -webkit-backdrop-filter:blur(22px) saturate(1.04);
}
.nav button.nav-main.active{
  background:linear-gradient(180deg,rgba(247,242,237,.98),rgba(237,231,224,.98));
  color:#4c4540;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 5px 14px rgba(78,62,52,.055);
}
.nav-add-circle{position:relative}
.nav-add-circle:before{
  content:"";
  position:absolute;
  left:9px;right:9px;top:5px;height:1px;
  background:rgba(255,255,255,.48);
  border-radius:999px;
}
.nav-ico{filter:drop-shadow(0 1px 0 rgba(255,255,255,.65))}

/* Empty states get an intentional visual marker instead of plain text */
.today-empty,.empty.compact-empty,.v23-store-empty{
  position:relative;
  overflow:hidden;
}
.today-empty:before,.empty.compact-empty:before,.v23-store-empty:before{
  content:"";
  display:block;
  width:34px;height:34px;
  margin:0 auto 10px;
  border-radius:50%;
  border:1px solid rgba(177,150,144,.25);
  background:
    radial-gradient(circle at 65% 35%,rgba(207,163,163,.22) 0 4px,transparent 5px),
    radial-gradient(circle at 35% 65%,rgba(152,169,143,.20) 0 5px,transparent 6px),
    rgba(255,255,255,.55);
  box-shadow:0 6px 14px rgba(80,65,55,.045);
}

/* Account/auth screens match the new public brand depth */
.v23-auth-shell,.v23-onboard-shell,.v23-migrate-shell,.v23-setup-error{
  background:
    radial-gradient(520px 400px at 12% 8%,rgba(207,163,163,.12),transparent 68%),
    radial-gradient(480px 410px at 92% 14%,rgba(152,169,143,.10),transparent 70%),
    linear-gradient(180deg,#f7f3ef,#f2ece6);
}
.v23-auth-card,.v23-onboard-card,.v23-migrate-card,.v23-account-sheet{
  border-color:rgba(181,162,151,.28);
  background:rgba(255,253,250,.96);
}
.v23-auth-brand{color:#443e3a;text-shadow:0 1px 0 rgba(255,255,255,.75)}
.v23-auth-tabs{box-shadow:inset 0 1px 2px rgba(77,61,51,.035)}
.v23-account-overlay{background:rgba(54,44,39,.28);backdrop-filter:blur(11px);-webkit-backdrop-filter:blur(11px)}

/* Gentle motion: useful feedback, never bouncy */
button,.module-card,.shopping-card,.utility-button,.today-item,.store-card,.more-card,.recipe-row,.collapsible-card{
  transition:transform .16s ease,box-shadow .18s ease,background-color .18s ease,border-color .18s ease;
}
button:active,.module-card.actionable:active,.shopping-card:active,.utility-button:active,.store-card:active,.more-card:active{
  transform:translateY(1px) scale(.992);
}
@media(hover:hover){
  .module-card.actionable:hover,.shopping-card:hover,.utility-button:hover,.store-card:hover,.more-card:hover{
    transform:translateY(-1px);
    box-shadow:var(--surface-mid),var(--inner-highlight);
  }
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}

@media(max-width:520px){
  body{background-attachment:scroll}
  .hero-v19{border-radius:24px}
  .module-card,.shopping-card,.more-card,.store-card{border-radius:21px}
  .nav{box-shadow:0 -11px 27px rgba(74,58,49,.075),inset 0 1px 0 rgba(255,255,255,.88)}
}