/* 统一界面系统（T-0359）：全工作台唯一的设计令牌和公共组件。
   颜色、字号、间距、圆角只在本文件 :root 里定义，页面里不再写死；所有类名带 u- 前缀，和旧样式共存、逐页迁移。
   外壳和列表页照 RuoYi 的统一写法（深色侧栏、位置、页签、搜索区 → 按钮栏 → 表格 → 分页、表单弹窗、统一确认）；
   AI 任务进度、新旧对比、指标卡是 RuoYi 没有的，按商家最常看的页面专门设计。规矩见 docs/UI-SYSTEM.md。 */
:root{
  /* 主色：一处改，全站跟着变 */
  --u-primary:#2563eb;--u-primary-hover:#1d4ed8;--u-primary-soft:#eff4ff;--u-primary-line:#c7d7fe;
  /* 状态色：每种只有正色、浅底、描边三档 */
  --u-ok:#16a34a;--u-ok-soft:#ecfdf3;--u-ok-line:#bbf0cf;
  --u-warn:#d97706;--u-warn-soft:#fff7e8;--u-warn-line:#fbdba7;
  --u-danger:#dc2626;--u-danger-soft:#fef1f1;--u-danger-line:#fbcaca;
  --u-info:#64748b;--u-info-soft:#f3f5f8;--u-info-line:#e2e7ee;
  /* 中性色 */
  --u-bg:#f2f4f7;--u-panel:#fff;--u-sunken:#f8fafc;--u-line:#e5e8ee;--u-line-soft:#eef1f5;
  --u-text:#111827;--u-text-2:#4b5563;--u-text-3:#8a94a6;--u-line-strong:#cfd5df;--u-btn-shadow:0 1px 2px rgba(16,24,40,.05);--u-primary-ring:rgba(37,99,235,.18);--u-on-primary:#fff;--u-white:#fff;--u-link:var(--u-primary);
  /* 品牌渐变：只用在品牌标、进度条和每页唯一的主操作（.u-btn.is-brand），用多了就不「快」了 */
  --u-brand-grad:var(--u-primary);--u-on-brand:#fff;--u-brand-glow:none;--u-side-active-bg:var(--u-primary);--u-side-active-text:#fff;--u-side-active-bar:transparent;
  /* 侧栏（深色，和 RuoYi 一样把「导航」和「内容」分开） */
  --u-side-bg:#111827;--u-side-sub:#0b1220;--u-side-text:#a7b0c0;--u-side-text-on:#fff;--u-side-hover:rgba(255,255,255,.06);--u-side-group:#6b7588;
  /* 字号只有 6 档；数字用等宽数字 */
  --u-fs-xs:12px;--u-fs-sm:13px;--u-fs:14px;--u-fs-md:16px;--u-fs-lg:20px;--u-fs-xl:28px;
  /* 间距 4 的倍数；圆角 3 档 */
  --u-s1:4px;--u-s2:8px;--u-s3:12px;--u-s4:16px;--u-s5:20px;--u-s6:24px;--u-s8:32px;
  --u-r-sm:4px;--u-r:6px;--u-r-lg:10px;
  --u-shadow:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.06);--u-shadow-pop:0 12px 32px rgba(16,24,40,.18);
  --u-font:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Segoe UI",Roboto,sans-serif;
  --u-side-w:216px;--u-top-h:52px;
  /* 尺寸：控件高、面板内边距、菜单行高、页面留白——两种风格（紧凑 / 舒展）只差这几个数 */
  --u-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a94a6' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  --u-ico-inbox:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='22 12 16 12 14 15 10 15 8 12 2 12'/%3E%3Cpath d='M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z'/%3E%3C/svg%3E");
  --u-h:32px;--u-btn-px:14px;--u-pad:20px;--u-menu-h:42px;--u-main-pad:16px;--u-gap:12px;--u-sheet-r:10px;
}
/* Amiao 品牌配色（T-0360）：用户要「高科技感、速度感」——秒出落地页、秒出单。几套放进样板页比较，选定后只留一套。
   主色上的白字对比度都在 4.5:1 以上；渐变只做点缀。 */
