/* ===== 租客邦 SaaS - 浅色纸感设计系统 ===== */
:root{
  --bg:#f7f6f3;
  --paper:#ffffff;
  --sidebar:#faf9f7;
  --ink:#1a1a1a;
  --muted:#6b6b6b;
  --light:#5f6b7a;
  --line:#e8e6e1;
  --line-soft:#f0eeea;
  --accent:#0f766e;
  --accent-light:#ccfbf1;
  --green:#047857;
  --green-bg:#d1fae5;
  --orange:#b45309;
  --orange-bg:#fef3c7;
  --red:#b91c1c;
  --red-bg:#fee2e2;
  --blue:#1d4ed8;
  --blue-bg:#dbeafe;
  --purple:#7c3aed;
  /* fix94：统计卡扩到 8 张后原 6 色不够用，补靛蓝与石板灰，避免同色重复 */
  --indigo:#4338ca;
  --indigo-bg:#eef2ff;
  --slate:#334155;
  --slate-bg:#f8fafc;
  --shadow:0 1px 3px rgba(0,0,0,0.04),0 4px 12px rgba(0,0,0,0.03);
  --shadow-hover:0 4px 12px rgba(0,0,0,0.06),0 12px 32px rgba(0,0,0,0.04);
  --shadow-drawer:-20px 0 60px rgba(0,0,0,0.1);
  --shadow-modal:0 24px 80px rgba(0,0,0,0.15);
  --radius-sm:8px;
  --radius-md:10px;
  --radius-lg:12px;
  --radius-xl:16px;

  /* ===== fix166 全站统计卡渐变底（原先是各页面 JS 里写死的内联 background，
     内联优先级高于 CSS，导致深色模式下压不住、卡片一律白底。这里统一收敛到变量层。 ===== */
  --card-grad-from:#ffffff;
  --card-grad-accent:#f0fdf9;
  --card-grad-blue:#eff6ff;
  --card-grad-green:#f0fdf4;
  --card-grad-orange:#fffbeb;
  --card-grad-red:#fef2f2;
  --card-grad-purple:#f5f3ff;
  --card-grad-violet:#faf5ff;
  --card-grad-teal:#f0fdfa;
  --card-grad-indigo:#eef2ff;
  --card-grad-slate:#f8fafc;
  --card-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 20px -14px rgba(16,24,40,.18);
  --card-shadow-hover:0 2px 5px rgba(16,24,40,.06),0 16px 30px -16px rgba(16,24,40,.26);

  /* ===== fix166 语义色「文字/描边」亮色档 =====
     浅色主题下与 --red/--green/... 同值（视觉零变化）；深色主题下切到亮色档，
     保证彩色文字、卡片顶部 3px 色条、提示条文字在暗底上仍然清晰。
     注意：这些只用于 color / border，不要用于 background（会破坏 --xxx + #fff 的按钮）。 ===== */
  /* 主色（青绿）用 var 别名，这样 ocean/lime/amber/graphite 各主题无需重复声明即可跟随 */
  --accent-ink:var(--accent);
  --red-ink:#b91c1c;
  --orange-ink:#b45309;
  --green-ink:#047857;
  --blue-ink:#1d4ed8;
  --purple-ink:#7c3aed;
  --indigo-ink:#4338ca;
  --slate-ink:#334155;
  /* 订阅页「推荐/上级」说明块的底与边（原为硬编码浅绿，深色下会变成刺眼亮块） */
  --sub-ref-bg:linear-gradient(135deg,#ecfdf5,#f0fdfa);
  --sub-ref-border:#a7f3d0;
}

/* fix166：套餐色三档 token（浅色档必须写在这里，只有深色档会让浅色模式拿不到值、
   卡片顶边色条与套餐名一起失效）
   -bg / -fg ：随主题切换。用于工作台内的套餐卡、套餐标签（暗底上必须是亮色档）
   -ink      ：不随主题切换。只用于公开落地页——那页是独立浅色设计体系，
               卡片永远是 #def8a6 / #f1f2a3 这类浅色块，浅黄底 + --fg 亮黄字对比度仅 1.2:1 */
:root{
  --plan-basic-bg:#dbeafe; --plan-basic-fg:#2563eb; --plan-basic-ink:#2563eb;
  --plan-standard-bg:#ccfbf1; --plan-standard-fg:#0f766e; --plan-standard-ink:#0f766e;
  --plan-pro-bg:#ede9fe; --plan-pro-fg:#7c3aed; --plan-pro-ink:#7c3aed;
  --plan-flagship-bg:#fef3c7; --plan-flagship-fg:#b45309; --plan-flagship-ink:#b45309;
}

/* ===== 主题皮肤（设置中心可切换，localStorage 记住选择） ===== */
[data-theme="ocean"]{
  --bg:#f2f6fa;
  --sidebar:#f7fafc;
  --line:#e2e9f0;
  --line-soft:#edf1f5;
  --accent:#2563eb;
  --accent-light:#dbeafe;
}
[data-theme="amber"]{
  --bg:#faf7f0;
  --sidebar:#fcf9f3;
  --line:#ede6d8;
  --line-soft:#f3eee3;
  --accent:#b45309;
  --accent-light:#fef3c7;
}
[data-theme="graphite"]{
  --bg:#f4f5f6;
  --sidebar:#f9fafb;
  --line:#e3e5e8;
  --line-soft:#edeff1;
  --accent:#334155;
  --accent-light:#e2e8f0;
}
[data-theme="dark"]{
  --bg:#0f151c;
  --paper:#1a222c;
  --sidebar:#151c25;
  --ink:#e8edf2;
  --muted:#9aa7b3;
  --light:#64707c;
  --line:#2a3540;
  --line-soft:#222c37;
  --accent:#2dd4bf;
  --accent-light:#134843;
  --green-bg:#0f3d30;
  --orange-bg:#4a2f10;
  --red-bg:#4c1d1d;
  --blue-bg:#172d4d;
  --shadow:0 1px 3px rgba(0,0,0,0.3),0 4px 12px rgba(0,0,0,0.25);
  --shadow-hover:0 4px 12px rgba(0,0,0,0.4),0 12px 32px rgba(0,0,0,0.3);
  --shadow-drawer:-20px 0 60px rgba(0,0,0,0.5);
  --shadow-modal:0 24px 80px rgba(0,0,0,0.6);
  /* fix166：补齐缺失的语义色底（原先只有 green/orange/red/blue 有暗色档） */
  --purple-bg:#241f3a;
  --indigo-bg:#1c1e38;
  --slate-bg:#1a222c;
  /* fix166：统计卡渐变底的暗色档 —— 整体走 --paper 同族的暗面，只保留极淡的语义色偏 */
  --card-grad-from:#1a222c;
  --card-grad-accent:#13231f;
  --card-grad-blue:#151f2e;
  --card-grad-green:#132320;
  --card-grad-orange:#231d12;
  --card-grad-red:#251818;
  --card-grad-purple:#1c1a2c;
  --card-grad-violet:#1e1a2c;
  --card-grad-teal:#132320;
  --card-grad-indigo:#181a2c;
  --card-grad-slate:#1a222c;
  --card-shadow:0 1px 2px rgba(0,0,0,.24),0 10px 26px -14px rgba(0,0,0,.5);
  --card-shadow-hover:0 2px 6px rgba(0,0,0,.32),0 18px 36px -18px rgba(0,0,0,.6);
  /* fix166：语义色亮色档 —— 深色下 #b91c1c 这类深色值在暗底上对比度仅约 2.6:1，换亮档后 ≥4.5:1 */
  --red-ink:#f87171;
  --orange-ink:#fbbf24;
  --green-ink:#34d399;
  --blue-ink:#60a5fa;
  --purple-ink:#a78bfa;
  --indigo-ink:#818cf8;
  --slate-ink:#94a3b8;
  /* --accent(#2dd4bf) 压在 --accent-light(#134843) 上只有 2.75:1，文字需要再亮一档 */
  --accent-ink:#5eead4;
  --sub-ref-bg:linear-gradient(135deg,#0e2a23,#102420);
  --sub-ref-border:#1e5145;
  --plan-basic-bg:#172d4d; --plan-basic-fg:#60a5fa;
  --plan-standard-bg:#134843; --plan-standard-fg:#2dd4bf;
  --plan-pro-bg:#241f3a; --plan-pro-fg:#a78bfa;
  --plan-flagship-bg:#3a2710; --plan-flagship-fg:#fbbf24;
}
/* 公开页（落地页/登录/注册/找回密码）固定使用浅色纸感配色。
   这些页面的底色是硬编码的浅色（#fff / #f8fbfa），若继承暗色主题的变量，
   --ink 会变成浅色文字落在浅底上（对比度约 1.2:1，几乎不可读）。 */
#loginGate,.public-page,.login-page,.auth-login{
  --bg:#f7f6f3; --paper:#ffffff; --sidebar:#faf9f7; --ink:#1a1a1a; --muted:#6b6b6b; --light:#5f6b7a;
  --line:#e8e6e1; --line-soft:#f0eeea; --accent:#0f766e; --accent-light:#ccfbf1;
  --green:#047857; --green-bg:#d1fae5; --orange:#b45309; --orange-bg:#fef3c7;
  --red:#b91c1c; --red-bg:#fee2e2; --blue:#1d4ed8; --blue-bg:#dbeafe; --purple:#7c3aed;
  /* fix166b：这套页面永远是浅色纸感，所以 -ink 也必须是浅色档，
     否则深色主题下会继承到亮色档（#f87171 压在 #fee2e2 上约 1.6:1，看不见） */
  --accent-ink:#0f766e; --red-ink:#b91c1c; --orange-ink:#b45309; --green-ink:#047857;
  --blue-ink:#1d4ed8; --purple-ink:#7c3aed; --indigo-ink:#4338ca; --slate-ink:#334155;
}
/* 暗色模式配套 */
[data-theme="dark"] th{background:#151c25}
[data-theme="dark"] tr:hover td{background:#1f2935}
[data-theme="dark"] .btn{background:#1a222c}
[data-theme="dark"] .btn:hover{border-color:var(--accent);color:var(--accent-ink)}
[data-theme="dark"] .btn-sm[style*="background:#fff"]{background:#1a222c!important}
[data-theme="dark"] .btn-ghost:hover{background:#222c37}
[data-theme="dark"] .chip{background:#1a222c}
[data-theme="dark"] .chip.active{background:var(--accent);border-color:var(--accent);color:#06281f}
[data-theme="dark"] .day-btn{background:#1a222c}
/* fix127/128 青柠主题：官网首页/注册页同款视觉。128 调整为以中性灰为主的底色（参考截图近白灰底），青柠只做强调色 */
[data-theme="lime"]{
  --bg:#f2f3f1;
  --sidebar:#f9faf8;
  --line:#e4e6e2;
  --line-soft:#eef0ed;
  --accent:#4d7c0f;
  --accent-light:#ecfccb;
}
[data-theme="lime"] .btn-primary{background:#101828;border-color:#101828;box-shadow:0 1px 2px rgba(16,24,40,.2)}
[data-theme="lime"] .btn-primary:hover{background:#1b2534;border-color:#1b2534;transform:translateY(-1px)}
[data-theme="lime"] .nav-item.active::before{background:#84cc16}
[data-theme="lime"] th{background:#f4f5f3}

[data-theme="dark"] .ship-opt{background:#1a222c}
[data-theme="dark"] .ship-acc{background:#1a222c}
[data-theme="dark"] input,[data-theme="dark"] select,[data-theme="dark"] textarea{color-scheme:dark}
[data-theme="dark"] .form-group input,[data-theme="dark"] .form-group select,[data-theme="dark"] .form-group textarea{background:#151c25}
[data-theme="dark"] .search-box input,[data-theme="dark"] .filter-group select{background:#151c25}
[data-theme="dark"] .page-btns button{background:#1a222c}
[data-theme="dark"] .toggle-switch .ts-track{background:#3a4754}
[data-theme="dark"] .order-section{background:#1a222c;border-color:#222c37}
[data-theme="dark"] .order-section.sec-blue{background:#17222e;border-color:#1f2e3d}
[data-theme="dark"] .order-section.sec-green{background:#16241f;border-color:#1e3129}
[data-theme="dark"] .order-section.sec-purple{background:#1d1c2a;border-color:#2a2740}
[data-theme="dark"] .order-modal .modal-body{background:#101820}
[data-theme="dark"] .modal,[data-theme="dark"] .drawer{border-color:#2a3540}
[data-theme="dark"] .drawer{background:#0f151c}
[data-theme="dark"] .modal-close,[data-theme="dark"] .drawer-close{background:#222c37}
[data-theme="dark"] .sg-scroll{background:#1a222c;border-color:#222c37}
[data-theme="dark"] .sg-head{background:#151c25}
/* fix166b：暗色下 --accent 是亮青绿(#2dd4bf)，两处「深底 + 白字」会反相成看不清，
   改为与 .chip.active 同一套反色写法（亮底 + 深字）。浅色主题不受影响，无需覆盖。 */
[data-theme="dark"] .brand-icon{color:#06281f}
[data-theme="dark"] .page-btns button.active{background:var(--accent);border-color:var(--accent);color:#06281f}
[data-theme="dark"] .sg-label{background:#1a222c!important}
[data-theme="dark"] .sg-row:hover .sg-label{background:#222c37!important}
[data-theme="dark"] .progress{background:#222c37}
[data-theme="dark"] .nav-item:hover{background:#1f2935}
[data-theme="dark"] .nav-item.active{background:#1f2935}
[data-theme="dark"] .nav-item.active::before{background:var(--accent)}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{background:var(--bg);color:var(--ink);font:14px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased;transition:background .25s,color .25s}

/* ===== 布局 ===== */
.app{display:grid;grid-template-columns:220px 1fr;min-height:100vh}
.app-nav{padding:22px 12px;background:var(--sidebar);border-right:1px solid var(--line);position:sticky;top:0;height:100vh;overflow-y:auto;display:flex;flex-direction:column}
main{padding:28px 28px 48px;min-width:0}

/* ===== 侧边栏 ===== */
.brand{padding:0 10px 24px;color:var(--ink);font-size:17px;font-weight:700;display:flex;align-items:center;gap:10px;letter-spacing:-0.3px}
.brand-icon{display:grid;place-items:center;width:30px;height:30px;border-radius:8px;background:var(--accent);color:#fff;font-style:normal;font-size:14px;font-weight:700}
.brand-icon img{width:100%;height:100%;display:block;object-fit:cover;border-radius:inherit}
.brand-logo-preview{width:44px;height:44px;border-radius:12px;font-size:18px;flex-shrink:0}
.workspace{padding:0 10px;color:var(--light);font-size:11px;text-transform:uppercase;letter-spacing:0.5px;margin-bottom:4px}
.nav{margin-top:8px;flex:1}
.nav-item{display:flex;gap:10px;align-items:center;min-height:38px;margin:2px 0;padding:9px 12px;border-radius:var(--radius-md);color:var(--muted);text-decoration:none;font-size:13.5px;font-weight:500;transition:all .15s;cursor:pointer;border:none;background:none;width:100%;font-family:inherit}
.nav-item:hover{background:var(--paper);color:var(--ink);box-shadow:var(--shadow)}
.nav-item.active{background:var(--paper);color:var(--accent-ink);box-shadow:var(--shadow);font-weight:600}
.nav-item.active::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:16px;background:var(--accent);border-radius:0 3px 3px 0}
.nav-item svg{width:17px;height:17px;opacity:.7;flex-shrink:0}
.nav-item.active svg{opacity:1;stroke:var(--accent)}
/* 二级菜单 */
.nav-caret{margin-left:auto;font-size:11px;color:var(--light);transition:transform .2s}
/* 分组标题（可折叠） */
.nav-group-label{padding:0 10px;margin:10px 0 6px;color:var(--light);font-size:10.5px;font-weight:600;letter-spacing:0.8px}
.nav-group-toggle{display:flex;align-items:center;width:100%;padding:0 10px;margin:10px 0 6px;color:var(--light);font-size:10.5px;font-weight:600;letter-spacing:0.8px;background:none;border:none;cursor:pointer;font-family:inherit;text-align:left;transition:color .15s}
.nav-group-toggle:hover{color:var(--muted)}
.nav-group-toggle.collapsed .nav-caret{transform:rotate(-90deg)}
.nav-item:has(+ .nav-sub.open) .nav-caret{transform:rotate(90deg)}
.nav-sub{display:none;padding:2px 0 4px 30px}
.nav-sub.open{display:block}
.nav-sub-item{display:block;width:100%;text-align:left;padding:7px 12px;margin:1px 0;border:none;background:none;border-radius:var(--radius-md);color:var(--muted);font-size:12.5px;font-family:inherit;cursor:pointer;transition:all .15s;position:relative}
.nav-sub-item::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:4px;height:4px;border-radius:50%;background:var(--line)}
.nav-sub-item:hover{background:var(--paper);color:var(--ink)}
.nav-sub-item.active{background:var(--accent-light);color:var(--accent-ink);font-weight:600}
.nav-sub-item.active::before{background:var(--accent)}
[data-theme="dark"] .nav-sub-item:hover{background:#1f2935}
[data-theme="dark"] .nav-sub-item.active{background:#1f2935}
.side-foot{padding:20px 10px 0;color:var(--light);font-size:11px;line-height:1.7;border-top:1px solid var(--line);margin-top:auto}
.side-foot strong{color:var(--muted);font-weight:500}

/* ===== 页面头部 ===== */
.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:28px;flex-wrap:wrap}
.page-head h1{margin:0;font-size:26px;font-weight:700;letter-spacing:-0.5px}
.page-head .sub{margin-top:6px;color:var(--muted);font-size:13.5px}

/* ===== 按钮 ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:9px 18px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--paper);color:var(--ink);font:inherit;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s;white-space:nowrap}
.btn:hover{border-color:var(--accent);color:var(--accent-ink);box-shadow:var(--shadow)}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important;box-shadow:none}
.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 1px 2px rgba(13,148,136,0.2)}
.btn-primary:hover{background:#115e59;border-color:#115e59;transform:translateY(-1px);box-shadow:0 4px 12px rgba(13,148,136,0.25)}
.btn-danger{background:var(--red-bg);border-color:var(--red-bg);color:var(--red-ink)}
.btn-danger:hover{background:var(--red);border-color:var(--red);color:#fff}
.btn-sm{padding:5px 10px;font-size:12px;border-radius:var(--radius-sm)}
.btn-ghost{padding:6px 10px;border:none;background:transparent;color:var(--muted);font-size:12px}
.btn-ghost:hover{background:var(--bg);color:var(--ink)}

/* 设备页：列表 / 型号统计 分段切换 */
.seg{display:inline-flex;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:3px;gap:3px}
.seg-btn{border:none;background:transparent;color:var(--muted);font:inherit;font-size:13px;font-weight:600;padding:6px 18px;border-radius:8px;cursor:pointer;transition:all .15s}
.seg-btn:hover{color:var(--ink)}
.seg-btn.active{background:var(--paper);color:var(--accent-ink);box-shadow:var(--shadow-hover)}

/* ===== 卡片 ===== */
.card{padding:22px;border:1px solid var(--line);border-radius:var(--radius-xl);background:var(--paper);box-shadow:var(--card-shadow);margin-bottom:16px;transition:box-shadow .2s}
.card-hover:hover{box-shadow:var(--shadow-hover)}
.card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:18px;flex-wrap:wrap;gap:8px}
.card-header h2{margin:0;font-size:15px;font-weight:600}
.card-header .sub{margin-top:2px;font-size:12.5px;color:var(--muted)}

/* ===== 表格 ===== */
.table-wrap{border:1px solid var(--line);border-radius:var(--radius-xl);background:var(--paper);box-shadow:var(--shadow);overflow-x:auto;margin-bottom:16px}
.table-wrap .card-header{padding:16px 20px;border-bottom:1px solid var(--line-soft)}
table{width:100%;border-collapse:collapse;font-size:13.5px}
.table-wrap table{font-size:14px}
.table-wrap th{font-size:13px}
.table-wrap td{font-size:14px}
th{padding:12px 16px;text-align:left;background:var(--bg);color:var(--muted);font-size:11.5px;font-weight:600;border-bottom:1px solid var(--line);white-space:nowrap;letter-spacing:0.3px;text-transform:uppercase}
td{padding:14px 16px;border-bottom:1px solid var(--line-soft);vertical-align:middle}
tr:hover td{background:#fafaf9}
tr:last-child td{border-bottom:none}

/* ===== 表单 ===== */
.form-group{margin-bottom:16px}
.form-group label{display:block;margin-bottom:6px;font-size:12.5px;font-weight:600;color:var(--ink)}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--paper);color:var(--ink);font:inherit;font-size:13px;outline:none;transition:all .2s}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(13,148,136,0.08)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-row-3{grid-template-columns:repeat(3,1fr)}

/* ===== 新建订单弹窗分区样式 ===== */
.order-modal{max-width:min(760px,94vw)}
.order-modal .modal-body{padding:20px;max-height:calc(100vh - 170px);overflow-y:auto;background:#fafbfc}
.order-section{background:var(--paper);border:1px solid var(--line-soft);border-radius:var(--radius-lg);padding:18px 20px;margin-bottom:14px}
.order-section:last-child{margin-bottom:0}
.order-section.sec-blue{background:#f4f8fd;border-color:#e3edf8}
.order-section.sec-green{background:#f3faf6;border-color:#e2f2ea}
.order-section.sec-purple{background:#f7f5fb;border-color:#ece7f5}
.order-section-title{margin:0 0 14px;font-size:14px;font-weight:700;color:var(--ink)}
.order-section .form-group{margin-bottom:14px}
.order-section .form-group:last-child{margin-bottom:0}
.order-hint{font-size:12px;color:var(--muted);margin:6px 0 8px}
.order-hint.ok{color:var(--green-ink)}
.order-hint.warn{color:var(--red-ink)}
.day-grid{display:grid;grid-template-columns:repeat(10,1fr);gap:8px;margin-bottom:14px}
.day-btn{padding:9px 0;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--paper);color:var(--ink);font-size:13px;font-weight:500;cursor:pointer;transition:.15s;text-align:center}
.day-btn:hover{border-color:var(--accent);color:var(--accent-ink)}
.day-btn.active{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:700}
.ship-options{display:flex;gap:10px;flex-wrap:wrap}
.ship-opt{display:flex;align-items:center;gap:7px;padding:9px 18px;border:1px solid var(--line);border-radius:999px;background:var(--paper);cursor:pointer;font-size:13px;color:var(--muted);transition:.15s;user-select:none}
.ship-opt input{display:none}
.ship-opt.active{border-color:var(--accent);color:var(--accent-ink);background:var(--accent-light);font-weight:600}
.ship-acc{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--paper);font-size:12.5px;color:var(--muted);cursor:pointer;transition:.15s;user-select:none}
.ship-acc input{width:14px;height:14px;accent-color:var(--accent);margin:0}
.ship-acc:has(input:checked){border-color:var(--accent);color:var(--accent-ink);background:var(--accent-light);font-weight:600}
.toggle-switch{position:relative;width:40px;height:22px;display:inline-block;flex-shrink:0}
.toggle-switch input{display:none}
.toggle-switch .ts-track{position:absolute;inset:0;border-radius:999px;background:#cbd5d1;transition:.2s;cursor:pointer}
.toggle-switch .ts-track::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.toggle-switch input:checked + .ts-track{background:var(--accent)}
.toggle-switch input:checked + .ts-track::after{left:21px}

/* 客户信息点击复制 */
.copy-contact{border-radius:8px;padding:2px 6px;margin:-2px -6px;transition:background .15s}
.copy-contact:hover{background:var(--accent-light)}
@keyframes copyTipIn{0%{visibility:hidden;transform:translateY(4px)}12%{visibility:visible;transform:translateY(0)}80%{visibility:visible}100%{visibility:hidden}}

/* ===== 标签 ===== */
.tag{display:inline-flex;align-items:center;padding:4px 10px;border-radius:20px;font-size:11.5px;font-weight:600}
/* fix166：套餐等级标签 —— 变量驱动，深色模式自动切暗底 + 亮字 */
.plan-tag-basic{background:var(--plan-basic-bg);color:var(--plan-basic-fg)}
.plan-tag-standard{background:var(--plan-standard-bg);color:var(--plan-standard-fg)}
.plan-tag-pro{background:var(--plan-pro-bg);color:var(--plan-pro-fg)}
.plan-tag-flagship{background:var(--plan-flagship-bg);color:var(--plan-flagship-fg)}
.tag-green{background:var(--green-bg);color:var(--green-ink)}
.tag-orange{background:var(--orange-bg);color:var(--orange-ink)}
.tag-red{background:var(--red-bg);color:var(--red-ink)}
.tag-blue{background:var(--blue-bg);color:var(--blue-ink)}
.tag-gray{background:var(--line-soft);color:var(--muted)}
/* fix192：随心换（保障）标记 —— 设备列表产品名后的「保」角标，悬停/点击看到期时间 */
.care-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;margin-left:6px;border-radius:6px;background:var(--green-bg);color:var(--green-ink);border:1px solid color-mix(in srgb,var(--green) 36%,transparent);font-size:10.5px;font-weight:700;line-height:1;cursor:pointer;user-select:none;vertical-align:2px;white-space:nowrap}
.care-badge:hover{filter:brightness(0.97)}
.care-badge.expired{background:var(--line-soft);color:var(--light);border-color:var(--line)}
/* v223：设备列表状态小标记（保/修/换/售）共用 care-badge 布局，仅换配色 */
.badge-repair{background:var(--orange-bg);color:var(--orange-ink);border-color:color-mix(in srgb,var(--orange) 36%,transparent)}
.badge-swap{background:var(--blue-bg);color:var(--blue-ink);border-color:color-mix(in srgb,var(--blue) 36%,transparent)}
.badge-sold{background:var(--line-soft);color:var(--muted);border-color:var(--line)}
.badge-preship{background:var(--blue-bg);color:var(--blue-ink);border-color:color-mix(in srgb,var(--blue) 36%,transparent)}

/* ===== 统计卡片 ===== */
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px}
/* fix166：统计卡质感对齐数据看板 —— 14px 圆角 + 双层柔和阴影 + 悬停微浮起。
   内联的语义色渐变底已改为 var(--card-grad-*) 变量驱动，深色模式自动走暗色档。 */
.stat-card{padding:22px;border:1px solid var(--line);border-radius:14px;background:var(--paper);box-shadow:var(--card-shadow);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.stat-card:hover{transform:translateY(-2px);box-shadow:var(--card-shadow-hover)}
.stat-label{color:var(--muted);font-size:12px;margin-bottom:8px;font-weight:500}
.stat-value{font-size:28px;font-weight:700;margin-bottom:6px;letter-spacing:-0.5px}
.stat-value.accent{color:var(--accent-ink)}
.stat-value.green{color:var(--green-ink)}
.stat-value.orange{color:var(--orange-ink)}
.stat-value.red{color:var(--red-ink)}
.stat-desc{font-size:12px;color:var(--light)}

/* ===== 筛选工具栏 ===== */
.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:12px}
.search-box{position:relative}
.search-box input{padding:9px 12px 9px 36px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--paper);color:var(--ink);font:inherit;width:280px;outline:none;transition:all .2s;font-size:13px}
.search-box input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(13,148,136,0.08)}
.search-box::before{content:"🔍";position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:13px;opacity:.4}
.filter-group{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.filter-group select{padding:9px 28px 9px 12px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--paper);color:var(--ink);font:inherit;font-size:13px;cursor:pointer;outline:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}
.chips{display:flex;flex-wrap:wrap;gap:6px}
/* 产品分类标签选择器（录入设备「选择型号」/ 新建订单「选择产品」共用同一套 markup）
   桌面端即为原来的内联样式；手机端在 ≤850px 媒体查询里瘦身，让 8 个分类排 2 行 */
.prod-cats{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.chip{padding:5px 12px;border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--muted);font:inherit;font-size:12.5px;cursor:pointer;transition:.2s}
.chip:hover{border-color:var(--accent);color:var(--accent-ink)}
.chip.active{background:var(--ink);border-color:var(--ink);color:#fff}

/* ===== 分页 ===== */
.pagination{padding:14px 20px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line-soft)}
.page-info{color:var(--light);font-size:12px}
.page-btns{display:flex;gap:6px}
.page-btns button{padding:6px 12px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--paper);color:var(--ink);font:inherit;font-size:12px;cursor:pointer;transition:.2s}
.page-btns button:hover:not(:disabled){border-color:var(--accent);color:var(--accent-ink)}
.page-btns button:disabled{opacity:.4;cursor:not-allowed}
.page-btns button.active{background:var(--ink);color:#fff;border-color:var(--ink)}

/* ===== 侧滑抽屉 ===== */
.drawer-overlay{position:fixed;inset:0;background:rgba(15,23,42,0.28);display:none;z-index:99}
.drawer-overlay.show{display:block}
.drawer{position:fixed;top:0;right:0;width:100%;max-width:720px;height:100vh;background:var(--bg);border-left:1px solid var(--line);box-shadow:var(--shadow-drawer);overflow-y:auto;z-index:100;animation:drawerIn .35s cubic-bezier(.4,0,.2,1);display:none}
.drawer.show{display:block}
@keyframes drawerIn{from{transform:translateX(100%)}to{transform:translateX(0)}}
.drawer-header{padding:24px 28px;background:var(--paper);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:flex-start;position:sticky;top:0;z-index:2}
.drawer-close{width:36px;height:36px;border:none;border-radius:var(--radius-md);background:var(--bg);color:var(--muted);font-size:20px;cursor:pointer;display:grid;place-items:center;transition:.2s;flex-shrink:0}
.drawer-close:hover{background:var(--line);color:var(--ink)}
.drawer-body{padding:24px 28px 40px}

/* ===== 弹窗 ===== */
.modal-overlay{position:fixed;inset:0;background:rgba(15,23,42,0.28);display:none;align-items:center;justify-content:center;z-index:100;padding:20px}
.modal-overlay.show{display:flex}
/* 弹窗统一为右侧抽拉式 */
.modal{width:100%;max-width:520px;background:var(--paper);border-radius:0;box-shadow:var(--shadow-drawer);overflow:hidden;animation:drawerIn .32s cubic-bezier(.4,0,.2,1);border:none;border-left:1px solid var(--line);position:fixed;top:0;right:0;height:100dvh;display:flex;flex-direction:column}
.modal-lg,.order-modal{max-width:min(760px,100vw)}
/* 例外：居中弹窗（如今日归还提醒），保持传统居中样式 */
.modal.modal-center{position:static;top:auto;right:auto;height:auto;max-height:calc(100dvh - 48px);max-width:520px;border-radius:16px;border:none;box-shadow:var(--shadow-modal);animation:modalIn .24s ease}
.modal.modal-center .modal-body{flex:none;overflow-y:auto}
.modal-body{overflow-y:auto;flex:1}
.order-modal .modal-body{max-height:none}
@keyframes modalIn{from{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
.modal-header{padding:20px 24px;border-bottom:1px solid var(--line-soft);display:flex;justify-content:space-between;align-items:center;flex-shrink:0}
.modal-header h3{margin:0;font-size:16px;font-weight:600}
.modal-close{width:32px;height:32px;border:none;border-radius:var(--radius-sm);background:var(--bg);color:var(--muted);font-size:18px;cursor:pointer;display:grid;place-items:center;transition:.2s}
.modal-close:hover{background:var(--line);color:var(--ink)}
.modal-body{padding:24px}
.modal-footer{padding:16px 24px;border-top:1px solid var(--line-soft);display:flex;justify-content:flex-end;gap:10px;flex-shrink:0}

/* ===== 设备/用户信息展示 ===== */
.info-row{display:flex;align-items:center;gap:12px}
.info-avatar{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#0f766e,#115e59);color:#fff;display:grid;place-items:center;font-size:16px;font-weight:700;flex-shrink:0;box-shadow:0 2px 8px rgba(13,148,136,0.2)}
.info-avatar.gray{background:linear-gradient(135deg,#6b7280,#9ca3af);box-shadow:0 2px 8px rgba(0,0,0,0.06)}
.info-avatar.red{background:linear-gradient(135deg,#ef4444,#fca5a5);box-shadow:0 2px 8px rgba(239,68,68,0.2)}
.info-name{font-weight:600;color:var(--ink);margin-bottom:2px;font-size:13.5px}
.info-meta{color:var(--light);font-size:12px}

/* ===== 时间线 ===== */
.timeline{position:relative;padding-left:20px;margin-bottom:24px}
.timeline::before{content:"";position:absolute;left:5px;top:4px;bottom:4px;width:2px;background:var(--line);border-radius:1px}
.timeline-item{position:relative;margin-bottom:16px;padding-left:16px}
.timeline-item::before{content:"";position:absolute;left:-20px;top:5px;width:10px;height:10px;border-radius:50%;background:var(--paper);border:2px solid var(--accent)}
.timeline-item.blue::before{border-color:var(--blue)}
.timeline-item.red::before{border-color:var(--red)}
.timeline-date{font-size:11.5px;color:var(--light);margin-bottom:2px}
.timeline-text{font-size:13px;color:var(--ink);font-weight:500}
.timeline-sub{font-size:12px;color:var(--muted);margin-top:2px}

/* ===== Tab 切换 ===== */
/* fix134：窄屏时标签栏横向滑动，避免最后一个标签（如设置页「账号安全」）被挤出屏幕 */
.tab-bar{display:flex;gap:4px;margin-bottom:20px;border-bottom:1px solid var(--line);padding-bottom:0;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}
.tab-bar::-webkit-scrollbar{display:none}
.tab-bar button{padding:10px 18px;border:none;border-bottom:2px solid transparent;background:none;color:var(--muted);font:inherit;font-size:13px;font-weight:500;cursor:pointer;transition:.2s;margin-bottom:-1px;flex:0 0 auto;white-space:nowrap}
.tab-bar button.active{color:var(--accent-ink);border-bottom-color:var(--accent)}
.tab-bar button:hover:not(.active){color:var(--ink)}
.tab-panel{display:none}
.tab-panel.active{display:block;animation:fadeIn .25s ease}

/* ===== 图表 ===== */
.chart-container{height:220px;display:flex;align-items:flex-end;justify-content:space-around;padding:10px 0 0;gap:8px}
.chart-bar-wrapper{display:flex;flex-direction:column;align-items:center;flex:1;min-width:0}
.chart-bar{width:32px;background:var(--accent);border-radius:6px 6px 0 0;min-height:4px;position:relative;transition:height .5s cubic-bezier(.4,0,.2,1);opacity:.85}
.chart-bar:hover{opacity:1}
.chart-bar::after{content:attr(data-value);position:absolute;top:-24px;left:50%;transform:translateX(-50%);font-size:11px;font-weight:700;color:var(--ink);white-space:nowrap}
.chart-count{margin-top:10px;font-size:11px;color:var(--light);text-align:center}
.chart-count span{display:block;color:var(--ink);font-weight:600;margin-bottom:2px;font-size:12px}

/* ===== 进度条 ===== */
.progress{height:6px;background:var(--line-soft);border-radius:3px;overflow:hidden}
.progress-fill{height:100%;background:linear-gradient(90deg,var(--accent),color-mix(in oklab,var(--accent) 52%,#fff));border-radius:3px}
[data-theme="dark"] .progress-fill{background:linear-gradient(90deg,var(--accent),color-mix(in oklab,var(--accent) 68%,#000))}

/* ===== 空状态 ===== */
.empty{padding:80px 20px;text-align:center;color:var(--muted)}
.empty-icon{font-size:48px;margin-bottom:16px;opacity:.25}
.empty h3{margin:0 0 8px;font-size:18px;color:var(--ink);font-weight:600}
.empty p{margin:0;color:var(--light)}

/* ===== 移动端顶栏与导航抽屉 ===== */
.mobile-topbar{display:none}
.nav-scrim{display:none}

/* ===== 响应式 ===== */
@media(max-width:1100px){
  .stat-grid{grid-template-columns:repeat(2,1fr)}
  .form-row{grid-template-columns:1fr}
}
@media(max-width:850px){
  .app{grid-template-columns:1fr}

  /* 顶栏 */
  .mobile-topbar{display:flex;align-items:center;gap:12px;padding:10px 14px;background:var(--sidebar);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:90}
  .mtb-btn{width:38px;height:38px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--paper);font-size:17px;color:var(--ink);cursor:pointer;display:grid;place-items:center;flex-shrink:0}
  .mtb-brand{display:flex;align-items:center;gap:8px;font-size:15.5px;font-weight:700;letter-spacing:-0.3px}
  .mtb-user{margin-left:auto;white-space:nowrap}

  /* 侧边栏变抽屉 */
  .app-nav{position:fixed;top:0;left:0;bottom:0;width:min(280px,82vw);height:100dvh;z-index:120;transform:translateX(-105%);transition:transform .28s cubic-bezier(.4,0,.2,1);box-shadow:none;padding-top:14px}
  .app-nav .brand{display:none}
  .app-nav.mobile-open{transform:translateX(0);box-shadow:var(--shadow-drawer)}
  .nav-scrim{display:block;position:fixed;inset:0;background:rgba(0,0,0,0.3);backdrop-filter:blur(2px);z-index:110;opacity:0;pointer-events:none;transition:opacity .25s}
  .nav-scrim.show{opacity:1;pointer-events:auto}

  main{padding:16px 14px 100px}
  .page-head{margin-bottom:18px;gap:10px}
  .page-head h1{font-size:21px}
  .page-head .sub{font-size:12px}

  .stat-grid{grid-template-columns:1fr 1fr;gap:10px}
  .stat-card{padding:14px}
  .stat-value{font-size:21px}
  .card{padding:16px}
  .card-header{margin-bottom:12px}

  /* 工具栏与搜索 */
  .toolbar{flex-direction:column;align-items:stretch}
  .search-box input{width:100%}

  /* 表格：可横向滑动 + 滑动提示 */
  .table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
  table{min-width:700px}
  th,td{padding:10px 12px}

  /* 抽屉与弹窗全屏化 */
  .drawer{max-width:100%}
  .modal-overlay{padding:0}
  .modal{max-width:100%!important}
  .modal-body{overflow-y:auto;flex:1;padding:18px 16px}
  .modal-footer{padding:12px 16px calc(12px + env(safe-area-inset-bottom))}
  .order-modal .modal-body{max-height:none}
  .modal-lg{max-width:100%!important}

  /* 表单：手机上输入放大字号防 iOS 自动缩放，单列布局 */
  .form-group input,.form-group select,.form-group textarea{font-size:16px}
  .form-row,.form-row-3{grid-template-columns:1fr}

  /* 租期天数按钮：5 列 */
  .day-grid{grid-template-columns:repeat(5,1fr)}
  .day-btn{padding:11px 0}

  /* 客户账号导航权限网格：2 列 */
  #rgNavPerms{grid-template-columns:1fr 1fr!important}

  /* 产品分类标签：瘦身，让 8 个分类在手机上排 2 行（原来 40px 高的胶囊撑着 2~3 行）
     用 inline-flex + 固定 height 才能压住 emoji 字体的行盒高度（line-height 锁不住）；
     必须同时写 min-height —— 下方全局点按目标规则（button/.btn/.chip/select 统一 min-height:40px）
     优先级高于 height，漏了它 chip 还是 40px 高 */
  .prod-cats{gap:6px;margin-bottom:10px}
  .prod-cats .chip{display:inline-flex;align-items:center;height:28px;min-height:28px;padding:0 7px;font-size:11.5px;line-height:1;white-space:nowrap;flex-shrink:0}

  /* 产品选择区收紧内边距，给「品牌 + 型号」腾出横向空间（原文案在 393px 下右侧被裁断） */
  .order-section{padding:12px}
  .order-modal .modal-body{padding:14px}

  /* 型号/产品下拉：选项允许折行，不再被裁；行高收紧（列表整体高度由 JS 按结果数动态设 size，
     手机上上限 4 行 —— 393px 下 6 行 = 225px，360px 下选项折行后高达 339px，会把列表顶出屏幕） */
  #addLibraryId option,#orderProduct option{white-space:normal;padding:5px 10px;line-height:1.35}

  /* 产品选择的搜索框与底部提示行（fix115：搜索框加高一档更好点中，提示行与列表拉开间距，
     缓解「分类标签 + 搜索 + 下拉 + 提示」堆在一起的拥挤感） */
  .prod-search{padding:9px 12px 9px 34px!important;line-height:1.3;border-radius:10px!important}
  .prod-hint{font-size:11px!important;margin-top:6px!important}

  /* 筛选 chips 可横向滚动 */
  .chips,.filter-group{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px}
  .chip,.filter-group .btn{flex-shrink:0}

  /* 分页紧凑 */
  .pagination{flex-direction:column;gap:10px;align-items:flex-start}

  /* 时间线、图表间距 */
  .chart-container{gap:4px}
  .chart-bar{width:20px}
  .timeline{padding-left:16px}

  /* 通知/看板等 grid 自适应 */
  [style*="grid-template-columns:repeat(5"]{grid-template-columns:repeat(3,1fr)!important}
  [style*="grid-template-columns:repeat(4"]{grid-template-columns:1fr 1fr!important}
  [style*="grid-template-columns:repeat(3"]{grid-template-columns:1fr 1fr!important}

  /* 并排卡片窄屏改纵向（今日待发/逾期未还、详情页双列信息等） */
  [style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr!important;gap:10px!important}
  /* 自动宽度标签列保持原样（订单详情里的「客户/电话」信息格） */
  [style*="grid-template-columns:auto 1fr"]{grid-template-columns:auto 1fr!important;gap:4px 12px!important}

  /* 大按钮更易点按 */
  .btn{padding:10px 16px}
  .btn-sm{padding:7px 12px}
}
@media(max-width:380px){
  .stat-grid{grid-template-columns:1fr}
}

/* ===== 动画 ===== */
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.page-enter{animation:fadeIn .35s cubic-bezier(.4,0,.2,1)}

/* ===== 首页数据看板卡片 ===== */
.dashboard-page{--dash-card-border:color-mix(in srgb,var(--line) 82%,transparent);--dash-card-shadow:0 1px 2px rgba(15,23,42,.03),0 10px 28px rgba(15,23,42,.045);--dash-card-shadow-hover:0 12px 34px rgba(15,23,42,.09),0 2px 8px rgba(15,23,42,.04)}
.dashboard-page .dashboard-stat-grid{gap:14px}
.dashboard-page .stat-card{position:relative;isolation:isolate;min-height:148px;padding:21px 21px 18px;overflow:hidden;border:1px solid var(--dash-card-border)!important;border-top:none!important;box-shadow:var(--dash-card-shadow);background:linear-gradient(145deg,var(--paper) 0%,color-mix(in srgb,var(--paper) 94%,var(--accent-light)) 100%);transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s,border-color .22s}
.dashboard-page .stat-card::before{content:"";position:absolute;z-index:-1;width:92px;height:92px;right:-34px;top:-38px;border-radius:50%;background:currentColor;opacity:.075}
.dashboard-page .stat-card::after{content:"";position:absolute;left:21px;right:21px;bottom:0;height:3px;border-radius:999px 999px 0 0;background:currentColor;opacity:.7;transform:scaleX(.28);transform-origin:left;transition:transform .25s ease,opacity .25s}
.dashboard-page .stat-card:nth-child(1),.dashboard-page .stat-card:nth-child(5){color:var(--accent-ink)}
.dashboard-page .stat-card:nth-child(2),.dashboard-page .stat-card:nth-child(7){color:var(--orange-ink)}
.dashboard-page .stat-card:nth-child(3),.dashboard-page .stat-card:nth-child(8){color:var(--blue-ink)}
.dashboard-page .stat-card:nth-child(4){color:var(--red-ink)}
.dashboard-page .stat-card:nth-child(6){color:var(--green-ink)}
.dashboard-page .stat-card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,currentColor 24%,var(--line))!important;box-shadow:var(--dash-card-shadow-hover)}
.dashboard-page .stat-card:hover::after{transform:scaleX(1);opacity:1}
.dashboard-page .stat-label{display:flex;align-items:center;min-height:24px;margin-bottom:10px;font-size:12px;font-weight:650;letter-spacing:.04em}
.dashboard-page .stat-value{margin-bottom:8px;color:var(--ink)!important;font-size:29px;line-height:1.2;letter-spacing:-.8px;font-variant-numeric:tabular-nums}
.dashboard-page .stat-desc{line-height:1.45;color:var(--muted)}
/* 首页「沉睡会员」统计卡（仅平台超管，>0 时整体红色强调；含 ::before 圆点与 ::after 底条） */
.dashboard-page .stat-card-sleep,.dashboard-page .stat-card-sleep .stat-value{color:var(--red-ink)!important}
.dashboard-page .stat-card-sleep .stat-label{color:var(--red-ink)}
.dashboard-page > .card,.dashboard-page > div[style*="grid-template-columns"] > .card{border-color:var(--dash-card-border);box-shadow:var(--dash-card-shadow)}
.dashboard-page > .card:hover,.dashboard-page > div[style*="grid-template-columns"] > .card:hover{border-color:color-mix(in srgb,var(--accent) 16%,var(--line));box-shadow:0 10px 30px rgba(15,23,42,.065)}
.dashboard-page .card-header h2{font-size:15.5px;letter-spacing:-.15px}
.dashboard-page .card-header .sub{color:var(--light)}
.dashboard-page > div[style*="grid-template-columns:3fr 2fr"] .card{height:100%}
.dashboard-page > div[style*="grid-template-columns:3fr 2fr"] .card .btn{min-height:50px;border-color:var(--line-soft);background:color-mix(in srgb,var(--paper) 96%,var(--accent-light))}
.dashboard-page > div[style*="grid-template-columns:3fr 2fr"] .card .btn:hover{border-color:color-mix(in srgb,var(--accent) 38%,var(--line));background:var(--accent-light);transform:translateY(-2px)}
[data-theme="dark"] .dashboard-page{--dash-card-shadow:0 1px 2px rgba(0,0,0,.22),0 12px 30px rgba(0,0,0,.16);--dash-card-shadow-hover:0 14px 36px rgba(0,0,0,.3)}
@media(max-width:850px){.dashboard-page .dashboard-stat-grid{gap:10px}.dashboard-page .stat-card{min-height:132px;padding:17px 16px 15px}.dashboard-page .stat-card::after{left:16px;right:16px}.dashboard-page .stat-value{font-size:24px}.dashboard-page .stat-desc{font-size:11.5px}}
@media(max-width:480px){.dashboard-page .dashboard-stat-grid{grid-template-columns:1fr 1fr}.dashboard-page .stat-card{min-height:126px}}
@media(prefers-reduced-motion:reduce){.dashboard-page .stat-card,.dashboard-page .stat-card::after{transition:none}.dashboard-page .stat-card:hover{transform:none}}
/* fix165 看板配色全部收敛到变量层：随「设置 → 外观主题」联动（6 套主题 + 深色模式）。
   规范：语义色（订单=蓝 / 租金=绿 / 三族圆点）保持固定色相，深色模式另给一套值；
   其余「主题色」一律走 var(--accent) 派生，换皮肤时图表、进度条、光晕自动跟着变。 */
.dashboard-page{
  /* 大卡·累计订单（蓝族语义色）—— 字色按 WCAG AA 调深（原 #2f6fd0 仅 4.3:1，标题过淡） */
  --dash-blue-bg:#eaf2fe; --dash-blue-bd:#dbe7fb; --dash-blue-ink:#2563c9; --dash-blue-sub:#5b7cab;
  --dash-blue-deco-1:rgba(59,130,246,.22); --dash-blue-deco-2:rgba(59,130,246,.13);
  /* 大卡·累计租金收入（绿族语义色）—— 同上，原 #2f9e6a 仅 3.1:1 */
  --dash-green-bg:#e9f7ef; --dash-green-bd:#d7efe1; --dash-green-ink:#1c7f52; --dash-green-sub:#4a8365;
  --dash-green-deco-1:rgba(16,163,74,.22); --dash-green-deco-2:rgba(16,163,74,.13);
  /* 大卡正文数值 + 分隔线强度 */
  --dash-strong-ink:#16233c; --dash-hr-op:.17;
  /* 右侧小卡：底色取 -paper 混一点当前主题的 accent-light，边框/悬停走主题线色与强调色 */
  --dash-mini-bg:linear-gradient(180deg,var(--paper) 0%,color-mix(in srgb,var(--paper) 95%,var(--accent-light)) 100%);
  --dash-mini-bd:var(--dash-card-border);
  --dash-mini-bd-hover:color-mix(in srgb,var(--accent) 26%,var(--line));
  --dash-mini-sh:0 1px 2px rgba(16,24,40,.04),0 8px 20px -14px rgba(16,24,40,.18);
  --dash-mini-sh-hover:0 2px 5px rgba(16,24,40,.06),0 16px 30px -16px rgba(16,24,40,.26);
  /* 回本进度条轨道 */
  --dash-track:var(--line-soft);
  /* 小卡三族圆点：设备类=蓝 / 运营类=青 / 资产类=琥珀 */
  --dash-col1:#3b82f6; --dash-col2:#14b8a6; --dash-col3:#f59e0b;
  --dash-col1-glow:rgba(59,130,246,.15); --dash-col2-glow:rgba(20,184,166,.15); --dash-col3-glow:rgba(245,158,11,.17);
  --dash-col-deco-op:.09;
  /* 图表：轴线文字、网格线、柱子渐变全部由 --accent 派生（换主题即换色） */
  --dash-chart-axis:var(--muted); --dash-chart-axis-dim:var(--light);
  --dash-chart-grid:var(--line); --dash-chart-grid-soft:var(--line-soft);
  --dash-bar-to:color-mix(in oklab,var(--accent) 52%,#fff);
  --dash-bar-mute-from:color-mix(in oklab,var(--accent) 36%,#fff);
  --dash-bar-mute-to:color-mix(in oklab,var(--accent) 14%,#fff);
  /* 设备分类占比：8 色分类数据色（多色是为区分扇区，不随强调色变，只在暗色下降一档饱和度） */
  --dash-cat-1:#b0e870; --dash-cat-2:#30f0d0; --dash-cat-3:#c0d030; --dash-cat-4:#a0f0c8;
  --dash-cat-5:#7fc94a; --dash-cat-6:#1fbfa4; --dash-cat-7:#9aa825; --dash-cat-8:#4fbf92;
  /* 饼图光晕与投影：浅色靠白色发光，暗色换成极低透明度，避免夜里出现白圈 */
  --dash-pie-halo:rgba(255,255,255,.42); --dash-pie-halo-hover:rgba(255,255,255,.55);
  --dash-pie-core-halo:rgba(255,255,255,.32);
  --dash-pie-sh:rgba(15,23,42,.13); --dash-pie-sh-hover:rgba(15,23,42,.2); --dash-pie-core-sh:rgba(15,23,42,.1);
  --dash-pie-sh-soft:rgba(15,23,42,.06);
}
[data-theme="dark"] .dashboard-page{
  --dash-blue-bg:rgba(59,130,246,.13); --dash-blue-bd:rgba(59,130,246,.28);
  --dash-blue-ink:#7db1f7; --dash-blue-sub:#8fa8c9;
  --dash-blue-deco-1:rgba(59,130,246,.2); --dash-blue-deco-2:rgba(59,130,246,.11);
  --dash-green-bg:rgba(16,163,74,.13); --dash-green-bd:rgba(16,163,74,.28);
  --dash-green-ink:#5cc98f; --dash-green-sub:#8fb5a1;
  --dash-green-deco-1:rgba(16,163,74,.2); --dash-green-deco-2:rgba(16,163,74,.11);
  --dash-strong-ink:var(--ink); --dash-hr-op:.24;
  --dash-mini-bg:linear-gradient(180deg,var(--paper) 0%,color-mix(in srgb,var(--paper) 92%,#000) 100%);
  --dash-mini-bd-hover:color-mix(in srgb,var(--accent) 32%,var(--line));
  --dash-mini-sh:0 1px 2px rgba(0,0,0,.2),0 8px 20px -14px rgba(0,0,0,.4);
  --dash-mini-sh-hover:0 2px 6px rgba(0,0,0,.28),0 16px 30px -16px rgba(0,0,0,.5);
  --dash-track:var(--line);
  --dash-col1:#60a5fa; --dash-col2:#2dd4bf; --dash-col3:#fbbf24;
  --dash-col1-glow:rgba(96,165,250,.18); --dash-col2-glow:rgba(45,212,191,.18); --dash-col3-glow:rgba(251,191,36,.2);
  --dash-col-deco-op:.15;
  --dash-bar-to:color-mix(in oklab,var(--accent) 68%,#000);
  --dash-bar-mute-from:color-mix(in oklab,var(--accent) 44%,#000);
  --dash-bar-mute-to:color-mix(in oklab,var(--accent) 24%,#000);
  --dash-cat-1:#9ed95e; --dash-cat-2:#2ad6bb; --dash-cat-3:#a9b92a; --dash-cat-4:#8edcb4;
  --dash-cat-5:#6fb43f; --dash-cat-6:#1aa98f; --dash-cat-7:#889225; --dash-cat-8:#45ab82;
  --dash-pie-halo:rgba(255,255,255,.13); --dash-pie-halo-hover:rgba(255,255,255,.2);
  --dash-pie-core-halo:rgba(255,255,255,.05);
  --dash-pie-sh:rgba(0,0,0,.45); --dash-pie-sh-hover:rgba(0,0,0,.6); --dash-pie-core-sh:rgba(0,0,0,.4);
  --dash-pie-sh-soft:rgba(0,0,0,.3);
}
/* fix163 数据看板顶部（按设计图）：左大卡(累计订单数) + 中大卡(累计租金收入) + 右侧 3×2 小卡 */
.dash-top{display:grid;grid-template-columns:1fr 1fr 1.55fr;gap:14px;align-items:stretch;margin-bottom:16px}
.dash-hero{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--radius-xl);padding:18px 20px;border:1px solid transparent;display:flex;flex-direction:column;min-height:152px;box-shadow:var(--dash-card-shadow)}
.dash-hero::before{content:"";position:absolute;right:22px;top:14px;width:52px;height:52px;border-radius:50%;z-index:-1}
.dash-hero::after{content:"";position:absolute;right:2px;top:40px;width:32px;height:32px;border-radius:50%;z-index:-1}
/* fix169：大卡主色统一收敛到 --c（= 该族的 ink 色，本身已随主题切换），
   徽章底 / 悬停染边 / 悬停柔光全部由它派生 —— 与财务管理收入分类卡的 --c 同一套写法。 */
.dash-hero-blue{--c:var(--dash-blue-ink);background:var(--dash-blue-bg);border-color:var(--dash-blue-bd)}
.dash-hero-blue::before{background:var(--dash-blue-deco-1)}
.dash-hero-blue::after{background:var(--dash-blue-deco-2)}
.dash-hero-green{--c:var(--dash-green-ink);background:var(--dash-green-bg);border-color:var(--dash-green-bd)}
.dash-hero-green::before{background:var(--dash-green-deco-1)}
.dash-hero-green::after{background:var(--dash-green-deco-2)}
.dash-hero-label{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600}
/* v262：图标徽章 —— 主色淡底圆角方块 + SVG 线性图标（.dash-ico），与设备管理统计卡同风格。 */
/* v262：图标徽章改为 SVG 线性图标（与设备管理 .inv-acard-icon 同风格描边图标） */
.dash-hero-label .dash-ico,.dash-mini-label .dash-ico{flex:none;display:grid;place-items:center;
  width:20px;height:20px;border-radius:6px;line-height:1;color:var(--c,var(--accent));
  background:color-mix(in srgb,var(--c,var(--accent)) 18%,transparent);
  transition:transform .2s cubic-bezier(.2,.8,.25,1),background .2s ease}
.dash-hero-label .dash-ico svg,.dash-mini-label .dash-ico svg{width:13px;height:13px}
.dash-hero-blue .dash-hero-label{color:var(--dash-blue-ink)}
.dash-hero-green .dash-hero-label{color:var(--dash-green-ink)}
.dash-hero-value{font-size:40px;font-weight:700;line-height:1.06;letter-spacing:-1.2px;margin-top:6px;color:var(--dash-strong-ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.dash-hero-hr{height:1px;margin:14px 0 12px;background:currentColor;opacity:var(--dash-hr-op)}
.dash-hero-blue .dash-hero-hr{color:var(--dash-blue-ink)}
.dash-hero-green .dash-hero-hr{color:var(--dash-green-ink)}
.dash-hero-sub{display:flex;gap:34px;margin-top:auto}
.dash-sub span{display:block;font-size:12.5px;margin-bottom:5px}
.dash-hero-blue .dash-sub span{color:var(--dash-blue-sub)}
.dash-hero-green .dash-sub span{color:var(--dash-green-sub)}
.dash-sub b{font-size:19px;font-weight:700;color:var(--dash-strong-ink);font-variant-numeric:tabular-nums}
/* fix164 小卡美化：渐变底 + 多层柔和阴影 + 悬停微浮起 + 按列（设备/运营/资产）配色圆点 */
.dash-mini-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);gap:12px}
.dash-mini{position:relative;isolation:isolate;overflow:hidden;background:var(--dash-mini-bg);border:1px solid var(--dash-mini-bd);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;justify-content:center;gap:7px;box-shadow:var(--dash-mini-sh);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.dash-mini::after{content:"";position:absolute;right:-24px;top:-28px;width:78px;height:78px;border-radius:50%;z-index:-1;opacity:var(--dash-col-deco-op)}
.dash-mini[data-col="1"]::after{background:var(--dash-col1)}
.dash-mini[data-col="2"]::after{background:var(--dash-col2)}
.dash-mini[data-col="3"]::after{background:var(--dash-col3)}
.dash-mini:hover{transform:translateY(-3px) scale(1.012);border-color:color-mix(in srgb,var(--c,var(--accent)) 44%,var(--line));box-shadow:var(--dash-mini-sh-hover),0 0 0 3px color-mix(in srgb,var(--c,var(--accent)) 11%,transparent)}
.dash-mini-label{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:500;color:var(--muted);white-space:nowrap}
/* fix169：小卡主色变量 —— 取代原来那个 6px 纯色圆点（它只够表示「属于哪一族」，
   而收入分类卡的徽章同时承担了「图标 + 主色」两件事）。徽章底 / 悬停染边 / 柔光全部由 --c 派生。 */
.dash-mini[data-col="1"]{--c:var(--dash-col1)}
.dash-mini[data-col="2"]{--c:var(--dash-col2)}
.dash-mini[data-col="3"]{--c:var(--dash-col3)}
.dash-mini-value{display:flex;align-items:center;gap:8px;font-size:26px;font-weight:700;color:var(--dash-strong-ink);letter-spacing:-.5px;line-height:1.12;font-variant-numeric:tabular-nums}
/* fix170：资产原值改为精确到元后位数变多（如 ¥1,286,400），按字符数降一档字号，避免撑破小卡。
   9~10 字符走 .num-m，>10 字符走 .num-s；阈值由 Dashboard.js 的 _costCls 判定。 */
.dash-mini-value.num-m{font-size:22px}
.dash-mini-value.num-s{font-size:18px}
.dash-mini-unit{font-size:13px;font-weight:500;color:var(--light);letter-spacing:0;margin-left:-4px}
/* fix168：回本进度条加长 —— 由固定 44px 改为「吃掉数值行剩余空间」（min 76px），
   数字短的时候能明显变长；外层是 flex，窄屏也不会把数字挤掉。 */
.dash-progress{flex:1 1 auto;width:auto;min-width:76px;height:7px;border-radius:999px;background:var(--dash-track);overflow:hidden;display:inline-block;margin-left:2px}
.dash-progress-fill{position:relative;display:block;height:100%;background:linear-gradient(90deg,#f59e0b,#fbbf24);border-radius:999px;box-shadow:0 0 6px rgba(245,158,11,.35);transition:filter .15s;transform-origin:left center;animation:dashBarGrow .72s cubic-bezier(.2,.75,.2,1) backwards}
/* 条内流光：让「进度」看起来是活的（不动画只影响视觉，宽度仍由数据决定） */
.dash-progress-fill::after{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.62),transparent);animation:dashBarShimmer 2.6s ease-in-out infinite}
.dash-progress-fill:hover{filter:brightness(1.06)}

/* ===== fix168：数据看板动效 =====
   原则：动画只加「份量感」，不改变任何布局尺寸，且全部可被 prefers-reduced-motion 关掉。
   注意所有入场动画都用 fill-mode:backwards —— 用 both/forwards 会把 transform 永久锁在
   终帧，导致 :hover 的上浮失效（这是 CSS 动画覆盖 hover 的经典坑）。 */
@keyframes dashRiseIn{from{opacity:0;transform:translateY(15px) scale(.986)}to{opacity:1;transform:none}}
@keyframes dashMiniRiseIn{from{opacity:0;transform:translateY(11px) scale(.972)}to{opacity:1;transform:none}}
@keyframes dashBarGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes dashBarShimmer{0%{transform:translateX(-115%)}62%,100%{transform:translateX(330%)}}
@keyframes dashDecoDrift{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-5px,6px,0)}}
@keyframes dashIcoBreath{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.07);opacity:.86}}

.dash-hero{transition:transform .22s cubic-bezier(.2,.8,.25,1),box-shadow .22s ease,border-color .22s ease;animation:dashRiseIn .54s cubic-bezier(.2,.8,.25,1) backwards}
.dash-hero:nth-child(2){animation-delay:.1s}
.dash-hero:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--c,var(--dash-blue-ink)) 44%,var(--dash-card-border));box-shadow:var(--dash-card-shadow-hover),0 0 0 3px color-mix(in srgb,var(--c,var(--dash-blue-ink)) 11%,transparent)}
/* 大卡右上角的两个装饰圆：缓慢漂移，给静态卡片一点呼吸 */
.dash-hero::before{animation:dashDecoDrift 7.5s ease-in-out infinite}
.dash-hero::after{animation:dashDecoDrift 9.5s ease-in-out infinite reverse}
.dash-hero:hover::before,.dash-hero:hover::after{opacity:1.25}

.dash-mini{animation:dashMiniRiseIn .48s cubic-bezier(.2,.8,.25,1) backwards;animation-delay:calc(var(--i,0) * 58ms)}
/* 三族圆点呼吸；hover 时换成人眼更容易捕捉的「放大 + 光晕扩散」 */
/* fix169：徽章取代了原来的 6px 圆点，呼吸幅度必须收窄（scale 1.34 放到 20px 方块上太闹）；
   并且悬停要先把 animation 停掉再放大 —— 否则 CSS 动画会在运行时压住 transform，hover 完全没有反馈。
   ⚠️ 选择器必须写成 .dash-mini[data-col]:hover（0,4,1），它才压得住下面三条
   .dash-mini[data-col="N"] .dash-mini-label::before（0,3,1）—— 写成 .dash-mini:hover（0,2,1）
   会被呼吸动画直接盖掉（本轮实测：hover 时 transform 停在动画当前帧 1.037，徽章纹丝不动）。 */
.dash-hero:hover .dash-hero-label::before,
.dash-mini[data-col]:hover .dash-mini-label::before{animation:none;transform:scale(1.12)}
.dash-mini[data-col="1"] .dash-mini-label::before{animation:dashIcoBreath 3.6s ease-in-out infinite}
.dash-mini[data-col="2"] .dash-mini-label::before{animation:dashIcoBreath 3.6s ease-in-out .4s infinite}
.dash-mini[data-col="3"] .dash-mini-label::before{animation:dashIcoBreath 3.6s ease-in-out .8s infinite}
.dash-mini:hover{transform:translateY(-3px) scale(1.012)}
/* hover 时卡片右下的装饰圆稍微显形，强化「亮起来」的感觉 */
.dash-mini::after{transition:opacity .22s ease,transform .32s cubic-bezier(.2,.8,.25,1)}
.dash-mini:hover::after{transform:scale(1.14);opacity:calc(var(--dash-col-deco-op) * 1.8)}

@media(prefers-reduced-motion:reduce){
  .dash-hero,.dash-mini,.dash-progress-fill,
  .dash-hero::before,.dash-hero::after,
  .dash-hero-label::before,.dash-mini-label::before,.dash-progress-fill::after{animation:none}
  .dash-hero:hover,.dash-mini:hover{transform:none}
  .dash-hero-label::before,.dash-mini-label::before{transition:none}
}
@media(max-width:680px){
  .dash-top{grid-template-columns:1fr;gap:12px}
  .dash-hero{min-height:134px;padding:16px 18px}
  .dash-hero-value{font-size:32px}
  .dash-hero-sub{gap:28px}
  /* 手机端按列填充：左列=设备类指标组、右列=运营/资产组，与设计图的两组对应 */
  .dash-mini-grid{grid-template-columns:1fr 1fr;grid-template-rows:repeat(3,1fr);grid-auto-flow:column;gap:10px}
  .dash-mini{padding:13px 14px}
  .dash-mini-value{font-size:23px}
  /* fix170：手机端 2 列布局卡片更窄，长金额再降一档（与桌面 .num-m/.num-s 对应） */
  .dash-mini-value.num-m{font-size:19px}
  .dash-mini-value.num-s{font-size:16px}
}

/* ===== v258：数据看板顶部卡片统一为「网站皮肤色 + 主色图标芯片」（与设备管理统计卡同款）=====
   底色一律 --bg（随皮肤/深浅自动跟随），边框 --line，主色只留在图标芯片、数值与悬停光晕上；
   悬停上浮幅度与设备管理一致（-4px），不加 overflow 裁切，避免第一行卡片被切。
   ⚠️ 选择器统一带 .dashboard-page 前缀（0,2,0+），才能压住上面 .dash-hero/.dash-mini 的同类声明。 */
.dashboard-page .dash-hero,
.dashboard-page .dash-mini{
  background:var(--bg);
  border:1px solid var(--line);
  box-shadow:var(--dash-card-shadow);
}
.dashboard-page .dash-hero{padding:16px 18px;min-height:140px}
.dashboard-page .dash-hero:hover{
  transform:translateY(-4px) scale(1.01);
  border-color:var(--line);
  box-shadow:var(--dash-card-shadow-hover),0 0 40px color-mix(in srgb,var(--c,var(--accent)) 25%,transparent);
  z-index:5;
}
/* 右上角装饰圆改极淡：保留层次感，不抢主色 */
.dashboard-page .dash-hero::before{opacity:.5}
.dashboard-page .dash-hero::after{opacity:.45}
.dashboard-page .dash-hero:hover::before,.dashboard-page .dash-hero:hover::after{opacity:.8}
/* 标题统一 muted（与设备管理卡片一致），颜色语义交给图标芯片 */
.dashboard-page .dash-hero-label,
.dashboard-page .dash-hero-blue .dash-hero-label,
.dashboard-page .dash-hero-green .dash-hero-label{color:var(--muted)}
.dashboard-page .dash-hero-hr{background:var(--line);opacity:1;margin:12px 0 10px}
.dashboard-page .dash-hero-value{font-size:30px;font-weight:800;line-height:1;letter-spacing:-1px}
.dashboard-page .dash-mini{padding:12px 14px}
.dashboard-page .dash-mini:hover{
  transform:translateY(-4px) scale(1.01);
  border-color:var(--line);
  box-shadow:var(--dash-card-shadow-hover),0 0 40px color-mix(in srgb,var(--c,var(--accent)) 25%,transparent);
  z-index:5;
}
/* v265：悬停颜色效果与设备管理对齐——图标芯片放大微旋 */
.dashboard-page .dash-hero:hover .dash-ico,
.dashboard-page .dash-mini:hover .dash-ico{transform:scale(1.1) rotate(5deg)}
.dashboard-page .dash-mini-value{font-size:30px;font-weight:800;letter-spacing:-1px;line-height:1}
.dashboard-page .dash-mini-value.num-m{font-size:26px}
.dashboard-page .dash-mini-value.num-s{font-size:22px}
/* v264：数值/标签字体与设备管理统计卡完全对齐（30px/800/-1px，标签 13px/600/.5px） */
.dashboard-page .dash-hero-label{font-size:13px;letter-spacing:.5px}
.dashboard-page .dash-mini-label{font-size:13px;font-weight:600;letter-spacing:.5px}
/* 金额里的 ¥ 与「万」：0.7 倍灰蓝实色（同设备管理 .inv-acard-currency/--light 方案） */
.dashboard-page .dash-money-cur,.dashboard-page .dash-money-wan{font-size:.7em;font-weight:700;letter-spacing:0;color:var(--light);-webkit-text-fill-color:var(--light);background:none}
/* 图标芯片：圆角方块 + 主色淡底 + 描边 + 发光（同设备管理 .inv-acard-icon） */
.dashboard-page .dash-hero-label .dash-ico{
  width:30px;height:30px;border-radius:9px;
  background:color-mix(in srgb,var(--c,var(--accent)) 14%,var(--bg));
  border:1px solid color-mix(in srgb,var(--c,var(--accent)) 26%,transparent);
  box-shadow:0 4px 12px color-mix(in srgb,var(--c,var(--accent)) 22%,transparent);
}
.dashboard-page .dash-hero-label .dash-ico svg{width:17px;height:17px}
.dashboard-page .dash-mini-label .dash-ico{
  width:26px;height:26px;border-radius:8px;
  background:color-mix(in srgb,var(--c,var(--accent)) 14%,var(--bg));
  border:1px solid color-mix(in srgb,var(--c,var(--accent)) 26%,transparent);
  box-shadow:0 4px 12px color-mix(in srgb,var(--c,var(--accent)) 20%,transparent);
}
.dashboard-page .dash-mini-label .dash-ico svg{width:14px;height:14px}
@media(max-width:680px){
  .dashboard-page .dash-hero{padding:14px 16px;min-height:130px}
  .dashboard-page .dash-hero-value{font-size:26px}
  .dashboard-page .dash-mini{padding:11px 12px}
  .dashboard-page .dash-mini-value{font-size:24px}
  .dashboard-page .dash-mini-value.num-m{font-size:21px}
  .dashboard-page .dash-mini-value.num-s{font-size:18px}
}
@media(prefers-reduced-motion:reduce){
  .dashboard-page .dash-hero:hover,.dashboard-page .dash-mini:hover{transform:none}
}
/* ===== v261：看板卡片套用设备管理 8 色主题（inv-g1..g8 同款色值）=====
   --c 主色驱动：图标芯片 / 数值渐变字 / 悬停光晕 / 装饰圆全部随卡变色；
   映射与设备管理一致：设备总数=靛蓝g1 在租=绿g2 回本=橙g3 出租率=紫g5
   资产原值=蓝g6 租金收入=青绿g7 租赁次数=青g8 订单数=靛蓝g1 */
.dashboard-page .inv-g1{--c:#6366f1;--cl:#818cf8}
.dashboard-page .inv-g2{--c:#10b981;--cl:#34d399}
.dashboard-page .inv-g3{--c:#f59e0b;--cl:#fbbf24}
.dashboard-page .inv-g4{--c:#f43f5e;--cl:#fb7185}
.dashboard-page .inv-g5{--c:#8b5cf6;--cl:#a78bfa}
.dashboard-page .inv-g6{--c:#3b82f6;--cl:#60a5fa}
.dashboard-page .inv-g7{--c:#14b8a6;--cl:#2dd4bf}
.dashboard-page .inv-g8{--c:#06b6d4;--cl:#22d3ee}
/* 数值改为同色渐变字（同设备管理 .inv-acard-value.inv-accent） */
.dashboard-page .dash-hero-value{background:linear-gradient(135deg,var(--c) 0%,var(--cl) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.dashboard-page .dash-mini-value>span[data-cv]{background:linear-gradient(135deg,var(--c) 0%,var(--cl) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
/* 装饰圆随卡主色（覆盖原蓝/绿族固定色） */
.dashboard-page .dash-mini::after{background:var(--c,var(--accent))}
.dashboard-page .dash-hero::before{background:color-mix(in srgb,var(--c) 16%,transparent)}
.dashboard-page .dash-hero::after{background:color-mix(in srgb,var(--c) 10%,transparent)}

/* ===== v263：全站统计卡统一（皮肤色底 + 线性图标芯片）=====
   范围：所有 .stat-card（订单/配件/客户/售后/日历/物流/会员设备/设备库/排期/仓库/注册会员/财务流水等）。
   财务管理「收入分类/支出分类」卡是 .cat-card，不命中本规则，保持原样不动。
   图标芯片由 app.js 的 StatEnhance 增强器自动插入，颜色取自卡片原 border-top 语义色（--sc）。 */
.stat-card{
  background:var(--bg)!important;
  border:1px solid var(--line)!important;
  border-radius:16px!important;
  padding:16px 18px!important;
  box-shadow:var(--card-shadow);
}
.stat-card:hover{
  transform:translateY(-4px)!important;
  box-shadow:var(--card-shadow-hover),0 0 20px color-mix(in srgb,var(--sc,var(--accent)) 14%,transparent)!important;
  transition:transform .2s ease,box-shadow .2s ease;
}
.stat-head{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.stat-head .stat-label{margin-bottom:0}
.stat-ico{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:8px;line-height:1;
  color:var(--sc,var(--accent));
  background:color-mix(in srgb,var(--sc,var(--accent)) 14%,var(--bg));
  border:1px solid color-mix(in srgb,var(--sc,var(--accent)) 26%,transparent);
  box-shadow:0 3px 8px color-mix(in srgb,var(--sc,var(--accent)) 16%,transparent);
}
.stat-ico svg{width:14px;height:14px}

/* ===== 全站淡色氛围背景 ===== */
:root{--bg-glow-primary:rgba(13,148,136,.075);--bg-glow-secondary:rgba(37,99,235,.045);--bg-wash:rgba(255,255,255,.18)}
[data-theme="ocean"]{--bg-glow-primary:rgba(37,99,235,.085);--bg-glow-secondary:rgba(14,165,233,.045);--bg-wash:rgba(255,255,255,.16)}
[data-theme="amber"]{--bg-glow-primary:rgba(217,119,6,.075);--bg-glow-secondary:rgba(245,158,11,.04);--bg-wash:rgba(255,255,255,.16)}
[data-theme="lime"]{--bg-glow-primary:rgba(132,204,22,.055);--bg-glow-secondary:rgba(100,116,80,.03);--bg-wash:rgba(255,255,255,.2)}
[data-theme="graphite"]{--bg-glow-primary:rgba(51,65,85,.065);--bg-glow-secondary:rgba(59,130,246,.03);--bg-wash:rgba(255,255,255,.2)}
[data-theme="dark"]{--bg-glow-primary:rgba(45,212,191,.055);--bg-glow-secondary:rgba(59,130,246,.04);--bg-wash:rgba(255,255,255,.008)}
body{
  background-color:var(--bg);
  background-image:
    radial-gradient(circle at 14% 2%,var(--bg-glow-primary) 0,transparent 34rem),
    radial-gradient(circle at 92% 14%,var(--bg-glow-secondary) 0,transparent 30rem),
    linear-gradient(145deg,var(--bg-wash),transparent 48%);
  background-attachment:fixed;
}
.app{background:transparent}
.app-nav{background:color-mix(in srgb,var(--sidebar) 92%,transparent);backdrop-filter:saturate(115%) blur(12px);-webkit-backdrop-filter:saturate(115%) blur(12px)}
main{position:relative}
@media(max-width:850px){
  body{background-attachment:scroll;background-image:radial-gradient(circle at 80% 0,var(--bg-glow-primary) 0,transparent 23rem),linear-gradient(150deg,var(--bg-wash),transparent 58%)}
  .mobile-topbar{background:color-mix(in srgb,var(--sidebar) 94%,transparent);backdrop-filter:saturate(115%) blur(12px);-webkit-backdrop-filter:saturate(115%) blur(12px)}
}

/* 设备回本数据更新动效 */
@keyframes paybackNumberIn{
  0%{opacity:.2;transform:translateY(3px) scale(.94);filter:brightness(1.35)}
  55%{opacity:1;transform:translateY(-1px) scale(1.045);filter:brightness(1.12)}
  100%{transform:none;filter:none}
}
@keyframes paybackResultIn{
  0%{opacity:0;transform:translateX(-6px);background:var(--accent-light)}
  45%{opacity:1;transform:translateX(0);background:var(--accent-light)}
  100%{background:transparent}
}
@keyframes paybackBarIn{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.payback-number{display:inline-block;transform-origin:left center;animation:paybackNumberIn .48s cubic-bezier(.2,.8,.2,1) both}
.payback-result{display:inline-flex;align-items:baseline;gap:3px;width:max-content;padding:0 4px;margin-left:-4px;border-radius:4px;font-weight:550;animation:paybackResultIn .72s ease-out both}
.payback-result strong{font-size:12.5px;font-variant-numeric:tabular-nums}
/* fix168：回本进度条加长加厚（5px → 8px）+ 条内流光，与数据看板的进度条同一套视觉语言 */
.payback-track{height:8px;border-radius:5px;background:var(--line-soft,#eee);overflow:hidden}
.payback-bar-animated{position:relative;overflow:hidden;height:100%;border-radius:5px;transform-origin:left center;animation:paybackBarIn .65s cubic-bezier(.2,.75,.2,1) both}
.payback-bar-animated::after{content:"";position:absolute;top:0;bottom:0;left:0;width:42%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.58),transparent);animation:dashBarShimmer 2.8s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.payback-number,.payback-result,.payback-bar-animated{animation:none}.payback-bar-animated::after{animation:none;opacity:0}}
/* Dashboard device category pie */
.device-pie-layout{display:grid;grid-template-columns:minmax(180px,214px) 1fr;align-items:center;gap:26px;padding:4px 2px 2px}
.device-pie{position:relative;width:min(100%,214px);aspect-ratio:1;margin:auto;border-radius:50%;cursor:crosshair;box-shadow:inset 0 0 0 1px var(--dash-pie-halo),0 14px 36px var(--dash-pie-sh);transition:transform .24s cubic-bezier(.2,.8,.2,1),box-shadow .24s,outline .15s}
.device-pie:hover{transform:translateY(-3px) scale(1.025);box-shadow:inset 0 0 0 1px var(--dash-pie-halo-hover),0 20px 46px var(--dash-pie-sh-hover)}
.device-pie-core{position:absolute;inset:24%;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,var(--paper),var(--bg));box-shadow:0 0 0 7px var(--dash-pie-core-halo),inset 0 0 0 1px var(--line-soft),0 5px 16px var(--dash-pie-core-sh);pointer-events:none}
.device-pie-tip{position:absolute;z-index:3;display:flex;align-items:center;gap:6px;max-width:170px;padding:7px 10px;border:1px solid rgba(255,255,255,.55);border-radius:9px;background:rgba(15,23,42,.9);color:#fff;font-size:11px;line-height:1;white-space:nowrap;box-shadow:0 8px 22px rgba(15,23,42,.24);opacity:0;transform:translate(12px,-50%) scale(.92);pointer-events:none;transition:opacity .12s,transform .12s;backdrop-filter:blur(8px)}
.device-pie-tip.show{opacity:1;transform:translate(12px,-50%) scale(1)}
.device-pie-tip span{width:8px;height:8px;border-radius:50%;box-shadow:0 0 0 3px rgba(255,255,255,.15)}
.device-pie-side{display:flex;flex-direction:column;gap:7px;min-width:0}
.device-pie-legend{display:grid;grid-template-columns:10px minmax(0,1fr) auto;align-items:center;gap:8px;width:100%;padding:7px 9px;border:1px solid transparent;border-radius:9px;background:transparent;font:inherit;font-size:12px;text-align:left;cursor:pointer;transition:background .16s,border-color .16s,transform .16s,box-shadow .16s}
.device-pie-legend:hover,.device-pie-legend.active{background:var(--paper);border-color:var(--line-soft);transform:translateX(3px);box-shadow:0 5px 14px var(--dash-pie-sh-soft)}
.device-pie-detail{display:flex;align-items:center;min-height:38px;margin-top:2px;padding:9px 11px;border:1px solid var(--line-soft);border-radius:10px;background:linear-gradient(135deg,var(--bg),var(--paper));color:var(--muted);font-size:11.5px;line-height:1.45;box-shadow:inset 3px 0 0 color-mix(in srgb,var(--accent) 22%,transparent)}
.device-pie-hint-dot{width:6px;height:6px;margin-right:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 12%,transparent);animation:devicePiePulse 1.8s ease-in-out infinite}
@keyframes devicePiePulse{50%{box-shadow:0 0 0 7px color-mix(in srgb,var(--accent) 0%,transparent)}}
@media(max-width:680px){.device-pie-layout{grid-template-columns:1fr;gap:18px}.device-pie{width:min(100%,220px)}.device-pie-side{width:100%}}

/* Dashboard 商品数据统计（fix155，横向条形图） */
.pd-stat-row{display:flex;align-items:center;gap:10px;min-width:0}
.pd-stat-rank{width:26px;text-align:center;flex-shrink:0;font-size:14px;line-height:1}
.pd-stat-name{width:130px;flex-shrink:0;text-align:right;font-size:12.5px;font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pd-stat-val{flex-shrink:0;width:134px;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:600px){
  .pd-stat-row{gap:7px}
  .pd-stat-name{width:84px;font-size:12px}
  .pd-stat-val{width:98px;font-size:11px}
}

/* ===== 全站移动端体验统一（触控、宽表、筛选、弹窗） ===== */
@media(max-width:850px){
  html{scroll-padding-top:64px}
  body{overflow-x:hidden}

  /* 页面标题与操作按钮：标题在上，主要操作横向滚动，避免挤压换行 */
  .page-head{display:block}
  .page-head>div:last-child:not(:first-child){width:100%;margin-top:14px;display:flex!important;gap:8px!important;overflow-x:auto;padding:2px 0 5px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .page-head>div:last-child:not(:first-child)::-webkit-scrollbar{display:none}
  .page-head>div:last-child:not(:first-child)>.btn{flex:0 0 auto;white-space:nowrap}
  .page-head>button,.page-head>a.btn{width:100%;margin-top:12px;justify-content:center}

  /* 卡片与标题保持统一密度 */
  .card,.table-wrap{border-radius:14px}
  .card-header{align-items:flex-start;gap:10px}
  .card-header h2{font-size:15px;line-height:1.35}
  .card-header .sub{font-size:11.5px}

  /* 搜索和筛选在手机上占满宽度 */
  .toolbar>*{width:100%}
  .search-box{width:100%}
  .filter-group{width:100%;padding:1px 0 6px;scroll-snap-type:x proximity}
  .filter-group select,.filter-group .btn{flex:0 0 auto;min-height:42px;scroll-snap-align:start}

  /* 宽表格保留首列定位，并用阴影提示可以横向滑动 */
  .table-wrap{position:relative;margin-left:0!important;margin-right:0!important;box-shadow:inset -14px 0 16px -18px rgba(15,23,42,.45),var(--shadow)}
  .table-wrap table,.orders-table-wrap table{min-width:760px!important;font-size:13px!important}
  .table-wrap th,.table-wrap td,.orders-table-wrap th,.orders-table-wrap td{padding:11px 12px!important;font-size:13px!important;white-space:nowrap}
  .table-wrap th:first-child,.table-wrap td:first-child{position:sticky;left:0;z-index:2;background:var(--paper);box-shadow:7px 0 12px -12px rgba(15,23,42,.7)}
  .table-wrap th:first-child{z-index:3;background:var(--bg)}
  /* fix186：会员设备页的展开明细行是 colspan 整行，不能被当成「冻结首列」 */
  .table-wrap tr.md-detail>td.md-detail-cell{position:static;left:auto;z-index:auto;box-shadow:none}

  /* 弹窗底部按钮固定，触控区域一致 */
  .modal-header{padding:16px}
  .modal-footer{position:sticky;bottom:0;z-index:4;background:var(--paper);box-shadow:0 -8px 22px rgba(15,23,42,.06);overflow-x:auto;justify-content:flex-end}
  .modal-footer .btn{min-height:42px;flex:0 0 auto;white-space:nowrap}
  .drawer-header{padding:17px 16px}
  .drawer-body{padding:18px 16px calc(32px + env(safe-area-inset-bottom))}

  /* 表单和触控控件最小点击高度 */
  button,.btn,.chip,select{min-height:40px}
  input[type="checkbox"],input[type="radio"]{min-width:18px;min-height:18px}
  .ship-options{gap:8px}
  .ship-opt{min-height:42px;display:flex;align-items:center;justify-content:center}

  /* 避免内联固定多栏在窄屏溢出 */
  [style*="grid-template-columns:3fr 2fr"],
  [style*="grid-template-columns:2fr 1fr"],
  [style*="grid-template-columns:1fr 2fr"]{grid-template-columns:1fr!important}
}

/* fix183：看板内联「3fr 2fr」双栏（营收趋势/商品数据统计、近期订单/设备分类占比、出租率走势/客户贡献排行）
   —— 851~1100px 之间两栏宽度装不下卡内内容（30 根柱子、商品条形图、饼图图例等），
   实测整页会被顶出 22~91px 横向滚动条且各排分隔线互相错位。故把堆叠断点由 850px 提到 1100px：
   该区间改为单列全宽，内容不再溢出、各排自然对齐。（上面的 850px 规则保留兼容，已被子集覆盖）
   全站只有看板这三排使用该内联模板，其它页面不受影响。 */
@media(max-width:1100px){
  [style*="grid-template-columns:3fr 2fr"],
  [style*="grid-template-columns:2fr 1fr"],
  [style*="grid-template-columns:1fr 2fr"]{grid-template-columns:1fr!important}
}

@media(max-width:600px){
  .stat-grid{grid-template-columns:1fr 1fr!important;gap:10px!important}
}
@media(max-width:480px){
  main{padding-left:10px;padding-right:10px}
  .mobile-topbar{padding-left:10px;padding-right:10px}
  .stat-grid{grid-template-columns:1fr 1fr!important;gap:8px!important}
  .stat-card{padding:13px!important;min-width:0}
  .stat-value{font-size:20px!important;overflow-wrap:anywhere}
  .stat-desc{font-size:11px!important}
  .card{padding:14px 12px}
  .modal-body{padding:16px 12px}
  .modal-footer{padding-left:12px;padding-right:12px}
  #rgNavPerms{grid-template-columns:1fr!important}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* 库存调拨：宽版弹窗与清晰设备列表 */
.warehouse-transfer-modal{max-width:min(920px,94vw)}
.warehouse-transfer-modal .modal-body{padding:24px 28px}
.tf-device-list{height:min(420px,46vh);min-height:280px;overflow-y:auto;border:1px solid var(--line);border-radius:12px;background:var(--paper);scrollbar-gutter:stable}
.tf-select-all{position:sticky;top:0;z-index:2;display:grid;grid-template-columns:22px 1fr;align-items:center;gap:10px;min-height:44px;padding:9px 16px;border-bottom:1px solid var(--line);background:var(--bg);font-size:13px;font-weight:700;cursor:pointer}
.tf-device-row{display:grid;grid-template-columns:22px 32px minmax(0,1fr) 100px;align-items:center;gap:12px;min-height:66px;padding:10px 16px;border-bottom:1px solid var(--line-soft);cursor:pointer;font-size:13px;transition:background .15s}
.tf-device-row:hover{background:var(--accent-light)}
.tf-device-row input,.tf-select-all input{width:17px;height:17px;margin:0}
.tf-device-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:8px;background:var(--bg);font-size:17px}
.tf-device-main{display:grid;grid-template-columns:minmax(150px,1fr) minmax(230px,1.5fr);align-items:center;gap:14px;min-width:0}
.tf-device-main strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13.5px}
.tf-device-main span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--light);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:11.5px}
.tf-device-location{color:var(--muted);font-size:12px;white-space:nowrap;text-align:right}
@media(max-width:850px){
  .warehouse-transfer-modal{max-width:100vw}
  .warehouse-transfer-modal .modal-body{padding:18px 16px}
  .tf-device-list{height:min(440px,52vh);min-height:240px}
  .tf-device-row{grid-template-columns:22px 30px minmax(0,1fr);gap:9px;padding:10px 12px}
  .tf-device-main{grid-template-columns:1fr;gap:3px}
  .tf-device-location{grid-column:3;text-align:left;font-size:11px}
}
/* 注册用户：次要操作收纳，降低列表操作区噪音 */
.reg-more{position:relative}
.reg-more>summary{list-style:none;cursor:pointer;user-select:none;white-space:nowrap}
.reg-more>summary::-webkit-details-marker{display:none}
.reg-more[open]>summary{border-color:var(--accent);color:var(--accent-ink);background:var(--accent-light)}
.reg-more-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:40;min-width:128px;padding:6px;background:var(--paper);border:1px solid var(--line);border-radius:10px;box-shadow:var(--card-shadow-hover)}
.reg-more-menu button{display:block;width:100%;padding:8px 10px;border:0;border-radius:7px;background:transparent;color:var(--ink);font-size:12px;text-align:left;cursor:pointer;white-space:nowrap}
.reg-more-menu button:hover{background:var(--accent-light);color:var(--accent-ink)}
.login-open>.app,.login-open>.mobile-topbar,.login-open>.nav-scrim{display:none!important}

/* ===== 设备管理页 手机适配（fix89） ===== */
/* ===== v253 设备资产总览：玻璃拟态（对照 dashboard.html 参考稿） ===== */
.inv-page{
  --glass-bg:rgba(255,255,255,.7);
  --glass-border:rgba(226,232,240,.8);
  --glass-hover:rgba(255,255,255,.9);
  --card-shadow-md:0 4px 16px rgba(148,163,184,.12);
  --card-shadow-xl:0 20px 60px rgba(148,163,184,.2);
  --blur:blur(20px);
}
[data-theme="dark"] .inv-page{
  --glass-bg:rgba(30,41,59,.55);
  --glass-border:rgba(148,163,184,.18);
  --glass-hover:rgba(30,41,59,.78);
  --card-shadow-md:0 4px 16px rgba(0,0,0,.28);
  --card-shadow-xl:0 20px 60px rgba(0,0,0,.45);
}
/* 背景 3 个极淡漂浮光斑 */
.inv-page .inv-glass-wrap{position:relative;overflow:hidden;border-radius:24px}
/* v268：去掉卡片框外的背景底色（原彩色径向渐变光斑层整个移除，wrap 与页面背景融为一体） */
.inv-page .inv-glass-wrap::before{content:none}
@keyframes invBgFloat{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(30px,-30px) scale(1.05)}66%{transform:translate(-20px,20px) scale(.95)}}
.inv-page .inv-glass-inner{position:relative;z-index:1;padding:10px 8px}
/* 头部 */
.inv-page .inv-asset-head{display:flex;align-items:baseline;justify-content:space-between;margin:0 4px 18px}
.inv-page .inv-grad-title{font-size:24px;font-weight:700;letter-spacing:-.5px;background:linear-gradient(135deg,var(--ink) 0%,var(--muted) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.inv-page .inv-asset-updated{font-size:13px;color:var(--light);font-variant-numeric:tabular-nums;padding:6px 14px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:20px;-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur)}
/* 网格 */
.inv-page .inv-asset-grid{gap:14px;margin:0 0 10px}
/* 玻璃卡片（底色随网站皮肤色 --bg，边框随 --line，深浅主题自动跟随） */
.inv-page .inv-acard{
  position:relative;overflow:hidden;
  background:var(--bg);border:1px solid var(--line);border-radius:16px;padding:14px;
  -webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);
  box-shadow:var(--card-shadow-md);
  transition:all .4s cubic-bezier(.22,1,.36,1);cursor:default;
}
.inv-page .inv-acard:hover{transform:translateY(-4px) scale(1.01);background:var(--bg);border-color:var(--line);box-shadow:var(--card-shadow-xl),0 0 40px var(--accent-shadow);z-index:5}
/* 悬停旋转流动光晕（radial glow + rotateGlow） */
.inv-page .inv-acard::before{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,var(--accent-glow) 0%,transparent 70%);opacity:0;transition:opacity .5s ease;pointer-events:none;z-index:0}
.inv-page .inv-acard:hover::before{opacity:.3;animation:invRotateGlow 3s linear infinite}
@keyframes invRotateGlow{from{transform:rotate(0)}to{transform:rotate(360deg)}}
/* 卡片顶部 */
.inv-page .inv-acard-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;position:relative;z-index:2}
.inv-page .inv-acard-label{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--muted);letter-spacing:.5px}
/* 呼吸状态点 */
.inv-page .inv-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px var(--accent-shadow)}
.inv-page .inv-dot.pulse{animation:invPulse 2s ease-in-out infinite}
@keyframes invPulse{0%,100%{box-shadow:0 0 8px var(--accent-shadow),0 0 0 0 var(--accent-glow)}50%{box-shadow:0 0 12px var(--accent-shadow),0 0 0 8px transparent}}
/* 图标芯片 40px */
.inv-page .inv-acard-icon{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent-soft),var(--accent-soft));color:var(--accent);border:1px solid var(--accent-border);box-shadow:0 4px 12px var(--accent-shadow),inset 0 1px 0 rgba(255,255,255,.3);transition:all .3s cubic-bezier(.34,1.56,.64,1)}
.inv-page .inv-acard-icon svg{width:17px;height:17px}
.inv-page .inv-acard:hover .inv-acard-icon{transform:scale(1.1) rotate(5deg);box-shadow:0 6px 20px var(--accent-shadow),inset 0 1px 0 rgba(255,255,255,.4)}
/* 数值 34px */
.inv-page .inv-acard-value{position:relative;font-size:30px;font-weight:800;line-height:1;letter-spacing:-1px;font-variant-numeric:tabular-nums;color:var(--ink);z-index:2;margin-bottom:5px;text-shadow:0 2px 4px rgba(0,0,0,.05)}
.inv-page .inv-acard-unit{font-size:15px;font-weight:600;color:var(--light);margin-left:4px;letter-spacing:0}
.inv-page .inv-acard-currency{font-size:21px;font-weight:700;margin-right:2px;background:linear-gradient(135deg,var(--accent) 0%,var(--accent) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.inv-page .inv-acard-value.inv-accent{background:linear-gradient(135deg,var(--accent) 0%,var(--accent-light) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.inv-page .inv-acard-value.inv-accent .inv-acard-unit,.inv-page .inv-acard-value.inv-accent .inv-acard-currency{-webkit-text-fill-color:var(--light);background:none;color:var(--light)}
.inv-page .inv-num-money{background:linear-gradient(135deg,var(--accent) 0%,var(--accent-light) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
/* 描述 */
.inv-page .inv-acard-desc{position:relative;font-size:12px;color:var(--light);z-index:2;line-height:1.6}
.inv-page .inv-acard-desc b{color:var(--muted);font-weight:600}
/* 进度条 */
.inv-page .inv-acard-bar{position:relative;margin-top:12px;height:7px;border-radius:99px;background:rgba(226,232,240,.6);overflow:hidden;z-index:2;box-shadow:inset 0 1px 2px rgba(148,163,184,.2)}
[data-theme="dark"] .inv-page .inv-acard-bar{background:rgba(148,163,184,.18)}
.inv-page .inv-acard-bar>i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--accent),var(--accent-light));box-shadow:0 0 12px var(--accent-shadow);width:0;transition:width 1.2s cubic-bezier(.22,1,.36,1) .2s;position:relative}
.inv-page .inv-acard-bar>i::after{content:'';position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(180deg,rgba(255,255,255,.3),transparent);border-radius:99px 99px 0 0}
/* 环形图 60px */
.inv-page .inv-card-body{display:flex;align-items:center;gap:14px;position:relative;z-index:2}
.inv-page .inv-ring{position:relative;width:60px;height:60px;flex:none}
.inv-page .inv-ring svg{width:60px;height:60px;transform:rotate(-90deg);filter:drop-shadow(0 0 6px var(--accent-shadow))}
.inv-page .inv-ring-track{stroke:rgba(226,232,240,.8);stroke-width:6}
[data-theme="dark"] .inv-page .inv-ring-track{stroke:rgba(148,163,184,.2)}
.inv-page .inv-donut-fg{stroke:var(--accent);stroke-width:6;stroke-linecap:round;stroke-dasharray:195;stroke-dashoffset:195;transition:stroke-dashoffset 1.4s cubic-bezier(.22,1,.36,1) .3s}
.inv-page .inv-ring-em{position:absolute;inset:0;display:grid;place-items:center;font-size:14px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--accent);text-shadow:0 0 12px var(--accent-shadow)}
.inv-page .inv-ring-meta{flex:1;min-width:0}
/* 8 种发光色彩主题 */
.inv-page .inv-g1{--accent:#6366f1;--accent-light:#818cf8;--accent-soft:rgba(99,102,241,.08);--accent-border:rgba(99,102,241,.2);--accent-shadow:rgba(99,102,241,.25);--accent-glow:rgba(99,102,241,.12)}
.inv-page .inv-g2{--accent:#10b981;--accent-light:#34d399;--accent-soft:rgba(16,185,129,.08);--accent-border:rgba(16,185,129,.2);--accent-shadow:rgba(16,185,129,.25);--accent-glow:rgba(16,185,129,.12)}
.inv-page .inv-g3{--accent:#f59e0b;--accent-light:#fbbf24;--accent-soft:rgba(245,158,11,.08);--accent-border:rgba(245,158,11,.2);--accent-shadow:rgba(245,158,11,.25);--accent-glow:rgba(245,158,11,.12)}
.inv-page .inv-g4{--accent:#f43f5e;--accent-light:#fb7185;--accent-soft:rgba(244,63,94,.08);--accent-border:rgba(244,63,94,.2);--accent-shadow:rgba(244,63,94,.25);--accent-glow:rgba(244,63,94,.12)}
.inv-page .inv-g5{--accent:#8b5cf6;--accent-light:#a78bfa;--accent-soft:rgba(139,92,246,.08);--accent-border:rgba(139,92,246,.2);--accent-shadow:rgba(139,92,246,.25);--accent-glow:rgba(139,92,246,.12)}
.inv-page .inv-g6{--accent:#3b82f6;--accent-light:#60a5fa;--accent-soft:rgba(59,130,246,.08);--accent-border:rgba(59,130,246,.2);--accent-shadow:rgba(59,130,246,.25);--accent-glow:rgba(59,130,246,.12)}
.inv-page .inv-g7{--accent:#14b8a6;--accent-light:#2dd4bf;--accent-soft:rgba(20,184,166,.08);--accent-border:rgba(20,184,166,.2);--accent-shadow:rgba(20,184,166,.25);--accent-glow:rgba(20,184,166,.12)}
.inv-page .inv-g8{--accent:#06b6d4;--accent-light:#22d3ee;--accent-soft:rgba(6,182,212,.08);--accent-border:rgba(6,182,212,.2);--accent-shadow:rgba(6,182,212,.25);--accent-glow:rgba(6,182,212,.12)}
/* 响应式（对照参考稿） */
@media(max-width:1024px){.inv-page .inv-asset-grid{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:850px){.inv-page .inv-acard{padding:12px!important}.inv-page .inv-acard-value{font-size:26px}}
@media(max-width:640px){.inv-page .inv-asset-grid{grid-template-columns:repeat(2,1fr)!important;gap:10px!important}.inv-page .inv-asset-head h2{font-size:20px}}
/* 减少动态效果偏好 */
@media (prefers-reduced-motion:reduce){
  .inv-page .inv-glass-wrap::before,.inv-page .inv-acard::before,.inv-page .inv-dot.pulse{animation:none!important}
}

/* 统计卡：桌面 5/4 列，窄屏逐级降为 2 列、超窄 1 列（覆盖页面内联的 repeat(5/4,1fr)） */
.inv-page .inv-stat-5{grid-template-columns:repeat(5,1fr)!important}
.inv-page .inv-stat-4{grid-template-columns:repeat(4,1fr)!important}
@media(max-width:1100px){
  .inv-page .inv-stat-5{grid-template-columns:repeat(4,1fr)!important}
  .inv-page .inv-stat-4{grid-template-columns:repeat(3,1fr)!important}
}
@media(max-width:850px){
  .inv-page .inv-stat-5,.inv-page .inv-stat-4{grid-template-columns:repeat(2,1fr)!important}
  /* 产品搜索框满宽 */
  .inv-page #invPicker{width:100%}
  .inv-page #invPickerInput{width:100%!important}
  .inv-page .toolbar>input.inv-stk-search{width:100%!important}
  /* 表格卡片头部的操作按钮行换行，避免溢出 */
  .inv-page .table-wrap .card-header>div:last-child{display:flex!important;flex-wrap:wrap!important;width:100%!important;gap:8px!important}
  .inv-page .table-wrap .card-header>div:last-child>span:first-child{flex:1 1 100%}
  .inv-page .table-wrap .card-header>div:last-child .btn{flex:1 1 calc(50% - 8px);min-width:0;justify-content:center}
}
@media(max-width:600px){
  .inv-page .inv-stat-5,.inv-page .inv-stat-4{grid-template-columns:repeat(2,1fr)!important}
}
@media(max-width:380px){
  .inv-page .inv-stat-5,.inv-page .inv-stat-4{grid-template-columns:1fr!important}
}
/* 设备资产总览卡：手机端一排 2 个（8 卡共 4 排），间距收紧 */
@media(max-width:640px){
  .inv-page .inv-asset-grid{grid-template-columns:repeat(2,1fr)!important;gap:10px!important}
  .inv-page .inv-acard{padding:12px 10px!important}
  .inv-page .inv-acard-value{font-size:24px!important}
  .inv-page .card-wm{font-size:42px!important;right:6px!important;bottom:-10px!important;opacity:.1}
}

/* 三张表（设备列表 / 型号统计 / 库存盘点）在 ≤768px 沿用全站统一的横向滑动 + 首列冻结，
   与「配件库存 / 订单管理」完全一致（fix92：由卡片式改回滑动式） */
@media(max-width:768px){
  .inv-page .table-wrap td .info-row{min-width:0}
  .inv-page .table-wrap td .info-name{overflow:hidden;text-overflow:ellipsis}
}

/* 设备档案抽屉内的内联多栏在超窄屏堆叠 */
@media(max-width:480px){
  .inv-drawer-overview{grid-template-columns:1fr!important}
  .inv-drawer-info{grid-template-columns:1fr!important}
}

/* ===== 设备管理页 手机适配（fix91：补齐 .inv-page 类，修复 fix89 规则全部未生效） ===== */
.inv-ops{display:flex;gap:6px;flex-wrap:wrap}
@media(max-width:850px){
  /* 列表头部统计文字独占一行，不再被右侧按钮挤成竖排 */
  .inv-page .table-wrap .card-header{flex-wrap:wrap!important}
  .inv-page .table-wrap .card-header>div:last-child>span:first-child{flex:1 1 100%;white-space:nowrap}
  /* 页头按钮在窄屏换行铺开 */
  .inv-page .page-head{flex-wrap:wrap;gap:10px}
  .inv-page .page-head>div:last-child{flex-wrap:wrap;width:100%}
}
@media(max-width:768px){
  /* 操作列按钮排成两排（2 列），收窄该列宽度、减少横向滑动距离 */
  .inv-ops{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .inv-ops>.btn{width:100%;justify-content:center}
}
@media(max-width:420px){
  .inv-page .table-wrap .card-header>div:last-child>span:first-child{white-space:normal}
}

/* ===== 配件库存页 手机适配（fix95：统计卡由 4 张增至 6 张，逐级降列） ===== */
/* 桌面 6 列一行；中屏 3 列两行；≤850px 交给全站 .stat-grid 规则降为 2 列；超窄 1 列 */
.stat-grid.acc-stat-6{grid-template-columns:repeat(6,1fr)}
@media(max-width:1400px){.stat-grid.acc-stat-6{grid-template-columns:repeat(3,1fr)}}
@media(max-width:850px){.stat-grid.acc-stat-6{grid-template-columns:repeat(2,1fr)}}
@media(max-width:380px){.stat-grid.acc-stat-6{grid-template-columns:1fr}}

/* 配件清单「操作」列：手机端 4 个按钮（档案/入库/编辑/删除）排成 2 排 2 列，
   不再挤成一条长横排；桌面端仍是原来的一行 flex 排列。 */
@media(max-width:850px){
  .acc-ops{display:grid!important;grid-template-columns:repeat(2,1fr);gap:6px;width:128px}
  .acc-ops .btn{width:100%;min-width:0;padding:7px 2px}
}

.login-page{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(circle at 20% 10%,#dff7f1 0,transparent 35%),linear-gradient(135deg,#f8fafc,#eef7f5)}
.login-panel{width:min(480px,100%);padding:44px;background:rgba(255,255,255,.94);border:1px solid rgba(15,118,110,.14);border-radius:20px;box-shadow:0 24px 70px rgba(15,23,42,.13)}
.login-logo{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:#a9e45f;color:#173a26;font-size:22px;font-weight:900;margin-bottom:18px}
.login-panel h1{font-size:27px;margin:0 0 8px}.login-panel p{font-size:14px;color:var(--muted);margin:0 0 26px}.login-panel label{display:block;font-size:12px;font-weight:600;margin:13px 0 6px}.login-panel input{width:100%;box-sizing:border-box;padding:11px 12px;border:1px solid var(--line);border-radius:10px;font:inherit;outline:none}.login-panel input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}
.login-panel>.btn{width:100%;margin-top:8px;padding:11px}.login-error{height:22px;padding-top:5px;color:var(--red-ink);font-size:12px}.login-demo{text-align:center;color:var(--light);font-size:11px;margin-top:14px}
.public-page{min-height:100vh;background:#f8fbfa;color:var(--ink)}.public-nav{height:70px;padding:0 max(24px,calc((100vw - 1180px)/2));display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.9);border-bottom:1px solid rgba(15,118,110,.1);position:sticky;top:0;z-index:5;backdrop-filter:blur(14px)}.public-brand{border:0;background:none;font-size:18px;font-weight:800;display:flex;align-items:center;gap:10px;cursor:pointer;color:var(--ink)}.public-brand span{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--accent);color:#fff}.public-nav nav{display:flex;gap:8px}.public-nav nav button,.auth-link,.auth-back{border:0;background:none;cursor:pointer;color:var(--muted);padding:8px 12px}.public-nav nav .public-cta{background:var(--accent);color:#fff;border-radius:9px}.hero{max-width:1180px;margin:auto;min-height:570px;padding:70px 24px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:56px}.hero-badge{display:inline-block;padding:6px 11px;border-radius:20px;background:var(--accent-light);color:var(--accent-ink);font-size:12px;font-weight:700}.hero h1{font-size:46px;line-height:1.2;letter-spacing:-1.5px;margin:20px 0}.hero h1 em{font-style:normal;color:var(--accent-ink)}.hero-copy>p{font-size:16px;line-height:1.8;color:var(--muted);max-width:570px}.hero-actions{display:flex;gap:12px;margin-top:28px}.hero-actions .btn,.public-bottom .btn{padding:11px 20px;font-size:14px}.hero-note{font-size:12px;color:var(--light);margin-top:16px}.hero-preview{padding:16px;border-radius:22px;background:#fff;box-shadow:0 30px 80px rgba(15,118,110,.15);border:1px solid rgba(15,118,110,.12);transform:rotate(1deg)}.preview-bar{padding:8px 6px 17px;border-bottom:1px solid var(--line-soft);font-size:12px;color:var(--muted)}.preview-bar i{display:inline-block;width:8px;height:8px;border-radius:50%;background:#d1d5db;margin-right:5px}.preview-bar span{float:right}.preview-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:16px 4px 4px}.preview-stats b{padding:24px 18px;border-radius:14px;background:linear-gradient(135deg,#f0fdfa,#f8fafc);font-size:15px}.preview-stats small{display:block;color:var(--light);font-size:11px;font-weight:400;margin-top:8px}.feature-section{max-width:1180px;margin:auto;padding:60px 24px 90px}.section-title{text-align:center;margin-bottom:34px}.section-title span{font-size:12px;color:var(--accent-ink);font-weight:700}.section-title h2{font-size:28px;margin:9px 0}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.feature-grid article{padding:24px;border:1px solid var(--line);border-radius:16px;background:#fff}.feature-grid article>span{font-size:24px}.feature-grid h3{margin:13px 0 7px;font-size:16px}.feature-grid p{margin:0;color:var(--muted);font-size:13px;line-height:1.7}.public-bottom{text-align:center;padding:60px 24px;background:#eaf8f5}.public-bottom h2{font-size:28px;margin:0 0 10px}.public-bottom p{color:var(--muted);margin-bottom:22px}.public-footer{text-align:center;padding:24px;color:var(--light);font-size:11px;background:#fff}.auth-wrap{min-height:calc(100vh - 120px);display:flex;align-items:center;justify-content:center;padding:42px 20px}.auth-wrap .login-panel{position:relative}.auth-back{padding:0;margin-bottom:18px}.auth-link{display:block;width:100%;margin-top:10px;color:var(--accent-ink)}.register-panel{width:min(880px,100%)}.auth-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}.terms{display:flex!important;align-items:center;gap:7px;font-weight:400!important;color:var(--muted)}.terms input{width:auto!important}.register-panel .login-error{height:25px}
@media(max-width:760px){.public-nav{padding:0 16px}.public-nav nav button:first-child:not(.public-login){display:none}.hero{grid-template-columns:1fr;padding-top:45px}.hero h1{font-size:34px}.hero-preview{transform:none}.feature-grid{grid-template-columns:1fr}.auth-grid{grid-template-columns:1fr}}
.plan-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;max-width:1100px;margin:0 auto}.plan-card{position:relative;padding:22px;background:var(--paper);border:1px solid var(--line);border-top:4px solid var(--plan);border-radius:15px}.plan-card.current{box-shadow:0 0 0 2px var(--plan),0 12px 30px rgba(15,23,42,.08)}.plan-name{font-size:16px;font-weight:800;color:var(--plan)}.plan-price{margin:16px 0 3px}.plan-price strong{font-size:26px}.plan-price span,.plan-month{font-size:12px;color:var(--muted)}.plan-card p{font-size:12px;color:var(--muted);margin:12px 0}.plan-card .btn{width:100%;margin-top:12px}.onboarding-card{position:fixed;right:24px;bottom:24px;z-index:350;width:300px;padding:20px;background:var(--paper);border:1px solid rgba(15,118,110,.18);border-radius:16px;box-shadow:0 20px 55px rgba(15,23,42,.18)}.onboard-close{position:absolute;right:12px;top:10px;border:0;background:none;color:var(--light);font-size:20px;cursor:pointer}.onboard-kicker{font-size:11px;color:var(--accent-ink);font-weight:700}.onboarding-card h3{margin:5px 0;font-size:17px}.onboarding-card>p{font-size:11.5px;color:var(--light);margin:0 0 12px}.onboard-step{width:100%;display:flex;align-items:center;gap:8px;border:0;border-radius:9px;background:var(--bg);padding:9px 10px;margin-top:6px;text-align:left;cursor:pointer;font-size:12px}.onboard-step span{color:var(--accent-ink);font-weight:800}.onboard-step b{margin-left:auto}.onboard-step.done{color:var(--light);text-decoration:line-through}.onboard-progress{height:5px;background:var(--line-soft);border-radius:10px;margin-top:13px;overflow:hidden}.onboard-progress i{display:block;height:100%;background:var(--accent);transition:width .3s}
@media(max-width:900px){.plan-grid{grid-template-columns:1fr 1fr;max-width:100%}}@media(max-width:600px){.plan-grid{grid-template-columns:1fr}.onboarding-card{left:12px;right:12px;bottom:12px;width:auto}}

/* ===== 找回密码 / 修改密码 ===== */
.forgot-link{display:block;width:100%;text-align:right;font-size:12.5px;color:#2563eb;cursor:pointer;margin:2px 0 4px;background:none;border:0;padding:0}
.forgot-link:hover{text-decoration:underline}
.fp-hint{font-size:12.5px;color:#92400e;background:#fef3c7;border:1px solid #fde68a;border-radius:8px;padding:9px 12px;margin-bottom:14px;line-height:1.6}
.fp-hint.fp-ok{color:#166534;background:#f0fdf4;border-color:#bbf7d0}

/* ===== 登录页美化 ===== */
.auth-login{display:flex;align-items:stretch;justify-content:flex-start;min-height:calc(100vh - 70px);padding:0;background:#fafaf7}
.login-card{flex:1;display:grid;grid-template-columns:minmax(230px,20%) 1fr;width:100%;max-width:none;background:#fafaf7;border-radius:0;box-shadow:none;overflow:hidden}
.login-art{background:#dcf3a5;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:16px;padding:44px 28px}
.login-art h2{margin:0;font-size:clamp(20px,1.7vw,27px);line-height:1.4;font-weight:900;color:#173a26;letter-spacing:-.3px}
.art-pill{border:0;cursor:pointer;font-family:inherit;background:#a9e45f;color:#173a26;font-weight:700;font-size:15px;padding:12px 28px;border-radius:999px;box-shadow:0 6px 16px rgba(90,140,30,.22);transition:transform .16s,box-shadow .16s}
.art-pill:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(90,140,30,.3)}
.login-form{background:#fafaf7;display:flex;flex-direction:column;justify-content:center;max-width:600px;width:100%;margin:0 auto;padding:56px 56px 44px}
.login-form .auth-back{margin:-8px 0 12px -4px;padding:6px 8px;font-size:12.5px;color:var(--muted);display:inline-flex;align-items:center;gap:4px;border-radius:8px}
.login-form .auth-back:hover{background:var(--bg);color:var(--ink)}
.login-form .login-logo{margin-bottom:14px}
.login-form h1{margin-bottom:22px}
.login-form label{display:block;font-size:12px;font-weight:600;margin:13px 0 6px}
.login-form input{width:100%;box-sizing:border-box;padding:11px 12px;border:1px solid var(--line);border-radius:10px;font:inherit;outline:none}
.login-form input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}
.login-form select{width:100%;box-sizing:border-box;padding:11px 12px;border:1px solid var(--line);border-radius:10px;font:inherit;outline:none;background:#fff;color:var(--ink);appearance:auto}
.login-form select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}
.login-form>.btn,.login-form .btn{width:100%;margin-top:8px;padding:11px}
@media(max-width:900px){.login-card{grid-template-columns:1fr}.login-art{display:none}.login-form{padding:36px 26px 28px}}
.login-form .btn-primary,.login-panel .btn-primary{background:#101828;color:#fff;border:none;border-radius:999px;box-shadow:0 8px 20px rgba(16,24,40,.18);font-weight:700}
.login-form .btn-primary:hover,.login-panel .btn-primary:hover{background:#1b2534}
.login-panel{border:1px solid #e4ecd4}

/* ===== 公开首页 v4（明亮通透现代 SaaS） ===== */
.hp{display:block;padding:0}
.hp *{box-sizing:border-box}
.hp a{cursor:pointer}
.public-page{background:#f8f9f8}
/* 顶部导航 */
.public-nav{height:76px;padding:0 max(32px,calc((100vw - 1376px)/2));display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.8);border-bottom:1px solid #e8ebf2;position:sticky;top:0;z-index:60;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.public-brand{border:0;background:none;font-size:18px;font-weight:800;display:flex;align-items:center;gap:10px;cursor:pointer;color:#0f172a;letter-spacing:.2px}
.public-brand span{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:#101828;color:#fff;font-size:15px;font-weight:900;box-shadow:0 4px 12px rgba(16,24,40,.24)}
.public-menu{display:flex;align-items:center;gap:2px}
.public-menu button,.public-auth button{border:0;background:none;cursor:pointer;color:#55606e;font-size:14px;font-weight:500;padding:9px 14px;border-radius:9px;transition:all .16s}
.public-menu button:hover{color:#0f172a;background:#eef1f6}
.public-auth{display:flex;align-items:center;gap:10px}
.public-auth button:hover{color:#0f172a}
.public-nav .public-auth .public-cta{padding:10px 22px;font-weight:600;color:#fff;background:#101828;border-radius:999px;box-shadow:0 6px 16px rgba(16,24,40,.22);transition:transform .16s,box-shadow .16s}
.public-nav .public-auth .public-cta:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(16,24,40,.32);color:#fff;background:#1b2534}
.public-footer{padding:38px max(32px,calc((100vw - 1376px)/2));text-align:center;color:#5f6b7a;font-size:13px;background:#fff;border-top:1px solid #eceff4}

/* ===== Hero（左文右图 + 柔和光斑） ===== */
.hp-hero{position:relative;overflow:hidden;padding:86px max(32px,calc((100vw - 1376px)/2)) 40px;background:radial-gradient(120% 100% at 50% 42%,#c3e88e 0%,#d4efa6 48%,#e9f7c9 100%)}
.hp-blob{position:absolute;border-radius:50%;filter:blur(60px);pointer-events:none;opacity:.5}
.hp-blob-a{width:560px;height:560px;top:-180px;left:-120px;background:#c5ee72}
.hp-blob-b{width:480px;height:480px;top:-80px;right:-140px;background:#a7f3d0}
.hp-blob-c{width:360px;height:360px;bottom:-120px;left:38%;background:#bae6fd}
.hp-hero-inner{position:relative;z-index:2;text-align:center;max-width:1080px;margin:0 auto}
.hp-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;background:#fff;border:1px solid rgba(15,23,42,.08);color:#44502e;font-size:13px;font-weight:600;box-shadow:0 2px 10px rgba(63,98,18,.1)}
.hp-badge-dot{width:7px;height:7px;border-radius:50%;background:#65a30d;box-shadow:0 0 0 3px rgba(101,163,13,.2)}
.hp-hero h1{font-size:clamp(34px,5.2vw,64px);line-height:1.12;letter-spacing:-2px;margin:26px 0 20px;color:#0f172a;font-weight:900}
.hp-word{background:linear-gradient(90deg,#3f6212,#0d9488);-webkit-background-clip:text;background-clip:text;color:transparent}
.hp-lead{font-size:18px;line-height:1.85;color:#44502e;max-width:780px;margin:0 auto}
.hp-actions{display:flex;gap:14px;margin:32px 0 0;justify-content:center;flex-wrap:wrap}
.hp-btn{font-family:inherit;cursor:pointer;border-radius:999px;font-weight:600;font-size:15px;padding:14px 30px;transition:transform .16s,box-shadow .16s,border-color .16s,background .16s;display:inline-flex;align-items:center;justify-content:center;gap:6px}
.hp-btn-primary{background:#101828;color:#fff;border:none;box-shadow:0 10px 26px rgba(16,24,40,.28)}
.hp-btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(16,24,40,.36);background:#1b2534}
.hp-btn-light{background:#fff;color:#0f172a;border:1px solid rgba(15,23,42,.12)}
.hp-btn-light:hover{border-color:#3f6212;color:#3f6212;transform:translateY(-2px)}
.hp-note{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin-top:22px;color:#5f6b7a;font-size:13px}
.hp-note::before{content:""}

/* Hero 产品舞台 */
.hp-stage{position:relative;max-width:1300px;margin:70px auto 0;z-index:2}
.hp-win{background:#fff;border:1px solid #e3e8f0;border-radius:18px;overflow:hidden;box-shadow:0 30px 70px rgba(15,23,42,.13);text-align:left}
.hp-win-bar{display:flex;align-items:center;gap:7px;padding:11px 16px;background:#f8fafc;border-bottom:1px solid #eef1f6}
.hp-win-bar i{width:11px;height:11px;border-radius:50%}
.hp-win-bar i:nth-child(1){background:#ff5f57}.hp-win-bar i:nth-child(2){background:#febc2e}.hp-win-bar i:nth-child(3){background:#28c840}
.hp-win-bar span{margin-left:10px;color:#5f6b7a;font-size:12px}
.hp-win-body{display:grid;grid-template-columns:250px 1fr;min-height:390px}
.hp-side{padding:22px 14px;background:#fafbfc;border-right:1px solid #eef1f6}
.hp-side-logo{font-weight:800;font-size:13px;display:flex;align-items:center;gap:8px;margin:0 8px 22px;color:#0f172a}
.hp-side-logo span{width:26px;height:26px;border-radius:7px;background:#101828;color:#fff;display:grid;place-items:center;font-size:11px;font-weight:900}
.hp-side ul{list-style:none;display:flex;flex-direction:column;gap:4px;padding:0;margin:0}
.hp-side li{padding:9px 11px;border-radius:9px;font-size:12.5px;color:#475569;display:flex;align-items:center;gap:9px}
.hp-side li.on{background:#ecfccb;color:#3f6212;font-weight:600}
.hp-side li span{opacity:.9}
.hp-content{padding:30px 32px}
.hp-stat-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-bottom:18px}
.hp-stat{position:relative;padding:16px;border-radius:13px;border:1px solid #eef1f6;background:#fbfcfe}
.hp-stat b{font-size:22px;color:#0f172a;display:block;line-height:1.1}
.hp-stat>span{font-size:12px;color:#5f6b7a;display:block;margin-top:7px}
.hp-stat em{position:absolute;top:14px;right:14px;font-style:normal;font-size:11px;font-weight:600}
.hp-stat em.up{color:#15803d}
.hp-stat em.warn{color:var(--orange-ink)}
.hp-stat-t{border-top:3px solid #84cc16}.hp-stat-c{border-top:3px solid #14b8a6}.hp-stat-s{border-top:3px solid #a8b80a}
.hp-table{overflow:hidden;border:1px solid #eef1f6;border-radius:12px}
.hp-trow{display:grid;grid-template-columns:1.6fr 1.4fr 1.1fr .7fr;align-items:center;padding:11px 16px;font-size:12.5px;gap:8px}
.hp-trow+.hp-trow{border-top:1px solid #f1f3f8}
.hp-thead{background:#f8fafc;color:#5f6b7a;font-weight:600}
.hp-trow .t-name{color:#0f172a;font-weight:600}
.hp-trow .t-cust{color:#475569}
.pill{padding:3px 11px;border-radius:999px;font-size:11px;font-weight:600;width:fit-content}
.pill-blue{background:#e0f2fe;color:#0369a1}
.pill-green{background:#dcfce7;color:#15803d}
/* 悬浮通知卡 */
.hp-float{position:absolute;background:#fff;border-radius:13px;box-shadow:0 14px 34px rgba(15,23,42,.16);padding:12px 16px;display:flex;flex-direction:column;gap:2px;animation:floaty 4.5s ease-in-out infinite;z-index:3}
.hp-float span{font-size:17px}
.hp-float b{font-size:12.5px;color:#0f172a}
.hp-float small{font-size:11px;color:#5f6b7a}
.hp-float-a{top:34px;left:-30px;--rot:-7deg}
.hp-float-b{bottom:60px;right:-26px;--rot:6deg;animation-delay:1.3s}
.hp-float-c{top:-10px;right:5%;--rot:5deg;animation-delay:.6s}
.hp-fr{display:flex;align-items:center;gap:10px;text-align:left}
.hp-fr+.hp-fr{margin-top:11px}
.hp-fr i{width:26px;height:26px;border-radius:50%;flex-shrink:0;box-shadow:inset 0 0 0 1px rgba(15,23,42,.08)}
.hp-fr b{font-size:12.5px;color:#0f172a}
.hp-fr small{font-size:11px;color:#5f6b7a}
@keyframes floaty{0%,100%{transform:rotate(var(--rot,0deg)) translateY(0)}50%{transform:rotate(var(--rot,0deg)) translateY(-10px)}}

/* 品牌信任条 */
.hp-logos{padding:26px 0;border-top:1px solid #eef1f6;background:#f8f9f8}
.hp-logos ul{list-style:none;max-width:1440px;margin:14px auto 0;padding:0 32px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
.hp-logos span{display:block;text-align:center;color:#5f6b7a;font-size:12px;letter-spacing:.3px}
.hp-logos li{font-size:15px;font-weight:700;color:#5f6b7a}

/* ===== 区块 ===== */
.hp-section{max-width:1440px;margin:0 auto;padding:96px 32px}
.hp-section.hp-alt{background:#f8f9f8;box-shadow:0 0 0 100vmax #f8f9f8;clip-path:inset(0 -100vmax)}
.hp-head{text-align:center;margin-bottom:52px}
.hp-kicker{display:inline-block;color:#4d7c0f;font-size:12px;font-weight:800;letter-spacing:1.6px;text-transform:uppercase;margin-bottom:12px}
.hp-head h2{font-size:clamp(26px,3.8vw,42px);margin:0;color:#0f172a;font-weight:800;letter-spacing:-.8px}
.hp-head p{font-size:16px;color:#5f6b7a;margin:14px auto 0;max-width:640px;line-height:1.8}

/* 功能 6 卡 */
.hp-feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.hp-feat-grid article{padding:34px 30px;border-radius:18px;background:#fff;border:1px solid #e9edf4;transition:transform .2s,box-shadow .2s,border-color .2s}
.hp-feat-grid article:hover{transform:translateY(-5px);box-shadow:0 22px 50px rgba(15,23,42,.1);border-color:transparent}
.hp-ic{display:inline-grid;place-items:center;width:54px;height:54px;border-radius:15px;font-size:25px;background:color-mix(in srgb,var(--c) 14%,#fff);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 22%,transparent)}
.hp-feat-grid h3{margin:18px 0 9px;font-size:17px;color:#0f172a}
.hp-feat-grid p{margin:0;font-size:14px;color:#475569;line-height:1.75}

/* 为什么选我们：数字列表 */
.hp-reason-grid{max-width:1100px;margin:0 auto;display:flex;flex-direction:column;gap:16px}
.hp-reason{display:flex;align-items:flex-start;gap:22px;padding:26px 28px;border-radius:16px;background:#f8fafc;border:1px solid #eef1f6;transition:transform .2s,background .2s}
.hp-reason:hover{transform:translateX(6px);background:#f7fee7}
.hp-reason>span{font-size:30px;font-weight:800;line-height:1;background:linear-gradient(135deg,#3f6212,#0d9488);-webkit-background-clip:text;background-clip:text;color:transparent;width:44px}
.hp-reason h3{margin:0 0 7px;font-size:18px;color:#0f172a}
.hp-reason p{margin:0;font-size:14px;color:#475569;line-height:1.75}

/* 价格 */
.hp-plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}
.hp-plan-grid-2{grid-template-columns:repeat(2,1fr);max-width:1000px;margin-left:auto;margin-right:auto}
.hp-plan-grid-4{grid-template-columns:repeat(4,1fr);max-width:1240px;margin-left:auto;margin-right:auto;gap:16px}
.hp-plan{position:relative;display:flex;flex-direction:column;padding:38px 34px;border-radius:20px;background:#fff;border:1px solid #e9edf4;transition:transform .2s,box-shadow .2s}
.hp-plan:hover{transform:translateY(-5px);box-shadow:0 24px 55px rgba(15,23,42,.1)}
/* 四档套餐四色底（浅黄绿 / 浅青 / 浅薄荷绿 / 浅黄） */
.hp-plan-i0{background:#def8a6}
.hp-plan-i1{background:#aef3ec}
.hp-plan-i2{background:#a9edc4}
.hp-plan-i3{background:#f1f2a3}
.hp-plan-i0,.hp-plan-i1,.hp-plan-i2,.hp-plan-i3{border-color:rgba(15,23,42,.05)}
.hp-plan h3{font-size:16px;color:#0f172a;margin:0}
.hp-price{font-size:38px;font-weight:800;color:#0f172a;margin:10px 0 2px;letter-spacing:-1px}
.hp-price small{font-size:13px;color:#5f6b7a;font-weight:500;margin-left:3px}
.hp-plan>p{font-size:13px;color:#5f6b7a;margin:0 0 22px}
.hp-plan ul{list-style:none;display:flex;flex-direction:column;gap:10px;margin:0 0 26px;padding:0;flex:1}
.hp-plan li{display:flex;align-items:center;gap:9px;font-size:13.5px;color:#475569}
.hp-plan li::before{content:"✓";flex-shrink:0;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#ecfccb;color:#3f6212;font-weight:800;font-size:11px}
.hp-plan .hp-btn{width:100%}
.hp-plan-hot{border:1px solid #4d7c0f;box-shadow:0 20px 60px rgba(101,163,13,.2);overflow:hidden}
.hp-plan-hot::before{content:"";position:absolute;inset:0;background:linear-gradient(160deg,rgba(233,247,201,.6),rgba(255,255,255,0) 45%);pointer-events:none}
.hp-plan-hot>*{position:relative}
/* 四档并排时的紧凑版式：窄列下不让「¥x/月」「免费开始」折行，卡片整体收窄内边距 */
.hp-plan-grid-4 .hp-plan{padding:26px 22px;border-radius:16px}
.hp-plan-grid-4 .hp-plan h3{font-size:15px}
.hp-plan-grid-4 .hp-price{font-size:30px;margin:8px 0 2px;white-space:nowrap}
.hp-plan-grid-4 .hp-price small{font-size:12px}
.hp-plan-grid-4 .hp-plan>p{font-size:12.5px;margin:0 0 16px;min-height:36px}
.hp-plan-grid-4 .hp-plan ul{gap:8px;margin-bottom:18px}
.hp-plan-grid-4 .hp-plan li{font-size:12.5px;gap:7px}
.hp-plan-grid-4 .hp-plan .hp-btn{white-space:nowrap;font-size:13px;padding:11px 10px}
.hp-hot-tag{position:absolute;top:0;left:50%;transform:translateX(-50%);background:#101828;color:#fff;font-size:11px;font-weight:700;padding:6px 16px;border-radius:0 0 10px 10px;z-index:2}
.hp-btn-outline{background:#fff;color:#0f172a;border:1px solid #dbe3ee;border-radius:999px}
.hp-btn-outline:hover{border-color:#3f6212;color:#3f6212}

/* 客户评价 */
.hp-rev-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:24px}
.hp-rev{padding:34px 32px;border-radius:18px;background:#fff;border:1px solid #e9edf4}
.hp-stars{color:#a16207;font-size:15px;letter-spacing:2px;margin-bottom:14px}
.hp-rev blockquote{margin:0;font-size:15px;line-height:1.85;color:#334155}
.hp-rev-user{display:flex;align-items:center;gap:12px;margin-top:20px}
.hp-avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-size:15px;font-weight:700;color:#fff;background:linear-gradient(135deg,color-mix(in srgb,var(--c,#0f766e) 75%,#000),color-mix(in srgb,var(--c,#0f766e) 55%,#000))}
.hp-rev-user b{display:block;font-size:13.5px;color:#0f172a}
.hp-rev-user small{font-size:12px;color:#5f6b7a}

/* CTA */
.hp-cta{max-width:1440px;margin:0 auto;padding:0 32px 96px}
.hp-cta-card{position:relative;overflow:hidden;text-align:center;padding:88px 56px;border-radius:28px;background:#4fd9a2;color:#0f172a;box-shadow:0 30px 80px rgba(79,217,162,.35)}
.hp-cta-glow{position:absolute;inset:0;background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.35),transparent 40%),radial-gradient(circle at 80% 100%,rgba(255,255,255,.22),transparent 45%);pointer-events:none}
.hp-cta-card>*{position:relative}
.hp-cta-card h2{font-size:clamp(24px,3.4vw,36px);margin:0 0 14px;color:#0f172a;font-weight:800;letter-spacing:-1px}
.hp-cta-card p{color:rgba(15,23,42,.72);margin:0 0 30px;font-size:15px}
.hp-btn-white{background:#101828;color:#fff;border:none;font-weight:700;box-shadow:0 8px 24px rgba(16,24,40,.25);border-radius:999px}
.hp-btn-white:hover{transform:translateY(-2px);background:#1b2534}
.hp-cta-card small{display:block;margin-top:20px;color:rgba(15,23,42,.7);font-size:13px}
.hp-cta-card small a{color:#0f172a;font-weight:700}

/* ===== 响应式 ===== */
@media(max-width:1000px){
  .hp-feat-grid,.hp-plan-grid{grid-template-columns:1fr 1fr}
  .hp-rev-grid{grid-template-columns:1fr}
  .hp-win-body{grid-template-columns:1fr}
  .hp-side{display:none}
}
@media(max-width:820px){.public-nav .public-menu{display:none}}
@media(max-width:640px){
  .public-nav{padding:0 16px}
  .public-nav .public-auth button:not(.public-cta):not(.public-login){display:none}
  .public-nav .public-auth .public-login{padding:9px 10px}
  .public-nav .public-auth .public-cta{white-space:nowrap;flex-shrink:0}
  .hp-hero{padding-top:70px}
  .hp-actions{flex-direction:column;align-items:stretch}
  .hp-actions .hp-btn{width:100%}
  .hp-feat-grid,.hp-plan-grid{grid-template-columns:1fr}
  .hp-stat-row{grid-template-columns:1fr}
  .hp-trow{grid-template-columns:1fr 1fr;gap:4px}
  .hp-thead{display:none}
  .hp-section{padding:64px 18px}
  .hp-float{display:none}
}

/* ===== 订单日历：窄屏改为卡片内横向滚动，避免整页横向溢出 ===== */
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.cal-legend{display:flex;gap:18px;margin-top:14px;padding-top:12px;border-top:1px solid var(--line-soft);font-size:12px;color:var(--muted);flex-wrap:wrap;row-gap:8px}
@media(max-width:720px){
  .cal-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px}
  .cal-grid{min-width:520px}
  .cal-legend{gap:12px}
}

/* ===== 订阅与续费页（fix63 重新排版） ===== */
.sub-hero{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:18px;padding:20px 22px;margin-bottom:18px;border-radius:var(--radius-xl);border:1px solid var(--line);background:var(--paper);box-shadow:var(--shadow)}
.sub-hero-l{display:flex;flex-direction:column;justify-content:center;min-width:0}
.sub-cap{font-size:11.5px;color:var(--light);letter-spacing:.04em}
.sub-plan{font-size:27px;font-weight:800;letter-spacing:-.5px;margin:5px 0 8px;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.sub-trial{font-size:11.5px;font-weight:700;color:var(--orange-ink);background:var(--orange-bg);border-radius:999px;padding:2px 9px}
.sub-meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:12.5px;color:var(--muted)}
.sub-acts{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-top:15px}
.sub-acts-tip{font-size:12px;color:var(--light)}
.sub-hero-r{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sub-metric{padding:13px 14px;border-radius:12px;background:var(--bg);border:1px solid var(--line-soft);min-width:0}
.sub-num{font-size:20px;font-weight:800;letter-spacing:-.3px;margin:3px 0 6px;display:flex;align-items:baseline;gap:3px}
.sub-num b{font-size:23px}
.sub-num span{font-size:12px;font-weight:600;color:var(--light)}
.sub-bar{height:6px;border-radius:999px;background:#e9e7e2;overflow:hidden}
.sub-bar i{display:block;height:100%;border-radius:999px;transition:width .3s}
.sub-sub{font-size:11.5px;color:var(--light);margin-top:7px;line-height:1.5}
.plan-flag{position:absolute;top:-1px;right:14px;font-size:11px;font-weight:700;color:#fff;background:var(--plan);border-radius:0 0 7px 7px;padding:3px 9px}
.plan-flag-hot{background:#7c3aed}
.plan-feats{margin:14px 0 4px;border-top:1px solid var(--line-soft);padding-top:11px}
.plan-card .plan-feats p{margin:7px 0;font-size:12.5px;color:var(--muted)}
.sub-note{margin:12px 0 0;text-align:center;font-size:12px;color:var(--light)}
.sub-chips{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.sub-chip{font-size:11.5px;font-weight:600;border-radius:999px;padding:2px 10px}
/* fix166b：原来的浅绿渐变 + 深绿字在深色下是「刺眼亮块 + 字看不清」，
   整块改为变量（--sub-ref-bg / --sub-ref-border 见 :root 与 [data-theme="dark"]），
   浅色档取原值，视觉零变化 */
.sub-ref{display:flex;flex-direction:column;gap:11px;padding:16px 18px;margin-top:18px;border-radius:var(--radius-xl);border:1px solid var(--sub-ref-border);background:var(--sub-ref-bg)}
.sub-ref-head{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.sub-ref-title{font-size:14.5px;font-weight:700;color:var(--green-ink)}
.sub-ref-sub{font-size:12px;color:var(--green-ink)}
.sub-ref-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.sub-ref-stats{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--green-ink)}
@media(max-width:860px){
  .sub-hero{grid-template-columns:1fr;padding:17px 16px}
}
@media(max-width:520px){
  .sub-hero-r{grid-template-columns:1fr}
  .sub-plan{font-size:23px}
}
/* 侧栏底部：账号信息与版本标签同行并排，节约高度 */
.side-foot-row{display:flex;align-items:center;gap:8px;min-width:0}
.side-foot-mail{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side-foot-row .tag{flex:0 0 auto}
.side-foot-acts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}
.side-foot-acts .btn{width:100%;margin:0!important}
/* 订阅到期锁定：侧边栏顶部红色警示条 */
.nav-lock-banner{margin:0 0 10px;padding:9px 11px;border-radius:10px;background:var(--red-bg);border:1px solid color-mix(in srgb,var(--red) 34%,transparent)}
.nav-lock-title{font-size:12.5px;font-weight:700;color:var(--red-ink);line-height:1.4}
.nav-lock-sub{margin-top:3px;font-size:11px;color:var(--red-ink);opacity:.85;line-height:1.5}

/* ===== 快捷续期：点击特效（弹跳 / 波纹 / 选中高亮 / 日期闪动 / 结果条）===== */
.qe-bar{display:flex;gap:8px;flex-wrap:wrap}
.qe-btn{position:relative;overflow:hidden;background:#fff;border-color:var(--line);transition:transform .13s ease,background .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease}
.qe-btn:hover{background:var(--blue-bg);border-color:var(--blue);color:var(--blue-ink)}
.qe-btn:active{transform:scale(.92)}
.qe-btn.qe-on{background:var(--blue-bg);border-color:var(--blue);color:var(--blue-ink);font-weight:600;box-shadow:0 0 0 2px rgba(55,138,221,.18)}
@keyframes qePop{0%{transform:scale(1)}32%{transform:scale(1.14)}62%{transform:scale(.95)}100%{transform:scale(1)}}
.qe-btn.qe-fire{animation:qePop .38s cubic-bezier(.34,1.56,.64,1)}
@keyframes qeRipple{0%{opacity:.5;transform:scale(.4)}100%{opacity:0;transform:scale(2.4)}}
.qe-ripple{position:absolute;top:50%;left:50%;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;background:var(--blue);pointer-events:none;animation:qeRipple .5s ease-out forwards}
@keyframes qeFlash{0%{box-shadow:0 0 0 3px rgba(55,138,221,.35)}100%{box-shadow:0 0 0 0 rgba(55,138,221,0)}}
.qe-flash{animation:qeFlash .9s ease-out}
@keyframes qeNoteIn{0%{opacity:0;transform:translateY(-8px) scale(.98)}100%{opacity:1;transform:translateY(0) scale(1)}}
.qe-note{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px;padding:9px 12px;border-radius:10px;background:var(--green-bg);border:1px solid var(--green);color:var(--green-ink);font-size:12.5px;animation:qeNoteIn .3s cubic-bezier(.34,1.56,.64,1)}
.qe-note .qe-check{width:17px;height:17px;border-radius:50%;background:var(--green);color:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;flex:0 0 auto}
.qe-note .btn{margin-left:auto;background:#fff}
@keyframes qeNumIn{0%{opacity:.15;transform:translateY(7px)}100%{opacity:1;transform:translateY(0)}}
.qe-num{display:inline-block;animation:qeNumIn .34s ease-out}
@media(prefers-reduced-motion:reduce){.qe-btn.qe-fire,.qe-ripple,.qe-flash,.qe-note,.qe-num{animation:none!important}}

/* ===== 订单列表「客户 / 地址」列：「姓名：/ 手机：/ 地址：」三行 =====
   fix96 改为三行结构（去掉圆形首字头像）；fix98 去掉 📋 图标、「所在地区」改名「地址」；
   fix99 三行的「值」统一字体族 / 字号 / 字重 / 字距（手机号原先单独用等宽字体，是唯一的差异源）；
   fix100 标签改成与「值」同号，整格只靠颜色分主次；
   fix101 整列字号对齐「租期」列（该列内联写死 13px）→ 桌面 16px 改为 13px，行高 1.72 改为 1.7；
   fix102 「新 / 老N」客户标记从「手机」行移到「姓名」行之后；
   fix103 标记改挂到「手机」末位之后并用锚点抬到上一行 → 标记右缘与手机末位对齐（姓名行 / 手机行右缘齐平）；
   fix104 标签「手机号：」去掉「号」字 → 「手机：」，三个标签同为 3 个全角字符、等宽
         → 三行的「值」左边缘严格对齐（CSS 无需改动，仅改了 Orders.js 的标签文案） */
/* 去掉原来的圆形首字头像，改成与客户档案一致的「标签：值」行内结构；
   值用 inline 流（非 flex），地址过长时自然折行，和参考图一致 */
/* min-width 会撑起该列的 min-content，避免窄屏表格把本列压成「竖排」；max-width 防止桌面过宽 */
.oc-cell{min-width:150px;max-width:270px;cursor:pointer;white-space:normal;font-family:inherit;font-size:13px;font-weight:400;letter-spacing:normal}
.oc-line{line-height:1.7;min-width:0}
/* fix100：标签与「值」同字号（inherit → 桌面 16px / 手机 13px），仅用颜色区分主次 */
.oc-lb{color:var(--muted);font-size:inherit;font-family:inherit;font-weight:400;letter-spacing:normal}
/* fix99：姓名 / 手机号 / 地址 三行的「值」统一字体族、字号、字重、字距。
   原先手机号单独用了等宽字体（ui-monospace），是这一列里唯一与其他两行不一致的地方。 */
.oc-val{color:var(--ink);font-family:inherit;font-size:inherit;font-weight:400;letter-spacing:normal;word-break:break-word}
/* 手机号数字等宽对齐：只启用表格数字（tabular-nums），不改变字体族 */
.oc-phone{font-variant-numeric:tabular-nums}
.oc-empty{color:var(--light);font-weight:400}
/* 客户标记：新客「新」（绿）；老客「老N」（N=第几次租，N≥2，灰蓝） */
.oc-new{display:inline-block;margin-left:6px;padding:0 6px;border:1px solid var(--green-ink);border-radius:5px;background:var(--green-bg);color:var(--green-ink);font-size:11px;font-weight:700;line-height:16px;vertical-align:middle}
.oc-old{display:inline-block;margin-left:6px;padding:0 6px;border:1px solid var(--line);border-radius:5px;background:var(--bg);color:var(--muted);font-size:11px;font-weight:700;line-height:16px;vertical-align:middle}
/* fix103：「新 / 老N」放到手机号末位（最后一位数字）的正上方，于是姓名行与手机号行右缘对齐。
   实现：锚点 0 宽 0 高（不占布局、不改变手机号行宽），标记绝对定位 + right:0
   → 标记右缘 = 锚点右缘 = 手机号末位；再用 bottom 抬到上一行。
     锚点 bottom = 手机号行的基线；目标：标记底边落在姓名行基线上方约 3px（视觉居中于姓名行文字）
     → 抬升量 = 1 个行高(=1.7 × 13px = 22.1px) - 3px = 19px。 */
.oc-badge-anchor{position:relative;display:inline-block;width:0;height:0;vertical-align:baseline}
.oc-badge-anchor>.oc-new,
.oc-badge-anchor>.oc-old{margin-left:0;position:absolute;right:0;bottom:calc(100% + 19px);white-space:nowrap}
/* 手机端表格统一 white-space:nowrap，这里必须显式放开换行，否则三行会被拉成一长条 */
.orders-table-wrap td .oc-cell{white-space:normal}
@media(max-width:850px){
  /* 手机：姓名 + 「新/老N」标记要能并排（fix102 标记已移到姓名行），所以列宽下限比桌面大一点。
     font-size 不再需要在这写：.oc-cell 基础值已是 13px，与「租期」列一致（fix101） */
  .orders-table-wrap td .oc-cell{min-width:186px;max-width:210px}
}

/* ===== 财务管理：收支分类卡片 + 资金流水客户区分（fix136） =====
   背景：分类卡原来是「纯文字 + 金额」的白块，一屏 9 张密密麻麻分不出主次；
   资金流水原来只用一组「几乎看不出差别」的极淡底色区分客户。 */

/* --- 收支分类卡片：图标徽章 + 科目名 + 金额 + 笔数/占比 + 占比条 --- */
.cat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:12px}
.cat-total{display:flex;flex-direction:column;align-items:flex-end;gap:1px;flex:0 0 auto}
.cat-total span{font-size:11.5px;color:var(--muted)}
.cat-total strong{font-size:18px;font-weight:750;letter-spacing:-.2px;font-variant-numeric:tabular-nums}
.cat-card{position:relative;display:flex;flex-direction:column;gap:9px;overflow:hidden;box-sizing:border-box;
  padding:14px 15px 12px;border:1px solid var(--line);border-radius:14px;background:var(--paper);color:var(--ink);
  font:inherit;text-align:left;cursor:pointer;
  transition:transform .18s cubic-bezier(.2,.8,.2,1),box-shadow .18s,border-color .18s,background .18s}
/* 右上角淡色圆斑：给卡片一点色彩层次，但压得足够淡，不跟金额抢视线 */
.cat-card::after{content:"";position:absolute;z-index:0;right:-30px;top:-34px;width:86px;height:86px;border-radius:50%;
  background:var(--c);opacity:.07;transition:opacity .22s,transform .22s}
.cat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-hover);border-color:color-mix(in srgb,var(--c) 45%,var(--line))}
.cat-card:hover::after{opacity:.13;transform:scale(1.08)}
.cat-card.active{border-color:var(--c);background:color-mix(in srgb,var(--c) 7%,var(--paper));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 16%,transparent)}
.cat-card.active::after{opacity:.18}
/* 金额为 0 的科目整体压暗，让真有数据的科目先被看到 */
.cat-card.zero{opacity:.5}
.cat-card.zero:hover,.cat-card.zero.active{opacity:1}
.cat-top{display:flex;align-items:center;gap:8px;min-width:0}
.cat-ico{flex:0 0 auto;width:25px;height:25px;border-radius:8px;display:grid;place-items:center;font-size:13px;
  background:color-mix(in srgb,var(--c) 14%,transparent)}
.cat-name{font-size:12px;font-weight:650;color:color-mix(in srgb,var(--c) 72%,var(--ink));
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cat-amt{display:block;font-size:20px;font-weight:750;line-height:1.15;letter-spacing:-.4px;font-variant-numeric:tabular-nums}
.cat-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11.5px;color:var(--muted)}
.cat-pct{font-weight:700;color:color-mix(in srgb,var(--c) 62%,var(--muted))}
.cat-check{position:absolute;z-index:1;right:11px;top:11px;width:17px;height:17px;border-radius:50%;display:grid;place-items:center;
  background:var(--c);color:#fff;font-size:11px;font-weight:700;opacity:0;transform:scale(.5);transition:.2s}
.cat-card.active .cat-check{opacity:1;transform:scale(1)}

/* --- 资金流水：同一客户 = 同色圆标 + 左侧色条 + 行底色；点客户名只看该客户 --- */
.fin-records-table{--cc-a:6%;--cc-a-hover:13%}
[data-theme="dark"] .fin-records-table{--cc-a:16%;--cc-a-hover:26%}
.fin-records-table tbody tr{background:color-mix(in srgb,var(--cc,transparent) var(--cc-a),transparent);transition:background .15s}
/* 覆盖全局 tr:hover td 的灰底（它会把行底色整块盖掉） */
.fin-records-table tbody tr:hover td{background:color-mix(in srgb,var(--cc,transparent) var(--cc-a-hover),var(--paper))}
/* 首列左侧色条：表头与单元格都用 4px 透明占位，保证有无客户时左右对齐一致 */
.fin-records-table thead th:first-child{border-left:4px solid transparent}
.fin-records-table tbody td:first-child{border-left:4px solid var(--cc,transparent)}
.fin-cust{display:inline-flex;align-items:center;gap:8px;min-width:0;max-width:200px}
.fin-cust-av{flex:0 0 auto;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;
  font-size:12px;font-weight:700;color:#fff;
  background:linear-gradient(135deg,color-mix(in srgb,var(--c,#475569) 84%,#fff),color-mix(in srgb,var(--c,#475569) 62%,#000))}
.fin-cust-name{min-width:0;max-width:160px;padding:0;border:0;border-bottom:1px dashed transparent;background:transparent;
  color:var(--ink);font:inherit;font-size:inherit;text-align:left;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fin-cust-name:hover{color:var(--c,var(--accent));border-bottom-color:currentColor}
.fin-cust-name.active{color:var(--c,var(--accent));font-weight:700;border-bottom-style:solid}
.fin-cust-chip{display:inline-flex;align-items:center;gap:7px;font-weight:600;
  background:var(--accent-light);border-color:color-mix(in srgb,var(--accent) 32%,transparent);color:var(--accent-ink)}
.fin-cust-dot{width:9px;height:9px;border-radius:50%;background:var(--c,#475569);flex:0 0 auto}

@media(max-width:850px){
  /* 手机端首列是 sticky（冻结列），必须自己带上行底色，否则色条与底色在冻结列上完全看不见 */
  .fin-records-table tbody td:first-child{background:color-mix(in srgb,var(--cc,transparent) var(--cc-a),var(--paper))}
  .fin-cust{max-width:168px}
}
@media(max-width:600px){
  .cat-grid{grid-template-columns:1fr 1fr;gap:10px}
  .cat-card{padding:12px 12px 11px}
  .cat-amt{font-size:17px}
  .cat-name{font-size:11.5px}
}

/* fix166：套餐卡 / 新手引导卡深色适配（深色下 --plan 是亮色档，徽标文字改用深色） */
[data-theme="dark"] .plan-flag{color:#0f151c}
[data-theme="dark"] .plan-card.current{box-shadow:0 0 0 2px var(--plan),0 12px 30px rgba(0,0,0,.4)}

/* ===== fix184：全站问候语横幅 =====
   由 js/greeting.js 插到 #appMain 最顶部（看板页不插，改用看板自己的问候卡），
   所有色值走主题变量，浅色 / 深色与三套强调色主题都自动适配。 */
#greetBar{margin:0 0 18px}
.greet-bar{display:flex;align-items:center;gap:11px;padding:11px 14px;border-radius:14px;
  border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line-soft));
  background:linear-gradient(90deg,var(--accent-light),color-mix(in srgb,var(--paper) 86%,var(--accent-light)));
  animation:greetBarIn .35s ease}
.greet-bar-ico{font-size:18px;line-height:1;flex-shrink:0}
.greet-bar-body{min-width:0;flex:1}
.greet-bar-text{font-size:13.5px;font-weight:600;color:var(--ink);word-break:break-word}
.greet-bar-meta{margin-top:1px;font-size:11.5px;color:var(--muted)}
.greet-bar-x{width:26px;height:26px;flex-shrink:0;border:none;border-radius:8px;background:transparent;
  color:var(--muted);font-size:14px;cursor:pointer;display:grid;place-items:center;transition:.2s}
.greet-bar-x:hover{background:color-mix(in srgb,var(--paper) 70%,var(--accent-light));color:var(--ink)}
@keyframes greetBarIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media(max-width:850px){
  #greetBar{margin-bottom:14px}
  .greet-bar{padding:10px 12px;gap:9px}
  .greet-bar-ico{font-size:16px}
  .greet-bar-text{font-size:12.5px}
  .greet-bar-meta{font-size:11px}
}
/* 全站问候语的「开始/结束显示时间」两列：datetime-local 在窄屏需要整行，否则字符被裁 */
.greet-time-row{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
@media(max-width:640px){.greet-time-row{grid-template-columns:1fr}}

/* fix185：超管通知页两个发布板块加底色，便于一眼定位（浅色/深色通过 color-mix 适配） */
.card.notice-tint{background:linear-gradient(180deg,color-mix(in srgb,var(--accent-light) 42%,var(--paper)),var(--paper));
  border:1px solid color-mix(in srgb,var(--accent-light) 65%,var(--line-soft))}
.card.greet-tint{background:linear-gradient(180deg,color-mix(in srgb,#ffd9a8 42%,var(--paper)),var(--paper));
  border:1px solid color-mix(in srgb,#ffd9a8 60%,var(--line-soft))}

/* fix211：表头/单元格注释浮层 —— 接管原生 title，即时弹出、支持换行，并把「怎么算：」高亮为蓝字。
   深色底不用主题变量：浮层需要跨越任意主题色都保持易读，跟随主题反而会在浅色主题上糊掉。 */
.col-tip-box{position:fixed;left:0;top:0;z-index:130;max-width:330px;padding:9px 12px;border-radius:10px;
  background:rgba(20,24,32,.96);color:#fff;font-size:12.5px;line-height:1.7;letter-spacing:.2px;
  box-shadow:0 10px 30px rgba(15,23,42,.26);pointer-events:none;white-space:normal;
  opacity:0;transform:translateY(-3px);transition:opacity .13s ease,transform .13s ease}
.col-tip-box.show{opacity:1;transform:translateY(0)}
.col-tip-box .ct-plain{font-weight:600}
.col-tip-box .ct-algo{margin-top:2px;color:#cbced6}
.col-tip-box .ct-fx{color:#6fc6ff;font-weight:600}
/* v229：鼠标移到有注释的表头上不再切成「帮助」光标（带问号，用户反馈碍眼），
   保持普通指针即可 —— 提示浮层照常弹出，只是光标不带问号。 */
@media(hover:hover){
  thead th[title],thead th[data-col-tip]{cursor:default}
}

/* fix214：扫码落地页（?scan= 打开，未登录也能看设备有限信息） */
#scanLanding{position:fixed;inset:0;z-index:200;display:none}
#scanLanding .sl-mask{position:absolute;inset:0;background:rgba(15,23,42,.55);backdrop-filter:blur(2px);display:flex;align-items:flex-start;justify-content:center;padding:24px 14px;overflow:auto}
#scanLanding .sl-card{position:relative;width:100%;max-width:440px;background:var(--paper);color:var(--text);border:1px solid var(--line);border-radius:16px;box-shadow:0 24px 60px rgba(15,23,42,.32);margin-top:6vh;overflow:hidden}
#scanLanding .sl-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--line-soft);background:var(--accent-light)}
#scanLanding .sl-brand{font-weight:800;font-size:15px;color:var(--accent-ink)}
#scanLanding .sl-close{background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:8px;padding:6px 12px;font-size:12.5px;cursor:pointer}
#scanLanding .sl-body{padding:18px}
#scanLanding .sl-loading{padding:40px 0;text-align:center;color:var(--muted)}
#scanLanding .sl-dev{display:flex;align-items:center;gap:12px;margin-bottom:14px}
#scanLanding .sl-dev .sl-ico{width:42px;height:42px;border-radius:12px;background:var(--accent-light);display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}
#scanLanding .sl-dev .sl-name{font-size:16px;font-weight:800}
#scanLanding .sl-dev .sl-sub{font-size:12px;color:var(--muted);margin-top:2px}
#scanLanding .sl-row{display:flex;justify-content:space-between;font-size:13px;padding:7px 0;border-bottom:1px dashed var(--line-soft)}
#scanLanding .sl-row .k{color:var(--muted)}
#scanLanding .sl-banner{padding:12px 14px;border-radius:12px;font-size:13.5px;font-weight:700;margin:4px 0 12px}
#scanLanding .sl-banner.renting{background:var(--blue-bg);color:var(--blue-ink)}
#scanLanding .sl-banner.idle{background:var(--green-bg);color:var(--green-ink)}
#scanLanding .sl-banner.repair{background:var(--orange-bg);color:var(--orange-ink)}
#scanLanding .sl-banner.sold{background:#f1f1f0;color:var(--muted)}
#scanLanding .sl-orders{margin-top:10px}
#scanLanding .sl-orders .ot{font-size:12.5px;color:var(--muted);margin:8px 0 6px}
#scanLanding .sl-order{border:1px solid var(--line-soft);border-radius:10px;padding:10px 12px;margin-bottom:8px;font-size:12.5px}
#scanLanding .sl-order .oc{font-weight:700;font-size:13.5px;margin-bottom:4px}
#scanLanding .sl-login-tip{margin-top:14px;padding:12px 14px;background:var(--accent-light);border-radius:12px;font-size:12.5px;color:var(--accent-ink);display:flex;align-items:center;justify-content:space-between;gap:10px}
#scanLanding .sl-login-btn{background:var(--accent);color:#fff;border:none;border-radius:8px;padding:7px 14px;font-size:12.5px;font-weight:700;cursor:pointer;flex-shrink:0}
@media(max-width:480px){#scanLanding .sl-mask{padding:0}#scanLanding .sl-card{max-width:none;min-height:100%;margin-top:0;border-radius:0}}

/* ===== 手机端照片上传按钮：解决「裸 file input 在手机上难以点击 / iOS 不弹选择器」 ===== */
/* 关键：可见大按钮是 <label>，内部叠一个铺满的透明 input；点哪都等于点 input，iOS/Android 都能唤起系统选择器 */
.upload-label{font-size:13px;font-weight:600;color:var(--ink);margin-bottom:6px}
.photo-upload-btn{position:relative;display:block;width:100%;min-height:48px;box-sizing:border-box;padding:13px 14px;border:1.5px dashed var(--line);border-radius:10px;background:var(--bg);color:var(--accent-ink);font-size:14px;font-weight:600;text-align:center;cursor:pointer;overflow:hidden;-webkit-tap-highlight-color:transparent}
.photo-upload-btn:active{background:var(--accent-light)}
.photo-upload-btn input[type=file]{position:absolute;inset:0;opacity:0;width:100%;height:100%;font-size:0;cursor:pointer}

/* ===== v266：卡片水印底数字（设备管理「出租中/闲置待租」+ 数据看板「在租设备数」） =====
   右下角超大淡色数字，随卡片主色 12% 透明度，被卡片圆角裁剪；纯装饰不参与交互 */
.card-wm{position:absolute;right:10px;bottom:-16px;z-index:0;font-size:64px;font-weight:800;line-height:1;letter-spacing:-2px;font-variant-numeric:tabular-nums;color:var(--accent,var(--c,#6366f1));opacity:.12;pointer-events:none;user-select:none}
.dashboard-page .card-wm{color:var(--c,var(--accent));font-size:54px;right:8px;bottom:-12px}
/* 保证卡片内容在水印之上 */
.inv-page .inv-acard-desc,.dashboard-page .dash-mini-label,.dashboard-page .dash-mini-value{position:relative;z-index:2}
@media(max-width:850px){.inv-page .card-wm{font-size:52px;right:8px;bottom:-12px}}
@media(max-width:680px){.dashboard-page .card-wm{font-size:44px;bottom:-9px}}

/* ===== v271：统计卡设计系统「全站化」=====
   把只作用于设备管理页（.inv-page）的 inv-acard 卡片体系提升为全站通用：
   配件库存 / 订单管理 / 订单日历 / 客户管理 / 售后工单 一律套用同一套
   结构（inv-acard-top 标签+图标芯片 / inv-acard-value 数值 / inv-acard-desc 描述）
   与同一套样式（字号、悬停上浮+光晕、图标微旋、8 色主题），实现 1:1 一致。
   原 .inv-page 前缀规则保留不动，本块为等价的全局版本。 */
.inv-acard{
  --glass-bg:rgba(255,255,255,.7);
  --glass-border:rgba(226,232,240,.8);
  --card-shadow-md:0 4px 16px rgba(148,163,184,.12);
  --card-shadow-xl:0 20px 60px rgba(148,163,184,.2);
  --blur:blur(20px);
}
[data-theme="dark"] .inv-acard{
  --glass-bg:rgba(30,41,59,.55);
  --glass-border:rgba(148,163,184,.18);
  --card-shadow-md:0 4px 16px rgba(0,0,0,.28);
  --card-shadow-xl:0 20px 60px rgba(0,0,0,.45);
}
.inv-glass-wrap{position:relative;overflow:hidden;border-radius:24px}
/* v268：去掉卡片框外的背景底色（原彩色径向渐变光斑层整个移除，wrap 与页面背景融为一体） */
.inv-glass-wrap::before{content:none}
@keyframes invBgFloat{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(30px,-30px) scale(1.05)}66%{transform:translate(-20px,20px) scale(.95)}}
.inv-glass-inner{position:relative;z-index:1;padding:10px 8px}
/* 头部 */
.inv-asset-head{display:flex;align-items:baseline;justify-content:space-between;margin:0 4px 18px}
.inv-grad-title{font-size:24px;font-weight:700;letter-spacing:-.5px;background:linear-gradient(135deg,var(--ink) 0%,var(--muted) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.inv-asset-updated{font-size:13px;color:var(--light);font-variant-numeric:tabular-nums;padding:6px 14px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:20px;-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur)}
/* 网格 */
.inv-asset-grid{gap:14px;margin:0 0 10px}
/* 玻璃卡片（底色随网站皮肤色 --bg，边框随 --line，深浅主题自动跟随） */
.inv-acard{
  position:relative;overflow:hidden;
  background:var(--bg);border:1px solid var(--line);border-radius:16px;padding:14px;
  -webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);
  box-shadow:var(--card-shadow-md);
  transition:all .4s cubic-bezier(.22,1,.36,1);cursor:default;
}
.inv-acard:hover{transform:translateY(-4px) scale(1.01);background:var(--bg);border-color:var(--line);box-shadow:var(--card-shadow-xl),0 0 40px var(--accent-shadow);z-index:5}
/* 悬停旋转流动光晕（radial glow + rotateGlow） */
.inv-acard::before{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,var(--accent-glow) 0%,transparent 70%);opacity:0;transition:opacity .5s ease;pointer-events:none;z-index:0}
.inv-acard:hover::before{opacity:.3;animation:invRotateGlow 3s linear infinite}
@keyframes invRotateGlow{from{transform:rotate(0)}to{transform:rotate(360deg)}}
/* 卡片顶部 */
.inv-acard-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;position:relative;z-index:2}
.inv-acard-label{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--muted);letter-spacing:.5px}
/* 呼吸状态点 */
.inv-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px var(--accent-shadow)}
.inv-dot.pulse{animation:invPulse 2s ease-in-out infinite}
@keyframes invPulse{0%,100%{box-shadow:0 0 8px var(--accent-shadow),0 0 0 0 var(--accent-glow)}50%{box-shadow:0 0 12px var(--accent-shadow),0 0 0 8px transparent}}
/* 图标芯片 40px */
.inv-acard-icon{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent-soft),var(--accent-soft));color:var(--accent);border:1px solid var(--accent-border);box-shadow:0 4px 12px var(--accent-shadow),inset 0 1px 0 rgba(255,255,255,.3);transition:all .3s cubic-bezier(.34,1.56,.64,1)}
.inv-acard-icon svg{width:17px;height:17px}
.inv-acard:hover .inv-acard-icon{transform:scale(1.1) rotate(5deg);box-shadow:0 6px 20px var(--accent-shadow),inset 0 1px 0 rgba(255,255,255,.4)}
/* 数值 34px */
.inv-acard-value{position:relative;font-size:30px;font-weight:800;line-height:1;letter-spacing:-1px;font-variant-numeric:tabular-nums;color:var(--ink);z-index:2;margin-bottom:5px;text-shadow:0 2px 4px rgba(0,0,0,.05)}
.inv-acard-unit{font-size:15px;font-weight:600;color:var(--light);margin-left:4px;letter-spacing:0}
.inv-acard-currency{font-size:21px;font-weight:700;margin-right:2px;background:linear-gradient(135deg,var(--accent) 0%,var(--accent) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.inv-acard-value.inv-accent{background:linear-gradient(135deg,var(--accent) 0%,var(--accent-light) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.inv-acard-value.inv-accent .inv-acard-unit,.inv-acard-value.inv-accent .inv-acard-currency{-webkit-text-fill-color:var(--light);background:none;color:var(--light)}
.inv-num-money{background:linear-gradient(135deg,var(--accent) 0%,var(--accent-light) 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
/* 描述 */
.inv-acard-desc{position:relative;font-size:12px;color:var(--light);z-index:2;line-height:1.6}
.inv-acard-desc b{color:var(--muted);font-weight:600}
/* 进度条 */
.inv-acard-bar{position:relative;margin-top:12px;height:7px;border-radius:99px;background:rgba(226,232,240,.6);overflow:hidden;z-index:2;box-shadow:inset 0 1px 2px rgba(148,163,184,.2)}
[data-theme="dark"] .inv-acard-bar{background:rgba(148,163,184,.18)}
.inv-acard-bar>i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--accent),var(--accent-light));box-shadow:0 0 12px var(--accent-shadow);width:0;transition:width 1.2s cubic-bezier(.22,1,.36,1) .2s;position:relative}
.inv-acard-bar>i::after{content:'';position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(180deg,rgba(255,255,255,.3),transparent);border-radius:99px 99px 0 0}
/* 环形图 60px */
.inv-card-body{display:flex;align-items:center;gap:14px;position:relative;z-index:2}
.inv-ring{position:relative;width:60px;height:60px;flex:none}
.inv-ring svg{width:60px;height:60px;transform:rotate(-90deg);filter:drop-shadow(0 0 6px var(--accent-shadow))}
.inv-ring-track{stroke:rgba(226,232,240,.8);stroke-width:6}
[data-theme="dark"] .inv-ring-track{stroke:rgba(148,163,184,.2)}
.inv-donut-fg{stroke:var(--accent);stroke-width:6;stroke-linecap:round;stroke-dasharray:195;stroke-dashoffset:195;transition:stroke-dashoffset 1.4s cubic-bezier(.22,1,.36,1) .3s}
.inv-ring-em{position:absolute;inset:0;display:grid;place-items:center;font-size:14px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--accent);text-shadow:0 0 12px var(--accent-shadow)}
.inv-ring-meta{flex:1;min-width:0}
/* 8 种发光色彩主题 */
.inv-g1{--accent:#6366f1;--accent-light:#818cf8;--accent-soft:rgba(99,102,241,.08);--accent-border:rgba(99,102,241,.2);--accent-shadow:rgba(99,102,241,.25);--accent-glow:rgba(99,102,241,.12)}
.inv-g2{--accent:#10b981;--accent-light:#34d399;--accent-soft:rgba(16,185,129,.08);--accent-border:rgba(16,185,129,.2);--accent-shadow:rgba(16,185,129,.25);--accent-glow:rgba(16,185,129,.12)}
.inv-g3{--accent:#f59e0b;--accent-light:#fbbf24;--accent-soft:rgba(245,158,11,.08);--accent-border:rgba(245,158,11,.2);--accent-shadow:rgba(245,158,11,.25);--accent-glow:rgba(245,158,11,.12)}
.inv-g4{--accent:#f43f5e;--accent-light:#fb7185;--accent-soft:rgba(244,63,94,.08);--accent-border:rgba(244,63,94,.2);--accent-shadow:rgba(244,63,94,.25);--accent-glow:rgba(244,63,94,.12)}
.inv-g5{--accent:#8b5cf6;--accent-light:#a78bfa;--accent-soft:rgba(139,92,246,.08);--accent-border:rgba(139,92,246,.2);--accent-shadow:rgba(139,92,246,.25);--accent-glow:rgba(139,92,246,.12)}
.inv-g6{--accent:#3b82f6;--accent-light:#60a5fa;--accent-soft:rgba(59,130,246,.08);--accent-border:rgba(59,130,246,.2);--accent-shadow:rgba(59,130,246,.25);--accent-glow:rgba(59,130,246,.12)}
.inv-g7{--accent:#14b8a6;--accent-light:#2dd4bf;--accent-soft:rgba(20,184,166,.08);--accent-border:rgba(20,184,166,.2);--accent-shadow:rgba(20,184,166,.25);--accent-glow:rgba(20,184,166,.12)}
.inv-g8{--accent:#06b6d4;--accent-light:#22d3ee;--accent-soft:rgba(6,182,212,.08);--accent-border:rgba(6,182,212,.2);--accent-shadow:rgba(6,182,212,.25);--accent-glow:rgba(6,182,212,.12)}
/* 响应式（对照参考稿） */
@media(max-width:1024px){.inv-asset-grid{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:850px){.inv-acard{padding:12px!important}.inv-acard-value{font-size:26px}}
@media(max-width:640px){.inv-asset-grid{grid-template-columns:repeat(2,1fr)!important;gap:10px!important}.inv-asset-head h2{font-size:20px}}
/* 减少动态效果偏好 */
@media (prefers-reduced-motion:reduce){
  .inv-glass-wrap::before,.inv-acard::before,.inv-dot.pulse{animation:none!important}
}

/* 统计卡：桌面 5/4 列，窄屏逐级降为 2 列、超窄 1 列（覆盖页面内联的 repeat(5/4,1fr)） */
.inv-stat-5{grid-template-columns:repeat(5,1fr)!important}
.inv-stat-4{grid-template-columns:repeat(4,1fr)!important}
@media(max-width:1100px){
  .inv-stat-5{grid-template-columns:repeat(4,1fr)!important}
  .inv-stat-4{grid-template-columns:repeat(3,1fr)!important}
}
@media(max-width:850px){
  .inv-stat-5,.inv-stat-4{grid-template-columns:repeat(2,1fr)!important}
  /* 产品搜索框满宽 */
  #invPicker{width:100%}
  #invPickerInput{width:100%!important}
  .toolbar>input.inv-stk-search{width:100%!important}
  /* 表格卡片头部的操作按钮行换行，避免溢出 */
  .table-wrap .card-header>div:last-child{display:flex!important;flex-wrap:wrap!important;width:100%!important;gap:8px!important}
  .table-wrap .card-header>div:last-child>span:first-child{flex:1 1 100%}
  .table-wrap .card-header>div:last-child .btn{flex:1 1 calc(50% - 8px);min-width:0;justify-content:center}
}
@media(max-width:600px){
  .inv-stat-5,.inv-stat-4{grid-template-columns:repeat(2,1fr)!important}
}
@media(max-width:380px){
  .inv-stat-5,.inv-stat-4{grid-template-columns:1fr!important}
}
/* 设备资产总览卡：手机端一排 2 个（8 卡共 4 排），间距收紧 */
@media(max-width:640px){
  .inv-asset-grid{grid-template-columns:repeat(2,1fr)!important;gap:10px!important}
  .inv-acard{padding:12px 10px!important}
  .inv-acard-value{font-size:24px!important}
  .card-wm{font-size:42px!important;right:6px!important;bottom:-10px!important;opacity:.1}
}