.food-page .sr-only, .food-form .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.food-page > .text-button { margin-bottom: 18px; display: inline-flex; }
.food-date-nav { display: grid; grid-template-columns: 44px minmax(0, 190px) 44px auto; align-items: center; gap: 8px; margin: 12px 0 24px; padding: 0; background: transparent; border: 0; }
.food-date { min-width: 0; }
.food-date-nav > .icon-button { width: 44px; height: 44px; }
.food-date-control { display: flex; position: relative; align-items: center; justify-content: center; height: 44px; min-width: 0; overflow: hidden; border: 1px solid var(--line-strong); background: var(--paper); font-size: var(--text-15); white-space: nowrap; border-color: var(--line); border-radius: var(--radius-l); }
.food-date-control input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; margin: 0; }
.food-date-control:focus-within { outline: 2px solid #244fc7; outline-offset: 2px; }
.food-date-control > span { pointer-events: none; }
.food-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 12px; border-block: 1px solid var(--line); }
.food-summary > div { display: flex; flex-direction: column; }
.food-summary strong { font-variant-numeric: tabular-nums; }
.food-summary small { font-weight: 400; }
.today-nutrition { min-width: 0; padding-top: 4px; border-top: 1px solid var(--line); font-variant-numeric: tabular-nums; margin: 0; position: relative; isolation: isolate; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; column-gap: 8px; }
.today-nutrition h2 { margin: 0; font-size: var(--text-14); font-weight: 600; }
.today-nutrition h2 a { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; color: var(--ink); text-decoration: none; }
.today-nutrition h2 a svg { flex: none; width: 17px; height: 17px; color: var(--muted); }
.today-nutrition h2 a:hover { color: var(--accent); }
.today-nutrition h2 a:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; border-radius: var(--radius-s); }
.today-nutrition-content { min-height: 60px; display: contents; }
.today-nutrition-metrics > div { min-width: 0; border-left: 1px solid var(--line); }
.today-nutrition-metrics > div:first-child { padding-left: 0; border-left: 0; }
.today-nutrition-metrics > div:last-child { padding-right: 0; }
.today-nutrition-metrics dt { line-height: 1.4; }
.today-nutrition-metrics strong { display: block; font-size: clamp(var(--text-18), 5.2vw, var(--text-24)); line-height: 1.2; font-weight: 600; letter-spacing: -.6px; overflow-wrap: anywhere; }
.today-nutrition-metrics small { display: block; margin-top: 3px; color: var(--muted); font-size: var(--text-11); line-height: 1.4; overflow-wrap: anywhere; }
@media (max-width: 650px) { .today-nutrition-metrics > div { padding-inline: 8px; } .today-nutrition-metrics dt { font-size: var(--text-11); } }
.ng-summary { margin: 0 0 24px; font-variant-numeric: tabular-nums; }
.ng-summary > header { align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.ng-coach-label { font-size: var(--text-11); border-radius: var(--radius-xl); white-space: nowrap; }
.ng-energy { display: flex; justify-content: space-between; align-items: baseline; gap: 8px 16px; flex-wrap: wrap; margin-bottom: 10px; }
.ng-energy strong { line-height: 1.2; letter-spacing: -.7px; }
.ng-energy > small { font-size: var(--text-12); }
.ng-track { overflow: hidden; border-radius: var(--radius-l); }
.ng-track > span { display: block; height: 100%; border-radius: inherit; }
.ng-protein { --ng-color: #5776ad; }
.ng-fat { --ng-color: #849467; }
.ng-carbs { --ng-color: #ba9466; }
.ng-macros { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ng-macro { min-width: 0; }
.ng-macro-label { display: block; }
.ng-macro-value { display: flex; align-items: baseline; column-gap: 3px; row-gap: 2px; }
.ng-macro-value strong { line-height: 1.2; font-weight: 600; }
.ng-macro-value > span { white-space: nowrap; }
.ng-macro > small { font-size: var(--text-10); line-height: 1.5; margin-top: 7px; }
.ng-macro > small > span:last-child { white-space: nowrap; }
.ng-coach { padding: 4px 0; }
.ng-coach-heading { margin-bottom: 22px; }
.ng-coach-heading h3 { margin: 0 0 8px; font-size: var(--text-20); font-weight: 600; letter-spacing: -.3px; }
.ng-coach-heading p { margin: 0; font-size: var(--text-13); color: var(--muted); line-height: 1.5; }
.ng-goal-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ng-goal-field { display: block; min-width: 0; }
.ng-goal-field > span:first-child { display: block; margin-bottom: 8px; font-size: var(--text-12); color: #58616d; }
.ng-goal-input { position: relative; display: block; }
.ng-goal-input .form-input { margin: 0; width: 100%; min-width: 0; height: 50px; padding: 10px 24px 10px 11px; font-size: var(--text-18); border-radius: var(--radius-l); font-variant-numeric: tabular-nums; }
.ng-goal-input > span { position: absolute; right: 11px; top: 50%; transform: translateY(-50%); font-size: var(--text-12); color: var(--muted); pointer-events: none; }
.ng-calorie-preview { margin: 18px 0 0; padding: 15px 0; display: flex; align-items: center; justify-content: space-between; gap: 10px; border-top: 1px solid var(--fill); border-bottom: 1px solid var(--fill); }
.ng-calorie-preview > span { font-size: var(--text-13); color: #63705b; }
.ng-calorie-preview strong { font-size: var(--text-20); font-weight: 600; font-variant-numeric: tabular-nums; }
.ng-calorie-preview small { font-size: var(--text-12); color: #63705b; font-weight: 400; }
.ng-start-note { margin: 14px 0 22px; color: var(--muted); font-size: var(--text-12); line-height: 1.6; }
.ng-goal-form [hidden] { display: none !important; }
.ng-goal-form .food-error { margin: 12px 0; }
.ng-saved { color: #456338; font-size: var(--text-13); margin: 12px 0; }
.ng-remove { display: flex; margin: 10px auto 0; min-height: 44px; color: var(--muted); }
.ng-remove-confirm { border-top: 1px solid var(--fill); padding-top: 12px; margin-top: 8px; }
.ng-remove-confirm p { margin: 0 0 12px; font-size: var(--text-13); }
.ng-remove-confirm > div { display: flex; gap: 8px; }
.account-tabs:has([data-account-id="nutrition"]) { display: grid; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(max-content, 1fr); }
@media (max-width: 420px) {
  .ng-summary { padding: 16px; }
  .ng-macros { gap: 10px; margin-top: 17px; }
  .ng-energy strong { font-size: var(--text-24); }
  .ng-macro-value strong { font-size: var(--text-18); }
  .ng-goal-fields { gap: 8px; }
  .ng-goal-input .form-input { font-size: var(--text-16); padding-left: 9px; padding-right: 21px; }
  .ng-goal-input > span { right: 9px; }
  .account-tabs:has([data-account-id="nutrition"]) > button { padding-left: 4px; padding-right: 4px; }
}
@media (max-width: 360px) {
  .ng-macro-value { flex-direction: column; align-items: flex-start; gap: 4px; }
  .ng-macro > small { display: flex; flex-direction: column; gap: 1px; }
  .account-tabs:has([data-account-id="nutrition"]) > button { padding-left: 2px; padding-right: 2px; font-size: var(--text-12); }
}
.food-empty { text-align: center; border: 1px dashed #d8ddcf; margin-bottom: 22px; }
.food-empty-mark { display: inline-grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; font-size: var(--text-24); margin-bottom: 16px; }
.food-empty h2 { font-size: var(--text-20); margin: 0 0 12px; }
.food-empty p { color: #67705f; line-height: 1.65; margin: 0 0 24px; }
.food-meal { margin-bottom: 14px; margin: 0; border-bottom: 1px solid var(--line); padding: 20px 24px; margin-top: 18px; }
.food-meal > header { display: flex; align-items: center; gap: 10px; }
.food-meal > header > span { margin-left: auto; }
.food-meal .food-entry { margin: 10px 0 0; }
.food-meal .icon-button { flex: 0 0 40px; font-size: var(--text-24); color: #244fc7; }
.food-meal h2 { margin: 0; }
.food-entry, .food-result { width: 100%; display: flex; gap: 12px; justify-content: space-between; align-items: center; text-align: left; background: var(--paper); color: inherit; border: 1px solid var(--done); border-radius: var(--radius-l); cursor: pointer; margin-bottom: 8px; font: inherit; }
.food-entry > span, .food-result > span:first-child { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.food-entry strong, .food-result strong { overflow-wrap: anywhere; }
.food-entry small, .food-result small { color: #66705f; line-height: 1.5; }
.food-entry > svg { flex: 0 0 18px; width: 18px; height: 18px; }
.food-entry:hover, .food-result:hover { background: var(--done); border-color: #b9c9a5; }
.food-note, .food-attribution { font-size: var(--text-12); line-height: 1.65; color: #65705e; }
.food-attribution { font-size: var(--text-11); }
.food-attribution a { color: inherit; text-decoration: underline; }
.food-entry-page { max-width: 640px; margin: 0 auto; padding-bottom: 120px; }
.food-back { display: inline-flex; margin-bottom: 18px; min-height: 36px; align-items: center; }
.food-entry-heading h1 { margin: 0; line-height: 1.25; letter-spacing: -.7px; }
.food-meal-label { margin: 8px 0 0; font-size: var(--text-15); color: #65705e; }
.food-form { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.food-form > * { flex-shrink: 0; }
.food-form [hidden] { display: none !important; }
.food-photo-only .food-editor { display: none; }
.food-form #food-items:empty, .food-form #food-save-total:empty, .food-form #food-mode:empty, .food-form #food-delete-confirm:empty { display: none; }
.food-form .form-field { margin: 0; min-width: 0; }
.food-form .form-input { width: 100%; min-width: 0; }
.food-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; padding: 4px; border-radius: var(--radius-l); background: var(--surface); }
.food-tabs .button { justify-content: center; padding: 9px 8px; border: 0; border-radius: var(--radius-m); }
.food-tabs [aria-pressed="true"] { background: var(--paper); color: #244fc7; box-shadow: 0 1px 4px #162f5910; }
.food-search { display: flex; gap: 8px; margin-top: 4px; }
.food-search .form-input { min-width: 0; border-radius: var(--radius-l); }
.food-sources { display: grid; grid-template-columns: 1fr 1fr; margin: 8px 0 16px; border-bottom: 1px solid var(--done); }
.food-sources button { min-height: 44px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: #65705e; padding: 10px 8px; font: inherit; font-size: var(--text-14); cursor: pointer; }
.food-sources [aria-pressed="true"] { color: #244fc7; border-bottom-color: #244fc7; font-weight: 600; }
.food-results { max-height: none; overflow: visible; }
.food-result { margin: 0; padding: 12px 2px; border: 0; border-bottom: 1px solid var(--fill); border-radius: 0; gap: 12px; }
.food-result:hover { background: var(--surface); }
.food-result > span:last-child { flex: 0 0 30px; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: var(--tint); color: #244fc7; font-size: var(--text-18); }
.food-result strong { font-size: var(--text-14); font-weight: 500; }
.food-result small { font-size: var(--text-11); color: #7a818b; }
.food-items-heading { display: flex; align-items: center; justify-content: space-between; margin: 4px 0 2px; font-size: var(--text-12); color: #7a818b; }
.food-item { display: flex; align-items: center; gap: 10px; width: 100%; margin: 0; padding: 14px 0; min-height: 72px; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; color: inherit; text-align: left; font: inherit; cursor: pointer; }
.food-item:hover { background: var(--surface); }
.food-item-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.food-item-name { font-size: var(--text-14); line-height: 1.4; font-weight: 550; overflow-wrap: anywhere; }
.food-item-macros { font-size: var(--text-11); line-height: 1.5; color: var(--muted); font-variant-numeric: tabular-nums; }
.food-item-amount { flex-shrink: 0; color: #244fc7; font-size: var(--text-13); font-weight: 500; white-space: nowrap; }
.food-item > svg { flex: 0 0 14px; width: 14px; height: 14px; color: #a4acb7; }
.food-save-bar { position: fixed; z-index: 9; bottom: 20px; left: 50%; transform: translateX(-50%); width: min(640px, calc(100% - 40px)); padding: 12px 16px; border: 1px solid var(--line); border-radius: var(--radius-l); box-shadow: 0 4px 24px #182c4810; background: var(--paper); }
.food-save-bar .food-save-total { margin-bottom: 9px; font-size: var(--text-12); font-weight: 500; color: var(--muted); text-align: center; }
.food-save-bar .button { min-height: 44px; border-radius: var(--radius-l); }
.food-portion-page { padding-bottom: 24px; }
.food-portion-page .food-entry-heading h1 { font-size: var(--text-24); line-height: 1.35; margin-top: 7px; overflow-wrap: anywhere; }
.food-portion-page .food-meal-label { margin: 0; font-size: var(--text-13); }
.food-portion-form { gap: 20px; }
.food-amount-heading { display: flex; align-items: center; justify-content: space-between; font-size: var(--text-14); }
.food-unit-switch { display: flex; padding: 3px; background: var(--surface); border-radius: var(--radius-l); }
.food-unit-switch button { min-width: 56px; min-height: 38px; border: 0; border-radius: var(--radius-m); background: transparent; color: var(--muted); font: inherit; cursor: pointer; }
.food-unit-switch [aria-pressed="true"] { color: #244fc7; background: var(--paper); box-shadow: 0 1px 4px #162f5910; }
.food-amount-control { display: grid; grid-template-columns: 48px minmax(0, 1fr) 48px; gap: 12px; align-items: center; }
.food-amount-control .icon-button { width: 48px; height: 48px; background: var(--surface); border: 0; border-radius: var(--radius-l); color: #244fc7; font-size: var(--text-24); }
.food-amount-control .form-input { height: 60px; font-size: var(--text-28); text-align: center; border-color: var(--line); border-radius: var(--radius-l); font-variant-numeric: tabular-nums; }
.food-piece-weight { display: grid; grid-template-columns: 1fr auto; gap: 6px 16px; align-items: center; font-size: var(--text-13); color: var(--muted); }
.food-piece-weight > div { display: flex; align-items: center; gap: 8px; }
.food-piece-weight .form-input { width: 82px; min-height: 42px; text-align: center; border-color: var(--line); border-radius: var(--radius-l); }
.food-piece-weight small { grid-column: 1 / -1; font-size: var(--text-11); color: #8b939e; }
.food-portion-total { padding: 16px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.food-portion-equivalent { display: block; margin-bottom: 14px; font-size: var(--text-12); color: var(--muted); }
.food-portion-total > div { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.food-portion-total > div > span { display: flex; flex-direction: column; gap: 6px; }
.food-portion-total strong { font-size: var(--text-20); font-weight: 550; font-variant-numeric: tabular-nums; }
.food-portion-total small { font-size: var(--text-11); color: var(--muted); }
.food-nutrient-editor { font-size: var(--text-13); }
.food-nutrient-editor > summary { cursor: pointer; min-height: 44px; padding: 12px 0; color: var(--muted); }
.food-nutrient-editor[open] > summary { margin-bottom: 12px; }
.food-nutrient-editor > .food-note { margin: 20px 0 10px; }
.food-macros { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.food-macros .form-label { font-size: var(--text-12); }
.food-macros input { padding-inline: 8px; }
.food-remove-product { color: #a24e4e; align-self: center; min-height: 44px; }
.food-photo { display: grid; place-items: center; gap: 8px; padding: 26px 0 24px; }
.food-photo > .button { min-width: 180px; min-height: 56px; font-size: var(--text-18); }
.food-photo > .food-gallery { min-height: 44px; font-size: var(--text-14); }
.food-photo.has-photos { padding-top: 8px; }
.food-photo-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; width: 100%; }
.food-photo-thumb { position: relative; aspect-ratio: 1; margin: 0; background: var(--surface); border-radius: var(--radius-l); overflow: hidden; }
.food-photo-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.food-photo-open { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
.food-photo-open > span { position: absolute; bottom: 5px; left: 5px; min-width: 20px; padding: 2px 5px; border-radius: var(--radius-s); background: #172431b3; color: var(--paper); font-size: var(--text-11); text-align: center; }
.food-photo-thumb .icon-button { position: absolute; top: 0; right: 0; width: 44px; height: 44px; border: 0; border-radius: 0 var(--radius-l) 0 var(--radius-l); color: var(--paper); background: #172431a6; }
.food-photo-thumb .icon-button svg { width: 18px; height: 18px; }
.food-photo-count { justify-self: start; color: #818894; font-size: var(--text-12); margin: 1px 0 8px; }
.food-photo.has-photos > .food-camera-button { min-height: 44px; font-size: var(--text-15); background: var(--tint); color: var(--accent); border-color: transparent; }
.food-photo-comment { display: grid; gap: 9px; width: 100%; margin-top: 16px; font-size: var(--text-14); }
.food-photo-comment small { margin-left: 5px; color: #818894; font-size: var(--text-12); }
.food-photo-comment textarea { width: 100%; min-width: 0; min-height: 88px; max-height: 320px; resize: vertical; font-family: inherit; font-size: var(--text-16); line-height: 1.5; border-color: var(--line); border-radius: var(--radius-l); padding: 11px 12px; }
.food-photo-comment textarea::placeholder { color: #9198a3; }
.food-photo > .food-analyze-button { width: 100%; min-height: 48px; font-size: var(--text-16); margin-top: 16px; }
.food-history-components { display: grid; gap: 3px; }
.food-menu-reference { color: var(--muted); font-size: var(--text-12); line-height: 1.5; margin: -6px 0 0; }
.food-photo-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.food-file { display: none; }
.food-gallery { display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.food-gallery[aria-disabled="true"] { opacity: .5; cursor: default; }
.food-gallery:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
#food-photo-viewer { position: fixed; inset: 0; width: 100%; height: 100dvh; max-width: none; max-height: none; margin: 0; border: 0; border-radius: 0; background: #12151b; color: var(--paper); padding: max(12px, env(safe-area-inset-top)) 12px max(12px, env(safe-area-inset-bottom)); }
#food-photo-viewer[open] { display: flex; flex-direction: column; gap: 12px; }
#food-photo-viewer::backdrop { background: #12151b; }
#food-photo-viewer header, #food-photo-viewer nav { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-shrink: 0; min-height: 48px; padding: 0 4px; font-size: var(--text-14); }
#food-photo-viewer .icon-button { width: 48px; height: 48px; border: 0; border-radius: var(--radius-l); color: var(--paper); background: #ffffff14; }
#food-photo-viewer .icon-button svg { width: 22px; height: 22px; }
.food-photo-full { flex: 1; min-height: 0; display: grid; place-items: center; overflow: auto; }
.food-photo-full img { display: block; width: 100%; height: 100%; min-height: 0; object-fit: contain; }
.food-photo-preview { display: block; max-width: 100%; max-height: 230px; object-fit: contain; border-radius: var(--radius-l); margin: 12px auto; }
.food-photo [data-food="analyze"] { margin-top: 12px; }
.food-estimate { font-size: var(--text-12); color: #65705e; margin: 0; }
.food-error { font-size: var(--text-13); line-height: 1.6; color: var(--danger); }
.food-error[hidden] { display: none; }
.food-save-total { font-size: var(--text-14); font-weight: 600; line-height: 1.65; }
.food-bottom-actions { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; }
.food-bottom-actions button { min-height: 44px; }
@media (max-width: 480px) {
  .app-header { padding-top: env(safe-area-inset-top, 0px); }
  .food-form input, .food-form select { font-size: var(--text-16); }
  .food-summary { padding: 18px 12px; gap: 8px; }
  .food-summary strong { font-size: var(--text-20); }
  .food-summary span { font-size: var(--text-11); }
  .food-page .page-heading { align-items: stretch; }
  .food-page .page-heading > .button { align-self: flex-start; }
  .food-date-nav { grid-template-columns: 40px minmax(0, 1fr) 40px auto; gap: 5px; }
  .food-date-nav > .icon-button { width: 40px; }
  .food-date-nav > .text-button { font-size: var(--text-12); }
  .food-date-control { font-size: var(--text-14); }
  .food-macros { grid-template-columns: repeat(2, 1fr); }
  .food-tabs .button { font-size: var(--text-13); }
}

@media (max-width: 650px) {
  .food-save-bar { bottom: calc(65px + env(safe-area-inset-bottom)); width: 100%; border-radius: 0; border-left: 0; border-right: 0; box-shadow: 0 -3px 18px #182c4808; padding: 10px 20px; }
  .food-amount-control .form-input { font-size: var(--text-28); }
}

.food-dish-page .food-entry-heading { margin-bottom: 18px; }
.food-dish-page .food-portion-total { margin-top: 4px; }
.food-ingredient-row { display: grid; border-bottom: 1px solid var(--line); align-items: center; }
.food-ingredient-row .food-item { border: 0; gap: 8px; }
.food-ingredient-row .food-item-amount { font-size: var(--text-12); }
.food-replace { font-size: var(--text-12); min-height: 44px; padding: 8px 0 8px 4px; }
.food-replace-link { align-self: flex-start; min-height: 36px; }
.food-add-ingredient { min-height: 48px; margin-top: 8px; font-size: var(--text-14); }
.food-ingredient-search { padding-bottom: 24px; }
.food-ingredient-search .food-entry-heading h1 { font-size: var(--text-24); }

.food-calendar { border-top: 1px solid var(--line); margin-top: 22px; padding-top: 18px; min-width: 0; }
.food-calendar > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.food-calendar h3 { font-size: var(--text-18); margin: 0; }
.food-calendar > header .text-button { min-height: 44px; font-size: var(--text-13); }
.food-calendar-total { margin: 4px 0 16px; color: var(--muted); font-size: var(--text-13); line-height: 1.6; }
.food-calendar-meal + .food-calendar-meal { margin-top: 16px; }
.food-calendar h4 { margin: 0 0 4px; font-size: var(--text-12); font-weight: 500; color: #7a8490; }
.food-calendar-entry { display: flex; align-items: center; gap: 12px; justify-content: space-between; padding: 10px 0; min-height: 48px; color: inherit; text-decoration: none; border-bottom: 1px solid var(--fill); }
.food-calendar-entry > span { min-width: 0; }
.food-calendar-entry strong { display: block; font-size: var(--text-14); line-height: 1.45; font-weight: 600; overflow-wrap: anywhere; }
.food-calendar-entry small { display: block; color: #7a8490; font-size: var(--text-12); line-height: 1.5; margin-top: 4px; }
.food-calendar-entry > svg { width: 16px; height: 16px; flex-shrink: 0; color: #8993a0; }
.food-calendar-entry:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; border-radius: var(--radius-m); }

.food-barcode-button { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 48px; margin: 0 0 16px; border-color: var(--line-strong); color: #2856b4; background: var(--surface); }
.food-barcode-button svg { width: 22px; height: 22px; }
.food-entry-row, .food-item-row { display: grid; grid-template-columns: minmax(0,1fr) 44px; gap: 4px; align-items: center; }
.food-entry-row .food-entry { width: 100%; min-width: 0; padding: 12px; }
.food-item-row { border-bottom: 1px solid var(--line); }
.food-item-row .food-item { border: 0; min-width: 0; }
.food-row-delete { display: grid; place-items: center; width: 44px; height: 44px; padding: 10px; border: 0; border-radius: var(--radius-l); background: transparent; cursor: pointer; color: var(--muted); min-width: 44px; min-height: 44px; }
.food-row-delete:hover, .food-row-delete:active { background: var(--surface); }
.food-row-delete:focus-visible { outline: 3px solid var(--focus); }
.food-row-delete:disabled { opacity: .35; }
.food-row-delete svg { width: 20px; height: 20px; }
.food-ingredient-row { grid-template-columns: minmax(0,1fr) auto 44px; column-gap: 4px; }
.food-ingredient-row .food-item { flex-wrap: wrap; }
.food-ingredient-row .food-item-main { flex-basis: 100%; }
.food-undo { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 8px 0; padding: 4px 12px; border-radius: var(--radius-l); background: var(--surface); font-size: var(--text-13); }
.food-undo button { min-height: 44px; }
#food-barcode { position: fixed; inset: 0; width: 100%; max-width: none; height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0; border-radius: 0; color: var(--ink); background: var(--paper); overflow: auto; overscroll-behavior: contain; }
#food-barcode::backdrop { background: var(--paper); }
.barcode-page { max-width: 540px; margin: auto; padding: max(16px,env(safe-area-inset-top)) 20px max(32px,env(safe-area-inset-bottom)); }
.barcode-page header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.barcode-page h1 { margin: 0; font-size: var(--text-24); }
.barcode-page h2 { font-size: var(--text-20); line-height: 1.4; overflow-wrap: anywhere; }
.barcode-page video { display: block; width: 100%; height: 210px; object-fit: cover; border-radius: var(--radius-l); background: var(--ink); }
.barcode-page video[hidden] { display: none; }
.barcode-camera-actions { display: flex; flex-direction: column; align-items: stretch; gap: 4px; margin: 12px 0 20px; }
.barcode-image { align-self: center; padding: 12px; cursor: pointer; }
.barcode-page input, .barcode-page select { font-size: var(--text-16); min-width: 0; }
.barcode-page form { display: grid; gap: 14px; }
.barcode-page .food-note { margin: 8px 0; }
.barcode-amount { display: grid; grid-template-columns: minmax(0,1fr) 90px; gap: 8px; }
.barcode-source { display: block; font-size: var(--text-12); line-height: 1.6; color: #7a8490; margin: 12px 0; }
.barcode-source a { color: inherit; }

.food-eva-edit { display: grid; gap: 12px; margin: 0 0 16px; border: 1px solid var(--line); }
.food-eva-edit header { display: flex; align-items: baseline; gap: 10px; }
.food-eva-edit header strong { color: #315dc4; font-size: var(--text-16); }
.food-eva-edit header span { color: var(--muted); font-size: var(--text-13); }
.food-eva-context { font-size: var(--text-13); line-height: 1.5; color: var(--muted); margin: 0; overflow-wrap: anywhere; }
.food-eva-edit .form-field { margin: 0; }
.food-eva-edit textarea { width: 100%; min-width: 0; min-height: 76px; font: inherit; font-size: var(--text-16); line-height: 1.5; resize: vertical; }
.food-eva-edit .button { min-height: 44px; }
.food-eva-status { margin: 0; font-size: var(--text-13); line-height: 1.5; color: #465b75; overflow-wrap: anywhere; }
.food-eva-status[hidden] { display: none; }
.food-eva-add { margin-bottom: 12px; min-height: 44px; }
.food-eva-proposal { display: grid; gap: 12px; min-width: 0; }
.food-eva-proposal h2 { font-size: var(--text-18); line-height: 1.35; margin: 0; }
.food-eva-portion { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; margin: 0; font-size: var(--text-18); color: var(--muted); }
.food-eva-portion strong { color: #254fbb; }
.food-eva-comparison { width: 100%; border-collapse: collapse; font-size: var(--text-14); font-variant-numeric: tabular-nums; }
.food-eva-comparison th, .food-eva-comparison td { padding: 5px 0; text-align: right; }
.food-eva-comparison th:first-child { text-align: left; font-weight: 400; }
.food-eva-comparison thead { color: var(--muted); font-size: var(--text-12); }
.food-eva-comparison thead th { font-weight: 400; padding-bottom: 7px; }
.food-eva-comparison tbody td:last-child { font-weight: 600; color: #254fbb; }
.food-eva-actions { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
.food-eva-actions .button { min-width: 0; padding-inline: 8px; }

.food-history-choices{display:grid;gap:8px;margin-top:8px}.food-history-choices>p{margin:0 0 4px;font-weight:600}.food-history-choice{display:grid;gap:5px;width:100%;min-width:0;padding:14px 16px;text-align:left;border:1px solid var(--border,var(--line));border-radius:var(--radius-l);background:var(--surface,var(--paper));color:inherit;font:inherit;cursor:pointer}.food-history-choice strong{font-size:var(--text-15);overflow-wrap:anywhere}.food-history-choice span{font-size:var(--text-13);color:var(--muted,#68706a);line-height:1.45}.food-history-choice:focus-visible{outline:2px solid var(--primary,#2d50bb);outline-offset:2px}.food-history-choice:disabled{opacity:.55;cursor:wait}

/* EVA: one capture flow and an explicit choice before a recommendation is eaten. */
.food-eva-purpose { display:flex; gap:6px; margin:0 0 12px; padding:4px; border:1px solid var(--line); border-radius:var(--radius-l); }
.food-eva-purpose button { flex:1; min-width:0; min-height:42px; border:0; border-radius:var(--radius-m); background:transparent; color:var(--muted); font:inherit; font-size:var(--text-14); cursor:pointer; }
.food-eva-purpose button[aria-pressed="true"] { background:var(--tint); color:#254fbb; font-weight:600; }
.food-eva-purpose button:disabled { opacity:.6; cursor:wait; }
.food-advisor-hint { margin:0 0 12px; color:var(--muted); font-size:var(--text-14); line-height:1.5; }
.food-recommendations { display:grid; gap:12px; width:100%; text-align:left; }
.food-recommendations > p { margin:4px 0 0; line-height:1.5; }
.food-advisor-balance { display:block; color:var(--muted); line-height:1.5; }
.food-recommendation { display:grid; gap:8px; padding:16px; border:1px solid var(--line); border-radius:var(--radius-l); background:var(--paper); min-width:0; overflow-wrap:anywhere; }
.food-recommendation h3 { margin:0; font-size:var(--text-16); line-height:1.4; }
.food-recommendation > span, .food-recommendation small { color:var(--muted); font-size:var(--text-13); line-height:1.5; }
.food-recommendation p { margin:0 0 4px; font-size:var(--text-14); line-height:1.5; }
.food-recommendation .button { width:100%; min-height:44px; }
.food-unified-camera video { height:min(48dvh,420px); object-fit:contain; }
.food-unified-camera .barcode-page h1 { font-size:var(--text-20); }
.food-unified-camera [data-food-shutter] { min-height:52px; }
.food-barcode-manual { margin:16px 0; }
.food-barcode-manual summary { min-height:44px; padding:12px 0; font-size:var(--text-14); color:#2856b4; cursor:pointer; }
.food-barcode-manual form { margin-top:8px; }