/* 怀来世济医院 - 扫码签字留存系统 · 响应式设计系统 v5
   设计语言：专业医疗 Web 应用（蓝 #2563eb / 患方青 #0d9488 / 白卡片 / 12px 圆角 / 柔和阴影）
   基于 DESIGN.md，兼容原有 app.js 全部组件类名。 */

/* ===== Design Tokens ===== */
:root {
  --primary: #2563eb;
  --primary-dark: #1d4ed8;
  --primary-700: #1d4ed8;
  --primary-light: #eff6ff;
  --patient: #0d9488;
  --patient-light: #f0fdfa;
  --patient-dark: #0f766e;
  --success: #16a34a;
  --success-light: #e6f4ea;
  --warning: #f59e0b;
  --warning-light: #fff8e1;
  --danger: #dc2626;
  --danger-light: #fef2f2;
  --bg: #f4f6fa;
  --card-bg: #ffffff;
  --text: #1f2937;
  --text-secondary: #6b7280;
  --border: #e5e7eb;
  --border-strong: #d1d5db;
  --shadow: 0 1px 2px rgba(15,23,42,.08), 0 1px 3px rgba(15,23,42,.06);
  --shadow-lg: 0 4px 12px rgba(15,23,42,.10), 0 2px 4px rgba(15,23,42,.06);
  --shadow-overlay: 0 12px 32px rgba(15,23,42,.22);
  --radius: 12px;
  --radius-sm: 10px;
  --radius-lg: 16px;
  --radius-md: 12px;
  --transition-speed: 0.25s;
  --tap: 48px;
  --nav-h: 60px;
}

