/* MEISYOU JAPAN 仓库系统：统一的样式（在 Tabler 之上）
   品牌（2026-09-30）：logo 纯蓝 #0000FF；按钮、选中用稍深一点的 #0010DD（白字对比度够）；左边菜单是深藏青。
   原则：
   - 照顾年纪大的同事：正文 17px，按钮至少 44px 高，颜色旁边一定有文字；
   - 字号只用几档（标题 28 / 小标题 19 / 正文 17 / 次要 15），不在页面里随手写大小；
   - 按钮分主次：每块只有一个实心的“主要操作”，其他是白底描边；危险操作是红色描边。 */

:root {
  --m-bg: #f2f4f8;
  --m-surface: #fff;
  --m-subtle: #f8fafc;
  --m-border: #e1e6ee;
  --m-border-strong: #c9d1dd;
  --m-text: #18222f;
  --m-muted: #5a6778;
  --m-faint: #8793a4;
  --m-primary: #0010DD;
  --m-primary-soft: #ECEEFF;
  --m-red: #d23a3a;   --m-red-soft: #fdeeee;   --m-red-text: #a82626;
  --m-amber: #e08a00; --m-amber-soft: #fff3de; --m-amber-text: #8f5600;
  --m-green: #2c9a47; --m-green-soft: #e6f5ea; --m-green-text: #1d7434;
  --m-blue-text: #000FC0;
  --m-purple: #7048c6; --m-purple-soft: #f1ecfb;
  --m-gray-soft: #eef1f5;
  --m-radius: 12px;
  --m-radius-sm: 8px;
  --m-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 1px 3px rgba(16, 24, 40, .05);
  --m-side: 232px;

  --tblr-primary: #0010DD;
  --tblr-primary-rgb: 0, 16, 221;
  --tblr-primary-darken: #000CB0;
  --tblr-primary-lt: #ECEEFF;
  --tblr-font-sans-serif: "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", "Noto Sans CJK SC", "Hiragino Sans", -apple-system, "Segoe UI", sans-serif;
  --tblr-body-font-size: 1.0625rem;
  --tblr-body-line-height: 1.6;
  --tblr-body-color: #18222f;
  --tblr-border-color: #e1e6ee;
  --tblr-border-color-translucent: #e1e6ee;
  --tblr-border-radius: 8px;
  --tblr-link-color: #0010DD;
  --tblr-link-color-rgb: 0, 16, 221;
}
html { font-size: 16px; }
body { background: var(--m-bg); color: var(--m-text); font-size: 1.0625rem; line-height: 1.6;
       -webkit-font-smoothing: antialiased; }
a { text-decoration: none; }
b, strong, .fw-bold { font-weight: 600 !important; }
.muted { color: var(--m-muted); }
.faint { color: var(--m-faint); }
.small, small { font-size: .9375rem; }
.tiny { font-size: .875rem; }
.num-font { font-variant-numeric: tabular-nums; }
.text-red { color: var(--m-red-text) !important; }
.text-amber { color: var(--m-amber-text) !important; }
.text-green { color: var(--m-green-text) !important; }
.text-blue { color: var(--m-blue-text) !important; }
.mono { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: .95em; letter-spacing: .01em; }
.break { word-break: break-all; }

