@charset "UTF-8";
/* 手机排版轻量修复（审计 qa/audit/mobile-1010 C1–C13，Tim 10-11「先将就着」）。
   只在宽度 ≤ 720 px 生效，电脑端外观不变；不改页面结构，不把表格改成卡片。
   不碰扫码会话的区域：成品 › SN 标签（.sn-board）、发货单（.ship-layout）、送样 / 线下出库对话框（#offline-ship-unit）、扫码层与扫码键。
   通用控件规则前缀 :where(body:not(:has(#sn-board,.ship-layout)))：SN 标签页、发货单页（含它们的对话框）一概不套，那几处由 styles.css 末尾的扫码会话规则管。
   颜色、圆角、字号按 docs/design/WORKBENCH-STYLE.md。 */

/* 「菜单」按钮由 mobile-nav.js 插进侧栏，电脑端不显示 */
.nav-toggle{display:none}
/* 定价页价位条标签里的美元部分包在 small.usd 里（手机上隐藏），电脑端字号照旧 */
.pricing-market .bar small.usd{font-size:inherit}

@media (max-width:720px){
  html{scroll-padding-top:64px}

  /* ── C1 侧栏：顶部 56 px 吸顶窄栏（品牌 + 菜单），导航收起成抽屉；手机上不显示原顶栏 ── */
  .sidebar{position:sticky;top:0;z-index:65;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:12px;height:56px;padding:0 12px 0 16px;border-right:0;border-bottom:1px solid #ebedf0;overflow:visible}
  .sidebar .studio-wordmark{font-size:19px;gap:10px}
  .sidebar .studio-mark{width:19px;height:22px}
  .nav-toggle{display:inline-flex;align-items:center;gap:8px;flex:none;min-height:44px;margin:0;padding:0 14px;border:1px solid #dde0e5;border-radius:8px;background:#fff;color:#14181d;font-size:15px;font-weight:500}
  .nav-toggle::before{content:"";width:16px;height:12px;background:linear-gradient(#14181d,#14181d) 0 0/100% 2px no-repeat,linear-gradient(#14181d,#14181d) 0 50%/100% 2px no-repeat,linear-gradient(#14181d,#14181d) 0 100%/100% 2px no-repeat}
  .nav-toggle[aria-expanded=true]::before{background:linear-gradient(45deg,transparent 45%,#14181d 45% 55%,transparent 55%),linear-gradient(-45deg,transparent 45%,#14181d 45% 55%,transparent 55%);width:14px;height:14px}
  html.has-mobile-nav .sidebar nav{display:none}
  html.has-mobile-nav .sidebar.is-open nav{display:flex;flex-direction:column;align-items:stretch;gap:2px;position:fixed;top:56px;left:0;right:0;bottom:0;margin:0;padding:8px 12px calc(24px + env(safe-area-inset-bottom));overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;background:#fafafa}
  html.nav-open{overflow:hidden}
  .sidebar nav details{min-width:0;flex-shrink:0}
  .sidebar nav details+details{margin-top:4px}
  .sidebar nav details>summary,.sidebar nav #sudo-navigation>summary,.sidebar nav #system-navigation>summary,.sidebar nav #commerce-navigation>summary{min-height:44px;margin:0;padding:14px 12px 6px;font-size:14px}
  .sidebar nav button{width:100%;min-height:44px;padding:0 12px;font-size:15px;white-space:normal}
  .sidebar nav details button{padding-left:24px}
  .sidebar nav .identity{width:auto;margin-top:16px;padding:16px 12px 0;border-top:1px solid #ebedf0;display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:10px;font-size:14px;color:#5b636d}
  .sidebar nav .identity #staff-label{overflow-wrap:anywhere;min-width:0}
  .sidebar nav .identity #logout{width:auto;min-height:44px;margin-left:auto;padding:0 16px;border:1px solid #dde0e5;border-radius:8px;background:#fff;color:#14181d;font-size:15px}
  .app:not(.is-launcher) .topbar{display:none}
  main{padding:20px 18px 28px}

  /* ── C2 标题区：标题独占一行，空的工具区不占位，搜索框独占一行，不显示 eyebrow 小字 ── */
  .page-heading{flex-wrap:wrap;gap:12px;margin-bottom:20px}
  :where(#main:not(:has(.ship-layout,[data-product-tab]))) .page-heading{justify-content:flex-start}
  .page-heading>div:first-child{flex:1 1 100%;min-width:0}
  .page-heading .eyebrow{display:none}
  .page-tools{width:auto;margin:0;flex-wrap:wrap}
  .page-tools:empty{display:none}
  .page-tools:has(input[type=search]){flex:1 1 100%}
  .page-tools .material-search,.page-tools input[type=search]{flex:1 1 100%;width:100%;min-width:0}
  .page-heading>#refresh,.page-heading .page-tools button{min-height:44px;padding:0 14px;font-size:14px}

  /* ── C9 首页卡片：图标不压字（.app.is-launcher 那条 padding:28px 盖掉了手机规则） ── */
  .app.is-launcher .launch-card{padding:20px 20px 20px 66px}
  /* 首页没有侧栏，身份信息照旧在顶栏：上下居中，「退出」够 44 px */
  .app.is-launcher .topbar{align-items:center;min-height:56px;padding:6px 16px}
  .topbar #logout{min-height:44px;padding:0 8px}

  /* ── C3 页面横向溢出 ── */
  /* 硬件版本详情：版本代码换行、按钮组换行、统计块不再一字一行 */
  .vm-head-main{width:100%}
  .vm-title{font-size:24px;gap:8px 12px}
  .vm-title>span,.vm-code{min-width:0;overflow-wrap:anywhere}
  .vm-actions{flex-wrap:wrap;gap:8px}
  .vm-actions .primary,.vm-actions .secondary,.vm-empty-row .primary,.vm-empty-row .secondary{min-height:44px;padding:0 14px;font-size:14px}
  .vm-stats{flex-wrap:wrap;margin:20px 0}
  .vm-stat{flex:1 1 0;flex-wrap:wrap;gap:2px 6px;padding:12px 14px;font-size:13px}
  .vm-stat>span:first-child{flex:1 1 100%}
  .vm-stat b{font-size:24px}
  .vm-names{display:none}
  .vm-more{flex:1 1 100%;margin-left:0;min-height:44px;text-align:left;font-size:13px}
  .vm-card-head{flex-wrap:wrap;gap:6px;padding:14px 16px}
  .vm-card-head h3{flex:1 1 100%}
  .vm-banner-row{flex-wrap:wrap}
  .vm-banner-btns{margin-left:0}
  .vm-back{min-height:44px}
  /* 物料筛选弹层：以整行为准摆放，左右都不出屏 */
  .material-product-row{position:relative}
  .material-product-row .material-menu{position:static}
  .material-product-row .material-popover{left:0;right:0;min-width:0;max-width:none}
  .material-row-end{margin-left:0;width:100%}
  .material-tool-button{min-height:44px}
  /* 成本 › 定价：价位条标签只显示人民币、上下交错；「你的定价」夹在条内 */
  .pricing-market .bar{margin-bottom:46px}
  .pricing-market .bar span .usd{display:none}
  .pricing-market .bar span:nth-of-type(even){top:60px}
  .pricing-market .bar span:nth-of-type(4){transform:translateX(-100%)}
  .pricing-market .bar em{left:clamp(52px,var(--pos,50%),calc(100% - 52px))!important}

  /* ── C4 / C5 列表表格：不再硬撑 850 px；第一列 ≥ 120 px、其余列 ≥ 64 px；长代码换行；操作列吸右；横滑有渐隐提示 ── */
  .supply-records table{min-width:0}
  .supply-records.catalog-records table{table-layout:auto}
  .supply-records.catalog-records td:first-child{width:auto}
  :is(.table-panel,.supply-records) table:not(.sn-table) :is(th,td){padding:12px 10px}
  :is(.table-panel,.supply-records) table:not(.sn-table) th{white-space:normal}
  :is(.table-panel,.supply-records) table:not(.sn-table) :is(th,td):first-child:not([colspan]){min-width:120px}
  :is(.table-panel,.supply-records) table:not(.sn-table) :is(th,td):not(:first-child):not([colspan]){min-width:64px}
  :is(.table-panel,.supply-records) table:not(.sn-table) td:first-child:has(.material-identity){min-width:176px}
  .supply-records.catalog-records td:first-child:not([colspan]){min-width:120px!important}
  .supply-records.catalog-records td:not(:first-child):not([colspan]){min-width:64px!important}
  .supply-records td{max-width:240px}
  :is(.table-panel,.supply-records) table:not(.sn-table) td{overflow-wrap:anywhere}
  :is(.table-panel,.supply-records) :is(.cell-main,.cell-sub){max-width:none;overflow:visible;white-space:normal;text-overflow:clip;overflow-wrap:anywhere}
  :is(.table-panel,.supply-records) td .material-title{max-width:none;white-space:normal;overflow-wrap:anywhere;text-align:left}
  /* 吸右的「操作」列：只在最后一列放了行内按钮的表上生效（订单页原来就有，保持不变） */
  :is(.table-panel,.supply-records) table:not(.sn-table):has(td:last-child:not([colspan]) :is(.row-actions,.rowbtn,.ship-go,.own-link,.consumable-actions)) :is(th:last-child,td:last-child:not([colspan])){position:sticky;right:0;z-index:1;min-width:120px!important;box-shadow:-6px 0 8px -6px rgba(20,24,29,.14)}
  :is(.table-panel,.supply-records) table:not(.sn-table):has(td:last-child:not([colspan]) :is(.row-actions,.rowbtn,.ship-go,.own-link,.consumable-actions)) th:last-child{z-index:2;background:#fafafa}
  :where(.table-panel,.supply-records) :where(td:last-child){background:#fff}
  /* 横滑提示：内容两侧还有没显示的列时，边上出现一道渐隐阴影 */
  .table-scroll:not(:has(.sn-table)){background:linear-gradient(to right,#fff 30%,#fff0) 0 0/28px 100% no-repeat local,linear-gradient(to left,#fff 30%,#fff0) 100% 0/28px 100% no-repeat local,radial-gradient(farthest-side at 0 50%,#14181d33,#14181d00) 0 0/12px 100% no-repeat scroll,radial-gradient(farthest-side at 100% 50%,#14181d33,#14181d00) 100% 0/12px 100% no-repeat scroll,#fff}
  /* 空状态：表不撑宽，说明文字整句显示 */
  .table-scroll:not(:has(.sn-table)):has(.empty) table{min-width:0!important;table-layout:auto}
  .table-scroll:not(:has(.sn-table)):has(.empty) :is(th,td){min-width:0!important}
  .table-scroll:not(:has(.sn-table)) .empty{white-space:normal;padding:40px 16px}

  /* ── C6 / C7 触控区 ≥ 44 px：行内按钮、页签、数字加减钮；行内按钮间距 8 px ── */
  :is(.table-panel,.supply-records) td :is(button,a[href]):not(.status):not(:is(.sn-board,.ship-layout) *){min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:flex-start;text-align:left}
  :is(.table-panel,.supply-records) td :is(.serial-link,.link-inline){border-bottom:0;text-decoration:underline;text-decoration-color:#c3d6e5;text-underline-offset:3px}
  .row-actions,.consumable-actions{gap:8px;flex-wrap:wrap}
  .row-actions button.action-link,.row-actions button.action-danger,.row-actions button,.row-actions a{padding:0 6px}
  .row-actions button.rowbtn,.row-actions a.rowbtn{padding:0 12px}
  .consumable-stepper{display:none}
  .status-tabs{gap:0 18px}
  .status-tabs button{min-height:44px;min-width:44px;padding:0 0 4px}
  .subnav button,.material-product-tabs button,.material-version-tabs button,.wh-chip,.ref-chip,.rd-chips button,.pricing-pills button,.cost-switch button,.service-steps-row button,.cost-guide .go{min-height:44px}
  .material-version-tabs button,.material-product-tabs button{padding:0 12px;text-align:left}
  :where(body:not(:has(#sn-board,.ship-layout))) :is(.number-control button,.pricing-inp .number-control button){flex:0 0 44px;min-width:44px}
  :where(body:not(:has(#sn-board,.ship-layout))) .icon-button{min-width:44px;min-height:44px}
  :where(body:not(:has(#sn-board,.ship-layout))) .checkbox-label{min-height:44px;align-items:center}
  :where(body:not(:has(#sn-board,.ship-layout))) .checkbox-label input{margin-top:0}
  .tab-next button,.back-link,#page-message .next-step,.link-button.next-step{min-height:44px}
  :is(.form-extra,.pricing-fold,.material-more,.factory-card,.feedback-more)>summary{min-height:44px}
  .wh-sel select{min-height:44px}
  :where(body:not(:has(#sn-board,.ship-layout))) :is(.primary,.secondary){min-height:44px}
  :where(body:not(:has(#sn-board,.ship-layout))) :is(button.service-pick,.material-radio-group label,#editor .link-button){min-height:44px}
  .material-radio-group label{display:flex;align-items:center}

  /* ── C8 工具栏：搜索框独占一行，主按钮不截字 ── */
  .toolbar>label[for=search]{flex:1 1 100%;margin:0}
  .toolbar>input[type=search],.commerce-bar input,.consumables-toolbar input{flex:1 1 100%;max-width:none;min-width:0}
  .commerce-bar,.consumables-toolbar,.warehouse-bar{flex-wrap:wrap}
  .warehouse-bar-end{margin-left:0;flex:1 1 100%}
  :is(.warehouse-bar-end,.material-row-end,.commerce-bar,.consumables-toolbar,.supply-toolbar,.toolbar)>:is(.primary,.secondary){min-height:44px;white-space:normal}
  .warehouse-bar-end>.primary{width:100%}
  /* C11 工具栏里的复选框不再被拉宽（styles.css 手机规则 .toolbar input 也套到了复选框上） */
  .toolbar input:is([type=checkbox],[type=radio]){flex:none;width:20px;height:20px;min-width:0;max-width:none}

  /* ── 输入框：iPhone 上字号 < 16 px 一点进去就放大页面，统一 16 px、高 44 px ── */
  :where(body:not(:has(#sn-board,.ship-layout))) :is(input:not([type=checkbox],[type=radio],[type=range],[type=file],[type=color],[type=hidden]),select,textarea):not(:is(.scan-layer,#editor:has(#offline-ship-unit)) *){font-size:16px!important}
  :where(body:not(:has(#sn-board,.ship-layout))) :is(input:not([type=checkbox],[type=radio],[type=range],[type=file],[type=color],[type=hidden]),select):not(:is(.scan-layer,.pricing-inp,#editor:has(#offline-ship-unit)) *){min-height:44px}
  .pricing-ctl .pricing-inp input{font-size:20px!important}

  /* ── C10 对话框：内边距用一个变量，底栏贴住底边不露内容、不被裁；宽 calc(100% - 24px)（扫码会话的三处对话框不动） ── */
  #editor{--pad:20px}
  :where(body:not(:has(#sn-board,.ship-layout))) #editor:not(:has(#offline-ship-unit)){width:calc(100% - 24px);max-height:calc(100dvh - 24px);padding:var(--pad) 16px}
  :where(body:not(:has(#sn-board,.ship-layout))) #editor:not(:has(#offline-ship-unit)) .dialog-actions{bottom:calc(-1 * var(--pad));margin-bottom:calc(-1 * var(--pad));padding:14px 0 var(--pad);flex-wrap:wrap}
  :where(body:not(:has(#sn-board,.ship-layout))) #editor:not(:has(#offline-ship-unit)) :is(.dialog-actions button,.secret-actions button,.dialog-next button){min-height:44px;padding:0 16px;font-size:14px}
  :where(body:not(:has(#sn-board,.ship-layout))) #editor:not(:has(#offline-ship-unit)) .dialog-heading h2{font-size:19px;min-width:0;overflow-wrap:anywhere}
  .f-row{flex-wrap:wrap}
  .f-row>.f-cell{flex:1 1 140px}
  .line-fields{align-items:end}
  .supply-line .text-button{min-height:44px}
  #dialog-fields .seg button,.material-image-tabs button,.material-image-actions .text-button,.carry-img .text-button{min-height:44px}

  /* ── C13「添加物料」对话框：全屏，列表占满剩余高度，「加入 N 项」吸底，只留勾选 / 图 / 物料名三列 ── */
  dialog.vm-dialog{width:100%;height:100vh;height:100dvh;min-height:0;max-width:100%;max-height:none;margin:0;inset:0;border-radius:0}
  .vm-d-head{padding:12px 12px 10px 16px;gap:8px}
  .vm-d-head h2{font-size:19px;overflow-wrap:anywhere}
  .vm-d-head p{font-size:13px}
  .vm-x{width:44px;height:44px}
  .vm-tabs{padding:0 16px;gap:20px}
  .vm-tab{min-height:44px}
  .vm-d-tools{flex-wrap:wrap;gap:8px;padding:10px 16px}
  .vm-search{flex:1 1 100%;min-width:0}
  .vm-search input{height:44px}
  .vm-sel{flex:1 1 0;min-width:0;width:auto;height:44px}
  .vm-switch{min-height:44px;font-size:14px;white-space:normal;text-align:left}
  .vm-picked{flex:1 1 100%;margin-left:0;padding:8px 12px;font-size:14px}
  table.vm-table.vm-pick{min-width:0;table-layout:fixed}
  .vm-pick col:nth-child(n+4){width:0}
  .vm-pick :is(th,td):nth-child(n+4):not([colspan]){display:none}
  .vm-pick col:nth-child(1){width:44px}
  .vm-pick col:nth-child(2){width:52px}
  .vm-pick :is(th,td):not([colspan]){padding:8px 6px}
  .vm-pick tbody tr.vm-gh td{padding:0 12px}
  .vm-gh-in{gap:8px;flex-wrap:wrap}
  .vm-gall{min-height:44px}
  .vm-name{white-space:normal;overflow-wrap:anywhere}
  .vm-d-foot{flex-wrap:wrap;gap:8px;padding:10px 16px calc(10px + env(safe-area-inset-bottom))}
  .vm-btns{margin-left:auto}
  .vm-btns .primary,.vm-btns .secondary{min-height:44px;padding:0 16px;font-size:15px}
  .vm-new-body{padding:16px}
  .vm-n-grid,.vm-n-make{grid-template-columns:1fr}
  .vm-seg{width:100%}
  .vm-seg button{flex:1;height:44px;padding:0 10px}

  /* 实机验收的大字提示条吸顶时让开顶栏 */
  .factory-callout{top:64px}
}