/* Layout follows the available CSS viewport, including Split View and rotation.
   No resize handlers: open editors, focus, and unsaved fields remain mounted. */
:root { --journal-width: 1120px; }
body { padding: 0; }
#app { max-width: var(--journal-width); min-height: 100dvh; border-radius: 0; box-shadow: none; }
#app, #app.is-today-page, #app.is-fridge-page, #app.is-recipes-page {
  padding-left: max(16px, env(safe-area-inset-left));
  padding-right: max(16px, env(safe-area-inset-right));
}
.tabs { max-width: var(--journal-width); padding-left: max(10px, env(safe-area-inset-left)); padding-right: max(10px, env(safe-area-inset-right)); }
.today-overview, .today-diary, [data-app-content] { min-width: 0; }
input, select, textarea, .form-grid > *, .recipe-detail > * { min-width: 0; }
.sheet { width: min(100%, 640px); padding-left: max(20px, env(safe-area-inset-left)); padding-right: max(20px, env(safe-area-inset-right)); }
.sheet input, .sheet select, .sheet textarea { font-size: 16px; }
@media (min-width: 600px) {
  #app, #app.is-today-page, #app.is-fridge-page, #app.is-recipes-page { padding-inline: max(28px, env(safe-area-inset-left)) max(28px, env(safe-area-inset-right)); }
  .today-page { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.15fr); column-gap: 28px; align-items: start; }
  .today-datebar, .today-footer-scene { grid-column: 1 / -1; }
  .today-diary { padding-top: 10px; }
  .today-total { min-height: 220px; }
  .today-total-copy { width: 100%; padding-top: 20px; }
  .today-hero-art { width: 120px; max-height: 82px; }
  .today-kcal-status { white-space: normal; }
  .today-decision { grid-template-columns: minmax(0, 1fr) 36px; padding-inline: 14px; }
  .today-decision img { display: none; }
  .today-decision strong { font-size: 20px; }
  .today-decision > b { width: 34px; }
  .today-footer-scene { max-width: 480px; width: 100%; justify-self: center; }
  .today-target-card { grid-template-columns: 1fr 1fr; }
  .today-target-card > span:first-child { grid-column: 1 / -1; border: 0; padding-bottom: 10px; }
  .today-nutrition { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 14px; }
  .today-meal { grid-template-columns: minmax(0, 1fr) auto; }
  .today-meal-meta { grid-column: 1 / -1; display: flex; align-items: center; gap: 12px; }
  .today-meal-meta time { margin-top: 0; }
  .recipe-journal-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; }
  .recipes-hero { max-width: 540px; margin-inline: auto; }
  .recipe-detail-page { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 32px; align-items: start; }
  .recipe-detail-page > * { grid-column: 1 / -1; }
  .recipe-detail-page > .recipe-section { grid-column: auto; }
  .recipe-detail-actions { display: flex; gap: 12px; }
  .recipe-detail-actions > button { flex: 1; }
  .profile-directory, .shopping-row, .shopping-empty { max-width: 760px; margin-inline: auto; }
  .sheet { bottom: max(12px, env(safe-area-inset-bottom)); height: min(880px, calc(100dvh - 24px)); max-height: calc(100dvh - 24px); border-radius: 18px; }
}
@media (min-width: 900px) {
  .today-page { column-gap: 48px; grid-template-columns: minmax(0, 380px) minmax(0, 1fr); }
  .today-target-card { grid-template-columns: .9fr 1.1fr 1fr; }
  .today-target-card > span:first-child { grid-column: auto; padding-bottom: 0; }
  .today-nutrition { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
/* Short landscape screens need content height, even with the keyboard open. */
@media (orientation: landscape) and (max-height: 540px) {
  #app, #app.is-fridge-page, #app.is-recipes-page { padding-top: max(10px, env(safe-area-inset-top)); padding-bottom: calc(64px + env(safe-area-inset-bottom)); }
  .tabs, .is-today-page .tabs, .is-fridge-page .tabs, .is-recipes-page .tabs { padding-top: 3px; padding-bottom: max(3px, env(safe-area-inset-bottom)); }
  .tab { display: flex; flex-direction: row; justify-content: center; align-items: center; gap: 5px; min-height: 44px; }
  .tab i { height: 34px; }
  .tab-art { max-height: 34px; max-width: 44px; }
  .today-datebar { margin-bottom: 8px; }
  .recipes-hero { height: 150px; }
  .recipes-title { top: 12px; }
  .sheet, .sheet.nutrition-compact-sheet { bottom: 0; height: 100dvh; max-height: 100dvh; border-radius: 0; }
  .sheet-header { padding-top: 5px; }
  .sheet .handle { margin-top: 4px; margin-bottom: 5px; }
}