/* 电光紫 → 青（推荐）：深夜蓝黑侧栏 + 紫到青的光，像屏幕上的光速 */
:root[data-u-primary="bolt"]{--u-primary-ring:rgba(91,76,255,.2);--u-primary:#5b4cff;--u-primary-hover:#4a3bf0;--u-primary-soft:#f1efff;--u-primary-line:#d6d1ff;
  --u-brand-grad:linear-gradient(120deg,#5b4cff 0%,#3b82f6 55%,#22d3ee 100%);
  --u-side-bg:#090b14;--u-side-sub:#05060c;--u-side-text:#9aa3b8;--u-side-group:#5d6680;--u-side-hover:rgba(124,140,255,.08);
  --u-side-active-bg:linear-gradient(90deg,rgba(91,76,255,.38),rgba(34,211,238,.06));--u-side-active-bar:#22d3ee;--u-brand-glow:0 0 18px rgba(91,76,255,.45)}
/* 闪电绿（极客黑）：黑按钮 + 荧光绿，像跑分软件和赛车仪表 */
:root[data-u-primary="volt"]{--u-primary-ring:rgba(132,190,20,.3);--u-primary:#0b0d10;--u-primary-hover:#23272e;--u-primary-soft:#f3fbe2;--u-primary-line:#d7eda6;--u-on-primary:#c6f432;--u-link:#3f6f0a;
  --u-brand-grad:linear-gradient(120deg,#c6f432 0%,#5eead4 100%);--u-on-brand:#0b0d10;
  --u-side-bg:#0b0d10;--u-side-sub:#060708;--u-side-text:#9ca3ad;--u-side-group:#5f6670;--u-side-hover:rgba(198,244,50,.06);
  --u-side-active-bg:rgba(198,244,50,.12);--u-side-active-text:#c6f432;--u-side-active-bar:#c6f432;--u-brand-glow:0 0 18px rgba(198,244,50,.35)}
/* 极速橙：火箭尾焰，速度感最强，科技感弱一些 */
:root[data-u-primary="flame"]{--u-primary-ring:rgba(214,58,10,.18);--u-primary:#d63a0a;--u-primary-hover:#b9320a;--u-primary-soft:#fff1eb;--u-primary-line:#ffd2c0;
  --u-brand-grad:linear-gradient(120deg,#ff3d00 0%,#ff8a00 100%);
  --u-side-bg:#120d0b;--u-side-sub:#0a0706;--u-side-text:#b0a39c;--u-side-group:#6e625b;--u-side-hover:rgba(255,120,60,.08);
  --u-side-active-bg:linear-gradient(90deg,rgba(255,61,0,.32),rgba(255,138,0,.05));--u-side-active-bar:#ff8a00;--u-brand-glow:0 0 18px rgba(255,61,0,.4)}
/* 现在线上的紫，和最早样板的蓝，留着对比 */
:root[data-u-primary="purple"]{--u-primary-ring:rgba(79,70,229,.18);--u-primary:#4f46e5;--u-primary-hover:#4338ca;--u-primary-soft:#eef0ff;--u-primary-line:#cdd0fb}
/* 浅色侧栏 */
:root[data-u-side="light"]{--u-side-active-text:var(--u-primary);--u-side-bg:#fff;--u-side-sub:#f8fafc;--u-side-text:#4b5563;--u-side-text-on:var(--u-primary);--u-side-hover:#f3f5f8;--u-side-group:#8a94a6}
/* 暗色模式 */
:root[data-u-theme="dark"]{
  --u-bg:#0b0f17;--u-panel:#141a24;--u-sunken:#10151e;--u-line:#263040;--u-line-soft:#1d2532;
  --u-text:#e6eaf2;--u-text-2:#a9b3c4;--u-text-3:#738097;
  --u-primary-soft:#14213d;--u-primary-line:#284a8f;
  --u-ok-soft:#0f2a1c;--u-ok-line:#1d5a38;--u-warn-soft:#2d1f08;--u-warn-line:#6b4710;
  --u-danger-soft:#2f1314;--u-danger-line:#6b2526;--u-info-soft:#1a212c;--u-info-line:#2b3443;
  --u-side-bg:#0f141d;--u-side-sub:#0b0f17;--u-shadow:none;--u-line-strong:#3a4558;--u-btn-shadow:none;
}

.u-root{font:var(--u-fs)/1.55 var(--u-font);color:var(--u-text);background:var(--u-bg);-webkit-font-smoothing:antialiased;min-height:100vh}
.u-root *,.u-root *::before,.u-root *::after{box-sizing:border-box}
.u-root button,.u-root input,.u-root select,.u-root textarea{font:inherit;color:inherit}
.u-root a{color:var(--u-link);text-decoration:none}
.u-ico{width:16px;height:16px;flex:none}
.u-num{font-variant-numeric:tabular-nums}
.u-muted{color:var(--u-text-3)}
.u-hide{display:none!important}

/* ---------- 外壳 ---------- */
.u-shell{display:grid;grid-template-columns:var(--u-side-w) minmax(0,1fr);min-height:100vh}
.u-shell.is-collapsed{--u-side-w:64px}
.u-side{background:var(--u-side-bg);color:var(--u-side-text);position:sticky;top:0;height:100vh;overflow:auto;display:flex;flex-direction:column;border-right:1px solid transparent}
:root[data-u-side="light"] .u-side{border-right-color:var(--u-line)}
.u-brand{height:var(--u-top-h);display:flex;align-items:center;gap:10px;padding:0 18px;color:var(--u-side-text-on);font-weight:600;font-size:var(--u-fs-md);white-space:nowrap;overflow:hidden}
:root[data-u-side="light"] .u-brand{color:var(--u-text)}
.u-brand i{font-style:normal;flex:none;width:28px;height:28px;border-radius:var(--u-r);background:var(--u-brand-grad);color:var(--u-on-brand);display:grid;place-items:center;font-size:var(--u-fs-sm);font-weight:700;box-shadow:var(--u-brand-glow)}
.u-menu{padding:4px 0 24px}
.u-menu-group{padding:16px 20px 6px;font-size:var(--u-fs-xs);color:var(--u-side-group);letter-spacing:.04em}
.u-menu-item{display:flex;align-items:center;gap:10px;height:var(--u-menu-h);padding:0 20px;color:var(--u-side-text);cursor:pointer;white-space:nowrap;border:0;background:none;width:100%;text-align:left}
.u-menu-item:hover{background:var(--u-side-hover);color:var(--u-side-text-on)}
.u-menu-item .u-ico{flex:none;width:18px;height:18px}
.u-menu-item .u-caret{margin-left:auto;font-size:10px;opacity:.6;transition:transform .15s}
.u-menu-item[aria-expanded="true"] .u-caret{transform:rotate(90deg)}
.u-menu-item .u-badge{margin-left:auto}
.u-menu-sub{background:var(--u-side-sub)}
.u-menu-sub .u-menu-item{padding-left:48px;height:40px}
.u-menu-item.is-active{color:var(--u-side-active-text);background:var(--u-side-active-bg);box-shadow:inset 3px 0 0 var(--u-side-active-bar)}
:root[data-u-side="light"] .u-menu-item.is-active{background:var(--u-primary-soft);box-shadow:inset 3px 0 0 var(--u-primary)}
.u-shell.is-collapsed .u-menu-item span,.u-shell.is-collapsed .u-menu-group,.u-shell.is-collapsed .u-menu-sub,.u-shell.is-collapsed .u-brand b,.u-shell.is-collapsed .u-caret{display:none}
.u-body{min-width:0;display:flex;flex-direction:column}
.u-top{height:var(--u-top-h);background:var(--u-panel);border-bottom:1px solid var(--u-line);display:flex;align-items:center;gap:var(--u-s3);padding:0 var(--u-s4);position:sticky;top:0;z-index:5}
.u-icon-btn{width:36px;height:36px;border-radius:var(--u-r);display:grid;place-items:center;border:0;background:none;color:var(--u-text-2);cursor:pointer}
.u-icon-btn:hover{background:var(--u-info-soft);color:var(--u-text)}
.u-crumb{display:flex;align-items:center;gap:6px;color:var(--u-text-3);font-size:var(--u-fs-sm);min-width:0;white-space:nowrap;overflow:hidden}
.u-crumb b{color:var(--u-text);font-weight:500}
.u-top-right{margin-left:auto;display:flex;align-items:center;gap:var(--u-s2)}
.u-avatar{width:30px;height:30px;border-radius:50%;background:var(--u-primary-soft);color:var(--u-primary);display:grid;place-items:center;font-size:var(--u-fs-sm);font-weight:600;flex:none}
.u-tabs{background:var(--u-panel);border-bottom:1px solid var(--u-line);display:flex;gap:6px;padding:6px var(--u-s4);overflow-x:auto;scrollbar-width:none}
.u-tab{flex:none;height:26px;display:flex;align-items:center;gap:6px;padding:0 10px;border:1px solid var(--u-line);border-radius:var(--u-r-sm);font-size:var(--u-fs-xs);color:var(--u-text-2);background:var(--u-panel);cursor:pointer}
.u-tab:hover{color:var(--u-primary)}
.u-tab.is-active{background:var(--u-primary);border-color:var(--u-primary);color:var(--u-on-primary)}
.u-tab.is-active::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.u-tab .u-x{opacity:.6;border:0;background:none;padding:0;cursor:pointer;color:inherit}
.u-tab .u-x:hover{opacity:1}
.u-main{padding:var(--u-main-pad);display:flex;flex-direction:column;gap:var(--u-gap);min-width:0}

/* ---------- 页头、面板、页内分区 ---------- */
.u-page-head{display:flex;align-items:flex-end;gap:var(--u-s4);flex-wrap:wrap;padding:var(--u-s1) 0 var(--u-s1)}
.u-page-head h1{font-size:var(--u-fs-lg);font-weight:600;margin:0;line-height:1.3}
.u-page-head p{margin:4px 0 0;color:var(--u-text-3);font-size:var(--u-fs-sm)}
.u-page-head .u-actions{margin-left:auto;display:flex;gap:var(--u-s2)}
.u-panel{background:var(--u-panel);border:1px solid var(--u-line-soft);border-radius:var(--u-sheet-r);padding:var(--u-pad);box-shadow:var(--u-shadow);min-width:0}
.u-panel-head{display:flex;align-items:center;gap:var(--u-s2);margin:-2px 0 var(--u-s4)}
.u-panel-head h2{font-size:var(--u-fs-md);font-weight:600;margin:0}
.u-panel-head .u-actions{margin-left:auto;display:flex;gap:var(--u-s2)}
/* 旧外壳里迁好的页面：块与块之间统一间距 */
.u-page{display:flex;flex-direction:column;gap:var(--u-gap)}
.u-grid{display:grid;gap:var(--u-s3)}
.u-grid.c2{grid-template-columns:repeat(2,minmax(0,1fr))}.u-grid.c3{grid-template-columns:repeat(3,minmax(0,1fr))}.u-grid.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
.u-grid.side{grid-template-columns:minmax(0,1fr) 340px}
/* 页内分区：全站只有这一种，放不下就横向滚，不折行 */
.u-seg{display:flex;gap:var(--u-s5);border-bottom:1px solid var(--u-line);overflow-x:auto;scrollbar-width:none;margin-bottom:var(--u-s4)}
.u-seg button,.u-seg a{flex:none;border:0;background:none;padding:10px 0;color:var(--u-text-2);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.u-seg button:hover,.u-seg a:hover{color:var(--u-text)}
.u-seg button.is-active,.u-seg a.is-active{color:var(--u-primary);border-bottom-color:var(--u-primary);font-weight:500}
.u-seg .u-count{margin-left:6px;font-size:var(--u-fs-xs);color:var(--u-text-3)}

/* ---------- 按钮 ---------- */
.u-btn{height:var(--u-h);padding:0 var(--u-btn-px);border-radius:var(--u-r);border:1px solid var(--u-line);background:var(--u-panel);color:var(--u-text);display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--u-fs-sm);font-weight:500;cursor:pointer;white-space:nowrap;box-shadow:var(--u-btn-shadow);transition:background .12s,border-color .12s,color .12s,box-shadow .12s,transform .06s}
.u-btn:hover{background:var(--u-sunken);border-color:var(--u-line-strong)}
.u-btn:active{transform:translateY(1px)}
.u-btn:focus-visible,.u-input:focus-visible,.u-icon-btn:focus-visible,.u-choice:focus-visible{outline:none;box-shadow:0 0 0 3px var(--u-primary-ring)}
.u-btn .u-ico{width:16px;height:16px;color:var(--u-text-2)}
/* 主操作：实心主色，带一层很淡的上亮下暗，按下去有手感 */
.u-btn.is-primary{background:var(--u-primary);border-color:var(--u-primary);color:var(--u-on-primary);box-shadow:var(--u-btn-shadow),inset 0 1px 0 rgba(255,255,255,.18)}
.u-btn.is-primary .u-ico,.u-btn.is-danger .u-ico,.u-btn.is-brand .u-ico{color:inherit}
.u-btn.is-primary:hover{background:var(--u-primary-hover);border-color:var(--u-primary-hover)}
/* 每页唯一的主操作（「开始做页」「把广告换成新版」）：品牌渐变 + 一道扫过的光，表示「一点就出」 */
.u-btn.is-brand{position:relative;overflow:hidden;border:0;background:var(--u-brand-grad);color:var(--u-on-brand);font-weight:600;box-shadow:var(--u-btn-shadow),inset 0 1px 0 rgba(255,255,255,.2)}
.u-btn.is-brand::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);animation:u-sweep 2.8s ease-in-out infinite}
.u-btn.is-brand:hover{color:var(--u-on-brand);background:var(--u-brand-grad);filter:brightness(1.08)}
@keyframes u-sweep{0%,60%{left:-60%}100%{left:130%}}
.u-btn.is-danger{background:var(--u-danger);border-color:var(--u-danger);color:var(--u-white)}
.u-btn.is-danger:hover{filter:brightness(.94);background:var(--u-danger)}
/* 次要的危险操作（批量删除）：白底红字，不用一整块红 */
.u-btn.is-danger-text{color:var(--u-danger)}.u-btn.is-danger-text .u-ico{color:var(--u-danger)}
.u-btn.is-danger-text:hover{background:var(--u-danger-soft);border-color:var(--u-danger-line)}
.u-btn.is-ghost{border-color:transparent;background:none;box-shadow:none}
.u-btn.is-ghost:hover{background:var(--u-info-soft)}
.u-btn.is-link{border:0;background:none;box-shadow:none;padding:0 2px;height:auto;color:var(--u-link);font-weight:500}
.u-btn.is-link.is-danger{color:var(--u-text-3);background:none}.u-btn.is-link.is-danger:hover{color:var(--u-danger)}
.u-btn.is-link:hover{text-decoration:underline;background:none}
.u-btn.is-sm{height:30px;padding:0 12px;font-size:var(--u-fs-xs)}
.u-btn.is-lg{height:44px;padding:0 22px;font-size:var(--u-fs)}
/* 禁用：灰底灰字，一眼看出「现在点不了」，不做成发虚的彩色 */
.u-btn[disabled]{background:var(--u-sunken);border-color:var(--u-line-soft);color:var(--u-text-3);box-shadow:none;cursor:not-allowed;pointer-events:none;filter:none}
.u-btn[disabled] .u-ico{color:var(--u-text-3)}
.u-btn[disabled]::after{display:none}
/* 图标按钮：方形圆角、浅描边，悬停出提示 */
.u-btn.is-icon{width:var(--u-h);padding:0}

/* ---------- 搜索区、按钮栏 ---------- */
.u-search{display:flex;flex-wrap:wrap;gap:var(--u-s3) var(--u-s6);align-items:center}
.u-field{display:flex;align-items:center;gap:var(--u-s2)}
.u-field>label{color:var(--u-text-2);font-size:var(--u-fs-sm);white-space:nowrap}
.u-input{height:var(--u-h);border:1px solid var(--u-line);border-radius:var(--u-r);padding:0 12px;background:var(--u-panel);width:200px;min-width:0;box-shadow:var(--u-btn-shadow);transition:border-color .12s,box-shadow .12s}
textarea.u-input{height:auto;min-height:80px;padding:10px 12px;resize:vertical}
.u-input:hover{border-color:var(--u-line-strong)}
.u-input:focus{outline:none;border-color:var(--u-primary);box-shadow:0 0 0 3px var(--u-primary-ring)}
.u-input::placeholder{color:var(--u-text-3)}
.u-input.is-error{border-color:var(--u-danger);box-shadow:0 0 0 3px var(--u-danger-soft)}
/* 下拉框：去掉系统箭头，换成统一的细箭头（外面包一层 .u-select） */
.u-select{position:relative;display:inline-flex;min-width:0}
.u-select select{appearance:none;-webkit-appearance:none;padding-right:34px;cursor:pointer;width:100%}
.u-select::after{content:"";position:absolute;right:14px;top:50%;width:7px;height:7px;border-right:1.6px solid var(--u-text-3);border-bottom:1.6px solid var(--u-text-3);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.u-field .u-select{width:200px}
.u-form-row .u-select,.u-setting .u-select{width:100%}
.u-toolbar{display:flex;align-items:center;gap:var(--u-s2);flex-wrap:wrap;margin-bottom:var(--u-s4);min-height:var(--u-h)}
.u-toolbar .u-right{margin-left:auto;display:flex;gap:8px}
/* 勾选了行才出现的批量操作条：说清选了几个、能对它们做什么 */
.u-bulk{display:flex;align-items:center;gap:var(--u-s2);flex-wrap:wrap;padding:6px 8px 6px 16px;border-radius:var(--u-r);background:var(--u-primary-soft);border:1px solid var(--u-primary-line);color:var(--u-text);font-size:var(--u-fs-sm);margin-bottom:var(--u-s4)}
.u-bulk b{color:var(--u-primary)}
.u-bulk .u-right{margin-left:auto;display:flex;gap:8px}

/* ---------- 表格 ---------- */
.u-table-wrap{overflow-x:auto;border:1px solid var(--u-line-soft);border-radius:var(--u-r)}
.u-table{width:100%;border-collapse:collapse;font-size:var(--u-fs-sm)}
.u-table th{background:var(--u-sunken);color:var(--u-text-2);font-weight:500;text-align:left;padding:10px 12px;border-bottom:1px solid var(--u-line);white-space:nowrap;position:sticky;top:0}
.u-table td{padding:11px 12px;border-bottom:1px solid var(--u-line-soft);vertical-align:middle}
.u-table tr:last-child td{border-bottom:0}
.u-table tbody tr:hover td{background:var(--u-sunken)}
.u-table tr.is-selected td{background:var(--u-primary-soft)}
.u-table .is-num{text-align:right;font-variant-numeric:tabular-nums}
.u-table .is-check{width:40px}
.u-table .u-cell{min-width:0}
.u-table .u-ops{white-space:nowrap;display:flex;gap:var(--u-s3)}
.u-table .u-sub{display:block;color:var(--u-text-3);font-size:var(--u-fs-xs)}
.u-thumb{width:36px;height:36px;border-radius:var(--u-r);background:var(--u-info-soft);object-fit:cover;flex:none}
.u-cell-main{display:flex;align-items:center;gap:10px;min-width:0}
.u-pager{display:flex;align-items:center;gap:var(--u-s3);margin-top:var(--u-s5);color:var(--u-text-2);font-size:var(--u-fs-sm);flex-wrap:wrap}
.u-pager-size{display:flex;align-items:center;gap:8px}
.u-pager-size .u-select{width:auto}
.u-pager-size select{height:32px;width:96px;font-size:var(--u-fs-sm);padding-left:10px}
.u-pager-pages{margin-left:auto;display:flex;align-items:center;gap:6px}
.u-pager-pages button{min-width:34px;height:34px;padding:0 8px;border:1px solid var(--u-line);border-radius:var(--u-r);background:var(--u-panel);cursor:pointer;color:var(--u-text-2);font-variant-numeric:tabular-nums;display:grid;place-items:center;box-shadow:var(--u-btn-shadow)}
.u-pager-pages button:hover{border-color:var(--u-line-strong);color:var(--u-text)}
.u-pager-pages button.is-active{background:var(--u-primary-soft);border-color:var(--u-primary);color:var(--u-primary);font-weight:600}
.u-pager-pages button[disabled]{background:var(--u-sunken);color:var(--u-line-strong);box-shadow:none;cursor:not-allowed}
.u-pager-pages .u-ico{width:16px;height:16px}
.u-autopager .u-pager{margin-top:var(--u-s3)}
.u-pager-gap{color:var(--u-text-3);padding:0 2px}

/* ---------- 状态标签、徽标 ---------- */
.u-tag{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 8px;border-radius:var(--u-r-sm);font-size:var(--u-fs-xs);border:1px solid var(--u-info-line);background:var(--u-info-soft);color:var(--u-info);white-space:nowrap}
.u-tag.is-ok{color:var(--u-ok);background:var(--u-ok-soft);border-color:var(--u-ok-line)}
.u-tag.is-warn{color:var(--u-warn);background:var(--u-warn-soft);border-color:var(--u-warn-line)}
.u-tag.is-danger{color:var(--u-danger);background:var(--u-danger-soft);border-color:var(--u-danger-line)}
.u-tag.is-primary{color:var(--u-primary);background:var(--u-primary-soft);border-color:var(--u-primary-line)}
.u-tag.is-dot::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.u-tag.is-live::before{animation:u-pulse 1.4s infinite}
@keyframes u-pulse{50%{opacity:.25}}
.u-badge{min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--u-danger);color:var(--u-on-primary);font-size:11px;display:inline-grid;place-items:center;font-variant-numeric:tabular-nums}

/* ---------- 弹窗、抽屉、确认、提示 ---------- */
.u-mask{position:fixed;inset:0;background:rgba(15,20,30,.45);display:flex;align-items:flex-start;justify-content:center;padding:12vh 16px 16px;z-index:50;animation:u-fade .15s}
.u-dialog{background:var(--u-panel);color:var(--u-text);border-radius:var(--u-r-lg);width:min(520px,100%);box-shadow:var(--u-shadow-pop);max-height:76vh;display:flex;flex-direction:column}
.u-dialog.is-sm{width:min(420px,100%)}.u-dialog.is-lg{width:min(760px,100%)}
.u-dialog-head{display:flex;align-items:center;padding:16px 20px 8px;font-size:var(--u-fs-md);font-weight:600}
.u-dialog-head .u-icon-btn{margin-left:auto}
.u-dialog-body{padding:8px 20px;overflow:auto}
.u-dialog-foot{display:flex;justify-content:flex-end;gap:var(--u-s2);padding:12px 20px 18px}
.u-confirm{display:flex;gap:12px;align-items:flex-start;line-height:1.6}
.u-confirm-ico{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;color:var(--u-white);font-weight:700;font-size:13px;background:var(--u-warn)}
.u-confirm-ico.is-danger{background:var(--u-danger)}
.u-drawer-mask{position:fixed;inset:0;background:rgba(15,20,30,.35);z-index:50;animation:u-fade .15s}
.u-drawer{position:fixed;top:0;right:0;bottom:0;width:min(520px,100%);background:var(--u-panel);color:var(--u-text);box-shadow:var(--u-shadow-pop);z-index:51;display:flex;flex-direction:column;animation:u-slide .18s}
.u-drawer .u-dialog-body{flex:1}
@keyframes u-fade{from{opacity:0}}
@keyframes u-slide{from{transform:translateX(40px);opacity:0}}
.u-toasts{position:fixed;top:16px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;z-index:60;pointer-events:none}
.u-toast{padding:9px 16px;border-radius:var(--u-r);border:1px solid var(--u-info-line);background:var(--u-panel);color:var(--u-text);box-shadow:var(--u-shadow-pop);font-size:var(--u-fs-sm);display:flex;gap:8px;align-items:center;animation:u-fade .15s}
.u-toast.is-ok{border-color:var(--u-ok-line);background:var(--u-ok-soft);color:var(--u-ok)}
.u-toast.is-danger{border-color:var(--u-danger-line);background:var(--u-danger-soft);color:var(--u-danger)}
.u-toast.is-warn{border-color:var(--u-warn-line);background:var(--u-warn-soft);color:var(--u-warn)}

/* ---------- 表单 ---------- */
.u-form{display:grid;gap:var(--u-s4)}
.u-form-row{display:grid;grid-template-columns:96px minmax(0,1fr);gap:var(--u-s3);align-items:start}
.u-form-row>label{text-align:right;color:var(--u-text-2);font-size:var(--u-fs-sm);padding-top:6px}
.u-form-row>label em{color:var(--u-danger);font-style:normal;margin-right:3px}
.u-form-row .u-input{width:100%}
.u-form-row .u-help{color:var(--u-text-3);font-size:var(--u-fs-xs);margin-top:4px}
.u-form-row .u-err{color:var(--u-danger);font-size:var(--u-fs-xs);margin-top:4px}
.u-radios{display:flex;gap:var(--u-s4);flex-wrap:wrap;padding-top:6px}
.u-radios label{display:flex;gap:6px;align-items:center;cursor:pointer}
.u-switch{width:36px;height:20px;border-radius:10px;background:var(--u-line);position:relative;border:0;cursor:pointer;flex:none}
.u-switch::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--u-white);transition:left .15s;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.u-switch[aria-checked="true"]{background:var(--u-primary)}
.u-switch[aria-checked="true"]::after{left:18px}

/* ---------- 详情：描述列表 ---------- */
.u-desc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid var(--u-line);border-radius:var(--u-r);overflow:hidden}
.u-desc>div{display:grid;grid-template-columns:110px minmax(0,1fr);border-bottom:1px solid var(--u-line-soft)}
.u-desc dt{background:var(--u-sunken);color:var(--u-text-2);padding:10px 12px;font-size:var(--u-fs-sm)}
.u-desc dd{margin:0;padding:10px 12px;font-size:var(--u-fs-sm);min-width:0;overflow-wrap:anywhere}

/* ---------- 空 / 加载 / 出错 / 没权限 ---------- */
.u-state{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:48px 16px;color:var(--u-text-3)}
.u-state-ico{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--u-info-soft);color:var(--u-info)}
.u-state-ico .u-ico{width:22px;height:22px}
.u-state.is-error .u-state-ico{background:var(--u-danger-soft);color:var(--u-danger)}
.u-state.is-denied .u-state-ico{background:var(--u-warn-soft);color:var(--u-warn)}
.u-state b{color:var(--u-text);font-size:var(--u-fs);font-weight:600}
.u-state p{margin:0;font-size:var(--u-fs-sm);max-width:380px}
.u-panel .u-state{padding:28px 16px}
.u-skel{display:block;height:12px;border-radius:4px;background:linear-gradient(90deg,var(--u-line-soft),var(--u-sunken),var(--u-line-soft));background-size:200% 100%;animation:u-shine 1.2s infinite}
@keyframes u-shine{to{background-position:-200% 0}}

/* ---------- 指标卡（数据看板） ---------- */
.u-stat{display:flex;flex-direction:column;gap:6px;min-width:0}
.u-stat-label{color:var(--u-text-2);font-size:var(--u-fs-sm);display:flex;gap:6px;align-items:center}
.u-stat-value{font-size:var(--u-fs-xl);font-weight:600;line-height:1.15;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.u-stat-value small{font-size:var(--u-fs);font-weight:500;color:var(--u-text-3);margin-left:2px}
.u-delta{font-size:var(--u-fs-xs);font-weight:500;font-variant-numeric:tabular-nums}
.u-delta.is-up{color:var(--u-ok)}.u-delta.is-down{color:var(--u-danger)}.u-delta.is-flat{color:var(--u-text-3)}
.u-spark{width:100%;height:36px;display:block}
.u-spark path{fill:none;stroke:var(--u-primary);stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}
.u-spark .u-area{fill:var(--u-primary-soft);stroke:none}
.u-bars{display:flex;flex-direction:column;gap:10px}
.u-bar-row{display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:10px;align-items:center;font-size:var(--u-fs-sm)}
.u-bar{height:8px;border-radius:4px;background:var(--u-info-soft);overflow:hidden}
.u-bar i{display:block;height:100%;border-radius:4px;background:var(--u-brand-grad)}
.u-bar.is-ok i{background:var(--u-ok)}

/* ---------- AI 任务进度 ---------- */
.u-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.u-step{display:grid;grid-template-columns:24px minmax(0,1fr);gap:12px;position:relative;padding-bottom:var(--u-s5)}
.u-step:last-child{padding-bottom:0}
.u-step::before{content:"";position:absolute;left:11px;top:26px;bottom:2px;width:2px;background:var(--u-line)}
.u-step:last-child::before{display:none}
.u-step.is-done::before{background:var(--u-ok)}
.u-step-dot{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--u-line);background:var(--u-panel);color:var(--u-text-3);font-size:11px;font-weight:700;z-index:1}
.u-step.is-done .u-step-dot{border-color:var(--u-ok);background:var(--u-ok);color:var(--u-white)}
.u-step.is-doing .u-step-dot{border-color:var(--u-primary);color:var(--u-primary)}
.u-step.is-doing .u-step-dot::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--u-primary);animation:u-pulse 1.2s infinite}
.u-step.is-wait .u-step-dot{border-color:var(--u-warn);background:var(--u-warn);color:var(--u-white)}
.u-step.is-fail .u-step-dot{border-color:var(--u-danger);background:var(--u-danger);color:var(--u-white)}
.u-step-title{font-weight:500;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.u-step-meta{color:var(--u-text-3);font-size:var(--u-fs-xs)}
.u-step-body{color:var(--u-text-2);font-size:var(--u-fs-sm);margin-top:4px}
.u-step.is-todo .u-step-title{color:var(--u-text-3);font-weight:400}
.u-progress{height:6px;border-radius:3px;background:var(--u-info-soft);overflow:hidden}
.u-progress i{display:block;height:100%;background:var(--u-brand-grad);border-radius:3px;transition:width .3s;position:relative;overflow:hidden}
.u-progress i::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);animation:u-flow 1.6s linear infinite}
@keyframes u-flow{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
.u-log{font:12px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--u-sunken);border:1px solid var(--u-line-soft);border-radius:var(--u-r);padding:10px 12px;color:var(--u-text-2);max-height:180px;overflow:auto}
.u-log div::before{content:attr(data-t);color:var(--u-text-3);margin-right:10px}

