/* ============================================
   胜世铝业 · 再生资源基地管理系统
   Q版可爱风 · 天蓝糖果主题
   ============================================ */
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
  font-family: "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", sans-serif;
  background:
    radial-gradient(circle at 6% 10%, rgba(141, 203, 255, .35) 0, transparent 180px),
    radial-gradient(circle at 94% 6%, rgba(179, 222, 255, .45) 0, transparent 200px),
    radial-gradient(circle at 88% 92%, rgba(160, 220, 255, .35) 0, transparent 220px),
    radial-gradient(circle at 12% 95%, rgba(190, 235, 205, .35) 0, transparent 210px),
    radial-gradient(circle at 48% 30%, rgba(214, 236, 255, .55) 0, transparent 260px),
    linear-gradient(180deg, #f2faff, #eef4ff 55%, #eefaf6);
  color: #46608a; font-size: 14px; min-height: 100vh;
}
.hidden { display: none !important; }

/* ===== 全局漂浮装饰（泡泡） ===== */
body::before, body::after {
  content: ""; position: fixed; pointer-events: none; z-index: 0;
  width: 100%; height: 100%; top: 0; left: 0; opacity: .5;
}
body::before {
  background:
    radial-gradient(circle, rgba(141, 203, 255, .5) 0 4px, transparent 5px) 0 0 / 120px 120px,
    radial-gradient(circle, rgba(190, 225, 255, .45) 0 6px, transparent 7px) 60px 60px / 150px 150px,
    radial-gradient(circle, rgba(160, 220, 255, .4) 0 3px, transparent 4px) 30px 90px / 100px 100px;
  animation: bob 9s ease-in-out infinite;
}
body::after {
  background:
    radial-gradient(circle, rgba(120, 190, 255, .35) 0 5px, transparent 6px) 200px 30px / 180px 180px,
    radial-gradient(circle, rgba(200, 232, 255, .5) 0 8px, transparent 9px) 320px 140px / 200px 200px;
  animation: bob 12s ease-in-out infinite reverse;
}
@keyframes bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-16px); } }

