.phone .phone-notch{top:10px;left:50%;width:11px;height:11px;min-width:11px;min-height:11px;aspect-ratio:1;border-radius:50%;background:#111;transform:translateX(-50%)}.phone .phone-logo{font-family:var(--sans);font-size:17px;font-weight:700;line-height:1.2;letter-spacing:-.6px;margin:14px 0 23px}.phone-logo>span{color:#15803d}.phone-only-stage{padding-top:0}.phone-only-stage .phone-area{margin-top:0}
.meal-carousel{margin:2px -9px 0}.meal-carousel-track{display:flex;width:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;cursor:grab;border-radius:9px;background:#fff;touch-action:pan-x pan-y}.meal-carousel-track::-webkit-scrollbar{display:none}.meal-slide{flex:0 0 100%;width:100%;min-width:0;scroll-snap-align:start;scroll-snap-stop:always}.meal-slide img{display:block;width:100%;height:auto;max-width:100%;object-fit:contain;filter:none;user-select:none;pointer-events:none}.meal-carousel-track.dragging{cursor:grabbing;scroll-snap-type:none}.meal-carousel-controls{display:flex;align-items:center;justify-content:center;gap:5px;margin:15px 0 0}.meal-carousel-controls .carousel-button{display:grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid #ddd;border-radius:4px;background:#fff;color:#15803d;cursor:pointer;transition:background .2s,transform .2s;flex-shrink:0}.carousel-button>svg{width:15px;height:15px}.meal-carousel-controls .carousel-button:hover{background:#effbf1;transform:translateY(-1px)}.meal-dots{display:flex;gap:0;align-items:center}.meal-dots>button{width:28px;height:40px;display:grid;place-items:center;padding:0;border:0;background:transparent;cursor:pointer}.meal-dots>button>span{display:block;width:8px;height:8px;aspect-ratio:1;border-radius:50%;background:#ddd;transition:background .2s,transform .2s}.meal-dots>button[aria-pressed=true]>span{width:8px;height:8px;background:#15803d;transform:scale(1.15)}.meal-swipe-note{font-size:10px;line-height:1.4;text-align:center;color:#777;margin:9px 0 0}.meal-carousel button:focus-visible,.meal-carousel-track:focus-visible{outline:2px solid #15803d;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.meal-carousel-controls .carousel-button,.meal-dots>button>span{transition:none}}
/* Supplied N+ mark and wordmark; the complete bitmap is retained, framed in CSS. */
.brand{position:relative;display:block;width:100px;height:72px;min-height:72px;overflow:hidden;flex-shrink:0;background:#fff;gap:0}.brand .brand-image{position:absolute;left:-14px;top:-31px;width:128px;height:128px;max-width:none;display:block;filter:invert(1);object-fit:contain}.compact-mark .brand{transform:scale(.8)}.compact-mark{width:100px!important;height:72px!important;display:flex;align-items:center;justify-content:center}.phone .phone-logo{display:flex;justify-content:center;margin:8px 0 18px}.phone .phone-logo .brand{width:100px;height:72px;min-height:72px}.phone .brand:hover{transform:none}
/* The demo retains all three panels and navigation items, fixed on Foto. */
body[data-final="true"] .phone-area{background:#f4f4f4;border-color:#ddd}body[data-final="true"] .phone{background:#fff;color:#111}.phone [hidden]{display:none!important}.phone .app-tabs{border-top:1px solid #ddd;margin-top:16px;padding-top:10px}.phone .app-tab:disabled{cursor:default;opacity:1;transform:none;color:#888}.phone .app-tab[aria-selected="true"]:disabled{color:#111;font-weight:750}.phone .app-tab[aria-selected="true"]{box-shadow:inset 0 -2px #111}.phone .app-tab:hover{transform:none}.phone .app-card,.phone .app-day{background:#fff;color:#111;border-color:#ddd}.phone .app-day.active{background:#111;color:#fff}.phone .meal-carousel-controls .carousel-button{color:#111}.phone .meal-carousel-controls .carousel-button:hover{background:#f3f3f3}.phone .meal-dots>button[aria-pressed="true"]>span{background:#111}.phone .meal-carousel button:focus-visible,.phone .meal-carousel-track:focus-visible{outline-color:#111}.phone .meal-analysis-frame{position:relative}.phone .meal-analysis-image{filter:grayscale(1)}.phone img.meal-food-overlay{position:absolute;left:0;top:0;width:100%;height:auto;filter:none;clip-path:inset(7.95% 4% 53.7% 4% round 8px)}.phone .meal-slide-2 img.meal-food-overlay{clip-path:inset(7.5% 3% 60.4% 3% round 8px)}
/* Neutral glass, with a brown drink in both offer cards. */
.bottle-mark,.bottle-mark.bottle-inverse{--drink-light:#c38b54;--drink-main:#7d4728;--drink-dark:#3a2117;--bottle-glass:#f1f3f5;--bottle-edge:#a9b2ba;--bottle-highlight:#fff;--protein-depth:#a9b2ba;--protein-edge:#596169;--protein-highlight:#fff}.bottle-mark .bottle-wave{stroke:var(--drink-light)}
/* Keep the meal photography in color while rendering the interface badges in monochrome. */
.phone .meal-slide-1 img.meal-food-overlay{clip-path:polygon(evenodd,4% 7.95%,96% 7.95%,96% 46.3%,4% 46.3%,4% 7.95%,6% 9%,6% 14%,29% 14%,29% 9%,6% 9%,4% 7.95%)}.phone .meal-slide-2 img.meal-food-overlay{clip-path:polygon(evenodd,3% 7.5%,97% 7.5%,97% 39.6%,3% 39.6%,3% 7.5%,4% 8.4%,4% 12.6%,41.5% 12.6%,41.5% 8.4%,4% 8.4%,3% 7.5%)}

/* Color accents for the calorie total; original estimates and meal photographs are retained. */
.phone .meal-analysis-frame{container-type:inline-size}
.phone .meal-calorie-total{position:absolute;left:4.15%;top:47.35%;width:91.85%;height:9.95%;display:grid;grid-template-columns:14% minmax(0,1fr) 25%;align-items:center;gap:2%;padding:0 2.2%;border-radius:3.3cqw;background:#f6f6f6;pointer-events:none;user-select:none;font-family:Arial,Helvetica,sans-serif;line-height:1.05;letter-spacing:0}
.phone .meal-slide-2 .meal-calorie-total{left:3.1%;top:40.8%;width:94%;height:10.45%}
.phone .calorie-fire-circle{display:grid;place-items:center;width:100%;aspect-ratio:1;border-radius:50%;background:#ededed;padding:19%}
.phone .calorie-flame{width:100%;height:auto;overflow:visible}
.phone .flame-outer{fill:#ff791f}.phone .flame-inner{fill:#ffc83d}
.phone .calorie-copy{min-width:0;display:grid;gap:1.15cqw}
.phone .calorie-label{color:#606060;font-size:3.1cqw;white-space:nowrap}
.phone .calorie-amount{display:flex;align-items:baseline;gap:1.2cqw;white-space:nowrap}
.phone .calorie-number{color:#dc2626;font-size:8.25cqw;font-weight:800;line-height:.95;letter-spacing:-.3cqw}
.phone .calorie-unit{color:#15803d;font-size:5.25cqw;font-weight:750;line-height:1}
.phone .calorie-complete{display:flex;align-items:center;justify-content:center;gap:1.1cqw;border-radius:10cqw;background:#ebebeb;min-height:8cqw;padding:1.4cqw .8cqw;color:#444;font-size:2.65cqw;font-weight:600;line-height:1.05}
.phone .calorie-complete svg{width:3.7cqw;height:3.7cqw;flex-shrink:0;fill:currentColor}