/* ---------- 新旧对比 ---------- */
.u-compare{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--u-s4)}
.u-compare-col{border:1px solid var(--u-line);border-radius:var(--u-r-lg);overflow:hidden;background:var(--u-panel);display:flex;flex-direction:column}
.u-compare-col.is-new{border-color:var(--u-primary-line);box-shadow:0 0 0 3px var(--u-primary-soft)}
.u-compare-head{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--u-line-soft);font-weight:500}
.u-compare-head .u-tag{margin-left:auto}
.u-shot{height:240px;background:var(--u-sunken);display:flex;flex-direction:column;gap:8px;padding:14px;overflow:hidden}
.u-compare-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--u-line-soft)}
.u-compare-metrics>div{padding:10px 14px;border-right:1px solid var(--u-line-soft)}
.u-compare-metrics>div:last-child{border-right:0}
.u-compare-metrics small{display:block;color:var(--u-text-3);font-size:var(--u-fs-xs)}
.u-compare-metrics b{font-size:var(--u-fs-md);font-variant-numeric:tabular-nums}
.u-verdict{display:flex;gap:12px;align-items:center;padding:12px 16px;border-radius:var(--u-r-lg);background:var(--u-ok-soft);border:1px solid var(--u-ok-line);color:var(--u-text)}
.u-verdict b{color:var(--u-ok)}
.u-verdict .u-actions{margin-left:auto;display:flex;gap:var(--u-s2)}

