:root {
  color-scheme: only light;
  /* 2026-09-29 起默认主题=「福盟蓝」，与工人端小程序同一套色板（#1F6FEB 系）
     原海洋绿主题保留在 body[data-theme="forest"]（个人档案 → 外观主题 可切回） */
  --primary: #1F6FEB;
  --primary-light: #E8F1FE;
  --primary-dark: #1A5FD0;
  --brand-deep: #1749B6;
  
  --surface: #FFFFFF;
  --danger: #C0392B;
  --danger-light: #FCEDEB;
  --warn: #B07A1E;
  --warn-light: #FBF1DC;
  --info: #2B6CB0;
  --info-light: #E7F0FA;
  --text: #1A1D21;
  --text2: #5B6470;
  --border: #E4E7EC;
  --bg: #F5F6F8;
  
  --shadow: 0 1px 3px rgba(16, 24, 40, .06), 0 1px 2px rgba(16, 24, 40, .04);
  --shadow-lg: 0 12px 32px rgba(16, 24, 40, .12);
  
  --ease: cubic-bezier(.4, 0, .2, 1);

  /* ===== 换肤调色板（body[data-theme] 会整套覆盖）===== */
  --page-a: #EDF4FD;               /* 整站背景渐变 · 起 */
  --page-b: #F7FAFF;               /* 整站背景渐变 · 止 */
  --side-bg: rgba(255, 255, 255, .8);
  --side-hover: #EAF2FD;
  /* 概览横幅渐变 · 起 */
  --hero-b: #4C8DF3;               /* 概览横幅渐变 · 中 */
  /* 概览横幅渐变 · 止 */
  --hero-glow: rgba(31, 111, 235, .28);
  /* 横幅内小胶囊文字色 */
  --line: #E2EBF7;                 /* 通用分隔线 */
  --row-head: #ECF3FC;             /* 表头 / 缩略图底 */
  --row-hover: #F5F9FE;            /* 表格行 hover */
  --row-alt: #EDF4FC;              /* 斑马纹 / 分组行 */
  --ic-a: rgba(203, 224, 247, .55);
  --ic-b: rgba(146, 186, 232, .4);
  --glow-a: rgba(120, 170, 250, .5);
  --glow-b: rgba(200, 225, 250, .22);
  --avatar-a: #1F6FEB;
  --avatar-b: #84B4EC;
  /* 页面底部装饰波浪 · 浅 */
  /* 页面底部装饰波浪 · 深 */
  /* 登录页三层波浪 · 浅 */
  
  
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; background: var(--page-b, #f5f6f8) }
body { font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif; background: transparent; color: var(--text); font-size: 14px; -webkit-font-smoothing: antialiased }
button { font-family: inherit; cursor: pointer; }
input, select, textarea { font-family: inherit; font-size: 14px; padding: 8px 12px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface); outline: none; transition: border-color .2s var(--ease), box-shadow .2s var(--ease), background .2s var(--ease); }
input:focus, select:focus, textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(31, 111, 235, .14); }
/* 键盘导航可见性：只对键盘焦点画环，鼠标点击不显示（不干扰视觉） */
:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; border-radius: 6px; }
button:focus:not(:focus-visible), input:focus:not(:focus-visible) { outline: none; }
h2 { font-size: 18px; margin-bottom: 4px; letter-spacing: .2px; }
.sub { color: var(--text2); font-size: 12.5px; }
code { background: var(--primary-light); padding: 2px 8px; border-radius: 6px; font-size: 14px; letter-spacing: 2px; color: var(--primary); font-weight: 700; }/* 统一等宽数字：金额/数量/统计列切换数据时不左右跳动 */
.num, .stat .v, .jt-kpi b, .pay-sum, .pay-total td { font-variant-numeric: tabular-nums; }
/* 细滚动条（主内容 + 横向表格）：比系统默认细，视觉更安静 */
.main::-webkit-scrollbar, .modal::-webkit-scrollbar, .table-scroll::-webkit-scrollbar, .modal-grid::-webkit-scrollbar, .sidebar nav::-webkit-scrollbar { width: 8px; height: 8px; }
.main::-webkit-scrollbar-track, .modal::-webkit-scrollbar-track, .table-scroll::-webkit-scrollbar-track, .modal-grid::-webkit-scrollbar-track { background: transparent; }
.main::-webkit-scrollbar-thumb, .modal::-webkit-scrollbar-thumb, .table-scroll::-webkit-scrollbar-thumb, .modal-grid::-webkit-scrollbar-thumb { background: rgba(120, 132, 122, .3); border-radius: 4px; }
.main::-webkit-scrollbar-thumb:hover, .modal::-webkit-scrollbar-thumb:hover, .table-scroll::-webkit-scrollbar-thumb:hover, .modal-grid::-webkit-scrollbar-thumb:hover { background: rgba(120, 132, 122, .5); }

