.site-food .food-heading { margin-bottom: 36px; }
.site-food .food-heading .calculator-intro { margin: 0 auto; }
.site-food [hidden] { display: none !important; }
.food-toolbar, .food-actions, .food-row-footer { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.food-toolbar { justify-content: space-between; margin: 32px 0; }
.food-tabs { display: flex; flex-wrap: wrap; gap: 8px; padding: 6px; border: 1px solid var(--_color---accent-color--accent-3); border-radius: 28px; }
.food-tabs button { padding: 12px 20px; min-height: 48px; border: 0; border-radius: 24px; font: inherit; color: inherit; background: transparent; cursor: pointer; }
.food-tabs button[aria-selected="true"] { background: var(--_color---accent-color--accent-6); color: var(--_color---accent-color--accent-1); font-weight: 700; }
.food-tabs button:hover { background: var(--_color---accent-color--accent-6); }
.site-food .food-actions .primary-btn { margin: 0; }
.food-notice { padding: 16px 20px; background: var(--_color---accent-color--accent-6); border-radius: 12px; }
.site-food .food-grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
.site-food input, .site-food select, .site-food .currency-trigger { height: 52px; min-height: 52px; }
.site-food input { font-size: 1rem; }
.site-food input[aria-invalid="true"], .site-food select[aria-invalid="true"], .site-food .currency-trigger[aria-invalid="true"] { border-width: 2px; }
.site-food .food-finance-fields { margin-top: 24px; }
.site-food .calculator-fields > .calculator-field { grid-row: span 3; }
.food-ingredient { min-width: 0; margin: 24px 0; padding: 20px; border: 1px solid var(--_color---accent-color--accent-3); border-radius: 16px; }
.food-ingredient legend { padding: 0 8px; font-weight: 700; }
.food-ingredient-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px 16px; }
.food-quantity { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: subgrid; grid-row: span 6; }
.food-quantity > .calculator-field { display: grid; grid-template-rows: subgrid; grid-row: span 3; }
.food-quantity > .calculator-field label, .food-quantity > .calculator-field p { margin: 0; }
.food-ingredient-fields > .calculator-field { display: grid; grid-template-rows: subgrid; grid-row: span 3; }
.food-ingredient-fields > .calculator-field label, .food-ingredient-fields > .calculator-field p { margin: 0; }
.food-row-footer { justify-content: space-between; }
.food-row-footer p { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.food-price-reference { padding: 20px; border-radius: 16px; background: var(--_color---accent-color--accent-6); margin: 24px 0; min-width: 0; display: grid; grid-template-rows: 1fr 10rem; min-height: 32rem; }
.food-price-reference .calculator-result dt { line-height: 1.5; min-height: 4.5em; }
.food-price-reference > p { margin: 0; align-self: start; }
.food-price-reference dl { margin: 0; }
.food-details { margin-top: 24px; }
.food-details summary { padding: 12px 0; cursor: pointer; font-weight: 600; }
.food-details dl { margin-top: 20px; }
.food-scenario { margin-top: 36px; padding: 28px; border: 1px solid var(--_color---accent-color--accent-3); border-radius: 20px; }
.food-scenario-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; align-items: stretch; }
.food-scenario-metrics > dl { margin: 24px 0; }
.food-currency-dialog { width: min(640px, calc(100% - 32px)); max-height: calc(100dvh - 48px); overflow-y: auto; padding: 28px; border: 1px solid var(--_color---accent-color--accent-1); border-radius: 20px; color: var(--_color---text-color--heading-color); background: var(--_color---normal-color--white); }
.food-currency-dialog::backdrop { background: var(--_color---mixed-color--accent-1-5); }
.food-dialog-actions { display: grid; gap: 16px; justify-items: start; margin-top: 24px; }
.food-select-trigger { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.food-select-option { grid-template-columns: minmax(0, 1fr) 20px; overflow-wrap: anywhere; }
.site-food :is(summary, [role="option"]):focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
@media (max-width: 991px) { .site-food .food-grid { grid-template-columns: minmax(0, 1fr); } .food-scenario-metrics { grid-template-columns: minmax(0, 1fr); gap: 0; } }
@media (max-width: 767px) {
  .site-food .food-grid { grid-template-columns: minmax(0, 1fr); }
  .food-toolbar, .food-actions { align-items: stretch; flex-direction: column; }
  .food-tabs { border-radius: 20px; }
  .food-tabs button { flex: 1 1 100%; }
  .food-ingredient-fields { grid-template-columns: minmax(0, 1fr); }
  .food-ingredient, .food-scenario, .food-currency-dialog { padding: 16px; }
  .food-row-footer { align-items: stretch; flex-direction: column; }
  .food-price-reference { min-height: 30rem; }
  .food-scenario-metrics .calculator-result dd { font-size: 1.5rem; }
}