/* ---------- 待办 / 确认列表 ---------- */
.u-list{display:flex;flex-direction:column}
.u-list-item{display:flex;align-items:center;gap:var(--u-s3);padding:12px 0;border-bottom:1px solid var(--u-line-soft)}
.u-list-item:last-child{border-bottom:0}
.u-list-item .u-main-col{min-width:0;flex:1}
.u-list-item .u-title{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.u-list-item .u-meta{color:var(--u-text-3);font-size:var(--u-fs-xs);display:flex;gap:8px;flex-wrap:wrap;margin-top:2px}

/* ---------- 手机 ---------- */
/* ---------- 舒展风格（T-0362，样板默认）：灰底上的大白卡、浅色侧栏柔和选中、大字号大留白大圆角 ----------
   质感来自「少线条、多留白、选中态柔和、每块东西都是圆角卡片」，不靠颜色多。紧凑风格（RuoYi 式）留给团队的大表格页。 */
:root[data-u-style="airy"]{--u-fs:15px;--u-fs-sm:14px;--u-fs-md:17px;--u-fs-lg:26px;--u-fs-xl:30px;
  --u-h:38px;--u-btn-px:18px;--u-pad:28px;--u-menu-h:44px;--u-main-pad:28px;--u-gap:20px;--u-r:10px;--u-r-lg:14px;--u-sheet-r:20px;--u-side-w:248px;--u-top-h:60px;
  --u-bg:#f4f5f7;--u-line-soft:#eceef2;--u-shadow:0 1px 2px rgba(16,24,40,.03)}
:root[data-u-style="airy"][data-u-theme="dark"]{--u-bg:#0b0f17;--u-line-soft:#1d2532}
:root[data-u-style="airy"] .u-menu-item{margin:2px 12px;width:calc(100% - 24px);border-radius:10px;padding:0 14px}
:root[data-u-style="airy"] .u-menu-sub{background:none}
:root[data-u-style="airy"] .u-menu-sub .u-menu-item{padding-left:42px}
:root[data-u-style="airy"][data-u-side="light"] .u-menu-item.is-active{box-shadow:none;font-weight:500}
:root[data-u-style="airy"] .u-menu-group{padding:18px 26px 6px;font-size:var(--u-fs-xs)}
:root[data-u-style="airy"] .u-brand{height:var(--u-top-h);padding:0 22px;font-size:19px;font-weight:700}
:root[data-u-style="airy"] .u-top{border-bottom-color:transparent;background:var(--u-panel)}
:root[data-u-style="airy"] .u-page-head h1{font-size:var(--u-fs-lg);font-weight:700}
:root[data-u-style="airy"] .u-panel-head h2{font-weight:600}
:root[data-u-style="airy"] .u-btn{font-size:var(--u-fs-sm);font-weight:500}
:root[data-u-style="airy"] .u-table td{padding:14px 14px}
:root[data-u-style="airy"] .u-table th{padding:12px 14px}

/* ---------- 提示条 ---------- */
.u-banner{display:flex;gap:10px;align-items:flex-start;padding:16px 20px;border-radius:var(--u-r-lg);background:var(--u-primary-soft);color:var(--u-text);line-height:1.7;font-size:var(--u-fs-sm)}
.u-banner .u-ico{flex:none;width:18px;height:18px;margin-top:3px;color:var(--u-primary)}
.u-banner.is-warn{background:var(--u-warn-soft)}.u-banner.is-warn .u-ico{color:var(--u-warn)}
/* ---------- 设置行：左边说明，右边控件 ---------- */
.u-setting{display:grid;grid-template-columns:150px minmax(0,1fr);gap:var(--u-s4);align-items:start;padding:14px 0}
.u-setting>label{color:var(--u-text-2);padding-top:9px}
.u-setting.is-wide{grid-template-columns:minmax(200px,1fr) minmax(0,1.4fr);border-bottom:1px solid var(--u-line-soft);padding:18px 0}
.u-setting.is-wide>label{color:var(--u-text);font-weight:500;padding-top:0}
.u-setting.is-wide>label small{font-weight:400;font-size:var(--u-fs-sm);margin-top:4px}
.u-setting>label small{display:block;color:var(--u-text-3);font-size:var(--u-fs-xs);margin-top:2px;line-height:1.5}
/* ---------- 选项卡片：大块按钮，选中是主色描边加主色字 ---------- */
.u-choices{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;max-width:640px}
.u-choice{min-height:var(--u-h);padding:12px 16px;border:1px solid var(--u-line);border-radius:var(--u-r);background:var(--u-panel);color:var(--u-text);cursor:pointer;text-align:center;font-weight:500;transition:border-color .12s,color .12s,box-shadow .12s}
.u-choice small{display:block;font-weight:400;color:var(--u-text-3);font-size:var(--u-fs-xs);margin-top:2px}
.u-choice:hover{border-color:var(--u-primary-line)}
.u-choice[aria-pressed="true"]{border-color:var(--u-primary);color:var(--u-primary);box-shadow:0 0 0 1px var(--u-primary)}
/* ---------- 可折叠分区 ---------- */
.u-section{background:var(--u-panel);border:1px solid var(--u-line-soft);border-radius:var(--u-r-lg);padding:20px 24px}
.u-section+.u-section{margin-top:16px}
.u-section-head{display:flex;align-items:center;gap:10px;cursor:pointer;user-select:none}
.u-section-head h3{margin:0;font-size:var(--u-fs-md);font-weight:600}
.u-section-head .u-ico{width:20px;height:20px;color:var(--u-text-2)}
.u-section-head .u-chev{margin-left:auto;transition:transform .15s;color:var(--u-text-3);display:grid}
.u-section-head .u-chev .u-ico{transform:rotate(-90deg)}
.u-section.is-closed .u-chev{transform:rotate(180deg)}
.u-section-desc{color:var(--u-text-3);font-size:var(--u-fs-sm);margin:6px 0 0}
.u-section-body{margin-top:12px}
.u-section.is-closed .u-section-body{display:none}
.u-dot{width:8px;height:8px;border-radius:50%;background:var(--u-ok);display:inline-block}
.u-dot.is-off{background:var(--u-text-3)}
/* ---------- 上传区 ---------- */
.u-dropzone{display:block;border:1.5px dashed var(--u-line);border-radius:var(--u-r-lg);background:var(--u-sunken);padding:28px 16px;text-align:center;color:var(--u-text-2);cursor:pointer;transition:border-color .12s,background .12s}
.u-dropzone:hover,.u-dropzone.is-over{border-color:var(--u-primary);background:var(--u-primary-soft)}
.u-dropzone .u-ico{width:26px;height:26px;color:var(--u-text-3);display:block;margin:0 auto 8px}
.u-dropzone small{display:block;color:var(--u-text-3);font-size:var(--u-fs-xs);margin-top:4px}
/* ---------- 设置 + 实时预览分栏 ---------- */
.u-split{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:var(--u-gap);align-items:start}
.u-sheet{background:var(--u-panel);border-radius:var(--u-sheet-r);padding:var(--u-pad) calc(var(--u-pad) + 4px);box-shadow:var(--u-shadow);border:1px solid var(--u-line-soft);min-width:0}
.u-sheet>h1{font-size:var(--u-fs-lg);font-weight:700;margin:0 0 20px}
.u-sheet>.u-banner{margin-bottom:24px}
.u-preview{position:sticky;top:calc(var(--u-top-h) + 16px);background:var(--u-panel);border-radius:var(--u-sheet-r);border:1px solid var(--u-line-soft);box-shadow:var(--u-shadow);overflow:hidden;display:flex;flex-direction:column;max-height:calc(100vh - var(--u-top-h) - 32px)}
.u-preview-head{display:flex;align-items:center;gap:8px;padding:16px 20px;background:var(--u-sunken);font-weight:600}
.u-preview-head .u-tag{margin-left:auto}
.u-preview-body{padding:20px;overflow:auto;flex:1;display:flex;justify-content:center}
/* 预览里的手机框 */
.u-phone{width:280px;border-radius:28px;border:8px solid var(--u-text);background:var(--u-panel);overflow:hidden;box-shadow:var(--u-shadow-pop)}
/* ---------- 侧栏底部小卡片 ---------- */
.u-side-card{margin:auto 12px 16px;padding:16px;border-radius:var(--u-r-lg);background:var(--u-primary-soft);color:var(--u-text)}
.u-side-card b{display:block;margin-bottom:6px}
.u-side-card a{font-weight:500}
:root:not([data-u-side="light"]) .u-side-card{background:var(--u-side-hover);color:var(--u-side-text-on)}
.u-swatches{display:flex;gap:10px;flex-wrap:wrap}
.u-swatch{width:32px;height:32px;border-radius:50%;border:2px solid var(--u-panel);box-shadow:0 0 0 1px var(--u-line);cursor:pointer;padding:0}
.u-swatch[aria-pressed="true"]{box-shadow:0 0 0 2px var(--u-primary)}

/* ---------- 主流程步骤条（绑店 → … → 换广告链接）：做完打勾，当前这步高亮 ---------- */
.u-flow{list-style:none;margin:0;padding:0;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}
.u-flow li{flex:1;min-width:96px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;font-size:var(--u-fs-sm);color:var(--u-text-3);position:relative;padding-top:2px}
.u-flow li::before{content:"";position:absolute;top:15px;left:calc(-50% + 18px);right:calc(50% + 18px);height:2px;background:var(--u-line)}
.u-flow li:first-child::before{display:none}
.u-flow li.is-done::before,.u-flow li.is-now::before{background:var(--u-ok)}
.u-flow li span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--u-line);background:var(--u-panel);font-weight:600;font-size:var(--u-fs-xs);z-index:1}
.u-flow li.is-done{color:var(--u-text-2)}
.u-flow li.is-done span{background:var(--u-ok);border-color:var(--u-ok);color:var(--u-white)}
.u-flow li.is-now{color:var(--u-primary);font-weight:600}
.u-flow li.is-now span{border-color:var(--u-primary);color:var(--u-primary);box-shadow:0 0 0 4px var(--u-primary-soft)}
.u-flow li small{font-size:var(--u-fs-xs);font-weight:400;color:var(--u-text-3)}
.u-flow li.is-wait{color:var(--u-warn)}.u-flow li.is-wait span{border-color:var(--u-warn);color:var(--u-warn);box-shadow:0 0 0 4px var(--u-warn-soft)}
.u-flow li.is-fail{color:var(--u-danger)}.u-flow li.is-fail span{border-color:var(--u-danger);background:var(--u-danger);color:var(--u-white);box-shadow:0 0 0 4px var(--u-danger-soft)}
/* 电脑预览框（和 .u-phone 配对） */
.u-desk{width:100%;border:1px solid var(--u-line);border-radius:var(--u-r-lg);overflow:hidden;background:var(--u-panel);box-shadow:var(--u-shadow-pop)}
.u-desk-bar{display:flex;align-items:center;gap:6px;padding:8px 12px;background:var(--u-sunken);border-bottom:1px solid var(--u-line-soft);font-size:11px;color:var(--u-text-3)}
.u-desk-bar i{width:8px;height:8px;border-radius:50%;background:var(--u-line)}
.u-desk-bar span{margin-left:8px;flex:1;background:var(--u-panel);border-radius:4px;padding:2px 8px}
.u-desk-body{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px}
.u-desk-img{min-height:220px;border-radius:8px;background:linear-gradient(135deg,var(--u-sunken),var(--u-line));display:grid;place-items:center;color:var(--u-text-3);font-size:12px}
/* 带编号的步骤说明（绑定店铺那种「① ② ③」） */
.u-numbered{margin:0 0 16px;padding:0;list-style:none;counter-reset:u-n;display:grid;gap:10px}
.u-numbered li{counter-increment:u-n;display:grid;grid-template-columns:28px minmax(0,1fr);column-gap:10px;color:var(--u-text-3);font-size:var(--u-fs-sm)}
.u-numbered li::before{content:counter(u-n);grid-row:span 2;width:24px;height:24px;border-radius:50%;background:var(--u-primary-soft);color:var(--u-primary);display:grid;place-items:center;font-weight:600;font-size:12px}
.u-numbered li b{color:var(--u-text);font-weight:500}
/* 一行表单：输入框 + 按钮 */
.u-inline-form{display:flex;gap:8px;max-width:560px}
.u-inline-form .u-input{flex:1;width:auto}
/* 中等宽度：预览收窄，再窄就放到设置下面，不挤设置 */
@media (max-width:1280px){.u-split{grid-template-columns:minmax(0,1fr) 330px}.u-phone{width:250px}}
@media (max-width:1120px){.u-split{grid-template-columns:minmax(0,1fr)}.u-preview{position:static;max-height:none}.u-setting{grid-template-columns:120px minmax(0,1fr)}.u-setting.is-wide{grid-template-columns:minmax(0,1fr)}}
@media (max-width:860px){
  .u-shell{grid-template-columns:1fr}
  .u-side{position:fixed;left:0;top:0;bottom:0;width:240px;z-index:40;transform:translateX(-100%);transition:transform .2s}
  .u-shell.is-menu-open .u-side{transform:none;box-shadow:var(--u-shadow-pop)}
  .u-shell.is-collapsed{--u-side-w:216px}
  .u-tabs{display:none}
  .u-main{padding:var(--u-s3)}
  .u-panel{padding:var(--u-s4)}
  .u-grid.c2,.u-grid.c3,.u-grid.side,.u-compare{grid-template-columns:1fr}
  .u-grid.c4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .u-search{gap:var(--u-s2)}
  .u-field{width:100%}
  .u-field>label{width:64px;flex:none}
  .u-field .u-input{flex:1;width:auto}
  .u-crumb span{display:none}
  .u-desc{grid-template-columns:1fr}
  .u-form-row{grid-template-columns:1fr;gap:4px}
  .u-form-row>label{text-align:left;padding:0}
  .u-stat-value{font-size:var(--u-fs-lg)}
  .u-bar-row{grid-template-columns:84px minmax(0,1fr) auto}
  /* 表格在手机上变成一行一张卡，每格前面带列名 */
  .u-table-wrap{border:0;overflow:visible}
  .u-table.is-cards thead{display:none}
  .u-table.is-cards,.u-table.is-cards tbody,.u-table.is-cards tr,.u-table.is-cards td{display:block}
  .u-table.is-cards tr{border:1px solid var(--u-line);border-radius:var(--u-r-lg);padding:6px 12px;margin-bottom:10px;background:var(--u-panel)}
  .u-table.is-cards td{border:0;padding:6px 0;display:flex;justify-content:space-between;gap:12px;text-align:right}
  .u-table.is-cards td .u-cell{text-align:right}
  .u-table.is-cards td.is-title .u-cell{text-align:left}
  .u-table.is-cards td::before{content:attr(data-label);color:var(--u-text-3);text-align:left;flex:none}
  .u-table.is-cards td.is-check{display:none}
  .u-table.is-cards td.is-title{display:block;text-align:left;font-weight:500;border-bottom:1px solid var(--u-line-soft);padding-bottom:8px;margin-bottom:2px}
  .u-table.is-cards td.is-title::before{display:none}
  .u-table.is-cards tbody tr:hover td{background:none}
  .u-pager{justify-content:center}
  .u-page-head .u-actions{margin-left:0;flex-wrap:wrap}
  .u-split{grid-template-columns:1fr}
  .u-preview{position:static;max-height:none}
  .u-setting,.u-setting.is-wide{grid-template-columns:minmax(0,1fr);gap:6px;padding:10px 0}
  .u-choices{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none}
  .u-section{padding:16px}
  .u-setting>label{padding-top:0}
  .u-sheet{padding:20px 16px;border-radius:var(--u-r-lg)}
  :root[data-u-style="airy"]{--u-main-pad:12px;--u-gap:12px;--u-pad:18px}
  .u-verdict{flex-wrap:wrap}.u-verdict .u-actions{margin-left:0;width:100%}
  .u-dialog{max-height:88vh}
  .u-mask{padding-top:6vh}
}
@media (prefers-reduced-motion:reduce){.u-root *{animation:none!important;transition:none!important}}
.u-flip{transform:scaleX(-1)}