/* ===== Dark Mode ===== */
body.dark {
  --primary: #4d94ff;
  --primary-dark: #3a7de0;
  --primary-light: #16233f;
  --patient: #2dd4bf;
  --patient-light: #0f2a27;
  --patient-dark: #14b8a6;
  --success: #4caf50;
  --success-light: #16291c;
  --warning: #ffb300;
  --warning-light: #2d2613;
  --danger: #f44336;
  --danger-light: #2d1b1b;
  --bg: #0f172a;
  --card-bg: #1e293b;
  --text: #e2e8f0;
  --text-secondary: #94a3b8;
  --border: #334155;
  --border-strong: #475569;
  --shadow: 0 1px 3px rgba(0,0,0,0.3), 0 1px 2px rgba(0,0,0,0.2);
  --shadow-lg: 0 10px 30px rgba(0,0,0,0.4), 0 3px 10px rgba(0,0,0,0.3);
  --shadow-overlay: 0 12px 32px rgba(0,0,0,0.5);
}
body.dark .header { background: rgba(15,23,42,.92); border-color: var(--border); }
body.dark .signature-pad-wrapper { background:#0f172a; border-color:var(--border); }
body.dark .signature-pad-wrapper canvas { filter:invert(0); }
body.dark .signature-placeholder { color:#64748b; }
body.dark .doc-check-item:hover { border-color:var(--primary); background:rgba(77,148,255,0.08); }
body.dark .doc-check-item.selected { background:var(--primary-light); }
body.dark .preset-btn { background:var(--card-bg); border-color:var(--border); }
body.dark .preset-btn:hover { background:var(--primary-light); }
body.dark .consent-options-inline { background:#1a2332; border-color:var(--border); }
body.dark .read-confirm-box { background:#1a2332; border-color:#856404; }
body.dark .read-confirm-box.read-confirm-warn { background:#2d1b1b; }
body.dark .handover-btn-area { background:#2d2310; border-color:#856404; }
body.dark .custom-text-box { background:#2d2310; border-color:#5c4a14; }
body.dark .patient-sig-highlight.highlight-pulse { background:#2d2310; }
body.dark input,body.dark select,body.dark textarea { background:var(--card-bg); color:var(--text); border-color:var(--border); }
body.dark input:focus,body.dark select:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(77,148,255,0.15); }
body.dark .doc-content h3 { color:var(--primary); border-color:var(--border); }
body.dark .doc-content .divider-text { color:var(--primary); border-color:var(--border); }
body.dark .fs-sign-overlay { background:var(--bg); }
body.dark .fs-sign-canvas-wrap { background:#fff; }
body.dark .modal { background:var(--card-bg); }
body.dark .modal-close { background:var(--bg); color:var(--text); }
body.dark .header-btn { color:var(--text-secondary); }
body.dark .header-btn:hover { background:var(--primary-light); color:var(--primary); }
body.dark .header-btn.active { background:var(--primary); color:#fff; }
body.dark .back-btn { background:var(--card-bg); border-color:var(--border); }
body.dark .back-btn:hover { background:var(--bg); }
body.dark .record-btn { background:var(--card-bg); border-color:var(--border); color:var(--text); }
body.dark .record-btn:hover { background:var(--bg); }
body.dark .record-btn.download { color:var(--primary); border-color:var(--primary); }
body.dark .record-btn.view-pdf { color:var(--success); border-color:var(--success); }
body.dark .sig-clear-btn { background:var(--bg); border-color:var(--border); color:var(--text-secondary); }
body.dark .sig-zoom-btn { background:var(--primary-light); color:var(--primary); }
body.dark .btn-secondary { background:var(--bg); color:var(--text); border-color:var(--border); }
body.dark .btn-secondary:hover { background:#2d3748; }
body.dark .records-search-bar input,
body.dark .records-search-bar select { background:var(--card-bg); color:var(--text); border-color:var(--border); }
body.dark .doc-expand-btn { background:var(--primary-light); color:var(--primary); }
body.dark .doc-expand-btn:hover { background:var(--primary); color:white; }
body.dark .doc-check-category { color:var(--primary); background:var(--primary-light); }
body.dark .record-doc-tag { background:var(--primary-light); color:var(--primary); }
body.dark .ward-locked-tag { background:#1a3a2a; color:#4caf50; }
@media print { body.dark { --bg:#fff;--card-bg:#fff;--text:#1f2937;--text-secondary:#6b7280;--border:#e5e7eb; } }
* { margin:0;padding:0;box-sizing:border-box; }
body { font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;touch-action:manipulation;overscroll-behavior-y:contain; }

/* ===== Header (浅色 sticky 顶栏) ===== */
.header { background:rgba(244,246,250,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--text);padding:12px 24px;padding-top:calc(12px + env(safe-area-inset-top, 0px));box-shadow:0 1px 2px rgba(15,23,42,.06);position:sticky;top:0;z-index:100;border-bottom:1px solid var(--border); }
.header-content { max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px; }
.header-logo { display:flex;align-items:center;gap:12px; }
.header-logo .logo-icon { width:40px;height:40px;background:var(--primary);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0;box-shadow:0 2px 6px rgba(37,99,235,.3); }
.header-title { font-size:18px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.header-subtitle { font-size:12px;color:var(--text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.header-actions { display:flex;gap:6px;flex-wrap:wrap; }
.header-logo { flex-shrink:0;min-width:0; }
.header-logo > div:last-child { min-width:0;overflow:hidden; }
.header-btn { background:transparent;border:1px solid transparent;color:var(--text-secondary);padding:8px 14px;border-radius:9px;cursor:pointer;font-size:14px;font-weight:600;transition:all 0.2s;-webkit-tap-highlight-color:transparent;user-select:none; }
.header-btn:hover { background:var(--primary-light);color:var(--primary); }
.header-btn:active { transform:scale(0.95);background:var(--primary-light); }
.header-btn.active { background:var(--primary);color:white;box-shadow:0 2px 6px rgba(37,99,235,.3); }

/* ===== 应用容器 / 栅格 ===== */
.shell { max-width:1180px;margin:0 auto;padding:0 16px; }
@media(min-width:1024px){ .shell { padding:0 24px; } }
.container { max-width:1200px;margin:0 auto;padding:20px 16px 96px; }
@media(min-width:1024px){ .container { padding:24px 24px 96px; } }

/* 签署页响应式双栏栅格 */
.grid { display:grid;grid-template-columns:1fr;gap:16px;padding-top:16px; }
@media(min-width:1024px){ .grid { grid-template-columns:minmax(0,400px) minmax(0,1fr);gap:24px;align-items:start;padding-top:24px; } }
.col-left { display:flex;flex-direction:column;gap:16px; }
@media(min-width:1024px){ .col-left { position:sticky;top:82px; } }
.col-right { display:flex;flex-direction:column;gap:16px;min-width:0; }

/* ===== 卡片（统一卡片视觉） ===== */
.card { background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow); }
@media(min-width:1024px){ .card { padding:20px; } }
.card-title { display:flex;align-items:center;gap:8px;font-size:15px;font-weight:700;margin:0 0 14px;color:var(--text); }
.card-title .ic { font-size:17px; }

/* Page Title/Desc */
.page-title { font-size:22px;font-weight:800;margin-bottom:6px;letter-spacing:-.01em; }
.page-desc { color:var(--text-secondary);font-size:14px;margin-bottom:18px;line-height:1.6; }

/* ===== Ward QR Summary ===== */
.wardqr-bar { display:flex;gap:10px;margin-bottom:20px;flex-wrap:wrap; }
.wardqr-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px; }
.wardqr-card { background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);padding:16px;text-align:center;box-shadow:var(--shadow);transition:box-shadow .2s; }
.wardqr-card:hover { box-shadow:var(--shadow-lg); }
.wardqr-title { font-size:16px;font-weight:700;margin-bottom:12px; }
.wardqr-box { display:inline-block;padding:8px;background:#fff;border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:10px; }
.wardqr-url { font-size:11px;color:var(--text-secondary);margin-bottom:12px;word-break:break-all;line-height:1.5; }
@media print {
  .header, .wardqr-bar, .page-desc { display:none !important; }
  .wardqr-card { box-shadow:none;border:1px solid #ddd;break-inside:avoid; }
}

/* ===== Preset Buttons ===== */
.presets-area { display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap; }
.preset-btn { display:flex;align-items:center;gap:6px;padding:10px 16px;border-radius:var(--radius-sm);border:2px solid var(--primary-light);background:white;cursor:pointer;font-size:14px;font-weight:600;color:var(--text);transition:all 0.2s; }
.preset-btn:hover { border-color:var(--primary);background:var(--primary-light); }
.preset-icon { font-size:20px; }
.preset-label { font-weight:600; }

/* ===== Doc Check List (首页选告知书) ===== */
.doc-grid { display:flex;flex-direction:column;gap:10px; }
.doc-check-item { background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);padding:14px 18px;box-shadow:var(--shadow);display:flex;align-items:center;gap:14px;cursor:pointer;transition:all 0.2s;border-left:4px solid transparent; }
.doc-check-item:hover { border-color:var(--primary);box-shadow:var(--shadow-lg); }
.doc-check-item.selected { border-left-color:var(--primary);background:var(--primary-light); }
.doc-check-box { flex-shrink:0; }
.doc-check-box input[type="checkbox"] { width:22px;height:22px;cursor:pointer;accent-color:var(--primary); }
.doc-check-content { display:flex;align-items:center;gap:12px;flex:1; }
.doc-check-icon { width:40px;height:40px;border-radius:10px;background:var(--primary-light);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0; }
.doc-check-info { flex:1; }
.doc-check-title { font-size:16px;font-weight:600; }
.doc-check-meta { font-size:13px;color:var(--text-secondary);display:flex;gap:12px;margin-top:4px; }
.doc-check-category { color:var(--primary);background:var(--primary-light);padding:1px 6px;border-radius:4px;font-size:12px; }
.doc-check-arrow { color:var(--text-secondary);font-size:18px;flex-shrink:0; }

/* ===== Batch Action Bar ===== */
.batch-action-bar { background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);padding:14px 20px;margin-top:16px;box-shadow:var(--shadow);display:flex;align-items:center;justify-content:space-between;gap:16px;position:sticky;bottom:16px;z-index:50; }
.batch-select-info { font-size:14px;color:var(--text-secondary);display:flex;align-items:center;gap:12px; }
.batch-select-info b { color:var(--primary);font-size:18px; }
.btn-link { background:none;border:none;color:var(--primary);cursor:pointer;font-size:14px;padding:4px 8px;text-decoration:underline; }

/* ===== Selected Docs Bar ===== */
.selected-docs-bar { background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);padding:14px 18px;margin-bottom:16px;box-shadow:var(--shadow); }
.selected-docs-label { font-size:14px;color:var(--text-secondary);margin-bottom:10px; }
.selected-docs-tags { display:flex;flex-wrap:wrap;gap:8px; }
.doc-tag { background:var(--primary-light);color:var(--primary-dark);padding:4px 12px;border-radius:6px;font-size:13px;font-weight:600; }

.doc-number-badge { font-size:12px;color:var(--text-secondary);margin-bottom:8px;text-align:right; }

/* Consent Inline */
.consent-options-inline { padding:12px;background:var(--primary-light);border-radius:var(--radius-sm);margin-top:12px;border:1px solid var(--border); }
.consent-options { display:flex;gap:24px;margin-top:8px; }
.consent-option { display:flex;align-items:center;gap:6px;cursor:pointer; }
.consent-option input { width:18px;height:18px;accent-color:var(--primary); }
.consent-option label { cursor:pointer;font-weight:500; }

/* ===== QR Modal ===== */
.modal-overlay { position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(15,23,42,.5);display:none;align-items:center;justify-content:center;z-index:1000;backdrop-filter:blur(2px); }
.modal-overlay.active { display:flex; }
.modal { background:white;border-radius:var(--radius-lg);padding:28px 32px;max-width:420px;width:90%;text-align:center;box-shadow:var(--shadow-overlay); }
.modal-title { font-size:20px;font-weight:800;margin-bottom:14px; }
.modal-qr { display:flex;justify-content:center;margin:16px 0; }
.modal-qr canvas { border-radius:8px; }
.modal-desc { color:var(--text-secondary);font-size:14px;margin-bottom:16px; }
.modal-close { background:var(--bg);border:none;padding:10px 24px;border-radius:var(--radius-sm);cursor:pointer;font-size:14px;color:var(--text); }

/* ===== Sign Page ===== */
.sign-header { display:flex;align-items:center;gap:12px;margin-bottom:18px; }
.back-btn { background:var(--card-bg);border:1px solid var(--border);width:40px;height:40px;border-radius:10px;cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;transition:all 0.2s;color:var(--text); }
.back-btn:hover { background:var(--bg);border-color:var(--primary);color:var(--primary); }
.sign-doc-title { font-size:20px;font-weight:800;flex:1; }
.sign-nurse-badge { margin-left:auto;font-size:13px;color:var(--text-secondary);display:flex;align-items:center;gap:6px;background:var(--primary-light);padding:4px 10px;border-radius:20px; }
.sign-nurse-badge b { color:var(--primary-dark); }

/* Patient Info */
.patient-info { background:var(--card-bg);border-radius:var(--radius);padding:18px 20px;margin-bottom:16px;box-shadow:var(--shadow);border:1px solid var(--border); }
.patient-info h3 { font-size:15px;color:var(--text-secondary);margin-bottom:14px;display:flex;align-items:center;gap:6px; }
.patient-info h3::before { content:'';width:3px;height:16px;background:var(--primary);border-radius:2px; }
.info-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px; }
.info-item { display:flex;flex-direction:column;gap:5px;position:relative; }
.info-item label { font-size:13px;color:var(--text-secondary);font-weight:500;padding-left:2px; }
.info-item input, .info-item select { border:1px solid var(--border);border-radius:var(--radius-sm);padding:11px 12px;font-size:15px;background:white;outline:none;width:100%;transition:border-color .2s; }
.info-item input:focus, .info-item select:focus { border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light); }

/* 表单网格（sign-portal 风格） */
.form-grid { display:grid;grid-template-columns:1fr 1fr;gap:12px; }
.field { display:flex;flex-direction:column;gap:5px;min-width:0;position:relative; }
.field.full { grid-column:1/-1; }
.field label { font-size:13px;color:var(--text-secondary);padding-left:2px;font-weight:500; }
.field label .req { color:var(--danger);margin-left:2px; }
.field input, .field select { height:48px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 12px;font-size:16px;background:#fff;outline:none;width:100%;-webkit-appearance:none;appearance:none;transition:border-color .2s; }
.field input:focus, .field select:focus { border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light); }
@media(min-width:1024px){ .field input, .field select { height:44px; } }

/* Doc Content */
.doc-content { background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);padding:20px;margin-bottom:16px;box-shadow:var(--shadow); }
.doc-content h2 { text-align:center;font-size:20px;margin-bottom:8px;color:var(--text); }
.doc-content h3 { font-size:16px;margin-top:18px;margin-bottom:10px;color:var(--primary-dark);padding-bottom:6px;border-bottom:1px solid var(--border); }
.doc-content h4 { font-size:14px;margin-top:14px;margin-bottom:8px;color:var(--text);font-weight:600; }
.doc-content p { margin-bottom:10px;font-size:14px;text-align:justify;color:var(--text); }
.doc-content ul,.doc-content ol { margin-left:20px;margin-bottom:10px; }
.doc-content li { font-size:14px;margin-bottom:6px;text-align:justify; }
.doc-content .checkbox-item { display:flex;align-items:flex-start;gap:8px;margin-bottom:6px;font-size:14px; }
.doc-content .checkbox-item input[type="checkbox"] { margin-top:4px;flex-shrink:0; }
.doc-content .divider-text { text-align:center;font-size:16px;font-weight:700;color:var(--primary-dark);margin:20px 0 12px;padding:8px;border-top:2px dashed var(--border);border-bottom:2px dashed var(--border); }
.doc-expand-btn { background:var(--primary-light);color:var(--primary-dark);border:1px solid var(--primary-light);padding:6px 14px;border-radius:6px;cursor:pointer;font-size:13px;margin:0 0 12px;font-weight:600; }
.doc-expand-btn:hover { background:var(--primary);color:white; }

/* ===== 签名区（sign-portal 视觉，保留原 class 名） ===== */
.signature-section { background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);padding:18px 20px;margin-bottom:16px;box-shadow:var(--shadow); }
.signature-section h3 { font-size:15px;color:var(--text-secondary);margin-bottom:14px;display:flex;align-items:center;gap:6px; }
.signature-section h3::before { content:'';width:3px;height:16px;background:var(--success);border-radius:2px; }
.signature-block { margin-bottom:18px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px;background:#fbfcfe; }
.signature-block.patient-sig-highlight { background:linear-gradient(180deg,var(--patient-light),#fff);border-color:var(--patient-light); }
.signature-block-label { font-weight:700;font-size:15px;margin-bottom:10px;display:flex;align-items:center;justify-content:space-between; }
.signature-role-tag { font-size:11px;padding:2px 10px;border-radius:999px;font-weight:700;color:#fff; }
.signature-role-tag.nurse { background:var(--primary); }
.signature-role-tag.patient { background:var(--patient); }
.signature-role-tag.patient-relation { background:#0891b2; }
.signature-role-tag.patient-agree { background:#7c3aed; }
.signature-pad-wrapper { position:relative;border:1.5px dashed var(--border-strong);border-radius:var(--radius-sm);overflow:hidden;background:#fafbfc;margin-bottom:10px;touch-action:none; }
.signature-pad-wrapper.canvas-height-guide canvas { height:220px; }
@media (max-width: 768px) {
  .signature-pad-wrapper.canvas-height-guide canvas { height:260px; }
}
.signature-pad-wrapper canvas { display:block;width:100%;height:150px;cursor:crosshair;touch-action:none;overscroll-behavior:contain;-webkit-user-select:none;user-select:none; }
.signature-placeholder { position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#9aa6b6;font-size:14px;pointer-events:none; }
.signature-actions { display:flex;gap:10px; }
.sig-clear-btn { flex:1;height:44px;border:1px solid var(--border);background:#fff;border-radius:var(--radius-sm);cursor:pointer;font-size:14px;font-weight:600;color:#334155;display:flex;align-items:center;justify-content:center;gap:5px;transition:background .15s; }
.sig-clear-btn:active { background:#f1f5f9; }
.sig-zoom-btn { flex:1;height:44px;background:var(--primary-light);border:1px solid var(--primary-light);color:var(--primary-dark);border-radius:var(--radius-sm);cursor:pointer;font-size:14px;font-weight:600;transition:background .15s; }
.sig-zoom-btn:hover { background:var(--primary);color:white; }
.signature-extra-fields { display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;margin-top:12px; }
.signature-extra-fields .info-item label { font-size:12.5px; }
.signature-extra-fields .info-item input, .signature-extra-fields .info-item select { height:44px;font-size:15px; }
.custom-text-box { margin-top:12px;padding:12px;background:var(--warning-light);border-radius:var(--radius-sm);font-size:13px;line-height:1.8;border:1px solid #ffe58f; }

/* 交接 */
.handover-btn-area { margin:18px 0;padding:16px;background:linear-gradient(135deg,var(--warning-light),#ffe0b2);border-radius:var(--radius);border:2px solid var(--warning);text-align:center; }
.handover-btn { padding:14px 32px;font-size:16px;font-weight:700;width:100%;border:none;border-radius:var(--radius-sm);background:var(--warning);color:#5a3b00;cursor:pointer; }
.handover-btn:active { transform:scale(.99); }
.handover-hint { font-size:13px;color:#6b7280;margin-top:8px; }
.patient-sig-highlight.highlight-pulse { animation: pulseHighlight 2s ease; border-color: var(--warning); background: var(--warning-light); }
@keyframes pulseHighlight { 0%{box-shadow:0 0 0 0 rgba(245,158,11,.5);} 50%{box-shadow:0 0 20px 10px rgba(245,158,11,.25);} 100%{box-shadow:0 0 0 0 rgba(245,158,11,0);} }
.signature-block.locked { background:#f3f4f6; }
.signature-block.locked input, .signature-block.locked select { pointer-events:none;opacity:.6; }

/* ===== 阅读确认框 ===== */
.read-confirm-box { background:var(--primary-light);border:2px solid #bfdbfe;border-radius:var(--radius);padding:14px 18px;margin-bottom:16px;transition:all 0.25s; }
.read-confirm-box.read-confirm-warn { border-color:var(--danger);background:var(--danger-light);animation:pulseHighlight 1s ease; }
.read-confirm-label { display:flex;align-items:center;gap:10px;cursor:pointer;font-size:15px;font-weight:600;color:var(--text); }
.read-confirm-label input[type="checkbox"] { width:22px;height:22px;flex-shrink:0;cursor:pointer;accent-color:var(--success); }
.read-confirm-hint { font-size:12.5px;color:var(--text-tertiary);margin-top:8px;line-height:1.5; }

/* ===== 步骤进度条（sign-portal，签署页顶部） ===== */
.steps-top { display:flex;align-items:center;gap:10px;margin-bottom:16px;flex-wrap:wrap; }
.steps { display:flex;gap:6px;flex-wrap:wrap; }
.step { display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--text-secondary);padding:5px 12px;border-radius:999px;background:var(--card-bg);border:1px solid var(--border);font-weight:600;transition:all .25s; }
.step .dot { width:18px;height:18px;border-radius:50%;background:var(--border-strong);color:#fff;display:grid;place-items:center;font-size:11px;flex:0 0 auto;transition:all .25s; }
.step.done { color:var(--primary);border-color:var(--primary);background:var(--primary-light); }
.step.done .dot { background:var(--primary); }
.pbar { flex:1;height:6px;border-radius:999px;background:var(--border);overflow:hidden;min-width:120px; }
.pbar > i { display:block;height:100%;width:0;background:var(--primary);transition:width .3s; }

/* ===== 底部固定操作栏（签署页 sign-portal 风格） ===== */
.actionbar { position:sticky;bottom:0;z-index:60;background:var(--card-bg);border-top:1px solid var(--border);margin-top:20px;box-shadow:0 -4px 12px rgba(15,23,42,.06); }
.actionbar .inner { max-width:1180px;margin:0 auto;padding:12px 16px calc(env(safe-area-inset-bottom,0px) + 12px);display:flex;gap:12px;align-items:center; }
.ab-progress { display:none;flex-direction:column;gap:4px;font-size:12px;color:var(--text-secondary);min-width:140px; }
@media(min-width:768px){ .ab-progress { display:flex; } }
.ab-progress .bar { width:100%;height:6px;border-radius:999px;background:var(--border);overflow:hidden; }
.ab-progress .bar > i { display:block;height:100%;width:0;background:var(--primary);transition:width .3s; }
.ab-actions { display:flex;gap:10px;flex:1; }
.submit { flex:1;height:var(--tap);border:none;border-radius:var(--radius-sm);background:var(--primary);color:#fff;font-size:17px;font-weight:700;cursor:pointer;box-shadow:var(--shadow-lg);transition:background .15s; }
.submit:active { background:var(--primary-dark); }
.submit:disabled { background:#9db8f0;box-shadow:none;cursor:not-allowed; }
.ab-secondary { height:var(--tap);padding:0 20px;border:1px solid var(--border);background:#fff;border-radius:var(--radius-sm);font-size:15px;font-weight:600;color:var(--text);cursor:pointer;white-space:nowrap; }
.ab-secondary:active { background:var(--bg); }

/* Buttons */
.action-bar { display:flex;gap:12px;justify-content:center;padding:16px 0;flex-wrap:wrap; }
.btn { padding:12px 28px;border-radius:var(--radius-sm);border:none;font-size:15px;font-weight:700;cursor:pointer;transition:all 0.2s;-webkit-tap-highlight-color:transparent;user-select:none; }
.btn:active { transform:scale(0.97); }
.btn-primary { background:var(--primary);color:white; }
.btn-primary:hover { background:var(--primary-dark); }
.btn-primary:active { background:var(--primary-dark); }
.btn-success { background:var(--success);color:white; }
.btn-success:hover { background:#138a3e; }
.btn-success:active { background:#138a3e; }
.btn-secondary { background:var(--bg);color:var(--text);border:1px solid var(--border); }
.btn-secondary:hover { background:#f0f0f0; }
.btn-warning { background:var(--warning);color:#5a3b00; }
.btn-warning:hover { background:#e89500; }
.btn-warning:active { background:#e89500; }
.btn:disabled { opacity:0.5;cursor:not-allowed;transform:none; }
.btn-sm { padding:8px 16px;font-size:13px; }
.btn-danger { background:var(--danger);color:white;border:none;border-radius:var(--radius-sm);padding:6px 14px;font-size:13px;cursor:pointer;font-weight:600; }
.btn-danger:hover { opacity:0.9; }

/* Records */
.records-list { display:flex;flex-direction:column;gap:12px; }
.record-item { background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);padding:16px 20px;box-shadow:var(--shadow);display:flex;align-items:center;justify-content:space-between;gap:16px;transition:box-shadow .2s; }
.record-item:hover { box-shadow:var(--shadow-lg); }
.record-info { flex:1;min-width:0;width:100%;max-width:100%; }
.record-title { font-weight:700;font-size:15px;margin-bottom:4px;word-break:normal;overflow-wrap:anywhere; }
.record-docs-tags { display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px; }
.record-doc-tag { background:var(--primary-light);color:var(--primary-dark);padding:2px 8px;border-radius:4px;font-size:12px;font-weight:600;word-break:normal;overflow-wrap:anywhere; }
.record-meta { font-size:13px;color:var(--text-secondary);display:flex;gap:12px;flex-wrap:wrap; }
.record-status { font-size:12px;padding:2px 8px;border-radius:4px;font-weight:600;white-space:nowrap;flex-shrink:0; }
.record-status.signed { background:var(--success-light);color:#137333; }
.record-actions { display:flex;gap:8px;flex-wrap:wrap; }
.record-btn { padding:8px 14px;border-radius:8px;border:1px solid var(--border);background:var(--card-bg);cursor:pointer;font-size:13px;color:var(--text);font-weight:600;transition:background .15s;white-space:nowrap; }
.record-btn:hover { background:var(--bg); }
.record-btn.download { color:var(--primary);border-color:var(--primary); }
.record-btn.delete { color:var(--danger);border-color:var(--danger); }
.empty-state { text-align:center;padding:60px 20px;color:var(--text-secondary); }
.empty-state .icon { font-size:48px;margin-bottom:12px; }

/* Toast */
.toast { position:fixed;left:50%;top:72px;transform:translateX(-50%);background:rgba(17,24,39,.92);color:white;padding:11px 20px;border-radius:10px;font-size:14px;z-index:2000;transition:.25s;box-shadow:var(--shadow-overlay);pointer-events:none;max-width:86vw;text-align:center;opacity:0; }
.toast.show { opacity:1; }
.toast.success { background:var(--success); }
.toast.error { background:var(--danger); }

/* ===== Responsive ===== */
@media (max-width:768px) {
  .container { padding:16px 16px 110px; }
  .doc-content { padding:18px; }
  .info-grid { grid-template-columns:1fr 1fr; }
  .form-grid { grid-template-columns:1fr; }
  .signature-extra-fields { grid-template-columns:1fr 1fr; }
  .action-bar { position:fixed;bottom:0;left:0;right:0;background:white;padding:12px 16px calc(12px + env(safe-area-inset-bottom, 0px));border-top:1px solid var(--border);z-index:50;box-shadow:0 -2px 8px rgba(0,0,0,0.06); }
  .action-bar .btn { flex:1; }
  .batch-action-bar { position:fixed;bottom:0;left:0;right:0;border-radius:0;margin-top:0;padding:12px 16px calc(12px + env(safe-area-inset-bottom, 0px));box-shadow:0 -2px 8px rgba(0,0,0,0.06);z-index:60; }
  .signature-pad-wrapper canvas { height:200px; }
  .signature-block { padding:12px; }
  .actionbar { margin-top:0; }
  #page-home { padding-bottom:110px; }
  #page-sign { padding-bottom:20px; }
  .header-content { flex-wrap:wrap; }
  .header-logo { flex-shrink:0;margin-right:auto; }
  .header-actions { gap:4px;width:100%;justify-content:flex-start;padding-top:4px; }
  .header-btn { padding:6px 10px;font-size:13px; }
  .user-chip { margin-left:auto; }
  .scroll-to-sign-btn { bottom:80px; }
  .presets-area { flex-wrap:wrap; }
  .preset-btn { padding:8px 12px;font-size:13px; }
  .handover-btn { padding:12px 24px;font-size:15px; }
  /* 移动端记录卡片：改为上下堆叠，防止被右侧按钮挤成竖排 */
  .record-item { flex-direction:column;align-items:flex-start;gap:10px;padding:14px 16px;position:relative; }
  .record-item > div:first-child { font-size:24px !important;position:absolute;top:10px;right:12px;opacity:0.12;pointer-events:none; }
  .record-info { width:100%;max-width:100%;padding-right:28px;box-sizing:border-box; }
  .record-title { font-size:16px; }
  .record-actions { width:100%;justify-content:flex-start; }
  .record-actions .record-btn { flex:1 1 auto;min-width:68px;text-align:center; }
}
.scroll-to-sign-btn { display:inline-flex;position:fixed;bottom:24px;right:16px;background:var(--primary);color:white;padding:10px 16px;border-radius:24px;font-size:14px;z-index:40;box-shadow:0 4px 12px rgba(37,99,235,.3);cursor:pointer;animation:pulse 2s infinite;bottom:calc(24px + env(safe-area-inset-bottom, 0px)); }
@keyframes pulse { 0%,100%{opacity:1;} 50%{opacity:0.7;} }

/* ===== 病区默认标签 / 续床链接 ===== */
.ward-locked-tag { display:inline-block;font-size:11px;background:var(--success-light);color:#137333;padding:1px 7px;border-radius:4px;margin-left:6px;font-weight:600;vertical-align:middle; }
.bed-next-link { color:var(--primary);font-size:12px;margin-left:6px;text-decoration:underline;cursor:pointer; }

/* ===== 放大书写按钮 ===== */
.sig-zoom-btn.icon-only { flex:0 0 auto;padding:0 14px; }

/* ===== 记录搜索框 + 病区筛选 ===== */
.records-search-bar { display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px; }
.records-search-bar input { flex:1;min-width:200px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 16px;font-size:15px;transition:border-color 0.2s;background:var(--card-bg); }
.records-search-bar input:focus { outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light); }
.records-search-bar select { border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 14px;font-size:14px;background:var(--card-bg);max-width:170px; }
.records-toolbar { display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px; }

/* ===== 全屏放大签名 ===== */
.fs-sign-overlay { position:fixed;inset:0;background:#fff;z-index:3000;display:none;flex-direction:column; }
.fs-sign-overlay.active { display:flex; }
.fs-sign-topbar { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;background:var(--primary);color:white;flex-wrap:wrap; }
.fs-sign-title { font-size:15px;font-weight:700; }
.fs-sign-actions { display:flex;gap:8px; }
.fs-sign-actions .btn { padding:8px 16px; }
.fs-sign-canvas-wrap { position:relative;flex:1;margin:12px;border:2px dashed var(--border-strong);border-radius:var(--radius);overflow:hidden;background:#fff; }
.fs-sign-canvas-wrap canvas { display:block;width:100%;height:100%;touch-action:none;cursor:crosshair;overscroll-behavior:contain;-webkit-user-select:none;user-select:none; }
.fs-sign-hint { position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#c0c0c0;font-size:18px;pointer-events:none;text-align:center; }

/* ===== 大字阅读模式 ===== */
body.large-font .doc-content p,
body.large-font .doc-content li,
body.large-font .doc-content .checkbox-item { font-size:19px;line-height:2; }
body.large-font .doc-content h2 { font-size:26px; }
body.large-font .doc-content h3 { font-size:21px; }
body.large-font .doc-content h4 { font-size:18px; }
body.large-font .custom-text-box { font-size:17px; }
body.large-font .read-confirm-label { font-size:18px; }
body.large-font .info-item label,
body.large-font .signature-block-label { font-size:16px; }
body.large-font .info-item input,
body.large-font .signature-extra-fields input { font-size:17px;padding:12px 14px; }
body.large-font .consent-option label { font-size:18px; }
body.large-font .doc-tag { font-size:15px; }
body.large-font #nav-largefont { background:var(--primary-light);font-weight:700;color:var(--primary); }
@media print { .header,.back-btn,.action-bar,.signature-actions,.batch-action-bar,.handover-btn-area { display:none; } body{background:white;} }

/* ===== Page Transition Animations ===== */
.container { animation: pageFadeIn var(--transition-speed) ease-out; }
@keyframes pageFadeIn { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
#page-records.container { animation:pageSlideRight var(--transition-speed) ease-out; }
@keyframes pageSlideRight { from { opacity:0; transform:translateX(30px); } to { opacity:1; transform:translateX(0); } }

/* ===== Loading Overlay ===== */
.loading-overlay { position:fixed;inset:0;background:rgba(15,23,42,.55);z-index:5000;display:none;flex-direction:column;align-items:center;justify-content:center;backdrop-filter:blur(4px); }
.loading-overlay.active { display:flex; }
.loading-spinner { width:56px;height:56px;border:4px solid rgba(255,255,255,0.2);border-top-color:white;border-radius:50%;animation:spin 0.7s linear infinite;margin-bottom:20px; }
@keyframes spin { to { transform:rotate(360deg); } }
.loading-text { color:white;font-size:16px;font-weight:600;text-align:center; }
.loading-sub { color:rgba(255,255,255,0.7);font-size:13px;margin-top:6px; }
.loading-progress-wrap { width:260px;height:6px;background:rgba(255,255,255,0.2);border-radius:3px;margin-top:16px;overflow:hidden; }
.loading-progress-bar { height:100%;background:white;border-radius:3px;transition:width 0.3s ease;width:0%; }

/* P2-9: 回收站 */
.record-item.deleted-item { opacity:0.7;border-left:3px solid var(--warning); }
.record-item.deleted-item:hover { opacity:0.85; }

/* P2-8: QR 设置面板 */
#qr-settings-overlay .modal { max-width:460px; }
#qr-settings-overlay .modal-desc { font-size:13px;color:var(--text-secondary);margin-bottom:16px; }

/* M1: PWA 安装横幅 */
#pwa-install-banner { position:fixed;bottom:80px;left:16px;right:16px;z-index:999;transform:translateY(120px);transition:transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
#pwa-install-banner.show { transform:translateY(0); }
.pwa-banner-inner { display:flex;align-items:center;gap:12px;background:white;border-radius:16px;padding:14px 16px;box-shadow:0 8px 32px rgba(0,0,0,0.18);border:1px solid var(--border); }
.pwa-banner-icon { font-size:28px;flex-shrink:0; }
.pwa-banner-text { flex:1;min-width:0; }
.pwa-banner-text strong { display:block;font-size:15px;color:var(--text); }
.pwa-banner-text span { font-size:12px;color:var(--text-secondary); }
.pwa-banner-btn { background:var(--primary);color:white;border:none;padding:8px 20px;border-radius:20px;font-size:14px;font-weight:600;cursor:pointer;white-space:nowrap;-webkit-tap-highlight-color:transparent; }
.pwa-banner-btn:active { transform:scale(0.95);background:var(--primary-dark); }
.pwa-banner-close { background:none;border:none;color:var(--text-secondary);font-size:18px;cursor:pointer;padding:4px;line-height:1; }
@media (max-width:768px) { #pwa-install-banner { bottom:calc(80px + env(safe-area-inset-bottom, 0px)); } }

/* M3: 离线指示条 */
#offline-bar { display:none;background:var(--warning);color:white;text-align:center;padding:6px 16px;font-size:13px;font-weight:500;animation:slideDown 0.3s ease; }
#offline-bar.show { display:block; }
@keyframes slideDown { from { transform:translateY(-100%);opacity:0; } to { transform:translateY(0);opacity:1; } }

/* A4: 自定义确认弹窗 */
#confirm-modal-overlay { position:fixed;inset:0;background:rgba(15,23,42,.45);display:none;align-items:center;justify-content:center;z-index:4000;backdrop-filter:blur(2px); }
#confirm-modal-overlay.active { display:flex;animation:fadeIn 0.15s ease; }
#confirm-modal-overlay .confirm-box { background:white;border-radius:16px;padding:28px 24px 20px;max-width:340px;width:88%;text-align:center;animation:scaleIn 0.2s ease;box-shadow:var(--shadow-overlay); }
#confirm-modal-overlay .confirm-icon { font-size:36px;margin-bottom:12px; }
#confirm-modal-overlay .confirm-title { font-size:17px;font-weight:800;margin-bottom:8px;color:var(--text); }
#confirm-modal-overlay .confirm-msg { font-size:14px;color:var(--text-secondary);line-height:1.6;margin-bottom:20px; }
#confirm-modal-overlay .confirm-actions { display:flex;gap:10px; }
#confirm-modal-overlay .confirm-btn { flex:1;padding:12px;border-radius:10px;border:none;font-size:15px;font-weight:700;cursor:pointer;-webkit-tap-highlight-color:transparent; }
#confirm-modal-overlay .confirm-btn:active { transform:scale(0.97); }
#confirm-modal-overlay .confirm-cancel { background:var(--bg);color:var(--text);border:1px solid var(--border); }
#confirm-modal-overlay .confirm-ok { background:var(--primary);color:white; }
#confirm-modal-overlay .confirm-ok.danger { background:var(--danger); }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes scaleIn { from { transform:scale(0.85);opacity:0; } to { transform:scale(1);opacity:1; } }

/* A7: 骨架屏 */
.skeleton-card { background:var(--card-bg);border-radius:var(--radius);padding:16px 20px;box-shadow:var(--shadow);margin-bottom:12px; }
.skeleton-line { height:14px;background:linear-gradient(90deg,#eee 25%,#f5f5f5 50%,#eee 75%);background-size:200% 100%;border-radius:6px;margin-bottom:8px;animation:shimmer 1.5s infinite; }
.skeleton-line.short { width:60%; }
.skeleton-line.medium { width:80%; }
@keyframes shimmer { 0% { background-position:200% 0; } 100% { background-position:-200% 0; } }

/* A6: 重复签署提示 */
.duplicate-warn { border-color:var(--warning)!important;background:var(--warning-light)!important; }

/* W1: 今日工作台概览卡 */
.overview-card { background:linear-gradient(135deg,var(--primary-light),#f4f6fa);border:1px solid var(--border);border-radius:var(--radius);padding:18px 20px;margin-bottom:18px;box-shadow:var(--shadow); }
.overview-title { font-size:15px;font-weight:700;color:var(--primary-dark);margin-bottom:12px; }
.overview-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:12px; }
.overview-stat { background:var(--card-bg);border-radius:var(--radius-sm);padding:12px;text-align:center;cursor:pointer;transition:all 0.2s;border:1px solid transparent; }
.overview-stat:hover { border-color:var(--primary);box-shadow:var(--shadow-lg); }
.ov-num { font-size:26px;font-weight:800;color:var(--primary);line-height:1.1; }
.ov-label { font-size:12px;color:var(--text-secondary);margin-top:4px; }
.overview-nurse { margin-top:12px;font-size:13px;color:var(--text-secondary); }
.overview-nurse b { color:var(--text); }
.overview-draft { margin-top:12px;display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--warning-light);border:1px solid #ffe58f;border-radius:var(--radius-sm);padding:10px 12px;font-size:13px;cursor:pointer;flex-wrap:wrap; }
.overview-draft-btns { display:flex;gap:8px; }
body.dark .overview-card { background:linear-gradient(135deg,#16233f,#1e293b);border-color:var(--border); }

/* W2: 患者历史建议下拉 */
.patient-suggest { position:absolute;left:0;right:0;top:100%;z-index:80;background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);margin-top:4px;overflow:hidden;display:none;max-height:240px;overflow-y:auto; }
.patient-suggest-item { display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 14px;cursor:pointer;border-bottom:1px solid var(--border); }
.patient-suggest-item:last-child { border-bottom:none; }
.patient-suggest-item:hover { background:var(--primary-light); }
.ps-name { font-weight:600;font-size:14px; }
.ps-sub { font-size:12px;color:var(--text-secondary); }

/* W4: 签字页护士徽标 */
.sign-nurse-badge { }

/* W5: 三向分流弹窗 */
#next-choice-overlay { position:fixed;inset:0;background:rgba(15,23,42,.45);display:none;align-items:center;justify-content:center;z-index:4000;backdrop-filter:blur(2px); }
#next-choice-overlay.active { display:flex;animation:fadeIn 0.15s ease; }
#next-choice-overlay .confirm-box { background:white;border-radius:16px;padding:28px 24px 20px;max-width:340px;width:88%;text-align:center;animation:scaleIn 0.2s ease;box-shadow:var(--shadow-overlay); }
#next-choice-overlay .confirm-icon { font-size:36px;margin-bottom:12px; }
#next-choice-overlay .confirm-title { font-size:17px;font-weight:800;margin-bottom:8px;color:var(--text); }
#next-choice-overlay .confirm-msg { font-size:14px;color:var(--text-secondary);line-height:1.6;margin-bottom:20px; }
.next-choice-actions { display:flex;flex-direction:column;gap:10px; }
#next-choice-overlay .confirm-btn { padding:12px;border-radius:10px;border:none;font-size:15px;font-weight:700;cursor:pointer;-webkit-tap-highlight-color:transparent; }
#next-choice-overlay .confirm-btn:active { transform:scale(0.97); }
#next-choice-overlay .confirm-ok { background:var(--primary);color:white; }
#next-choice-overlay .confirm-cancel { background:var(--bg);color:var(--text);border:1px solid var(--border); }
.confirm-btn.confirm-neutral { background:var(--bg);color:var(--text);border:1px solid var(--border); }
.confirm-btn.confirm-neutral:active { transform:scale(0.97); }
body.dark #next-choice-overlay .confirm-box { background:var(--card-bg); }
body.dark #next-choice-overlay .confirm-title { color:var(--text); }

/* W6: 记录页日期快筛 + 统计条 */
.records-date-filter { display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap; }
.date-filter-btn { background:var(--card-bg);border:1px solid var(--border);border-radius:20px;padding:6px 16px;font-size:13px;cursor:pointer;color:var(--text-secondary);transition:all 0.2s;font-weight:600; }
.date-filter-btn.active { background:var(--primary);color:white;border-color:var(--primary); }
.date-filter-btn:active { transform:scale(0.96); }
.records-stats { display:flex;gap:16px;flex-wrap:wrap;margin-bottom:12px;font-size:13px;color:var(--text-secondary); }
.records-stats b { color:var(--primary);font-size:15px; }

/* W7: 自定义组合 */
.custom-preset { border-style:dashed; }
.preset-del { margin-left:4px;color:var(--danger);font-size:13px;cursor:pointer;padding:0 4px; }
.preset-del:hover { opacity:0.7; }
.preset-save-row { display:flex;align-items:center;gap:8px;margin-left:auto; }
.preset-save-row input { border:1px solid var(--border);border-radius:var(--radius-sm);padding:8px 12px;font-size:13px;width:140px;background:var(--card-bg); }

/* 成功反馈层（签署完成） */
.success-overlay { position:fixed;inset:0;z-index:300;background:rgba(244,246,250,.97);display:none;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center; }
.success-overlay.show { display:flex; }
.success-overlay .ico { width:84px;height:84px;border-radius:50%;background:var(--success);display:grid;place-items:center;color:#fff;font-size:44px;box-shadow:0 10px 28px rgba(22,163,74,.35); }
.success-overlay h2 { margin:20px 0 6px;font-size:21px; }
.success-overlay p { color:var(--text-secondary);margin:0;font-size:14px;max-width:340px; }
.success-overlay .btn { margin-top:24px;height:48px;padding:0 36px;border:none;border-radius:var(--radius-sm);background:var(--primary);color:#fff;font-size:16px;font-weight:700;cursor:pointer; }

/* ===== 登录页 (全站鉴权) · 美观大方版 ===== */
.login-screen {
  position: fixed; inset: 0; z-index: 1000;
  display: none; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #1d4ed8 0%, #2563eb 45%, #0d9488 135%);
  padding: 20px;
}
.login-wrap {
  width: 100%; max-width: 880px;
  display: flex; align-items: stretch;
  background: var(--card-bg); border-radius: 20px; overflow: hidden;
  box-shadow: 0 24px 60px rgba(15,23,42,.28);
}
/* 左侧品牌区 */
.login-banner {
  flex: 1 1 46%; padding: 46px 40px; color: #fff;
  background: linear-gradient(160deg, #1d4ed8 0%, #2563eb 55%, #0e7490 100%);
  display: flex; flex-direction: column; position: relative; overflow: hidden;
}
.login-banner::after {
  content: ""; position: absolute; width: 300px; height: 300px; right: -100px; top: -110px;
  background: radial-gradient(circle, rgba(255,255,255,.16), transparent 70%); border-radius: 50%;
}
.login-banner::before {
  content: ""; position: absolute; width: 220px; height: 220px; left: -80px; bottom: -70px;
  background: radial-gradient(circle, rgba(13,148,136,.5), transparent 70%); border-radius: 50%;
}
.banner-logo { font-size: 54px; position: relative; }
.banner-title { font-size: 27px; font-weight: 800; margin: 16px 0 4px; letter-spacing: 1px; position: relative; }
.banner-sub { font-size: 14px; opacity: .92; margin: 0; position: relative; }
.banner-feats { list-style: none; padding: 0; margin: auto 0; display: flex; flex-direction: column; gap: 16px; position: relative; }
.banner-feats li { font-size: 14px; display: flex; align-items: center; gap: 12px; opacity: .96; }
.banner-feats li span { font-size: 18px; }
.banner-footer { font-size: 12px; opacity: .7; margin-top: 26px; position: relative; }
/* 右侧登录卡片 */
.login-card {
  flex: 1 1 54%; padding: 46px 42px;
  display: flex; flex-direction: column; justify-content: center;
  background: var(--card-bg);
}
.login-card-head { text-align: center; margin-bottom: 28px; }
.login-avatar {
  width: 64px; height: 64px; border-radius: 18px; margin: 0 auto 14px;
  background: linear-gradient(160deg, #2563eb, #0d9488); color: #fff;
  display: flex; align-items: center; justify-content: center; font-size: 32px;
  box-shadow: 0 8px 20px rgba(37,99,235,.3);
}
.login-title { font-size: 22px; font-weight: 800; color: var(--text); margin: 0; }
.login-sub { font-size: 13px; color: var(--text-secondary); margin: 6px 0 0; }
.login-field { margin-bottom: 16px; }
.login-label { display: block; font-size: 13px; font-weight: 600; color: var(--text-secondary); margin: 0 0 7px; }
.login-input-wrap { position: relative; display: flex; align-items: center; }
.login-ic { position: absolute; left: 14px; font-size: 15px; opacity: .6; pointer-events: none; }
.login-input {
  width: 100%; height: 48px; padding: 0 44px 0 42px; box-sizing: border-box;
  border: 1px solid var(--border-strong); border-radius: 12px;
  font-size: 15px; background: var(--card-bg); color: var(--text);
  transition: border-color .2s, box-shadow .2s;
}
.login-input:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(37,99,235,.14); }
.login-select {
  appearance: none; -webkit-appearance: none; -moz-appearance: none;
  padding-left: 14px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236b7280' d='M6 8 0 0h12z'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center; padding-right: 40px;
}
.login-select::-ms-expand { display: none; }
.login-eye {
  position: absolute; right: 10px; border: none; background: transparent; cursor: pointer;
  font-size: 16px; padding: 6px; opacity: .7; line-height: 1;
}
.login-eye:hover { opacity: 1; }
.login-btn {
  width: 100%; height: 50px; margin-top: 10px; border: none; border-radius: 12px;
  background: linear-gradient(135deg, #2563eb, #1d4ed8); color: #fff; font-size: 16px; font-weight: 700;
  cursor: pointer; transition: transform .1s, box-shadow .2s, opacity .2s;
  box-shadow: 0 8px 18px rgba(37,99,235,.32);
}
.login-btn:hover { box-shadow: 0 10px 24px rgba(37,99,235,.4); }
.login-btn:active { transform: translateY(1px); }
.login-btn:disabled { opacity: .65; cursor: default; }
.login-error { color: var(--danger); font-size: 13px; min-height: 18px; margin-top: 14px; font-weight: 600; text-align: center; }
.login-hint { font-size: 12px; color: var(--text-secondary); margin-top: 16px; line-height: 1.6; text-align: center; }
/* 移动端：单栏，品牌区收为顶部横幅 */
@media (max-width: 768px) {
  .login-wrap { max-width: 400px; flex-direction: column; border-radius: 16px; }
  .login-banner { flex: none; padding: 26px 24px; align-items: center; text-align: center; }
  .banner-feats, .banner-footer { display: none; }
  .banner-title { font-size: 20px; margin: 10px 0 2px; }
  .banner-logo { font-size: 40px; }
  .login-card { padding: 30px 24px 34px; }
}

/* ===== 头部用户条 ===== */
.user-chip {
  display: flex; align-items: center; gap: 8px;
  margin-left: 6px; padding: 4px 6px 4px 10px;
  background: var(--primary-light); border: 1px solid rgba(37,99,235,.2);
  border-radius: 999px;
}
.user-avatar { font-size: 18px; }
.user-meta { display: flex; flex-direction: column; line-height: 1.15; }
.user-name { font-size: 13px; font-weight: 700; color: var(--text); }
.user-role { font-size: 11px; color: var(--primary-dark); }
.user-btn {
  height: 30px; padding: 0 12px; border: none; border-radius: 999px;
  background: #fff; color: var(--primary-dark); font-size: 12px; font-weight: 600; cursor: pointer;
}
.user-btn:hover { background: var(--primary); color: #fff; }
.user-btn.logout { background: var(--danger-light); color: var(--danger); }
.user-btn.logout:hover { background: var(--danger); color: #fff; }

.ward-locked-tag {
  display: inline-block; padding: 2px 8px; border-radius: 6px;
  background: var(--primary-light); color: var(--primary-dark);
  font-size: 11px; font-weight: 700;
}

/* ===== 统计页 ===== */
.stats-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 16px 0; }
.stat-card {
  background: var(--card-bg); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 16px 12px; text-align: center; box-shadow: var(--shadow);
}
.stat-num { font-size: 28px; font-weight: 800; color: var(--primary); line-height: 1.1; }
.stat-label { font-size: 12px; color: var(--text-secondary); margin-top: 6px; }
.stats-block { background: var(--card-bg); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px; margin-top: 14px; box-shadow: var(--shadow); }
.stats-block-title { font-size: 15px; font-weight: 700; color: var(--text); margin-bottom: 12px; }
.stats-table-wrap { overflow-x: auto; }
.stats-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.stats-table th, .stats-table td { padding: 10px 12px; text-align: center; border-bottom: 1px solid var(--border); white-space: nowrap; }
.stats-table th { background: var(--primary-light); color: var(--primary-dark); font-weight: 700; }
.stats-table tbody tr:nth-child(even) { background: rgba(37,99,235,.03); }
.stats-table td:first-child, .stats-table th:first-child { text-align: left; font-weight: 600; }
.by-doc-row { display: flex; align-items: center; gap: 10px; padding: 7px 0; }
.by-doc-name { flex: 0 0 42%; font-size: 13px; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.by-doc-bar { flex: 1; height: 10px; background: var(--bg); border-radius: 6px; overflow: hidden; }
.by-doc-bar i { display: block; height: 100%; background: linear-gradient(90deg, var(--primary), var(--patient)); border-radius: 6px; }
.by-doc-num { flex: 0 0 36px; text-align: right; font-size: 13px; font-weight: 700; color: var(--primary-dark); }
.by-doc-empty { font-size: 13px; color: var(--text-secondary); padding: 8px 0; }

/* 暗色模式补充 */
body.dark .login-screen { background: linear-gradient(135deg, #0f172a 0%, #111c33 55%, #0b2e2a 100%); }
body.dark .login-wrap { background: var(--card-bg); }
body.dark .login-card { background: var(--card-bg); }
body.dark .login-title { color: var(--text); }
body.dark .login-sub, body.dark .login-label, body.dark .login-hint { color: var(--text-secondary); }
body.dark .login-input { background: var(--card-bg); color: var(--text); border-color: var(--border-strong); }
body.dark .user-chip { background: rgba(77,148,255,.14); border-color: rgba(77,148,255,.3); }
body.dark .user-btn { background: #16233f; color: #9ec1ff; }
body.dark .user-btn:hover { background: var(--primary); color: #fff; }
body.dark .stats-table th { background: rgba(77,148,255,.12); color: #9ec1ff; }
body.dark .by-doc-bar { background: #16233f; }
@media (max-width: 560px) { .stats-cards { grid-template-columns: repeat(2, 1fr); } }

/* =====================================================================
   Mobile Bottom Navigation (thumb-friendly tab bar + center QR FAB)
   仅在 ≤768px 显示；桌面端沿用顶部 header 导航，此处隐藏。
   主页/签署页底部已有主要操作栏(确认签字/提交)，导航栏整体上移到
   操作栏之上，避免遮挡与重叠；记录/病区码/统计页导航栏贴底。
   ===================================================================== */
.bottom-nav { display: none; }

@media (max-width: 768px) {
  .bottom-nav {
    display: flex;
    align-items: stretch;
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 200;
    height: calc(var(--nav-h) + env(safe-area-inset-bottom, 0px));
    padding-bottom: env(safe-area-inset-bottom, 0px);
    padding-left: 6px; padding-right: 6px;
    background: rgba(255, 255, 255, .94);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-top: 1px solid var(--border);
    box-shadow: 0 -2px 14px rgba(15, 23, 42, .08);
    animation: navSlideUp .32s cubic-bezier(.2, .8, .2, 1);
  }
  body.dark .bottom-nav { background: rgba(15, 23, 42, .94); border-top-color: var(--border); }

  .bn-tab {
    flex: 1 1 0;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    background: transparent; border: none; color: var(--text-secondary); cursor: pointer;
    font-size: 11px; font-weight: 600; line-height: 1;
    -webkit-tap-highlight-color: transparent; user-select: none;
    transition: color .2s, transform .12s;
    padding: 6px 0;
  }
  .bn-tab:active { transform: scale(.92); }
  .bn-tab.active { color: var(--primary); }
  .bn-ic { width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; transition: transform .2s; }
  .bn-ic svg { width: 23px; height: 23px; display: block; }
  .bn-tab.active .bn-ic { transform: translateY(-1px); }
  .bn-label { letter-spacing: .2px; }

  /* 居中凸起二维码 FAB —— 床边最常用动作，置顶突出，始终可点 */
  .bn-fab {
    flex: 0 0 auto;
    width: 56px; height: 56px;
    align-self: center;
    margin: -20px 2px 0;
    border: none; border-radius: 50%;
    background: linear-gradient(140deg, var(--primary), var(--primary-dark));
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 8px 20px rgba(37, 99, 235, .45);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent; user-select: none;
    transition: transform .15s, box-shadow .15s;
  }
  .bn-fab:active { transform: scale(.9); box-shadow: 0 4px 12px rgba(37, 99, 235, .4); }
  .bn-fab-ic svg { width: 27px; height: 27px; display: block; }

  /* 顶部 header：移动端精简为单行（品牌 + 大字/深色/账号），页面导航迁移到底部 */
  .header-content { flex-wrap: nowrap !important; }
  .header-actions { width: auto !important; flex-wrap: nowrap !important; justify-content: flex-end !important; padding-top: 0 !important; gap: 4px; }
  .header { padding: 8px 14px; padding-top: calc(8px + env(safe-area-inset-top, 0px)); }
  .header-subtitle { display: none; }
  .header-title { font-size: 15px; }
  .header-logo .logo-icon { width: 34px; height: 34px; font-size: 19px; }
  .user-btn { padding: 5px 9px; font-size: 12px; }

  /* 隐藏顶部页面导航按钮（首页/记录/病区码/统计/二维码），改由底部导航承载 */
  #nav-home, #nav-records, #nav-wardqr, #nav-stats, #nav-qr-top { display: none !important; }

  /* 主页/签署页已有底部操作栏(确认签字 / 提交)，将整条导航栏上移到操作栏之上，
     居中二维码 FAB 随之悬浮于操作栏上方，互不遮挡 */
  body[data-view="home"] .bottom-nav,
  body[data-view="sign"] .bottom-nav { bottom: calc(74px + env(safe-area-inset-bottom, 0px)); }

  /* 滚动到签名按钮：位于上移后的导航栏之上 */
  .scroll-to-sign-btn { bottom: calc(90px + env(safe-area-inset-bottom, 0px)); }
  /* PWA 安装提示条：上移避免压住导航 */
  #pwa-install-banner { bottom: calc(100px + env(safe-area-inset-bottom, 0px)); }

  /* 内容底部留白：清空导航栏(+操作栏)高度，防止末屏内容被遮挡 */
  .container { padding-bottom: 142px; }
  #page-home { padding-bottom: 142px; }
  #page-sign { padding-bottom: 142px; }
}

@keyframes navSlideUp {
  from { transform: translateY(100%); opacity: .4; }
  to { transform: translateY(0); opacity: 1; }
}

/* =====================================================================
   描红式签名（Guided Signature）—— 患者姓名灰字底纹 + 直接描写
   患方签字区自动显示姓名大字作为描红模板，用户在画布上直接书写。
 ===================================================================== */

/* 患方签字区：有姓名时切换为描红模式（更高画布 + 去掉虚线边框） */
.sig-wrapper-guide {
  border: 2px solid #e2e8f0 !important;
  border-radius: 12px !important;
  background: #fff !important;
}
body.dark .sig-wrapper-guide {
  border-color: #334155 !important;
  background: #0f172a !important;
}

/* 全屏弹窗签字：描红模式标题 */
.fs-sign-title-guide {
  text-align: center;
  font-size: 17px;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 4px;
}
.fs-sign-subtitle-guide {
  text-align: center;
  font-size: 13px;
  color: var(--text-secondary);
  margin-bottom: 12px;
}

/* 主页面签字区：只读，点击打开放大书写窗口 */
.sig-pad-clickable { position: relative; transition: background .15s, box-shadow .15s; }
.sig-pad-clickable:active { background: #eef2ff !important; box-shadow: 0 0 0 2px var(--primary-light) inset; }
body.dark .sig-pad-clickable:active { background: #1e293b !important; }
/* 主画布默认可直接手写（P1-2：移动端直接手指书写，桌面端点击打开放大页） */
.sig-pad-clickable canvas { pointer-events: auto; }
/* 描红/空画布时在右下角提示点击签名 */
.sig-pad-clickable::after {
  content: '✍️ 点击签名';
  position: absolute;
  right: 10px;
  bottom: 8px;
  font-size: 12px;
  color: var(--primary);
  font-weight: 600;
  pointer-events: none;
  opacity: .8;
}

/* =====================================================================
   易用性 / 美观增强（Senior Developer 打磨）
   ===================================================================== */

/* 回到顶部悬浮按钮：长页面滚动后出现，放在左侧避免与右侧签名按钮冲突 */
.back-to-top {
  position: fixed; left: 16px; bottom: 24px;
  width: 44px; height: 44px; border-radius: 50%; border: none;
  background: var(--primary); color: #fff; font-size: 20px; line-height: 1;
  box-shadow: 0 6px 16px rgba(37, 99, 235, .35);
  cursor: pointer; z-index: 130;
  display: flex; align-items: center; justify-content: center;
  opacity: 0; transform: translateY(10px) scale(.8); pointer-events: none;
  transition: opacity .25s ease, transform .25s cubic-bezier(.2,.8,.2,1);
  -webkit-tap-highlight-color: transparent;
}
.back-to-top.show { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.back-to-top:active { transform: scale(.9); }
body.dark .back-to-top { box-shadow: 0 6px 16px rgba(0,0,0,.4); }
@media (max-width: 768px) {
  .back-to-top { bottom: calc(var(--nav-h) + 20px + env(safe-area-inset-bottom, 0px)); }
}

/* 今日工作台：问候语 */
.overview-head { display: flex; flex-direction: column; gap: 2px; margin-bottom: 12px; }
.overview-greet { font-size: 15px; font-weight: 700; color: var(--text); }
.overview-greet + .overview-title { margin-top: 0; }
.overview-title { font-size: 16px; font-weight: 800; color: var(--primary); }

/* 首页文档卡片入场错落淡入（premium 细节，每次进入首页触发） */
.doc-check-item { animation: docItemIn .42s both; }
.doc-check-item:nth-child(1) { animation-delay: .02s; }
.doc-check-item:nth-child(2) { animation-delay: .06s; }
.doc-check-item:nth-child(3) { animation-delay: .10s; }
.doc-check-item:nth-child(4) { animation-delay: .14s; }
.doc-check-item:nth-child(5) { animation-delay: .18s; }
.doc-check-item:nth-child(6) { animation-delay: .22s; }
.doc-check-item:nth-child(7) { animation-delay: .26s; }
.doc-check-item:nth-child(8) { animation-delay: .30s; }
.doc-check-item:nth-child(n+9) { animation-delay: .34s; }
@keyframes docItemIn {
  from { opacity: 0; transform: translateY(14px) scale(.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .doc-check-item { animation: none; }
  .back-to-top { transition: opacity .2s; }
}

/* ===== 病区码卡片：可点击放大 + 放大查看器 ===== */
.wardqr-card { cursor: pointer; position: relative; }
.wardqr-card:active { transform: scale(.98); }
.wardqr-card-actions { display: flex; align-items: center; justify-content: center; gap: 8px; }
.wardqr-zoom { font-size: 12px; color: var(--primary); font-weight: 600; opacity: .8; transition: opacity .2s; }
@media (hover: hover) { .wardqr-card:hover .wardqr-zoom { opacity: 1; } }

.wardqr-viewer-box {
  background: var(--card-bg); border-radius: var(--radius); padding: 22px 20px;
  text-align: center; max-width: 360px; width: 88%; box-shadow: var(--shadow-lg);
  animation: docItemIn .28s both;
}
.wardqr-viewer-title { font-size: 18px; font-weight: 800; margin-bottom: 14px; color: var(--text); }
.wardqr-viewer-qr {
  display: inline-block; padding: 10px; background: #fff; border: 1px solid var(--border);
  border-radius: var(--radius-sm); margin-bottom: 12px;
}
.wardqr-viewer-qr canvas, .wardqr-viewer-qr img {
  display: block; width: 280px; height: 280px; max-width: 68vw; max-height: 68vw;
}
.wardqr-viewer-url { font-size: 11px; color: var(--text-secondary); word-break: break-all; margin-bottom: 12px; line-height: 1.5; }
.wardqr-viewer-actions { margin-bottom: 10px; }
.wardqr-viewer-hint { font-size: 12px; color: var(--text-secondary); margin-bottom: 14px; line-height: 1.5; }

/* ===== 统计页：近30天每日趋势 ===== */
.trend-chart { display: flex; align-items: flex-end; gap: 2px; height: 120px; padding-top: 18px; }
.trend-bar { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; position: relative; min-width: 0; }
.trend-bar i {
  display: block; width: 100%; max-width: 14px;
  background: linear-gradient(180deg, var(--primary), var(--primary-dark));
  border-radius: 3px 3px 0 0; transition: height .4s ease;
}
.trend-bar:hover i { filter: brightness(1.1); }
.trend-val { font-size: 9px; color: var(--text-secondary); margin-bottom: 2px; line-height: 1; }
.trend-axis { display: flex; justify-content: space-between; font-size: 11px; color: var(--text-secondary); margin-top: 6px; }
.trend-foot { font-size: 12px; color: var(--text-secondary); margin-top: 8px; text-align: center; }
.trend-foot b { color: var(--primary); }

/* =====================================================================
   腕带扫码自动填写（Wristband QR Scanner）
   ===================================================================== */
.wristband-scan-bar {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 12px; padding: 8px 12px;
  background: linear-gradient(135deg, #eff6ff, #f0fdfa);
  border: 1px solid #bfdbfe; border-radius: var(--radius-sm);
}
.wristband-scan-bar .btn { white-space: nowrap; flex-shrink: 0; }
.wristband-hint { font-size: 12px; color: var(--text-secondary); line-height: 1.3; }

/* 扫码弹窗 */
.wristband-scan-box {
  width: 92%; max-width: 420px; max-height: 85vh; overflow-y: auto;
  background: #fff; border-radius: var(--radius-lg);
  padding: 20px; display: flex; flex-direction: column; gap: 12px;
}
body.dark .wristband-scan-box { background: var(--surface); }
.wristband-scan-title { font-size: 17px; font-weight: 700; text-align: center; color: var(--text); }
.wristband-scan-subtitle { font-size: 13px; text-align: center; color: var(--text-secondary); margin-top: -6px; }

.wristband-scan-tabs { display: flex; gap: 8px; justify-content: center; }
.wb-panel { width: 100%; }

/* 摄像头扫描区 */
.wb-video-wrap {
  position: relative; width: 100%; height: 260px;
  background: #000; border-radius: var(--radius); overflow: hidden;
}
.wb-video-wrap video { width: 100%; height: 100%; object-fit: cover; }
.wb-scan-frame {
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 200px; height: 200px;
  border: 2px solid rgba(37, 99, 235, .7);
  border-radius: 12px; box-shadow: 0 0 0 4000px rgba(0,0,0,.35);
}
.wb-scan-line {
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 196px; height: 2px;
  background: linear-gradient(90deg, transparent, var(--primary), transparent);
  animation: wbScanLine 2s ease-in-out infinite;
}
@keyframes wbScanLine {
  0%, 100% { top: calc(50% - 90px); }
  50% { top: calc(50% + 90px); }
}
.wb-status {
  text-align: center; font-size: 13px; color: var(--text-secondary);
  padding: 6px 0; min-height: 22px;
}

/* 照片上传区 */
.wb-upload-zone {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px; padding: 30px 16px;
  border: 2px dashed var(--border-strong); border-radius: var(--radius);
  cursor: pointer; transition: border-color .2s, background .2s;
  color: var(--text-secondary); font-size: 14px;
}
.wb-upload-zone:hover { border-color: var(--primary); background: rgba(37,99,235,.03); }
.wb-upload-icon { font-size: 36px; }
.wb-upload-hint { font-size: 12px; color: var(--text-tertiary); margin-top: 4px; }
#wb-preview-wrap { text-align: center; }
.wb-preview-result { margin-top: 10px; padding: 10px; border-radius: var(--radius-sm); font-size: 13px; line-height: 1.5; word-break: break-all; }

.wristband-scan-actions { display: flex; justify-content: flex-end; gap: 8px; }

/* 扫码成功填充结果高亮 */
.wb-fill-success {
  background: #f0fdf4; border: 1px solid #86efac; color: #166534;
  padding: 10px 14px; border-radius: var(--radius-sm); margin-top: 8px;
  font-size: 13px; line-height: 1.6;
}
.wb-fill-success b { color: #15803d; }
body.dark .wb-fill-success { background: rgba(22,101,52,.15); border-color: #22c55e; color: #86efac; }

/* ===== P1-4: 腕带 OCR 失败后的重试 / 旋转按钮 ===== */
.wb-ocr-actions { display: flex; gap: 8px; margin-top: 12px; }
.wb-retry-btn, .wb-rotate-btn {
  flex: 1; height: 42px; border-radius: var(--radius-sm); cursor: pointer;
  font-size: 14px; font-weight: 600; border: 1px solid var(--primary-light);
  background: var(--primary-light); color: var(--primary-dark);
  transition: background .15s, transform .1s;
}
.wb-retry-btn:hover, .wb-rotate-btn:hover { background: var(--primary); color: #fff; }
.wb-retry-btn:active, .wb-rotate-btn:active { transform: scale(.98); }

/* ===== P1-6: 记录列表"加载更多"按钮 ===== */
.load-more-btn {
  display: block; width: 100%; margin: 16px 0; padding: 14px;
  border: 1px dashed var(--border-strong); border-radius: var(--radius);
  background: var(--card-bg); color: var(--primary); cursor: pointer;
  font-size: 15px; font-weight: 600; transition: background .15s;
}
.load-more-btn:hover { background: var(--primary-light); }
.load-more-btn:active { transform: scale(.99); }

/* ===== 操作日志 (Audit Log) 表格 — FINDING-2 / T04 ===== */
.audit-log-wrap { margin: 12px 0; }
.audit-log-meta { font-size: 13px; color: var(--text-secondary); margin: 8px 4px 10px; }
.audit-table-scroll {
  width: 100%; overflow-x: auto; border: 1px solid var(--border-strong);
  border-radius: var(--radius); background: var(--card-bg);
}
.audit-table { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 720px; }
.audit-table thead th {
  position: sticky; top: 0; background: var(--primary-light);
  color: var(--primary-700); text-align: left; padding: 10px 12px;
  font-weight: 700; white-space: nowrap; border-bottom: 1px solid var(--border-strong);
}
.audit-table tbody td {
  padding: 9px 12px; border-bottom: 1px solid var(--border, #eceff4);
  color: var(--text-primary); vertical-align: top; white-space: nowrap;
}
.audit-table tbody tr:nth-child(even) { background: rgba(37, 99, 235, 0.03); }
.audit-table tbody tr:hover { background: var(--primary-light); }
.audit-cell-time { font-variant-numeric: tabular-nums; color: var(--text-secondary); }
.audit-cell-detail { white-space: normal; min-width: 160px; max-width: 280px; color: var(--text-secondary); }