/* ============================================================================
   mobile.css — 手机端适配层（v69）
   仅在窄屏（≤820px，手机 / 竖屏平板）生效；桌面端（>820px）完全不受影响。
   设计原则：
     ① 手机交互习惯：底部标签栏导航、底部抽屉式弹窗、拇指可达区域；
     ② 触控尺寸：可点元素最小 44×44px（Apple HIG）/ 48dp（Material）；
     ③ 防误缩放：输入框字号 ≥16px（iOS 聚焦不再自动放大）；
     ④ 表格式数据 → 卡片式（表头变成每行的字段名，一屏竖着看完，不用左右滑）；
     ⑤ 班表 / 客人端等宽表格保留横向滚动，但放大触控格、冻结姓名列。
   ========================================================================== */

/* ---------- 0. 运行时开关（由 app.js 按屏宽切换 class） ---------- */
html.is-mobile .desktop-only { display: none !important; }
/* 底部标签栏默认隐藏，只在手机端（下面媒体查询里）显示 */
.mnav { display: none; }

@media (max-width: 820px) {

  /* ---------- 1. 基础：动态视口高度 + 安全区 ---------- */
  html { font-size: 15px; -webkit-text-size-adjust: 100%; }
  html, body {
    height: 100%;
    height: 100dvh;                 /* 移动浏览器地址栏收放时高度自适应 */
    overflow: hidden;
  }
  body {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;      /* 去掉 300ms 双击缩放延迟 */
    overscroll-behavior: none;
  }
  /* 主容器：底部为标签栏 + 安全区留出空间 */
  .app-view {
    height: 100%;
    height: 100dvh;
    max-height: 100dvh;
  }

  /* ---------- 2. 顶栏：单行紧凑（v76 再压缩：字号/栏高再收一档，把空间让给内容） ---------- */
  .topbar { padding-top: env(safe-area-inset-top, 0px); }
  .topbar-row { padding: 4px 8px; gap: 6px; }
  .topbar-title-row { padding-bottom: 4px; min-height: 40px; }
  /* 手机端不用顶栏第二行菜单（改由底部标签栏承载） */
  .topbar-nav-row { display: none; }
  .topbar .brand { font-size: 14px; max-width: 36vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .top-right { gap: 4px; }
  .top-right .who { font-size: 11px; max-width: 22vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .cloud-dot { padding: 0 6px; height: 26px; border-radius: 13px; font-size: 10px; }
  .cloud-dot span { display: none; }
  .cloud-dot i { font-size: 12px; }
  /* v75/v90.2 跨日计时标识：手机端压缩（只留 🕗 + 时间），仍保证一眼可见 */
  .day-chip { padding: 0 6px; height: 26px; border-radius: 13px; font-size: 10px; }
  .day-chip .dc-date { display: none; }   /* 日期在窄屏省略，避免顶栏挤爆（完整信息看 title 提示） */
  .day-chip .dc-word { display: none; }
  .bell { padding: 5px 8px; font-size: 15px; min-width: 34px; min-height: 34px; }
  #logout-btn { padding: 5px 9px; min-height: 34px; font-size: 12px; }
  .lang-switch .lang-opt { height: 26px; line-height: 26px; padding: 0 9px; font-size: 11px; }

  /* ---------- 3. 底部标签栏（v76：全部菜单平铺一行、左右滑动切换；栏高再压缩） ---------- */
  .mnav {
    display: flex; flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 45;
    background: #0f1830;
    border-top: 1px solid rgba(255, 255, 255, .10);
    padding: 3px 4px calc(3px + env(safe-area-inset-bottom, 0px));
    box-shadow: 0 -4px 18px rgba(0, 0, 0, .22);
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  .mnav::-webkit-scrollbar { display: none; }
  .mnav-item {
    flex: 0 0 auto; min-width: 58px; max-width: 84px;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 1px; min-height: 44px; padding: 4px 6px;
    border: 0; background: transparent; color: #9fb0d0;
    font-size: 10px; font-weight: 600; text-decoration: none;
    border-radius: 10px; position: relative; line-height: 1.2;
  }
  .mnav-item i { font-style: normal; font-size: 17px; line-height: 1; }
  .mnav-item span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .mnav-item.active { color: #fff; background: rgba(255, 255, 255, .12); }
  .mnav-item.active i { transform: translateY(-1px); }
  .mnav-item .badge-dot {
    position: absolute; top: 2px; right: calc(50% - 18px);
    margin: 0; min-width: 14px; height: 14px; line-height: 14px; font-size: 9px;
  }

  /* ---------- 4. 内容区：底部留出标签栏高度 ---------- */
  .content {
    padding: 10px 10px calc(56px + env(safe-area-inset-bottom, 0px));
    -webkit-overflow-scrolling: touch;
  }
  h2 { font-size: 18px; }
  .view-sub { font-size: 12.5px; margin-bottom: 12px; }
  .panel { padding: 12px; border-radius: 12px; margin-bottom: 12px; }
  .card { padding: 12px; border-radius: 12px; }
  .card .v { font-size: 20px; }

  /* ---------- 5. 触控尺寸：按钮 / 输入 / 勾选 ---------- */
  button {
    min-height: 42px;
    padding: 10px 16px;
    font-size: 14px;
    border-radius: 10px;
  }
  button.ghost { min-height: 42px; }
  .row-actions button,
  .ot-actions button,
  .q-acts button,
  .q-card2-acts button,
  .q-card .q-actbtn {
    min-height: 36px; padding: 8px 12px; font-size: 13px;
  }
  input, select, textarea {
    font-size: 16px;                       /* iOS 聚焦不放大 */
    min-height: 44px;
    padding: 10px 12px;
    border-radius: 10px;
  }
  textarea { min-height: 90px; }
  label { font-size: 13px; margin: 12px 0 5px; }
  /* 勾选框放大到易点（仅限表单里的、非表格/列表内的紧凑勾选） */
  .panel > label > input[type="checkbox"],
  .panel > label > input[type="radio"] { width: 22px; height: 22px; }
  .close-item input { transform: scale(1.5); }
  .jf-opt input[type="checkbox"], .q-op input, .grp-panel label input { width: 20px; height: 20px; }

  /* ---------- 6. 工具栏：换行排布，主要按钮占满 ---------- */
  .toolbar { gap: 8px; margin-bottom: 12px; }
  .toolbar > button { flex: 1 1 auto; min-width: 46%; }
  /* 班表工具栏 / 换桌管理条：按钮保持自然宽度，不被强行撑到 46%（否则会把工具栏挤爆） */
  .sch-bar > button, .sch-bar .tb-col > button, .sch-bar .tb-far > button,
  .q-managebar > button, .q-histbar > button, .multibar > button, .pastebar > button { flex: 0 0 auto; min-width: 0; }
  .toolbar .spacer { display: none; }
  .toolbar .muted { flex: 1 1 100%; font-size: 11.5px; }
  .tabbar {
    gap: 6px; flex-wrap: nowrap; overflow-x: auto; padding-bottom: 8px;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  .tabbar::-webkit-scrollbar { display: none; }
  .tab-btn { flex: 0 0 auto; padding: 9px 16px; font-size: 13.5px; min-height: 40px; }

  /* ---------- 7. 表格 → 卡片（拉通所有模块，无需改每个页面） ---------- */
  .m-cards { display: block; }
  .m-cards table {
    display: block; width: 100%;
    border: 0; background: transparent; border-radius: 0; overflow: visible;
  }
  .m-cards thead { display: none; }
  .m-cards tbody, .m-cards tfoot { display: block; }
  .m-cards tr {
    display: block; background: #fff;
    border: 1px solid var(--line); border-radius: 12px;
    padding: 8px 12px; margin-bottom: 10px;
    box-shadow: 0 1px 3px rgba(15, 24, 48, .04);
  }
  .m-cards tr:hover td { background: transparent; }
  .m-cards td {
    display: flex; align-items: flex-start; justify-content: space-between;
    gap: 12px; width: auto !important;
    border: 0; border-bottom: 1px dashed var(--line);
    padding: 8px 0; text-align: right; font-size: 14px; line-height: 1.5;
    word-break: break-word;
  }
  .m-cards td:last-child { border-bottom: 0; padding-bottom: 4px; }
  .m-cards td::before {
    content: attr(data-label);
    flex: 0 0 38%;
    text-align: left; color: var(--muted);
    font-size: 12.5px; font-weight: 600; line-height: 1.5;
  }
  .m-cards td.m-no-label::before { content: none; }
  .m-cards td.m-hide { display: none; }
  /* 操作列（末尾按钮）：整行铺开 */
  .m-cards td.m-acts, .m-cards td.row-actions {
    display: flex; flex-wrap: wrap; justify-content: flex-start;
    gap: 8px; border-bottom: 0; border-top: 1px dashed var(--line);
    margin-top: 6px; padding-top: 10px;
  }
  .m-cards td.m-acts::before, .m-cards td.row-actions::before { content: none; }
  .m-cards td.m-acts button, .m-cards td.row-actions button { flex: 1 1 auto; min-width: 42%; }
  /* 表尾合计行也按卡片显示 */
  .m-cards tfoot tr { background: #f7f9fd; }
  .m-cards tfoot td { font-weight: 700; }
  /* 别名：有些模块加了 .emp-list，让它跟随卡片模式 */
  .emp-list.m-cards td { text-align: right; }

  /* ---------- 8. 模态框 → 底部抽屉（拇指可达） ---------- */
  #modal-root:not(.hidden) {
    align-items: flex-end;
    padding: 0;
  }
  .modal {
    width: 100% !important; max-width: 100% !important;
    max-height: 92dvh;
    border-radius: 18px 18px 0 0;
    padding: 16px 16px 0;
    overscroll-behavior: contain;
    animation: m-sheet-in .22s ease-out;
  }
  .modal::before {                       /* 顶部抓手 */
    content: ''; display: block; width: 40px; height: 4px;
    background: #d5dced; border-radius: 2px; margin: -6px auto 12px;
  }
  .modal h3 { margin: 0 0 12px; font-size: 16px; }
  .modal .grid2 { grid-template-columns: 1fr; }
  .modal .jf-row { flex-wrap: wrap; gap: 8px; }
  .modal .jf-row .jf-name { flex: 1 1 100%; }
  /* 底部按钮固定，长表单滚动也不用滑到底才能保存 */
  .modal-actions {
    position: sticky; bottom: 0;
    background: #fff; margin: 14px -16px 0; padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--line); gap: 10px;
  }
  .modal-actions button { flex: 1 1 0; min-height: 46px; font-size: 15px; }
  .grp-panel { max-height: 56dvh; }

  /* ---------- 9. 卡片 / 网格：一律单列 ---------- */
  .grid-cards { grid-template-columns: 1fr 1fr; gap: 10px; }
  .grid2 { grid-template-columns: 1fr !important; }
  .set-grid { grid-template-columns: 1fr; }
  .perm-grid { grid-template-columns: 1fr; }
  .ui-grid { grid-template-columns: 1fr; }
  .share-grid { grid-template-columns: 1fr; }
  .share-grid .card .qr { width: 100%; max-width: 240px; height: auto; aspect-ratio: 1; }
  .q-cols, .q-room, .q-cards { grid-template-columns: 1fr !important; }
  /* v98：换桌「大组/小组」在手机上保持左右分栏（.q-split2 是 flex，不是 grid） */
  .q-split2 { flex-direction: row; gap: 10px; }

  /* ---------- 10. 班表：保留横向滚动，放大触控格、冻结姓名列 ---------- */
  .content.sch-page { padding-bottom: calc(56px + env(safe-area-inset-bottom, 0px)); }
  .sch-bar {
    flex-wrap: wrap; gap: 6px; margin-bottom: 6px;
    overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  .sch-bar::-webkit-scrollbar { display: none; }
  /* v76：核心操作一行；次要操作默认收起，点 ☰ 展开 */
  .sch-bar .sch-core { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; flex: 1 1 auto; }
  .sch-bar .sch-secondary { display: none; flex-wrap: wrap; align-items: center; gap: 6px; width: 100%; }
  .sch-bar .sch-secondary.open { display: flex; }
  .sch-bar .sch-more-btn { display: inline-flex; flex: 0 0 auto; min-height: 32px; padding: 5px 11px; font-size: 16px; line-height: 1; }
  .sch-bar .sch-more-btn.primary { box-shadow: 0 0 0 2px rgba(31,78,216,.2); }
  .sch-bar .tb-col { padding: 3px 6px; gap: 4px; }
  .sch-bar .tb-far2 { flex-wrap: wrap; }
  .sch-bar button, .sch-bar .tb-col > button, .sch-bar .grp-picker > button { min-height: 32px; padding: 5px 9px; font-size: 12px; }
  .sch-bar button.only-me { min-height: 32px; padding: 4px 8px; font-size: 11px; }
  .sch-bar input, .sch-bar select { min-height: 32px; font-size: 13px; padding: 4px 8px; }
  .sch-bar .headcount { font-size: 11px; }
  .sch-bar .day-note { font-size: 10px; padding: 2px 7px; }
  .sch-bar .grp-picker > button { min-width: 0; }
  .sched-wrap {
    -webkit-overflow-scrolling: touch;
    border-radius: 10px;
    scrollbar-width: thin;
  }
  /* v84：手机端默认值（未在设置里自定义时生效）。
     注意：这里**不能**用 !important —— 管理员在「设置 → 班表界面」存了具体尺寸后，
     table 上会带行内变量，行内样式优先级更高 → 桌面/手机/平板看到的是同一套尺寸与字号。 */
  .sched.fixed { --cellw: 64px; --cellh: 66px; --cellfs: 11.5px; --namew: 104px; }
  .sched th, .sched td { min-width: var(--cellw, 64px); }
  .sched.fixed th.name, .sched.fixed td.name { min-width: var(--namew, 104px); }
  .sched th.name { font-size: calc(var(--cellfs, 11.5px) * 1.0); }
  .sched tbody th.name { padding-left: 8px; }
  .sched .cell .sh.big-time { font-size: calc(var(--cellfs, 11.5px) * 1.2); }
  .sched .cell .pk-time { font-size: calc(var(--cellfs, 11.5px) * 1.0); }
  /* 横向滚动提示（仅移动端、由 JS 判断溢出后加 class） */
  .sched-wrap.m-scrollable::after {
    content: '← 左右滑动查看日期 →';
    position: sticky; left: 0; bottom: 0;
    display: block; width: 100%;
    padding: 4px 8px; font-size: 11px; color: var(--muted);
    background: #f7f9fd; border-top: 1px solid var(--line);
  }
  .multibar { flex-wrap: wrap; gap: 8px; }
  .multibar input { width: 76px !important; }
  .pastebar { flex-wrap: wrap; font-size: 12px; }

  /* ---------- 11. 智能助手聊天 ---------- */
  .chat-msg { max-width: 88%; font-size: 14px; }
  /* v148：手机端窗口长宽固定 —— 面板给固定高度、消息区撑满（!important 覆盖行内 max-height:320px），
     窗口不再随消息多少忽高忽低，能稳定看到更多沟通内容 */
  #chat-panel { height: 66dvh; display: flex; flex-direction: column; }
  #chat-log { flex: 1 1 auto !important; min-height: 0 !important; max-height: none !important; }
  .chat-action { max-width: 100%; }
  .chat-action .ca-row { flex-direction: column; gap: 2px; }
  .chat-action .ca-k { min-width: 0; }
  .chat-action .ca-btns button { flex: 1 1 0; min-height: 42px; }

  /* ---------- 12. 提醒中心 / 通知 / 收档清单 ---------- */
  .rem-item { flex-wrap: wrap; }
  .rem-item .act { margin-left: 0; width: 100%; }
  .rem-item .act button { flex: 1 1 auto; }
  .notice .n-head { flex-wrap: wrap; }
  .notice .row-actions { width: 100%; display: flex; flex-wrap: wrap; gap: 6px; }
  .notice .row-actions button { flex: 1 1 auto; }
  .notice-list { max-height: 60dvh; overflow: auto; }

  /* ---------- 13. 登录页 ---------- */
  .login-view {
    padding: calc(16px + env(safe-area-inset-top, 0px)) 14px calc(16px + env(safe-area-inset-bottom, 0px));
    align-items: flex-start;
  }
  .login-card { width: 100%; max-width: 460px; padding: 22px 18px; border-radius: 16px; margin: auto; }
  .login-emoji { font-size: 38px; }
  .login-hero h1 { font-size: 21px; }
  .login-row { flex-direction: column; gap: 10px; }
  .login-row button { width: 100%; min-height: 48px; font-size: 16px; padding: 0 16px; }
  .login-foot { font-size: 12.5px; }

  /* ---------- 14. 员工登记页（join.html） ---------- */
  .login-card[style*="max-width:700px"] { max-width: 100% !important; max-height: none !important; }

  /* ---------- 15. 客人扫码页 / 员工端换桌（queue.html，手机优先） ---------- */
  .q-page { padding: calc(8px + env(safe-area-inset-top, 0px)) 10px calc(16px + env(safe-area-inset-bottom, 0px)); }
  .q-submit { min-height: 52px; font-size: 17px; }
  .q-stepper button { width: 54px; height: 54px; font-size: 28px; }
  .q-chip { min-height: 48px; font-size: 17px; }
  .q-ztab { min-height: 44px; padding: 10px 18px; }
  .q-agree input { width: 24px; height: 24px; }
  .q-tab { min-height: 46px; font-size: 14px; padding: 10px 14px; }
  .q-tabs { overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
  .q-tabs::-webkit-scrollbar { display: none; }
  .q-tbl { font-size: 13.5px; }
  .q-tbl td { padding: 9px 6px; }
  .q-adj-btn, .q-adjust button { width: 34px; height: 34px; }
  .q-card .q-actbtn { min-height: 38px; }
  .q-ops { max-height: 40dvh; }

  /* ---------- 15d. 换桌看板：手机端整体缩小，只放大「换桌按钮」与「原座位号」（v98） ---------- */
  /* 只作用于换桌看板里的卡片（.q-cards .q-card），不碰客人扫码落地页的 .q-card */
  .q-split2 .q-sect-h { flex-wrap: wrap; gap: 5px; font-size: 11px; }
  .q-split2 .q-sect-h b { font-size: 12px; }
  .q-cards .q-card { padding: 7px 8px; border-radius: 10px; margin-bottom: 7px; }
  .q-cards .q-card .q-r1 { gap: 5px; }
  .q-cards .q-card .q-r2, .q-cards .q-card .q-r3 { margin-top: 5px; padding-top: 5px; gap: 5px; }
  .q-cards .q-card .q-name { font-size: 11.5px; }
  .q-cards .q-card .q-name .q-code { font-size: 9px; margin-left: 4px; }
  .q-cards .q-card .q-pax { font-size: 10.5px; }
  .q-cards .q-card .q-pax b { font-size: 12px; }
  .q-cards .q-card .q-g { font-size: 9px; padding: 1px 4px; margin-left: 3px; }
  .q-cards .q-card .q-arrow { font-size: 11px; }
  .q-cards .q-card .q-target { font-size: 11px; }
  .q-cards .q-card .q-seat.now { font-size: 11px; padding: 2px 6px; }
  .q-cards .q-card .q-time { font-size: 10.5px; gap: 4px; }
  .q-cards .q-card .q-time i { font-size: 9.5px; }
  .q-cards .q-card .q-time b { font-size: 11px; }
  .q-cards .q-card .q-dur { font-size: 9.5px; }
  .q-cards .q-card .q-adjust button { width: 22px; height: 22px; font-size: 10px; min-height: 0; padding: 0; }
  .q-cards .q-card .q-adjust .q-adjv { font-size: 10px; min-width: 20px; }
  .q-cards .q-card .q-rel { font-size: 10.5px; }
  .q-cards .q-card .q-left { font-size: 10.5px; }
  .q-cards .q-card .q-detail { font-size: 10.5px; padding: 3px 8px; min-height: 0; }
  /* 换桌按钮 + 原座位号：相对其它元素更大、更好点（醒目） */
  .q-cards .q-card .q-actbtn { min-height: 38px; padding: 7px 13px; font-size: 13.5px; }
  .q-cards .q-card .q-seat.orig { font-size: 14px; padding: 5px 10px; min-height: 0; }
  .q-cards .q-card .q-seat.orig i { font-size: 10px; }
  /* v103：点餐切换按钮 + 精简后时间行（只显示 HH:MM，箭头分隔） */
  .q-cards .q-card .q-order { font-size: 10.5px; padding: 4px 9px; min-height: 0; }
  .q-cards .q-card .q-move .q-r2 .q-arrow { font-size: 11px; margin: 0 1px; }
  .q-cards .q-card .q-move .q-r2 .q-time b { font-size: 12px; }
  /* v105：待换桌卡片内容尺寸完全固定（任何手机不溢出、不缩放；框宽度随屏自适应） */
  .q-cards .q-card.q-move { padding: 8px 10px; }
  .q-cards .q-card.q-move .q-r1 { gap: 6px; }
  .q-cards .q-card.q-move .q-r2,
  .q-cards .q-card.q-move .q-r3 { gap: 6px; margin-top: 7px; padding-top: 7px; }
  .q-cards .q-card.q-move .q-seat.orig { font-size: 13px; padding: 4px 9px; }
  .q-cards .q-card.q-move .q-pax { font-size: 13px; font-weight: 800; color: #26324a; }
  .q-cards .q-card.q-move .q-actbtn { min-height: 30px; padding: 4px 12px; font-size: 13px; }
  .q-cards .q-card.q-move .q-r2 .q-time b { font-size: 13px; }
  .q-cards .q-card.q-move .q-adj-btn { width: 28px; height: 28px; font-size: 15px; }
  .q-cards .q-card.q-move .q-order { font-size: 11px; padding: 4px 9px; }
  .q-cards .q-card.q-move .q-detail { font-size: 11px; padding: 4px 9px; }
  .q-cards .q-card.q-move .q-left { font-size: 11px; }
  .q-cards .q-card.q-move .q-r3 { justify-content: flex-start; }
  /* v105：已换座筛选 mini 按钮 */
  .q-filter { gap: 4px; margin-bottom: 6px; }
  .q-mini { font-size: 11px; padding: 2px 10px; min-height: 0; }

  /* ---------- 15b. 班表底部考勤公告：默认折叠成一行（v76） ---------- */
  .sch-foot-details { background: transparent; }
  .sch-foot-summary {
    cursor: pointer; user-select: none; list-style: none;
    font-weight: 700; font-size: 12px; padding: 6px 10px; border-radius: 8px;
  }
  .sch-foot-summary::-webkit-details-marker { display: none; }
  .sch-foot-summary::before { content: '▸ '; display: inline-block; transition: transform .15s; }
  .sch-foot-details[open] .sch-foot-summary::before { transform: rotate(90deg); }
  .sch-foot-in { padding: 8px 2px 2px; font-size: 12px; line-height: 1.8; }

  /* ---------- 15c. 滚动折叠：上滑收起 / 下滑出现 / 2 秒无操作再收起（v76） ---------- */
  body.chrome-hidden .topbar { display: none; }
  body.chrome-hidden .sch-bar, body.chrome-hidden .multibar { display: none !important; }

  /* ---------- 16. 其他细节 ---------- */
  .toast {
    bottom: calc(84px + env(safe-area-inset-bottom, 0px));
    max-width: 88vw; text-align: center;
  }
  .kv b { font-size: 15px; }
  .legend { font-size: 11.5px; gap: 10px; }
  .tag { font-size: 11.5px; }
  .dropzone { padding: 22px 14px; font-size: 13.5px; }
  /* 顶部浮层（云状态弹窗等）也走同一套抽屉 */
  .emp-list th, .emp-list td { text-align: left; }
}

/* 底部抽屉入场动画 */
@keyframes m-sheet-in {
  from { transform: translateY(22px); opacity: .6; }
  to   { transform: translateY(0); opacity: 1; }
}

/* 超窄屏（≤380px）再收一档 */
@media (max-width: 380px) {
  .mnav-item span { font-size: 10px; }
  .topbar .brand { max-width: 34vw; font-size: 14px; }
  .grid-cards { grid-template-columns: 1fr; }
  .sched.fixed { --cellw: 58px; }
}

/* 手机横屏（高度很小的横屏）——压缩纵向留白；聊天窗仍保持固定尺寸（v148） */
@media (max-width: 820px) and (max-height: 460px) {
  .modal { max-height: 96dvh; }
  #chat-panel { height: 84dvh; }
  .content { padding-top: 8px; }
}

/* 支持「降低动效」的用户 */
@media (prefers-reduced-motion: reduce) {
  .modal { animation: none; }
}

/* v164：预订「📖 菜单」标签页已删除 → 原 v142 菜单栏的窄屏规则一并移除 */

/* v143 窄屏：菜单框架编辑器（品项行两行排布，避免横向挤压） */
@media (max-width: 720px) {
  .rmi-cols { display: none; }
  .rmi-row { grid-template-columns: 1.4fr 1fr 34px; grid-auto-rows: auto; gap: 4px; padding-left: 12px; }
  .rmi-row .rmi-price { grid-column: 2; text-align: left; }
  .rmi-row .rmi-kind { grid-column: 1; }
  .rmi-row .rmi-del { grid-column: 3; grid-row: 1; }
  .rc-crow, .rc-srow { flex-wrap: wrap; }
  .rc-orig { max-width: 100%; }
  .rc-crow input.rc-display, .rc-srow input.rsub-display { flex: 1 1 45%; }
  .rc-crow select.rc-dept, .rc-srow select.rsub-dept { flex: 1 1 40%; }
}

/* ================= v144 / v145 手机端预订清单：不显示定金 + 表头与内容逐列对齐 =================
   做法：换一份「去掉定金列」的 grid 模板（表头与行共用同一份 → 天然对准），
   同时把字号收小一档，让时间/名称/人数/桌号/备注都能完整显示，不靠省略号硬截断。 */
@media (max-width: 820px) {
  .bk-c-deposit { display: none; }
  /* 尾列固定 26px（只放一个 ⓘ 按钮）；其余按比例分，表头与内容天然对齐 */
  .bk-rows { --bk-cols: minmax(0, 1.35fr) minmax(0, 1.7fr) minmax(0, .75fr) minmax(0, 1.25fr) minmax(0, 1fr) 26px; }
  .bk-head, .bk-row { column-gap: 6px; padding: 6px 9px; }
  .bk-head { font-size: 11px; letter-spacing: -.2px; }
  .bk-f .bk-fv { font-size: 12.5px; }
  .bk-c-time .bk-fv { font-size: 12px; }
  .bk-c-pax .bk-fv { font-size: 12px; }
  .bk-kind-btn { padding: 2px 7px; font-size: 11px; }
  .bk-kind-txt { font-size: 12px; }
  .food-tb th, .food-tb td { padding: 5px 6px; font-size: 12px; }
}
/* 超窄屏（≤380px）再收一档字号，仍然保持同一份列模板 */
@media (max-width: 380px) {
  .bk-head { font-size: 10.5px; }
  .bk-f .bk-fv { font-size: 11.5px; }
  .bk-c-time .bk-fv, .bk-c-pax .bk-fv { font-size: 11px; }
  .bk-kind-btn, .bk-kind-txt { font-size: 10.5px; }
}
/* 操作页也是同一套 grid（4 列：时/名/人/操作）；按钮多 → 操作列固定 132px 并允许换行 */
@media (max-width: 820px) {
  .bk-rows.bk-ops-rows { --bk-cols: minmax(0, 1.1fr) minmax(0, 1.4fr) minmax(0, .7fr) 132px; }
  .bk-ops-rows .bk-c-btn { padding: 3px 7px; font-size: 11px; }
}

/* v151 工具 · 新品成本模拟：窄屏配方行改两行排布（避免横向挤压） */
@media (max-width: 820px) {
  .nc-row { grid-template-columns: minmax(0, 1fr) 78px 44px 30px !important; }
  .nc-row select.nc-mat { font-size: 13px; }
  .nc-manual { grid-template-columns: 1fr 1fr !important; }
  .nc-manual .nc-munit { grid-column: 1 / -1; }
  #nc-result .grid-cards { grid-template-columns: 1fr 1fr; }
}

/* v155 手机端：待确认标识在窄屏也要看得见（名称可能被省略号截断，标识不参与截断） */
@media (max-width: 820px) {
  .bk-card .bk-c-status .bk-cf-badge { margin-left: 0; }
}