/* ============================================================================
   仓库进销存 ERP · 统一界面样式（对齐 jshERP / Ant Design Pro 视觉规范）
   1. 仅包含样式与排版规则，不含任何业务逻辑，也不改变既有 DOM 的 id / name。
   2. 设计令牌来源：jshERP-web/src/defaultSettings.js（primaryColor #1890FF）、
      assets/less/common.less（.ant-table-tbody td padding 15px）、
      components/layouts/GlobalLayout.vue（.layout .header / .content 间距）。
   ========================================================================== */

/* ---------------------------------------------------------------------------
   1. 设计令牌
   ------------------------------------------------------------------------- */
:root{
  color-scheme:light;
  /* 品牌色：jshERP 默认主题色 #1890FF */
  --primary:#1890ff;
  --primary-hover:#40a9ff;
  --primary-active:#096dd9;
  --primary-1:#e6f7ff;
  --primary-2:#bae7ff;
  /* 文字：对齐 ant-design 的 rgba(0,0,0,.85/.65/.45/.25) */
  --ink:#1f2b3d;
  --ink-2:#40505f;
  --muted:#697d93;
  --ink-3:#9aa8b5;
  /* 线与面 */
  --line:#e8eaed;
  --line-strong:#d9d9d9;
  --bg:#f0f2f5;
  --surface:#fff;
  --surface-head:#fafafa;
  --surface-hover:#f5f8fc;
  /* 语义色 */
  --green:#389e0d;
  --green-bg:#f6ffed;
  --green-line:#b7eb8f;
  --red:#cf1322;
  --red-bg:#fff1f0;
  --red-line:#ffa39e;
  --amber:#d46b08;
  --amber-bg:#fff7e6;
  --amber-line:#ffd591;
  /* 字号：13 基础 / 14 正文 / 20 标题（jshERP 表头 13px、表格 14px） */
  --fs-xs:12px;
  --fs-sm:13px;
  --fs:14px;
  --fs-md:15px;
  --fs-lg:16px;
  --fs-h2:17px;
  --fs-h1:20px;
  --num:tabular-nums;
  font:var(--fs)/1.5715 -apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Hiragino Sans GB','Microsoft YaHei',Helvetica,Arial,sans-serif
}

/* ---------------------------------------------------------------------------
   2. 基础元素
   ------------------------------------------------------------------------- */
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-size:var(--fs)}
h1{font-size:var(--fs-h1);line-height:1.4;font-weight:600;letter-spacing:.2px;margin:0 0 4px}
h2{font-size:var(--fs-h2);line-height:1.5;font-weight:600;margin:0}
h3{font-size:var(--fs-md);font-weight:600;margin:0 0 8px}
p{margin:0 0 12px}
a{color:var(--primary);text-decoration:none}
a:hover{color:var(--primary-hover)}
small{color:var(--muted)}
hr{border:0;border-top:1px solid var(--line);margin:18px 0}
code,kbd{font-family:Consolas,'Courier New',monospace;font-size:var(--fs-sm);background:#f5f7fa;border-radius:4px;padding:1px 5px}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.55}
button,input,select,textarea,a{outline-offset:2px}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--primary);outline-offset:1px}
[hidden]{display:none!important}

/* ---------------------------------------------------------------------------
   3. 按钮（对齐 ant-btn：默认描边、primary 实心、small 紧凑）
   ------------------------------------------------------------------------- */
