/* The counter in the mountain hut: a focused food selection sheet. */
.nutrition-feature #sheet:has(.meal-picker) { padding:0; width:min(640px,100%); max-height:calc(var(--app-viewport-height,100dvh) - 24px); background:#10232b; border:1px solid #b9a48266; border-bottom:0; border-radius:24px 24px 0 0; scrollbar-width:thin; scrollbar-color:#6d756b #10232b; }
.meal-picker { color:#eee3cf; }
.meal-picker-hero { position:relative; display:flex; align-items:flex-end; min-height:182px; padding:28px 22px 22px; background:linear-gradient(90deg,#081a23d9 0%,#081a2366 60%,#081a2311),linear-gradient(0deg,#10232b,transparent 55%),url('assets/meal-counter-v1.webp') center 54%/cover; }
.nutrition-feature .meal-picker-intro p { margin:0 0 11px; color:#d5bb94; font:8px system-ui; letter-spacing:.16em; }
.nutrition-feature .meal-picker h2 { margin:0 0 9px; font:34px/1.05 Georgia,serif; color:#f6eddd; letter-spacing:-.025em; text-transform:none; outline:none; }
.meal-picker-intro > span { color:#c7d0c9; font:11px system-ui; }
.meal-picker-close { position:absolute; top:14px; right:14px; display:grid; place-items:center; width:38px; height:38px; padding:9px; border:1px solid #d0b99155; border-radius:50%; background:#10222ad9; color:#e4d0ae; }
.meal-picker svg { display:block; width:22px; height:22px; flex-shrink:0; }
.meal-picker-body { padding:0 20px calc(20px + env(safe-area-inset-bottom)); }
.meal-picker-search { display:block; margin:0 0 14px; }
.meal-search-label { display:block; font:10px system-ui; color:#b6c2bc; margin-bottom:8px; }
.meal-search-input { position:relative; display:block; }
.meal-search-input > svg { position:absolute; left:13px; top:15px; width:20px; height:20px; color:#cdb48d; pointer-events:none; }
.nutrition-feature .meal-picker #foodSearch { width:100%; min-height:50px; margin:0; padding:12px 10px 12px 42px; border:1px solid #8f9a885c; border-radius:10px; background:#0b1c24; color:#f0e6d4; font:16px system-ui; box-shadow:none; }
.nutrition-feature .meal-picker #foodSearch::placeholder { color:#809797; font-size:13px; }
.meal-picker-tools { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-bottom:19px; }
.meal-picker-tools button { display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start; min-width:0; min-height:91px; padding:12px 10px; border:1px solid #b7a17e33; border-radius:10px; background:linear-gradient(140deg,#233b3e,#1a3036); text-align:left; color:#eddfc5; }
.meal-picker-tools button svg { width:21px; height:21px; color:#d8b987; margin-bottom:10px; }
.meal-picker-tools strong { font:11px system-ui; font-weight:600; }
.meal-picker-tools small { display:block; margin-top:4px; font:8px/1.35 system-ui; color:#9eb2ac; }
.meal-picker-filters { display:flex; gap:7px; overflow:auto; padding:0 0 10px; scrollbar-width:none; }
.meal-picker-filters button { flex-shrink:0; border:1px solid #8e9d9033; border-radius:20px; padding:8px 12px; background:transparent; color:#b6c6c0; font:11px system-ui; min-height:36px; }
.meal-picker-filters button[aria-pressed=true] { border-color:#d2b588; color:#16282c; background:#d5bc96; }
.nutrition-feature .meal-picker .meal-result-status { margin:0; font:10px system-ui; color:#aabdb6; }
.meal-result-status:empty { display:none; }
.meal-food-group { margin:15px 0 23px; }
.meal-group-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0 0 10px; }
.nutrition-feature .meal-picker h3 { margin:0; font:21px/1.2 Georgia,serif; font-weight:400; letter-spacing:-.015em; color:#eee1ca; }
.meal-group-heading > button { flex-shrink:0; border:0; padding:8px 0 8px 8px; background:none; font:10px system-ui; color:#d6b78c; }
.meal-group-heading > button > span { margin-left:4px; color:#9cafaa; }
.nutrition-feature .meal-picker .meal-group-note { margin:-4px 0 10px; color:#8ca5a0; font:9px/1.4 system-ui; }
.nutrition-feature .meal-picker .meal-food-row { display:flex; align-items:center; width:100%; gap:11px; margin:0 0 7px; padding:11px; min-height:66px; border:1px solid #8c9d8f26; border-radius:10px; background:#19313a99; text-align:left; color:#ede3cf; }
.meal-food-icon { display:grid; place-items:center; width:39px; height:43px; border:1px solid #bea77d22; border-radius:9px; flex-shrink:0; background:#b7a0790d; color:#c7b28e; }
.meal-food-copy { flex:1; min-width:0; }
.nutrition-feature .meal-picker .meal-food-row strong { display:block; margin:0; font:12px/1.4 system-ui; font-weight:500; overflow-wrap:anywhere; }
.nutrition-feature .meal-picker .meal-food-row small { display:block; margin-top:5px; font:10px/1.4 system-ui; color:#9fb3ad; }
.meal-food-arrow svg { width:14px; height:14px; color:#8fa29b; }
.nutrition-feature .meal-picker .meal-food-empty { padding:20px 14px; border:1px dashed #a58f6c66; border-radius:10px; background:#102129; color:#a9bab2; font:12px/1.6 system-ui; }
.nutrition-feature .meal-picker .meal-food-empty p { margin:8px 0 0; font:12px/1.6 system-ui; }
.meal-picker-done { width:100%; min-height:44px; margin:0; padding:10px; border:1px solid #b7a17e33; border-radius:10px; background:transparent; color:#c8b99f; font:12px system-ui; }
.meal-picker button:focus-visible,.meal-picker input:focus-visible { outline:2px solid #f0c68a; outline-offset:2px; }
@media(max-width:359px) { .meal-picker-body { padding-left:14px; padding-right:14px; } .meal-picker-hero { padding-left:16px; min-height:160px; } .nutrition-feature .meal-picker h2 { font-size:30px; } .meal-picker-tools { gap:6px; } .meal-picker-tools button { padding:10px 8px; } .meal-picker-tools strong { font-size:10px; } }
@media(max-height:650px) { .meal-picker-hero { min-height:145px; } }
:root[data-keyboard-open=true] .meal-picker-hero { min-height:108px; padding-top:20px; padding-bottom:16px; }

/* Provisions: scanner, product review and quantities share the hut's materials. */
.nutrition-feature #sheet.provision-sheet { width:min(620px,100%); padding:0 22px calc(24px + env(safe-area-inset-bottom)); background:#10232b; color:#eee3cf; border:1px solid #b9a48266; border-radius:24px 24px 0 0; scrollbar-width:thin; scrollbar-color:#6d756b #10232b; }
.provision-header { position:relative; margin:0 -22px 22px; padding:28px 22px 24px; min-height:166px; background:linear-gradient(90deg,#081a23ed,#081a2380),linear-gradient(0deg,#10232b,transparent),url('assets/meal-counter-v1.webp') center 48%/cover; border-radius:24px 24px 0 0; }
.provision-header > svg { float:right; width:39px; height:39px; color:#d6bb8e; margin:0 0 12px 12px; }
.provision-header > span { display:block; color:#d5bb94; font:9px/1.5 system-ui; letter-spacing:.16em; margin-bottom:18px; }
.nutrition-feature .provision-header h2 { margin:0 0 10px; font:34px/1.1 Georgia,serif; color:#f6eddd; letter-spacing:-.025em; text-transform:none; }
.nutrition-feature .provision-header p { font:12px/1.5 system-ui; color:#bac9c2; margin:0; max-width:340px; }
.nutrition-feature .provision-sheet h3 { font:24px/1.25 Georgia,serif; color:#eee1ca; text-transform:none; overflow-wrap:anywhere; }
.nutrition-feature .provision-sheet .entry-field { color:#c8d1c6; font:12px/1.5 system-ui; margin:14px 0; min-width:0; }
.nutrition-feature .provision-sheet input:not([type=checkbox]),.nutrition-feature .provision-sheet select,.nutrition-feature .provision-sheet textarea { box-sizing:border-box; width:100%; min-width:0; min-height:48px; border:1px solid #91a28e55; border-radius:10px; padding:11px 12px; background:#0b1c24; color:#f0e6d4; font:16px/1.4 system-ui; }
.nutrition-feature .provision-sheet .hint { color:#a6bab2; font:12px/1.6 system-ui; }
.nutrition-feature .provision-sheet .btn,.nutrition-feature .provision-sheet .photo-button { min-height:44px; border:1px solid #b7a17e55; border-radius:10px; background:#213a3d; color:#eddfc5; font:12px/1.5 system-ui; padding:11px 14px; }
.nutrition-feature .provision-sheet .btn.solid { background:#d5bc96; color:#16282c; border-color:#d5bc96; font-weight:650; }
.nutrition-feature .provision-sheet .btn:disabled { opacity:.45; }
.nutrition-feature .provision-sheet :is(button,input,select,summary):focus-visible { outline:2px solid #f0c68a; outline-offset:3px; }
.quantity-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.portion-shortcuts { display:flex; gap:8px; margin:0 0 18px; }
.portion-shortcuts button { flex:1; }
.portion-settings { border:1px solid #bea77d44; border-radius:12px; padding:14px; margin:18px 0; background:#182e34; }
.portion-settings summary { cursor:pointer; color:#e2c79f; font:14px/1.5 system-ui; min-height:26px; }
.provision-macros { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; padding:15px; border:1px solid #c4ad7c55; border-radius:14px; background:linear-gradient(135deg,#294039,#19313a); margin:16px 0; }
.provision-macros > div { padding:8px; }
.provision-macros strong { display:block; font:26px/1.2 Georgia,serif; color:#f0dfbf; }
.provision-macros strong small { font:12px system-ui; color:#b8c5b8; }
.provision-macros span { display:block; margin-top:7px; font:11px system-ui; color:#acbfb3; }
.scan-frame { position:relative; border:1px solid #d5bc9677; border-radius:16px; overflow:hidden; background:#091a21; margin-bottom:16px; min-height:170px; }
#scanPlaceholder { padding:24px; text-align:center; color:#b0c2b7; font:13px/1.6 system-ui; }
#scanPlaceholder > span { color:#dfc293; font:50px/1 system-ui; }
#liveBarcode video { display:block; width:100%; }
.nutrition-feature .provision-sheet .scan-status { padding:12px; border-left:2px solid #c6ae86; color:#c8d4c4; background:#1a3036; font:12px/1.6 system-ui; }
.nutrition-feature .provision-sheet .photo-buttons { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.nutrition-feature .provision-sheet .confirm-values { font:12px/1.6 system-ui; color:#c5d0c2; }
@media(max-width:359px) { .nutrition-feature #sheet.provision-sheet { padding-left:16px; padding-right:16px; } .provision-header { margin-left:-16px; margin-right:-16px; padding-left:16px; padding-right:16px; } .nutrition-feature .provision-header h2 { font-size:29px; } .quantity-row { gap:8px; } }
/* Fixed overlay follows the visual viewport independently of the scrolling app. */
.nutrition-feature #ov { position:fixed; inset:auto 0 auto; top:var(--visual-viewport-top,0px); height:var(--app-viewport-height,100dvh); max-height:none; align-items:flex-end; justify-content:center; overflow:hidden; box-sizing:border-box; }
.nutrition-feature #ov #sheet { box-sizing:border-box; max-height:calc(var(--app-viewport-height,100dvh) - 12px); overscroll-behavior:contain; scroll-padding-block:18px; }
:root[data-keyboard-open=true] .nutrition-feature #ov #sheet { height:100%; max-height:100%; border-radius:12px 12px 0 0; padding-bottom:16px; }
:root[data-keyboard-open=true] .provision-header { min-height:0; padding-top:16px; padding-bottom:12px; }
.meal-picker-tools { grid-template-columns:repeat(2,minmax(0,1fr)); }
#nutrition-feature #view-diary .adventure-today {min-height:96px;padding:18px 20px;margin-bottom:16px}
#nutrition-feature #view-diary .adventure-today h2 {font-size:27px;margin:5px 0}
#nutrition-feature #view-diary .adventure-today p {display:none}
#nutrition-feature #view-diary .page-heading {margin:12px 0}
#nutrition-feature #view-diary .page-heading h2 {font-size:27px}
#nutrition-feature #view-diary .diary-actions {margin:12px 0 18px}
#nutrition-feature #view-diary #addFood {width:100%}
#nutrition-feature #view-diary .diary-group {margin-top:12px}
#nutrition-feature #view-diary .diary-date-picker {margin:22px 0;padding:14px;border:1px solid #bea27655;border-radius:9px}
#nutrition-feature #view-diary .diary-date-picker summary {cursor:pointer;color:#e1c08e;min-height:28px}
#nutrition-feature #view-diary #diaryCloudStatus {font-size:12px;padding:10px;margin-bottom:12px}