/* ===== 登录 ===== */
.overlay {
  position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 100; display: flex; align-items: center; justify-content: center;
  background:
    radial-gradient(circle at 18% 16%, rgba(255, 255, 255, .55), transparent 42%),
    radial-gradient(circle at 80% 80%, rgba(141, 203, 255, .4), transparent 45%),
    linear-gradient(135deg, #d9edff, #eaf2ff 50%, #d9f6ec);
}
.overlay::before, .overlay::after {
  content: ""; position: absolute; pointer-events: none; border-radius: 50%;
}
.overlay::before {
  width: 120px; height: 120px; left: 9%; top: 14%;
  background: radial-gradient(circle at 30% 30%, #fff, rgba(255, 255, 255, 0));
  box-shadow: 0 0 0 8px rgba(255, 255, 255, .35), 0 0 0 16px rgba(255, 255, 255, .18);
}
.overlay::after {
  content: "☁️ ✨"; font-size: 34px; right: 10%; bottom: 16%;
}
.login-box {
  background: #fff; padding: 38px 42px; width: 400px; border-radius: 30px; position: relative;
  border: 3px solid #fff;
  box-shadow: 0 20px 55px rgba(77, 150, 230, .3), 0 3px 10px rgba(140, 180, 230, .16);
}
.login-box::before { content: "⛅"; position: absolute; top: 12px; right: 22px; font-size: 22px; }
.login-logo {
  width: 74px; height: 74px; margin: 0 auto 14px; border-radius: 50%;
  background: linear-gradient(135deg, #8ecbff, #5aa7ff 60%, #7fd0f0);
  color: #fff; font-size: 34px; display: flex; align-items: center; justify-content: center;
  box-shadow: 0 8px 18px rgba(90, 167, 255, .45);
}
.login-box h2 { text-align: center; color: #2f6fd8; margin-bottom: 18px; font-size: 18px; font-weight: 800; }
.login-box label { display: block; margin: 10px 0 4px; font-size: 13px; color: #7a9cc4; font-weight: 600; }
.login-box input {
  width: 100%; padding: 11px 14px; border: 2px solid #d5e9ff; border-radius: 14px; font-size: 14px;
  background: #f3f9ff; outline: none; transition: .15s; color: #46608a;
}
.login-box input:focus { border-color: #5aa7ff; box-shadow: 0 0 0 3px rgba(90, 167, 255, .18); background: #fff; }
.login-box .btn { width: 100%; margin-top: 20px; }

/* ===== 顶栏 ===== */
.topbar {
  background: #fff; padding: 10px 20px; display: flex; justify-content: space-between; align-items: center;
  height: 60px; border-bottom: 3px solid #d9ecff; box-shadow: 0 4px 16px rgba(120, 180, 240, .16);
  position: relative; z-index: 5;
}
.app-title { font-size: 18px; font-weight: 800; color: #2f6fd8; letter-spacing: .5px; }
.app-title::before { content: "🐳 "; }
.app-title::after { content: " ✨"; color: #8ecbff; }
.user-info { display: flex; align-items: center; gap: 12px; font-size: 13px; color: #7a9cc4; }

/* ===== 整体布局 ===== */
.layout { display: flex; height: calc(100vh - 60px); }
.sidebar {
  width: 200px; padding: 14px 10px; flex-shrink: 0; overflow-y: auto; position: relative;
  background: linear-gradient(180deg, #d5eaff, #e3f2ff 55%, #dbf5ea);
}
.sidebar-deco {
  padding: 16px 10px 8px; text-align: center; font-size: 12px; color: #6a8fc0;
  margin-top: 12px; letter-spacing: 1px; border-top: 2px dashed rgba(120, 180, 240, .4);
  line-height: 1.9;
}
.nav-item {
  padding: 11px 16px; cursor: pointer; display: flex; align-items: center; gap: 10px;
  border-radius: 14px; transition: .15s; font-size: 14px; color: #5579a8; font-weight: 600; margin-bottom: 4px;
}
.nav-item:hover { background: rgba(255, 255, 255, .75); transform: translateX(2px); }
.nav-item.active { background: #fff; color: #2f7de0; box-shadow: 0 4px 12px rgba(120, 180, 240, .4); font-weight: 800; }
.nav-ico { width: 22px; text-align: center; font-size: 16px; }
.main-area { flex: 1; padding: 18px; overflow-y: auto; position: relative; z-index: 1; }

/* ===== 页面面板 ===== */
.page-panel { display: none; }
.page-panel.active { display: block; }
.page-title { font-size: 20px; color: #2f6fd8; margin-bottom: 16px; padding-bottom: 10px; border-bottom: 3px dashed #bfe0ff; font-weight: 800; }
.page-title::before { content: "🌊 "; }

/* ===== 统计卡片 ===== */
.stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 18px; }
.stat-card {
  background: #fff; border-radius: 20px; padding: 18px 20px; position: relative; overflow: hidden;
  border: 2px solid #fff; box-shadow: 0 8px 22px rgba(120, 180, 240, .18);
}
.stat-card::after { content: "💧"; position: absolute; right: -6px; top: -6px; width: 56px; height: 56px; display: flex; align-items: center; justify-content: center; font-size: 30px; background: linear-gradient(135deg, #dceeff, #e3f2ff); border-radius: 50%; opacity: .85; }
.stat-label { font-size: 13px; color: #8aa8cc; font-weight: 600; }
.stat-value { font-size: 27px; font-weight: 800; color: #2f7de0; margin: 6px 0; font-family: "Consolas", monospace; }
.stat-sub { font-size: 12px; color: #a3b8d6; }

/* ===== 卡片/表单 ===== */
.card {
  background: #fff; border-radius: 20px; padding: 16px 18px; margin-bottom: 14px; position: relative;
  border: 2px solid #fff; box-shadow: 0 8px 22px rgba(120, 180, 240, .16);
}
.card h3 { font-size: 15px; color: #2f7de0; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 2px solid #d9ecff; font-weight: 800; }
.form-row { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.form-row label { font-size: 13px; color: #7a9cc4; width: 72px; flex-shrink: 0; font-weight: 600; }
.form-row select, .form-row input {
  padding: 8px 10px; border: 2px solid #d5e9ff; border-radius: 12px; font-size: 13px; flex: 1; min-width: 0;
  background: #f3f9ff; outline: none; color: #46608a;
}
.form-row select:focus, .form-row input:focus { border-color: #5aa7ff; box-shadow: 0 0 0 3px rgba(90, 167, 255, .14); }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; }
/* 刷卡识别 */
.card-swipe-row { display: flex; gap: 8px; flex: 1; min-width: 0; }
.card-swipe-row input { flex: 1; }
.card-swipe-msg { font-size: 12px; margin-top: 4px; width: 100%; }
.card-swipe-msg.ok { color: #1f9d63; }
.card-swipe-msg.warn { color: #ff6b6b; }
.card-tag { display: inline-block; background: #eaf4ff; color: #2f7de0; border: 1px solid #bfe0ff; border-radius: 999px; padding: 2px 10px; font-size: 12px; font-weight: 600; }
.gray { color: #a3b8d6; }

/* ===== 刷卡两次过磅 ===== */
.swipe-status-card {
  display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px;
  background: linear-gradient(135deg, #e6fbf1, #e8f4ff); border: 2px solid #b8e8d0; border-radius: 20px;
  margin-bottom: 14px; flex-wrap: wrap; box-shadow: 0 6px 18px rgba(110, 200, 180, .2);
}
.swipe-status-left { display: flex; align-items: center; gap: 14px; min-width: 260px; flex: 1; }
.swipe-icon {
  width: 56px; height: 56px; border-radius: 50%; background: #fff; display: flex; align-items: center;
  justify-content: center; font-size: 28px; box-shadow: 0 4px 12px rgba(110, 190, 220, .35); flex-shrink: 0;
}
.swipe-icon.ok { background: linear-gradient(135deg, #5fd0a8, #3fc08e); }
.swipe-title { font-size: 18px; font-weight: 800; color: #1d7a5c; }
.swipe-desc { font-size: 13px; color: #5f9e88; margin-top: 3px; }
.swipe-status-right { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.swipe-status-right input {
  padding: 10px 12px; border: 2px solid #bce8d2; border-radius: 14px; font-size: 14px; width: 130px;
  background: #fff; outline: none; color: #1d7a5c;
}
.swipe-status-right input:focus { border-color: #3fc08e; box-shadow: 0 0 0 3px rgba(63, 192, 142, .16); }
.swipe-result {
  margin-bottom: 14px; background: #f2fbf7; border: 2px solid #c9f0e0; border-radius: 16px;
  border-left: 6px solid #3fc08e; padding: 14px 16px;
}
.swipe-result-text { font-size: 15px; color: #1d5a46; }
.swipe-result-meta { display: flex; gap: 24px; margin-top: 10px; font-size: 13px; color: #6f9a8a; flex-wrap: wrap; }
.swipe-result-meta b { color: #1f9d63; }
.status { font-size: 13px; margin-top: 4px; color: #8aa8cc; }
.status.on { color: #1f9d63; font-weight: 700; }
.status.off { color: #ff6b6b; }

/* ===== 磅房布局 ===== */
.weigh-layout { display: flex; gap: 16px; align-items: flex-start; }
.scale-panel { width: 330px; flex-shrink: 0; }
.weigh-form { flex: 1; }

/* ===== 多品类明细行 ===== */
.po-item { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; align-items: center; }
.po-item select { flex: 2 1 120px; padding: 7px 8px; border: 2px solid #d5e9ff; border-radius: 10px; font-size: 13px; background: #f3f9ff; outline: none; }
.po-item input { flex: 1 1 70px; padding: 7px 8px; border: 2px solid #d5e9ff; border-radius: 10px; font-size: 13px; background: #f3f9ff; outline: none; }
.po-net { flex: 0 0 76px; text-align: right; font-weight: 800; color: #ff8a5c; font-size: 13px; }
#poItems, #soItems { margin-bottom: 8px; }

/* ===== 版本标签 ===== */
.version-tag { padding: 4px 12px; background: #e8f1ff; color: #3d7fd6; border: 2px solid #cfe2ff; border-radius: 999px; font-size: 12px; margin-right: 8px; font-weight: 700; }

/* ===== 网页版提示 ===== */
.web-hint { background: #fff7ec; border: 2px solid #ffd9a8; color: #d4872e; padding: 9px 12px; border-radius: 14px; font-size: 12px; margin-bottom: 12px; line-height: 1.6; }

/* ===== Q版单据打印样式（80mm 热敏适配） ===== */
.qdoc {
  font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
  max-width: 72mm; margin: 0 auto; padding: 12px 10px;
  background: #fffaf3; border: 2px solid #ffd9a0; border-radius: 14px;
  color: #5b4a3f; box-sizing: border-box;
}
.qdoc-head { text-align: center; margin-bottom: 10px; }
.qdoc-logo { font-size: 28px; line-height: 1.2; }
.qdoc-logo { font-size: 28px; line-height: 1.2; }
.qdoc-title { font-size: 20px; font-weight: 900; color: #ff6b81; letter-spacing: 4px; margin-top: 1px; }
.qdoc-sub { font-size: 12px; color: #ff9a9e; margin-top: 2px; letter-spacing: 2px; }
.qdoc-badge { text-align: center; font-size: 11px; color: #c98a5a; background: #fff1e0; border-radius: 999px; padding: 4px 10px; display: block; width: 100%; box-sizing: border-box; margin-bottom: 8px; }
.qdoc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3px 8px; font-size: 11px; background: #fff; border: 1.5px dashed #ffd9a0; border-radius: 10px; padding: 7px 9px; margin-bottom: 8px; color: #7a6a5c; }
.qdoc-grid span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qdoc-sum { display: flex; justify-content: space-between; font-weight: 800; font-size: 12px; color: #e8562a; background: #ffe9dd; border-radius: 8px; padding: 6px 9px; margin: 2px 0 4px; }
.qdoc-meta { display: flex; flex-wrap: wrap; gap: 3px 10px; font-size: 11px; background: #fff; border: 1.5px dashed #ffd9a0; border-radius: 10px; padding: 7px 9px; margin-bottom: 8px; color: #7a6a5c; }
.qdoc-meta span { white-space: nowrap; }
.qdoc-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 11px; border-radius: 10px; overflow: hidden; box-shadow: 0 1px 4px rgba(255, 150, 130, 0.15); }
.qdoc-table th { background: linear-gradient(135deg, #ffb36b, #ff8a5c); color: #fff; padding: 6px 3px; font-weight: 700; }
.qdoc-table td { border-bottom: 1px solid #ffe8dc; padding: 5px 3px; text-align: left; background: #fff; }
.qdoc-table tbody tr:nth-child(even) td { background: #fff6ee; }
.qdoc-table tbody tr:last-child td { border-bottom: none; }
.qdoc-table tfoot td { font-weight: 800; background: #ffe9dd; color: #ff6b4a; text-align: right; font-size: 12px; }
.qdoc-kv { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 11px; background: #fff; border-radius: 10px; overflow: hidden; box-shadow: 0 1px 4px rgba(255, 150, 130, 0.15); }
.qdoc-kv td { padding: 5px 8px; border-bottom: 1px dashed #ffead9; }
.qdoc-kv td:first-child { width: 64px; color: #c98a5a; font-weight: 600; background: #fff8f0; }
.qdoc-kv tr:last-child td { border-bottom: none; }
.qdoc-remark { margin: 8px 0 2px; font-size: 11px; color: #8a7a6c; }
.qdoc-items { margin-bottom: 8px; }
.qdoc-item { border-bottom: 1px dashed #ffd9a0; padding: 5px 2px; }
.qdoc-item:last-child { border-bottom: none; }
.qi-name { font-weight: 700; font-size: 12px; color: #5b4a3f; }
.qi-line { font-size: 10px; color: #7a6a5c; margin-top: 2px; }
.qi-remark { font-size: 9px; color: #b4693a; margin-top: 2px; word-break: break-all; background: #fff5e8; border-radius: 5px; padding: 2px 4px; }
.qdoc-total { text-align: right; font-weight: 800; color: #ff6b4a; font-size: 13px; background: #ffe9dd; border-radius: 8px; padding: 6px 9px; margin-bottom: 2px; }
.qdoc-footer { display: flex; justify-content: space-between; font-size: 11px; margin-top: 12px; color: #7a6a5c; }
.qdoc-deco { text-align: center; margin-top: 8px; color: #ffb3a0; font-size: 11px; letter-spacing: 3px; }
.qdoc-ticket { max-width: 72mm; }
.scale-readout { text-align: center; margin-top: 10px; padding-top: 10px; border-top: 2px dashed #d9ecff; }
.scale-label { font-size: 13px; color: #8aa8cc; }
.live-weight {
  font-size: 56px; font-weight: 800; color: #2f7de0; font-family: "Consolas", monospace; margin: 8px 0;
}
.stable-tag { font-size: 13px; padding: 4px 14px; border-radius: 999px; display: inline-block; font-weight: 700; }
.stable-tag.ready { background: linear-gradient(135deg, #5fd0a8, #3fc08e); color: #fff; }
.stable-tag.wait { background: linear-gradient(135deg, #ffd76e, #ffb84d); color: #fff; }
.weight-inputs { display: flex; gap: 12px; margin: 16px 0; }
.weight-box { flex: 1; border: 2px solid #cfe5ff; border-radius: 16px; padding: 12px; text-align: center; background: #fff; }
.weight-box input {
  width: 100%; font-size: 28px; font-weight: 800; text-align: center; border: none;
  outline: none; font-family: "Consolas", monospace; margin: 6px 0; color: #2f7de0;
}
.box-title { font-size: 13px; color: #8aa8cc; font-weight: 600; }
.weight-box.net { background: linear-gradient(135deg, #e6fbf1, #e8f4ff); border-color: #9fdcc0; }
.net-value { font-size: 32px; font-weight: 800; color: #1f9d63; font-family: "Consolas", monospace; padding: 12px 0; }
.amount-value { font-size: 24px; font-weight: 800; color: #ff6b6b; font-family: "Consolas", monospace; padding: 4px 0; }
.actions { display: flex; gap: 12px; margin-top: 16px; }
.msg { margin-top: 10px; font-size: 13px; color: #ff6b6b; min-height: 18px; }
.msg.ok { color: #1f9d63; }

/* ===== 按钮 ===== */
.btn {
  padding: 9px 18px; border: 2px solid #d9ecff; background: #fff; border-radius: 999px;
  cursor: pointer; font-size: 14px; color: #5579a8; font-weight: 700;
  box-shadow: 0 3px 8px rgba(140, 180, 230, .2); transition: .15s;
}
.btn:hover { transform: translateY(-1px); box-shadow: 0 5px 14px rgba(120, 180, 240, .35); }
.btn:active { transform: translateY(1px); }
.btn.primary { background: linear-gradient(135deg, #8ecbff, #5aa7ff); color: #fff; border-color: transparent; box-shadow: 0 5px 14px rgba(90, 167, 255, .45); }
.btn.primary:hover { box-shadow: 0 7px 18px rgba(90, 167, 255, .55); }
.btn.small { padding: 6px 12px; font-size: 12px; }
.btn.large { padding: 13px 34px; font-size: 16px; }
.btn.danger { background: linear-gradient(135deg, #ff9d9d, #ff6b6b); color: #fff; border-color: transparent; }
.btn.danger:hover { box-shadow: 0 5px 14px rgba(255, 107, 107, .45); }
.btn.active { background: linear-gradient(135deg, #5fd0a8, #3fc08e); color: #fff; border-color: transparent; }

/* ===== 工具栏 ===== */
.toolbar { display: flex; gap: 10px; margin-bottom: 12px; align-items: center; flex-wrap: wrap; }
.tb-input { padding: 8px 12px; border: 2px solid #d5e9ff; border-radius: 12px; font-size: 13px; background: #f3f9ff; outline: none; color: #46608a; }
.tb-input:focus { border-color: #5aa7ff; box-shadow: 0 0 0 3px rgba(90, 167, 255, .14); }

/* ===== 数据表格 ===== */
.grid-table { width: 100%; border-collapse: separate; border-spacing: 0; }
.grid-table th {
  background: linear-gradient(135deg, #dceeff, #e3f2ff); text-align: left; padding: 10px 12px;
  font-size: 13px; color: #2f6fd8; border-bottom: 2px solid #cfe5ff; font-weight: 800; white-space: nowrap;
}
.grid-table th:first-child { border-top-left-radius: 14px; }
.grid-table th:last-child { border-top-right-radius: 14px; }
.grid-table td { padding: 10px 12px; border-bottom: 1px solid #eef6ff; font-size: 13px; color: #46608a; }
.grid-table tr:nth-child(even) td { background: #f4faff; }
.grid-table tr:hover td { background: #eaf4ff; }
.grid-table .tag { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.tag.done { background: #d8f7e6; color: #1f9d63; }
.tag.wait { background: #fff3d1; color: #c98a1b; }
.tag.void { background: #ffe1e1; color: #d95555; }
.tag.warn { background: #ffe9d1; color: #e07a1f; }

/* ===== 分页 ===== */
.pager { display: flex; align-items: center; gap: 12px; margin-top: 12px; justify-content: center; }
.pager span { font-size: 13px; color: #7a9cc4; }

/* ===== 弹窗 ===== */
.modal-box {
  background: #fff; border-radius: 24px; padding: 26px; width: 480px; max-width: 92vw;
  max-height: 86vh; overflow-y: auto; border: 3px solid #fff; position: relative;
  box-shadow: 0 20px 50px rgba(90, 160, 235, .32);
}
.modal-box::before { content: "💙"; position: absolute; top: 14px; right: 18px; font-size: 18px; opacity: .7; }
.modal-box h3 { font-size: 16px; color: #2f6fd8; margin-bottom: 16px; font-weight: 800; }
.modal-box label { display: block; font-size: 13px; color: #7a9cc4; margin: 8px 0 4px; font-weight: 600; }
.modal-box input, .modal-box select {
  width: 100%; padding: 9px 12px; border: 2px solid #d5e9ff; border-radius: 12px; font-size: 14px;
  background: #f3f9ff; outline: none; color: #46608a;
}
.modal-box input:focus, .modal-box select:focus { border-color: #5aa7ff; box-shadow: 0 0 0 3px rgba(90, 167, 255, .14); }
.modal-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 18px; }

/* ===== 系统管理 ===== */
.sys-tabs { display: flex; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.sys-panel { display: none; }
.sys-panel.active { display: block; }

/* ===== 报表 ===== */
.report-box { min-height: 120px; line-height: 1.9; }

.empty-text { color: #a3b8d6; text-align: center; padding: 20px 0; }

/* ===== 80mm 热敏打印纸张 ===== */
@page { size: 80mm auto; margin: 3mm; }
@media print {
  html, body { background: #fff !important; background-image: none !important; }
  body::before, body::after { display: none !important; }
  .qdoc { max-width: 72mm; box-shadow: none; border: 2px solid #ffd9a0; }
}
/* 打印 iframe 专用：去掉主界面背景与漂浮泡泡装饰，保证干净白纸 */
.print-page { background: #fff !important; background-image: none !important; }
.print-page::before, .print-page::after { display: none !important; }

/* ===== 采购单表格表单（新建/编辑弹窗） ===== */
.modal-box.po-modal { width: 880px; max-width: 96vw; }
.po-basic { display: flex; gap: 14px; flex-wrap: wrap; margin: 10px 0; }
.pb-field { flex: 1 1 200px; display: flex; flex-direction: column; gap: 4px; }
.pb-field label { font-size: 12px; color: #7a9cc4; font-weight: 600; }
.pb-field input, .pb-field select { padding: 9px 12px; border: 2px solid #d5e9ff; border-radius: 12px; font-size: 14px; background: #f3f9ff; outline: none; color: #46608a; }
.pb-field input:focus, .pb-field select:focus { border-color: #5aa7ff; box-shadow: 0 0 0 3px rgba(90, 167, 255, .14); }
.pb-field span { padding: 8px 2px; font-size: 14px; color: #46608a; }
.po-sec { display: flex; justify-content: space-between; align-items: center; margin: 12px 0 6px; font-weight: 800; color: #2f7de0; }
.po-tblwrap { overflow-x: auto; border: 2px solid #d9ecff; border-radius: 14px; }

.po-table { width: 100%; border-collapse: collapse; min-width: 820px; }
/* 抗翻译插件破坏表格布局 */
.po-table thead { display: table-header-group !important; }
.po-table tbody { display: table-row-group !important; }
.po-table tr { display: table-row !important; }
.po-table th, .po-table td { display: table-cell !important; vertical-align: middle !important; }
.po-table th { background: linear-gradient(135deg, #dceeff, #e3f2ff); color: #2f6fd8; font-size: 12px; padding: 8px 6px; text-align: center; white-space: nowrap; font-weight: 800; }
.po-table td { padding: 5px 4px; border-top: 1px solid #eef6ff; vertical-align: middle; text-align: center; }
.po-table .td-mat { text-align: left; min-width: 200px; }
.po-table .td-mat select { width: 100%; padding: 7px 8px; border: 2px solid #d5e9ff; border-radius: 10px; font-size: 13px; background: #f3f9ff; outline: none; }
.po-table .td-mat textarea.po-remark, .po-table .td-mat input { width: 100%; margin-top: 4px; padding: 6px 8px; border: 2px solid #d9ecff; border-radius: 10px; font-size: 12px; font-family: inherit; line-height: 1.4; background: #f3f9ff; outline: none; }
.po-table .td-mat textarea.po-remark { resize: vertical; min-height: 30px; }
.po-table td input[type=number] { width: 72px; padding: 6px 4px; border: 2px solid #d5e9ff; border-radius: 10px; font-size: 13px; text-align: center; background: #f3f9ff; outline: none; }
.po-net, .po-amt { font-weight: 800; color: #ff8a5c; font-size: 13px; white-space: nowrap; }
.po-del { color: #ff7b7b; background: none; border: none; font-size: 18px; cursor: pointer; line-height: 1; }
.po-del:hover { color: #ff4d6d; }
.po-total { display: flex; justify-content: space-between; margin: 10px 0; padding: 10px 14px; background: linear-gradient(135deg, #eaf4ff, #fff7ec); border-radius: 14px; font-size: 14px; color: #46608a; }
.po-total b { color: #ff8a5c; font-size: 16px; }
#poRemark, #poRemark2 { width: 100%; padding: 9px 12px; border: 2px solid #d5e9ff; border-radius: 12px; font-size: 14px; resize: vertical; box-sizing: border-box; background: #f3f9ff; outline: none; color: #46608a; }
.po-photos { margin-top: 12px; }
.po-photos label { font-size: 12px; color: #7a9cc4; font-weight: 600; }
#poPhotoList { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0; min-height: 40px; }

/* ===== PDA / 移动端适配（小屏幕自动放大） ===== */
@media (max-width: 768px) {
  body { font-size: 16px; }
  .sidebar { width: 60px; }
  .sidebar .nav-text { display: none; }
  .main-content { margin-left: 60px; padding: 10px; }
  .page-title { font-size: 18px; }
  .card { padding: 12px; border-radius: 14px; }
  .btn { padding: 10px 16px; font-size: 15px; border-radius: 12px; }
  .btn.small { padding: 7px 12px; font-size: 13px; }
  .grid-table th, .grid-table td { padding: 8px 6px; font-size: 13px; }
  .toolbar { flex-wrap: wrap; gap: 6px; }
  .tb-input { padding: 8px 10px; font-size: 14px; }
  /* 过磅页 PDA 优化：大按钮、大字重 */
  #page-weigh .weigh-main { flex-direction: column; }
  #page-weigh .weight-display { font-size: 56px; padding: 20px; }
  #page-weigh .swipe-box { min-height: 80px; font-size: 18px; }
  #page-weigh .swipe-box .swipe-title { font-size: 22px; }
  #page-weigh input[type=number], #page-weigh input[type=text] { padding: 12px; font-size: 16px; }
  #page-weigh .pb-field label { font-size: 14px; }
  /* 弹窗 PDA 优化 */
  .modal-content { max-width: 95vw; max-height: 90vh; overflow-y: auto; }
  .po-basic { flex-direction: column; }
  .po-basic .pb-field { width: 100%; }
}
@media (max-width: 480px) {
  #page-weigh .weight-display { font-size: 48px; }
  .stat-card { min-width: 45%; }
}
.po-photo { position: relative; width: 72px; height: 72px; }
.po-photo img { width: 72px; height: 72px; object-fit: cover; border-radius: 12px; border: 2px solid #d9ecff; }
.po-photo .po-photo-del { position: absolute; top: -6px; right: -6px; width: 20px; height: 20px; border-radius: 50%; background: linear-gradient(135deg, #ff9d9d, #ff6b6b); color: #fff; border: none; font-size: 12px; cursor: pointer; line-height: 20px; }
.po-photo-list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.po-photo-actions { margin-bottom: 4px; }
@media (max-width: 900px) { .modal-box.po-modal { width: 96vw; } }

/* ===== 采购单表单窄屏适配（≤900px） ===== */
@media (max-width: 900px) {
  .po-basic { flex-direction: column; gap: 10px; }
  .pb-field { flex: 1 1 auto; width: 100%; }
  .pb-field input, .pb-field select { width: 100%; box-sizing: border-box; }
  .po-tblwrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .po-total { flex-direction: column; gap: 6px; }
  .po-table .td-mat select { max-width: none; width: 100%; }
  .po-table .td-mat textarea.po-remark, .po-table .td-mat input { max-width: none; width: 100%; }
}
.po-tblwrap::-webkit-scrollbar { height: 8px; }
.po-tblwrap::-webkit-scrollbar-thumb { background: #bcd9f7; border-radius: 4px; }

.sub-text { font-size: 11px; color: #8aa8cc; margin-top: 2px; }

.scale-raw-box{margin-top:10px;padding:8px;background:#eef4ff;border-radius:8px;font-size:12px;border:1px dashed #a8c5f0}
.scale-raw-title{font-weight:bold;margin-bottom:4px;color:#4a6fa5}
.scale-raw-text{font-family:Consolas,monospace;word-break:break-all;max-height:90px;overflow-y:auto;color:#333;line-height:1.5}

/* ===== 工作台 · 科技感可爱风 ===== */
#page-dashboard .page-title { display: none; }

/* 欢迎横幅 */
.dash-hero { position: relative; border-radius: 24px; overflow: hidden; margin-bottom: 18px; background: linear-gradient(135deg, #1a365d 0%, #2b6cb0 40%, #4299e1 70%, #63b3ed 100%); box-shadow: 0 10px 40px rgba(66,153,225,.35); }
.dash-hero-bg { position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: hidden; }
.dash-orb { position: absolute; border-radius: 50%; filter: blur(40px); opacity: .5; animation: dashFloat 8s ease-in-out infinite; }
.dash-orb.orb1 { width: 200px; height: 200px; background: #7dd3fc; top: -50px; left: 10%; animation-delay: 0s; }
.dash-orb.orb2 { width: 160px; height: 160px; background: #c4b5fd; bottom: -40px; right: 15%; animation-delay: 2s; }
.dash-orb.orb3 { width: 120px; height: 120px; background: #6ee7b7; top: 30%; right: 30%; animation-delay: 4s; }
@keyframes dashFloat { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(20px,-20px) scale(1.1); } }
.dash-grid { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-image: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px); background-size: 40px 40px; }
.dash-hero-content { position: relative; z-index: 2; padding: 24px 28px; display: flex; justify-content: space-between; align-items: stretch; flex-wrap: nowrap; gap: 0; }
.dash-hero-left { flex: 0 0 auto; min-width: 160px; padding-right: 24px; border-right: 1px solid rgba(255,255,255,0.15); display: flex; flex-direction: column; justify-content: center; }
.dash-greeting { font-size: 24px; color: #fff; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.dash-wave { display: inline-block; animation: dashWave 2s ease-in-out infinite; transform-origin: 70% 70%; }
@keyframes dashWave { 0%,100% { transform: rotate(0); } 25% { transform: rotate(20deg); } 75% { transform: rotate(-10deg); } }
.dash-subtitle { font-size: 13px; color: rgba(255,255,255,.75); margin-top: 4px; letter-spacing: 1px; }
.dash-date-row { display: flex; align-items: center; gap: 6px; margin-top: 12px; font-size: 13px; color: rgba(255,255,255,.85); flex-wrap: wrap; }
.dash-time { font-family: 'Consolas', monospace; font-size: 17px; font-weight: 700; color: #fef3c7; letter-spacing: 1px; text-shadow: 0 0 10px rgba(254,243,199,0.3); }
.dash-hero-center { flex: 1 1 auto; display: flex; justify-content: center; align-items: stretch; padding: 0 20px; min-width: 0; }
.dash-hero-right { flex: 0 0 auto; min-width: 130px; padding-left: 24px; border-left: 1px solid rgba(255,255,255,0.15); display: flex; flex-direction: column; justify-content: center; align-items: flex-end; }
.dash-hero-stat { text-align: right; }
.dash-hero-label { font-size: 12px; color: rgba(255,255,255,.65); margin-bottom: 6px; letter-spacing: 2px; text-transform: uppercase; }
.dash-hero-value { font-size: 26px; font-weight: 800; color: #fff; text-shadow: 0 2px 10px rgba(0,0,0,.2), 0 0 20px rgba(255,255,255,0.1); font-family: 'Consolas', monospace; }

/* 铝价栏 - 欢迎横幅内样式 */
#page-dashboard .dash-hero-center .aluminum-price-bar-hero {
  display: flex !important;
  flex-direction: row !important;
  align-items: stretch;
  gap: 8px;
  width: 100%;
  max-width: 100%;
}
#page-dashboard .dash-hero-center .al-item-hero {
  flex: 1;
  text-align: center;
  padding: 10px 8px;
  background: linear-gradient(135deg, rgba(255,255,255,0.15), rgba(255,255,255,0.05));
  -webkit-backdrop-filter: blur(10px);
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.2);
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
#page-dashboard .dash-hero-center .al-item-hero::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.5), transparent);
}
#page-dashboard .dash-hero-center .al-item-hero:hover {
  background: linear-gradient(135deg, rgba(255,255,255,0.25), rgba(255,255,255,0.1));
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(0,0,0,0.25);
  border-color: rgba(255,255,255,0.35);
}
#page-dashboard .dash-hero-center .al-label-hero {
  font-size: 12px;
  color: rgba(255,255,255,0.85);
  margin-bottom: 6px;
  font-weight: 600;
  letter-spacing: 0.5px;
  white-space: nowrap;
}
#page-dashboard .dash-hero-center .al-price-hero {
  font-size: 20px;
  font-weight: bold;
  color: #fff;
  line-height: 1.2;
  text-shadow: 0 2px 8px rgba(0,0,0,0.3);
  font-family: 'Consolas', monospace;
  letter-spacing: 0;
  margin: 2px 0;
  white-space: nowrap;
}
#page-dashboard .dash-hero-center .al-change-hero {
  font-size: 11px;
  margin-top: 4px;
  font-weight: 600;
  letter-spacing: 0;
  white-space: nowrap;
}
#page-dashboard .dash-hero-center .al-change-hero.up { color: #ff8a80; text-shadow: 0 0 8px rgba(255,138,128,0.4); }
#page-dashboard .dash-hero-center .al-change-hero.down { color: #b9f6ca; text-shadow: 0 0 8px rgba(185,246,202,0.4); }
#page-dashboard .dash-hero-center .al-change-hero.flat { color: rgba(255,255,255,0.5); }

/* 快捷操作 */
.dash-quick { margin-bottom: 18px; }
.dash-quick-title { font-size: 15px; font-weight: 700; color: #46608a; margin-bottom: 12px; padding-left: 4px; }
.dash-quick-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.dash-quick-item { background: #fff; border-radius: 16px; padding: 16px 8px; text-align: center; cursor: pointer; transition: all .3s; box-shadow: 0 2px 12px rgba(66,153,225,.1); border: 2px solid transparent; }
.dash-quick-item:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(66,153,225,.25); border-color: #bee3f8; }
.dash-quick-icon { width: 48px; height: 48px; border-radius: 14px; display: flex; align-items: center; justify-content: center; font-size: 24px; margin: 0 auto 8px; box-shadow: 0 4px 12px rgba(0,0,0,.15); }
.dash-quick-name { font-size: 13px; font-weight: 600; color: #46608a; }

/* 核心数据卡片 */
.dash-stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 18px; }
.dash-stat-card { position: relative; background: #fff; border-radius: 18px; padding: 18px; display: flex; align-items: center; gap: 14px; box-shadow: 0 4px 16px rgba(66,153,225,.12); overflow: hidden; transition: all .3s; }
.dash-stat-card:hover { transform: translateY(-3px); box-shadow: 0 8px 28px rgba(66,153,225,.2); }
.dash-stat-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; }
.dash-stat-green::before { background: linear-gradient(90deg, #11998e, #38ef7d); }
.dash-stat-blue::before { background: linear-gradient(90deg, #2b6cb0, #4299e1); }
.dash-stat-cyan::before { background: linear-gradient(90deg, #0891b2, #22d3ee); }
.dash-stat-pink::before { background: linear-gradient(90deg, #db2777, #f472b6); }
.dash-stat-icon { width: 52px; height: 52px; border-radius: 14px; display: flex; align-items: center; justify-content: center; font-size: 26px; background: linear-gradient(135deg, #ebf8ff, #e0e7ff); flex-shrink: 0; }
.dash-stat-info { flex: 1; min-width: 0; }
.dash-stat-label { font-size: 13px; color: #7a9cc4; font-weight: 600; }
.dash-stat-value { font-size: 24px; font-weight: 800; color: #2d3748; margin: 2px 0; }
.dash-stat-sub { font-size: 12px; color: #a0aec0; }
.dash-stat-trend { font-size: 18px; color: #48bb78; font-weight: 700; }

/* 双列布局 */
.dash-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-items: stretch; }
.dash-col { display: flex; height: 100%; }
.dash-panel { border-radius: 18px; border: none; box-shadow: 0 4px 16px rgba(66,153,225,.1); height: 100%; display: flex; flex-direction: column; padding: 14px 16px !important; }
.dash-panel-title { font-size: 15px; font-weight: 700; color: #2d3748; margin-bottom: 10px; padding-bottom: 8px; border-bottom: 2px solid #ebf8ff; flex-shrink: 0; }

/* 系统状态卡片网格 */
.dash-status-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 10px; }
.dash-status-card { display: flex; align-items: center; gap: 8px; padding: 10px 12px; background: linear-gradient(135deg, #f7fafc, #edf2f7); border-radius: 10px; border: 1px solid #e2e8f0; transition: all 0.3s ease; }
.dash-status-card:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(66,153,225,.15); border-color: #bee3f8; }
.dash-status-card-icon { font-size: 18px; flex-shrink: 0; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; background: #fff; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,.08); }
.dash-status-card-icon.green { background: linear-gradient(135deg, #c6f6d5, #9ae6b4); }
.dash-status-card-icon.blue { background: linear-gradient(135deg, #bee3f8, #90cdf4); }
.dash-status-card-info { flex: 1; min-width: 0; }
.dash-status-card-label { font-size: 11px; color: #718096; margin-bottom: 2px; font-weight: 500; }
.dash-status-card-value { font-size: 14px; font-weight: 700; color: #2d3748; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* 资源使用进度条 */
.dash-resource-row { display: flex; flex-direction: column; gap: 8px; margin-top: auto; }
.dash-resource-item { background: #f7fafc; border-radius: 10px; padding: 8px 12px; border: 1px solid #edf2f7; }
.dash-resource-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.dash-resource-label { font-size: 12px; color: #4a5568; font-weight: 600; }
.dash-resource-value { font-size: 13px; font-weight: 700; color: #2d3748; font-family: 'Consolas', monospace; }
.dash-resource-bar { height: 8px; background: #e2e8f0; border-radius: 4px; overflow: hidden; }
.dash-resource-fill { height: 100%; border-radius: 4px; transition: width 0.5s ease; width: 0%; }
.dash-resource-fill.blue { background: linear-gradient(90deg, #4299e1, #63b3ed); }
.dash-resource-fill.green { background: linear-gradient(90deg, #48bb78, #68d391); }

/* 库存概览 */
.dash-inv-summary { display: flex; flex-direction: column; gap: 12px; flex: 1; }
.dash-inv-top { display: flex; align-items: stretch; gap: 14px; }
.dash-inv-big { text-align: center; padding: 16px 20px; background: linear-gradient(135deg, #ebf8ff, #e0e7ff); border-radius: 14px; min-width: 140px; display: flex; flex-direction: column; justify-content: center; }
.dash-inv-num { font-size: 34px; font-weight: 800; color: #2b6cb0; line-height: 1.1; }
.dash-inv-unit { font-size: 14px; color: #7a9cc4; font-weight: 600; margin-top: 2px; }
.dash-inv-cats { flex: 1; display: flex; flex-direction: column; gap: 10px; }
.dash-inv-cat-item { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; background: #f7fafc; border-radius: 10px; border: 1px solid #edf2f7; flex: 1; }
.dash-inv-cat-label { font-size: 13px; color: #718096; font-weight: 500; }
.dash-inv-cat-value { font-size: 17px; font-weight: 700; color: #2d3748; font-family: 'Consolas', monospace; }
.dash-inv-bottom { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: auto; }
.dash-inv-mini { text-align: center; padding: 12px 10px; background: linear-gradient(135deg, #f0fff4, #e6fffa); border-radius: 10px; border: 1px solid #c6f6d5; }
.dash-inv-mini.out { background: linear-gradient(135deg, #fff5f5, #fffaf0); border-color: #fed7d7; }
.dash-inv-mini-label { font-size: 12px; color: #718096; margin-bottom: 6px; font-weight: 500; }
.dash-inv-mini-value { font-size: 18px; font-weight: 700; color: #2d3748; font-family: 'Consolas', monospace; }
.dash-inv-mini-value.in { color: #38a169; }
.dash-inv-mini-value.out { color: #e53e3e; }

/* ===== Toast 轻提示 ===== */
.toast-container {
  position: fixed; top: 70px; left: 50%; transform: translateX(-50%);
  z-index: 10001; display: flex; flex-direction: column; gap: 8px; align-items: center;
  pointer-events: none;
}
.toast {
  padding: 10px 20px; border-radius: 14px; font-size: 14px; font-weight: 600;
  box-shadow: 0 8px 24px rgba(0,0,0,.15); display: flex; align-items: center; gap: 8px;
  animation: toastIn .3s cubic-bezier(.34,1.56,.64,1); max-width: 90vw;
  pointer-events: auto;
}
.toast.success { background: linear-gradient(135deg, #d4edda, #c3e6cb); color: #155724; border: 2px solid #a3d9a5; }
.toast.error { background: linear-gradient(135deg, #f8d7da, #f5c6cb); color: #721c24; border: 2px solid #f1aeb5; }
.toast.warning { background: linear-gradient(135deg, #fff3cd, #ffeaa7); color: #856404; border: 2px solid #ffe082; }
.toast.info { background: linear-gradient(135deg, #d1ecf1, #bee5eb); color: #0c5460; border: 2px solid #a3d9e0; }
.toast.out { animation: toastOut .3s ease forwards; }
@keyframes toastIn { from { opacity: 0; transform: translateY(-20px) scale(.9); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes toastOut { from { opacity: 1; transform: translateY(0) scale(1); } to { opacity: 0; transform: translateY(-10px) scale(.9); } }

/* ===== 全局加载遮罩 ===== */
.global-loading {
  position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 9998; background: rgba(255,255,255,.6);
  -webkit-backdrop-filter: blur(4px); display: flex; align-items: center; justify-content: center;
  flex-direction: column; gap: 16px;
}
.global-loading .spinner {
  width: 48px; height: 48px; border: 4px solid #d9ecff; border-top-color: #5aa7ff;
  border-radius: 50%; animation: spin .8s linear infinite;
}
.global-loading .loading-text { font-size: 14px; color: #5a7fa8; font-weight: 600; }
@keyframes spin { to { transform: rotate(360deg); } }

/* 按钮loading态 */
.btn.loading { position: relative; color: transparent !important; pointer-events: none; }
.btn.loading::after {
  content: ""; position: absolute; top: 50%; left: 50%; width: 16px; height: 16px;
  margin: -8px 0 0 -8px; border: 2px solid rgba(255,255,255,.4); border-top-color: #fff;
  border-radius: 50%; animation: spin .6s linear infinite;
}

/* 响应式 */
@media (max-width: 1024px) {
  .dash-quick-grid { grid-template-columns: repeat(5, 1fr); gap: 10px; }
  .dash-stat-grid { grid-template-columns: repeat(2, 1fr); }
  .dash-row { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .dash-quick-grid { grid-template-columns: repeat(2, 1fr); }
  .dash-stat-grid { grid-template-columns: 1fr; }
  .dash-hero-content { flex-direction: column; align-items: stretch; gap: 16px; padding: 20px 16px; }
  .dash-hero-left { min-width: auto; padding-right: 0; padding-bottom: 16px; border-right: none; border-bottom: 1px solid rgba(255,255,255,0.15); align-items: center; text-align: center; }
  .dash-hero-center { padding: 0; }
  .dash-hero-right { min-width: auto; padding-left: 0; padding-top: 16px; border-left: none; border-top: 1px solid rgba(255,255,255,0.15); align-items: center; }
  .dash-hero-stat { text-align: center; }
  .dash-greeting { justify-content: center; }
  .dash-date-row { justify-content: center; }
  #page-dashboard .dash-hero-center .aluminum-price-bar-hero { max-width: 100%; }
  #page-dashboard .dash-hero-center .al-price-hero { font-size: 18px; }
}

/* ===== 全面移动端适配（手机） ===== */
@media (max-width: 768px) {
  /* 顶栏简化 */
  .topbar { padding: 8px 12px; height: 52px; }
  .app-title { font-size: 15px; }
  .app-title::before { content: "🐳 "; }
  .app-title::after { content: ""; }
  .user-info { font-size: 11px; gap: 6px; }
  .user-info .btn { padding: 4px 8px; font-size: 11px; }

  /* 侧边栏：图标模式 */
  .layout { height: calc(100vh - 52px); }
  .sidebar { width: 52px; padding: 8px 4px; }
  .sidebar .nav-item { justify-content: center; padding: 10px 4px; }
  .sidebar .nav-text { display: none; }
  .sidebar .nav-ico { font-size: 20px; margin: 0; }
  .sidebar-deco { display: none; }

  /* 主内容区 */
  .main-content { margin-left: 52px; padding: 8px; }
  .page-title { font-size: 17px; margin-bottom: 10px; }
  .card { padding: 10px; border-radius: 12px; }
  .card h3 { font-size: 14px; margin-bottom: 8px; }

  /* 按钮和输入框：触摸友好 */
  .btn { padding: 9px 14px; font-size: 14px; border-radius: 10px; min-height: 36px; }
  .btn.small { padding: 6px 10px; font-size: 12px; min-height: 30px; }
  .tb-input, .filter-sel { padding: 7px 10px; font-size: 13px; min-height: 34px; }
  input, select, textarea { font-size: 14px; }

  /* 工具栏：自动换行 */
  .toolbar { flex-wrap: wrap; gap: 6px; }
  .toolbar .tb-input, .toolbar .filter-sel { flex: 1 1 auto; min-width: 80px; }

  /* 表格：手机端卡片化（不再横向滚动） */
  .card { overflow-x: visible; }
  .grid-table { min-width: 0; width: 100%; font-size: 13px; }
  .grid-table th, .grid-table td { padding: 6px 4px; white-space: normal; word-break: break-word; }
  .op-cell { white-space: normal; }

  /* 分页 */
  .pager { flex-wrap: wrap; gap: 6px; font-size: 12px; }
  .pager .btn { padding: 5px 10px; font-size: 12px; }

  /* 弹窗：接近全屏 */
  .modal-box { width: 95vw !important; max-width: 95vw; max-height: 90vh; overflow-y: auto; padding: 16px !important; border-radius: 16px !important; }
  .modal-box h3 { font-size: 16px; }
  .po-basic { flex-direction: column; gap: 8px; }
  .po-basic .pb-field { width: 100%; }
  .po-basic .pb-field input, .po-basic .pb-field select { width: 100%; box-sizing: border-box; }
  .modal-actions { flex-wrap: wrap; gap: 8px; }
  .modal-actions .btn { flex: 1; min-width: 100px; }

  /* 过磅页面优化 */
  #page-weigh .weigh-layout { flex-direction: column; }
  #page-weigh .scale-panel { order: 2; }
  #page-weigh .weigh-form { order: 1; }
  #page-weigh .weight-display { font-size: 48px; padding: 16px; }
  #page-weigh .swipe-status-card { flex-direction: column; gap: 10px; }
  #page-weigh .swipe-status-left { width: 100%; }
  #page-weigh .swipe-status-right { width: 100%; }
  #page-weigh .swipe-title { font-size: 18px; }
  #page-weigh .swipe-desc { font-size: 13px; }
  #page-weigh .swipe-icon { font-size: 28px; width: 48px; height: 48px; }
  #page-weigh input[type=number], #page-weigh input[type=text] { padding: 10px; font-size: 15px; }
  #page-weigh .form-grid { grid-template-columns: 1fr; }
  #page-weigh .weigh-result { font-size: 20px; }

  /* 采购单表格优化 */
  .po-table { min-width: 700px; }
  .po-table input, .po-table select { font-size: 12px; padding: 4px; }
  .po-total { flex-direction: column; gap: 6px; font-size: 13px; }

  /* 工作台优化 */
  .dash-hero { border-radius: 16px; margin-bottom: 12px; }
  .dash-hero-content { padding: 18px 16px; }
  .dash-greeting { font-size: 20px; }
  .dash-hero-value { font-size: 28px; }
  .dash-quick-title { font-size: 13px; }
  .dash-quick-item { padding: 12px 6px; border-radius: 12px; }
  .dash-quick-icon { width: 40px; height: 40px; font-size: 20px; border-radius: 10px; }
  .dash-quick-name { font-size: 12px; }
  .dash-stat-card { padding: 14px; border-radius: 14px; }
  .dash-stat-icon { width: 44px; height: 44px; font-size: 22px; border-radius: 12px; }
  .dash-stat-value { font-size: 20px; }
  .dash-panel-title { font-size: 14px; }
  .dash-inv-num { font-size: 26px; }
  .dash-status-item { font-size: 13px; }

  /* 打印页面：不影响 */
  @media print {
    .sidebar, .topbar, .toolbar, .pager, .btn { display: none !important; }
    .main-content { margin-left: 0 !important; padding: 0 !important; }
    .card { box-shadow: none !important; border: none !important; overflow: visible !important; }
    .grid-table { min-width: 0 !important; }
  }
}

/* 小屏手机（≤480px） */
@media (max-width: 480px) {
  .app-title { font-size: 13px; }
  .user-info { font-size: 10px; }
  .user-info .btn { padding: 3px 6px; font-size: 10px; }
  .sidebar { width: 46px; }
  .main-content { margin-left: 46px; padding: 6px; }
  .dash-greeting { font-size: 18px; }
  .dash-hero-value { font-size: 24px; }
  .dash-quick-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .dash-quick-item { padding: 10px 4px; }
  .dash-quick-icon { width: 36px; height: 36px; font-size: 18px; }
  .dash-quick-name { font-size: 11px; }
  #page-weigh .weight-display { font-size: 40px; padding: 12px; }
  .grid-table { font-size: 11px; }
  .grid-table th, .grid-table td { padding: 5px 3px; }
}

/* ===== 手机端底部导航栏 ===== */
.mobile-tabbar {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: 60px;
  background: #fff;
  border-top: 2px solid #e8f2ff;
  box-shadow: 0 -4px 16px rgba(90, 167, 255, .12);
  z-index: 100;
  padding-bottom: env(safe-area-inset-bottom);
}
.tab-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  cursor: pointer;
  transition: all .2s;
  position: relative;
}
.tab-item .tab-ico {
  font-size: 22px;
  transition: transform .2s;
}
.tab-item .tab-label {
  font-size: 10px;
  color: #8aa4c4;
  font-weight: 600;
}
.tab-item.active .tab-ico {
  transform: scale(1.15);
}
.tab-item.active .tab-label {
  color: #2f6fd8;
}
.tab-item.active::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 28px;
  height: 3px;
  background: linear-gradient(90deg, #5aa7ff, #7fd0f0);
  border-radius: 0 0 4px 4px;
}
.tab-item.tab-center .tab-ico {
  width: 44px;
  height: 44px;
  background: linear-gradient(135deg, #5aa7ff, #7fd0f0);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  margin-top: -18px;
  box-shadow: 0 4px 12px rgba(90, 167, 255, .4);
}
.tab-item.tab-center.active .tab-ico {
  transform: scale(1.1);
  box-shadow: 0 6px 16px rgba(90, 167, 255, .5);
}

/* ===== 手机端深度优化（≤768px） ===== */
@media (max-width: 768px) {
  /* 全局禁止横向滚动 */
  html, body {
    overflow-x: hidden;
    max-width: 100%;
  }
  /* 显示底部导航，隐藏侧边栏 */
  .mobile-tabbar {
    display: flex;
  }
  .sidebar {
    display: none;
  }
  .main-content {
    margin-left: 0 !important;
    padding-bottom: 70px !important;
  }

  /* 顶栏优化 */
  .topbar {
    height: 48px;
    padding: 6px 12px;
  }
  .app-title {
    font-size: 15px;
  }
  .user-info {
    font-size: 11px;
    gap: 6px;
  }
  .layout {
    height: calc(100vh - 48px);
  }

  /* 页面标题 */
  .page-title {
    font-size: 17px;
    margin-bottom: 10px;
    padding-bottom: 8px;
  }

  /* ===== 过磅页面手机端专项优化 ===== */
  #page-weigh .swipe-status-card {
    padding: 14px;
    border-radius: 16px;
    margin-bottom: 10px;
  }
  #page-weigh .swipe-status-left {
    margin-bottom: 12px;
  }
  #page-weigh .swipe-icon {
    width: 52px;
    height: 52px;
    font-size: 26px;
    border-radius: 14px;
  }
  #page-weigh .swipe-title {
    font-size: 18px;
    font-weight: 800;
  }
  #page-weigh .swipe-desc {
    font-size: 12px;
    line-height: 1.5;
  }
  #page-weigh .swipe-status-right {
    gap: 8px;
  }
  #page-weigh #swipeWeight {
    font-size: 20px;
    font-weight: 800;
    padding: 12px;
    text-align: center;
    border-radius: 12px;
  }
  #page-weigh #btnCardSwipe {
    width: 100%;
    padding: 14px;
    font-size: 17px;
    font-weight: 800;
    border-radius: 14px;
    min-height: 52px;
  }
  #page-weigh #btnManualCard {
    width: 100%;
    padding: 10px;
    font-size: 14px;
    border-radius: 12px;
  }

  /* 操作引导条：手机端简化 */
  #page-weigh .card[style*="eaf4ff"] {
    display: none !important;
  }

  /* 过磅布局：上下排列 */
  #page-weigh .weigh-layout {
    flex-direction: column;
    gap: 10px;
  }
  #page-weigh .scale-panel {
    order: 2;
    padding: 12px;
  }
  #page-weigh .scale-panel h3 {
    font-size: 14px;
    margin-bottom: 8px;
  }
  #page-weigh .scale-readout {
    margin-top: 12px;
    padding: 16px;
    border-radius: 14px;
  }
  #page-weigh .live-weight {
    font-size: 42px;
    font-weight: 900;
  }
  #page-weigh .stable-tag {
    font-size: 13px;
    padding: 4px 12px;
    border-radius: 20px;
  }

  /* 过磅登记表单 */
  #page-weigh .weigh-form {
    order: 1;
    padding: 14px;
  }
  #page-weigh .weigh-form h3 {
    font-size: 15px;
    margin-bottom: 12px;
  }
  #page-weigh .form-grid {
    grid-template-columns: 1fr !important;
    gap: 10px;
  }
  #page-weigh .form-row label {
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 4px;
  }
  #page-weigh .form-row input,
  #page-weigh .form-row select {
    padding: 12px;
    font-size: 15px;
    border-radius: 10px;
    min-height: 44px;
  }
  #page-weigh .weight-display {
    font-size: 36px;
    padding: 16px;
    border-radius: 14px;
  }
  #page-weigh .weigh-result {
    font-size: 22px;
    padding: 14px;
    border-radius: 14px;
  }
  #page-weigh .weigh-actions {
    flex-direction: column;
    gap: 8px;
  }
  #page-weigh .weigh-actions .btn {
    width: 100%;
    padding: 13px;
    font-size: 15px;
    min-height: 48px;
    border-radius: 12px;
  }

  /* 刷卡结果 */
  #page-weigh .swipe-result {
    padding: 14px;
    border-radius: 14px;
  }
  #page-weigh .swipe-result-text {
    font-size: 14px;
    line-height: 1.6;
  }
  #page-weigh .swipe-result-meta {
    flex-direction: column;
    gap: 4px;
    font-size: 12px;
    margin-top: 10px;
  }

  /* ===== 表格页面手机端卡片化 ===== */
  .card {
    overflow-x: visible !important;
  }
  .card-table-view {
    padding: 0;
    background: transparent;
    box-shadow: none;
    border: none;
    overflow: visible !important;
  }
  .grid-table {
    min-width: 0 !important;
    width: 100% !important;
  }
  .grid-table thead {
    display: none;
  }
  .grid-table tbody tr {
    display: block;
    background: #fff;
    border-radius: 14px;
    padding: 12px;
    margin-bottom: 10px;
    box-shadow: 0 2px 8px rgba(90, 167, 255, .08);
    border: 1px solid #e8f2ff;
  }
  .grid-table tbody td {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 0;
    border: none;
    font-size: 13px;
    white-space: normal !important;
    word-break: break-word;
    text-align: right;
  }
  .grid-table tbody td::before {
    content: attr(data-label);
    font-weight: 700;
    color: #5a7fa8;
    font-size: 12px;
    margin-right: 8px;
    flex-shrink: 0;
    text-align: left;
  }
  .grid-table tbody td[data-label=""]::before,
  .grid-table tbody td:not([data-label])::before {
    content: "";
    margin-right: 0;
  }
  .grid-table tbody td.op-cell {
    justify-content: flex-end;
    gap: 6px;
    flex-wrap: wrap;
    padding-top: 10px;
    border-top: 1px dashed #e8f2ff;
    margin-top: 4px;
  }
  .grid-table tbody td.op-cell::before {
    display: none;
  }

  /* ===== 弹窗手机端优化 ===== */
  .modal-box {
    width: 94vw !important;
    max-width: 94vw;
    max-height: 85vh;
    padding: 18px !important;
    border-radius: 20px !important;
  }
  .modal-box h3 {
    font-size: 17px;
    margin-bottom: 14px;
    padding-bottom: 10px;
  }
  .po-basic {
    flex-direction: column;
    gap: 10px;
  }
  .po-basic .pb-field {
    width: 100%;
  }
  .po-basic .pb-field label {
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 4px;
  }
  .po-basic .pb-field input,
  .po-basic .pb-field select,
  .po-basic .pb-field textarea {
    padding: 11px;
    font-size: 15px;
    border-radius: 10px;
    min-height: 44px;
  }
  .modal-actions {
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
  }
  .modal-actions .btn {
    flex: 1;
    min-width: 100px;
    padding: 12px;
    font-size: 15px;
    min-height: 46px;
    border-radius: 12px;
  }

  /* 采购单表格弹窗 */
  .po-table {
    min-width: 0;
    font-size: 12px;
  }
  .po-table input,
  .po-table select {
    padding: 6px;
    font-size: 12px;
  }
  .po-total {
    flex-direction: column;
    gap: 6px;
    font-size: 13px;
    padding: 10px;
  }

  /* ===== 工作台手机端优化 ===== */
  .dash-hero {
    border-radius: 16px;
    margin-bottom: 10px;
    min-height: 140px;
  }
  .dash-hero-content {
    padding: 16px 14px;
  }
  .dash-greeting {
    font-size: 18px;
  }
  .dash-hero-sub {
    font-size: 12px;
  }
  .dash-hero-value {
    font-size: 26px;
  }
  .dash-hero-label {
    font-size: 11px;
  }
  .dash-quick-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    margin-bottom: 12px;
  }
  .dash-quick-item {
    padding: 10px 4px;
    border-radius: 12px;
  }
  .dash-quick-icon {
    width: 38px;
    height: 38px;
    font-size: 18px;
    border-radius: 10px;
  }
  .dash-quick-name {
    font-size: 11px;
    margin-top: 4px;
  }
  .dash-stat-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    margin-bottom: 12px;
  }
  .dash-stat-card {
    padding: 12px;
    border-radius: 14px;
  }
  .dash-stat-icon {
    width: 38px;
    height: 38px;
    font-size: 18px;
    border-radius: 10px;
  }
  .dash-stat-value {
    font-size: 18px;
  }
  .dash-stat-label {
    font-size: 11px;
  }
  .dash-row {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .dash-panel {
    padding: 12px;
    border-radius: 14px;
  }
  .dash-panel-title {
    font-size: 14px;
    margin-bottom: 10px;
  }
  .dash-inv-num {
    font-size: 28px;
  }
  .dash-status-item {
    font-size: 12px;
    padding: 6px 0;
  }
  .dash-mem-bar {
    height: 8px;
    border-radius: 4px;
  }

  /* ===== 工具栏手机端 ===== */
  .toolbar {
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 10px;
  }
  .toolbar .tb-input,
  .toolbar .filter-sel {
    flex: 1 1 calc(50% - 6px);
    min-width: 0;
    padding: 9px 10px;
    font-size: 13px;
    min-height: 40px;
    border-radius: 10px;
  }
  .toolbar .btn {
    flex: 1 1 calc(50% - 6px);
    padding: 9px 12px;
    font-size: 13px;
    min-height: 40px;
    border-radius: 10px;
  }

  /* ===== 分页手机端 ===== */
  .pager {
    flex-wrap: wrap;
    gap: 6px;
    font-size: 12px;
    padding: 10px 0;
  }
  .pager .btn {
    padding: 6px 12px;
    font-size: 12px;
    min-height: 36px;
    border-radius: 8px;
  }

  /* 卡片通用 */
  .card {
    border-radius: 14px;
    padding: 12px;
    margin-bottom: 10px;
  }
  .card h3 {
    font-size: 14px;
    margin-bottom: 10px;
  }
}

/* 小屏手机（≤480px） */
@media (max-width: 480px) {
  .mobile-tabbar {
    height: 56px;
  }
  .tab-item .tab-ico {
    font-size: 20px;
  }
  .tab-item .tab-label {
    font-size: 9px;
  }
  .tab-item.tab-center .tab-ico {
    width: 40px;
    height: 40px;
    font-size: 20px;
    margin-top: -16px;
  }
  #page-weigh .live-weight {
    font-size: 36px;
  }
  #page-weigh #btnCardSwipe {
    font-size: 16px;
    padding: 12px;
  }
  .dash-quick-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
  }
  .dash-quick-icon {
    width: 34px;
    height: 34px;
    font-size: 16px;
  }
  .dash-quick-name {
    font-size: 10px;
  }
}

.search-history-tag{display:inline-block;background:#e3f2fd;color:#1565c0;padding:3px 10px;border-radius:12px;margin:2px 4px;cursor:pointer;font-size:12px}.search-history-tag:hover{background:#bbdefb;}
/* ==================== 数据大屏 ==================== */
/* ==================== 数据大屏 - 科技感风格 ==================== */
#page-datascreen {
  background: linear-gradient(135deg, #0a1628 0%, #0d2137 50%, #0a1628 100%);
  min-height: calc(100vh - 60px);
  padding: 15px;
  position: relative;
  overflow: hidden;
}
#page-datascreen::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background-image:
    linear-gradient(rgba(0, 200, 255, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 200, 255, 0.03) 1px, transparent 1px);
  background-size: 40px 40px;
  pointer-events: none;
  z-index: 0;
}
#page-datascreen .page-title {
  color: #00e5ff;
  text-shadow: 0 0 20px rgba(0, 229, 255, 0.5), 0 0 40px rgba(0, 229, 255, 0.3);
  font-size: 24px;
  letter-spacing: 4px;
  margin-bottom: 15px;
  position: relative;
  z-index: 1;
  text-align: center;
}
#page-datascreen .page-title::before,
#page-datascreen .page-title::after {
  content: '◆';
  color: #00e5ff;
  margin: 0 15px;
  font-size: 14px;
  animation: dsPulse 2s ease-in-out infinite;
}
@keyframes dsPulse {
  0%, 100% { opacity: 0.4; transform: scale(0.8); }
  50% { opacity: 1; transform: scale(1.2); }
}
.ds-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: linear-gradient(90deg, rgba(0, 100, 180, 0.3), rgba(0, 200, 255, 0.15), rgba(0, 100, 180, 0.3));
  border: 1px solid rgba(0, 229, 255, 0.3);
  color: #00e5ff;
  padding: 12px 25px;
  border-radius: 8px;
  margin-bottom: 15px;
  box-shadow: 0 0 20px rgba(0, 229, 255, 0.15), inset 0 0 20px rgba(0, 229, 255, 0.05);
  position: relative;
  z-index: 1;
}
.ds-header::before, .ds-header::after {
  content: '';
  position: absolute;
  width: 20px; height: 20px;
  border: 2px solid #00e5ff;
}
.ds-header::before {
  top: -2px; left: -2px;
  border-right: none; border-bottom: none;
}
.ds-header::after {
  bottom: -2px; right: -2px;
  border-left: none; border-top: none;
}
.ds-time {
  font-size: 36px;
  font-weight: bold;
  font-family: 'Courier New', 'Consolas', monospace;
  text-shadow: 0 0 15px rgba(0, 229, 255, 0.8), 0 0 30px rgba(0, 229, 255, 0.4);
  letter-spacing: 3px;
  animation: dsGlow 2s ease-in-out infinite alternate;
}
@keyframes dsGlow {
  from { text-shadow: 0 0 10px rgba(0, 229, 255, 0.5), 0 0 20px rgba(0, 229, 255, 0.3); }
  to { text-shadow: 0 0 20px rgba(0, 229, 255, 0.9), 0 0 40px rgba(0, 229, 255, 0.5); }
}
.ds-date {
  font-size: 16px;
  color: #80d8ff;
  letter-spacing: 2px;
}
.ds-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
  margin-bottom: 15px;
  position: relative;
  z-index: 1;
}
.ds-grid-2 {
  grid-template-columns: repeat(2, 1fr);
}
.ds-card {
  background: linear-gradient(135deg, rgba(10, 30, 60, 0.8), rgba(20, 50, 90, 0.6));
  border-radius: 8px;
  padding: 18px;
  box-shadow: 0 0 15px rgba(0, 150, 255, 0.1), inset 0 0 15px rgba(0, 100, 200, 0.05);
  border: 1px solid rgba(0, 200, 255, 0.2);
  position: relative;
  overflow: hidden;
  transition: all 0.3s ease;
}
.ds-card:hover {
  border-color: rgba(0, 229, 255, 0.5);
  box-shadow: 0 0 25px rgba(0, 200, 255, 0.2), inset 0 0 20px rgba(0, 150, 255, 0.08);
  transform: translateY(-2px);
}
.ds-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 30px; height: 30px;
  border-top: 2px solid #00e5ff;
  border-left: 2px solid #00e5ff;
  opacity: 0.6;
}
.ds-card::after {
  content: '';
  position: absolute;
  bottom: 0; right: 0;
  width: 30px; height: 30px;
  border-bottom: 2px solid #00e5ff;
  border-right: 2px solid #00e5ff;
  opacity: 0.6;
}
.ds-card-title {
  font-size: 15px;
  font-weight: bold;
  color: #00e5ff;
  margin-bottom: 15px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(0, 229, 255, 0.2);
  letter-spacing: 2px;
  text-shadow: 0 0 10px rgba(0, 229, 255, 0.3);
  position: relative;
}
.ds-card-title::after {
  content: '';
  position: absolute;
  bottom: -1px; left: 0;
  width: 50px; height: 2px;
  background: linear-gradient(90deg, #00e5ff, transparent);
}
.ds-stat-row {
  display: flex;
  justify-content: space-around;
  margin-bottom: 12px;
}
.ds-stat {
  text-align: center;
  flex: 1;
  padding: 8px 5px;
  background: rgba(0, 100, 180, 0.1);
  border-radius: 6px;
  margin: 0 4px;
  border: 1px solid rgba(0, 150, 255, 0.15);
}
.ds-stat-label {
  font-size: 12px;
  color: #80d8ff;
  margin-bottom: 6px;
  letter-spacing: 1px;
}
.ds-stat-value {
  font-size: 26px;
  font-weight: bold;
  color: #00e5ff;
  font-family: 'Courier New', 'Consolas', monospace;
  text-shadow: 0 0 15px rgba(0, 229, 255, 0.5);
  line-height: 1.2;
}
.ds-stat-unit {
  font-size: 11px;
  color: #4fc3f7;
  margin-top: 4px;
  letter-spacing: 1px;
}
.ds-today .ds-stat-value { color: #69f0ae; text-shadow: 0 0 15px rgba(105, 240, 174, 0.5); }
.ds-month .ds-stat-value { color: #40c4ff; text-shadow: 0 0 15px rgba(64, 196, 255, 0.5); }
.ds-inventory .ds-stat-value { color: #ffab40; text-shadow: 0 0 15px rgba(255, 171, 64, 0.5); }
.ds-bar-list {
  min-height: 180px;
}
.ds-bar-item {
  margin-bottom: 14px;
}
.ds-bar-label {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  margin-bottom: 6px;
}
.ds-bar-name { color: #b3e5fc; font-weight: 500; letter-spacing: 1px; }
.ds-bar-value { color: #00e5ff; font-weight: bold; font-family: 'Courier New', monospace; }
.ds-bar-track {
  height: 16px;
  background: rgba(0, 50, 100, 0.5);
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid rgba(0, 150, 255, 0.2);
  position: relative;
}
.ds-bar-track::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: repeating-linear-gradient(
    90deg,
    transparent,
    transparent 10px,
    rgba(0, 0, 0, 0.1) 10px,
    rgba(0, 0, 0, 0.1) 11px
  );
}
.ds-bar-fill {
  height: 100%;
  border-radius: 8px;
  transition: width 0.8s ease;
  background: linear-gradient(90deg, #00b8d4, #00e5ff, #18ffff);
  box-shadow: 0 0 10px rgba(0, 229, 255, 0.6), 0 0 20px rgba(0, 229, 255, 0.3);
  position: relative;
  overflow: hidden;
}
.ds-bar-fill::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
  animation: dsShine 2s linear infinite;
}
@keyframes dsShine {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}
.ds-order-list {
  min-height: 180px;
  max-height: 250px;
  overflow-y: auto;
}
.ds-order-list::-webkit-scrollbar {
  width: 6px;
}
.ds-order-list::-webkit-scrollbar-track {
  background: rgba(0, 50, 100, 0.3);
  border-radius: 3px;
}
.ds-order-list::-webkit-scrollbar-thumb {
  background: rgba(0, 200, 255, 0.5);
  border-radius: 3px;
}
.ds-order-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 8px;
  border-bottom: 1px solid rgba(0, 150, 255, 0.1);
  font-size: 13px;
  transition: background 0.2s ease;
}
.ds-order-item:hover {
  background: rgba(0, 100, 180, 0.15);
}
.ds-order-item:last-child { border-bottom: none; }
.ds-order-no { color: #80d8ff; font-weight: 500; font-family: 'Courier New', monospace; }
.ds-order-type {
  padding: 3px 10px;
  border-radius: 4px;
  font-size: 11px;
  margin: 0 8px;
  letter-spacing: 1px;
  font-weight: bold;
}
.ds-order-type.buy {
  background: rgba(105, 240, 174, 0.15);
  color: #69f0ae;
  border: 1px solid rgba(105, 240, 174, 0.3);
}
.ds-order-type.sell {
  background: rgba(64, 196, 255, 0.15);
  color: #40c4ff;
  border: 1px solid rgba(64, 196, 255, 0.3);
}
.ds-order-amount {
  color: #ffab40;
  font-weight: bold;
  font-family: 'Courier New', monospace;
  text-shadow: 0 0 8px rgba(255, 171, 64, 0.4);
}
.ds-empty {
  text-align: center;
  color: rgba(128, 216, 255, 0.5);
  padding: 40px 0;
  font-size: 14px;
  letter-spacing: 2px;
}

@keyframes dsScan {
  0% { top: 0; opacity: 0; }
  10% { opacity: 0.8; }
  90% { opacity: 0.8; }
  100% { top: 100%; opacity: 0; }
}
@keyframes dsBlink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}
@keyframes dsFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-5px); }
}
.ds-card {
  animation: dsFloat 4s ease-in-out infinite;
}
.ds-card:nth-child(2) { animation-delay: 0.5s; }
.ds-card:nth-child(3) { animation-delay: 1s; }

@media (max-width: 768px) {
  .ds-grid { grid-template-columns: 1fr; }
  .ds-grid-2 { grid-template-columns: 1fr; }
  .ds-time { font-size: 24px; }
  .ds-stat-value { font-size: 20px; }
  #page-datascreen .page-title { font-size: 18px; letter-spacing: 2px; }
  .ds-header { flex-direction: column; gap: 8px; text-align: center; }
}
/* ==================== 消息通知 ==================== */
.notify-bell {
  position: relative;
  font-size: 20px;
  cursor: pointer;
  margin-right: 15px;
  padding: 5px;
  border-radius: 50%;
  transition: background 0.2s;
}
.notify-bell:hover {
  background: rgba(255,255,255,0.2);
}
.notify-badge {
  position: absolute;
  top: 0;
  right: 0;
  background: #f44336;
  color: white;
  font-size: 10px;
  min-width: 16px;
  height: 16px;
  line-height: 16px;
  text-align: center;
  border-radius: 8px;
  padding: 0 4px;
  font-weight: bold;
}
.notify-item {
  display: flex;
  padding: 12px;
  border-bottom: 1px solid #f0f0f0;
  cursor: pointer;
  transition: background 0.2s;
}
.notify-item:hover {
  background: #f5f5f5;
}
.notify-item.unread {
  background: #e3f2fd;
}
.notify-type {
  font-size: 24px;
  margin-right: 12px;
  flex-shrink: 0;
}
.notify-content {
  flex: 1;
}
.notify-title {
  font-weight: bold;
  color: #333;
  margin-bottom: 4px;
  font-size: 14px;
}
.notify-text {
  color: #666;
  font-size: 13px;
  margin-bottom: 4px;
}
.notify-time {
  color: #999;
  font-size: 11px;
}
/* 财务结算标签页 */
.tab-bar {
  display: flex;
  gap: 8px;
  border-bottom: 2px solid #e3f2fd;
  padding-bottom: 0;
}
.tab-btn {
  padding: 10px 20px;
  cursor: pointer;
  border-radius: 8px 8px 0 0;
  font-size: 14px;
  color: #666;
  transition: all 0.2s;
  user-select: none;
}
.tab-btn:hover {
  background: #f5f5f5;
  color: #1565c0;
}
.tab-btn.active {
  background: linear-gradient(135deg, #1565c0, #42a5f5);
  color: white;
  font-weight: bold;
  box-shadow: 0 -2px 8px rgba(21, 101, 192, 0.2);
}
/* 铝价实时更新栏 */
.aluminum-price-bar {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 12px 16px;
  background: linear-gradient(135deg, #e3f2fd, #e8f5e9, #fff3e0);
  border-radius: 12px;
  margin-bottom: 12px;
  flex-wrap: wrap;
  border: 2px solid #bbdefb;
}
.al-item {
  flex: 1;
  min-width: 180px;
  text-align: center;
  padding: 8px 12px;
  background: rgba(255,255,255,0.85);
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}
.al-label {
  font-size: 13px;
  color: #666;
  margin-bottom: 4px;
  font-weight: 500;
}
.al-price {
  font-size: 22px;
  font-weight: bold;
  color: #1565c0;
  line-height: 1.2;
}
.al-change {
  font-size: 12px;
  margin-top: 2px;
  font-weight: 500;
}
.al-change.up {
  color: #e53935;
}
.al-change.down {
  color: #43a047;
}
.al-change.flat {
  color: #888;
}
.al-refresh {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-width: 80px;
}
.al-time {
  font-size: 11px;
  color: #888;
}
/* 刷脸过磅按钮 */
.face-swipe-btn {
  background: linear-gradient(135deg, #7fd0f0, #5aa7ff) !important;
  color: #fff !important;
  border: none !important;
  box-shadow: 0 2px 8px rgba(90,167,255,.35);
}
.face-swipe-btn:hover { filter: brightness(1.08); }

/* ==================== PDA全屏称重模式 ==================== */
.pda-scale {
  position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 9999;
  background: linear-gradient(160deg, #0a1f3c 0%, #123a66 45%, #0d2a52 100%);
  display: flex; flex-direction: column;
  color: #fff; font-family: 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif;
  overflow: hidden;
}
.pda-scale.hidden { display: none; }
.pda-scale-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px;
  background: rgba(255,255,255,.06);
  border-bottom: 1px solid rgba(255,255,255,.12);
  -webkit-backdrop-filter: blur(6px);
}
.pda-scale-status {
  display: flex; align-items: center; gap: 8px;
  font-size: 15px; font-weight: 600; letter-spacing: 1px;
  color: #7fd0f0;
}
.pda-status-dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: #39d98a; box-shadow: 0 0 8px #39d98a;
  animation: pda-pulse 1.6s infinite;
}
@keyframes pda-pulse { 0%,100%{opacity:1} 50%{opacity:.35} }
.pda-scale-info {
  font-size: 13px; color: #b8d4f0;
  display: flex; align-items: center; gap: 8px;
  max-width: 46%; overflow: hidden; white-space: nowrap;
}
.pda-scale-sep { color: rgba(255,255,255,.25); }
.pda-scale-close {
  background: rgba(255,255,255,.1); border: none; color: #fff;
  width: 34px; height: 34px; border-radius: 50%;
  font-size: 16px; cursor: pointer;
}
.pda-scale-close:active { background: rgba(255,255,255,.25); }
.pda-scale-body {
  flex: 1; display: flex; align-items: center; justify-content: center;
  gap: 4%; padding: 0 6%;
  min-height: 0;
}
.pda-scale-weight { text-align: center; flex: 1; min-width: 0; }
.pda-scale-num {
  font-size: 150px; font-size: clamp(64px, 16vw, 150px);
  font-weight: 800; line-height: 1.05;
  font-family: 'DIN Alternate', 'Bahnschrift', 'Segoe UI', sans-serif;
  color: #fff;
  text-shadow: 0 0 30px rgba(127,208,240,.45);
  letter-spacing: 1px;
  white-space: nowrap;
}
.pda-scale-unit {
  margin-top: 4px; font-size: 20px; font-size: clamp(14px, 3vw, 20px);
  color: #7fd0f0; letter-spacing: 6px; font-weight: 500;
}
.pda-scale-side {
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  padding-right: 2%;
}
.pda-scale-icon {
  width: 96px; width: clamp(56px, 12vw, 96px); height: 96px; height: clamp(56px, 12vw, 96px);
  border-radius: 50%;
  background: linear-gradient(135deg, rgba(127,208,240,.25), rgba(90,167,255,.18));
  border: 2px solid rgba(127,208,240,.4);
  display: flex; align-items: center; justify-content: center;
  font-size: 52px; font-size: clamp(28px, 6vw, 52px);
}
.pda-scale-step {
  font-size: 15px; font-size: clamp(12px, 2.6vw, 15px); color: #9fc2e4;
  text-align: center; line-height: 1.4;
}
.pda-scale-toolbar {
  display: flex; justify-content: center; gap: 12px;
  padding: 8px 16px 12px;
  flex-wrap: wrap;
}
.pda-tool {
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(127,208,240,.35);
  color: #cfe6ff; border-radius: 22px;
  padding: 9px 20px; font-size: 15px; cursor: pointer;
  min-width: 88px;
}
.pda-tool:active { background: rgba(127,208,240,.25); }
.pda-scale-actions {
  display: flex; align-items: center; justify-content: center;
  gap: 14%; padding: 6px 8% 26px;
}
.pda-scale-start {
  background: transparent; border: none; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 0;
}
.pda-start-circle {
  width: 104px; width: clamp(72px, 15vw, 104px); height: 104px; height: clamp(72px, 15vw, 104px);
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #54e08a, #17b15c);
  box-shadow: 0 6px 26px rgba(23,177,92,.5), inset 0 -4px 12px rgba(0,0,0,.2);
  display: flex; align-items: center; justify-content: center;
  font-size: 32px; font-size: clamp(22px, 5vw, 32px); color: #fff;
}
.pda-start-text {
  font-size: 18px; font-size: clamp(14px, 3vw, 18px); color: #7ee0a8;
  letter-spacing: 4px; font-weight: 700;
}
.pda-scale-start:active .pda-start-circle { transform: scale(.94); }
.pda-scale-confirm {
  background: linear-gradient(135deg, #2f7be0, #1d4e89);
  border: none; color: #fff;
  font-size: 22px; font-size: clamp(16px, 3.6vw, 22px); font-weight: 700;
  letter-spacing: 3px;
  padding: 18px 30px; border-radius: 30px;
  cursor: pointer;
  box-shadow: 0 4px 20px rgba(47,123,224,.4);
}
.pda-scale-confirm:active { transform: scale(.96); }
/* 过磅完成态 */
.pda-scale-start.done .pda-start-circle {
  background: radial-gradient(circle at 30% 30%, #ffb45e, #f08a2d);
  box-shadow: 0 6px 26px rgba(240,138,45,.5), inset 0 -4px 12px rgba(0,0,0,.2);
}
.pda-scale-start.done .pda-start-text { color: #ffc98a; }
/* 手机端适配 */
@media (max-width: 600px) {
  .pda-scale-info { max-width: 52%; }
  .pda-scale-toolbar .pda-tool { padding: 8px 12px; font-size: 13px; min-width: 64px; }
}

/* ==================== 安卓9兼容：flex gap 不支持时的间距补偿 ==================== */
/* 状态区 */
.pda-scale-status > * + * { margin-left: 8px; }
.pda-scale-info > * + * { margin-left: 8px; }
/* 称重主体 */
.pda-scale-body > * + * { margin-left: 4%; }
.pda-scale-side > * + * { margin-top: 14px; }
/* 工具栏 */
.pda-scale-toolbar .pda-tool + .pda-tool { margin-left: 12px; }
/* 主按钮区 */
.pda-scale-actions > * + * { margin-left: 14%; }
.pda-scale-start > * + * { margin-top: 6px; }
/* 头部分隔线 */
.pda-scale-head > * + * { margin-left: 12px; }
/* 新浏览器支持 gap 时，去掉 margin 避免双倍间距 */
@supports (gap: 12px) {
  .pda-scale-status { gap: 8px; }
  .pda-scale-info { gap: 8px; }
  .pda-scale-body { gap: 4%; }
  .pda-scale-side { gap: 14px; }
  .pda-scale-toolbar { gap: 12px; }
  .pda-scale-actions { gap: 14%; }
  .pda-scale-start { gap: 6px; }
  .pda-scale-head { gap: 12px; }
  .pda-scale-status > * + *, .pda-scale-info > * + *,
  .pda-scale-body > * + *, .pda-scale-side > * + *,
  .pda-scale-toolbar .pda-tool + .pda-tool,
  .pda-scale-actions > * + *, .pda-scale-start > * + *,
  .pda-scale-head > * + * { margin-left: 0; margin-top: 0; }
}
@media (max-width: 600px) {
  .pda-scale-toolbar .pda-tool { padding: 8px 12px; font-size: 13px; min-width: 64px; }
}

/* 全屏称重-刷脸大按钮 */
.pda-face-big {
  background: linear-gradient(135deg, #7fd0f0, #5aa7ff);
  border: none; color: #fff; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  width: 210px; height: 130px;
  border-radius: 28px;
  box-shadow: 0 8px 28px rgba(90,167,255,.45);
  margin: 0 auto;
}
.pda-face-big:active { transform: scale(.96); }
.pda-face-icon { font-size: 42px; line-height: 1.1; }
.pda-face-text {
  font-size: 20px; font-weight: 700; letter-spacing: 4px; margin-top: 6px;
}
/* 全屏底部提示行 */
.pda-scale-step {
  text-align: center; color: #9fc2e4;
  font-size: 13px; line-height: 1.5;
  padding: 0 20px 18px;
}
/* 精简版布局：身体居中 */
.pda-scale-actions {
  display: flex; align-items: center; justify-content: center;
  padding: 10px 8% 18px;
}
@supports (gap: 12px) {
  .pda-scale-actions { gap: 14%; }
}

#toast { z-index: 10001 !important; }

/* ==================== 赛博朋克风数据大屏（覆盖层） ==================== */
#page-datascreen {
  background: radial-gradient(ellipse at 50% -10%, #1e0538 0%, #0a0020 45%, #020008 100%) !important;
}
#page-datascreen::before {
  background-image:
    linear-gradient(rgba(255,43,214,0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,240,255,0.06) 1px, transparent 1px) !important;
  background-size: 28px 28px !important;
}
#page-datascreen .page-title {
  background: linear-gradient(90deg, #00f0ff 0%, #ff2bd6 50%, #00f0ff 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
  filter: drop-shadow(0 0 14px rgba(255,43,214,0.55)) drop-shadow(0 0 28px rgba(0,240,255,0.4));
  font-family: 'Orbitron','Courier New',monospace !important;
  letter-spacing: 8px !important;
  animation: cyberTitle 3s ease-in-out infinite;
}
@keyframes cyberTitle {
  0%,100% { filter: drop-shadow(0 0 10px rgba(255,43,214,.5)) drop-shadow(0 0 20px rgba(0,240,255,.35)); }
  50% { filter: drop-shadow(0 0 20px rgba(255,43,214,.9)) drop-shadow(0 0 40px rgba(0,240,255,.6)); }
}
.ds-header {
  background: linear-gradient(90deg, rgba(255,43,214,0.12), rgba(0,240,255,0.12), rgba(255,43,214,0.12)) !important;
  border: 1px solid rgba(0,240,255,0.45) !important;
  box-shadow: 0 0 25px rgba(0,240,255,0.25), inset 0 0 25px rgba(255,43,214,0.08) !important;
}
.ds-header::before, .ds-header::after { border-color: #ff2bd6 !important; }
.ds-time {
  color: #00f0ff !important;
  text-shadow: 0 0 18px #00f0ff, 0 0 40px rgba(0,240,255,.7), 0 0 60px rgba(255,43,214,.4) !important;
}
.ds-date { color: #ff8ceb !important; text-shadow: 0 0 10px rgba(255,43,214,.6); }
.ds-card {
  background: linear-gradient(160deg, rgba(20,5,45,0.85) 0%, rgba(5,0,20,0.9) 100%) !important;
  border: 1px solid transparent !important;
  border-image: linear-gradient(135deg, #00f0ff, transparent 40%, transparent 60%, #ff2bd6) 1 !important;
  box-shadow: 0 0 20px rgba(0,240,255,0.18), inset 0 0 30px rgba(255,43,214,0.06) !important;
  backdrop-filter: blur(6px);
}
.ds-card::before { border-top-color: #00f0ff !important; border-left-color: #00f0ff !important; width:18px !important; height:18px !important; filter: drop-shadow(0 0 6px #00f0ff); }
.ds-card::after { border-bottom-color: #ff2bd6 !important; border-right-color: #ff2bd6 !important; width:18px !important; height:18px !important; filter: drop-shadow(0 0 6px #ff2bd6); }
.ds-card-title {
  color: #fff !important;
  background: linear-gradient(90deg, #00f0ff, #ff2bd6);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  border-bottom: 1px solid rgba(0,240,255,0.35) !important;
  text-shadow: none !important;
  letter-spacing: 3px !important;
}
.ds-card-title::after { background: linear-gradient(90deg, #ff2bd6, transparent) !important; }
.ds-stat {
  background: rgba(255,43,214,0.06) !important;
  border: 1px solid rgba(0,240,255,0.25) !important;
  box-shadow: inset 0 0 15px rgba(0,240,255,0.06);
}
.ds-stat-label { color: #9de8ff !important; }
.ds-stat-value {
  font-family: 'Orbitron','Courier New',monospace !important;
  letter-spacing: 1px;
}
.ds-today .ds-stat-value { color: #00ffc8 !important; text-shadow: 0 0 18px #00ffc8, 0 0 35px rgba(0,255,200,.5) !important; }
.ds-month .ds-stat-value { color: #00f0ff !important; text-shadow: 0 0 18px #00f0ff, 0 0 35px rgba(0,240,255,.5) !important; }
.ds-inventory .ds-stat-value { color: #ff2bd6 !important; text-shadow: 0 0 18px #ff2bd6, 0 0 35px rgba(255,43,214,.5) !important; }
.ds-bar-fill {
  background: linear-gradient(90deg, #ff2bd6, #00f0ff) !important;
  box-shadow: 0 0 12px #ff2bd6, 0 0 25px rgba(0,240,255,.5) !important;
}
.ds-bar-value { color: #ff8ceb !important; text-shadow: 0 0 8px rgba(255,43,214,.7); }
.ds-order-type.buy { background: rgba(0,255,200,0.15) !important; color: #00ffc8 !important; border:1px solid rgba(0,255,200,.4) !important; box-shadow: 0 0 10px rgba(0,255,200,.3); }
.ds-order-type.sell { background: rgba(0,240,255,0.15) !important; color: #00f0ff !important; border:1px solid rgba(0,240,255,.4) !important; box-shadow: 0 0 10px rgba(0,240,255,.3); }
.ds-order-amount { color: #ffe14d !important; text-shadow: 0 0 10px rgba(255,225,77,.7); }
/* 扫描线改成粉紫 */
.ds-scanline {
  background: linear-gradient(90deg, transparent, #ff2bd6, #00f0ff, transparent) !important;
  height: 3px !important;
  box-shadow: 0 0 15px #ff2bd6;
}

/* 大屏 header 实时铝价卡（赛博风） */
.ds-al-price-bar {
  display: flex;
  gap: 14px;
  flex: 1;
  justify-content: center;
}
.ds-al-item {
  padding: 6px 18px;
  background: rgba(0,240,255,0.06);
  border: 1px solid rgba(0,240,255,0.35);
  border-radius: 10px;
  text-align: center;
  min-width: 160px;
  box-shadow: 0 0 15px rgba(0,240,255,0.15), inset 0 0 12px rgba(255,43,214,0.06);
}
.ds-al-label { font-size: 12px; color: #9de8ff; letter-spacing: 1px; margin-bottom: 3px; }
.ds-al-value {
  font-size: 22px; font-weight: bold; color: #00f0ff;
  font-family: 'Orbitron','Courier New',monospace;
  text-shadow: 0 0 12px #00f0ff, 0 0 25px rgba(0,240,255,.5);
  line-height: 1.1;
}
.ds-al-change { font-size: 12px; margin-top: 2px; letter-spacing: 1px; font-weight: bold; }
.ds-al-change.up { color: #00ffc8; text-shadow: 0 0 8px rgba(0,255,200,.7); }
.ds-al-change.down { color: #ff5e8a; text-shadow: 0 0 8px rgba(255,94,138,.7); }
.ds-al-change.flat { color: #b0bec5; }

/* 仿真大屏：仪表盘 + 周趋势 */
.ds-grid-gauges { grid-template-columns: 1fr 1fr 2fr; }
.ds-gauge-card { display: flex; flex-direction: column; align-items: center; }
.ds-gauge-wrap { position: relative; width: 150px; height: 150px; margin: 8px auto; }
.ds-gauge { width: 100%; height: 100%; transform: rotate(-90deg); }
.ds-gauge-bg { fill: none; stroke: rgba(0,240,255,0.12); stroke-width: 9; }
.ds-gauge-fg {
  fill: none; stroke: #00f0ff; stroke-width: 9; stroke-linecap: round;
  stroke-dasharray: 314; stroke-dashoffset: 314;
  filter: drop-shadow(0 0 8px #00f0ff);
  transition: stroke-dashoffset 1.2s cubic-bezier(.2,.8,.3,1);
}
.ds-gauge-fg.gauge2 { stroke: #ff2bd6; filter: drop-shadow(0 0 8px #ff2bd6); }
.ds-gauge-center {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
  text-align: center;
}
.ds-gauge-num {
  font-size: 26px; font-weight: bold; color: #fff;
  font-family: 'Orbitron','Courier New',monospace;
  text-shadow: 0 0 12px #00f0ff;
}
.ds-gauge-label { font-size: 11px; color: #9de8ff; letter-spacing: 2px; margin-top: 2px; }
.ds-week-chart {
  display: flex; align-items: flex-end; gap: 10px;
  height: 150px; width: 100%; padding: 10px 6px 0;
}
.ds-week-col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; height: 100%; justify-content: flex-end; }
.ds-week-bars { display: flex; gap: 3px; align-items: flex-end; height: 110px; width: 100%; justify-content: center; }
.ds-bar-buy { width: 10px; background: linear-gradient(180deg,#00f0ff,#0088aa); border-radius: 3px 3px 0 0; box-shadow: 0 0 8px rgba(0,240,255,.6); transition: height 1s ease; }
.ds-bar-sell { width: 10px; background: linear-gradient(180deg,#ff2bd6,#aa0066); border-radius: 3px 3px 0 0; box-shadow: 0 0 8px rgba(255,43,214,.6); transition: height 1s ease; }
.ds-week-day { font-size: 11px; color: #9de8ff; letter-spacing: 0; }
.ds-week-legend { display: flex; gap: 14px; justify-content: center; margin-top: 6px; font-size: 11px; color: #9de8ff; }
.ds-week-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 4px; vertical-align: middle; }

/* ===== 仿生增强：状态栏 / sparkline / ticker / 流光边框 ===== */
.ds-status-bar {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  background: rgba(10,20,40,.7); border: 1px solid rgba(0,240,255,.25);
  border-radius: 10px; padding: 8px 16px; margin-bottom: 14px;
  box-shadow: 0 0 18px rgba(0,240,255,.08) inset;
}
.ds-status-item { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #9de8ff; letter-spacing: 1px; }
.ds-status-item b { color: #00f0ff; font-weight: 600; }
.ds-status-dot { width: 8px; height: 8px; border-radius: 50%; }
.ds-status-dot.ok { background: #00e676; box-shadow: 0 0 8px #00e676; animation: dsBlink 2.4s ease-in-out infinite; }
.ds-status-sys { margin-left: auto; display: flex; gap: 12px; font-family: 'Courier New',monospace; color: #7ac8e8; font-size: 11px; }
.ds-spark { width: 100%; height: 26px; margin-top: 4px; display: block; opacity: .85; }
.ds-spark polyline { fill: none; stroke-width: 1.4; }
.ds-ticker {
  display: flex; align-items: center; gap: 10px; margin-top: 14px;
  background: rgba(10,20,40,.75); border: 1px solid rgba(255,43,214,.3);
  border-radius: 10px; padding: 8px 14px; overflow: hidden;
}
.ds-ticker-tag {
  flex: none; background: linear-gradient(135deg,#ff2bd6,#7b1fa2); color: #fff;
  font-size: 11px; padding: 3px 10px; border-radius: 6px; letter-spacing: 2px;
  box-shadow: 0 0 12px rgba(255,43,214,.6);
}
.ds-ticker-track {
  flex: 1; overflow: hidden; white-space: nowrap; font-size: 12px; color: #b9eaff;
  font-family: 'Courier New',monospace;
}
.ds-ticker-track span.ds-tk-item { display: inline-block; margin-right: 36px; }
.ds-ticker-track span.ds-tk-item .up { color: #00e676; }
.ds-ticker-track span.ds-tk-item .dn { color: #ff5252; }
/* 卡片流光边框 */
.ds-card { position: relative; overflow: hidden; }
.ds-card::after {
  content: ''; position: absolute; top: 0; left: -120%; width: 60%; height: 2px;
  background: linear-gradient(90deg, transparent, rgba(0,240,255,.9), transparent);
  animation: dsShine 5s linear infinite; pointer-events: none;
}
.ds-card:nth-child(2)::after { animation-delay: 1.2s; }
.ds-card:nth-child(3)::after { animation-delay: 2.4s; }
@keyframes dsShine { 0% { left: -120%; } 60% { left: 140%; } 100% { left: 140%; } }
/* 数字发光增强 */
.ds-stat-value { text-shadow: 0 0 14px rgba(0,240,255,.55); }

/* ===== 指挥中心布局重做 ===== */
#page-datascreen { padding: 16px 20px; overflow: hidden; }
.ds-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding-bottom: 10px; border-bottom: 1px solid rgba(0,240,255,.18); margin-bottom: 12px; }
.ds-title-lg { font-size: 24px; font-weight: bold; letter-spacing: 4px; color: #fff; text-shadow: 0 0 18px rgba(0,240,255,.8); font-family: 'Orbitron','Microsoft YaHei',sans-serif; }
.ds-sub { font-size: 12px; color: #7ac8e8; letter-spacing: 6px; margin-top: 2px; }
.ds-h-time { display: flex; align-items: center; gap: 8px; }
.ds-h-live { display: flex; align-items: center; gap: 6px; }
.ds-al-price-bar { display: flex; gap: 10px; }
.ds-al-item { background: rgba(10,25,50,.8); border: 1px solid rgba(0,240,255,.25); border-radius: 8px; padding: 6px 10px; min-width: 128px; text-align: center; box-shadow: 0 0 14px rgba(0,240,255,.08) inset; }
.ds-al-label { font-size: 11px; color: #9de8ff; }
.ds-al-value { font-size: 16px; font-weight: bold; color: #fff; font-family: 'Courier New',monospace; text-shadow: 0 0 10px rgba(0,240,255,.5); white-space: nowrap; }
.ds-al-change { font-size: 11px; }
.ds-al-change.up { color: #00e676; } .ds-al-change.down { color: #ff5252; } .ds-al-change.flat { color: #9e9e9e; }
.ds-spark { width: 100%; height: 24px; margin-top: 3px; display: block; }

/* KPI 数字排 */
.ds-kpi-row { display: grid; grid-template-columns: repeat(8, 1fr); gap: 8px; margin-bottom: 12px; }
.ds-kpi { background: linear-gradient(160deg, rgba(13,32,60,.95), rgba(8,18,40,.95)); border: 1px solid rgba(0,240,255,.22); border-radius: 10px; padding: 8px 6px; text-align: center; position: relative; box-shadow: 0 0 12px rgba(0,240,255,.06); }
.ds-kpi::before { content:''; position:absolute; top:0; left:0; right:0; height:2px; background: linear-gradient(90deg, transparent, #00f0ff, transparent); opacity:.8; border-radius: 10px 10px 0 0; }
.ds-kpi-label { font-size: 11px; color: #9de8ff; letter-spacing: 1px; }
.ds-kpi-val { font-size: 20px; font-weight: bold; color: #fff; font-family: 'Courier New',monospace; text-shadow: 0 0 12px rgba(0,240,255,.65); margin: 2px 0; }
.ds-kpi-unit { font-size: 10px; color: #7ac8e8; }

/* 三列主体 */
.ds-body { display: grid; grid-template-columns: 1fr 1.15fr 1fr; gap: 12px; align-items: stretch; }
.ds-col { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.ds-panel { background: linear-gradient(160deg, rgba(13,32,60,.92), rgba(8,18,40,.92)); border: 1px solid rgba(0,240,255,.2); border-radius: 10px; padding: 10px 12px; box-shadow: 0 0 14px rgba(0,240,255,.05); flex: 1; min-height: 0; }
.ds-panel-title { font-size: 13px; color: #00f0ff; letter-spacing: 2px; margin-bottom: 8px; display: flex; align-items: center; gap: 8px; text-shadow: 0 0 8px rgba(0,240,255,.5); }
.ds-tl-dot { width: 6px; height: 6px; background: #00f0ff; border-radius: 50%; box-shadow: 0 0 8px #00f0ff; animation: dsBlink 2s ease-in-out infinite; display: inline-block; }
.ds-empty { color: #5a7f9e; font-size: 12px; text-align: center; padding: 12px 0; }

/* 铝价走势大图 */
.ds-al-trend { height: 150px; position: relative; }
.ds-al-trend svg { width: 100%; height: 100%; }
.ds-al-trend .lgd { position:absolute; top:4px; right:4px; font-size:10px; color:#9de8ff; display:flex; gap:8px; flex-direction:column; }
.ds-al-trend .lgd i { display:inline-block; width:14px; height:2px; margin-right:4px; vertical-align:middle; }

/* 周趋势 */
.ds-week-chart { height: 150px; }
.ds-week-col .ds-week-day { font-size: 10px; }

/* 品类环形图 */
.ds-donut-wrap { display: flex; align-items: center; gap: 10px; }
.ds-donut { width: 170px; height: 110px; flex: none; }
.ds-donut-legend { flex: 1; min-width: 0; font-size: 11px; color: #b9eaff; }
.ds-donut-legend .lg-row { display: flex; justify-content: space-between; padding: 3px 0; border-bottom: 1px dashed rgba(0,240,255,.12); }
.ds-donut-legend .lg-dot { width: 8px; height: 8px; border-radius: 2px; display: inline-block; margin-right: 5px; }

/* 3D 地球中列 */
.ds-col-center { align-items: stretch; }
.ds-globe-wrap { position: relative; flex: 1.4; min-height: 380px; background: radial-gradient(circle at 50% 45%, rgba(0,60,120,.25), rgba(5,10,30,.6) 70%); border: 1px solid rgba(0,240,255,.22); border-radius: 12px; box-shadow: 0 0 30px rgba(0,240,255,.08) inset; overflow: hidden; }
.ds-globe-wrap canvas { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 420px; height: 420px; }
.ds-globe-core { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; pointer-events: none; }
.ds-core-label { font-size: 14px; color: #9de8ff; letter-spacing: 4px; margin-bottom: 6px; }
.ds-core-num { font-size: 46px; font-weight: bold; color: #fff; font-family: 'Orbitron','Courier New',monospace; text-shadow: 0 0 24px rgba(0,240,255,.9); line-height: 1.1; }
.ds-core-unit { font-size: 13px; color: #00f0ff; letter-spacing: 3px; margin-top: 2px; }
.ds-core-sub { font-size: 12px; color: #b9eaff; margin-top: 8px; }
.ds-core-sub b { color: #ffd740; }
.ds-core-warn { font-size: 12px; color: #ff8a80; margin-top: 6px; }
.ds-core-warn b { color: #ff5252; }

/* 设备状态 */
.ds-status-panel { flex: 1; }
.ds-dev-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 10px; }
.ds-dev { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #b9eaff; background: rgba(0,240,255,.05); border: 1px solid rgba(0,240,255,.12); border-radius: 6px; padding: 6px 8px; }
.ds-dev b { margin-left: auto; color: #00e676; font-size: 11px; }

/* 达成率双仪表 */
.ds-gauge-row { display: flex; justify-content: center; gap: 10px; }
.ds-gauge-wrap { position: relative; width: 118px; height: 118px; }
.ds-gauge { width: 100%; height: 100%; transform: rotate(-90deg); }
.ds-gauge-bg { fill:none; stroke: rgba(0,240,255,.12); stroke-width: 9; }
.ds-gauge-fg { fill:none; stroke:#00f0ff; stroke-width:9; stroke-linecap:round; stroke-dasharray:314; stroke-dashoffset:314; filter: drop-shadow(0 0 8px #00f0ff); transition: stroke-dashoffset 1.2s cubic-bezier(.2,.8,.3,1); }
.ds-gauge-fg.gauge2 { stroke:#ff2bd6; filter: drop-shadow(0 0 8px #ff2bd6); }
.ds-gauge-center { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); text-align:center; }
.ds-gauge-num { font-size: 22px; font-weight:bold; color:#fff; font-family:'Courier New',monospace; text-shadow:0 0 12px #00f0ff; }
.ds-gauge-label { font-size: 10px; color:#9de8ff; letter-spacing:1px; margin-top:1px; }

/* 流光边框（旧ds-card样式兼容） */
.ds-panel { position: relative; overflow: hidden; }
.ds-panel::after { content:''; position:absolute; top:0; left:-120%; width:60%; height:2px; background:linear-gradient(90deg,transparent,rgba(0,240,255,.85),transparent); animation:dsShine 6s linear infinite; pointer-events:none; }
.ds-kpi::after { content:''; position:absolute; top:0; left:-120%; width:60%; height:2px; background:linear-gradient(90deg,transparent,rgba(0,240,255,.7),transparent); animation:dsShine 7s linear infinite; pointer-events:none; }
@keyframes dsShine { 0% { left:-120%; } 60% { left:140%; } 100% { left:140%; } }
@keyframes dsScan { 0% { top:-2%; } 100% { top:100%; } }
@keyframes dsBlink { 0%,100% { opacity:1; } 50% { opacity:.25; } }

/* TOP5 横条 */
.ds-bar-list { display:flex; flex-direction:column; gap:7px; }
.ds-bar-row { display:flex; align-items:center; gap:8px; font-size:12px; color:#b9eaff; }
.ds-bar-name { width: 74px; white-space: nowrap; overflow:hidden; text-overflow:ellipsis; }
.ds-bar-track { flex:1; height:10px; background:rgba(0,240,255,.1); border-radius:5px; overflow:hidden; }
.ds-bar-fill { height:100%; background:linear-gradient(90deg,#00f0ff,#0088aa); border-radius:5px; box-shadow:0 0 8px rgba(0,240,255,.5); transition:width 1s ease; }
.ds-bar-amt { width: 62px; text-align:right; font-family:'Courier New',monospace; color:#ffd740; }

/* 最近交易 */
.ds-order-list { display:flex; flex-direction:column; gap:6px; max-height: 250px; overflow-y:auto; }
.ds-order-item { display:flex; align-items:center; gap:8px; font-size:12px; color:#b9eaff; background:rgba(0,240,255,.04); border:1px solid rgba(0,240,255,.1); border-radius:6px; padding:5px 8px; }
.ds-order-item .tg { flex:none; font-size:10px; padding:1px 6px; border-radius:4px; }
.ds-order-item .tg.buy { background:rgba(0,240,255,.18); color:#00f0ff; }
.ds-order-item .tg.sell { background:rgba(255,43,214,.18); color:#ff2bd6; }
.ds-order-item .no { font-family:'Courier New',monospace; color:#fff; flex:none; }
.ds-order-item .amt { margin-left:auto; font-family:'Courier New',monospace; color:#ffd740; }

/* ticker 保留 */
.ds-ticker { display:flex; align-items:center; gap:10px; margin-top:12px; background:rgba(10,20,40,.8); border:1px solid rgba(255,43,214,.3); border-radius:10px; padding:8px 14px; overflow:hidden; }
.ds-ticker-tag { flex:none; background:linear-gradient(135deg,#ff2bd6,#7b1fa2); color:#fff; font-size:11px; padding:3px 10px; border-radius:6px; letter-spacing:2px; box-shadow:0 0 12px rgba(255,43,214,.6); }
.ds-ticker-track { flex:1; overflow:hidden; white-space:nowrap; font-size:12px; color:#b9eaff; font-family:'Courier New',monospace; }
.ds-ticker-track span.ds-tk-item { display:inline-block; margin-right:36px; }
.ds-ticker-track span.ds-tk-item .up { color:#00e676; }

/* 响应式 */
@media (max-width: 1400px) {
  .ds-body { grid-template-columns: 1fr 1fr; }
  .ds-col-center { order: -1; grid-column: 1 / -1; }
  .ds-globe-wrap { min-height: 300px; max-height: 440px; }
}
@media (max-width: 780px) {
  .ds-kpi-row { grid-template-columns: repeat(4, 1fr); }
  .ds-body { grid-template-columns: 1fr; }
  .ds-col-center { order: 0; grid-column: auto; }
  .ds-al-price-bar { width: 100%; justify-content: space-between; }
  .ds-header { flex-wrap: wrap; }
}

/* ===== 顶栏重排（覆盖） ===== */
.ds-header { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: nowrap; padding-bottom: 10px; border-bottom: 1px solid rgba(0,240,255,.18); margin-bottom: 12px; }
.ds-h-left { flex: none; min-width: 150px; }
.ds-title-lg { font-size: 22px; font-weight: bold; letter-spacing: 3px; color: #fff; text-shadow: 0 0 18px rgba(0,240,255,.8); font-family: 'Orbitron','Microsoft YaHei',sans-serif; white-space: nowrap; }
.ds-sub { font-size: 11px; color: #7ac8e8; letter-spacing: 5px; margin-top: 2px; white-space: nowrap; }
.ds-al-price-bar { flex: 1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 0 8px; }
.ds-al-item { background: linear-gradient(160deg, rgba(13,32,60,.9), rgba(8,18,40,.9)); border: 1px solid rgba(0,240,255,.25); border-radius: 8px; padding: 7px 12px; text-align: center; box-shadow: 0 0 14px rgba(0,240,255,.08) inset; position: relative; overflow: hidden; }
.ds-al-item::after { content:''; position:absolute; top:0; left:-120%; width:60%; height:2px; background:linear-gradient(90deg,transparent,rgba(0,240,255,.8),transparent); animation:dsShine 6s linear infinite; pointer-events:none; }
.ds-al-label { font-size: 11px; color: #9de8ff; letter-spacing: 1px; }
.ds-al-value { font-size: 19px; font-weight: bold; color: #fff; font-family: 'Courier New',monospace; text-shadow: 0 0 10px rgba(0,240,255,.5); line-height: 1.3; }
.ds-al-change { font-size: 11px; }
.ds-al-change.up { color: #00e676; } .ds-al-change.down { color: #ff5252; } .ds-al-change.flat { color: #9e9e9e; }
.ds-spark { width: 100%; height: 22px; margin-top: 3px; display: block; }
.ds-h-right { flex: none; display: flex; align-items: center; gap: 14px; }
.ds-h-time { display: flex; align-items: center; gap: 6px; }
.ds-time { font-size: 22px; font-weight: bold; font-family: 'Orbitron','Courier New',monospace; color: #00f0ff; text-shadow: 0 0 14px rgba(0,240,255,.7); letter-spacing: 2px; }
.ds-h-live { display: flex; align-items: center; gap: 6px; }

/* ===== Logo 接入适配 ===== */
.login-logo { border-radius: 50%; object-fit: cover; box-shadow: 0 8px 18px rgba(90,167,255,.45); }
.app-title { display: flex; align-items: center; gap: 8px; }
.app-title::before, .app-title::after { content: "" !important; }
.topbar-logo { width: 34px; height: 34px; border-radius: 50%; box-shadow: 0 2px 8px rgba(47,111,216,.3); }
.ds-h-left { display: flex; align-items: center; gap: 10px; }
.ds-h-logo { width: 46px; height: 46px; border-radius: 50%; box-shadow: 0 0 16px rgba(0,240,255,.45); border: 1px solid rgba(255,215,64,.4); }
@media (max-width: 900px) {
  .topbar-logo { width: 28px; height: 28px; }
  .ds-h-logo { width: 34px; height: 34px; }
}

/* ===== 打印单徽章 Logo ===== */

/* 打印徽章：尺寸硬约束（防止打印时按原图大尺寸渲染） */


/* 数据大屏全屏按钮 */
.ds-full-btn { background: rgba(0,240,255,.08); border: 1px solid rgba(0,240,255,.4); color: #00f0ff; font-size: 12px; letter-spacing: 1px; padding: 5px 12px; border-radius: 6px; cursor: pointer; margin-left: 8px; box-shadow: 0 0 10px rgba(0,240,255,.25); transition: all .2s; }
.ds-full-btn:hover { background: rgba(0,240,255,.25); box-shadow: 0 0 16px rgba(0,240,255,.5); }


/* 伪全屏回退：原生全屏不可用时铺满视口 */
body.ds-fs-fallback #page-datascreen { position: fixed !important; top: 0 !important; left: 0 !important; width: 100vw !important; height: 100vh !important; z-index: 99999 !important; margin: 0 !important; border-radius: 0 !important; }


/* 全屏激活：隐藏导航与顶栏，大屏独占 */
body.ds-fs-active .sidebar { display: none !important; }
body.ds-fs-active .topbar { display: none !important; }
body.ds-fs-active .main-area { margin: 0 !important; padding: 0 !important; height: 100vh !important; }
body.ds-fs-active #page-datascreen { position: fixed !important; top: 0 !important; left: 0 !important; width: 100vw !important; height: 100vh !important; z-index: 99999 !important; margin: 0 !important; border-radius: 0 !important; }


/* ===== 大屏撑满全高布局（消除底部/面板留白）===== */
#page-datascreen.active { display: flex; flex-direction: column; height: 100%; box-sizing: border-box; overflow-y: auto; overflow-x: hidden; padding: 12px 16px; }
#page-datascreen > .ds-header { flex: none; margin-bottom: 10px; }
#page-datascreen > .ds-kpi-row { flex: none; margin-bottom: 10px; }
#page-datascreen > .ds-body { flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; }
#page-datascreen > .ds-ticker { flex: none; margin-top: 10px; }
.ds-col { gap: 10px; }
.ds-panel { display: flex; flex-direction: column; overflow: hidden; }
.ds-panel-title { flex: none; }
/* 图表弹性撑满面板剩余空间 */
.ds-al-trend { flex: 1; height: auto; min-height: 90px; }
.ds-week-chart { flex: 1; height: auto; min-height: 90px; }
.ds-donut-wrap { flex: 1; align-items: center; }
/* 中列地球弹性 + 数字区 */
.ds-globe-wrap { min-height: 0; flex: 1.35; }
.ds-globe-wrap canvas { width: min(72%, 400px); height: auto; }
.ds-status-panel { flex: 1; }
.ds-dev-grid { flex: 1; align-content: center; }
/* 右列列表撑满 */
.ds-bar-list { flex: 1; display: flex; flex-direction: column; justify-content: center; }
.ds-order-list { flex: 1; max-height: none; justify-content: center; }
.ds-gauge-row { flex: 1; align-items: center; }