button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  height:36px;
  padding:0 16px;
  background:var(--surface);
  color:var(--ink);
  border:1px solid var(--line-strong);
  border-radius:6px;
  font-size:var(--fs);
  font-weight:400;
  line-height:1;
  white-space:nowrap;
  transition:color .2s,border-color .2s,background .2s,box-shadow .2s
}
button:hover:not(:disabled){color:var(--primary);border-color:var(--primary);background:var(--surface)}
button:active:not(:disabled){color:var(--primary-active);border-color:var(--primary-active)}
button.small{height:30px;padding:0 11px;font-size:var(--fs-sm);border-radius:6px}
button.primary{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 2px 0 rgba(0,0,0,.02)}
button.primary:hover:not(:disabled){background:var(--primary-hover);border-color:var(--primary-hover);color:#fff}
button.primary:active:not(:disabled){background:var(--primary-active);border-color:var(--primary-active);color:#fff}
button.danger{background:var(--red);border-color:var(--red);color:#fff}
button.danger:hover:not(:disabled){background:#ff4d4f;border-color:#ff4d4f;color:#fff}
button.danger:disabled{background:#ffa39e;border-color:#ffa39e;color:#fff}
button.ghost{background:transparent}
button.block{width:100%}
/* 表格行内操作：仿 jshERP 的 <a>编辑</a> + a-divider 竖线 */
td button.small{height:28px;padding:0 9px;color:var(--primary);border-color:var(--line-strong);background:var(--surface)}
td button.small:hover:not(:disabled){background:var(--primary-1)}
.actions button.small{color:var(--ink)}
.operation-list button.small{color:var(--ink)}

/* ---------------------------------------------------------------------------
   4. 表单控件
   ------------------------------------------------------------------------- */
.card-head .search{display:inline-flex;align-items:center;width:260px;max-width:100%;margin:0}
.card-head .search input{width:100%;min-width:0}
.search{width:320px;max-width:100%}
.top-actions .topbar-toggle{display:none;width:32px;height:32px;padding:0;font-size:15px}
input,select,textarea{
  width:100%;
  min-width:0;
  min-height:36px;
  padding:6px 11px;
  background:var(--surface);
  color:var(--ink);
  border:1px solid var(--line-strong);
  border-radius:6px;
  font-size:var(--fs);
  transition:border-color .2s,box-shadow .2s
}
input:hover,select:hover,textarea:hover{border-color:#40a9ff}
input:focus,select:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 2px rgba(24,144,255,.2);outline:none}
input::placeholder,textarea::placeholder{color:var(--ink-3)}
input:disabled,select:disabled,textarea:disabled{background:#f5f5f5;color:rgba(0,0,0,.25);cursor:not-allowed}
input[readonly]{background:#fafafa}
input[type=checkbox],input[type=radio]{width:16px;height:16px;min-height:0;padding:0;margin:0;accent-color:var(--primary);vertical-align:-3px;flex:none}
select{cursor:pointer}
textarea{min-height:76px;line-height:1.6;resize:vertical;font-family:inherit}
input[type=file]{min-height:36px;padding:5px 11px;background:#fafafa}
input[type=month],input[type=date],input[type=datetime-local],input[type=time]{cursor:pointer}

/* 字段（.field） */
.field{display:grid;gap:4px;min-width:0}
.field label{font-size:var(--fs);font-weight:400;color:var(--ink-2)}
.field .required,.required{color:var(--red);margin-left:3px}
.field .hint,.hint{font-size:var(--fs-sm);color:var(--muted);font-weight:400}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px}
.form-grid .full,.full{grid-column:1/-1}
.form-error{color:var(--red);font-size:var(--fs-sm);white-space:pre-wrap}
.form-actions{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-top:22px;
  padding-top:16px;
  border-top:1px solid var(--line)
}
.form-actions .form-error{margin-left:4px}
/* 表单卡片内的分区（jshERP 用告警条/间距分段） */
.form-section{padding:16px 0;border-top:1px solid var(--line)}
.form-section:first-child{padding-top:0;border-top:0}
.form-section>h3{margin-bottom:12px}

/* 查询区（仿 jshERP .table-page-search-wrapper：白底卡片 + 内联表单） */
.search-bar,
.search-form{
  display:flex;
  gap:12px;
  align-items:flex-end;
  flex-wrap:wrap;
  padding:18px 20px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:8px;
  margin-bottom:16px
}
.search-bar .field,
.search-form .field{flex:0 1 auto;min-width:150px}
.search-bar .field.grow,
.search-form .field.grow{flex:1 1 220px}
.search-bar .search-buttons,
.search-form .search-buttons{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}
.search-bar>*,
.search-form>*{margin-top:0;margin-bottom:0}
.filter-select{width:150px}

/* ---------------------------------------------------------------------------
   5. 布局骨架（.shell：jshERP 固定侧边菜单 + 顶部 Header + 内容区）
   ------------------------------------------------------------------------- */
.shell{display:grid;grid-template-columns:210px minmax(0,1fr);min-height:100vh}
.sidebar{
  background:#12263f;
  color:rgba(255,255,255,.75);
  padding:0 0 24px;
  display:flex;
  flex-direction:column;
  position:sticky;
  top:0;
  height:100vh;
  overflow-y:auto
}
.sidebar::-webkit-scrollbar{width:6px;height:6px}
.sidebar::-webkit-scrollbar-thumb{background:rgba(255,255,255,.22);border-radius:6px}
.brand{
  display:flex;
  align-items:center;
  gap:10px;
  height:56px;
  padding:0 16px;
  margin:0 0 10px;
  background:#0d1d31;
  color:#fff;
  font-size:var(--fs-lg);
  font-weight:600;
  letter-spacing:.5px;
  flex:none
}
.logo{
  width:30px;
  height:30px;
  border-radius:6px;
  display:grid;
  place-items:center;
  background:var(--primary);
  color:#fff;
  font-size:var(--fs-lg);
  font-weight:600;
  flex:none
}
.brand small{display:block;color:rgba(255,255,255,.45);font-size:var(--fs-xs);letter-spacing:1px;font-weight:400}
.nav{display:grid;gap:2px;padding:4px 0}
.nav-group{
  padding:14px 16px 6px;
  font-size:var(--fs-xs);
  letter-spacing:1px;
  color:rgba(255,255,255,.38);
  font-weight:400
}
.nav button{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  height:40px;
  padding:0 16px;
  text-align:left;
  border:0;
  border-radius:0;
  background:transparent;
  color:rgba(255,255,255,.75);
  font-size:var(--fs);
  font-weight:400
}
.nav button:hover:not(:disabled){background:transparent;color:#fff;background:rgba(255,255,255,.08)}
.nav button[aria-current=page]{background:var(--primary);color:#fff;font-weight:500}
.nav button[aria-current=page]:hover{background:var(--primary)}
.nav-icon{width:16px;flex:none;text-align:center;font-size:13px;opacity:.85}
.nav button[aria-current=page] .nav-icon{opacity:1}
.side-note{margin-top:auto;padding:24px 16px 0;color:rgba(255,255,255,.45);font-size:var(--fs-sm);line-height:1.8}
.side-note strong{display:block;color:rgba(255,255,255,.85);font-weight:500}

.main{min-width:0;display:flex;flex-direction:column}
/* 顶部 Header：仿 jshERP .layout .header（白底 + 0 1px 4px rgba(0,21,41,.08)） */
.topbar{
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:0 24px;
  background:var(--surface);
  border-bottom:1px solid var(--line);
  box-shadow:0 1px 4px rgba(0,21,41,.06);
  position:sticky;
  top:0;
  z-index:12
}
.crumb{color:var(--muted);font-size:var(--fs);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.crumb strong{color:var(--ink);font-weight:500;margin-left:6px}
.top-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.top-actions .hint{font-size:var(--fs-sm);color:var(--muted)}
.top-actions .account-link{display:inline-flex;align-items:center;height:30px;padding:0 4px}
.topbar-toggle{display:none}
.save-state{font-size:var(--fs-sm);color:var(--green)}
/* 内容区：仿 jshERP .content 的 24px 外边距 */
main{padding:20px 24px 48px;max-width:1560px;width:100%;margin:0 auto;min-width:0}

.page-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:16px}
.page-head .subtext{margin-top:2px}
.page-head .actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.subtext,.muted{color:var(--muted)}
.subtext{font-size:var(--fs-sm);margin:0}
.actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.inline-head{display:flex;gap:10px;align-items:center;flex-wrap:wrap}

/* ---------------------------------------------------------------------------
   6. 卡片 / 指标 / 标签
   ------------------------------------------------------------------------- */
.card{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:8px;
  margin-bottom:16px;
  overflow:hidden
}
.card-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  min-height:52px;
  padding:12px 20px;
  border-bottom:1px solid var(--line)
}
.card-body{padding:20px}
.card-body>:last-child{margin-bottom:0}
.card-foot{
  padding:12px 20px;
  border-top:1px solid var(--line);
  background:var(--surface-head);
  font-size:var(--fs-sm);
  color:var(--muted);
  display:flex;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap
}
/* 指标卡：仿 jshERP 仪表盘卡片 */
.metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-bottom:16px}
.metric{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:8px;
  padding:18px 20px
}
.metric-label{font-size:var(--fs-sm);color:var(--muted)}
.metric-value{
  font-size:26px;
  line-height:1.45;
  font-weight:600;
  font-variant-numeric:var(--num);
  color:var(--ink);
  overflow-wrap:anywhere;
  letter-spacing:-.2px
}
.metric-value small{font-size:var(--fs-sm);font-weight:400;margin-left:5px;color:var(--muted)}
.metric-note{font-size:var(--fs-xs);color:var(--ink-3);margin-top:2px}
.metric.main-metric{background:var(--primary);border-color:var(--primary)}
.metric.main-metric .metric-label,.metric.main-metric .metric-note{color:rgba(255,255,255,.85)}
.metric.main-metric .metric-value{color:#fff}

.badge{
  display:inline-flex;
  align-items:center;
  height:22px;
  padding:0 8px;
  border-radius:4px;
  background:var(--primary-1);
  border:1px solid var(--primary-2);
  color:#096dd9;
  font-size:var(--fs-xs);
  font-weight:400;
  white-space:nowrap;
  vertical-align:middle;
  margin:0 4px 0 0
}
.demo-badge{background:#fff7e6;border-color:#ffd591;color:#d46b08}
.flow-in{background:var(--green-bg);border-color:var(--green-line);color:var(--green)}
.flow-out{background:#fff2e8;border-color:#ffbb96;color:#d4380d}
.status-void{background:#fafafa;border-color:#e8e8e8;color:rgba(0,0,0,.45)}
.status-disabled{background:#fffbe6;border-color:#ffe58f;color:#ad6800}

/* 提示条：仿 ant-alert */
.notice{
  padding:9px 14px;
  border-radius:6px;
  font-size:var(--fs);
  line-height:1.6;
  background:var(--primary-1);
  border:1px solid var(--primary-2);
  color:#0050b3;
  margin-bottom:16px
}
.notice:empty{display:none}
.notice.warning{background:var(--amber-bg);border-color:var(--amber-line);color:#ad4e00}
.notice.error{background:var(--red-bg);border-color:var(--red-line);color:var(--red)}
.notice a{font-weight:500}

/* ---------------------------------------------------------------------------
   7. 数据表格：仿 jshERP 的 ant-table（表头灰底 13px、行距 15px、行悬浮高亮）
   ------------------------------------------------------------------------- */
.table-wrap{
  overflow:auto;
  max-width:100%;
  border-top:1px solid var(--line);
  background:var(--surface)
}
.card-head+.table-wrap,.card-body+.table-wrap{border-top:1px solid var(--line)}
.table-wrap:last-child{border-bottom-left-radius:8px;border-bottom-right-radius:8px}
table{border-collapse:separate;border-spacing:0;width:100%;text-align:left;font-size:var(--fs)}
th{
  position:sticky;
  top:0;
  z-index:2;
  background:var(--surface-head);
  color:var(--ink-2);
  font-size:var(--fs-sm);
  font-weight:500;
  padding:11px 16px;
  border-bottom:1px solid var(--line);
  white-space:nowrap;
  vertical-align:middle
}
td{
  padding:15px 16px;
  border-bottom:1px solid var(--line);
  vertical-align:middle;
  color:var(--ink)
}
tbody tr{transition:background .2s}
tbody tr:hover{background:var(--surface-hover)}
tbody tr:last-child td{border-bottom:0}
table caption{text-align:left}
.num{text-align:right;font-variant-numeric:var(--num);white-space:nowrap}
.strong{font-weight:600}
.product-name{font-weight:500}
.product-code{font-family:Consolas,'Courier New',monospace;color:var(--ink-2)}
.stock{color:var(--green);font-weight:600}
.empty-stock{color:var(--amber)}
.empty{
  padding:48px 20px!important;
  text-align:center;
  color:var(--ink-3);
  white-space:normal;
  font-size:var(--fs)
}
.table-note{max-width:260px;white-space:normal;overflow-wrap:anywhere;font-size:var(--fs-sm);color:var(--muted)}
.table-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  padding:12px 16px;
  border-top:1px solid var(--line);
  background:var(--surface);
  font-size:var(--fs-sm);
  color:var(--muted)
}
.operation-list{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
td img{max-height:56px;border-radius:4px;border:1px solid var(--line);vertical-align:middle}
/* 分页条：仿 ant-pagination（右下角 + 小尺寸） */
.pager{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
  padding:12px 16px;
  border-top:1px solid var(--line);
  font-size:var(--fs-sm);
  color:var(--muted)
}
.pager button{height:28px;padding:0 10px;font-size:var(--fs-sm)}
.pager button:not(:disabled):hover{color:var(--primary);border-color:var(--primary)}
.pager span,.pager #pagination,.pager #private-page,.pager #sku-page,.pager #line-page,.pager #adjust-page,.pager #history-page{font-variant-numeric:var(--num)}
/* 定位高亮（全局商品搜索跳转） */
tr.search-located td{background:#fffbe6!important}
tr.search-located{box-shadow:inset 0 0 0 2px var(--primary);scroll-margin-block:24px}

/* ---------------------------------------------------------------------------
   8. 表单页 / 详情页布局
   ------------------------------------------------------------------------- */
.form-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(260px,1fr);gap:16px;align-items:start}
.form-layout .card{margin-bottom:0}
.preview-list{display:grid;gap:12px;margin:14px 0 0}
.preview-list div{display:flex;align-items:baseline;justify-content:space-between;gap:16px;font-size:var(--fs)}
.preview-list dt{color:var(--muted);font-size:var(--fs-sm);flex:none}
.preview-list dd{margin:0;font-weight:600;text-align:right;overflow-wrap:anywhere;font-variant-numeric:var(--num)}
.preview-list .highlight{border-top:1px solid var(--line);padding-top:14px;color:var(--primary)}
.preview-list .highlight dd{font-size:20px}
.rule{margin-top:16px;padding-top:14px;border-top:1px dashed var(--line);font-size:var(--fs-sm);color:var(--muted);line-height:1.7}
.rule strong{display:block;color:var(--ink-2);margin-bottom:4px;font-weight:500}
.rule p:last-child{margin-bottom:0}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:14px 0}
.facts p{margin:0;padding:12px 14px;background:var(--surface-head);border:1px solid var(--line);border-radius:6px;font-size:var(--fs)}
.facts strong{font-variant-numeric:var(--num)}
.issues{margin:0 0 12px;color:var(--amber);font-size:var(--fs-sm);line-height:1.8}
.issues:empty{display:none}
.footnote{font-size:var(--fs-sm);color:var(--muted);margin-top:12px}
.help-text{font-size:var(--fs);line-height:1.75;color:var(--ink-2)}
.help-text p:last-child{margin-bottom:0}
.code-box{
  overflow-wrap:anywhere;
  font-family:Consolas,'Courier New',monospace;
  background:var(--surface-head);
  border:1px solid var(--line);
  padding:10px 12px;
  border-radius:6px;
  font-size:var(--fs-sm);
  margin:12px 0
}
.record-detail{
  white-space:pre-wrap;
  word-break:break-word;
  background:var(--surface-head);
  border:1px solid var(--line);
  padding:12px 14px;
  border-radius:6px;
  font:var(--fs-sm)/1.7 Consolas,'Microsoft YaHei',monospace;
  margin:8px 0 16px
}
.audit-item{padding:14px 0;border-bottom:1px solid var(--line)}
.audit-item:last-child{border-bottom:0}
.audit-pair{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.audit-label{font-size:var(--fs-sm);font-weight:500;color:var(--muted)}
.impact-total{margin:12px 0;font-size:var(--fs);color:var(--ink-2)}
.impact-total strong{font-variant-numeric:var(--num)}
.steps{padding-left:20px;color:var(--muted);font-size:var(--fs)}
.steps li{margin:8px 0}
.backup-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.backup-grid .card{margin-bottom:0}
.backup-select{display:block;margin:14px 0}
.check-line{display:flex;gap:10px;align-items:flex-start;margin-top:16px;font-size:var(--fs);line-height:1.6}
.check-line input{margin-top:3px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* 全局商品搜索：仿 jshERP 顶部全局搜索的下拉结果面板 */
.global-product-search{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:8px;
  margin-bottom:16px;
  padding:14px 18px
}
#product-search-form{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
#product-search-form label{font-weight:500;white-space:nowrap;font-size:var(--fs);color:var(--ink-2)}
#global-product-query{flex:1 1 240px;width:auto;min-width:160px}
#product-search-count{margin:12px 0 6px;color:var(--muted);font-size:var(--fs-sm)}
.search-result-list{max-height:340px;overflow:auto;border-top:1px solid var(--line)}
.product-search-hit{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  width:100%;
  height:auto;
  padding:11px 6px;
  text-align:left;
  border:0;
  border-bottom:1px solid var(--line);
  border-radius:0;
  background:transparent;
  font-weight:500
}
.product-search-hit:hover:not(:disabled){background:var(--surface-hover);border-color:var(--line)}
.product-search-hit strong{overflow-wrap:anywhere;font-weight:500}
.search-hit-detail{display:block;font-weight:400;color:var(--muted);font-size:var(--fs-sm);overflow-wrap:anywhere}
.search-hit-destination{color:var(--primary);font-size:var(--fs-sm);white-space:nowrap}
#product-search-more{margin-top:10px}

/* ---------------------------------------------------------------------------
   9. 对话框（新增 / 编辑弹窗：仿 jshERP JModal —— 固定最大高度、内容区滚动）
   ------------------------------------------------------------------------- */
dialog{
  display:none;
  border:0;
  border-radius:8px;
  width:560px;
  max-width:calc(100vw - 32px);
  max-height:calc(100vh - 96px);
  padding:0;
  color:var(--ink);
  box-shadow:0 6px 16px rgba(0,0,0,.12),0 3px 6px -4px rgba(0,0,0,.12);
  overflow:hidden
}
dialog[open]{display:flex;flex-direction:column}
dialog::backdrop{background:rgba(0,0,0,.45)}
dialog>h2{
  margin:0;
  padding:15px 20px;
  border-bottom:1px solid var(--line);
  font-size:var(--fs-lg);
  font-weight:500
}
dialog>h3{margin:16px 20px 0}
dialog>p,dialog>.help-text,dialog>.notice,dialog>.field,dialog>.table-wrap{margin-left:20px;margin-right:20px}
dialog>.notice{margin-top:14px}
dialog>.field{margin-top:14px}
/* 弹窗内容滚动（与 ant-modal-cust-warp .ant-modal-body 一致的做法：头部固定、内容滚动、底部固定） */
dialog>.dialog-scroll{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  padding:20px
}
dialog>form>.dialog-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;padding:20px}
dialog>form{display:flex;flex-direction:column;min-height:0;flex:1 1 auto;margin:0}
dialog>.dialog-scroll>h3:first-child{margin-top:0}
.dialog-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
  padding:12px 20px;
  border-top:1px solid var(--line);
  background:var(--surface)
}
/* 表单型弹窗：标签在左、控件在右（仿 ant-form horizontal） */
.modal-form{display:grid;gap:14px}
.modal-form .field{grid-template-columns:120px minmax(0,1fr);align-items:center;gap:4px 14px}
.modal-form .field>label{text-align:right;color:var(--ink-2);font-size:var(--fs)}
.modal-form .field .hint,.modal-form .field .form-error{grid-column:2}
.modal-form .field.full{grid-template-columns:120px minmax(0,1fr)}
@media(max-width:560px){
  .modal-form .field{grid-template-columns:1fr}
  .modal-form .field>label{text-align:left}
  .modal-form .field .hint,.modal-form .field .form-error{grid-column:auto}
}
.wide-dialog{width:920px}
/* 弹窗内部的表格与表单（如商品新增/编辑） */
dialog .table-wrap{border:1px solid var(--line);border-radius:6px}
dialog form{margin:0}
dialog .form-actions{margin-top:0;padding:12px 20px;border-top:1px solid var(--line);background:var(--surface)}
/* 商品新增/编辑：表单直接从 card 变成弹窗内的表单块 */
#page-products dialog .card,
#product-dialog .card{border:0;border-radius:0;margin:0;overflow:visible}
#page-products dialog .card>.card-head,
#product-dialog .card>.card-head{display:none}
#page-products dialog .card>.card-body,
#product-dialog .card>.card-body{padding:20px}
.demo-selection{max-height:300px;overflow:auto;border:1px solid var(--line);border-radius:6px;margin:14px 20px 0}
.demo-selection label{display:flex;gap:10px;align-items:flex-start;padding:10px 14px;border-bottom:1px solid var(--line);font-size:var(--fs);margin:0}
.demo-selection label:last-child{border-bottom:0}
.demo-selection h3{padding:9px 14px;background:var(--surface-head);margin:0;font-size:var(--fs);border-bottom:1px solid var(--line)}
.demo-selection h3:not(:first-child){border-top:1px solid var(--line)}

/* Toast：仿 ant-message */
.toast{
  position:fixed;
  top:16px;
  left:50%;
  bottom:auto;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  gap:8px;
  max-width:90vw;
  padding:9px 16px;
  background:var(--surface);
  color:var(--ink);
  border:1px solid var(--line);
  border-left:3px solid var(--green);
  border-radius:6px;
  box-shadow:0 3px 6px -4px rgba(0,0,0,.12),0 6px 16px rgba(0,0,0,.08);
  font-size:var(--fs);
  z-index:60
}

/* ---------------------------------------------------------------------------
   10. 登录 / 账号 / 私有空间等简洁页
   ------------------------------------------------------------------------- */
.account-link{color:var(--primary);font-size:var(--fs);white-space:nowrap}
.auth-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(180deg,#f0f5ff 0%,var(--bg) 45%)}
.auth-card{
  width:400px;
  max-width:100%;
  padding:32px 32px 28px;
  background:var(--surface);
  border-radius:8px;
  box-shadow:0 6px 16px rgba(0,0,0,.08),0 9px 28px 8px rgba(0,0,0,.05)
}
.auth-card .field{margin:0 0 16px}
.auth-card .primary{width:100%;margin-top:8px;height:40px}
.auth-brand{color:var(--primary);font-size:20px;font-weight:600;margin-bottom:8px;letter-spacing:.5px}
.auth-card h1{font-size:18px;margin-bottom:6px}
.account-main{max-width:1040px;margin:0 auto;padding:20px 24px 48px}
.account-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.account-grid .field{margin-bottom:14px}
.account-nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin:0 0 16px;
  padding:10px 14px;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:8px;
  font-size:var(--fs)
}
.account-nav a{display:inline-flex;align-items:center;height:30px;padding:0 4px}
.account-nav a+a{margin-left:12px}
.inline-message{font-size:var(--fs);margin:12px 0 0;color:var(--red);white-space:pre-wrap}
.inline-message:empty{display:none}
.auth-card fieldset{border:1px solid var(--line);border-radius:6px;margin:16px 0;padding:14px 16px}
.auth-card legend{font-weight:500;font-size:var(--fs);padding:0 6px}
#private-form .field{margin-bottom:16px}
#private-content{min-height:0;width:100%}
#private-search-form{display:flex;gap:8px;align-items:center}
#private-search{max-width:280px}
#private-rows td{overflow-wrap:anywhere}

/* ---------------------------------------------------------------------------
   11. 响应式（对齐 jshERP 的 mobile 断点处理：侧栏抽屉化、查询区堆叠）
   ------------------------------------------------------------------------- */
@media(min-width:1800px){
  main{padding:24px 32px 56px}
}
@media(max-width:1180px){
  .shell{grid-template-columns:186px minmax(0,1fr)}
  main{padding:18px 18px 40px}
  .topbar{padding:0 18px}
  .form-layout{grid-template-columns:1fr}
  .form-layout .card{margin-bottom:16px}
  .metric-value{font-size:23px}
}
@media(max-width:992px){
  .backup-grid,.account-grid,.audit-pair{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
  .form-grid .full,.full{grid-column:auto}
}
@media(max-width:760px){
  .shell{display:block}
  .sidebar{
    position:fixed;
    inset:0 auto 0 0;
    width:230px;
    height:100vh;
    z-index:40;
    transform:translateX(-100%);
    transition:transform .25s ease
  }
  .shell.nav-open .sidebar{transform:none;box-shadow:2px 0 12px rgba(0,21,41,.35)}
  .nav{grid-auto-rows:min-content}
  .nav button{width:100%}
  .topbar-toggle{display:inline-flex}
  .crumb{display:none}
  .topbar{padding:8px 12px;flex-wrap:wrap;gap:8px}
  .top-actions{width:100%;justify-content:space-between;gap:8px}
  .top-actions .save-state{order:9}
  main{padding:14px 12px 36px}
  .page-head{flex-direction:column;align-items:stretch}
  .metrics{grid-template-columns:1fr;gap:12px}
  .metric-value{font-size:22px}
  .card-head,.card-body{padding:14px}
  .card-head{gap:10px}
  .card-head .search,.card-head select,.card-head input{width:100%}
  .search-bar,
  .search-form{padding:14px}
  .search-bar .field,
  .search-form .field{flex:1 1 100%}
  .search-bar .search-buttons,
  .search-form .search-buttons{margin-left:0;width:100%}
  th,td{padding:11px 12px}
  .table-wrap{overflow-x:auto}
  .table-wrap table{min-width:720px}
  .preview-list dd{font-size:var(--fs-md)}
  dialog{width:calc(100vw - 20px);max-height:calc(100vh - 40px)}
  dialog>.dialog-scroll{padding:14px}
  .dialog-actions{padding:10px 14px}
}