/* Nutrition identity: evergreen actions, blue balance and clear neutral surfaces. */
:root{
 --ink:#18333d;
 --brand-deep:#193f51;
 --muted:#5c6e74;
 --paper:#f6f8f7;
 --surface:#ffffff;
 --accent:#e1f2e9;
 --accent-ink:#18333d;
 --accent-strong:#147a50;
 --action:#147a50;
 --action-hover:#0d613e;
 --action-ink:#ffffff;
 --control-border:#a8bbb2;
 --accent-hover:#cce9d8;
 --accent-soft:#eff7f2;
 --line:#dfe7e3;
 --soft:#eef4f0;
 --data:#39886a;
 --nav-ink:#61736b;
 --nav-active:#e1f2e9;
}
html{background:var(--paper);color-scheme:light}
body.app-v2{background:var(--paper);color:var(--ink)}
body.app-v2 .primary.accent{background:var(--action);color:var(--action-ink);border:1px solid var(--action);font-weight:700}
body.app-v2 .primary.accent:hover{background:var(--action-hover)}
body.app-v2 .outlined{background:var(--surface);border:1px solid var(--control-border);color:var(--ink);font-weight:650}
body.app-v2 .outlined:hover{background:var(--accent-soft);border-color:var(--action)}
body.app-v2 .primary.accent:disabled{opacity:.65}
body.app-v2 .day-card{background:var(--brand-deep)}
body.app-v2 .ring{background:conic-gradient(var(--nav-active) var(--p),rgba(255,255,255,.16) 0)}
body.app-v2 .ring:after{background:var(--brand-deep)}
body.app-v2 .continue-card>button{background:var(--action);color:var(--action-ink)}
body.app-v2 .section-head button,body.app-v2 .welcome-copy .kicker,body.app-v2 .welcome-features svg,body.app-v2 .welcome-photo-note svg{color:var(--accent-strong)}
body.app-v2 .home-actions i{background:var(--accent);color:var(--ink);border-color:var(--control-border);box-shadow:none}
body.app-v2 .goal-coach{background:var(--surface);border-color:var(--line);border-left:3px solid var(--accent)}
body.app-v2 .notice,body.app-v2 .fast-note,body.app-v2 .result-box,body.app-v2 .food-total{background:var(--accent-soft);color:var(--ink)}
body.app-v2 .notice{border-left-color:var(--accent-strong)}
body.app-v2 .choice:has(input:checked){background:var(--accent-soft);border-color:var(--accent-strong)}
body.app-v2 .choice input{accent-color:var(--accent-strong)}
body.app-v2 .portion-row button[aria-pressed=true]{background:var(--accent-soft)!important;border-color:var(--accent-strong)!important}
body.app-v2 .progress>span,body.app-v2 .step-track span.done{background:var(--accent-strong)}
body.app-v2 .nav{
 left:50%;right:auto;transform:translateX(-50%);
 width:min(600px,calc(100% - 24px));bottom:max(10px,env(safe-area-inset-bottom));
 padding:8px;gap:4px;background:var(--surface);border:1px solid var(--line);
 border-radius:22px;box-shadow:0 6px 22px #18333d20;backdrop-filter:none;
}
body.app-v2 .nav button{
 min-width:0;min-height:56px;padding:7px 3px;flex:1;gap:4px;
 color:var(--nav-ink);background:transparent;border-radius:15px;
 font-size:11px;font-weight:500;line-height:1.2;
}
body.app-v2 .nav button svg{width:22px;height:22px;stroke-width:1.8}
body.app-v2 .nav button.active{background:var(--nav-active);color:var(--action);font-weight:700}
body.app-v2 .nav button:focus-visible{outline-color:#fff;outline-offset:-3px}
body.app-v2 .nav button:hover:not(.active){background:var(--accent-soft);color:var(--action)}
body.app-v2 button:focus-visible,body.app-v2 input:focus-visible,body.app-v2 select:focus-visible,body.app-v2 textarea:focus-visible{outline-color:var(--accent-strong)}
body.app-v2 .shell{padding-bottom:118px}
body.app-v2.welcome-active .shell{padding-bottom:28px}
body:not(.is-signed-in) .nav,.nav[hidden],.guest-home-back[hidden]{display:none!important}
body.app-v2:not(.is-signed-in) .shell{padding-bottom:28px}
.guest-home-back{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 0;margin:0 0 5px;background:transparent;border:0;color:var(--ink);font:600 13px var(--font-ui)}
/* The admin panel uses the same palette while keeping its own layout. */
#workspace>nav{background:var(--surface);border-radius:0 0 18px 18px}
#workspace>nav button{color:var(--nav-ink);border-color:transparent}
#workspace>nav button.selected{background:var(--nav-active);color:var(--ink)}
@media(max-width:360px){body.app-v2 .nav{width:calc(100% - 16px);padding:6px;gap:2px;border-radius:20px}body.app-v2 .nav button{font-size:10px;min-height:54px;border-radius:13px}}
@media(prefers-reduced-motion:no-preference){body.app-v2 .nav button{transition:background-color .15s ease,color .15s ease}}

body.app-v2 .trial-badge,body.app-v2 .entry-section-head>span{background:var(--nav-active);color:var(--ink)}
#workspace .primary,body>.access .button{background:var(--action);border-color:var(--action);color:var(--action-ink)}