/* ---------- 整体布局：左边导航 + 右边内容 ---------- */
.app { display: flex; min-height: 100vh; }
.side { width: var(--m-side); flex: 0 0 var(--m-side); background: #0A0F33; color: #CDD2F2;
        display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh;
        overflow-y: auto; overscroll-behavior: contain;               /* 窗口矮、菜单多时可以滚动，底部的按钮不会被截掉 */
        scrollbar-width: thin; scrollbar-color: #262C66 transparent; }
.side::-webkit-scrollbar { width: 6px; }
.side::-webkit-scrollbar-thumb { background: #262C66; border-radius: 3px; }
.side-nav, .side-brand, .side-user { flex-shrink: 0; }
.side-brand { display: flex; flex-direction: column; align-items: flex-start; gap: .55rem; padding: 1.35rem 1.25rem 1.4rem; color: #fff; }
.side-brand .brand-logo { height: 40px; width: auto; display: block; }
.side-brand .brand-sub { display: flex; align-items: baseline; gap: .6rem; font-size: .8125rem; color: #9097C9; line-height: 1.2; white-space: nowrap; }
.side-brand .brand-sub .jp { color: #fff; font-weight: 700; letter-spacing: .34em; }
.side-nav { display: flex; flex-direction: column; gap: .25rem; padding: 0 .75rem; }
.side-label { font-size: .8125rem; color: #7880B8; padding: 1rem .75rem .35rem; }
.side-link { display: flex; align-items: center; gap: .75rem; padding: .7rem .85rem; border-radius: 10px; line-height: 1.35;
             color: #CDD2F2; font-size: 1.0625rem; font-weight: 500; white-space: nowrap; letter-spacing: -.01em; }
.side-link i { font-size: 1.2rem; width: 1.3rem; text-align: center; color: #9097C9; line-height: 1; }
.side-link:hover { background: rgba(255, 255, 255, .06); color: #fff; }
.side-link.active { background: #0010DD; color: #fff; }
.side-link.active i { color: #fff; }
.side-user { margin-top: auto; padding: 1rem; border-top: 1px solid rgba(255, 255, 255, .08); }
.side-user .who { display: flex; align-items: center; gap: .7rem; }
.side-user .avatar { width: 38px; height: 38px; border-radius: 50%; background: #262C66; color: #fff; display: grid;
                     place-items: center; font-weight: 600; flex: 0 0 auto; }
.side-user .uname { color: #fff; font-weight: 600; line-height: 1.25; }
.side-user .urole { font-size: .875rem; color: #9097C9; }
.side-user .logout { display: flex; align-items: center; justify-content: center; gap: .4rem; margin-top: .85rem;
                     padding: .5rem; border-radius: 8px; border: 1px solid rgba(255, 255, 255, .14); color: #CDD2F2; font-size: .9375rem; }
.side-user .logout:hover, .side-user .logout.on { background: rgba(255, 255, 255, .08); color: #fff; }
.side-user .user-links { display: flex; gap: .5rem; }
.lang-switch { display: flex; margin-top: .85rem; border: 1px solid rgba(255, 255, 255, .14); border-radius: 8px; overflow: hidden; }
.lang-switch button { flex: 1 1 0; background: none; border: 0; color: #CDD2F2; padding: .4rem; font-size: .9375rem; cursor: pointer;  white-space: nowrap; }
.lang-switch button.on { background: rgba(255, 255, 255, .14); color: #fff; font-weight: 600; }
.lang-switch button:hover { color: #fff; }
.side-user .user-links .logout { flex: 1 1 0; white-space: nowrap; font-size: .875rem; padding: .5rem .3rem; gap: .3rem; }
@media (min-width: 992px) and (max-height: 940px) {                /* 矮窗口（笔记本、浏览器开了书签栏）：菜单收紧一点，一屏放得下 */
  .side-brand { padding: .8rem 1.25rem .85rem; gap: .4rem; }
  .side-brand .brand-logo { height: 32px; }
  .side-nav { gap: .15rem; }
  .side-label { padding: .5rem .75rem .15rem; }
  .side-link { padding: .5rem .85rem; }
  .side-user { padding: .7rem 1rem .6rem; }
  .side-user .logout { margin-top: .5rem; }
  .side-ver { margin-top: .35rem; }
}

.main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.pagehead { background: var(--m-surface); border-bottom: 1px solid var(--m-border); }
.pagehead .inner, .content { max-width: 1360px; width: 100%; margin: 0 auto; padding-left: 2rem; padding-right: 2rem; }
.pagehead .inner { padding-top: 1.1rem; padding-bottom: 1.25rem; }
.content { padding-top: 1.5rem; padding-bottom: 3rem; }
.crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; font-size: .9375rem; color: var(--m-muted); margin-bottom: .35rem; }
.crumbs a { color: var(--m-muted); }
.crumbs a:hover { color: var(--m-primary); }
.crumbs i { font-size: .75rem; color: var(--m-faint); }
.head-row { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.head-row .grow { flex: 1 1 auto; min-width: 0; }
.title { font-size: 1.75rem; font-weight: 700; line-height: 1.3; margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; word-break: break-all; }
.meta { color: var(--m-muted); font-size: .9375rem; margin-top: .3rem; display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; }
.meta i { margin-right: .3rem; }
.head-actions { display: flex; flex-wrap: wrap; gap: .6rem; }

@media (max-width: 991.98px) {                                   /* 窄屏（平板、手机）：左边菜单变成顶部一条 */
  .app { flex-direction: column; }
  .side { width: 100%; flex: none; height: auto; position: static; flex-direction: row; align-items: center; flex-wrap: wrap;
          overflow: visible; }
  .side-brand { padding: .7rem 1rem; flex-direction: row; align-items: center; gap: .75rem; }
  .side-brand .brand-logo { height: 28px; }
  .side-nav { flex: 1 1 100%; min-width: 0; flex-direction: row; flex-wrap: nowrap; padding: .25rem .5rem .5rem;
              overflow-x: auto; scrollbar-width: none; }                  /* 菜单放不下：左右滑动，不会被截掉 */
  .side-nav::-webkit-scrollbar { display: none; }
  .side-link { flex: 0 0 auto; }
  .side-label { display: none; }
  .side-user { flex: 1 1 100%; margin: 0; border-top: 1px solid rgba(255, 255, 255, .08); padding: .5rem 1rem;
               display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; }  /* 放不下就换行，退出按钮不会被挤掉 */
  .side-user .who { margin-right: auto; }
  .side-user .logout { margin: 0; }
  .side-user .user-links { margin: 0; }
  .side-ver { margin: 0; }
  .pagehead .inner, .content { padding-left: 1rem; padding-right: 1rem; }
}

/* ---------- 卡片 ---------- */
.card { --tblr-card-border-color: var(--m-border); --tblr-card-border-radius: var(--m-radius);
        --tblr-card-box-shadow: var(--m-shadow); --tblr-card-spacer-x: 1.5rem; --tblr-card-spacer-y: 1.25rem;
        --tblr-card-cap-bg: var(--m-surface); --tblr-card-cap-padding-x: 1.5rem; --tblr-card-cap-padding-y: 1rem; }
.card + .card { margin-top: 0; }
.card-header { min-height: 3.5rem; }
.card-title { font-size: 1.1875rem; font-weight: 650; margin: 0; display: flex; align-items: center; gap: .5rem; }
.card-title i { color: var(--m-muted); }
.card-footer { background: var(--m-subtle); border-top: 1px solid var(--m-border); }
.section-title { font-size: 1.1875rem; font-weight: 650; margin: 0 0 .75rem; display: flex; align-items: center; gap: .5rem; }
.section-title i { color: var(--m-muted); }
.stack { display: flex; flex-direction: column; gap: 1rem; }

/* ---------- 按钮 ---------- */
.btn { --tblr-btn-font-size: 1rem; --tblr-btn-font-weight: 600; --tblr-btn-padding-x: 1.1rem; --tblr-btn-padding-y: .55rem;
       --tblr-btn-border-radius: 8px; min-height: 44px; gap: .45rem; box-shadow: none; }
.btn i { font-size: 1.1em; }
.btn-lg { --tblr-btn-font-size: 1.125rem; --tblr-btn-padding-x: 1.5rem; --tblr-btn-padding-y: .7rem; min-height: 52px; }
.btn-sm { --tblr-btn-font-size: .9375rem; --tblr-btn-padding-x: .8rem; --tblr-btn-padding-y: .3rem; min-height: 36px; }
.btn-primary { --tblr-btn-bg: var(--m-primary); --tblr-btn-hover-bg: #000CB0; --tblr-btn-active-bg: #000CB0; }
.btn-success { --tblr-btn-bg: var(--m-green); --tblr-btn-hover-bg: #238039; --tblr-btn-active-bg: #238039;
               --tblr-btn-color: #fff; --tblr-btn-hover-color: #fff; --tblr-btn-border-color: transparent; }
.btn-white, .btn-outline-secondary { --tblr-btn-bg: #fff; --tblr-btn-color: var(--m-text); --tblr-btn-border-color: var(--m-border-strong);
       --tblr-btn-hover-bg: var(--m-subtle); --tblr-btn-hover-color: var(--m-text); --tblr-btn-hover-border-color: #aeb8c7;
       --tblr-btn-active-bg: var(--m-gray-soft); --tblr-btn-active-color: var(--m-text); }
.btn-outline-primary { --tblr-btn-bg: #fff; --tblr-btn-color: var(--m-blue-text); --tblr-btn-border-color: #A8B0F5;
       --tblr-btn-hover-bg: var(--m-primary-soft); --tblr-btn-hover-color: var(--m-blue-text); --tblr-btn-hover-border-color: #7A86F0;
       --tblr-btn-active-bg: var(--m-primary-soft); --tblr-btn-active-color: var(--m-blue-text); }
.btn-outline-danger { --tblr-btn-bg: #fff; --tblr-btn-color: var(--m-red-text); --tblr-btn-border-color: #eab3b3;
       --tblr-btn-hover-bg: var(--m-red-soft); --tblr-btn-hover-color: var(--m-red-text); --tblr-btn-hover-border-color: #de8e8e;
       --tblr-btn-active-bg: var(--m-red-soft); --tblr-btn-active-color: var(--m-red-text); }
.btn-ghost { --tblr-btn-bg: transparent; --tblr-btn-color: var(--m-muted); --tblr-btn-border-color: transparent;
       --tblr-btn-hover-bg: var(--m-gray-soft); --tblr-btn-hover-color: var(--m-text); --tblr-btn-hover-border-color: transparent;
       --tblr-btn-active-bg: var(--m-gray-soft); }
.btn-done { --tblr-btn-bg: var(--m-green); --tblr-btn-color: #fff; --tblr-btn-border-color: var(--m-green); }
.btn-link-plain { background: none; border: 0; padding: 0; color: var(--m-primary); font-weight: 500; cursor: pointer; }
.btn-link-plain:hover { text-decoration: underline; }

/* ---------- 状态小标签（颜色 + 图标 + 文字） ---------- */
.chip { display: inline-flex; align-items: center; gap: .3rem; padding: .18rem .6rem; border-radius: 999px; font-size: .9375rem;
        font-weight: 600; line-height: 1.5; white-space: nowrap; background: var(--m-gray-soft); color: var(--m-muted); }
.chip i { font-size: .95em; }
.chip-red { background: var(--m-red-soft); color: var(--m-red-text); }
.chip-amber { background: var(--m-amber-soft); color: var(--m-amber-text); }
.chip-green { background: var(--m-green-soft); color: var(--m-green-text); }
.chip-blue { background: var(--m-primary-soft); color: var(--m-blue-text); }
.chip-purple { background: var(--m-purple-soft); color: var(--m-purple); }
.chip-solid-red { background: var(--m-red); color: #fff; }
.chip-solid-amber { background: var(--m-amber); color: #fff; }
.chip-lg { font-size: 1rem; padding: .3rem .8rem; }
.chips { display: inline-flex; flex-wrap: wrap; gap: .35rem; }

/* ---------- 提示条 ---------- */
.notice { display: flex; align-items: flex-start; gap: .75rem; padding: .9rem 1.1rem; border-radius: var(--m-radius-sm);
          border: 1px solid; margin-bottom: 1rem; font-size: 1.0625rem; }
.notice > i { font-size: 1.3rem; line-height: 1.3; }
.notice .grow { flex: 1 1 auto; }
.notice-ok { background: var(--m-green-soft); border-color: #bfe3c8; color: #17602b; }
.notice-err { background: var(--m-red-soft); border-color: #f1c2c2; color: #8e1f1f; }
.notice-warn { background: var(--m-amber-soft); border-color: #f3d9a6; color: #7a4a00; }
.notice-info { background: var(--m-primary-soft); border-color: #c6d9f5; color: #1a4a93; }
.notice .close { background: none; border: 0; color: inherit; opacity: .6; font-size: 1.2rem; line-height: 1; padding: 0 .2rem; cursor: pointer; }
.notice .close:hover { opacity: 1; }

/* ---------- 表格 ---------- */
.table { --tblr-table-color: var(--m-text); font-size: 1rem; margin: 0; }
.table > :not(caption) > * > * { padding: .8rem 1rem; border-bottom-color: var(--m-border); }
.table thead th { background: var(--m-subtle); color: var(--m-muted); font-size: .9375rem; font-weight: 600;
                  text-transform: none; letter-spacing: 0; white-space: nowrap; padding-top: .65rem; padding-bottom: .65rem; }
.table tbody tr:last-child > * { border-bottom: 0; }
.table-hover > tbody > tr:hover > * { --tblr-table-bg-state: #f5f9ff; }
.table .sub { color: var(--m-muted); font-size: .9375rem; }
.row-link { cursor: pointer; }
.table-compact > :not(caption) > * > * { padding: .55rem .9rem; }

/* ---------- 标签页（页面上的一排切换） ---------- */
.tabbar { display: flex; flex-wrap: wrap; gap: .25rem; border-bottom: 1px solid var(--m-border-strong); margin-bottom: 1.25rem; }
.tabbar a { display: inline-flex; align-items: center; gap: .5rem; padding: .8rem 1.1rem; margin-bottom: -1px; font-size: 1.0625rem;
            font-weight: 600; color: var(--m-muted); border-bottom: 3px solid transparent; }
.tabbar a:hover { color: var(--m-text); }
.tabbar a.active { color: var(--m-primary); border-bottom-color: var(--m-primary); }
.tabbar a .chip { font-size: .875rem; padding: .05rem .5rem; }

/* ---------- 流程进度（上传 → 核对 → 处理问题 → 发布 → 打印） ---------- */
.flow { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; }
.flow .step { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 .5rem; }
.flow .step::before { content: ""; position: absolute; top: 21px; left: calc(-50% + 26px); right: calc(50% + 26px); height: 3px;
                      background: var(--m-border); border-radius: 2px; }
.flow .step:first-child::before { display: none; }
.flow .step.done::before, .flow .step.now::before, .flow .step.warn::before { background: #9fd3ad; }
.flow .dot { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; font-size: 1.1rem;
             background: var(--m-gray-soft); color: var(--m-faint); border: 2px solid var(--m-border); position: relative; z-index: 1; }
.flow .done .dot { background: var(--m-green); border-color: var(--m-green); color: #fff; }
.flow .now .dot { background: var(--m-primary); border-color: var(--m-primary); color: #fff; box-shadow: 0 0 0 5px var(--m-primary-soft); }
.flow .warn .dot { background: var(--m-amber); border-color: var(--m-amber); color: #fff; box-shadow: 0 0 0 5px var(--m-amber-soft); }
.flow .stop .dot { background: var(--m-red); border-color: var(--m-red); color: #fff; box-shadow: 0 0 0 5px var(--m-red-soft); }
.flow .name { margin-top: .6rem; font-weight: 600; font-size: 1.0625rem; }
.flow .todo .name { color: var(--m-faint); }
.flow .desc { color: var(--m-muted); font-size: .9375rem; line-height: 1.45; margin-top: .15rem; }
.flow .desc b { color: var(--m-text); }
.nextbar { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-top: 1.25rem; padding: 1rem 1.25rem;
           border-radius: var(--m-radius-sm); background: var(--m-primary-soft); border: 1px solid #cddcf3; }
.nextbar .ico { width: 44px; height: 44px; border-radius: 50%; background: #fff; color: var(--m-primary); display: grid;
                place-items: center; font-size: 1.35rem; flex: 0 0 auto; }
.nextbar .grow { flex: 1 1 300px; min-width: 0; }
.nextbar .what { font-size: 1.1875rem; font-weight: 650; line-height: 1.4; }
.nextbar .why { color: var(--m-muted); font-size: .9375rem; margin-top: .15rem; }
.nextbar.ok { background: var(--m-green-soft); border-color: #c3e5cc; }
.nextbar.ok .ico { color: var(--m-green); }
.nextbar.warn { background: var(--m-amber-soft); border-color: #f1d9ab; }
.nextbar.warn .ico { color: var(--m-amber); }
@media (max-width: 767.98px) {
  .flow { grid-template-columns: 1fr; gap: .75rem; }
  .flow .step { flex-direction: row; text-align: left; gap: .75rem; align-items: flex-start; }
  .flow .step::before { display: none; }
  .flow .name { margin-top: .5rem; }
}

/* ---------- 数字一排 ---------- */
.kpis { display: grid; gap: 1px; background: var(--m-border); border-radius: var(--m-radius) var(--m-radius) 0 0; overflow: hidden; }
.kpis:last-child { border-radius: var(--m-radius); }
.kpis-6 { grid-template-columns: repeat(6, 1fr); }
.kpis-4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1199.98px) { .kpis-6 { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 575.98px) { .kpis-6, .kpis-4 { grid-template-columns: repeat(2, 1fr); } }
.kpi { padding: 1.1rem 1.5rem; background: var(--m-surface); }
.kpi .lbl { color: var(--m-muted); font-size: .9375rem; display: flex; align-items: center; gap: .4rem; }
.kpi .val { font-size: 1.875rem; font-weight: 700; line-height: 1.25; margin-top: .2rem; font-variant-numeric: tabular-nums; }
.kpi .val small { font-size: 1rem; font-weight: 500; color: var(--m-muted); margin-left: .2rem; }

/* ---------- 一组问题 ---------- */
.issue { border-left: 4px solid var(--m-border-strong); }
.issue.red { border-left-color: var(--m-red); }
.issue.yellow { border-left-color: var(--m-amber); }
.issue .card-header { gap: .75rem; flex-wrap: wrap; }
.issue .count { color: var(--m-muted); font-size: .9375rem; white-space: nowrap; }
.issue .explain { color: var(--m-muted); margin: 0 0 .9rem; display: flex; gap: .5rem; }
.issue .explain i { color: var(--m-faint); margin-top: .15rem; }
.issue .items { border: 1px solid var(--m-border); border-radius: var(--m-radius-sm); overflow: hidden; }
.issue .items .table thead th { background: var(--m-subtle); }
.issue .tip { color: var(--m-muted); font-size: .9375rem; margin-top: .25rem; display: flex; gap: .35rem; }
.issue .tip i { color: var(--m-amber); }
/* 问题：这是什么 / 不处理会怎样 / 怎么处理 */
.guide3 { display: grid; grid-template-columns: max-content 1fr; gap: .35rem 1rem; margin: 0 0 1rem;
          background: var(--m-subtle); border: 1px solid var(--m-border); border-radius: var(--m-radius-sm); padding: .8rem 1rem; }
.guide3 dt { color: var(--m-muted); font-weight: 600; white-space: nowrap; }
.guide3 dd { margin: 0; }
@media (max-width: 640px) { .guide3 { grid-template-columns: 1fr; } .guide3 dd { margin-bottom: .4rem; } }
.issue-sec { display: flex; align-items: baseline; gap: .75rem; flex-wrap: wrap; margin: 1.5rem 0 .75rem; font-size: 1.1875rem; font-weight: 650; }
.issue-sec .muted { font-size: .9375rem; font-weight: 400; }
/* 证据：客户 Excel 原来那一行、标签小图 */
.evid { margin-top: .6rem; padding: .6rem .75rem; border: 1px dashed var(--m-border-strong); border-radius: var(--m-radius-sm); background: #fff; }
.evid-t { font-size: .875rem; font-weight: 650; color: var(--m-muted); margin-bottom: .35rem; display: flex; gap: .35rem; }
.erow + .erow { margin-top: .5rem; }
.esrc { font-size: .9375rem; color: var(--m-blue-text); display: flex; gap: .35rem; flex-wrap: wrap; }
.ecells { overflow-x: auto; margin-top: .2rem; }
.ecells table { border-collapse: collapse; font-size: .875rem; }
.ecells th, .ecells td { border: 1px solid var(--m-border); padding: .2rem .5rem; white-space: nowrap; max-width: 260px; overflow: hidden; text-overflow: ellipsis; }
.ecells th { background: var(--m-subtle); color: var(--m-muted); font-weight: 600; }
.ecells td.rowno { color: var(--m-blue-text); font-weight: 650; text-align: right; }
.issue .where-col { width: 215px; min-width: 215px; overflow-wrap: anywhere; }
.efact { font-size: .9375rem; margin-top: .4rem; display: flex; gap: .35rem; }
.efact i { color: var(--m-blue-text); margin-top: .15rem; }
.elabels { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .5rem; }
.elabel { display: flex; flex-direction: column; width: 150px; border: 1px solid var(--m-border); border-radius: 6px; overflow: hidden;
          color: var(--m-text); text-decoration: none; background: #fff; }
.elabel img { width: 100%; height: 110px; object-fit: contain; background: var(--m-subtle); border-bottom: 1px solid var(--m-border); }
.elabel span { font-size: .75rem; line-height: 1.35; padding: .25rem .4rem; color: var(--m-muted); word-break: break-all; }
a.elabel:hover { border-color: var(--m-blue-text); }
.actbar { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }
.actbar .note { flex: 1 1 260px; min-width: 220px; max-width: 420px; }
.actbar .lead { width: 100%; color: var(--m-muted); font-size: .9375rem; margin-bottom: -.1rem; }
.copybox { display: none; width: 100%; min-height: 340px; font-size: 1rem; line-height: 1.7; margin-top: .75rem;
           background: var(--m-subtle); }
.more-btn { margin-top: .5rem; }

/* ---------- 标签图片 / 打印顺序 ---------- */
.tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 1rem; }
.tile { background: var(--m-surface); border: 1px solid var(--m-border); border-radius: var(--m-radius-sm); overflow: hidden;
        display: flex; flex-direction: column; box-shadow: var(--m-shadow); }
.tile .pic { height: 170px; display: flex; align-items: center; justify-content: center; background: #f6f7f9;
             border-bottom: 1px solid var(--m-border); padding: .6rem; }
.tile .pic img { max-width: 100%; max-height: 150px; object-fit: contain; background: #fff; box-shadow: 0 0 0 1px #e3e6ea; }
.tile .body { padding: .7rem .85rem .85rem; display: flex; flex-direction: column; gap: .3rem; }
.tile .step-no { font-size: .875rem; color: var(--m-faint); }
.tile .name { font-weight: 600; word-break: break-all; line-height: 1.4; }
.tile .copies { font-size: 1.25rem; font-weight: 700; color: var(--m-text); }
.tile.bad { border-color: #eab3b3; }
.tile.swap { border: 2px dashed #efc36b; background: var(--m-amber-soft); box-shadow: none; }
.tile.swap .pic { background: transparent; border: 0; color: var(--m-amber); font-size: 2.6rem; }
.printer-head { display: flex; align-items: center; gap: .75rem; margin: 1.5rem 0 .9rem; }
.printer-head:first-child { margin-top: 0; }
.printer-head .ico { width: 40px; height: 40px; border-radius: 10px; background: var(--m-primary-soft); color: var(--m-primary);
                     display: grid; place-items: center; font-size: 1.25rem; }
.printer-head .t { font-size: 1.1875rem; font-weight: 650; line-height: 1.3; }
.printer-head .s { color: var(--m-muted); font-size: .9375rem; }

/* ---------- 空状态 ---------- */
.empty-state { text-align: center; padding: 3.5rem 1rem; }
.empty-state .ico { width: 76px; height: 76px; border-radius: 50%; display: grid; place-items: center; margin: 0 auto 1rem;
                    background: var(--m-gray-soft); color: var(--m-faint); font-size: 2.2rem; }
.empty-state.ok .ico { background: var(--m-green-soft); color: var(--m-green); }
.empty-state .t { font-size: 1.375rem; font-weight: 650; }
.empty-state .s { color: var(--m-muted); margin-top: .35rem; }
.empty-state .a { margin-top: 1.25rem; }

/* ---------- 表单 ---------- */
.form-control, .form-select { font-size: 1.0625rem; min-height: 44px; border-color: var(--m-border-strong); border-radius: 8px; }
.form-control-lg, .form-select-lg { font-size: 1.125rem; min-height: 52px; }
.form-control:focus, .form-select:focus { border-color: #7A86F0; box-shadow: 0 0 0 3px rgba(0, 16, 221, .15); }
.form-label { font-weight: 600; font-size: 1rem; margin-bottom: .4rem; }
.form-hint { color: var(--m-muted); font-size: .9375rem; margin-top: .35rem; }
.search { position: relative; }
.search i { position: absolute; left: .9rem; top: 50%; transform: translateY(-50%); color: var(--m-faint); }
.search .form-control { padding-left: 2.5rem; }

/* 上传页：带编号的步骤 */
.fstep { display: flex; gap: 1rem; padding: 1.4rem 0; border-top: 1px solid var(--m-border); }
.fstep:first-child { border-top: 0; padding-top: .25rem; }
.fstep .no { width: 34px; height: 34px; border-radius: 50%; background: var(--m-primary-soft); color: var(--m-primary);
             display: grid; place-items: center; font-weight: 700; flex: 0 0 auto; }
.fstep .grow { flex: 1 1 auto; min-width: 0; }
.fstep h3 { font-size: 1.1875rem; font-weight: 650; margin: .15rem 0 .75rem; }
.pick { display: flex; flex-wrap: wrap; gap: .6rem; }
.pick label { cursor: pointer; }
.pick input { position: absolute; opacity: 0; pointer-events: none; }
.pick span { display: inline-flex; align-items: center; gap: .5rem; min-width: 120px; justify-content: center; padding: .75rem 1.25rem;
             border: 2px solid var(--m-border-strong); border-radius: 10px; font-size: 1.1875rem; font-weight: 600; background: #fff; }
.pick span:hover { border-color: #7A86F0; }
.pick input:checked + span { border-color: var(--m-primary); background: var(--m-primary-soft); color: var(--m-blue-text); }
.pick input:checked + span::before { content: "\F26A"; font-family: "bootstrap-icons"; font-weight: normal; }
.drop { display: block; border: 2px dashed var(--m-border-strong); border-radius: var(--m-radius); padding: 2rem 1rem; text-align: center;
        cursor: pointer; background: var(--m-subtle); transition: border-color .15s, background .15s; }
.drop:hover, .drop.over { border-color: var(--m-primary); background: var(--m-primary-soft); }
.drop .ico { font-size: 2.6rem; color: var(--m-primary); line-height: 1; }
.drop .t { font-size: 1.1875rem; font-weight: 600; margin-top: .5rem; }
.filelist { list-style: none; padding: 0; margin: .75rem 0 0; display: flex; flex-direction: column; gap: .4rem; }
.filelist li { display: flex; align-items: center; gap: .6rem; padding: .55rem .85rem; border: 1px solid var(--m-border); border-radius: 8px; background: #fff; }
.filelist li i { color: var(--m-green); }
.filelist li .size { margin-left: auto; color: var(--m-muted); font-size: .9375rem; white-space: nowrap; }
.bar { height: 10px; border-radius: 999px; background: var(--m-gray-soft); overflow: hidden; }
.bar > div { height: 100%; background: var(--m-green); border-radius: 999px; transition: width .2s; }
.bar-lg { height: 22px; }
.helpcard ul { padding-left: 1.2rem; margin: 0; }
.helpcard li { margin-bottom: .45rem; }

/* 登录页 */
.login { min-height: 100vh; display: grid; place-items: center; padding: 2rem 1rem;
         background: radial-gradient(1200px 600px at 10% -10%, #E4E7FF 0, transparent 60%), var(--m-bg); }
.login .box { width: 100%; max-width: 440px; }
.login .brand { display: flex; flex-direction: column; align-items: center; gap: .35rem; margin-bottom: 1.6rem; }
.login .brand-logo { height: 92px; width: auto; }
.login .brand-jp { color: #0000FF; font-weight: 800; letter-spacing: .55em; padding-left: .55em; font-size: 1.05rem; line-height: 1.2; }
.login .brand .sub { color: var(--m-muted); font-size: .9375rem; }

/* 其他 */
details > summary { cursor: pointer; list-style: none; }
details > summary::-webkit-details-marker { display: none; }
details[open] > summary .when-closed { display: none; }
details:not([open]) > summary .when-open { display: none; }
.fold > summary { display: flex; align-items: center; gap: .6rem; padding: 1rem 1.5rem; font-weight: 600; font-size: 1.0625rem; }
.fold > summary .chev { margin-left: auto; color: var(--m-faint); transition: transform .15s; }
.fold[open] > summary .chev { transform: rotate(180deg); }
.fold > summary:hover { background: var(--m-subtle); }
.fold[open] > summary { border-bottom: 1px solid var(--m-border); }
.divide > * + * { border-top: 1px solid var(--m-border); }
.kv { display: grid; grid-template-columns: max-content 1fr; gap: .45rem 1.25rem; }
.kv dt { color: var(--m-muted); font-weight: 500; }
.kv dd { margin: 0; }
.callout { padding: .85rem 1rem; border-radius: var(--m-radius-sm); background: var(--m-amber-soft); border: 1px solid #f1d9ab; }
.callout .h { font-weight: 650; color: var(--m-amber-text); display: flex; align-items: center; gap: .4rem; margin-bottom: .25rem; }
.log { list-style: none; padding: 0; margin: .5rem 0 0; font-size: .9375rem; color: var(--m-muted); }
.log li { padding: .2rem 0; }
.pager { display: flex; gap: .5rem; }

/* 账号管理 */
.avatar-sm { width: 36px; height: 36px; border-radius: 50%; background: var(--m-primary-soft); color: var(--m-primary);
             display: grid; place-items: center; font-weight: 700; flex: 0 0 auto; }
.rolepick { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: .75rem; }
.rolepick label { cursor: pointer; margin: 0; }
.rolepick input { position: absolute; opacity: 0; pointer-events: none; }
.rolepick label > div { height: 100%; border: 2px solid var(--m-border-strong); border-radius: 10px; padding: .8rem 1rem; background: #fff; }
.rolepick label > div:hover { border-color: #7A86F0; }
.rolepick .t { font-size: 1.1875rem; font-weight: 650; display: flex; align-items: center; gap: .4rem; }
.rolepick .h { color: var(--m-muted); font-size: .9375rem; margin-top: .15rem; line-height: 1.45; }
.rolepick input:checked + div { border-color: var(--m-primary); background: var(--m-primary-soft); }
.rolepick input:checked + div .t { color: var(--m-blue-text); }
.rolepick input:checked + div .t::before { content: "\F26A"; font-family: "bootstrap-icons"; font-weight: normal; }
.rolepick input:disabled + div { opacity: .45; cursor: not-allowed; }
.pick input:focus-visible + span, .rolepick input:focus-visible + div { outline: 3px solid rgba(0, 16, 221, .35); outline-offset: 2px; }
.login-lang { display: flex; justify-content: flex-end; gap: .25rem; margin-bottom: .75rem; }
.login-lang button { background: none; border: 1px solid var(--m-border-strong); border-radius: 999px; padding: .2rem .8rem; color: var(--m-muted); font-size: .9375rem; cursor: pointer; }
.login-lang button.on { background: var(--m-primary); border-color: var(--m-primary); color: #fff; }
/* 登录页的升级日志（2026-09-29）：灰色小字，每次最多两行，放不下就省略号（鼠标放上去看全文），不影响登录框的样子 */
.release-notes { margin-top: 1.5rem; padding-top: .9rem; border-top: 1px solid var(--m-border); color: var(--m-faint); font-size: .8125rem; }
.release-notes .rn-head { color: var(--m-muted); margin-bottom: .35rem; }
.release-notes ul { list-style: none; margin: 0; padding: 0; }
.release-notes li { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.6; margin-bottom: .25rem; }
.release-notes .rn-ver { color: var(--m-muted); font-weight: 600; margin-right: .5rem; }
.release-notes .rn-date { margin-right: .5rem; }
.release-notes details summary { cursor: pointer; color: var(--m-muted); margin: .2rem 0; list-style: none; }
.release-notes details summary::-webkit-details-marker { display: none; }
/* 左下角的系统版本号 */
.side-ver { margin-top: .6rem; text-align: center; font-size: .75rem; color: #5d7291; letter-spacing: .02em; }

/* 条码重画前后对比 */
.compare { margin-top: 0; padding: .85rem; border: 1px solid var(--m-border); border-radius: var(--m-radius-sm); background: var(--m-subtle); }
.compare .pair { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); max-width: 980px; gap: .75rem; align-items: center; margin-bottom: .75rem; }
.compare .cmp-side { background: #fff; border: 1px solid var(--m-border); border-radius: 8px; padding: .6rem; }
.compare .cmp-side img { width: 100%; max-height: 360px; object-fit: contain; background: #fff; display: block; margin: .4rem 0; }
.compare .cap { font-weight: 650; display: flex; align-items: center; gap: .35rem; }
.compare .cap.bad { color: var(--m-red-text); }
.compare .cap.ok { color: var(--m-green-text); }
.compare .res { font-size: .9375rem; color: var(--m-muted); }
.compare .arrow { color: var(--m-faint); font-size: 1.5rem; }
.compare .noimg { padding: 2rem; text-align: center; color: var(--m-faint); }
@media (max-width: 767.98px) { .compare .pair { grid-template-columns: 1fr; } .compare .arrow { transform: rotate(90deg); justify-self: center; } }
.table tr.no-bb > * { border-bottom: 0 !important; }

/* ---------- A4 单面指导书（inbound/guide.html）：屏幕上像一张纸，打印时按 A4 排 ---------- */
@page { size: A4 portrait; margin: 10mm 9mm; }
body.guide-page { background: var(--m-bg); font-size: 10pt; line-height: 1.4; }
.guide-bar { max-width: 210mm; margin: 12px auto; display: flex; gap: 8px; align-items: center; padding: 0 12px; }
.guide { max-width: 210mm; margin: 0 auto 24px; background: #fff; padding: 10mm 9mm; box-shadow: 0 1px 4px rgba(0,0,0,.12); color: #000; }
.guide h1 { font-size: 16pt; font-weight: 700; margin: 0 0 2mm; }
.guide .g-meta { font-size: 9pt; color: #333; display: flex; flex-wrap: wrap; gap: 2mm 6mm; margin-bottom: 3mm; }
.guide .g-sum { display: grid; grid-template-columns: repeat(6, 1fr); border: 1px solid #000; margin-bottom: 3mm; }
.guide .g-sum div { padding: 1.5mm 2mm; border-right: 1px solid #000; font-size: 8.5pt; }
.guide .g-sum div:last-child { border-right: 0; }
.guide .g-sum b { display: block; font-size: 13pt; }
.guide .g-box { border: 1.5px solid #000; padding: 2mm 3mm; margin-bottom: 3mm; font-size: 9pt; }
.guide .g-box h2 { font-size: 10pt; font-weight: 700; margin: 0 0 1mm; }
.guide .g-box ul { margin: 0; padding-left: 5mm; }
.guide .g-steps { font-size: 8.5pt; color: #222; margin-bottom: 3mm; }
.guide table { width: 100%; border-collapse: collapse; font-size: 8.5pt; }
.guide th, .guide td { border: 1px solid #000; padding: 1mm 1.4mm; vertical-align: top; }
.guide th { background: #eee; font-weight: 700; text-align: left; }
.guide td.n { text-align: right; white-space: nowrap; }
.guide td.no { font-weight: 700; word-break: break-all; }
.guide td.ck { width: 11mm; }
.guide th.ck { white-space: nowrap; width: 11mm; }
.guide tr.off td { color: #666; }
.guide .tag { display: inline-block; border: 1px solid #000; border-radius: 2px; padding: 0 1mm; font-size: 7.5pt; font-weight: 700; margin-right: 1mm; }
.guide .small { font-size: 7.5pt; color: #333; }
.guide thead { display: table-header-group; }
.guide tr { page-break-inside: avoid; }
@media print {
  body.guide-page { background: #fff; }
  .guide-bar { display: none; }
  .guide { box-shadow: none; margin: 0; padding: 0; max-width: none; }
}
@media (max-width: 767.98px) { .guide { padding: 12px; } .guide .g-sum { grid-template-columns: repeat(3, 1fr); } .guide-bar { flex-wrap: wrap; } }

/* ---------- 返货作业 ---------- */
.r-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: .5rem; }
.r-step { background: var(--m-surface); border: 1px solid var(--m-border); border-radius: var(--m-radius-sm); padding: .7rem .9rem;
          display: flex; flex-direction: column; font-weight: 650; color: var(--m-muted); }
.r-step b { display: inline-flex; width: 1.7rem; height: 1.7rem; border-radius: 50%; align-items: center; justify-content: center;
            background: var(--m-gray-soft); margin-bottom: .3rem; }
.r-step small { font-weight: 400; font-size: .875rem; }
.r-step.now { border-color: var(--m-blue-text); color: var(--m-blue-text); }
.r-step.now b { background: var(--m-primary-soft); }
.r-step.done { color: var(--m-green-text); }
.r-step.done b { background: var(--m-green-soft); }
@media (max-width: 640px) { .r-steps { grid-template-columns: repeat(2, 1fr); } }
.r-ops { padding-left: 1.3rem; }
.r-ops li { margin-bottom: .15rem; }
.r-img { width: 180px; }
.r-img img { height: 150px; }

/* ---------- 点图片弹出看大图（base.html #zoom） ---------- */
.zoom { position: fixed; inset: 0; z-index: 2000; background: rgba(15, 20, 28, .94); display: flex; flex-direction: column; }
.zoom[hidden] { display: none; }
.zoom-bar { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; padding: .6rem 1rem; background: rgba(0,0,0,.35); color: #fff; }
.zoom-cap { flex: 1 1 260px; font-size: .95rem; overflow-wrap: anywhere; }
.zoom-tools { display: flex; flex-wrap: wrap; gap: .4rem; }
.zoom-tools .btn.active { --tblr-btn-bg: var(--m-primary-soft); --tblr-btn-border-color: #7A86F0; font-weight: 700; }
.zoom-stage { flex: 1; overflow: auto; display: flex; align-items: center; justify-content: center; padding: 1rem 4rem; }
.zoom-stage img { background: #fff; box-shadow: 0 4px 24px rgba(0,0,0,.4); cursor: zoom-in; }
.zoom-stage[data-mode="fit"] img { max-width: 100%; max-height: calc(100vh - 7rem); width: auto; height: auto; object-fit: contain; }
.zoom-stage[data-mode="1"], .zoom-stage[data-mode="2"] { align-items: flex-start; justify-content: flex-start; }
.zoom-stage[data-mode="1"] img, .zoom-stage[data-mode="2"] img { max-width: none; max-height: none; margin: auto; image-rendering: pixelated; }
.zoom-stage[data-mode="2"] img { cursor: zoom-out; }
.zoom-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 3rem; height: 4rem; border: 0; border-radius: 10px;
            background: rgba(0,0,0,.55); color: #fff; font-size: 1.6rem; box-shadow: 0 0 0 1px rgba(255,255,255,.35); z-index: 1; }
.zoom-nav:hover { background: rgba(0,0,0,.75); }
.zoom-nav.prev { left: .6rem; } .zoom-nav.next { right: .6rem; }
.zoom-hint { text-align: center; color: rgba(255,255,255,.7); font-size: .85rem; padding: .3rem 0 .6rem; }
@media (max-width: 640px) { .zoom-stage { padding: .5rem; } .zoom-nav { width: 2.4rem; height: 3rem; } }

/* 大的可选一行（单选）：整行都能点（连接新电脑选工作台，2026-09-30） */
.choice { display: flex; gap: .9rem; align-items: flex-start; padding: 1rem 1.2rem; border: 2px solid var(--m-border, #d0d7e2); border-radius: 12px;
          background: #fff; cursor: pointer; font-size: 1.1rem; }
.choice:has(input:checked) { border-color: var(--m-primary, #0010DD); background: var(--m-primary-soft, #ECEEFF); }
.choice input[type=radio] { width: 1.4rem; height: 1.4rem; margin-top: .15rem; flex: none; }