/* ===== 通用动画 ===== */
@keyframes fadeInUp { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes popIn { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: scale(1); } }
@keyframes slideInRight { from { opacity: 0; transform: translateX(24px); } to { opacity: 1; transform: none; } }
@keyframes toastIn { from { opacity: 0; transform: translate(-50%, -12px); } to { opacity: 1; transform: translate(-50%, 0); } }
@keyframes growUp { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@keyframes drawLine { from { stroke-dashoffset: 1600; } to { stroke-dashoffset: 0; } }
@keyframes pieIn { from { opacity: 0; transform: scale(.85); transform-origin: center; } to { opacity: 1; transform: scale(1); } }
@keyframes dotIn { from { opacity: 0; } to { opacity: 1; } }
/* 弹层专用：遮罩只做透明度淡入（不位移，避免背景"晃动"），面板做方向性入场 */
@keyframes maskFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes modalUp { from { opacity: 0; transform: translateY(14px) scale(.975); } to { opacity: 1; transform: none; } }

/* 登录页 —— conversion 式清透底（全局动效光斑）+ 底部花草带 + 毛玻璃卡（2026-09-30 skyflora 重设计） */
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 26px 20px 150px; position: relative; overflow: hidden; background: transparent; }
/* 视频背景：片源已烘焙无缝循环（片尾↔片头交叉溶解），单元素 loop 播放 */
.login-video {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; z-index: 0; opacity: 1;
  pointer-events: none;
  /* 取景已在片源内烘焙（裁剪+放大一次完成），此处不再缩放，避免二次放大发糊 */
}
.login-veil {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  /* 2026-09-30 减雾：之前 .34 的白雾把视频洗糊，降到 .16 仅保留轻微通透感 */
  background: linear-gradient(180deg, rgba(255, 255, 255, .16) 0%, rgba(255, 255, 255, .07) 42%, rgba(255, 255, 255, .03) 100%);
}
.login-card { position:relative; z-index: 2; background: linear-gradient(180deg, rgba(9, 13, 28, .30), rgba(9, 13, 28, .44)), rgba(255, 255, 255, .09); backdrop-filter: blur(22px) saturate(1.25); -webkit-backdrop-filter: blur(22px) saturate(1.25); border: 1px solid rgba(255, 255, 255, .28); box-shadow: 0 16px 44px rgba(4, 8, 20, .38), inset 0 1px 0 rgba(255, 255, 255, .22); border-radius: 26px; padding: 40px 34px 28px; width: 400px; max-width: 100%; animation: fadeInUp .5s var(--ease); text-align: center; margin-top: 44px }
.login-brand-ic { width: 64px; height: 64px; border-radius: 18px; margin: -76px auto 14px; background: rgba(255, 255, 255, .92); color: var(--primary); font-size: 24px; font-weight: 800; display: flex; align-items: center; justify-content: center; box-shadow: 0 10px 30px rgba(16, 24, 40, .16); animation: fadeInUp .5s var(--ease) .06s backwards; }
/* 深色玻璃配套（20260930q：背景只剩 9% 白 + 暗衬底，文字改白否则没入银河） */
.login-card h1 { font-size: 24px; font-weight: 800; letter-spacing: .5px; color: #fff; }
.login-card h1 .hl { color: #9cc6ff; }
.login-card .sub { color: rgba(255, 255, 255, .78); }
.pill-yellow { display: inline-block; background: var(--primary-light); color: var(--primary); font-size: 12.5px; font-weight: 600; padding: 5px 16px; border-radius: 999px; margin: 8px 0 16px; }
.login-card input { width: 100%; margin-bottom: 12px; border-radius: 12px; background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .22); color: #fff; }
.login-card input::placeholder { color: rgba(255, 255, 255, .55); }
.login-tabs { display: flex; margin-bottom: 18px; border-bottom: 1px solid rgba(255, 255, 255, .22); }
.login-tabs button { flex: 1; background: none; border: none; padding: 10px; font-size: 14px; color: rgba(255, 255, 255, .78); border-bottom: 2px solid transparent; transition: color .2s, border-color .2s; }
.login-tabs button.on { color: #fff; border-bottom-color: #9cc6ff; font-weight: 600; }
.login-foot { position: absolute; bottom: 22px; left: 0; right: 0; display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; z-index: 3; }
.foot-chip { background: rgba(255, 255, 255, .82); backdrop-filter: blur(12px) saturate(1.4); border: 1px solid rgba(255, 255, 255, .9); border-radius: 18px; padding: 7px 15px; font-size: 12.5px; font-weight: 600; color: var(--primary-dark); box-shadow: 0 6px 16px rgba(16, 24, 40, .14); animation: fadeInUp .6s var(--ease) backwards; display: inline-flex; align-items: center; gap: 7px }
.foot-chip:nth-child(2) { animation-delay: .12s; }
.foot-chip:nth-child(3) { animation-delay: .24s; }
.login-card .btn.full { background: var(--grad-primary, var(--primary)); }
.login-card .btn.full:hover { background: var(--primary-dark); }

@keyframes chipIn { from { opacity: 0; transform: translateY(10px) scale(.9); } to { opacity: 1; transform: none; } }

/* 概览功能宫格 */
.quick-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px; margin-bottom: 18px; }
.q-tile { background: var(--surface); border: none; border-radius: 16px; padding: 18px 14px 15px; text-align: left; box-shadow: 0 4px 18px rgba(16, 24, 40, .07); transition: transform .2s var(--ease), box-shadow .25s var(--ease); animation: fadeInUp .45s var(--ease) backwards; display: flex; flex-direction: column; gap: 10px; cursor: pointer; }
.q-tile:nth-child(1) { animation-delay: .03s; } .q-tile:nth-child(2) { animation-delay: .08s; }
.q-tile:nth-child(3) { animation-delay: .13s; } .q-tile:nth-child(4) { animation-delay: .18s; }
.q-tile:nth-child(5) { animation-delay: .23s; } .q-tile:nth-child(6) { animation-delay: .28s; }
.q-tile:hover { transform: translateY(-4px); box-shadow: 0 12px 28px rgba(31, 111, 235, .16); }
.q-tile:hover .g-ic { transform: translateY(-2px) rotate(-5deg); }
.q-tile .g-ic { transition: transform .25s var(--ease); }
.q-tile b { font-size: 14.5px; color: var(--text); }
.q-tile .q-sub { font-size: 12px; color: var(--text2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis }
.q-tile .q-arrow { align-self: flex-end; color: var(--primary); font-weight: 700; opacity: 0; transform: translateX(-6px); transition: all .2s var(--ease); font-size: 13px; }
.q-tile:hover .q-arrow { opacity: 1; transform: translateX(0); }

/* 概览 Hero —— 还原旧版圆角横幅：主题渐变 + 白胶囊 chips（2026-09-30 Tim 定稿） */
.hero { position: relative; border-radius: 22px; padding: 26px 30px; margin-bottom: 18px; overflow: hidden; color: #fff; background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%); box-shadow: 0 10px 28px var(--hero-glow), 0 2px 8px rgba(16, 24, 40, .08); animation: fadeInUp .45s var(--ease); }
/* 右上弱圆装饰（保留一点点层次，不要微光扫过） */
.hero::before { content: ''; position: absolute; width: 300px; height: 300px; right: -110px; top: -180px; border-radius: 50%; background: rgba(255, 255, 255, .08); pointer-events: none; }
.hero::after { content: none; }.hero-wave { display: none; }
.hero-txt { position: relative; z-index: 2; }
.hero-txt h2 { font-size: 25px; font-weight: 800; letter-spacing: .5px; margin-bottom: 5px; }
.hero-txt .hero-sub { font-size: 13.5px; opacity: .92; }
.hero-chips { display: flex; gap: 9px; flex-wrap: wrap; margin-top: 14px; }
.chip { display: inline-flex; align-items: center; gap: 6px; background: rgba(255, 255, 255, .94); color: var(--primary-dark); border: none; border-radius: 999px; padding: 7px 14px; font-size: 13px; font-weight: 600; cursor: pointer; transition: transform .18s var(--ease), background .18s var(--ease), box-shadow .18s var(--ease); box-shadow: 0 2px 8px rgba(16, 24, 40, .12); }
.chip .g-ic svg { stroke: var(--primary-dark); }
.chip .g-ic { background: var(--primary-light); border-radius: 50%; }
.chip:hover { transform: translateY(-2px); background: #fff; box-shadow: 0 8px 18px rgba(16, 24, 40, .2); }
.chip:active { transform: scale(.97); }
.chip .chip-dot { background: var(--primary); color: #fff; border-radius: 10px; padding: 0 7px; font-size: 11.5px; font-weight: 700; }

/* 按钮 */
.btn { padding: 9px 16px; border: none; border-radius: 9px; background: var(--primary); color: #fff; font-size: 14px; transition: transform .15s var(--ease), box-shadow .2s var(--ease), background .2s, opacity .2s; box-shadow: var(--shadow); }
.btn:hover { background: var(--primary-dark); box-shadow: 0 4px 12px rgba(31, 111, 235, .3); transform: translateY(-1px); }
.btn:active { transform: translateY(0) scale(.97); }
.btn.full { width: 100%; }
.btn.ghost { background: var(--surface); color: var(--primary); border: 1px solid var(--primary); box-shadow: none; }
.btn.ghost:hover { background: var(--primary-light); box-shadow: none; }
.btn.danger { background: var(--danger); }
.btn.danger:hover { background: #A93226; box-shadow: 0 4px 12px rgba(192, 57, 43, .28); }
.btn.sm { padding: 5px 10px; font-size: 12.5px; border-radius: 7px; }
.btn:disabled { opacity: .5; cursor: not-allowed; transform: none !important; }
.link { background: none; border: none; color: var(--info); text-decoration: none; font-size: 13px; padding: 0; border-radius: 4px; transition: color .15s; }
.link:hover { text-decoration: underline; color: #1A5A96; }

/* ===== 毛玻璃渐变图标系统 ===== */
/* 半透明磨砂玻璃：底色只给 35% 左右的透明度，透出页面底色 */
.g-ic { position: relative; z-index: 0; width: 27px; height: 27px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; background: linear-gradient(145deg, var(--ic-a) 0%, var(--ic-b) 100%); border: 1px solid rgba(255, 255, 255, .68); box-shadow: 0 3px 9px rgba(100, 145, 90, .16), inset 0 1px 1px rgba(255, 255, 255, .5); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); }
.g-ic::before { content: ''; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: linear-gradient(145deg, var(--ic-a), var(--ic-b)); transform: translate(3px, -3px); opacity: .45; }
.g-ic::after { content: ''; position: absolute; left: 12%; top: 7%; width: 54%; height: 42%; border-radius: 6px; background: linear-gradient(135deg, rgba(255, 255, 255, .65), rgba(255, 255, 255, .04)); filter: blur(1px); }
.g-ic svg { position: relative; z-index: 1; width: 14px; height: 14px; filter: drop-shadow(0 1px 1px rgba(70, 110, 60, .28)); }
.g-ic.sm { width: 21px; height: 21px; border-radius: 7px; }
.g-ic.sm svg { width: 11px; height: 11px; }
.g-ic.sm::before { transform: translate(2px, -2px); }
.g-ic.sm::after { border-radius: 4px; }
.g-ic.md { width: 36px; height: 36px; border-radius: 12px; }
.g-ic.md svg { width: 19px; height: 19px; }
.g-ic.md::before { transform: translate(4px, -4px); }
.g-ic.md::after { border-radius: 8px; }
.g-green { background: linear-gradient(145deg, rgba(157, 191, 168, .42) 0%, rgba(87, 131, 103, .5) 100%); }
.g-green::before { background: linear-gradient(145deg, rgba(194, 218, 203, .5), rgba(133, 175, 148, .35)); }
.g-red { background: linear-gradient(145deg, rgba(214, 162, 148, .42) 0%, rgba(165, 98, 79, .5) 100%); }
.g-red::before { background: linear-gradient(145deg, rgba(232, 196, 184, .5), rgba(201, 141, 123, .35)); }
.g-amber { background: linear-gradient(145deg, rgba(217, 196, 156, .42) 0%, rgba(160, 130, 74, .5) 100%); }
.g-amber::before { background: linear-gradient(145deg, rgba(235, 221, 190, .5), rgba(203, 176, 126, .35)); }
.g-teal { background: linear-gradient(145deg, rgba(157, 196, 192, .42) 0%, rgba(87, 132, 127, .5) 100%); }
.g-teal::before { background: linear-gradient(145deg, rgba(196, 222, 219, .5), rgba(140, 184, 179, .35)); }

.fin-tab { display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--border); background: var(--surface); color: var(--text); border-radius: 10px; padding: 9px 16px; font-size: 14px; transition: all .2s var(--ease) }
.io-btn .ic-wrap { display: flex; justify-content: center; margin-bottom: 10px; }
.photo-btn { display: flex; flex-direction: column; align-items: center; gap: 3px; border: 2px dashed var(--border); background: #FCFDFB; border-radius: 14px; padding: 16px 12px; color: var(--text); font-size: 14px; transition: border-color .2s var(--ease), background .2s var(--ease), transform .18s var(--ease) }
.photo-btn .pb-ic { display: flex; justify-content: center; margin-bottom: 6px; font-size: 26px; line-height: 1.2; transition: transform .25s var(--ease) }

/* 布局 —— 无边浮动风：浅蓝灰画布 + 白色浮岛 */
.layout { display: flex; min-height: 100vh; background: transparent }
.sidebar { width: 212px; background: var(--side-bg); backdrop-filter: blur(10px); border-right: none; box-shadow: 8px 0 28px rgba(16, 24, 40, .05); padding: 18px 12px 12px; flex-shrink: 0; display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; z-index: 2; overflow: hidden }
.sidebar .brand { font-weight: 700; font-size: 15px; padding: 4px 10px 18px; color: var(--primary); display: flex; gap: 8px; align-items: center; line-height: 1.25; }
.sidebar .brand small { font-size: 10.5px; color: var(--text2); font-weight: 400; }
.brand-logo { width: 30px; height: 30px; object-fit: cover; border-radius: 50%; box-shadow: 0 3px 8px rgba(80, 120, 60, .22); animation: logoBob 4s ease-in-out infinite; }
@keyframes logoBob { 0%, 100% { transform: translateY(0) rotate(-3deg); } 50% { transform: translateY(-4px) rotate(4deg); } }
.sidebar nav { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--side-hover) transparent; padding-bottom: 6px; }
.sidebar nav::-webkit-scrollbar { width: 5px; }
.sidebar nav::-webkit-scrollbar-track { background: transparent; }
.sidebar nav::-webkit-scrollbar-thumb { background: var(--side-hover); border-radius: 3px; }
.sidebar nav::-webkit-scrollbar-thumb:hover { background: var(--text2); }

.sidebar nav a { display: flex; align-items: center; gap: 11px; padding: 7px 10px; border-radius: 12px; color: var(--text); text-decoration: none; margin-bottom: 3px; font-size: 14px; position: relative; transition: background .2s var(--ease), color .2s var(--ease), transform .15s var(--ease); animation: navIn .32s var(--ease) backwards; }
.sidebar nav a:nth-child(1) { animation-delay: .02s; } .sidebar nav a:nth-child(2) { animation-delay: .05s; }
.sidebar nav a:nth-child(3) { animation-delay: .08s; } .sidebar nav a:nth-child(4) { animation-delay: .11s; }
.sidebar nav a:nth-child(5) { animation-delay: .14s; } .sidebar nav a:nth-child(6) { animation-delay: .17s; }
.sidebar nav a:nth-child(7) { animation-delay: .2s; } .sidebar nav a:nth-child(8) { animation-delay: .23s; }
.sidebar nav a:nth-child(9) { animation-delay: .26s; } .sidebar nav a:nth-child(n+10) { animation-delay: .3s; }
@keyframes navIn { from { opacity: 0; transform: translateX(-10px); } to { opacity: 1; transform: none; } }
.sidebar nav a .g-ic { transition: transform .25s var(--ease), box-shadow .25s var(--ease); }
.sidebar nav a:hover { background: var(--side-hover); transform: translateX(2px); }
.sidebar nav a:hover .g-ic { transform: translateY(-2px) rotate(-4deg); box-shadow: 0 7px 14px rgba(100, 145, 90, .26), inset 0 1px 1px rgba(255, 255, 255, .5); }
.sidebar nav a.on { background: var(--primary-light); color: var(--primary); font-weight: 600; }
.sidebar nav a.on::before { content: ''; position: absolute; left: -12px; top: 22%; bottom: 22%; width: 3px; border-radius: 2px; background: var(--primary); }
.sidebar .who { display: flex; align-items: center; gap: 10px; padding: 12px 10px; border-top: 1px solid var(--border); cursor: pointer; border-radius: 9px; transition: background .2s; margin-top: 8px; }
.sidebar .who:hover { background: var(--side-hover); }
.who-txt { min-width: 0; }
.who-txt b { font-size: 13.5px; display: block; }
.who-actions { display: flex; gap: 10px; padding: 4px 10px 6px; }
.main { flex: 1; min-width: 0; padding: 24px 34px 40px; max-width: none; position: relative; z-index: 1; }
.page-head { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 18px; flex-wrap: wrap; gap: 10px; animation: fadeInUp .35s var(--ease) backwards }

/* 头像 */
.avatar { position: relative; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; overflow: hidden; background: linear-gradient(135deg, var(--avatar-a), var(--avatar-b)); color: #fff; font-weight: 700; flex-shrink: 0; }
.avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.av-fallback { font-style: normal; }
.av-28 { width: 28px; height: 28px; font-size: 13px; }
.av-32 { width: 32px; height: 32px; font-size: 14px; }
.av-40 { width: 40px; height: 40px; font-size: 16px; }
.av-96 { width: 96px; height: 96px; font-size: 34px; }
.user-cell { display: flex; align-items: center; gap: 8px; }

/* 卡片/表格 —— 无边软卡片 */
.card { background: var(--surface); border: none; border-radius: 16px; padding: 18px; margin-bottom: 16px; box-shadow: 0 4px 18px rgba(16, 24, 40, .06); transition: box-shadow .25s var(--ease), transform .2s var(--ease); animation: cardIn .38s var(--ease) backwards; }
#main > .card:nth-of-type(2) { animation-delay: .05s; }
#main > .card:nth-of-type(3) { animation-delay: .1s; }
#main > .card:nth-of-type(4) { animation-delay: .15s; }
#main > .card:nth-of-type(n+5) { animation-delay: .2s; }
@keyframes cardIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

main tbody tr, .card tbody tr { animation: rowIn .3s var(--ease) backwards; }
tbody tr:nth-child(1) { animation-delay: .03s; } tbody tr:nth-child(2) { animation-delay: .06s; }
tbody tr:nth-child(3) { animation-delay: .09s; } tbody tr:nth-child(4) { animation-delay: .12s; }
tbody tr:nth-child(5) { animation-delay: .15s; } tbody tr:nth-child(6) { animation-delay: .18s; }
tbody tr:nth-child(7) { animation-delay: .21s; } tbody tr:nth-child(n+8) { animation-delay: .24s; }
@keyframes rowIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }
.card:hover { box-shadow: 0 12px 32px rgba(16, 24, 40, .1); }
.search-bar { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; padding: 12px 14px; }
.search-bar input { min-width: 200px; flex: 1; }
.grid-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 16px; }
.stat { background: var(--surface); border: none; border-radius: 16px; padding: 16px 18px; box-shadow: 0 4px 18px rgba(16, 24, 40, .06); transition: transform .2s var(--ease), box-shadow .2s var(--ease); animation: fadeInUp .4s var(--ease) backwards; }
.grid-stats .stat:nth-child(1) { animation-delay: .02s; } .grid-stats .stat:nth-child(2) { animation-delay: .06s; }
.grid-stats .stat:nth-child(3) { animation-delay: .1s; } .grid-stats .stat:nth-child(4) { animation-delay: .14s; }
.grid-stats .stat:nth-child(5) { animation-delay: .18s; } .grid-stats .stat:nth-child(6) { animation-delay: .22s; }
.stat:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(16, 24, 40, .1); }
.stat .v { font-size: 26px; font-weight: 700; color: var(--primary); }
.stat .v.warn { color: var(--warn); }
.stat .v.info { color: var(--info); }
.stat .k { font-size: 12px; color: var(--text2); margin-top: 2px; }
.stat .s { font-size: 11.5px; color: var(--text2); margin-top: 5px; line-height: 1.45; }
table { width: 100%; border-collapse: collapse; }
.table-scroll { overflow-x: auto; margin: -4px; padding: 4px; max-height: 72vh; overflow: auto }
#inv-table { overflow-x: auto; }
#inv-table table { min-width: 1080px; }
th, td { text-align: left; padding: 10px 10px; border-bottom: 1px solid var(--line); font-size: 13.5px; white-space: nowrap; }
th { color: var(--text2); font-weight: 500; font-size: 12.5px; }
td.wrap { white-space: normal; }
tbody tr, tr { transition: background .15s var(--ease); }
tr:hover td { background: var(--row-hover); }
.badge { display: inline-block; padding: 2px 9px; border-radius: 10px; font-size: 12px; font-weight: 500; transition: background .18s var(--ease), color .18s var(--ease); }
.badge.g { background: var(--primary-light); color: var(--primary); }
.badge.r { background: var(--danger-light); color: var(--danger); }
.badge.y { background: var(--warn-light); color: var(--warn); }
.badge.b { background: var(--info-light); color: var(--info); }
.stock-low { color: var(--danger); font-weight: 700; }

/* 表单 */
.form-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.form-grid .fg { display: flex; flex-direction: column; gap: 4px; }
.form-grid label { font-size: 12.5px; color: var(--text2); }
.form-grid .wide { grid-column: span 2; }
textarea { resize: vertical; }
.actions { display: flex; gap: 8px; margin-top: 14px; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; }
.actions > .actions-inline { display: flex; gap: 8px; }
/* 弹层：遮罩淡入（带轻微磨砂）+ 面板上浮入场 */
.modal-mask { position: fixed; inset: 0; background: rgba(16, 24, 40, .45); display: flex; align-items: center; justify-content: center; z-index: 50; padding: 20px; animation: maskFade .18s var(--ease); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
.modal { position: relative; background: rgba(255, 255, 255, .9); border-radius: 16px; padding: 22px; width: 580px; max-width: 100%; max-height: 88vh; overflow: auto; animation: modalUp .26s cubic-bezier(.22, 1, .36, 1); box-shadow: var(--shadow-lg); backdrop-filter: blur(22px) saturate(1.5); -webkit-backdrop-filter: blur(22px) saturate(1.5); border: 1px solid rgba(255, 255, 255, .7) }
.modal h3 { margin-bottom: 14px; padding-right: 40px; }
/* 右上角关闭按钮：所有弹窗通用（2026-09-29 Tim：不能只能保存不能取消） */
.modal-x { position: absolute; top: 14px; right: 14px; width: 30px; height: 30px; padding: 0; border: none; border-radius: 8px; background: transparent; color: var(--text2); font-size: 20px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .15s var(--ease), color .15s var(--ease); }
.modal-x:hover { background: var(--bg); color: var(--text); }
.modal-x:active { transform: scale(.94); }
/* 宽版弹窗：订单/生产单录入用（导出仍是 A4，只是录入画面大） */
.modal.wide { width: min(1180px, 96vw); }
.modal.wide .form-grid { grid-template-columns: repeat(3, 1fr); }
.modal.wide .form-grid .wide { grid-column: span 3; }

/* 头像选择器 */
.avatar-picker { display: flex; gap: 12px; flex-wrap: wrap; }
.av-opt { width: 84px; border: 2px solid var(--border); background: var(--surface); border-radius: 12px; padding: 8px 6px; display: flex; flex-direction: column; align-items: center; gap: 5px; font-size: 12px; color: var(--text2); transition: border-color .2s var(--ease), transform .2s var(--ease), box-shadow .2s var(--ease); }
.av-opt img { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; }
.av-opt:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.av-opt.on { border-color: var(--primary); color: var(--primary); font-weight: 600; box-shadow: 0 0 0 3px rgba(31, 111, 235, .16); }
.profile-card { display: flex; flex-direction: column; align-items: center; padding: 28px; }
.profile-avatar { animation: popIn .45s var(--ease); }

/* 图表 */
.chart-box { display: flex; gap: 22px; align-items: center; flex-wrap: wrap; }
.chart-title { font-weight: 600; margin-bottom: 12px; }
.legend { display: flex; flex-direction: column; gap: 6px; font-size: 13px; min-width: 160px; }
.lg-item { display: flex; align-items: center; gap: 8px; animation: slideInRight .4s var(--ease) backwards; }
.lg-item:nth-child(1) { animation-delay: .05s; } .lg-item:nth-child(2) { animation-delay: .1s; }
.lg-item:nth-child(3) { animation-delay: .15s; } .lg-item:nth-child(4) { animation-delay: .2s; }
.lg-item:nth-child(5) { animation-delay: .25s; } .lg-item:nth-child(6) { animation-delay: .3s; }
.lg-dot { width: 10px; height: 10px; border-radius: 3px; flex-shrink: 0; }
.pie-slice { animation: pieIn .5s var(--ease) backwards; transition: opacity .2s; cursor: pointer; }
.pie-slice:hover { opacity: .82; }
.pie-total { font-size: 26px; font-weight: 700; fill: var(--text); }
.pie-sub { font-size: 11px; fill: var(--text2); }
.grid-line { stroke: #EDEFEA; stroke-width: 1; }
.tick { font-size: 10.5px; fill: var(--text2); }
.line-path { stroke-dasharray: 1600; animation: drawLine 1.1s var(--ease) forwards; }
.line-dot { animation: dotIn .3s var(--ease) backwards; }
.bar { transform-origin: bottom; animation: growUp .55s var(--ease) backwards; transform-box: fill-box; }

/* 出入库大按钮 */
.io-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 18px; }
.io-btn { border: 2px solid var(--border); background: var(--surface); border-radius: 14px; padding: 22px; text-align: center; font-size: 16px; transition: all .2s var(--ease); }
.io-btn:hover:not(:disabled) { transform: translateY(-2px); box-shadow: var(--shadow); }
.io-btn:active:not(:disabled) { transform: scale(.98); }
.io-btn .ic { font-size: 30px; display: block; margin-bottom: 8px; transition: transform .25s var(--ease); }
.io-btn:hover .ic { transform: scale(1.15); }
.io-btn.on-in { border-color: var(--primary); background: var(--primary-light); color: var(--primary); font-weight: 700; }
.io-btn.on-out { border-color: var(--danger); background: var(--danger-light); color: var(--danger); font-weight: 700; }
.io-btn.on-type { border-color: var(--info); background: var(--info-light); }
.pick-list { max-height: 260px; overflow: auto; border: 1px solid var(--border); border-radius: 8px; margin-top: 6px; }
.pick-item { padding: 10px 12px; border-bottom: 1px solid var(--line); cursor: pointer; display: flex; justify-content: space-between; gap: 8px; transition: background .15s; }
.pick-item:hover { background: var(--primary-light); }
.pick-item.on { background: var(--primary-light); }

/* ===== 进出仓照片上传 ===== */
.photo-uploads { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 6px; }

.photo-btn:hover { border-color: var(--primary); background: var(--primary-light); transform: translateY(-2px); }
.photo-btn:active { transform: scale(.98); }
.photo-btn b { font-size: 14px; }

.photo-btn:hover .pb-ic { transform: scale(1.16) rotate(-4deg); }
.photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(158px, 1fr)); gap: 12px; margin-top: 12px; }
.photo-item { border: 1px solid var(--border); border-radius: 12px; overflow: hidden; background: var(--surface); box-shadow: var(--shadow); animation: popIn .3s var(--ease); transition: transform .2s var(--ease), box-shadow .2s var(--ease), border-color .2s; }
.photo-item:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(16, 24, 40, .1); }
.photo-item.bad { border-color: var(--danger); box-shadow: 0 0 0 3px rgba(192, 57, 43, .1); }
.ph-thumb { position: relative; width: 100%; height: 118px; background: var(--row-head); }
.ph-thumb img { width: 100%; height: 100%; object-fit: cover; cursor: zoom-in; display: block; transition: transform .35s var(--ease); }
.ph-thumb img:hover { transform: scale(1.05); }
.ph-load { height: 100%; display: flex; align-items: center; justify-content: center; color: var(--text2); font-size: 12.5px; background: linear-gradient(90deg, #F1F4F0 25%, #E7EBE5 37%, #F1F4F0 63%); background-size: 400% 100%; animation: phShimmer 1.2s ease infinite; }
@keyframes phShimmer { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } }
.ph-del { position: absolute; top: 6px; right: 6px; width: 24px; height: 24px; border: none; border-radius: 50%; background: rgba(16, 24, 40, .62); color: #fff; font-size: 15px; line-height: 1; display: flex; align-items: center; justify-content: center; padding: 0; opacity: 0; transition: opacity .2s var(--ease), background .2s; }
.photo-item:hover .ph-del { opacity: 1; }
.ph-del:hover { background: var(--danger); transform: scale(1.1); }
.ph-meta { padding: 8px 10px; display: flex; flex-direction: column; gap: 3px; font-size: 12px; }
.ph-meta .badge { align-self: flex-start; }
.photo-view-mask { position: fixed; inset: 0; background: rgba(12, 16, 14, .88); display: flex; align-items: center; justify-content: center; z-index: 120; padding: 24px; cursor: zoom-out; animation: popIn .22s var(--ease); }
.photo-view-mask img { max-width: 96vw; max-height: 92vh; border-radius: 10px; box-shadow: var(--shadow-lg); cursor: zoom-out; }
.photo-thumbs { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 4px; }
.photo-thumbs img { width: 38px; height: 38px; object-fit: cover; border-radius: 7px; border: 1px solid var(--border); cursor: zoom-in; transition: transform .2s var(--ease), box-shadow .2s var(--ease); }
.photo-thumbs img:hover { transform: scale(1.14); box-shadow: var(--shadow); }
.photo-thumbs .more { width: 38px; height: 38px; border-radius: 7px; border: 1px dashed var(--border); display: flex; align-items: center; justify-content: center; font-size: 11.5px; color: var(--text2); }
.review-imgs { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.review-imgs figure { margin: 0; width: 116px; }
.review-imgs img { width: 116px; height: 92px; object-fit: cover; border-radius: 9px; border: 1px solid var(--border); cursor: zoom-in; transition: transform .2s var(--ease); }
.review-imgs img:hover { transform: scale(1.05); }
.review-imgs figcaption { font-size: 11.5px; color: var(--text2); text-align: center; margin-top: 3px; }

/* ===== 财务管理 ===== */
.fin-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }

.fin-tab:hover { border-color: var(--primary); color: var(--primary); transform: translateY(-1px); }
.fin-tab.on { background: var(--primary); border-color: var(--primary); color: #fff; font-weight: 600; box-shadow: 0 4px 12px rgba(31, 111, 235, .3); }

/* ===== 分段控件（页签/胶囊）统一切换过渡 =====
   切换时底色与文字色同步淡入，而不是硬切；按下给一点缩放反馈。 */
.jt-tabs button, .jt-seg button, .lang-toggle span, .theme-opt, .av-opt, .doc-item, .pick-item, .photo-btn {
  transition: background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease), box-shadow .2s var(--ease), transform .16s var(--ease);
}
.jt-tabs button:active, .jt-seg button:active { transform: scale(.96); }

/* ===== 出口货物备案单证 ===== */
.exp-sec { font-weight: 600; font-size: 13.5px; color: var(--brand-deep); margin: 16px 0 8px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.exp-sec-first { font-weight: 600; font-size: 13.5px; color: var(--brand-deep); margin: 4px 0 8px; }
.doc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(158px, 1fr)); gap: 8px; }
.doc-item { display: flex; align-items: center; gap: 8px; border: 1px solid var(--border); background: var(--surface); border-radius: 10px; padding: 8px 11px; font-size: 13px; color: var(--text); text-align: left; transition: border-color .18s var(--ease), background .18s var(--ease), color .18s var(--ease), transform .18s var(--ease); }
.doc-item:hover { border-color: var(--primary); transform: translateY(-1px); }
.doc-item.on { border-color: var(--primary); background: var(--primary-light); color: var(--primary); font-weight: 600; }
.doc-box { width: 17px; height: 17px; border-radius: 5px; border: 1.5px solid var(--border); display: inline-flex; align-items: center; justify-content: center; font-size: 12px; line-height: 1; flex-shrink: 0; background: var(--surface); color: var(--primary); }
.doc-item.on .doc-box { border-color: var(--primary); background: var(--primary); color: #fff; }
.kv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(228px, 1fr)); gap: 8px 16px; }
.kv { display: flex; gap: 8px; font-size: 13px; border-bottom: 1px dashed var(--line); padding: 5px 0; }
.kv-k { color: var(--text2); flex-shrink: 0; min-width: 106px; }
.kv-v { color: var(--text); word-break: break-all; }
.file-list { display: flex; flex-direction: column; gap: 6px; }
.file-item { display: flex; align-items: center; gap: 10px; font-size: 13px; border: 1px solid var(--border); border-radius: 9px; padding: 7px 11px; background: #FCFDFB; }
.file-item .sub { margin-left: auto; }

.toast { position: fixed; top: 20px; left: 50%; transform: translateX(-50%); background: #252822; color: #fff; padding: 11px 20px; border-radius: 12px; z-index: 99; font-size: 14px; box-shadow: 0 12px 32px rgba(16, 24, 40, .28); animation: toastIn .26s cubic-bezier(.22, 1, .36, 1); display: inline-flex; align-items: center; gap: 8px; max-width: min(92vw, 560px); }
.toast.err { background: var(--danger); }
.empty { text-align: center; color: var(--text2); padding: 30px 0; }
@media (max-width: 720px) {
  .layout { flex-direction: column; }
  .sidebar { width: 100%; height: auto; position: static; flex-direction: row; flex-wrap: wrap; align-items: center; }
  .sidebar nav { display: flex; flex-wrap: wrap; }
  .sidebar .who, .sidebar .who-actions { border: none; }
  .main { padding: 14px; }
  th, td { white-space: normal; }
}

/* 宫格内文字排版 */
.q-tile > span:not(.g-ic):not(.q-arrow) { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }

/* 待办事项：单行紧凑（图标 + 标题 + 描述一行全展示，2026-09-30 Tim 定稿） */
.todo-line { display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 12px; margin-bottom: 6px; background: rgba(255, 255, 255, .55); border: 1px solid var(--line); border-radius: 12px; cursor: pointer; text-align: left; font-family: inherit; transition: transform .18s var(--ease), box-shadow .2s var(--ease), border-color .18s }
.todo-line:last-child { margin-bottom: 0; }
.todo-line:hover { transform: translateX(3px); border-color: var(--danger); box-shadow: 0 4px 12px rgba(220, 38, 38, .1); }
.todo-line b { font-size: 13.5px; color: var(--text); white-space: nowrap; }
.todo-line .tl-desc { flex: 1; min-width: 0; font-size: 12.5px; color: var(--text2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.todo-line .tl-arrow { color: var(--danger); font-weight: 700; font-size: 13px; }

/* 库存台账：可排序表头 + 时间列 */
.th-sort { cursor: pointer; user-select: none; white-space: nowrap; }
.th-sort:hover { color: var(--primary, #2f6f4f); }
.th-sort .sort-ic { display: inline-block; margin-left: 4px; font-size: 11px; opacity: .45; }
.th-sort.on { color: var(--primary, #2f6f4f); }
.th-sort.on .sort-ic { opacity: 1; }
.nowrap { white-space: nowrap; }
.nowrap .sub { display: inline-block; margin-left: 0; }

/* 小型项目加工 */
.sp-style-row td { background: var(--row-alt); font-size: 13.5px; }
.sp-person { display: inline-block; background: var(--surface); border: 1px solid var(--border); border-radius: 20px; padding: 2px 10px; margin: 2px 3px; font-size: 12.5px; white-space: nowrap; }
#spc-summary { margin-bottom: 12px; }

/* 岗位范围勾选树 */
.menu-tree { max-height: 260px; overflow: auto; border: 1px solid var(--border); border-radius: 10px; padding: 8px 10px; display: flex; flex-direction: column; gap: 2px; background: var(--surface); }
.mt-node { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; padding: 3px 0; }
.mt-row { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; font-size: 13.5px; }
.mt-row input { accent-color: var(--primary); }
.mt-exp { font-size: 12px; }
.mt-kids { display: flex; flex-direction: column; gap: 2px; width: 100%; padding-left: 26px; border-left: 2px solid var(--border); margin-left: 10px; }

/* 小型项目加工：表头与数据居中 + 部门协同斑马纹 */
.sp-center th, .sp-center td { text-align: center; vertical-align: middle; }
.sp-center td.wrap { overflow-wrap: normal; }
.sp-center.sp-wide { min-width: 1400px; }
.sp-zebra tr.row-alt { background: var(--row-alt); }
.sp-zebra tr.row-base { background: transparent; }
.sp-person .link { margin-left: 2px; }
.sp-rec input { padding: 4px 8px; }

/* 弹窗表单：标签在上、输入框全宽，舒展不拥挤 */
.modal .fg { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.modal .fg > label { font-weight: 600; font-size: 13px; color: #374151; }
.modal .fg > input, .modal .fg > select { width: 100%; box-sizing: border-box; }
.modal .actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 16px; }
.modal .sub { line-height: 1.6; }
/* 图片上传卡片（虚线框） */
.sp-up-box { border: 2px dashed var(--border); border-radius: 14px; background: var(--row-hover); padding: 16px; display: flex; flex-direction: column; align-items: center; gap: 10px; margin-bottom: 14px; }
.sp-up-box img { max-width: 120px; max-height: 120px; object-fit: cover; border-radius: 10px; box-shadow: 0 2px 8px rgba(0,0,0,.08); }
/* 部门协同：统一列宽（各列 min-width 相同，图片列更宽） + 图片显示 */
.sp-fixed { min-width: 1600px; }
.sp-fixed th, .sp-fixed td { min-width: 72px; overflow: hidden; }
.sp-fixed th.stc0, .sp-fixed td.stc0 { white-space: nowrap; min-width: 105px }
.sp-fixed th, .sp-fixed td.wrap { overflow-wrap: break-word; }
img.syn-img { max-width: 100%; max-height: 110px; width: auto; object-fit: cover; border-radius: 10px; border: 1px solid var(--border); display: block; margin: 0 auto; cursor: zoom-in; }
/* 图片放大镜 */
.imgzoom-mask { position: fixed; inset: 0; background: rgba(10, 18, 28, .78); display: flex; flex-direction: column; align-items: center; justify-content: center; z-index: 200; cursor: zoom-out; animation: fadeInUp .18s var(--ease); }
.imgzoom-mask img { max-width: 88vw; max-height: 84vh; border-radius: 14px; box-shadow: 0 12px 48px rgba(0,0,0,.5); }
/* 产能统计款式行：图片+款号并排 */
.sp-style-cell { display: flex; align-items: center; gap: 10px; justify-content: flex-start; }
.sp-style-cell img { width: 64px; height: 64px; object-fit: cover; border-radius: 8px; border: 1px solid var(--border); }

/* 全局：表头锁定（表格容器内滚动时表头吸顶） */

.table-scroll th { position: sticky; top: 0; z-index: 3; background: #f5f9f2; box-shadow: inset 0 -1px 0 var(--border); }
.table-scroll tr:nth-child(2) th { top: 42px; }
/* 部门协同：左侧 日期/款号/图片 三列冻结。
   left 只是兜底初值，renderSpSheet 渲染后会按实际列宽动态改写（不同工作表列宽不同，写死必有空隙）。 */
.stc { position: sticky; z-index: 2; background: inherit; }
.table-scroll th.stc { z-index: 4; }
.stc0 { left: 0; }
.stc1 { left: 0; }
.stc2 { left: 0; }
/* 日期列保证完整显示（YYYY-MM-DD 10 字符），避免被裁成 2026-09-1 */

/* 协同/外发编辑行弹窗：图片字段预览 */
.fg .syn-img { margin: 0; }
/* 弹窗字段网格：两列布局（标签上、输入框下） */
.modal-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; max-height: 58vh; overflow: auto; padding-right: 4px; }
.modal-grid .fg { margin-bottom: 0; }
.modal-grid .fg label { display: flex; align-items: baseline; gap: 4px; flex-wrap: wrap; }
/* 部门协同：月份多选选择器 */
.mp-wrap { position: relative; display: inline-block; }
.mp-pop { position: absolute; top: calc(100% + 6px); left: 0; z-index: 50; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 10px 32px rgba(20, 40, 20, .16); padding: 10px 12px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px 14px; min-width: 220px; }
.mp-pop label { display: flex; align-items: center; gap: 6px; font-size: 13px; white-space: nowrap; cursor: pointer; padding: 3px 2px; border-radius: 6px; }
.mp-pop label:hover { background: var(--primary-light); }
.mp-pop .mp-all { grid-column: 1 / -1; border-bottom: 1px solid var(--border); padding-bottom: 6px; margin-bottom: 2px; font-weight: 600; }
.mp-pop label.mp-empty { opacity: .38; }          /* 该月没有任何数据 */
/* 部门协同：快捷筛选（本月 / 今年 / 全部） */
.syn-quick { display: inline-flex; gap: 6px; }
.syn-quick .btn { padding: 5px 12px; }
/* 搜索只命中采购/申领尾部列的行：整行淡显，款号下挂命中位置标签 */
.sp-fixed tr.row-tailhit td { color: #87988c; }
.sp-fixed tr.row-tailhit td.stc { color: #87988c; }
.hit-badge { display: inline-block; margin-top: 2px; font-size: 11px; line-height: 1.5; color: var(--warn); background: var(--warn-light); border: 1px solid #eadfc4; border-radius: 6px; padding: 0 6px; white-space: nowrap; }
/* 部门协同：合计行（表头下方，当前筛选列求和） */
.sp-fixed tr.syn-sum td { background: var(--primary-light); color: var(--brand-deep); font-size: 13px; border-top: 2px solid var(--primary); border-bottom: 1px solid var(--border); padding: 6px 8px; }
.sp-fixed tr.syn-sum td.stc { background: var(--primary-light); }
/* 灯条台账：行内「归属基站」下拉（窄列里也要好点，避免撑破表格） */
.strip-station { width: 100%; max-width: 140px; font-size: 12px; padding: 4px 6px; }

/* 待办红点呼吸动画（概览·待办事项卡片） */
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.8)}}

/* 订单列表：操作按钮之间留间隔（详情/编辑/提交/删除 连排时避免挤在一起） */
.ord-ops { white-space: nowrap; }
.ord-ops .link { margin-right: 14px; }
.ord-ops .link:last-child { margin-right: 0; }
.ord-ops .sub { font-size: 12px; color: var(--muted, #889); }

/* ===== 主题皮肤（个人档案 → 外观主题；改 data-theme 即整站换色） =====
   每套主题必须覆盖完整调色板：主色系 + 整站背景 + 侧栏 + 概览横幅 + 表格行态 + 图标/光斑。
   只改 --primary 会让用户觉得「没换肤」，所以下面每套都是整套色板。 */
body[data-theme="forest"] {
  --primary:#2FA84F; --primary-light:#E9F7EC; --primary-dark:#238A44; --brand-deep:#1F7A3A;
  --text:#252822;
  --page-a:#F4FAEB; --page-b:#FDF9EA; --side-hover:#F0F8E8;
  --hero-b:#9CCE62; --hero-glow:rgba(140,190,90,.35); 
  --line:#EEF0EA; --row-head:#F1F4F0; --row-hover:#F7FAF6; --row-alt:#F4F9F1;
  --ic-a:rgba(222,240,196,.55); --ic-b:rgba(178,214,142,.4);
  --glow-a:rgba(178,214,100,.6); --glow-b:rgba(255,222,105,.22);
  --avatar-a:#55B75E; --avatar-b:#C9E56E;
  
}
body[data-theme="teal"] {
  --primary:#0E9AA7; --primary-light:#DFF3F5; --primary-dark:#0A7B86; --brand-deep:#0A7B86;
  --page-a:#EAF7F8; --page-b:#F1FBFA; --side-hover:#E6F6F7;
  --hero-b:#5FC9D4; --hero-glow:rgba(60,170,180,.32); 
  --line:#E3F0F1; --row-head:#ECF6F7; --row-hover:#F4FAFB; --row-alt:#EDF7F8;
  --ic-a:rgba(198,236,238,.55); --ic-b:rgba(140,205,210,.4);
  --glow-a:rgba(120,210,215,.55); --glow-b:rgba(180,235,240,.22);
  --avatar-a:#0E9AA7; --avatar-b:#7FD1DB;
}
body[data-theme="sunset"] {
  --primary:#E67E22; --primary-light:#FCEEDE; --primary-dark:#C2660F; --brand-deep:#B35C0E;
  --page-a:#FEF6EC; --page-b:#FDF3E2; --side-hover:#FDF0E0;
  --hero-b:#F5B14E; --hero-glow:rgba(230,140,50,.3); 
  --line:#F5E9DA; --row-head:#FBF2E6; --row-hover:#FEF9F2; --row-alt:#FDF4E8;
  --ic-a:rgba(248,226,196,.55); --ic-b:rgba(232,186,130,.4);
  --glow-a:rgba(250,200,130,.55); --glow-b:rgba(255,225,170,.24);
  --avatar-a:#E67E22; --avatar-b:#F5C36B;
}
body[data-theme="rose"] {
  --primary:#D45D9C; --primary-light:#FBE9F2; --primary-dark:#B84A85; --brand-deep:#A93C79;
  --page-a:#FDF0F6; --page-b:#FDF6F9; --side-hover:#FCEBF3;
  --hero-b:#EE9CC6; --hero-glow:rgba(210,100,160,.28); 
  --line:#F5E2EC; --row-head:#FBEDF4; --row-hover:#FDF6F9; --row-alt:#FCEEF5;
  --ic-a:rgba(246,214,230,.55); --ic-b:rgba(226,158,192,.4);
  --glow-a:rgba(240,170,205,.5); --glow-b:rgba(255,205,228,.24);
  --avatar-a:#D45D9C; --avatar-b:#F2B3D4;
}
body[data-theme="sky"] {
  --primary:#3B82D6; --primary-light:#E3EDFB; --primary-dark:#2F6CB4; --brand-deep:#2B62A8;
  --page-a:#EDF4FD; --page-b:#F4F9FF; --side-hover:#E9F2FC;
  --hero-b:#84B4EC; --hero-glow:rgba(70,130,210,.28); 
  --line:#E2EBF7; --row-head:#ECF3FC; --row-hover:#F5F9FE; --row-alt:#EDF4FC;
  --ic-a:rgba(203,224,247,.55); --ic-b:rgba(146,186,232,.4);
  --glow-a:rgba(150,195,245,.55); --glow-b:rgba(200,225,250,.24);
  --avatar-a:#3B82D6; --avatar-b:#A5C8F0;
}
body[data-theme="violet"] {
  --primary:#7C5CD3; --primary-light:#F0EBFC; --primary-dark:#6647BC; --brand-deep:#5B3FAD;
  --page-a:#F3F0FD; --page-b:#F9F6FF; --side-hover:#F0EAFC;
  --hero-b:#B29BEC; --hero-glow:rgba(120,90,210,.28); 
  --line:#E8E0F7; --row-head:#F0E9FB; --row-hover:#F8F5FE; --row-alt:#F1EBFC;
  --ic-a:rgba(220,210,247,.55); --ic-b:rgba(178,158,232,.4);
  --glow-a:rgba(185,165,245,.55); --glow-b:rgba(215,200,250,.24);
  --avatar-a:#7C5CD3; --avatar-b:#C4B0F0;
}
body[data-theme="graphite"] {
  --primary:#4B5563; --primary-light:#EEF0F3; --primary-dark:#3B4451; --brand-deep:#374151;
  --page-a:#F3F4F6; --page-b:#FAFAFB; --side-hover:#ECEEF1;
  --hero-b:#7A8593; --hero-glow:rgba(90,100,115,.26); 
  --line:#E6E9ED; --row-head:#EEF0F3; --row-hover:#F7F8FA; --row-alt:#EFF1F4;
  --ic-a:rgba(226,229,233,.6); --ic-b:rgba(184,190,198,.4);
  --glow-a:rgba(190,197,207,.5); --glow-b:rgba(220,224,230,.24);
  --avatar-a:#4B5563; --avatar-b:#9CA3AF;
}
body[data-theme="dark"] {
  --primary:#41B86B; --primary-light:#20372B; --primary-dark:#35A05B; --brand-deep:#8FD8AC;
  
  --danger:#E06052; --danger-light:#3A2320; --warn:#D8A24A; --warn-light:#3A3222;
  --info:#5B93D6; --info-light:#1F2C3A;
  --text:#E8ECE9; --text2:#94A09A; --border:#2E3733;
  --bg:#131916; --surface:#1C2420; 
  --page-a:#131916; --page-b:#161D19; --side-bg:#1C2420; --side-hover:#243029;
  --hero-b:#3F7D46; --hero-glow:rgba(0,0,0,.45); 
  --line:#2E3733; --row-head:#242D28; --row-hover:#202823; --row-alt:#1F2723;
  --ic-a:rgba(70,110,85,.5); --ic-b:rgba(45,80,60,.45);
  --glow-a:rgba(50,110,70,.35); --glow-b:rgba(120,110,50,.18);
  --avatar-a:#2E6B3A; --avatar-b:#4E9A5D;
  
  --shadow:none; --shadow-lg:0 12px 32px rgba(0,0,0,.4);
}
body[data-theme="dark"] input, body[data-theme="dark"] select, body[data-theme="dark"] textarea { background:#222B26; color:var(--text); }
body[data-theme="dark"] .login-card { background: linear-gradient(180deg, rgba(9, 13, 28, .30), rgba(9, 13, 28, .44)), rgba(255, 255, 255, .06); }
body[data-theme="dark"] .login-wrap { background: linear-gradient(175deg,#101713 0%,#161E18 55%,#1A241C 100%); }
body[data-theme="dark"] .pick-item:hover, body[data-theme="dark"] .pick-item.on { background:#243029; }
body[data-theme="dark"] .sp-style-row td { background:#1F2723; }
body[data-theme="dark"] .sp-fixed tr.syn-sum td.stc { background:#20372B; }
body[data-theme="dark"] .sp-up-box { background:#1B241F; border-color:#2E3733; }
.theme-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(128px,1fr)); gap:12px; }
.theme-opt { border:2px solid var(--border); background:var(--surface); border-radius:14px; padding:10px; display:flex; flex-direction:column; gap:8px; align-items:center; font-size:12.5px; color:var(--text); transition:border-color .2s var(--ease), transform .2s var(--ease); }
.theme-opt:hover { transform:translateY(-2px); }
.theme-opt.on { border-color:var(--primary); box-shadow:0 0 0 3px rgba(47,168,79,.14); }
.theme-opt .sw { width:100%; height:52px; border-radius:9px; border:1px solid var(--border); }

/* ===== 进出仓表单对齐：固定两列栅格，宽字段整行 ===== */
#io-fields, #io-fields2 { grid-template-columns:1fr 1fr; }
#io-fields .fg.wide, #io-fields2 .fg.wide { grid-column:1 / -1; }

/* ===== 中英文切换（左上角 CN/EN 胶囊） ===== */
.lang-row { display:flex; padding:2px 16px 8px; }
.lang-toggle { display:inline-flex; background:var(--surface,#fff); border:1px solid var(--border,#e2e8e2); border-radius:999px; padding:3px; gap:2px; box-shadow:0 1px 4px rgba(0,0,0,.06); cursor:pointer; user-select:none; }
.lang-toggle span { font-size:12px; font-weight:800; letter-spacing:.5px; padding:4px 12px; border-radius:999px; color:var(--text2,#8a9a8e); transition:background .2s,color .2s; line-height:1; }
.lang-toggle span.on { background:var(--primary); color:#fff; }
.lang-toggle:active { transform:scale(.96); }
.login-lang { position:absolute; top:14px; right:14px; padding:0; }

/* ===== 淘宝内销排单（JT） ===== */
.jt-tabs{display:inline-flex;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:3px;gap:2px}
.jt-tabs button{border:none;background:transparent;padding:6px 14px;border-radius:8px;font-size:13px;color:var(--text2);cursor:pointer}
.jt-tabs button.on{background:var(--primary);color:#fff;font-weight:600}
.jt-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding-bottom:10px;border-bottom:1px solid var(--line)}
.jt-seg{display:inline-flex;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:3px}
.jt-seg button{border:none;background:transparent;padding:5px 13px;border-radius:8px;font-size:13px;color:var(--text2);cursor:pointer}
.jt-seg button.on{background:var(--primary-light);color:var(--primary);font-weight:700}
.jt-stat{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.jt-chip{font-size:12.5px;color:var(--text2);background:var(--row-head);border-radius:20px;padding:5px 12px}
.jt-chip b{color:var(--text);font-size:14px}
.jt-day{margin-top:14px}
.jt-day-h{display:flex;justify-content:space-between;align-items:baseline;padding:6px 2px 8px;border-bottom:2px solid var(--primary-light)}
.jt-table{width:100%;border-collapse:collapse}
.jt-table td{vertical-align:top}
.jt-no{color:var(--primary);font-weight:700;text-decoration:none;font-size:13.5px}
.jt-pf{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.4px;border-radius:5px;padding:1px 6px;margin-right:4px;background:var(--row-head);color:var(--text2)}
.jt-pf-WW{background:#FFF3E0;color:#B4620A}.jt-pf-WX{background:#E6F7EA;color:#1749B6}
.jt-pf-PDD{background:#FDE8E8;color:#B23B3B}.jt-pf-XY{background:#FFFCE0;color:#8A7A00}
.jt-pf-XHS{background:#FDE9EC;color:#C0324B}.jt-pf-XCX{background:#E7F0FA;color:#2B6CB0}
body[data-theme="dark"] .jt-pf{filter:brightness(.85) saturate(1.2)}
select.jt-mini{font-size:12.5px;padding:4px 6px;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--text)}
.jt-kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;margin-bottom:14px}
.jt-kpi{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:6px;box-shadow:var(--shadow)}
.jt-kpi b{font-size:23px;color:var(--brand-deep)}
.jt-plat{display:flex;align-items:center;gap:8px;padding:7px 0;font-size:13.5px;border-bottom:1px dashed var(--line)}
.jt-bar-mini{flex:1;height:7px;background:var(--row-head);border-radius:6px;overflow:hidden;display:inline-block;vertical-align:middle}
.jt-bar-mini i{display:block;height:100%;background:linear-gradient(90deg,var(--primary),var(--hero-b));border-radius:6px}.jt-down{color:#1749B6;font-weight:700}
.jt-spark{display:flex;gap:2px;align-items:flex-end;height:24px}
.jt-spark i{width:7px;background:var(--primary);opacity:.65;border-radius:2px;display:block}
.jt-cand{margin:6px 0}
.jt-cands{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:8px}
.jt-cand-i{display:flex;gap:9px;align-items:center;padding:8px;border:1px solid var(--border);border-radius:11px;background:var(--surface);cursor:pointer;transition:transform .15s var(--ease),border-color .15s}
.jt-cand-i:hover{transform:translateY(-2px);border-color:var(--primary)}
.jt-cand-i img{width:44px;height:44px;object-fit:cover;border-radius:8px}
.jt-noimg{width:44px;height:44px;border-radius:8px;background:var(--row-head);display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--text2)}
.jt-ref{position:relative;display:inline-block}
.jt-ref img{width:74px;height:74px;object-fit:cover;border-radius:9px;border:1px solid var(--border);cursor:zoom-in}
.jt-ref-x{position:absolute;top:-6px;right:-6px;width:20px;height:20px;border:none;border-radius:50%;background:var(--danger);color:#fff;font-size:13px;line-height:1;cursor:pointer}
.jt-upl{display:inline-flex;align-items:center;justify-content:center;width:74px;height:74px;border:2px dashed var(--border);border-radius:9px;font-size:12px;color:var(--text2);cursor:pointer;background:var(--surface)}
.jt-kv{display:flex;gap:10px;padding:6px 0;border-bottom:1px dashed var(--line);font-size:13.5px}
.jt-kv span{width:110px;color:var(--text2);flex-shrink:0}

/* ===== 排单纸张版式（打印预览语义：固定白底黑字，不随主题换肤） ===== */
.jt-paper { background:#fff; color:#111; border-radius:14px; box-shadow:0 10px 30px rgba(0,0,0,.14); max-width:960px; margin:0 auto 18px; padding:28px 36px 24px; font-size:13.5px; line-height:1.5; color-scheme:light }
.jt-paper *{box-sizing:border-box}
.jtp-head{display:flex;justify-content:space-between;align-items:flex-end;border-bottom:2.5px solid #111;padding-bottom:10px}
.jtp-brand{font-size:20px;font-weight:800;letter-spacing:4px}
.jtp-brand small{display:block;font-size:11px;letter-spacing:1px;color:#888;font-weight:400;margin-top:2px}
.jtp-no{color:#c22222;font-size:19px;font-weight:800;letter-spacing:1px;text-align:right}
.jtp-no small{display:block;font-size:12px;font-weight:600;color:#c22222;letter-spacing:0}
.jtp-chip{background:#f2f2f2;border:1px solid #ddd;border-radius:20px;padding:2px 11px;font-size:11.5px;color:#555}
.jtp-chip.custom{background:#fdeeee;border-color:#e5b8b8;color:#b33333}
.jtp-sec{display:flex;justify-content:space-between;align-items:center;font-weight:800;font-size:14.5px;margin:20px 0 8px;padding-left:9px;border-left:4px solid #111}
.jtp-f{display:flex;flex-direction:column;gap:2px;min-width:0}
.jtp-f label{font-size:11px;color:#999}
.jt-paper input,.jt-paper textarea,.jt-paper select{background:transparent;border:none;border-bottom:1px dashed #bbb;color:#111;font:inherit;padding:3px 2px;width:100%;outline:none;border-radius:0}
.jt-paper input:focus,.jt-paper textarea:focus,.jt-paper select:focus{border-bottom:1px solid #111;background:#fafafa}
.jt-paper textarea{resize:vertical;line-height:1.55}
.jt-paper select{cursor:pointer}
.jtp-val{min-height:20px;border-bottom:1px solid #eee;padding:3px 2px;white-space:pre-wrap;word-break:break-all}
.jtp-item { border:1px solid #e3e3e3; border-radius:10px; padding:4px 8px; margin-bottom:4px }
.jtp-code{width:220px !important;font-weight:700}
.jtp-hint{font-size:11px;color:#999}
.jtp-item-b { display:grid; grid-template-columns:1fr 340px !important; gap:14px }
.jtp-pics { display:flex; flex-direction:row; gap:6px; align-items:stretch; justify-content:flex-end }
.jtp-pics img{width:100%;border-radius:6px;cursor:zoom-in;border:1px solid #eee;display:block}
.jt-paper .jt-upl { border:1.5px dashed #ccc; color:#888; background:#fafafa; width:100%; height:24px }
.jt-paper .jt-cand-i{background:#fff;border-color:#ddd}
.jt-paper .jt-cand-i:hover{border-color:#111}
.jt-paper .jt-ref img{border:1px solid #eee}
.jt-paper .btn.ghost,.jt-paper .btn.sm.ghost{background:#fff;border:1px solid #ccc;color:#555}
.jt-paper .btn.ghost:hover{border-color:#111;color:#111}
.jt-paper .link{color:#b33333 !important}
.jtp-foot{width:100%;border-collapse:collapse;margin-top:4px}
.jtp-foot th,.jtp-foot td{border:1px solid #333;padding:5px 7px;font-size:12px;text-align:left;color:#111}
.jtp-foot th{background:#f0f0f0;font-weight:700}
.jtp-empty{border:1.5px dashed #ccc;border-radius:10px;padding:30px;text-align:center;color:#999;font-size:13px}
.jtp-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:4px}
.jtp-step{display:flex;gap:7px;align-items:center;border:1px solid #e3e3e3;border-radius:9px;padding:8px 10px;font-size:12px}
.jtp-step i{width:9px;height:9px;border-radius:50%;background:#ddd;flex-shrink:0}
.jtp-step.on i{background:#3a9e52}
.jtp-step .sub{font-size:11px;color:#888}
@media (max-width:900px){.jtp-item-b{grid-template-columns:1fr}.jtp-steps{grid-template-columns:1fr 1fr}}

/* ===== 排单纸张 v2：行式排版 / 一行订单信息 / 强制白底 ===== */

.jt-paper input,.jt-paper select,.jt-paper textarea{background:#fff !important;color:#111 !important;-webkit-text-fill-color:#111}
.jt-paper input::placeholder,.jt-paper textarea::placeholder{color:#b5b5b5;opacity:1}
.jtp-toprow{display:flex;gap:14px;align-items:flex-end;padding-top:12px;flex-wrap:nowrap}
.jtp-toprow .jtp-f{flex:1;min-width:0}
.jtp-line { display:flex; gap:8px; align-items:flex-start; padding:0 }
.jtp-line>label { width:118px; flex-shrink:0; font-size:12.5px; font-weight:700; color:#111; padding-top:2px }
.jtp-line>input,.jtp-line>textarea,.jtp-line>div{flex:1;min-width:0;font-size:13px}
.jt-paper .jtp-line textarea { line-height:1.35; border-bottom:1px dashed #bbb; font-size:12.5px; min-height:22px; overflow:hidden }
.jt-paper .jtp-line input,.jt-paper .jtp-line textarea{border-radius:0}
.jtp-no-edit{text-align:right}
.jtp-no-edit label{display:block;font-size:11px;color:#999;font-weight:400;text-align:right}
.jtp-no-edit input{width:230px !important;font-size:19px;font-weight:800;color:#c22222 !important;-webkit-text-fill-color:#c22222;border-bottom:2px solid #c22222 !important;text-align:right;letter-spacing:1px}
.jt-paper .jtp-cust input{font-weight:400}
@media print{.jtp-no-edit input{border-bottom-width:1px}}

/* ===== 排单纸张 v3：A4 页框 + 触底提示 + 紧凑行距（一页容纳 3-4 款） ===== */
/* 页框：虚线框 = 一张 A4 纸的内容范围（与打印分页 PH=1000px 同口径） */
.jtp-pagebox{position:relative;border:1.5px dashed #cfcfcf;border-radius:10px;min-height:1000px;padding:8px 10px 40px;display:flex;flex-direction:column;gap:4px}
.jtp-pagebox #jt-items{flex:1}
.jtp-fill-hint{position:absolute;left:10px;right:10px;bottom:8px;text-align:center;font-size:11.5px;color:#999;pointer-events:none}
.jtp-fill-hint.warn{color:#c77700;font-weight:700}
.jtp-fill-hint.over{color:#c22222;font-weight:700}
/* 行距压缩：款式间距一行以内，字段行距收窄 */

/* 行内第二标签（客户+电话 / 物流+发货日期 / 规格+备注 复用一行） */
.jtp-l2{width:auto !important;flex-shrink:0;font-size:12.5px;font-weight:700;color:#111;padding-top:4px;margin-left:10px}
/* 图片区：动态分栏（1-3 栏均分、通栏等高；尺码图长图不压缩，打印可读；每 3 款一组共用列数） */

.jtp-slot{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.jtp-slot>label{font-size:10px;color:#999;font-weight:700}
.jtp-slotimg{width:100%;display:block;border:1px solid #eee;border-radius:5px;cursor:zoom-in}
.jtp-slot .jt-upl{width:100%;height:24px;font-size:10px;line-height:22px;padding:0}
.jtp-slot.empty{border:1.5px dashed #ddd;border-radius:6px;justify-content:center}

/* 款式模版录入：卡片网格 */
.jt-tpl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.jt-tpl-card{border:1px solid #e3e3e3;border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:3px;cursor:pointer;transition:box-shadow .15s,transform .15s}
.jt-tpl-card:hover{box-shadow:0 6px 18px rgba(0,0,0,.12);transform:translateY(-2px)}
.jt-tpl-card img{width:100%;border-radius:6px;aspect-ratio:3/4;object-fit:cover;background:#f5f5f5}
.jt-tpl-card .jt-noimg{display:flex;align-items:center;justify-content:center;aspect-ratio:3/4;background:#f5f5f5;border-radius:6px;color:#aaa;font-size:12px}
@media print{.jtp-pagebox{border-color:#bbb}  .jtp-fill-hint {display:none}}

/* ===== 工资管理（内账 / 劳动局） ===== */
.pay-tbl{font-size:12.5px;white-space:nowrap}
.pay-tbl th{position:sticky;top:0;background:#f7f7f5;z-index:1;padding:6px 6px}
.pay-tbl td{padding:3px 6px}
.pay-tbl .pay-name{font-weight:500}
.pay-in{width:76px;padding:3px 5px;font-size:12.5px;border:1px solid #ddd;border-radius:5px;text-align:right}
.pay-in:focus{border-color:var(--primary,#378ADD);outline:none}
.pay-sum{background:#fafaf8;font-variant-numeric:tabular-nums}
.pay-total td{background:#f2f2ef;font-weight:500;font-variant-numeric:tabular-nums}
.pay-sign{min-width:70px;border-bottom:1px solid #ccc}
/* 两级分组表头（对齐真实《福盟工资表》）：第 1 行 sticky、第 2 行紧随其后 */
.pay-tbl2 thead th { position:sticky; background:#f7f7f5; z-index:1; border-bottom:1px solid #e6e6e2; cursor:default }
.pay-tbl2 thead tr:nth-child(1) th{top:0;height:30px;font-weight:600;white-space:normal;line-height:1.25}
.pay-tbl2 thead tr:nth-child(2) th { top:30px; border-left:1px solid #f0f0ec }
.pay-tbl2 thead tr:nth-child(1) th[rowspan]{vertical-align:middle}
.pay-tbl2 thead tr:nth-child(1) th[colspan]{text-align:center;border-left:2px solid #e2e2de}

.pay-tbl2 td{border-bottom:1px solid #f4f4f0}
.pay-tbl2 .pay-note{width:140px;text-align:left}
.pay-tbl2 .pay-tip{font-size:9px;color:#9a9a94;margin-left:1px;vertical-align:super;font-weight:400}

.pay-tbl2 tbody td:nth-child(5),
.pay-tbl2 tbody td:nth-child(12){border-left:2px solid #e8e8e4}   /* 考勤区 / 应发工资 分隔 */
.pay-tbl2 thead tr:nth-child(2) th:nth-child(5),
.pay-tbl2 thead tr:nth-child(2) th:nth-child(12){border-left:2px solid #e2e2de}

/* ============ 全局氛围动效背景 + 毛玻璃功能层（2026-09-30，conversion 式） ============ */
/* 底层：页面渐变 + 三团主色光斑 24s 缓慢漂移；第二层两团反向 34s。固定在视口最底层 */

body::before { content: ''; position: fixed; left: -8%; right: -8%; top: -8%; bottom: -8%; z-index: -2; pointer-events: none; background:
    radial-gradient(40% 46% at 80% 10%, color-mix(in srgb, var(--primary) 30%, transparent), transparent 72%),
    radial-gradient(34% 40% at 10% 32%, color-mix(in srgb, var(--primary) 20%, transparent), transparent 72%),
    radial-gradient(32% 38% at 62% 88%, color-mix(in srgb, var(--primary) 22%, transparent), transparent 72%),
    linear-gradient(180deg, var(--page-a) 0%, var(--page-b) 100%); animation: bgDrift 13s ease-in-out infinite alternate }
body::after { content: ''; position: fixed; left: -8%; right: -8%; top: -8%; bottom: -8%; z-index: -2; pointer-events: none; background:
    radial-gradient(28% 34% at 28% 72%, color-mix(in srgb, var(--primary) 15%, transparent), transparent 72%),
    radial-gradient(24% 30% at 92% 58%, color-mix(in srgb, var(--primary) 16%, transparent), transparent 72%); animation: bgDrift2 19s ease-in-out infinite alternate }
@keyframes bgDrift {
  0% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(-6%, 4.5%) scale(1.08); }
  100% { transform: translate(5%, -4%) scale(1.03); }
}
@keyframes bgDrift2 {
  0% { transform: translate(0, 0) scale(1.03); }
  100% { transform: translate(6%, -5%) scale(.98); }
}
/* .layout 原页面渐变已并入 body::before 底层，容器让位给动效背景 */

/* 毛玻璃功能层：卡片 / 统计 / 快捷格浮在动效背景上 */
.card, .stat, .q-tile {
  background: rgba(255, 255, 255, .62);
  backdrop-filter: blur(16px) saturate(1.5);
  -webkit-backdrop-filter: blur(16px) saturate(1.5);
  border: 1px solid rgba(255, 255, 255, .72);
}
/* 待办单行同步玻璃化 */

/* 弹窗保持高可读性的浓玻璃 */

/* ===== 方案A · 液体光流背景（bgflow.js）===== */
.bgflow-canvas{
  position: fixed; inset: 0; width: 100%; height: 100%;
  display: block; z-index: -1; pointer-events: none;
}
/* 旧 CSS 光斑层降到画布之下：WebGL 可用时被完全遮住，不可用时作为兜底 */

/* 登录页视频 2026-09-30 恢复启用：field.mp4（花田片，已去水印 + 电影质感调色） */