/* Layout recovery for the phone POS shell. Keep every touch target separated. */
@media (max-width: 760px) {
  body.admin-page { padding-bottom: calc(70px + env(safe-area-inset-bottom)) !important; }
  body.admin-page .app-bottom-nav {
    position: fixed !important;
    z-index: 110 !important;
    inset: auto 0 0 !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 4px !important;
    padding: 6px 8px calc(6px + env(safe-area-inset-bottom)) !important;
    background: #3e281d !important;
    border-top: 2px solid #435b3e !important;
    box-shadow: 0 -5px 18px #24170f35 !important;
  }
  body.admin-page .app-bottom-nav > button {
    min-width: 0 !important;
    min-height: 50px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 3px !important;
    padding: 4px 2px !important;
    border: 0 !important;
    border-radius: 9px !important;
    background: transparent !important;
    color: #f8edda !important;
    line-height: 1.1 !important;
  }
  body.admin-page .app-bottom-nav > button > span {
    position: relative !important;
    width: 24px !important;
    height: 24px !important;
    display: grid !important;
    place-items: center !important;
    color: #e6c9a2 !important;
  }
  body.admin-page .app-bottom-nav > button svg { width: 22px !important; height: 22px !important; }
  body.admin-page .app-bottom-nav > button small { color: inherit !important; font: 700 10px/1.1 Arial, sans-serif !important; }
  body.admin-page .app-bottom-nav > button.active { background: #435b3e !important; color: #fff4df !important; }

  body.admin-page.pos-mode #admin-pos-panel:not([hidden]) {
    box-sizing: border-box !important;
    gap: 8px !important;
  }
  body.admin-page.pos-mode .pos-menu-viewport {
    min-width: 0 !important;
    min-height: 0 !important;
    border-radius: 12px !important;
  }
  body.admin-page.pos-mode .pos-menu-track { width: max-content !important; min-width: 100% !important; }
  body.admin-page.pos-mode .pos-page {
    box-sizing: border-box !important;
    flex: 0 0 100% !important;
    width: 100% !important;
    min-width: 100% !important;
    padding: 8px !important;
    gap: 8px !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(2, minmax(0, 1fr)) !important;
  }
  body.admin-page.pos-mode .pos-tile {
    min-width: 0 !important;
    min-height: 0 !important;
    gap: 0 !important;
    border-radius: 10px !important;
  }
  body.admin-page.pos-mode .pos-tile-copy { min-width: 0 !important; overflow: hidden !important; }

}