
  * { margin:0; padding:0; box-sizing:border-box; }
  /* ═══ 主题令牌（Apple Liquid Glass）═══
     玻璃表面/文字/强调/语义/阴影按浅深两套取值；doc-* 文档层令牌是画布纸面与印章/签名墨色，
     跨主题恒定（预览纸面永远是白纸）——app.js 经 cssVar() 读取后画上 canvas，不得改成按主题取值，
     否则深色下文档画布上的红章/签名标记会在白纸上失效。 */
  :root {
    color-scheme: light;
    /* 文字 */
    --text:#1d1d2b; --text-2:#51556b; --text-3:#80849a;
    /* 不透明表面（弹窗/select option 底色） */
    --solid:#ffffff;
    /* 玻璃表面：卡片 → 头部 → 输入 → 悬停，及其顶部高光边 */
    --glass:rgba(255,255,255,.58); --glass-strong:rgba(255,255,255,.72); --glass-input:rgba(255,255,255,.62); --glass-hover:rgba(255,255,255,.86);
    --glass-rim:rgba(255,255,255,.85);
    /* 发丝线边框 */
    --border:rgba(28,38,68,.13); --border-weak:rgba(28,38,68,.08); --border-strong:rgba(28,38,68,.24);
    /* 强调色（Apple 蓝） */
    --accent:#0071e3; --accent-soft:rgba(0,113,227,.12); --accent-border:rgba(0,113,227,.42); --accent-glow:rgba(0,113,227,.32);
    --grad-accent:linear-gradient(180deg,#339cff,#0069d9); --on-accent:#fff; --on-accent-rim:rgba(255,255,255,.3);
    --grad-logo:linear-gradient(135deg,#0069d9,#5856d6);
    /* 语义色 */
    --ok:#1f9a48; --ok-tint:rgba(52,199,89,.14); --ok-glow:rgba(52,199,89,.35); --grad-ok:linear-gradient(180deg,#3ecf63,#1f9a48);
    --warn:#a35a00; --warn-tint:rgba(255,159,10,.15); --warn-border:rgba(255,159,10,.5);
    --err:#d70015; --err-tint:rgba(255,59,48,.11); --err-soft:rgba(255,59,48,.12); --err-soft-hover:rgba(255,59,48,.22); --err-border:rgba(255,59,48,.38);
    --info:#0071e3; --info-tint:rgba(0,113,227,.12); --purple:#7d3af0; --purple-tint:rgba(139,92,246,.14);
    /* 阴影 / 极光底色 / 遮罩 */
    --shadow-card:0 10px 34px rgba(18,28,58,.12), 0 2px 8px rgba(18,28,58,.06);
    --shadow-pop:0 12px 40px rgba(10,14,30,.22);
    --bg-base:#edf0f7;
    --blob-1:rgba(10,132,255,.30); --blob-2:rgba(94,92,230,.24); --blob-3:rgba(255,90,160,.17);
    --scrim:rgba(10,10,20,.55);
    --selection:rgba(0,113,227,.22);
    /* 卡片顶部斜向高光（液态玻璃的 specular） */
    --sheen:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,0) 32%);
    /* 文档层（跨主题恒定，仅在此定义一次） */
    --doc-paper:#fff; --doc-chip:rgba(255,255,255,.9); --doc-scrim:rgba(255,255,255,.9);
    --doc-tip-bg:rgba(255,255,255,.9); --doc-tip-text:#6d7389;
    --doc-ink:#1c2340; --doc-pad-line:#c8c8d0;
    --doc-seal-ring:rgba(196,30,58,.85); --doc-seal-ring-soft:rgba(196,30,58,.5);
    --doc-seal-ring-drag:rgba(196,30,58,.8); --doc-seal-slice:rgba(196,30,58,.9);
    --doc-seal-slice-fill:rgba(196,30,58,.22); --doc-seal-tint:rgba(196,30,58,.1);
    --doc-sig-dash:rgba(50,100,255,.75); --doc-sig-fill:rgba(50,100,255,.08);
    --doc-sig-dash-signed:rgba(52,199,89,.8);
    --doc-ghost-sig:#34c759; --doc-ghost-seal:#ff6b6b; --doc-ghost-seal-fill:rgba(255,107,107,.12);
  }
  :root[data-theme="dark"] {
    color-scheme: dark;
    --text:#f2f3f8; --text-2:#a7abbd; --text-3:#7a7e90;
    --solid:#1d1f2b;
    --glass:rgba(24,26,38,.56); --glass-strong:rgba(18,20,30,.72); --glass-input:rgba(255,255,255,.07); --glass-hover:rgba(255,255,255,.14);
    --glass-rim:rgba(255,255,255,.15);
    --border:rgba(255,255,255,.13); --border-weak:rgba(255,255,255,.09); --border-strong:rgba(255,255,255,.24);
    --accent:#0a84ff; --accent-soft:rgba(10,132,255,.2); --accent-border:rgba(10,132,255,.5); --accent-glow:rgba(10,132,255,.3);
    --grad-accent:linear-gradient(180deg,#4da3ff,#0a6fdb); --on-accent:#fff; --on-accent-rim:rgba(255,255,255,.3);
    --grad-logo:linear-gradient(135deg,#4da3ff,#bf5af2);
    --ok:#32d158; --ok-tint:rgba(52,199,89,.16); --ok-glow:rgba(52,199,89,.32); --grad-ok:linear-gradient(180deg,#48e06e,#22b04a);
    --warn:#ff9f0a; --warn-tint:rgba(255,159,10,.16); --warn-border:rgba(255,159,10,.5);
    --err:#ff453a; --err-tint:rgba(255,69,58,.15); --err-soft:rgba(255,69,58,.16); --err-soft-hover:rgba(255,69,58,.28); --err-border:rgba(255,69,58,.45);
    --info:#0a84ff; --info-tint:rgba(10,132,255,.16); --purple:#bf5af2; --purple-tint:rgba(191,90,242,.16);
    --shadow-card:0 12px 40px rgba(0,0,0,.45);
    --shadow-pop:0 16px 48px rgba(0,0,0,.6);
    --bg-base:#07070f;
    --blob-1:rgba(10,80,180,.42); --blob-2:rgba(70,50,160,.34); --blob-3:rgba(160,40,100,.2);
    --scrim:rgba(0,0,0,.72);
    --selection:rgba(10,132,255,.4);
    --sheen:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,0) 32%);
  }
  ::selection { background:var(--selection); }
  *::-webkit-scrollbar { width:10px; height:10px; }
  *::-webkit-scrollbar-thumb { background:var(--border-strong); border-radius:99px; border:2px solid transparent; background-clip:content-box; }
  *::-webkit-scrollbar-track { background:transparent; }
  body { font-family:-apple-system,'PingFang SC','Microsoft YaHei',sans-serif; background:var(--bg-base); color:var(--text); min-height:100vh; transition:background .35s, color .35s; -webkit-font-smoothing:antialiased; }
  /* 极光底色：给玻璃表面提供可折射的色彩层 */
  body::before { content:""; position:fixed; inset:-20%; z-index:-1; pointer-events:none;
    background:
      radial-gradient(42% 38% at 18% 12%, var(--blob-1), transparent 70%),
      radial-gradient(40% 36% at 82% 18%, var(--blob-2), transparent 70%),
      radial-gradient(46% 40% at 55% 92%, var(--blob-3), transparent 72%);
  }
  @media (prefers-reduced-transparency: reduce) {
    :root { --glass:rgba(255,255,255,.95); --glass-strong:rgba(255,255,255,.97); --glass-input:rgba(255,255,255,.96); --glass-hover:rgba(255,255,255,.98); }
    :root[data-theme="dark"] { --glass:rgba(26,28,40,.96); --glass-strong:rgba(24,26,36,.98); --glass-input:rgba(40,42,56,.97); --glass-hover:rgba(52,54,70,.98); }
  }
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition-duration:.01ms !important; animation-duration:.01ms !important; }
  }
  header { position:sticky; top:0; z-index:100; padding:14px 28px; display:flex; justify-content:space-between; align-items:center; gap:12px;
    background:var(--glass-strong); backdrop-filter:blur(30px) saturate(1.8); -webkit-backdrop-filter:blur(30px) saturate(1.8);
    border-bottom:1px solid var(--border); }
  header .logo { font-size:18px; font-weight:700; letter-spacing:-.2px; background:var(--grad-logo); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
  .header-right { display:flex; align-items:center; gap:6px; }
  header .user { display:flex; align-items:center; gap:6px; font-size:13px; color:var(--text-2); }
  header .user button, .theme-toggle { margin-left:0; background:var(--glass-input); border:1px solid var(--border); color:var(--text);
    padding:6px 14px; border-radius:999px; cursor:pointer; font-size:12px; transition:background .2s, transform .15s, border-color .2s; box-shadow:inset 0 1px 0 var(--glass-rim); }
  header .user button:hover, .theme-toggle:hover { background:var(--glass-hover); border-color:var(--border-strong); }
  header .user button:active, .theme-toggle:active { transform:scale(.97); }
  .theme-toggle { width:34px; height:34px; padding:0; font-size:15px; line-height:1; display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; }
  main { max-width:1248px; margin:32px auto; padding:0 20px; }
  .card { background:var(--sheen), var(--glass); backdrop-filter:blur(30px) saturate(1.8); -webkit-backdrop-filter:blur(30px) saturate(1.8);
    border:1px solid var(--border); border-radius:22px; padding:28px; margin-bottom:20px;
    box-shadow:var(--shadow-card), inset 0 1px 0 var(--glass-rim); }
  h2 { font-size:16px; margin-bottom:18px; color:var(--text); letter-spacing:-.2px; }
  h3 { color:var(--text); }
  label { display:block; font-size:12px; color:var(--text-2); margin:14px 0 6px; }
  input[type=text], input[type=email], input[type=file], input[type=number] { width:100%; background:var(--glass-input); border:1px solid var(--border);
    color:var(--text); padding:11px 14px; border-radius:12px; font-size:14px; outline:none; transition:border-color .2s, box-shadow .2s, background .2s; }
  input::placeholder { color:var(--text-3); }
  select { background:var(--glass-input); border:1px solid var(--border); color:var(--text); padding:0 12px; height:40px; border-radius:12px; font-size:14px; outline:none; transition:border-color .2s, box-shadow .2s; }
  select option { background:var(--solid); color:var(--text); }
  input:focus { border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
  input[type=file]::file-selector-button { border:none; margin-right:12px; padding:6px 16px; border-radius:999px; background:var(--grad-accent); color:var(--on-accent);
    font-size:13px; font-weight:600; cursor:pointer; white-space:nowrap; box-shadow:0 3px 10px var(--accent-glow); }
  /* 自定义文件选择框：保留输入框外观，按钮文字在所有浏览器稳定可见（不依赖原生控件标签） */
  .file-field { position:relative; display:flex; align-items:center; gap:10px; margin:0; padding:6px 10px; min-height:46px;
    background:var(--glass-input); border:1px solid var(--border); border-radius:12px; cursor:pointer; transition:border-color .2s, box-shadow .2s, background .2s; }
  .file-field:hover { background:var(--glass-hover); }
  .file-field .file-btn { flex-shrink:0; padding:7px 16px; border-radius:999px; background:var(--grad-accent); color:var(--on-accent); font-size:13px; font-weight:600;
    line-height:1.2; white-space:nowrap; box-shadow:0 3px 10px var(--accent-glow); user-select:none; }
  .file-field .file-name { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; color:var(--text-3); }
  .file-field:focus-within { border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
  .file-field input[type=file] { position:absolute; inset:0; width:100%; height:100%; margin:0; padding:0; border:none; background:none; opacity:0; cursor:pointer; }
  .row { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
  .table-scroll { overflow-x:auto; margin-top:10px; }
  /* 表格自适应容器宽度：固定布局 + 内容省略，避免横向溢出把最右侧“操作”列挤出去 */
  .table-scroll table { width:100%; min-width:0; table-layout:fixed; }
  .table-scroll th, .table-scroll td { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .table-scroll th:last-child, .table-scroll td:last-child { width:172px; overflow:visible; white-space:nowrap; }
  /* 我的申请：状态/时间列收窄，把宽度让给“编号/文件”列 */
  .tbl-my th:nth-child(1), .tbl-my td:nth-child(1) { width:240px; }
  .tbl-my th:nth-child(3), .tbl-my td:nth-child(3) { width:76px; }
  .tbl-my th:nth-child(4), .tbl-my td:nth-child(4) { width:230px; }
  .btn { display:inline-block; vertical-align:middle; white-space:nowrap; margin-top:18px; width:100%; padding:12px; border:none; border-radius:999px;
    font-size:14px; font-weight:600; cursor:pointer; background:var(--grad-accent); color:var(--on-accent);
    box-shadow:0 5px 16px var(--accent-glow), inset 0 1px 0 var(--on-accent-rim); transition:filter .18s, transform .15s, background .2s, box-shadow .2s; }
  .btn:hover { filter:brightness(1.06); transform:translateY(-1px); }
  .btn:not(.gray):not(.danger):hover { box-shadow:0 7px 20px var(--accent-glow), inset 0 1px 0 var(--on-accent-rim); }
  .btn:active { transform:translateY(0) scale(.985); }
  .btn.small { width:auto; padding:6px 14px; margin:0; font-size:12px; }
  .btn.gray { background:var(--glass-input); border:1px solid var(--border); color:var(--text); box-shadow:inset 0 1px 0 var(--glass-rim); }
  .btn.gray:hover { background:var(--glass-hover); filter:none; }
  /* 签名板容器背景跨主题恒白（--doc-paper）：容器内灰按钮若用主题令牌，深色下=白字白底不可辨，钉死文档层取色 */
  #sigPadBox .btn.gray { background:#fff; color:var(--doc-ink); border:1px solid var(--doc-pad-line); box-shadow:none; }
  #sigPadBox .btn.gray:hover { background:#f2f2f7; filter:none; }
  .btn.danger { background:var(--err-soft); color:var(--err); border:1px solid var(--err-border); box-shadow:none; }
  .btn.danger:hover { background:var(--err-soft-hover); filter:none; }
  input:disabled { opacity:.5; cursor:not-allowed; background:var(--glass-input); }
  .toggle-chip { display:inline-flex; align-items:center; gap:6px; padding:8px 18px; border-radius:999px; font-size:13px; font-weight:600; cursor:pointer;
    background:var(--glass-input); border:1px solid var(--border); color:var(--text); user-select:none; transition:background .2s, border-color .2s, color .2s; box-shadow:inset 0 1px 0 var(--glass-rim); }
  .toggle-chip.on { background:var(--accent-soft); border-color:var(--accent-border); color:var(--accent); }
  .btn:disabled { opacity:.45; cursor:not-allowed; filter:none; transform:none; }
  .mode-option { display:flex; align-items:center; gap:6px; margin-right:18px; font-size:14px; color:var(--text); cursor:pointer; }
  /* 工作台入口（header 内，登录后显示）：与「企业管理后台/平台管理后台」同一按钮风格 */
  #workbenchNav { display:flex; }
  #workbenchNav.hidden { display:none !important; } /* ID 特异性会压过全局 .hidden，必须显式覆盖，否则未登录也显示 */
  #workbenchNav button { background:var(--glass-input); border:1px solid var(--border); color:var(--text); padding:6px 14px; border-radius:999px; cursor:pointer; font-size:12px; transition:background .2s, transform .15s; box-shadow:inset 0 1px 0 var(--glass-rim); white-space:nowrap; }
  #workbenchNav button:hover { background:var(--glass-hover); }
  #workbenchNav button.on, .header-right .user button.nav-on, .admin-tabs button.on { background:var(--grad-accent); color:var(--on-accent); font-weight:600; border-color:transparent; box-shadow:0 3px 10px var(--accent-glow); }
  /* 平台后台子标签：所在块蓝底、其余白底（覆盖 .btn 默认蓝渐变） */
  .admin-tabs button { background:var(--glass-input); border:1px solid var(--border); color:var(--text); box-shadow:inset 0 1px 0 var(--glass-rim); }
  .admin-tabs button:hover { background:var(--glass-hover); }
  @media (max-width: 720px) {
    .header-right { flex-wrap:wrap; row-gap:4px; justify-content:flex-end; }
    #workbenchNav button { padding:6px 12px; font-size:12px; }
  }
  #previewWrap { position:relative; margin-top:12px; border:1px solid var(--border-strong); border-radius:14px; overflow:hidden; background:var(--doc-paper); }
  #previewCanvas { display:block; width:100%; height:auto; cursor:crosshair; touch-action:none; }
  #previewOverlay, #confirmOverlay { position:absolute; top:0; left:0; width:100%; height:100%; pointer-events:none; }
  #previewTip { position:absolute; right:10px; bottom:8px; font-size:12px; color:var(--doc-tip-text); background:var(--doc-tip-bg); padding:4px 10px; border-radius:8px; }
  #confirmPreviewWrap { position:relative; margin-top:12px; border:1px solid var(--border-strong); border-radius:14px; overflow:hidden; background:var(--doc-paper); }
  #confirmCanvas { display:block; width:100%; height:auto; cursor:crosshair; touch-action:none; }
  #confirmTip { position:absolute; right:10px; bottom:8px; font-size:12px; color:var(--doc-tip-text); background:var(--doc-tip-bg); padding:4px 10px; border-radius:8px; }
  .draft-item { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 4px; border-bottom:1px solid var(--border-weak); }
  #pageInfo { color:var(--text-2); font-size:13px; }
  input[type=radio], input[type=checkbox] { accent-color:var(--accent); }
  .tip { font-size:12px; color:var(--text-3); margin-top:8px; }
  .msg { font-size:13px; margin-top:12px; padding:10px 14px; border-radius:10px; display:none; }
  .msg.ok { display:block; background:var(--ok-tint); color:var(--ok); }
  .msg.err { display:block; background:var(--err-tint); color:var(--err); }
  .status-line { font-size:13px; color:var(--text-2); margin-top:10px; }
  code { font-family:ui-monospace,'SF Mono',Menlo,Consolas,monospace; font-size:.95em; word-break:break-all; }
  table { width:100%; border-collapse:collapse; font-size:13px; }
  th,td { text-align:left; padding:9px 6px; border-bottom:1px solid var(--border-weak); }
  th { color:var(--text-3); font-weight:500; }
  .pill { display:inline-block; padding:3px 10px; border-radius:20px; font-size:12px; font-weight:500; }
  .pill.pending { background:var(--warn-tint); color:var(--warn); }
  .pill.approved,.pill.completed,.pill.onchain { background:var(--ok-tint); color:var(--ok); }
  .pill.awaiting_confirm { background:var(--purple-tint); color:var(--purple); }
  .pill.archived { background:var(--glass-input); color:var(--text-3); }
  .pill.rejected,.pill.failed { background:var(--err-tint); color:var(--err); }
  .hidden { display:none; }
  .progress { margin-top:14px; background:var(--glass-input); height:8px; border-radius:6px; overflow:hidden; }
  .progress > div { height:100%; background:linear-gradient(90deg,var(--accent),var(--ok)); width:0; transition:width .6s; }
  .steps { display:flex; justify-content:space-between; font-size:11px; color:var(--text-3); margin-top:6px; }
  .onboard-head { display:flex; align-items:flex-start; gap:14px; }
  .onboard-steps { list-style:none; margin:0; padding:0; counter-reset:ob; }
  .onboard-steps li { position:relative; font-size:13px; color:var(--text-2); padding:7px 0 7px 34px; }
  .onboard-steps li::before { counter-increment:ob; content:counter(ob); position:absolute; left:0; top:7px; width:22px; height:22px; border-radius:50%;
    background:var(--accent-soft); border:1px solid var(--accent-border); color:var(--accent); font-size:12px; font-weight:700; text-align:center; line-height:22px; }
  .onboard-steps b { color:var(--text); font-weight:600; }
  .toast { position:fixed; left:50%; bottom:32px; transform:translateX(-50%); background:var(--glass-strong); backdrop-filter:blur(24px) saturate(1.8);
    -webkit-backdrop-filter:blur(24px) saturate(1.8); color:var(--text); border:1px solid var(--accent-border); padding:11px 20px; border-radius:16px;
    font-size:13px; z-index:1000; opacity:0; pointer-events:none; transition:opacity .25s; max-width:86vw; box-shadow:var(--shadow-pop); }
  .toast.show { opacity:1; }
  .verify-box { text-align:center; padding:20px; }

  /* L-6 工具类：逐步替代内联 style 属性 */
  .mt-6 { margin-top:6px; }
  .mt-8 { margin-top:8px; }
  .mt-10 { margin-top:10px; }
  .mt-12 { margin-top:12px; }
  .mt-14 { margin-top:14px; }
  .m-0 { margin:0; }
  .ml-8 { margin-left:8px; }
  .ml-10 { margin-left:10px; }
  .flex1 { flex:1; }
  .row-c { display:flex; align-items:center; }
  .row-cc { display:flex; align-items:center; justify-content:center; }
  .row-mt6 { display:flex; align-items:center; margin-top:6px; }
  .row-mt8 { display:flex; align-items:center; margin-top:8px; }
  .row-mt10 { display:flex; align-items:center; margin-top:10px; }
  .hr-sep { border:none; border-top:1px solid var(--border); margin:16px 0; }
  .t-c { text-align:center; }
  .t-3 { color:var(--text-3); }
  .flex1-m0 { flex:1; margin:0; }
  .flex1-tc { flex:1; text-align:center; }

  .seal-img { max-width:100%; border-radius:12px; margin-top:14px; border:1px solid var(--border); }
  @media (max-width:600px) {
    main { padding:0 12px; }
    header { padding:12px 14px; flex-wrap:wrap; gap:8px 12px; }
    header .logo { font-size:15px; }
    header .user { display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
    header .user button { margin-left:0; padding:6px 10px; font-size:11px; }
    .user-email { display:none; }
    .card { padding:18px; border-radius:18px; }
    .btn.small { padding:8px 12px; font-size:12px; }
    /* 后台表格在手机上转卡片式，避免横向滚动 */
    .table-scroll { overflow:visible; }
    .table-scroll table { display:block; width:100%; min-width:0; }
    .table-scroll thead { display:none; }
    .table-scroll tbody { display:block; }
    .table-scroll tr { display:block; border:1px solid var(--border); border-radius:12px; margin-bottom:12px; padding:10px; }
    .table-scroll td { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:6px 0; border:none; white-space:normal; text-align:left; }
    .table-scroll td::before { content:attr(data-label); color:var(--text-3); font-size:12px; flex-shrink:0; min-width:70px; }
    /* 盖章验证行窄屏转纵向堆叠：flex 子项 min-width:auto 会把单行撑破视口（殃及整页画布变宽） */
    #verifyCard .row { flex-direction:column; align-items:stretch; }
    #verifyCard .row .btn { margin-top:0; }
  }
  .lightbox { position:fixed; top:0; left:0; width:100%; height:100%; background:var(--scrim); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
    display:none; align-items:center; justify-content:center; z-index:999; cursor:zoom-out; }
  .lightbox.show { display:flex; }
  .lightbox img { max-width:90vw; max-height:90vh; object-fit:contain; border-radius:10px; background:var(--doc-paper); }
  .lightbox-close { position:absolute; top:22px; right:30px; width:46px; height:46px; font-size:26px; color:#fff; background:rgba(255,255,255,.16);
    border:none; border-radius:50%; cursor:pointer; line-height:46px; text-align:center; }
  .lightbox-close:hover { background:rgba(255,255,255,.3); }
  .zoomable { cursor:zoom-in; }
  .site-footer { text-align:center; padding:6px 0 30px; font-size:12px; }
  .site-footer a { color:var(--text-3); text-decoration:none; transition:color .2s; }
  .site-footer a:hover { color:var(--text-2); }
  /* ═══ 登录页（与 MetaScend ERP 登录页同款式：左侧品牌渐变分屏 + 右侧表单区）═══
     色值取自 ERP frontend/src/views/Login.vue 与 theme/naive.ts（主色 #007AFF / 圆角 8px）；
     明暗两套均在此定义，不与全站玻璃令牌混用，后续调整只动这一块 */
  /* 未登录整页 = 纯登录页（左右两列：左 37% 品牌展示；右 63% 上登录模块、下盖章验证模块，
     验证模块由 app.js placeVerify() 挪入）：无顶部导航、无底部备案号（备案号已在品牌面板内）。
     隐藏同时用 :has 纯 CSS 兜底（file:// 直接开文件时 app.js 加载不到，JS 类切换不生效） */
  body.at-login header, body.at-login .site-footer, body.at-login main { display:none; }
  body.at-login::before { display:none; } /* 登录页纯色底，不要工作台极光 blob */
  body:has(> #authSection:not(.hidden)) header,
  body:has(> #authSection:not(.hidden)) .site-footer,
  body:has(> #authSection:not(.hidden)) main { display:none; }
  body:has(> #authSection:not(.hidden))::before { display:none; }
  #authSection { display:flex; min-height:100vh; background:#f7f9fc; overflow:hidden; }
  #authSection.hidden { display:none; } /* ID 特异性会压过全局 .hidden，必须显式覆盖，否则登录后登录页仍占位（同 #workbenchNav.hidden） */
  :root[data-theme="dark"] #authSection { background:#1c1c1e; }
  /* ── 登录页布局：右列两行网格 ──
     第一行占满剩余高度并垂直居中登录卡（唯一主任务）；
     第二行把盖章验证锚定在面板底部，与登录表单拉开大段留白，不再贴在同一视觉块内 */
  .login-form-panel { flex:1; display:grid; grid-template-rows:1fr auto; align-items:stretch; justify-items:center;
    padding:48px 32px 40px; min-height:0; width:100%; }
  /* 登录卡与盖章验证同宽 608（360 连续两次 +30%），随面板收缩 */
  .login-form-panel > .login-card,
  .login-form-panel > .login-card.login-card { align-self:center; width:min(100%, 608px); max-width:608px; }
  .login-form-panel > #verifyCard { align-self:end; }
  /* 盖章验证 = 登录页同款表单模块：与登录卡同平面（无横线、无卡片壳、无玻璃滤镜），
     复用 login-field / login-btn 规格；宽度 608 随面板收缩 */
  #authSection #verifyCard { width:min(100%, 608px); max-width:608px; margin:0; padding:0; background:transparent; background-image:none;
    border:none; border-radius:0; box-shadow:none; align-self:end;
    backdrop-filter:none; -webkit-backdrop-filter:none; }
  #authSection #verifyCard h2 { font-size:24px; font-weight:700; letter-spacing:-.01em; color:#1f2937; margin:0 0 28px; }
  /* 图标输入：与 .login-card .login-field 完全同规格（40px / 8px / 图标前缀） */
  #authSection #verifyCard .login-field { margin-bottom:16px; }
  #authSection #verifyCard .login-field input { width:100%; height:40px; padding:0 12px 0 38px; border-radius:8px; font-size:14px;
    background:rgba(255,255,255,.9); border:1px solid #e8e8eb; color:#1f2937; outline:none; transition:border-color .2s, box-shadow .2s; }
  #authSection #verifyCard .login-field input::placeholder { color:#9ca3af; }
  #authSection #verifyCard .login-field input:focus { border-color:#007AFF; box-shadow:0 0 0 3px rgba(0,122,255,.15); }
  /* 选择文件：容器做成输入框形态，左侧图标 + 「选择文件」描边钮（同获取验证码） */
  #authSection #verifyCard .file-field.login-file-row { display:flex; align-items:center; gap:10px; height:40px; padding:0 4px 0 38px;
    border-radius:8px; background:rgba(255,255,255,.9); border:1px solid #e8e8eb; position:relative; margin:0 0 16px;
    background-image:none; cursor:pointer; }
  #authSection #verifyCard .file-field.login-file-row:hover { background:rgba(255,255,255,.9); }
  #authSection #verifyCard .file-field.login-file-row .login-ico { position:absolute; left:12px; top:50%; transform:translateY(-50%);
    width:18px; height:18px; color:#9ca3af; pointer-events:none; }
  #authSection #verifyCard .file-field.login-file-row .file-btn { flex:none; padding:0 14px; height:32px; line-height:32px; border-radius:6px;
    font-size:13px; font-weight:600; background:rgba(255,255,255,.9); border:1px solid #e8e8eb; color:#007AFF; box-shadow:none; }
  #authSection #verifyCard .file-field.login-file-row .file-name { font-size:13px; color:#9ca3af; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  /* 验证按钮：登录主按钮同款 */
  #authSection #verifyCard .login-btn { display:block; width:100%; height:44px; border:none; border-radius:8px; background:#007AFF; color:#fff;
    font-size:15px; font-weight:600; letter-spacing:.02em; cursor:pointer; transition:background .18s, transform .15s; margin-top:0; }
  #authSection #verifyCard .login-btn:hover { background:#3395FF; }
  #authSection #verifyCard .login-btn:active { background:#0062CC; transform:scale(.995); }
  #authSection #verifyCard .status-line { margin:12px 0 0; font-size:12px; color:#9ca3af; line-height:1.55; }
  #authSection #verifyCard #verifyResult { margin-top:12px; }
  :root[data-theme="dark"] #authSection #verifyCard { background:transparent; }
  :root[data-theme="dark"] #authSection #verifyCard h2 { color:rgba(255,255,255,.92); }
  :root[data-theme="dark"] #authSection #verifyCard .login-field input { background:rgba(255,255,255,.07); border-color:#38383a; color:var(--text); }
  :root[data-theme="dark"] #authSection #verifyCard .file-field.login-file-row { background:rgba(255,255,255,.07); border-color:#38383a; }
  :root[data-theme="dark"] #authSection #verifyCard .file-field.login-file-row:hover { background:rgba(255,255,255,.07); }
  :root[data-theme="dark"] #authSection #verifyCard .file-field.login-file-row .file-btn { background:rgba(255,255,255,.07); border-color:#38383a; }
  /* ── 工作台 verifyCard：登录页控件类回退为工作台卡片形态（同一 DOM 节点被 placeVerify 来回搬运）── */
  main #verifyCard .login-field { position:relative; margin:0 0 10px; }
  main #verifyCard .login-field .login-ico { display:none; }
  main #verifyCard .login-field input { width:100%; height:auto; min-height:40px; padding:10px 12px; border-radius:10px; font-size:14px;
    background:var(--glass-input); border:1px solid var(--border); color:var(--text); }
  main #verifyCard .file-field.login-file-row { display:flex; align-items:center; gap:10px; min-height:46px; padding:6px 10px;
    border-radius:10px; border:1px solid var(--border); background:var(--glass-input); margin:0 0 10px; }
  main #verifyCard .file-field.login-file-row .login-ico { display:none; }
  main #verifyCard .file-field.login-file-row .file-btn { height:auto; line-height:normal; padding:7px 16px; border-radius:999px;
    background:var(--grad-accent); color:var(--on-accent); border:none; font-size:13px; }
  main #verifyCard .file-field.login-file-row .file-name { color:var(--text-3); font-size:13px; }
  main #verifyCard .login-btn { display:block; width:100%; height:40px; margin:0; border:none; border-radius:10px;
    background:var(--grad-accent); color:var(--on-accent); font-size:14px; font-weight:600; cursor:pointer; }
  main #verifyCard .login-btn:hover { background:var(--grad-accent); filter:brightness(1.05); }
  .login-brand { width:37%; min-width:320px; position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center;
    color:#fff; overflow:hidden; background:linear-gradient(150deg,#0B5ED7 0%,#1890FF 52%,#2FA3FF 100%); }
  .login-brand-flow { position:absolute; inset:0; pointer-events:none; }
  .login-brand-flow svg { width:100%; height:100%; display:block; }
  .login-brand-inner { position:relative; z-index:1; text-align:center; padding:0 36px; }
  .login-brand-logo { width:96px; height:96px; margin-bottom:28px; filter:drop-shadow(0 8px 24px rgba(0,0,0,.18)); }
  .login-brand-name { font-size:25px; font-weight:700; letter-spacing:-.01em; margin:0 0 12px; color:#fff; }
  .login-brand-desc { font-size:14px; line-height:1.8; color:rgba(255,255,255,.82); margin:0; max-width:300px; }
  .login-brand-copy { position:absolute; bottom:24px; left:0; right:0; z-index:1; font-size:12px; text-align:center; color:rgba(255,255,255,.55); margin:0; }
  .login-brand-copy .sep { margin:0 8px; opacity:.7; }
  .login-brand-copy a { color:inherit; text-decoration:none; transition:color .2s; }
  .login-brand-copy a:hover { color:rgba(255,255,255,.85); }
  .login-card { width:min(100%, 608px); max-width:608px; }
  .login-card h2 { font-size:24px; font-weight:700; letter-spacing:-.01em; color:#1f2937; margin:0 0 28px; }
  :root[data-theme="dark"] .login-card h2 { color:rgba(255,255,255,.92); }
  /* 输入框：ERP 同款 40px 高 / 8px 圆角 / 图标前缀（特异性高于全局玻璃输入样式） */
  .login-field { position:relative; margin-bottom:16px; }
  .login-field .login-ico { position:absolute; left:12px; top:50%; transform:translateY(-50%); width:18px; height:18px; color:#9ca3af; pointer-events:none; }
  .login-card .login-field input { width:100%; height:40px; padding:0 12px 0 38px; border-radius:8px; font-size:14px;
    background:rgba(255,255,255,.9); border:1px solid #e8e8eb; color:#1f2937; outline:none; transition:border-color .2s, box-shadow .2s; }
  .login-card .login-field input::placeholder { color:#9ca3af; }
  .login-card .login-field input:focus { border-color:#007AFF; box-shadow:0 0 0 3px rgba(0,122,255,.15); }
  :root[data-theme="dark"] .login-card .login-field input { background:rgba(255,255,255,.07); border-color:#38383a; color:var(--text); }
  .login-code-row { display:flex; gap:10px; margin-bottom:16px; }
  .login-code-row .login-field { flex:1; min-width:0; margin-bottom:0; }
  .login-code-btn { flex:none; height:40px; padding:0 16px; border-radius:8px; border:1px solid #e8e8eb; background:rgba(255,255,255,.9);
    color:#007AFF; font-size:13px; font-weight:600; cursor:pointer; white-space:nowrap; transition:border-color .2s, opacity .2s; }
  .login-code-btn:hover:not(:disabled) { border-color:#007AFF; }
  .login-code-btn:disabled { opacity:.55; cursor:not-allowed; }
  :root[data-theme="dark"] .login-code-btn { background:rgba(255,255,255,.07); border-color:#38383a; }
  .login-extras { display:flex; justify-content:space-between; align-items:center; margin:2px 0 20px; font-size:12px; color:#9ca3af; }
  .login-extras .login-fp { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .login-btn { display:block; width:100%; height:44px; border:none; border-radius:8px; background:#007AFF; color:#fff;
    font-size:15px; font-weight:600; letter-spacing:.02em; cursor:pointer; transition:background .18s, transform .15s; }
  .login-btn:hover { background:#3395FF; }
  .login-btn:active { background:#0062CC; transform:scale(.995); }
  .login-btn:disabled { opacity:.6; cursor:not-allowed; }
  .login-card .msg { margin-top:14px; border-radius:8px; }
  .login-footer { text-align:center; margin-top:24px; }
  .login-switch-link { background:none; border:none; padding:0; color:#007AFF; font-size:13px; cursor:pointer; }
  .login-switch-link:hover { text-decoration:underline; }
  /* 移动端：品牌区改顶部横条（同 ERP 响应式断点）；登录模块自然流排布，不参与底部锚定 */
  @media (max-width:768px) {
    #authSection { flex-direction:column; min-height:0; }
    .login-brand { width:100%; min-width:0; flex:none; height:220px; }
    .login-brand-logo { width:56px; height:56px; margin-bottom:12px; }
    .login-brand-name { font-size:20px; margin-bottom:6px; }
    .login-brand-desc, .login-brand-copy { display:none; }
    .login-form-panel { padding:36px 20px 36px; grid-template-rows:auto auto; }
  }


  .c-err-star { color:var(--err); }
  .c-ok-tip { color:var(--ok); }
  .tip-err-strong { color:var(--err);font-weight:600; }
  .flex-gap10-stretch { display:flex;gap:10px;align-items:stretch; }
  .flex-end-gap10-mt22 { display:flex;gap:10px;justify-content:flex-end;margin-top:22px; }
  .flex-between-mb8 { display:flex;justify-content:space-between;align-items:center;margin-bottom:8px; }
  .input-w110 { width:110px; }
  .mt-8-p10-12-warn { margin-top:8px;padding:10px 12px;border-radius:10px;border:1px solid var(--warn-border);background:var(--warn-tint);font-size:13px;color:var(--warn); }
  .steps-m { margin:12px 0 2px; }
  .mt-14-ta-c { margin-top:14px;text-align:center; }
  .seal-preview-img { max-width:180px;max-height:180px;border:1px dashed var(--border-strong);border-radius:8px;display:none; }
  .row-mt14-ac { margin-top:14px;align-items:center; }
  .m0-f1 { margin:0;flex:1; }
  .m-0-10 { margin:0 0 10px; }
  .row-ac-fw { align-items:center;flex-wrap:wrap; }
  .sig-pad-box { margin-top:12px;background:var(--doc-paper);border-radius:12px;padding:12px; }
  .sig-pad-canvas { width:100%;touch-action:none;border:1px dashed var(--doc-pad-line);border-radius:8px;background:var(--doc-paper);cursor:crosshair; }
  .f1-doc-tip { flex:1;color:var(--doc-tip-text); }
  .modal-panel { background:var(--solid);border-radius:16px;padding:26px 28px;box-shadow:var(--shadow-pop); }
  .modal-panel-420 { max-width:420px;width:calc(100% - 40px); }
  .modal-panel-520 { max-width:520px;width:calc(100% - 40px); }
  .modal-h3 { margin:0 0 10px;font-size:17px;color:var(--text); }
  .modal-h3-0 { margin:0;font-size:17px;color:var(--text); }
  .modal-msg { font-size:14px;line-height:1.7;color:var(--text-2); }
  .dev-tip-p { margin:0 0 14px;font-size:13px;color:var(--text-2);line-height:1.6; }
  .sign-preview-box { margin-top:10px;position:relative;border:1px solid var(--border-strong);border-radius:14px;overflow:hidden;background:var(--doc-paper); }
  .sign-canvas { display:block;width:100%;height:auto;cursor:crosshair;touch-action:none; }
  .sign-overlay { position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none; }
  .sign-tip { position:absolute;right:10px;bottom:8px;font-size:12px;color:var(--doc-tip-text);background:var(--doc-tip-bg);padding:4px 10px;border-radius:8px; }

  .chip-doc { background:var(--doc-paper);border-radius:8px;padding:8px;display:inline-block; }
  .m-4-0 { margin:4px 0; }

  .dk-code-input { width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid var(--border);border-radius:8px;font-size:14px;background:var(--glass-input);color:var(--text); }
  .dk-msg { margin:0 0 8px;font-size:13px;color:var(--text-2); }
  .prog-track { width:62%;max-width:280px;height:8px;border-radius:99px;background:var(--doc-pad-line);overflow:hidden; }
  .prog-bar { height:100%;width:18%;border-radius:99px;background:var(--grad-accent);transition:width .3s; }
  .doc-tip-13 { font-size:13px;color:var(--doc-tip-text); }
  .thumb-72 { max-width:240px;max-height:72px;display:block; }
  .tr-signer { align-items:center;padding:6px 0;border-top:1px solid var(--border-weak); }
  .f1-hint { flex:1;font-size:12px;color:var(--text-2); }
  .ml-6 { margin-left:6px; }
  .mb-8-ac { margin-bottom:8px;align-items:center; }
  .link-accent-none { cursor:pointer;color:var(--accent);text-decoration:none; }
  .ta-c-text3 { color:var(--text-3);text-align:center; }
  .ta-c-p10 { text-align:center;padding:10px 0 2px; }
  .d-flex-gap8-fs0 { display:flex;gap:8px;flex-shrink:0; }
  .hr-sec { border-top:1px solid var(--border);margin:10px 0; }
  .sec-h3 { margin:0 0 6px;color:var(--text);font-size:14px; }
  .mt-14-ta-l { margin-top:14px;text-align:left; }
  .fw600-ok-mb4 { font-weight:600;color:var(--ok);margin-bottom:4px; }
  .fs-12-text3 { color:var(--text-3);font-size:12px; }
  .c-err-11 { color:var(--err);font-size:11px; }
  .c-text2-11 { color:var(--text-2);font-size:11px; }
  .c-warn { color:var(--warn); }
  .p-6-8-w240 { padding:6px 8px;width:240px; }
  .w-80 { width:80px; }
  .w-90 { width:90px; }
  .w-100px { width:100px; }
  .w-104 { width:104px; }
  .w-132 { width:132px; }
  .w-170 { width:170px; }
  .w-292 { width:292px; }
  .w-350 { width:350px; }
  .thumb-36 { width:36px;height:36px;object-fit:contain;background:var(--doc-chip);border-radius:4px;vertical-align:middle; }
  .m-0-10b { margin:0 0 10px; }
  .st-ok { color:var(--ok); }
  .st-err { color:var(--err); }
  .st-warn { color:var(--warn); }
  .st-info { color:var(--info); }
  .st-purple { color:var(--purple); }
  .st-muted { color:var(--text-3); }

  .mb-8-only { margin-bottom:8px; }
  .alert-box { border:1px solid var(--line,#e5e5ea);border-radius:10px;padding:12px 14px;margin-bottom:12px; }
  .flex-sb-start { display:flex;justify-content:space-between;gap:10px;align-items:flex-start; }
  .minw-0 { min-width:0; }
  .fw600-text { font-weight:600;color:var(--text); }
  .hint-break { font-size:12px;color:var(--text-2);word-break:break-all;margin-top:4px; }
  .hint3-break { font-size:12px;color:var(--text-3);margin-top:4px; }
  .ox-auto { overflow-x:auto; }
  .tbl-14 { width:100%;border-collapse:collapse;font-size:14px; }
  .th-left-bb { text-align:left;color:var(--text-2);border-bottom:1px solid var(--border); }
  .td-r-600 { padding:8px 10px;font-weight:600;text-align:right; }
  .sel-glass { background:var(--glass-input);color:var(--text-2); }
  .bb-border { border-bottom:1px solid var(--border); }
  .p9-text2 { padding:9px 10px;color:var(--text-2); }
  .p9-r-wn { padding:9px 10px;text-align:right;white-space:nowrap; }
  .p12-ta-c-text3 { padding:12px 10px;color:var(--text-3);text-align:center; }
  .row-sb-ac8 { margin:5px 0;display:flex;justify-content:space-between;align-items:center;gap:8px; }
  .row-sb-ac8-4 { margin:4px 0;display:flex;justify-content:space-between;align-items:center;gap:8px; }
  .ml-8 { margin-left:8px; }
  .mb-10 { margin-bottom:10px; }
  .mt-12-err { margin-top:12px;color:var(--err); }
  .modal-panel-scroll { max-height:80vh;overflow:auto; }

  /* ── L-6：原 style 属性 class 化（便于 CSP 去掉 style-src-attr unsafe-inline） ── */
  .cursor-p { cursor:pointer; }
  .d-none { display:none !important; }
  .d-flex { display:flex; }
  .f1 { flex:1; }
  .ac { align-items:center; }
  .jc { justify-content:center; }
  .as-stretch { align-items:stretch; }
  .gap-8 { gap:8px; }
  .gap-10 { gap:10px; }
  .m-0 { margin:0; }
  .mt-4 { margin-top:4px; }
  .mt-6 { margin-top:6px; }
  .mt-10 { margin-top:10px; }
  .mt-12 { margin-top:12px; }
  .mt-14 { margin-top:14px; }
  .mt-16 { margin-top:16px; }
  .mt-18 { margin-top:18px; }
  .mt-20 { margin-top:20px; }
  .mb-4 { margin-bottom:4px; }
  .mb-6 { margin-bottom:6px; }
  .mb-8 { margin-bottom:8px; }
  .mb-16 { margin-bottom:16px; }
  .m-0-8 { margin:0 0 8px; }
  .m-0-4 { margin:0 0 4px; }
  .m-10-0-4 { margin:10px 0 4px; }
  .ml-10 { margin-left:10px; }
  .ta-c { text-align:center; }
  .ta-l { text-align:left; }
  .td-none { text-decoration:none; }
  .wn { white-space:nowrap; }
  .fs-11 { font-size:11px; }
  .fs-12 { font-size:12px; }
  .fs-13 { font-size:13px; }
  .fs-20 { font-size:20px; }
  .fs-46 { font-size:46px; }
  .lh-1 { line-height:1; }
  .fw-600 { font-weight:600; }
  .fw-700 { font-weight:700; }
  .ls-6 { letter-spacing:.6px; }
  .c-accent { color:var(--accent); }
  .c-text2 { color:var(--text-2); }
  .c-text3 { color:var(--text-3); }
  .c-ok { color:var(--ok); }
  .c-err { color:var(--err); }
  .c-on-accent { color:var(--on-accent); }
  .w-56 { width:56px; }
  .w-64 { width:64px; }
  .w-72 { width:72px; }
  .w-88 { width:88px; }
  .w-110 { width:110px; }
  .w-100 { width:100%; }
  .p-6-8 { padding:6px 8px; }
  .p-8-10 { padding:8px 10px; }
  .p-9-10 { padding:9px 10px; }
  .p-12-10 { padding:12px 10px; }
  .p-30-22 { padding:30px 22px; }
  .mw-150-c { min-width:150px;text-align:center; }
  .border-t-weak { border-top:1px solid var(--border-weak); }
  .cursor-p.c-accent { cursor:pointer; }
  .btn-ok-solid { background:var(--grad-ok); box-shadow:0 5px 16px var(--ok-glow), inset 0 1px 0 var(--on-accent-rim); }
  .dl-pill { flex:1;text-align:center;padding:12px 10px;border-radius:999px;font-weight:600;text-decoration:none;box-shadow:0 5px 16px var(--accent-glow); }
  .dl-pill-accent { color:var(--on-accent);background:var(--grad-accent); }
  .dl-pill-ok { color:var(--on-accent);background:var(--grad-ok);box-shadow:0 5px 16px var(--ok-glow); }
  .onboard-border { border-color:var(--accent-border); }
  .complete-no { font-size:20px;font-weight:700;margin:16px 0 4px;letter-spacing:.6px;color:var(--text); }
  .complete-chain { margin-top:20px;text-align:left;font-size:12px;color:var(--text-3); }
  .btn-minw-center { margin:0;min-width:150px;text-align:center; }
  .card-ta-c { text-align:center;padding:30px 22px; }
  .emoji-lg { font-size:46px;line-height:1; }
  .th-left { color:var(--text-2);text-align:left; }
  .tbl-audit { width:100%;margin-top:14px;font-size:13px;border-collapse:collapse; }
  .link-accent { color:var(--accent);cursor:pointer; }
  .hint-12 { font-size:12px;color:var(--text-2); }


/* 确认框永远位于其他 lightbox（如设备管理面板）之上：
   两者同为 z-index:999 时由 DOM 顺序决定层叠，从面板内触发的确认框会被面板盖住导致按钮点不到 */
#confirmModal { z-index: 1001; }
