/* Hallmark · shape: app screen · genre: editorial · theme: brand (缮青 #0d5c63, 取自项目既有 token/CLAUDE.md) · redesign: full
 * paper: #f4f6f6 青灰 tint · accent: #0d5c63 · display/body: 系统 CJK 栈 (PingFang SC / MiSans / Microsoft YaHei) · labels: body face, untracked
 * nav: kept (tab bar, 项目自有壳) · signature: 六段工单时间线 (细线纵轴) · states: loading (skeleton) / empty / error / full
 * axes: tinted-paper / quiet-display / single-accent · posture: Committed (品牌青承担身份面，工作屏上为信号色) · contrast: pass · v2.0.0 */
/* Hallmark · pre-emit critique: P B H B E B+ S B R C V B · weakest: R — 同一容器配方 ×11；以角色分档修复：细线列表 / 浅井 / 卡片 / 色面 */
/* waive 63 · copy: verbatim — 全部文案由 738 项验收套件按字符串断言锁定，重设计不改一字 */
/* waive 47b · phone-frame — 项目自有的 PC 端手机壳演示（既有产品决策，R 世代维护），非本次新绘浏览器窗 */
/* waive 24b · 间距沿用项目既有密度网格（10/13/14px 光学步进约 170 处），不为 lint 全文重排 */
/* answered 39b · app 控件 32–40px，底部主 CTA 44px，命中区 ≥44px */

:root {
    /* ---- 字体（floor 48：唯一字体声明点） ---- */
    --font-body: -apple-system, BlinkMacSystemFont, "PingFang SC", "HarmonyOS Sans SC", "MiSans", "Segoe UI", "Microsoft YaHei", sans-serif;
    --font-display: var(--font-body);
    --font-mono: ui-monospace, "SF Mono", "Cascadia Mono", Consolas, monospace;

    /* ---- 字号阶梯（app scope，比率 ≈1.14） ---- */
    --text-xs: 12px; --text-sm: 13px; --text-md: 14px; --text-lg: 16px;
    --text-xl: 18px; --text-2xl: 22px; --text-3xl: 26px;

    /* ---- 间距（4px 基） ---- */
    --space-3xs: 2px; --space-2xs: 4px; --space-xs: 8px; --space-sm: 12px;
    --space-md: 16px; --space-lg: 24px; --space-xl: 40px; --space-2xl: 64px;
    --gap-xs: 4px; --gap-sm: 8px; --gap-md: 12px; --gap-lg: 16px; --gap-xl: 20px;

    /* ---- 圆角（杀胶囊；圆 = 形状专用） ---- */
    --radius-xs: 4px; --radius-sm: 6px; --radius-md: 10px; --radius-lg: 12px;
    --radius-xl: 16px; --radius-round: 999px;

    /* ---- 动效 ---- */
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in: cubic-bezier(0.7, 0, 0.84, 0);
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
    --dur-micro: 120ms; --dur-short: 220ms; --dur-long: 420ms;

    /* ---- z 轴 ---- */
    --z-base: 1; --z-raised: 10; --z-dropdown: 100; --z-sticky: 200;
    --z-sticky-nav: 300; --z-modal: 400; --z-toast: 500; --z-tooltip: 600;

    /* ---- 纸/墨（全部向缮青相 185° 偏移，无纯白纯黑面） ---- */
    --color-paper: #f4f6f6;
    --color-card: #fcfdfd;
    --color-well: #eef2f2;
    --color-ink: #1d2a2c;
    --color-ink-2: #466062;
    --color-muted: #5c7376;
    --color-faint: #647779;
    --color-rule: #dfe6e6;
    --color-rule-strong: #c9d4d4;

    /* ---- 品牌与语义 ---- */
    --color-accent: #0d5c63;
    --color-accent-deep: #0a4a50;
    --color-accent-tint: #e4f0ef;
    --color-accent-mid: #b9d9d7;
    --color-on-accent: #f2f8f8;
    --color-focus: #0e7c86;
    --color-price: #d4380d;
    --color-danger: #d92d20;
    --color-danger-bg: #fceae6;
    --color-success: #1f7a33;
    --color-success-bg: #e9f4ea;
    --color-warning: #9a6a00;
    --color-warning-bg: #fdf0e3;
    --color-earn: #e8590c;
    --color-wechat: #07c160;

    /* ---- 骨架 / 遮罩 / 阴影 / 壳 ---- */
    --skeleton: #e9eeee; --skeleton-shine: #f4f7f7;
    --modal-mask: rgba(12, 24, 26, .5);
    --shadow-sm: 0 1px 2px rgba(16, 32, 34, .05);
    --shadow-md: 0 2px 8px rgba(16, 32, 34, .08);
    --shadow-lg: 0 12px 32px rgba(10, 20, 22, .16);
    --chrome-bezel: #16191a;
    --chrome-canvas: #e8ecec;
    --color-accent-ink: #f2f8f8;
    --color-on-field: #f2f8f8;
    --veil-a10: rgba(255, 255, 255, .1); --veil-a15: rgba(255, 255, 255, .15);
    --veil-a20: rgba(255, 255, 255, .2); --veil-a35: rgba(255, 255, 255, .35);
    --veil-a60: rgba(255, 255, 255, .6); --veil-a90: rgba(255, 255, 255, .9);
    --scrim-a10: rgba(0, 0, 0, .1); --scrim-a30: rgba(0, 0, 0, .3);
    --scrim-a50: rgba(0, 0, 0, .5); --scrim-a60: rgba(0, 0, 0, .6);
    --scrim-a70: rgba(0, 0, 0, .7); --scrim-a90: rgba(0, 0, 0, .9);
    --toast-bg: rgba(16, 26, 28, .92);
    --focus-glow: rgba(14, 124, 134, .5);
    --focus-glow-0: rgba(14, 124, 134, 0);
    --panel-scrim: rgba(23, 35, 37, .94);
    --header-h: 52px;
    --mask-ink: #000;

    /* ---- 横幅滑面（语义色保留，归一 token） ---- */
    --ss-brand: #0d5c63; --ss-earn: #c2410c; --ss-warranty: #237804; --ss-faq: #13272a;

    /* ---- 旧名别名（既有 var() 调用零改动迁移） ---- */
    --bg: var(--color-paper);
    --card: var(--color-card);
    --text: var(--color-ink);
    --text-sub: var(--color-ink-2);
    --text-weak: var(--color-muted);
    --border: var(--color-rule);
    --primary: var(--color-accent);
    --price: var(--color-price);
    --tag-bg: var(--color-accent-tint);
    --tag-text: var(--color-accent-deep);
    --input-bg: var(--color-well);
    --input-border: var(--color-rule-strong);
    --page-header-bg: var(--color-card);
    --page-header-border: var(--color-rule);
    --tab-bar-bg: var(--color-card);
    --tab-bar-border: var(--color-rule);
    --modal-bg: var(--color-card);
    --form-border: var(--color-rule);
    --tag-orange-bg: var(--color-warning-bg);
    --tag-orange-text: #c2410c;
    --tag-green-bg: var(--color-success-bg);
    --tag-green-text: var(--color-success);
    --tag-gray-bg: var(--color-well);
    --tag-gray-text: var(--color-muted);
    --tag-red-bg: var(--color-danger-bg);
    --tag-red-text: #c0362c;
    --color-primary: var(--color-accent);
    --color-primary-light: var(--color-accent);
    --color-primary-bg: var(--color-accent-tint);
    --color-success: var(--color-success);
    --color-success-bg: var(--color-success-bg);
    --color-warning: var(--color-warning);
    --color-warning-bg: var(--color-warning-bg);
    --color-danger: var(--color-danger);
    --color-danger-bg: var(--color-danger-bg);
    --radius-sm: var(--radius-sm);
    --radius-md: var(--radius-md);
    --radius-lg: var(--radius-lg);
    --radius-xl: var(--radius-xl);
}

/* ---- 深色：品牌衍生青（弃旧默认蓝 #4a9eff），纸墨同相偏移 ---- */
html[data-mode="dark"] {
    --color-paper: #101a1c;
    --color-card: #172628;
    --color-well: #0e1819;
    --color-ink: #e2eae9;
    --color-ink-2: #a6b7b7;
    --color-muted: #829899;
    --color-faint: #6f8486;
    --color-rule: #27393b;
    --color-rule-strong: #33484a;
    --color-accent: #45a0ab;
    --color-accent-deep: #9cd2d8;
    --color-accent-tint: #1b383d;
    --color-accent-mid: #2c5a60;
    --color-on-accent: #0c1a1c;
    --color-focus: #55b7c2;
    --color-price: #ff7847;
    --color-danger: #ff6b5e;
    --color-danger-bg: #3a1d1b;
    --color-success: #58c472;
    --color-success-bg: #14261a;
    --color-warning: #e0a438;
    --color-warning-bg: #2c2214;
    --color-earn: #ff7a45;
    --skeleton: #223436; --skeleton-shine: #2c4245;
    --modal-mask: rgba(0, 0, 0, .65);
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);
    --shadow-md: 0 2px 8px rgba(0, 0, 0, .35);
    --shadow-lg: 0 12px 32px rgba(0, 0, 0, .5);
    --ss-brand: #14535c; --ss-earn: #7a2a12; --ss-warranty: #1c5c2a; --ss-faq: #0d2124;
    --mask-ink: #000;
    --color-accent-ink: #0c1a1c;
    --color-on-field: #eaf4f4;

    --bg: var(--color-paper);
    --card: var(--color-card);
    --text: var(--color-ink);
    --text-sub: var(--color-ink-2);
    --text-weak: var(--color-muted);
    --border: var(--color-rule);
    --primary: var(--color-accent);
    --price: var(--color-price);
    --tag-bg: var(--color-accent-tint);
    --tag-text: var(--color-accent-deep);
    --input-bg: var(--color-well);
    --input-border: var(--color-rule-strong);
    --page-header-bg: var(--color-card);
    --page-header-border: var(--color-rule);
    --tab-bar-bg: var(--color-card);
    --tab-bar-border: var(--color-rule);
    --modal-bg: var(--color-card);
    --form-border: var(--color-rule);
    --tag-orange-bg: var(--color-warning-bg);
    --tag-orange-text: #ffa86b;
    --tag-green-bg: var(--color-success-bg);
    --tag-green-text: var(--color-success);
    --tag-gray-bg: var(--color-well);
    --tag-gray-text: var(--color-muted);
    --tag-red-bg: var(--color-danger-bg);
    --tag-red-text: var(--color-danger);
    --color-primary: var(--color-accent);
    --color-primary-light: var(--color-accent);
    --color-primary-bg: var(--color-accent-tint);
}


/* ===== css/reset.css ===== */
/* 重置样式（R202 Hallmark 重设计：clip / 焦点环 / 字体 token / 减弱动画全量接管） */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
}

html, body {
    width: 100%;
    height: 100%;
    overflow-x: clip;
    font-family: var(--font-body);
    background: var(--color-paper);
    color: var(--color-ink);
    user-select: none;
    -webkit-user-select: none;
}

body { overflow-y: hidden; }

/* 全局焦点环（floor 26a：即时出现，不用边框冒充） */
:focus-visible {
    outline: 2px solid var(--color-focus);
    outline-offset: 2px;
}

::selection { background: color-mix(in oklab, var(--color-accent) 22%, transparent); }

/* R32: 允许特定元素文本可选中 */
.m-bubble, .price-note, .ai-report-card, .detail-desc,
.proto-box, .complaint-detail, .preset-msg,
.msg-item .mi-content {
    -webkit-user-select: text;
    user-select: text;
}

button {
    border: none;
    outline: none;
    background: none;
    font-family: inherit;
    cursor: pointer;
}

input, textarea, select {
    border: none;
    outline: none;
    font-family: inherit;
    background: transparent;
}

/* 移动端输入 16px：防 iOS 聚焦缩放 */
@media (max-width: 480px) {
    input, textarea, select { font-size: 16px; }
}

a {
    text-decoration: none;
    color: inherit;
}

ul, ol {
    list-style: none;
}

img {
    max-width: 100%;
    vertical-align: middle;
}

/* 减弱动画偏好：全量接管（一次声明覆盖所有动画/过渡） */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}


/* ===== css/app.css ===== */
/* ============ 向缮APP 样式 ============ */
* { -webkit-tap-highlight-color:transparent; }
body { background:var(--bg); }

/* ---- 手机壳（PC端） ---- */
.desktop-wrapper { display:flex; justify-content:center; align-items:center; min-height:100vh; padding:var(--space-lg) 0; }
.phone-frame { width:390px; height:844px; background:var(--card); border-radius:44px; box-shadow:0 24px 60px var(--scrim-a30), 0 0 0 10px var(--text), 0 0 0 12px var(--text); overflow:hidden; position:relative; display:flex; flex-direction:column; }
.status-bar { height:44px; display:flex; justify-content:space-between; align-items:center; padding:0 26px; font-size:14px; font-weight:600; color:var(--text); background:var(--card); flex-shrink:0; }
.status-bar .icons { font-size:11px; letter-spacing:0; }
.mobile-wrapper { display:none; flex-direction:column; height:100vh; }
@media (max-width:480px) {
    .desktop-wrapper { display:none; }
    .mobile-wrapper { display:flex; }
    .status-bar { display:none; }
}

/* ---- 容器 / 底部导航 ---- */
.app-container { flex:1; overflow-y:auto; overflow-x:hidden; background:var(--bg); scrollbar-width:none; }
.app-container::-webkit-scrollbar { display:none; }
.page { min-height:100%; padding-bottom:var(--space-lg); }
.tab-bar { flex-shrink:0; height:62px; background:var(--card); border-top:1px solid var(--border); display:flex; z-index:30; }
.tab-item { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--space-3xs); color:var(--text-weak); font-size:10px; cursor:pointer; }
.tab-item .tab-icon { font-size:21px; line-height:1; }
.tab-item.active { color:var(--primary); font-weight:600; }

/* ---- 通用 ---- */
.page-header { position:sticky; top:0; z-index:20; min-height:var(--header-h); box-sizing:border-box; background:var(--card); display:flex; align-items:center; padding:14px var(--space-md); border-bottom:1px solid var(--border); }
.page-header .back-btn { width:44px; height:44px; display:flex; align-items:center; justify-content:center; font-size:22px; color:var(--text); cursor:pointer; margin-left:-10px; }
.page-title { flex:1; text-align:center; font-size:16px; font-weight:600; margin-right:30px; }
.empty-state { text-align:center; padding:60px 20px; color:var(--text-weak); }
.empty-icon { font-size:44px; margin-bottom:10px; }
.btn-primary { width:100%; min-height:44px; padding:var(--space-sm) var(--space-md); border:none; border-radius:var(--radius-md); background:var(--primary); color:var(--color-on-accent); font-size:15px; font-weight:600; cursor:pointer; }
.btn-secondary { width:100%; min-height:42px; padding:11px var(--space-md); border-radius:var(--radius-md); background:var(--card); border:1px solid var(--primary); color:var(--primary); font-size:14px; cursor:pointer; }
.btn-danger { width:100%; min-height:42px; padding:11px var(--space-md); border-radius:var(--radius-md); background:var(--card); border:1px solid var(--color-danger); color:var(--color-danger); font-size:14px; cursor:pointer; }
.btn-small { min-height:32px; padding:6px 14px; border-radius:var(--radius-sm); border:none; background:var(--color-well); color:var(--primary); font-size:12px; cursor:pointer; }
.btn-mini { min-height:28px; padding:var(--space-2xs) 10px; border-radius:var(--radius-xs); border:none; background:var(--primary); color:var(--color-on-accent); font-size:11px; cursor:pointer; }

.tag { display:inline-block; font-size:11px; padding:var(--space-3xs) 7px; border-radius:var(--radius-xs); margin:0 6px 6px 0; }
.tag.blue { background:var(--color-accent-tint); color:var(--color-accent-deep); }
.tag.orange { background:var(--tag-orange-bg); color:var(--tag-orange-text); }
.tag.green { background:var(--color-success-bg); color:var(--color-success); }
.tag.gray { background:var(--color-well); color:var(--text-weak); }
.tag.red { background:var(--tag-red-bg); color:var(--price); }
.tag.purple { background:var(--color-accent-tint); color:var(--color-accent-deep); }

.card { background:var(--card); color:var(--text); border-radius:var(--radius-lg); padding:var(--space-md); margin:0 var(--space-md) var(--space-sm); border:1px solid var(--border); box-shadow:none; }
.form-item { display:flex; justify-content:space-between; align-items:center; padding:var(--space-sm) 0; border-bottom:1px solid var(--border); gap:10px; }
.form-item:last-child { border-bottom:none; }
.f-label { color:var(--text-sub); font-size:13px; flex-shrink:0; }
.f-value { color:var(--text); font-size:13px; text-align:right; font-weight:500; }
input[type=text], input[type=tel], select, textarea {
    border:1px solid var(--input-border); border-radius:var(--radius-sm); padding:10px var(--space-sm); font-size:13px; background:var(--color-well); color:var(--text); outline:none; font-family:inherit;
}
input:focus, select:focus, textarea:focus { background:var(--card); }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline:2px solid var(--color-focus); outline-offset:-2px; }

/* ---- Toast / Modal ---- */
.toast { position:fixed; left:50%; top:42%; transform:translate(-50%, -50%); background:var(--toast-bg); color:var(--color-on-accent); padding:var(--space-sm) 22px; border-radius:10px; font-size:14px; z-index:999; max-width:78%; text-align:center; }
.modal-mask { position:fixed; inset:0; background:var(--modal-mask); z-index:500; display:flex; align-items:center; justify-content:center; padding:30px; }
.modal-box { background:var(--card); border-radius:var(--radius-xl); width:100%; max-width:330px; overflow:hidden; }
.modal-head { padding:18px 20px 6px; font-size:16px; font-weight:700; text-align:center; }
.modal-body { padding:10px 20px var(--space-md); font-size:13.5px; color:var(--text-sub); line-height:1.7; text-align:center; }
.modal-foot { display:flex; border-top:1px solid var(--border); }
.modal-foot button { flex:1; padding:14px; border:none; background:none; font-size:15px; cursor:pointer; }
.m-cancel { color:var(--text-weak); }
.m-primary { color:var(--primary); font-weight:600; }
.m-danger { color:var(--color-danger); font-weight:600; }

/* ---- 首页 ---- */
.home-banner { background:var(--ss-brand); color:var(--color-on-field); padding:26px 20px 56px; border-radius:0 0 var(--radius-xl) var(--radius-xl); position:relative; }
.home-banner .hb-tag { display:inline-block; background:var(--veil-a20); border:1px solid var(--veil-a35); font-size:11px; padding:3px var(--space-xs); border-radius:var(--radius-xs); margin-bottom:10px; }
.home-banner h1 { font-size:26px; letter-spacing:normal; }
.home-banner p { font-size:12.5px; opacity:.9; margin-top:6px; }
.home-search { margin:-38px var(--space-md) 14px; position:relative; z-index:2; }
.search-box { background:var(--card); border-radius:var(--radius-lg); padding:var(--space-sm) 18px; display:flex; align-items:center; gap:var(--space-xs); box-shadow:var(--shadow-md); font-size:13px; color:var(--text-weak); cursor:pointer; }
.addr-entry { margin:0 var(--space-md) 14px; background:var(--card); border-radius:var(--radius-md); padding:11px 14px; display:flex; align-items:center; gap:10px; font-size:13px; border:1px solid var(--border); box-shadow:none; cursor:pointer; }
.addr-entry .loc { font-size:18px; }
.addr-entry .txt { flex:1; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.addr-entry .sub { color:var(--text-weak); font-size:11px; }
.home-section { margin:0 var(--space-md) 14px; }
.home-section .hs-head { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:10px; }
.home-section .hs-head h3 { font-size:15.5px; color:var(--text); }
.home-section .hs-head .more { font-size:12px; color:var(--text-weak); cursor:pointer; }
.cat-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:14px 6px; background:var(--card); border-radius:var(--radius-lg); padding:var(--space-md) var(--space-sm); border:1px solid var(--border); }
.cat-item2 { text-align:center; cursor:pointer; }
.cat-item2 .ci-icon { width:48px; height:48px; border-radius:var(--radius-md); display:flex; align-items:center; justify-content:center; font-size:24px; margin:0 auto 6px; position:relative; }
.cat-item2 .ci-badge { position:absolute; top:-4px; right:-14px; font-size:9px; background:var(--color-danger); color:var(--color-on-accent); border-radius:8px 8px 8px 0; padding:1px 5px; }
.cat-item2 .ci-name { font-size:12px; color:var(--text); }
.cat-item2 .ci-sub { font-size:10px; color:var(--text-weak); margin-top:var(--space-3xs); }
.svc-scroll { display:flex; gap:10px; overflow-x:auto; padding:var(--space-2xs) var(--space-3xs) var(--space-xs); scrollbar-width:none; }
.svc-scroll::-webkit-scrollbar { display:none; }
.svc-card2 { color:var(--text); flex-shrink:0; width:118px; background:var(--card); border-radius:var(--radius-lg); padding:var(--space-sm); border:1px solid var(--border); box-shadow:none; cursor:pointer; }
.svc-card2 .sc-icon { width:40px; height:40px; border-radius:var(--radius-md); display:flex; align-items:center; justify-content:center; font-size:22px; margin-bottom:var(--space-xs); }
.svc-card2 .sc-name { font-size:13px; font-weight:600; color:var(--text); margin-bottom:3px; }
.svc-card2 .sc-price { font-size:11px; color:var(--price); }
.promise-row { display:flex; justify-content:space-around; background:var(--card); border-radius:14px; padding:var(--space-md) 6px; border:1px solid var(--border); box-shadow:none; }
.promise-item { text-align:center; font-size:11px; color:var(--text-sub); }
.promise-item .p-icon { font-size:22px; margin-bottom:5px; }

/* ---- AI 悬浮按钮 ---- */
.ai-fab { position:absolute; right:14px; bottom:14px; width:52px; height:52px; border-radius:50%; background:var(--color-accent-deep); color:var(--color-on-accent); display:flex; flex-direction:column; align-items:center; justify-content:center; box-shadow:var(--shadow-md); cursor:pointer; z-index:40; border:none; }
.ai-fab .fab-icon { font-size:20px; line-height:1; }
.ai-fab .fab-txt { font-size:8px; margin-top:1px; }
.app-container { position:relative; }

/* ---- 分类页 ---- */
.cat-list-item { display:flex; align-items:center; gap:var(--space-sm); background:var(--card); border-radius:var(--radius-lg); padding:14px; margin:0 var(--space-md) 10px; border:1px solid var(--border); box-shadow:none; cursor:pointer; }
.cat-list-item .cli-icon { width:46px; height:46px; border-radius:var(--radius-md); display:flex; align-items:center; justify-content:center; font-size:23px; flex-shrink:0; }
.cat-list-item .cli-info { flex:1; min-width:0; }
.cat-list-item .cli-name { font-size:14.5px; font-weight:600; color:var(--text); }
.cat-list-item .cli-desc { font-size:11.5px; color:var(--text-weak); margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cat-list-item .arrow-r { color:var(--text-weak); font-size:16px; }

/* ---- 服务详情 ---- */
.detail-banner { height:130px; display:flex; align-items:center; justify-content:center; font-size:52px; color:var(--veil-a90); }
.detail-body { background:var(--card); border-radius:var(--radius-xl) var(--radius-xl) 0 0; margin-top:-18px; position:relative; padding:18px var(--space-md) 116px; }
.detail-name { font-size:19px; font-weight:700; color:var(--text); }
.detail-price { font-size:15px; color:var(--price); font-weight:700; margin:var(--space-xs) 0 var(--space-2xs); }
.detail-desc { font-size:12.5px; color:var(--text-weak); line-height:1.8; margin-top:6px; }
.d-section { margin-top:18px; }
.d-section h3 { font-size:14px; color:var(--text); margin-bottom:10px; display:flex; align-items:center; gap:6px; }
.q-box { display:flex; gap:10px; background:var(--color-well); border-radius:var(--radius-md); padding:11px var(--space-sm); margin-bottom:var(--space-xs); }
.q-icon { font-size:19px; flex-shrink:0; }
.q-title { font-size:13px; font-weight:600; color:var(--text); }
.q-sub { font-size:11.5px; color:var(--text-weak); margin-top:var(--space-3xs); }
.d-section ul { list-style:none; }
.d-section ul li { font-size:13px; color:var(--text-sub); padding:5px 0 5px var(--space-md); position:relative; }
.d-section ul li::before { content:'·'; position:absolute; left:4px; color:var(--primary); font-weight:700; }
.g-row { display:grid; grid-template-columns:repeat(4, 1fr); gap:6px; }
.g-item { text-align:center; font-size:10.5px; color:var(--text-sub); background:var(--color-well); border-radius:var(--radius-sm); padding:10px var(--space-3xs); }
.g-item .g-i { font-size:18px; margin-bottom:var(--space-2xs); }
.warranty-box { background:var(--color-success-bg); border:1px dashed var(--color-success); border-radius:var(--radius-md); padding:10px var(--space-sm); font-size:12px; color:var(--color-success); }
.detail-footer { position:sticky; bottom:0; background:var(--card); color:var(--text); padding:var(--space-sm) var(--space-md) calc(var(--space-sm) + env(safe-area-inset-bottom)); border-top:1px solid var(--border); }

/* ---- 下单表单 ---- */
.mode-switch { display:flex; background:var(--color-well); border-radius:var(--radius-md); padding:var(--space-2xs); margin-bottom:var(--space-2xs); }
.mode-switch .ms-item { flex:1; text-align:center; padding:10px; border-radius:var(--radius-sm); font-size:13px; color:var(--text-sub); cursor:pointer; }
.mode-switch .ms-item.active { background:var(--card); color:var(--primary); font-weight:700; box-shadow:var(--shadow-sm); }
.unit-row { display:flex; align-items:center; gap:10px; }
.stepper { display:flex; align-items:center; gap:0; border:1px solid var(--input-border); border-radius:var(--radius-sm); overflow:hidden; }
.stepper button { width:34px; height:32px; border:none; background:var(--color-well); font-size:16px; color:var(--text-sub); cursor:pointer; }
.stepper span { min-width:52px; text-align:center; font-size:13px; font-weight:600; }
.price-bar { display:flex; justify-content:space-between; align-items:baseline; }
.price-big { font-size:22px; color:var(--price); font-weight:700; }
.price-note { font-size:11px; color:var(--text-weak); margin-top:6px; line-height:1.6; }
.extra-check { display:flex; align-items:center; gap:var(--space-xs); cursor:pointer; }
.extra-check .chk { width:17px; height:17px; border-radius:50%; border:2px solid var(--color-rule-strong); flex-shrink:0; }
.extra-check.on .chk { background:var(--primary); border-color:var(--primary); position:relative; }
.extra-check.on .chk::after { content:'✓'; position:absolute; inset:0; color:var(--color-on-accent); font-size:10px; display:flex; align-items:center; justify-content:center; }
.img-upload-row { display:flex; gap:var(--space-xs); flex-wrap:wrap; }
.upload-box { width:62px; height:62px; border:1.5px dashed var(--color-rule-strong); border-radius:var(--radius-md); display:flex; align-items:center; justify-content:center; font-size:26px; color:var(--text-weak); cursor:pointer; background:var(--color-well); }
.preview-box { width:62px; height:62px; border-radius:var(--radius-md); background-size:cover; background-position:center; position:relative; }
.preview-box .del { position:absolute; top:-6px; right:-6px; width:18px; height:18px; background:var(--scrim-a60); color:var(--color-on-accent); border-radius:50%; font-size:11px; display:flex; align-items:center; justify-content:center; cursor:pointer; }

/* ---- 订单列表/详情 ---- */
.f-tabs { display:flex; background:var(--card); padding:0 var(--space-xs); position:sticky; top:var(--header-h); z-index:10; border-bottom:1px solid var(--border); }
.f-tab { flex:1; text-align:center; padding:13px var(--space-3xs); font-size:13px; color:var(--text-sub); cursor:pointer; position:relative; white-space:nowrap; }
.f-tab.active { color:var(--primary); font-weight:700; }
.f-tab.active::after { content:''; position:absolute; left:50%; transform:translateX(-50%); bottom:0; width:24px; height:3px; border-radius:2px; background:var(--primary); }
.order-card { background:var(--card); color:var(--text); border-radius:var(--radius-lg); padding:14px; margin:0 var(--space-md) 10px; border:1px solid var(--border); box-shadow:none; cursor:pointer; }
.oc-head { display:flex; justify-content:space-between; margin-bottom:10px; }
.oc-no { font-size:11px; color:var(--text-weak); }
.oc-status { font-size:12px; font-weight:600; }
.oc-status.pending { color:var(--color-earn); } .oc-status.accepted { color:var(--primary); } .oc-status.serving { color:var(--color-accent-deep); }
.oc-status.completed { color:var(--color-success); } .oc-status.reviewed { color:var(--color-success); } .oc-status.cancelled { color:var(--text-weak); }
.oc-body { display:flex; gap:10px; align-items:center; }
.oc-icon { width:44px; height:44px; border-radius:var(--radius-md); background:var(--color-well); display:flex; align-items:center; justify-content:center; font-size:22px; flex-shrink:0; }
.oc-info { flex:1; min-width:0; }
.oc-name { font-size:14px; font-weight:600; color:var(--text); }
.oc-time { font-size:11.5px; color:var(--text-weak); margin-top:3px; }
.oc-price { font-size:15px; font-weight:700; color:var(--price); }
.oc-actions { display:flex; justify-content:flex-end; gap:var(--space-xs); margin-top:10px; }
.oc-actions button { min-height:32px; padding:7px 14px; border-radius:var(--radius-sm); border:1px solid var(--color-rule-strong); background:var(--card); color:var(--text-sub); font-size:12px; cursor:pointer; }
.oc-actions button.primary { background:var(--primary); color:var(--color-on-accent); border-color:var(--primary); }
.detail-top { padding:22px 20px; color:var(--color-on-field); border-radius:0 0 var(--radius-xl) var(--radius-xl); background:var(--ss-brand); }
.dt-status { font-size:12px; opacity:.85; }
.dt-label { font-size:20px; font-weight:700; margin-top:var(--space-2xs); }
/* 师傅实时状态链 */
.stage-chain { display:flex; align-items:center; margin:14px 0 var(--space-2xs); }
.stage-node { display:flex; flex-direction:column; align-items:center; flex:1; position:relative; }
.stage-node .dot { width:10px; height:10px; border-radius:50%; background:var(--veil-a35); margin-bottom:5px; z-index:1; }
.stage-node.done .dot { background:var(--color-success); }
.stage-node.now .dot { background:var(--card); box-shadow:0 0 0 4px var(--veil-a35); }
.stage-node .s-label { font-size:9px; color:var(--veil-a90); white-space:nowrap; }
.stage-node::before { content:''; position:absolute; top:4px; left:-50%; width:100%; height:2px; background:var(--veil-a20); }
.stage-node:first-child::before { display:none; }
.stage-node.done::before { background:var(--color-success); }
.worker-card { display:flex; align-items:center; gap:var(--space-sm); }
.worker-card .w-avatar { color:var(--text); width:46px; height:46px; border-radius:50%; background:var(--color-well); display:flex; align-items:center; justify-content:center; font-size:24px; }
.timeline-box { border-left:2px solid var(--border); margin:var(--space-xs) 0 var(--space-2xs) 6px; padding-left:14px; }
.timeline-item2 { position:relative; padding:var(--space-2xs) 0; font-size:12px; color:var(--text-sub); }
.timeline-item2::before { content:''; position:absolute; left:-19px; top:10px; width:8px; height:8px; border-radius:50%; background:var(--primary); }

/* ---- 评价 ---- */
.star-row { display:flex; justify-content:center; gap:10px; font-size:32px; margin:10px 0; }
.star-row .st { color:var(--color-rule-strong); cursor:pointer; transition:transform .15s; }
.star-row .st.on { color:var(--color-warning); }
.tag-pick { display:flex; flex-wrap:wrap; gap:var(--space-xs); justify-content:center; margin:10px 0; }
.tag-pick .tp { padding:6px 14px; border-radius:var(--radius-sm); background:var(--color-well); color:var(--text-sub); font-size:12px; cursor:pointer; }
.tag-pick .tp.on { background:var(--tag-orange-bg); color:var(--tag-orange-text); font-weight:600; }

/* ---- AI 对话页 ---- */
.ai-page { display:flex; flex-direction:column; min-height:100%; background:var(--bg); }
.ai-head { background:var(--ss-brand); color:var(--color-on-field); padding:var(--space-md); display:flex; align-items:center; gap:10px; }
.ai-head .back-btn { color:var(--color-on-accent); font-size:20px; cursor:pointer; }
.ai-head .ai-avatar { width:36px; height:36px; border-radius:50%; background:var(--veil-a20); display:flex; align-items:center; justify-content:center; font-size:19px; }
.ai-head .ai-title { font-size:15px; font-weight:700; }
.ai-head .ai-sub { font-size:10.5px; opacity:.85; }
.ai-disclaimer { background:var(--tag-orange-bg); color:var(--color-warning); font-size:10.5px; padding:var(--space-xs) 14px; line-height:1.6; border-bottom:1px solid var(--color-warning-bg); }
.ai-msgs { flex:1; padding:14px; overflow-y:auto; }
.msg { display:flex; gap:var(--space-xs); margin-bottom:var(--space-sm); }
.msg .m-avatar { width:32px; height:32px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:16px; }
.msg.ai .m-avatar { background:var(--color-accent-deep); }
.msg.user { flex-direction:row-reverse; }
.msg.user .m-avatar { background:var(--primary); color:var(--color-on-accent); font-size:12px; }
.msg .m-bubble { max-width:76%; border-radius:14px; padding:10px 13px; font-size:13px; line-height:1.7; background:var(--card); color:var(--text); box-shadow:0 1px 3px var(--scrim-a10); }
.msg.user .m-bubble { background:var(--primary); color:var(--color-on-accent); }
.ai-report-card { color:var(--text-sub); border:1px solid var(--color-accent-mid); border-radius:12px; padding:var(--space-sm); margin-top:var(--space-xs); background:var(--color-accent-tint); }
.ai-report-card h5 { font-size:13.5px; color:var(--color-accent-deep); margin-bottom:6px; }
.ai-report-card .r-row { font-size:12px; color:var(--text-sub); padding:3px 0; }
.ai-report-card .r-row b { color:var(--text); }
.ai-report-card .r-btns { display:flex; gap:var(--space-xs); margin-top:10px; }
.ai-report-card .r-btns button { flex:1; min-height:36px; padding:9px; border-radius:var(--radius-sm); border:none; font-size:12px; cursor:pointer; }
.ai-quick-bar { display:flex; gap:var(--space-xs); padding:10px 14px 6px; overflow-x:auto; scrollbar-width:none; }
.ai-quick-bar::-webkit-scrollbar { display:none; }
.ai-quick-bar .qk { flex-shrink:0; padding:7px 13px; border-radius:var(--radius-round); background:var(--color-accent-tint); color:var(--color-accent-deep); font-size:12px; cursor:pointer; }
.ai-input-bar { display:flex; gap:var(--space-xs); padding:10px 14px calc(10px + env(safe-area-inset-bottom)); background:var(--card); border-top:1px solid var(--border); }
.ai-input-bar input { flex:1; }
.ai-input-bar .send-btn { padding:0 18px; border:none; border-radius:var(--radius-md); background:var(--color-accent-deep); color:var(--color-on-accent); font-size:13px; cursor:pointer; }

/* ---- 广告财富 ---- */
.ads-hero { background:var(--ss-earn); color:var(--color-on-field); padding:var(--space-lg) 20px 20px; border-radius:0 0 var(--radius-xl) var(--radius-xl); }
.ads-hero .ah-title { font-size:16px; font-weight:700; }
.ads-hero .ah-bal { font-size:34px; font-weight:800; margin:var(--space-xs) 0 var(--space-2xs); }
.ads-hero .ah-sub { font-size:11.5px; opacity:.9; }
.ads-stats { display:flex; gap:10px; margin:var(--space-sm) var(--space-md) 14px; }
.ads-stat { flex:1; background:var(--card); border-radius:var(--radius-lg); padding:var(--space-sm); text-align:center; border:1px solid var(--border); box-shadow:none; }
.ads-stat .num { font-size:17px; font-weight:700; color:var(--text); }
.ads-stat .lbl { font-size:10.5px; color:var(--text-weak); margin-top:3px; }
.ad-type-card { color:var(--text); display:flex; align-items:center; gap:var(--space-sm); background:var(--card); border-radius:var(--radius-lg); padding:14px; margin:0 var(--space-md) 10px; border:1px solid var(--border); box-shadow:none; }
.ad-type-card .at-icon { color:var(--text); width:46px; height:46px; border-radius:var(--radius-md); background:var(--tag-orange-bg); display:flex; align-items:center; justify-content:center; font-size:23px; flex-shrink:0; }
.ad-type-card .at-info { flex:1; }
.ad-type-card .at-name { font-size:14px; font-weight:600; }
.ad-type-card .at-sub { font-size:11px; color:var(--text-weak); margin-top:var(--space-3xs); }
.ad-type-card .at-reward { font-size:14px; font-weight:700; color:var(--price); }
.progress-bar { height:8px; background:var(--tag-orange-bg); border-radius:4px; overflow:hidden; }
.progress-bar .pb-in { height:100%; background:var(--price); border-radius:4px; }
.ad-play-mask { position:fixed; inset:0; background:var(--scrim-a90); z-index:600; display:flex; flex-direction:column; align-items:center; justify-content:center; color:var(--color-on-accent); }
.ad-play-mask .adp-tag { position:absolute; top:18px; right:18px; font-size:11px; background:var(--veil-a20); padding:3px 9px; border-radius:4px; }
.ad-play-mask .adp-count { font-size:52px; font-weight:800; }
.ad-play-mask .adp-name { font-size:14px; opacity:.8; margin-top:6px; }
.ad-play-mask .adp-btn { margin-top:26px; min-height:44px; padding:var(--space-sm) var(--space-xl); border:none; border-radius:var(--radius-md); background:var(--color-warning); color:var(--color-on-accent); font-size:15px; font-weight:700; cursor:pointer; }
.verify-slider { width:82%; margin-top:26px; background:var(--veil-a15); border-radius:22px; padding:var(--space-xs); position:relative; }
.verify-slider .vs-track { height:36px; background:var(--veil-a10); border-radius:18px; position:relative; overflow:hidden; }
.verify-slider .vs-handle { position:absolute; left:4px; top:3px; width:42px; height:30px; background:var(--color-warning); border-radius:15px; display:flex; align-items:center; justify-content:center; font-size:14px; cursor:pointer; }
.verify-slider .vs-tip { text-align:center; font-size:11px; opacity:.75; margin-top:6px; }

/* ---- 排行榜 ---- */
.rank-podium { display:flex; align-items:flex-end; justify-content:center; gap:var(--space-sm); padding:20px 0 6px; }
.podium-item { text-align:center; width:84px; }
.podium-item .pd-medal { font-size:26px; }
.podium-item .pd-name { font-size:12px; font-weight:600; margin:var(--space-2xs) 0 var(--space-3xs); }
.podium-item .pd-earn { font-size:12px; color:var(--price); font-weight:600; }
.podium-item .pd-bar { background:var(--color-warning); border-radius:8px 8px 0 0; margin-top:var(--space-xs); }
.rank-row { display:flex; align-items:center; gap:10px; background:var(--card); border-radius:var(--radius-lg); padding:11px 14px; margin:0 var(--space-md) var(--space-xs); }
.rank-row .rk-no { width:26px; text-align:center; font-size:14px; font-weight:800; color:var(--text-weak); }
.rank-row .rk-no.top { color:var(--color-warning); }
.rank-row .rk-name { flex:1; font-size:13.5px; color:var(--text); }
.rank-row .rk-earn { font-size:13px; font-weight:700; color:var(--price); }
.rank-me { border:1.5px solid var(--color-earn); background:var(--tag-orange-bg); }

/* ---- 我的 ---- */
.profile-head { background:var(--ss-brand); color:var(--color-on-field); padding:26px 20px 20px; }
.mine-icp { text-align:center; font-size:10.5px; color:var(--text-weak); line-height:1.8; padding:18px 16px calc(18px + env(safe-area-inset-bottom)); }
.mine-icp a { color:inherit; }
.ph-user { display:flex; align-items:center; gap:14px; }
.ph-avatar { width:58px; height:58px; border-radius:50%; background:var(--veil-a20); display:flex; align-items:center; justify-content:center; font-size:28px; }
.ph-name { font-size:17px; font-weight:700; }
.ph-phone { font-size:12.5px; opacity:.85; margin-top:var(--space-3xs); }
.profile-stats { display:flex; background:var(--card); border-radius:var(--radius-lg); margin:-14px var(--space-md) var(--space-sm); padding:14px 0; box-shadow:var(--shadow-md); position:relative; }
.ps-item { flex:1; text-align:center; border-right:1px solid var(--border); }
.ps-item:last-child { border-right:none; }
.ps-num { font-size:17px; font-weight:700; color:var(--text); }
.ps-lbl { font-size:11px; color:var(--text-weak); margin-top:3px; }
.profile-group { background:var(--card); border-radius:var(--radius-lg); margin:0 var(--space-md) var(--space-sm); overflow:hidden; border:1px solid var(--border); box-shadow:none; }
.pg-item { display:flex; align-items:center; gap:var(--space-sm); padding:14px; border-bottom:1px solid var(--border); cursor:pointer; }
.pg-item:last-child { border-bottom:none; }
.pg-icon { font-size:19px; }
.pg-text { flex:1; font-size:14px; color:var(--text); }
.pg-arrow { color:var(--text-weak); }

/* ---- 登录 ---- */
.login-page { display:flex; flex-direction:column; align-items:center; padding:60px 30px 30px; min-height:100%; }
.logo-circle { width:84px; height:84px; border-radius:var(--radius-xl); background:var(--primary); color:var(--color-on-accent); display:flex; align-items:center; justify-content:center; font-size:40px; margin-bottom:var(--space-md); box-shadow:var(--shadow-md); }
.login-page h1 { font-size:24px; letter-spacing:normal; color:var(--text); }
.login-page .lg-sub { font-size:12.5px; color:var(--text-weak); margin:6px 0 30px; }
.input-row { display:flex; align-items:center; width:100%; background:var(--card); border:1px solid var(--border); border-radius:var(--radius-md); padding:var(--space-2xs) 14px; margin-bottom:14px; box-shadow:none; gap:10px; }
.input-row .ir-icon { font-size:17px; }
.input-row input { flex:1; border:none; background:none; padding:13px 0; font-size:14px; outline:none; }
.code-btn { font-size:12px; color:var(--primary); white-space:nowrap; cursor:pointer; }
.agree-row { display:flex; align-items:center; gap:var(--space-xs); font-size:12px; color:var(--text-weak); width:100%; margin-bottom:20px; }
.agree-row a { color:var(--primary); text-decoration:none; }
.chk { width:17px; height:17px; border-radius:50%; border:2px solid var(--color-rule-strong); flex-shrink:0; cursor:pointer; }
.chk.on { background:var(--primary); border-color:var(--primary); position:relative; }
.chk.on::after { content:'✓'; position:absolute; inset:0; color:var(--color-on-accent); font-size:10px; display:flex; align-items:center; justify-content:center; }
.wx-login-btn { margin-top:14px; background:var(--color-wechat); }
.demo-box { width:100%; background:var(--color-well); border-radius:var(--radius-md); padding:var(--space-sm) 14px; margin-top:var(--space-lg); }
.demo-box .d-title { font-size:12px; color:var(--primary); font-weight:600; margin-bottom:6px; }
.demo-box .d-row { display:flex; justify-content:space-between; font-size:12.5px; color:var(--text-sub); padding:7px var(--space-2xs); cursor:pointer; border-radius:8px; }
.demo-box .d-row:hover { background:var(--color-well); }
.demo-box .d-phone { color:var(--primary); }

/* ---- 成功页 ---- */
.success-page { display:flex; flex-direction:column; align-items:center; padding:70px var(--space-lg) var(--space-lg); }
.success-icon { width:74px; height:74px; border-radius:50%; background:var(--color-success-bg); display:flex; align-items:center; justify-content:center; font-size:36px; margin-bottom:var(--space-md); }
.success-title { font-size:19px; font-weight:700; color:var(--text); }
.success-desc { font-size:12.5px; color:var(--text-weak); margin:var(--space-xs) 0 18px; }
.info-card { width:100%; background:var(--card); color:var(--text); border-radius:var(--radius-lg); padding:var(--space-2xs) var(--space-md); border:1px solid var(--border); box-shadow:none; }
.info-tips { width:100%; border-radius:var(--radius-md); padding:var(--space-sm) 14px; font-size:12.5px; margin:14px 0; line-height:1.7; }
.success-page .btn-primary, .success-page .btn-secondary { margin-bottom:var(--space-sm); }

/* ---- 协议弹层 ---- */
.proto-box { max-height:60vh; overflow-y:auto; text-align:left; font-size:12.5px; color:var(--text-sub); line-height:1.8; }
.proto-box h5 { font-size:13.5px; color:var(--text); margin:10px 0 var(--space-2xs); }

/* ===== 交互升级 v3 ===== */

/* ---- 1. 按压反馈 ---- */
.cat-item2, .svc-card2, .cat-list-item, .order-card, .pg-item, .promise-item, .addr-entry, .tab-item, .qk, .rank-row, .f-tab, .ms-item, .sd-item, .an-item, .d-section .q-box, .worker-card {
    transition:transform .12s ease, opacity .12s ease, background .2s ease;
}
.cat-item2:active, .svc-card2:active, .cat-list-item:active, .order-card:active, .pg-item:active, .promise-item:active, .addr-entry:active, .tab-item:active, .qk:active, .rank-row:active, .f-tab:active, .ms-item:active, .sd-item:active, .an-item:active, .d-section .q-box:active, .worker-card:active {
    transform:scale(.96);
    opacity:.85;
}
.btn-primary, .btn-secondary, .btn-mini, .btn-small, .btn-danger, .send-btn, .m-primary, .m-danger {
    transition:transform .12s ease, opacity .12s ease, background .2s ease;
}
.btn-primary:active, .btn-secondary:active, .btn-mini:active, .btn-small:active, .btn-danger:active, .send-btn:active, .m-primary:active, .m-danger:active {
    transform:scale(.97);
    filter:brightness(.92);
}
.stepper button { transition:background .15s; }
.stepper button:active { background:var(--color-well); }
.stepper button.dim { opacity:.35; }

/* ---- 2. 关键帧动画 ---- */
@keyframes fadeIn {
    from { opacity:0; }
    to { opacity:1; }
}
@keyframes fadeSlideUp {
    from { opacity:0; transform:translateY(10px); }
    to { opacity:1; transform:translateY(0); }
}
@keyframes popIn {
    0% { transform:scale(.4); }
    70% { transform:scale(1); }
    100% { transform:scale(1); }
}
@keyframes modalIn {
    from { opacity:0; transform:scale(.92) translateY(10px); }
    to { opacity:1; transform:scale(1) translateY(0); }
}
@keyframes dotBounce {
    0%, 80%, 100% { transform:translateY(0); }
    40% { transform:translateY(-5px); }
}
@keyframes spin {
    from { transform:rotate(0deg); }
    to { transform:rotate(360deg); }
}
@keyframes borderFlash {
    0% { box-shadow:0 0 0 0 var(--focus-glow); }
    100% { box-shadow:0 0 0 8px var(--focus-glow-0); }
}

/* ---- 3. 契约类 ---- */
/* stagger 交错入场 */
.stagger > * { animation:fadeSlideUp .3s ease both; }
.stagger > *:nth-child(2) { animation-delay:.05s; }
.stagger > *:nth-child(3) { animation-delay:.1s; }
.stagger > *:nth-child(4) { animation-delay:.15s; }
.stagger > *:nth-child(5) { animation-delay:.2s; }
.stagger > *:nth-child(6) { animation-delay:.25s; }
.stagger > *:nth-child(7) { animation-delay:.3s; }
.stagger > *:nth-child(8) { animation-delay:.35s; }
.stagger > *:nth-child(9) { animation-delay:.4s; }
.stagger > *:nth-child(10) { animation-delay:.45s; }
.stagger > *:nth-child(11) { animation-delay:.5s; }
.stagger > *:nth-child(12) { animation-delay:.55s; }

/* list-fade 列表淡入 */
.list-fade { animation:fadeIn .25s ease; }

/* success-icon 弹性缩放 */
.success-icon { animation:popIn .45s var(--ease-out) both; }

/* modal 动画 */
.modal-box { animation:modalIn .25s ease; }
.modal-mask { animation:fadeIn .2s ease; }
.modal-box .m-danger { background:var(--color-danger-bg); font-weight:700; }

/* dot-typing 打字点 */
.dot-typing { display:inline-flex; gap:var(--space-2xs); vertical-align:middle; margin-left:var(--space-3xs); }
.dot-typing i { width:6px; height:6px; border-radius:50%; background:var(--color-accent-deep); animation:dotBounce 1.2s infinite; }
.dot-typing i:nth-child(2) { animation-delay:.2s; }
.dot-typing i:nth-child(3) { animation-delay:.4s; }

/* upload-loading 上传中旋转 */
.upload-loading { width:62px; height:62px; border-radius:10px; background:var(--color-well); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.upload-loading::after { content:''; width:22px; height:22px; border:3px solid var(--color-well); border-top-color:var(--primary); border-radius:50%; animation:spin .8s linear infinite; }

/* search-drop 搜索下拉 */
.search-drop { background:var(--card); border-radius:12px; margin:var(--space-xs) var(--space-md) 0; box-shadow:var(--shadow-md); overflow:hidden; animation:fadeIn .2s ease; }
.sd-item { display:flex; align-items:center; gap:10px; padding:10px 14px; font-size:13px; color:var(--text); border-bottom:1px solid var(--border); cursor:pointer; }
.sd-item:last-child { border-bottom:none; }
.sd-icon { width:30px; height:30px; border-radius:var(--radius-sm); display:flex; align-items:center; justify-content:center; font-size:16px; flex-shrink:0; }
.sd-name { font-weight:600; }
.sd-sub { font-size:11px; color:var(--text-weak); margin-left:auto; white-space:nowrap; }

/* err-tip 错误提示 */
.err-tip { display:block; color:var(--color-danger); font-size:11.5px; margin-top:6px; text-align:left; }

/* anchor-bar 锚点导航 */
.anchor-bar { position:sticky; top:var(--header-h); z-index:5; display:flex; gap:var(--space-xs); padding:10px var(--space-md); background:var(--color-card); border-bottom:1px solid var(--border); overflow-x:auto; scrollbar-width:none; }
.anchor-bar::-webkit-scrollbar { display:none; }
.an-item { flex-shrink:0; padding:6px 14px; border-radius:var(--radius-round); background:var(--color-well); color:var(--primary); font-size:12px; cursor:pointer; }
.an-item.on { background:var(--primary); color:var(--color-on-accent); }

/* input-flash 输入框闪烁 */
.input-flash { animation:borderFlash .6s ease; }

/* addr-full 完整地址 */
.addr-full { font-size:11px; color:var(--text-weak); white-space:normal; line-height:1.5; margin-top:var(--space-3xs); }

/* code-btn.dim 验证码按钮禁用态 */
.code-btn.dim { color:var(--text-weak); pointer-events:none; }

/* #timeArea 淡入 */
#timeArea { animation:fadeIn .25s ease; }
.mode-switch .ms-item { transition: background-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out), border-color var(--dur-short) var(--ease-out), opacity var(--dur-short) var(--ease-out), transform var(--dur-short) var(--ease-out), box-shadow var(--dur-short) var(--ease-out); }

/* stage-node 节点过渡 */
.stage-node .dot { transition:background .35s ease, box-shadow .35s ease; }
.stage-node { transition:opacity .3s; }

/* vs-handle 滑块手柄 */
.vs-handle { touch-action:none; user-select:none; cursor:grab; }
.vs-handle:active { cursor:grabbing; }

/* ---- 4. 细节修正 ---- */
/* svc-scroll 左右渐隐遮罩 */
.svc-scroll {
    -webkit-mask-image:linear-gradient(to right, transparent, var(--mask-ink) 16px, var(--mask-ink) calc(100% - 16px), transparent);
    mask-image:linear-gradient(to right, transparent, var(--mask-ink) 16px, var(--mask-ink) calc(100% - 16px), transparent);
}

/* detail-body padding-bottom 已在原规则处改为 116px */

/* ---- 无障碍：减弱动画偏好 ---- */
@media (prefers-reduced-motion:reduce) {
    *, *::before, *::after {
        animation-duration:.001s !important;
        transition-duration:.001s !important;
    }
}

/* ===== 第二轮打磨 v4 ===== */

/* ---- 1. 角色选择页（user 代理用） ---- */
.role-page { min-height:100%; display:flex; flex-direction:column; align-items:center; padding:70px 26px 30px; background:var(--primary) }
.rs-logo { width:86px;height:86px;border-radius:var(--radius-xl);background:var(--veil-a15);border:1px solid var(--veil-a35);display:flex;align-items:center;justify-content:center;font-size:42px;color:var(--color-on-accent);margin-bottom:14px }
.role-page h1 { color:var(--color-on-accent);font-size:26px;letter-spacing:normal }
.role-page .rs-sub { color:var(--veil-a90);font-size:12.5px;margin:6px 0 34px }
.rs-cards { width:100%;display:flex;flex-direction:column;gap:14px }
.rs-card { color:var(--text); display:flex;align-items:center;gap:14px;background:var(--card);border-radius:var(--radius-lg);padding:18px;box-shadow:var(--shadow-md);cursor:pointer;transition:transform .15s ease }
.rs-card:active { transform:scale(.97) }
.rs-icon { width:52px;height:52px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:26px;flex-shrink:0 }
.rs-icon.customer { background:var(--color-accent-tint) }
.rs-icon.worker { background:var(--tag-orange-bg) }
.rs-info h3 { font-size:15.5px;color:var(--text) }
.rs-info p { font-size:11.5px;color:var(--text-weak);margin-top:3px;text-wrap:balance }
.rs-arrow { margin-left:auto;color:var(--text-weak);font-size:18px }
.rs-foot { margin-top:auto;padding-top:26px;font-size:11px;color:var(--veil-a60) }
.role-badge { align-self:flex-start;background:var(--color-accent-tint);color:var(--color-accent-deep);border-radius:var(--radius-sm);padding:6px var(--space-sm);font-size:12px;margin-bottom:14px }
.role-badge.worker { background:var(--tag-orange-bg);color:var(--tag-orange-text) }

/* ---- 2. 首页轮播（home 代理用） ---- */
.banner-swiper { position:relative;overflow:hidden;border-radius:0 0 var(--radius-xl) var(--radius-xl) }
.swiper-track { display:flex;transition:transform .45s ease;width:100% }
.swiper-slide { min-width:100%;box-sizing:border-box;padding:26px 20px 46px;color:var(--color-on-field) }
.ss-brand { background:var(--primary) }
.ss-ads { background:var(--ss-earn) }
.ss-warranty { background:var(--ss-warranty) }
.swiper-slide h1 { font-size:26px;letter-spacing:normal }
.swiper-slide [style*="border-radius:50%"] { display:none !important; }
.swiper-slide h1 { text-shadow:none !important; }
.swiper-slide.ss-faq { background:var(--ss-faq) !important; }
.home-banner h1 { text-shadow:none !important; }
.swiper-slide p { font-size:12.5px;opacity:.9;margin-top:6px }
.swiper-slide .hb-tag { display:inline-block;background:var(--veil-a20);border:1px solid var(--veil-a35);font-size:11px;padding:3px var(--space-xs);border-radius:var(--radius-xs);margin-bottom:10px }
.swiper-dots { position:absolute;bottom:12px;left:0;right:0;display:flex;justify-content:center;gap:6px }
.sw-dot { width:6px;height:6px;border-radius:var(--radius-round);background:var(--veil-a35);transition: background-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out), border-color var(--dur-short) var(--ease-out), opacity var(--dur-short) var(--ease-out), transform var(--dur-short) var(--ease-out), box-shadow var(--dur-short) var(--ease-out);cursor:pointer }
.sw-dot.on { background:var(--color-on-accent) }
.hist-row { display:flex;justify-content:space-between;align-items:center;padding:var(--space-xs) 14px;font-size:12.5px;color:var(--text-sub);border-bottom:1px solid var(--border);cursor:pointer }
.hist-row:hover { background:var(--color-well) }
.hist-row .hx { color:var(--text-weak);cursor:pointer;padding:var(--space-3xs) 6px }

/* ---- 3. 费用明细 / 下拉刷新 / 星评（order 代理用） ---- */
.fee-detail { overflow:hidden;max-height:0;transition:max-height .3s ease;background:var(--tag-orange-bg);border-radius:10px;margin-top:var(--space-xs) }
.fee-detail.open { max-height:320px }
.fd-row { display:flex;justify-content:space-between;font-size:12px;color:var(--color-warning);padding:6px var(--space-sm) }
.fd-row.total { font-weight:700;color:var(--price);border-top:1px dashed var(--tag-orange-bg);margin:0 var(--space-xs);padding:var(--space-xs) var(--space-sm) }
.pull-refresh { position:sticky;top:var(--header-h);z-index:9;text-align:center;font-size:11px;color:var(--primary);padding:6px;background:color-mix(in srgb, var(--color-accent-tint) 92%, transparent);border-radius:0 0 10px 10px }
.pull-refresh .spin { display:inline-block;animation:spin .8s linear infinite }
.st.star-pop { animation:starPop .3s ease }
@keyframes starPop { 0%{transform:scale(1)} 50%{transform:scale(1.5) rotate(8deg)} 100%{transform:scale(1)} }

/* ---- 4. AI建议chips（ai 代理用） ---- */
.sg-chip { flex-shrink:0;min-height:32px;padding:7px var(--space-sm);border-radius:var(--radius-round);background:var(--card);border:1px solid var(--color-accent-mid);color:var(--color-accent-deep);font-size:11.5px;cursor:pointer;transition:transform .12s ease,background .2s }
.sg-chip:active { transform:scale(.95) }

/* ---- 5. 师傅端（worker 代理用） ---- */
.wb-head { background:var(--ss-earn);padding:20px;color:var(--color-on-field);border-radius:0 0 var(--radius-xl) var(--radius-xl) }
.wb-row { display:flex;align-items:center;gap:var(--space-sm) }
.wb-avatar { width:52px;height:52px;border-radius:50%;background:var(--veil-a20);display:flex;align-items:center;justify-content:center;font-size:26px }
.online-switch { margin-left:auto;display:flex;align-items:center;gap:var(--space-xs);font-size:12.5px;cursor:pointer }
.os-track { width:44px;height:24px;border-radius:12px;background:var(--veil-a35);position:relative;transition:background .3s }
.os-track.on { background:var(--color-success) }
.os-knob { position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:var(--card);transition:transform var(--dur-short) var(--ease-in-out) }
.os-track.on .os-knob { transform:translateX(20px) }
.wb-stats { display:flex;gap:10px;margin:14px var(--space-md) }
.wb-stat { flex:1;background:var(--card);border-radius:var(--radius-lg);padding:var(--space-sm);text-align:center;border:1px solid var(--border); box-shadow:none;cursor:pointer }
.wb-stat .num { font-size:17px;font-weight:700;color:var(--tag-orange-text) }
.wb-stat .lbl { font-size:10.5px;color:var(--text-weak);margin-top:var(--space-3xs) }
.grab-card { background:var(--card); color:var(--text);border-radius:var(--radius-lg);padding:14px;margin:0 var(--space-md) 10px;border:1px solid var(--border); box-shadow:none }
.grab-btn { background:var(--ss-earn);color:var(--color-on-field);border:none;border-radius:var(--radius-md);min-height:36px;padding:9px 18px;font-size:13px;font-weight:600;cursor:pointer }
.grab-btn:active { transform:scale(.96) }
.msg-item { display:flex;gap:10px;background:var(--card);border-radius:var(--radius-lg);padding:13px;margin:0 var(--space-md) var(--space-xs);border:1px solid var(--border); box-shadow:none;align-items:flex-start }
.msg-item .mi-icon { width:36px;height:36px;border-radius:var(--radius-sm);background:var(--color-well);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0 }
.msg-item .mi-title { font-size:13px;font-weight:600;color:var(--text) }
.msg-item .mi-sub { font-size:11.5px;color:var(--text-weak);margin-top:var(--space-3xs) }
.mi-dot { width:8px;height:8px;border-radius:50%;background:var(--color-danger);margin:6px 0 0 auto;flex-shrink:0 }
.income-cards { display:flex;gap:10px;margin:var(--space-sm) var(--space-md) }
.income-card { flex:1;background:var(--ss-earn);color:var(--color-on-field);border-radius:var(--radius-lg);padding:14px }
.income-card.sub { background:var(--ss-earn); color:var(--color-on-field); }
.income-card .num { font-size:19px;font-weight:800 }
.income-card .lbl { font-size:10.5px;opacity:.85;margin-top:var(--space-3xs) }

/* ---- 6. 头像选择（mine 代理用） ---- */
.avatar-pick { display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:10px }
.ap-item { font-size:30px;text-align:center;padding:var(--space-xs);border-radius:10px;cursor:pointer;transition:transform .12s ease }
.ap-item:active { background:var(--color-well);transform:scale(1.1) }

/* ===== 动效契约 v5（骨架屏 / 加载 / 按压 / Toast / 脉冲 / 进度条） ===== */

/* ---- 1. 骨架屏 skeleton ---- */
.skel-card {
    color:var(--text);
    background:var(--card);
    border-radius:var(--radius-lg);
    padding:14px;
    margin-bottom:10px;
}
.skel-line {
    height:14px;
    border-radius:7px;
    background:var(--color-well);
}
.skel-line.w60 { width:60%; }
.skel-line.w40 { width:40%; }
.skel-line.w80 { width:80%; }
.skel-avatar {
    width:40px;
    height:40px;
    border-radius:50%;
    background:var(--color-well);
}

@keyframes shimmer {
    0%   { background-position:-200% 0; }
    100% { background-position:200% 0; }
}
.skel-card, .skel-line, .skel-avatar {
    background-image:linear-gradient(90deg, var(--color-well) 25%, var(--color-well) 50%, var(--color-well) 75%);
    background-size:200% 100%;
    animation:shimmer 1.4s ease-in-out infinite;
}
/* skel-line / skel-avatar 保留自身底色的同时叠加 shimmer（用 color 覆盖无效，改为用背景渐变统一） */

/* ---- 2. 列表加载（纯CSS，无需JS） ---- */
.list-loading {
    text-align:center;
    color:var(--text-weak);
    font-size:12px;
    padding:14px 0;
}
.list-loading::after {
    content:' ⏳';
    animation:spin 1s linear infinite;
    display:inline-block;
}

/* ---- 3. 按钮按压反馈（全局） ---- */
button:active:not(:disabled) {
    transform:scale(.96);
    transition:transform .12s ease;
}

/* ---- 4. 卡片按压 ---- */
.grab-card:active,
.svc-card2:active {
    transform:scale(.97);
}

/* ---- 5. Toast 滑入动画 ---- */
@keyframes toastIn {
    from {
        opacity:0;
        transform:translate(-50%, calc(-50% + 20px));
    }
    to {
        opacity:1;
        transform:translate(-50%, -50%);
    }
}
.toast.enter {
    animation:toastIn .25s ease-out both;
}

/* ---- 6. 脉冲点 ---- */
.pulse-dot {
    width:8px;
    height:8px;
    border-radius:50%;
    background:var(--color-success);
    position:relative;
}
.pulse-dot::after {
    content:'';
    position:absolute;
    inset:0;
    border-radius:50%;
    background:inherit;
    opacity:0;
}

@keyframes pulseRing {
    0%   { transform:scale(1);   opacity:.6; }
    100% { transform:scale(2.2); opacity:0; }
}

/* ---- 7. 进度条渐变 ---- */
.grad-bar {
    height:6px;
    border-radius:3px;
    background:var(--primary);
}

/* ---- 8. 选择师傅（演示）---- */
.wk-sort-btn { min-height:28px; padding:3px 10px; border-radius:var(--radius-sm); border:1px solid var(--color-well); background:var(--card); font-size:11px; color:var(--text-sub); cursor:pointer; transition: background-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out), border-color var(--dur-short) var(--ease-out), opacity var(--dur-short) var(--ease-out), transform var(--dur-short) var(--ease-out), box-shadow var(--dur-short) var(--ease-out); white-space:nowrap; }
.wk-sort-btn.on { background:var(--ss-earn); color:var(--color-on-field); border-color:var(--ss-earn); }
.wk-item { display:flex; align-items:center; padding:10px 0; border-bottom:1px solid var(--color-well); cursor:pointer; transition: background-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out), border-color var(--dur-short) var(--ease-out), opacity var(--dur-short) var(--ease-out), transform var(--dur-short) var(--ease-out), box-shadow var(--dur-short) var(--ease-out); border-radius:10px; padding:10px var(--space-xs); margin:var(--space-3xs) 0; }
.wk-item:last-child { border-bottom:none; }
.wk-item.selected { border:2px solid var(--color-earn); background:var(--tag-orange-bg); }
.wk-left { position:relative; margin-right:10px; flex-shrink:0; }
.wk-avatar { width:42px; height:42px; border-radius:50%; background:var(--color-well); display:flex; align-items:center; justify-content:center; font-size:22px; }
.wk-status { position:absolute; bottom:0; right:0; width:10px; height:10px; border-radius:50%; border:2px solid var(--card); }
.wk-status.online { background:var(--color-success); }
.wk-status.busy { background:var(--text-weak); }
.wk-info { flex:1; min-width:0; }
.wk-name { font-size:13.5px; font-weight:600; color:var(--text); }
.wk-star { font-size:11.5px; color:var(--color-warning); font-weight:400; }
.wk-meta { font-size:11px; color:var(--text-weak); margin-top:var(--space-3xs); }
.wk-tags { display:flex; gap:var(--space-2xs); margin-top:var(--space-2xs); flex-wrap:wrap; }
.wk-tag { font-size:10px; padding:1px 6px; border-radius:var(--radius-xs); background:var(--color-well); color:var(--primary); border:1px solid var(--color-accent-tint); }
.wk-check { font-size:18px; color:var(--color-earn); font-weight:700; margin-left:6px; flex-shrink:0; }


/* ===== 响应式适配 v6 ===== */

/* ---- 1. 安全区（safe-area-inset-bottom） ---- */
body { padding-bottom:env(safe-area-inset-bottom, 0px); }
.detail-bottom-bar { padding-bottom:calc(10px + env(safe-area-inset-bottom, 0px)); }

/* ---- 2. 小屏 ≤360px（iPhone SE） ---- */
@media (max-width:360px) {
    .cat-grid { gap:var(--space-xs) var(--space-2xs); }
    .btn-primary { font-size:14px; }
    .profile-stats { display:grid; grid-template-columns:repeat(2, 1fr); gap:0; }
    .profile-stats .ps-item { border-right:none; border-bottom:1px solid var(--color-well); }
    .profile-stats .ps-item:nth-last-child(-n+2) { border-bottom:none; }
    .wb-quick-btn { width:46px; height:46px; font-size:13px; }
}

/* ---- 3. 大屏 ≥420px ---- */
@media (min-width:420px) {
    .card { font-size:13.5px; }
    .btn-primary { height:48px; line-height:48px; }
}

/* ---- 4. 横屏提示 ---- */
@media (orientation:landscape) and (max-height: 400px) {
    html body::before {
        content:'建议竖屏使用';
        position:fixed;
        top:0;
        left:0;
        right:0;
        z-index:9999;
        background:var(--scrim-a70);
        color:var(--color-on-accent);
        font-size:12px;
        text-align:center;
        padding:6px 0;
        pointer-events:none;
    }
}

/* ---- 5. reduce-motion 兼容 ---- */
/* 已有 prefers-reduced-motion:reduce 使用 * 选择器，覆盖 shimmer / pulseRing / toastIn / starPop 等全部动画，
   无需额外追加。 */

/* ===== 动效增强 v7（弹窗弹性 / 按钮波纹 / 卡片悬浮 / 数字滚动 / 热力图 / 凭证卡） ===== */

/* ---- 1. Modal 弹入弹性 ---- */
@keyframes modalPop {
    0%   { transform:scale(.96); opacity:0; }
    70%  { transform:scale(1); opacity:1; }
    100% { transform:scale(1); opacity:1; }
}
/* 组合类 .modal-box.pop（0,2,0）优先级高于既有 .modal-box { animation:modalIn .25s ease }（0,1,0），
   且位于文件末尾，稳定覆盖为弹性弹入 */
.modal-box.pop { animation:modalPop .28s var(--ease-out); }

/* ---- 2. 按钮波纹 ripple ---- */
/* 用法：给按钮加 .btn-ripple；JS 点击时追加 .rippling 类触发波纹，0.5s 后移除；
   如需以点击位置为圆心，JS 可内联设置 ::after 无法直接改，改为内联 left/top 前请保留默认居中方案 */
.btn-ripple { position:relative; overflow:hidden; }
.btn-ripple::after {
    content:'';
    position:absolute;
    left:50%;
    top:50%;
    width:100%;
    padding-top:100%;
    margin:-50% 0 0 -50%;
    border-radius:50%;
    background:var(--scrim-a30);
    opacity:0;
    transform:scale(0);
    pointer-events:none;
}
@keyframes ripple {
    0%   { transform:scale(0);   opacity:.35; }
    100% { transform:scale(2.5); opacity:0; }
}
.btn-ripple.rippling::after { animation:ripple .5s ease-out; }

/* ---- 3. 卡片悬浮阴影（仅 hover 设备生效，避免触屏粘滞态） ---- */
@media (hover:hover) {
    .hover-lift { transition:transform .2s ease, box-shadow .2s ease; }
    .hover-lift:hover { transform:translateY(-3px); box-shadow:0 6px 16px var(--scrim-a10); }
}

/* ---- 4. 数字滚动容器（JS 平移内部数字列实现竖向滚动） ---- */
.num-roll { display:inline-block; overflow:hidden; height:1.2em; line-height:1.2em; }

/* ---- 5. 热力图格子（5档绿色，var(--color-success-bg) → var(--color-success)） ---- */
.heat-cell {
    display:inline-block;
    width:22px;
    height:22px;
    border-radius:4px;
    background:var(--color-well);
    transition:background .3s;
}
.heat-cell.h1 { background:var(--color-success-bg); }
.heat-cell.h2 { background:var(--color-success-bg); }
.heat-cell.h3 { background:var(--color-success); }
.heat-cell.h4 { background:var(--color-success); }
.heat-cell.h5 { background:var(--color-success); }

/* ---- 6. 凭证卡纹理（原文件无 .cred-card，新增） ---- */
.cred-card {
    color:var(--text);
    background:var(--tag-orange-bg);
    border:1px dashed var(--color-rule-strong);
    border-radius:12px;
}


/* ===== 性能优化 v9（R10-CSS10 提前执行）===== */
.swiper-track { will-change:transform; }
.pull-refresh { will-change:transform; }
.toast.enter { will-change:transform, opacity; }
.speedbar-hidden { display:none !important; }

/* ============ R17 全局动画体系 ============ */
/* ---- 页面切换过渡 ---- */
@keyframes pageFadeIn {
    from { opacity:0; transform:translateY(12px); }
    to { opacity:1; transform:translateY(0); }
}
@keyframes pageFadeOut {
    from { opacity:1; transform:translateY(0); }
    to { opacity:0; transform:translateY(-12px); }
}
.page-enter { animation:pageFadeIn .28s ease-out both; }
.page-exit { animation:pageFadeOut .2s ease-in both; }

/* ---- Toast 滑入 ---- */
@keyframes toastSlideIn {
    from { opacity:0; transform:translate(-50%, -50%) translateY(20px); }
    to { opacity:1; transform:translate(-50%, -50%) translateY(0); }
}
.toast { animation:toastSlideIn .25s ease-out; }

/* ---- Modal 弹入 ---- */
@keyframes modalMaskIn { from { opacity:0; } to { opacity:1; } }
@keyframes modalBoxIn {
    from { opacity:0; transform:scale(.9); }
    to { opacity:1; transform:scale(1); }
}
.modal-mask { animation:modalMaskIn .2s ease-out; }
.modal-box { animation:modalBoxIn .28s var(--ease-out); }

/* ---- 按钮涟漪 ---- */
.btn-ripple { position:relative; overflow:hidden; }
.btn-ripple .ripple-circle {
    position:absolute; border-radius:50%;
    background:var(--veil-a35);
    transform:scale(0); animation:rippleExpand .5s ease-out forwards;
    pointer-events:none;
}
@keyframes rippleExpand {
    to { transform:scale(4); opacity:0; }
}

/* ---- 卡片按压 ---- */
.card, .svc-card2, .cat-list-item, .cat-item2 {
    transition:transform .15s ease, box-shadow .15s ease;
    -webkit-tap-highlight-color:transparent;
}
.card:active, .svc-card2:active, .cat-list-item:active, .cat-item2:active {
    transform:scale(.97);
    box-shadow:0 1px 2px var(--scrim-a10);
}

/* ---- Tab 滑动指示条 ---- */
.tab-bar { position:relative; }
.tab-indicator {
    position:absolute; bottom:0; height:3px;
    background:var(--primary);
    border-radius:3px; transition:transform var(--dur-short) var(--ease-in-out);
}

/* ---- 列表项交错入场 ---- */
@keyframes staggerFadeIn {
    from { opacity:0; transform:translateY(16px); }
    to { opacity:1; transform:translateY(0); }
}
.stagger-in { animation:staggerFadeIn .35s ease-out both; }

/* ---- 骨架屏通用 shimmer ---- */
@keyframes shimmerSlide {
    from { background-position:-300px 0; }
    to { background-position:300px 0; }
}
.skel-shimmer {
    background:linear-gradient(90deg, var(--color-well) 25%, var(--color-well) 50%, var(--color-well) 75%);
    background-size:600px 100%; animation:shimmerSlide 1.5s infinite linear;
    border-radius:8px;
}

/* ---- 空态浮动 ---- */
.empty-icon {  }

/* ---- AI FAB 呼吸光环 ---- */
.ai-fab {  }



/* ---- 3. 兼容层：核心容器用更高特异性覆盖 ---- */
body.dark .card { background:var(--card); color:var(--text); }
body.dark .page { background:var(--bg); color:var(--text); }
body.dark .f-label { color:var(--text-sub); }
body.dark .f-value { color:var(--text); }
body.dark .empty-text { color:var(--text-weak); }
body.dark .price-note { color:var(--text-weak); }
body.dark .profile-group { background:var(--card); color:var(--text); }
body.dark .profile-stats { background:var(--card); color:var(--text); }
body.dark .page-header { background:var(--page-header-bg); color:var(--text); border-color:var(--page-header-border); }
body.dark .tab-bar { background:var(--tab-bar-bg); color:var(--text); border-color:var(--tab-bar-border); }
body.dark .modal-box { background:var(--modal-bg); color:var(--text); }
body.dark .modal-mask { background:var(--modal-mask); color:var(--text); }
body.dark .form-item { border-color:var(--form-border); }
body.dark .pg-item { border-color:var(--form-border); }
body.dark .pg-text { color:var(--text); }
body.dark .ps-num { color:var(--text); }
body.dark .ps-lbl { color:var(--text-weak); }
body.dark .order-card { background:var(--card); color:var(--text); }
body.dark .oc-name { color:var(--text); }
body.dark .oc-time { color:var(--text-weak); }
body.dark .oc-no { color:var(--text-weak); }
body.dark .f-tab { color:var(--text-sub); }
body.dark .f-tab.active { color:var(--primary); }
body.dark .search-box { background:var(--card); color:var(--text-weak); }
body.dark .addr-entry { background:var(--card); color:var(--text); }
body.dark .addr-entry .txt { color:var(--text); }
body.dark .cat-grid { background:var(--card); color:var(--text); }
body.dark .cat-list-item { background:var(--card); color:var(--text); }
body.dark .cat-list-item .cli-name { color:var(--text); }
body.dark .cat-list-item .cli-desc { color:var(--text-weak); }
body.dark .cat-item2 .ci-name { color:var(--text); }
body.dark .svc-card2 { background:var(--card); color:var(--text); }
body.dark .svc-card2 .sc-name { color:var(--text); }
body.dark .promise-row { background:var(--card); color:var(--text); }
body.dark .promise-item { color:var(--text-sub); }
body.dark .input-row { background:var(--card); color:var(--text); }
body.dark .ads-stat { background:var(--card); color:var(--text); }
body.dark .ads-stat .num { color:var(--text); }
body.dark .ad-type-card { background:var(--card); color:var(--text); }
body.dark .rank-row { background:var(--card); color:var(--text); }
body.dark .rank-row .rk-name { color:var(--text); }
body.dark .wb-stat { background:var(--card); color:var(--text); }
body.dark .grab-card { background:var(--card); color:var(--text); }
body.dark .msg-item { background:var(--card); color:var(--text); }
body.dark .msg-item .mi-title { color:var(--text); }
body.dark .msg-item .mi-sub { color:var(--text-weak); }
body.dark .tag.blue { background:var(--tag-bg); color:var(--tag-text); }
body.dark .tag.orange { background:var(--tag-orange-bg); color:var(--tag-orange-text); }
body.dark .tag.green { background:var(--tag-green-bg); color:var(--tag-green-text); }
body.dark .tag.gray { background:var(--tag-gray-bg); color:var(--tag-gray-text); }
body.dark .tag.red { background:var(--tag-red-bg); color:var(--tag-red-text); }
body.dark .skel-line,
body.dark .skel-avatar { background:var(--skeleton); color:var(--text); }
body.dark .detail-body { background:var(--card); color:var(--text); }
body.dark .detail-name { color:var(--text); }
body.dark .detail-footer { background:var(--card); border-color:var(--border); color:var(--text); }
body.dark .ai-input-bar { background:var(--card); border-color:var(--border); color:var(--text); }
body.dark .msg.ai .m-bubble,
body.dark .msg:not(.user) .m-bubble { background:var(--card); color:var(--text); }
body.dark .login-page h1 { color:var(--text); }
body.dark .demo-box { background:var(--input-bg); color:var(--text); }
body.dark .search-drop { background:var(--card); color:var(--text); }
body.dark .sd-item { color:var(--text); border-color:var(--form-border); }
body.dark .success-title { color:var(--text); }
body.dark .info-card { background:var(--card); color:var(--text); }
body.dark .q-box { background:var(--input-bg); color:var(--text); }
body.dark .q-title { color:var(--text); }
body.dark .q-sub { color:var(--text-weak); }
body.dark .g-item { background:var(--input-bg); color:var(--text-sub); }
body.dark .detail-top { background:var(--ss-brand); color:var(--color-on-field); }
body.dark .profile-head { background:var(--ss-brand); color:var(--color-on-field); }
body.dark .home-banner,
body.dark .ss-brand { background:var(--ss-brand); color:var(--color-on-field); }
body.dark .ads-hero { background:var(--ss-earn); color:var(--color-on-field); }
body.dark .wb-head { background:var(--ss-earn); color:var(--color-on-field); }
body.dark .ai-head { background:var(--ss-brand); color:var(--color-on-field); }
body.dark .toast { background:var(--scrim-a90); color:var(--text); }
body.dark .anchor-bar { background:var(--panel-scrim); color:var(--text); }
body.dark .an-item { background:var(--input-bg); color:var(--primary); }
body.dark .an-item.on { background:var(--primary); color:var(--color-on-accent); }
body.dark .status-bar { background:var(--card); color:var(--text); }
body.dark .phone-frame { background:var(--bg); color:var(--text); }
body.dark .app-container { background:var(--bg); color:var(--text); }
body.dark input[type=text],
body.dark input[type=tel],
body.dark select,
body.dark textarea {
    background:var(--input-bg);
    border-color:var(--input-border);
    color:var(--text);
}
body.dark input:focus,
body.dark select:focus,
body.dark textarea:focus {
    background:var(--card); color:var(--text); }
body.dark .tag-pick .tp { background:var(--input-bg); color:var(--text-sub); }
body.dark .tag-pick .tp.on { background:var(--tag-orange-bg); color:var(--tag-orange-text); }
body.dark .wk-item { border-color:var(--form-border); }
body.dark .wk-item.selected { border-color:var(--price); background:var(--tag-orange-bg); color:var(--text); }
body.dark .wk-name { color:var(--text); }
body.dark .wk-meta { color:var(--text-weak); }
body.dark .wk-tag { background:var(--tag-bg); color:var(--tag-text); border-color:var(--border); }
body.dark .fd-row { color:var(--text-sub); }
body.dark .fd-row.total { color:var(--price); border-color:var(--border); }
body.dark .fee-detail { background:var(--input-bg); color:var(--text); }
body.dark .pull-refresh { background:var(--panel-scrim); color:var(--text); }
body.dark .hist-row { color:var(--text-sub); border-color:var(--form-border); }
body.dark .ai-disclaimer { background:var(--tag-orange-bg); color:var(--tag-orange-text); border-color:var(--border); }
body.dark .ai-quick-bar .qk { background:var(--input-bg); color:var(--primary); }
body.dark .ai-report-card { background:var(--card); border-color:var(--border); color:var(--text); }
body.dark .ai-report-card h5 { color:var(--primary); }
body.dark .ai-report-card .r-row { color:var(--text-sub); }
body.dark .ai-report-card .r-row b { color:var(--text); }
body.dark .sg-chip { background:var(--card); border-color:var(--border); color:var(--primary); }
body.dark .rs-card { background:var(--card); color:var(--text); }
body.dark .rs-info h3 { color:var(--text); }
body.dark .rs-info p { color:var(--text-weak); }
body.dark .mode-switch { background:var(--input-bg); color:var(--text); }
body.dark .mode-switch .ms-item { color:var(--text-sub); }
body.dark .mode-switch .ms-item.active { background:var(--card); color:var(--primary); }
body.dark .btn-secondary { background:var(--card); border-color:var(--primary); color:var(--primary); }
body.dark .btn-danger { background:var(--card); border-color:var(--color-danger); color:var(--color-danger); }
body.dark .btn-small { background:var(--input-bg); color:var(--primary); }
body.dark .upload-box { background:var(--input-bg); border-color:var(--border); color:var(--text-weak); }
body.dark .modal-head { color:var(--text); }
body.dark .modal-body { color:var(--text-sub); }
body.dark .modal-foot { border-color:var(--border); }
body.dark .warranty-box { background:var(--tag-green-bg); border-color:var(--tag-green-text); color:var(--tag-green-text); }
body.dark .cred-card { background:var(--color-warning-bg); border-color:var(--border); color:var(--text); }
body.dark .wk-sort-btn { background:var(--card); border-color:var(--border); color:var(--text-sub); }
body.dark .wk-sort-btn.on { background:var(--price); color:var(--color-on-accent); border-color:var(--price); }

/* ---- 4. 过渡 ---- */
body { transition:background .3s; }
.card { transition:background .3s, color .3s; }
.page { transition:background .3s, color .3s; }
.profile-group { transition:background .3s; }
.page-header { transition:background .3s, border-color .3s; }
.tab-bar { transition:background .3s, border-color .3s; }

/* ===== R11: 新组件深色模式补齐 ===== */
body.dark .skel-card { background:var(--card); color:var(--text); }
body.dark .skel-line, body.dark .skel-avatar { animation:shimmer 1.4s infinite linear; background:var(--text); color:var(--text); }
body.dark .heat-cell { background:var(--border); color:var(--text); }
body.dark .heat-cell.h1 { background:var(--color-success-bg); color:var(--text); }
body.dark .heat-cell.h2 { background:color-mix(in srgb, var(--color-success) 22%, var(--card)); color:var(--text); }
body.dark .heat-cell.h3 { background:color-mix(in srgb, var(--color-success) 40%, var(--card)); color:var(--text); }
body.dark .heat-cell.h4 { background:var(--color-success); color:var(--color-on-accent); }
body.dark .heat-cell.h5 { background:var(--color-success); color:var(--color-on-accent); }
body.dark .ad-type-card { background:var(--card); color:var(--text); }
body.dark .grab-card { background:var(--card); color:var(--text); }
body.dark .income-card { background:var(--card); color:var(--text); }
body.dark .msg-item { background:var(--card); color:var(--text); }
body.dark .wb-quick-btn { background:var(--border); color:var(--text); }
body.dark .detail-bottom-bar { background:var(--border); box-shadow:0 -2px 10px var(--scrim-a60); color:var(--text); }

/* ============ R24 性能优化 ============ */
/* ---- 1. will-change 优化 ---- */
.cat-item2, .svc-card2, .cat-list-item, .card,
.tab-item, .btn-primary, .btn-secondary, .btn-danger,
.ai-fab, .modal-box, .toast, .order-card, .grab-card,
.wb-quick-btn, .qt-item, .rank-row, .msg-item {
    will-change:transform;
}
/* 移动端不加 will-change（耗电+内存） */
@media (hover:none) {
    .cat-item2, .svc-card2, .cat-list-item, .card,
    .tab-item, .btn-primary, .btn-secondary, .btn-danger,
    .ai-fab { will-change:auto; }
}

/* ---- 2. transform GPU 加速 ---- */
.svc-scroll, .pull-refresh, .toast, .modal-mask,
.ai-fab, .tab-indicator, .home-banner,
.detail-banner { transform:translateZ(0); }

/* ---- 3. 懒加载占位 ---- */
.lazy-placeholder {
    background:var(--color-well);
    min-height:80px;
    border-radius:8px;
}
body.dark .lazy-placeholder { background:var(--border); color:var(--text); }

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

/* ---- 5. 字体渲染优化 ---- */
body {
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    text-rendering:optimizeLegibility;
}




/* ---- 4. 统一字号阶梯 ---- */
.sm-text-xs { font-size:11px; }
.sm-text-sm { font-size:12px; }
.sm-text-base { font-size:13px; }
.sm-text-md { font-size:14px; }
.sm-text-lg { font-size:15px; }
.sm-text-xl { font-size:16px; }
.sm-text-2xl { font-size:19px; }
.sm-text-3xl { font-size:26px; }


/* ---- 6. 删除冗余规则的兼容注释 ---- */
/* 以下规则用于替代散落的 box-shadow/margin/padding 硬编码，
   后续重构时可批量替换为 var(--shadow-*)/var(--gap-*) */

/* ---- 7. 骨架屏通用 shimmer 已有定义，补充 shimmer 动画兼容 ---- */
.skel-shimmer { animation:shimmerSlide 1.5s infinite linear; }

/* ---- 8. 空态插图统一 ---- */
.empty-state .empty-text {
    color:var(--text-weak);
    font-size:14px;
    margin-top:var(--space-xs);
}

/* ---- 9. 无障碍 - 焦点轮廓 ---- */
.btn-primary:focus-visible,
.btn-secondary:focus-visible,
.btn-danger:focus-visible,
.btn-small:focus-visible,
.btn-mini:focus-visible,
.tab-item:focus-visible,
.f-tab:focus-visible,
.pg-item:focus-visible,
.oc-actions button:focus-visible,
.tab-item [role=tab]:focus-visible {
    outline:2px solid var(--color-focus);
    outline-offset:2px;
}

/* ============ R48 深色模式补齐（新组件适配） ============ */
body.dark .withdraw-ch { background:var(--input-bg); border-color:var(--border); color:var(--text); }
body.dark .withdraw-ch.active { background:var(--tag-bg); border-color:var(--primary); color:var(--tag-text); }
body.dark .complaint-btn { background:var(--input-bg); border-color:var(--color-danger); color:var(--color-danger); }
body.dark .refund-btn { background:var(--color-warning-bg); border-color:var(--color-warning); color:var(--color-warning); }
body.dark .warranty-claim-btn { background:var(--color-success-bg); border-color:var(--color-success); color:var(--color-success); }
body.dark .worker-review-user-btn { background:var(--input-bg); border-color:var(--primary); color:var(--primary); }
body.dark .preset-msg { background:var(--input-bg); border-color:var(--border); color:var(--text); }
body.dark #signCanvas { background:var(--color-well); color:var(--text); }
body.dark .upload-box { background:var(--input-bg); border-color:var(--border); color:var(--text-weak); }
body.dark .q-opt { background:var(--card); border-color:var(--border); color:var(--text); }
body.dark .q-opt:active { background:var(--input-bg); color:var(--text); }
body.dark .wr-tag { background:var(--input-bg); border-color:var(--border); color:var(--text-sub); }
body.dark .reward-claim-btn { background:var(--tag-orange-bg); color:var(--tag-orange-text); }
body.dark .invite-box { background:var(--card); color:var(--text); }
body.dark .about-version { color:var(--text-weak); }
body.dark .invite-card { background:var(--card); border-color:var(--border); color:var(--text); }
body.dark .warranty-box { background:var(--tag-green-bg); color:var(--text); }
body.dark .skill-tag { background:var(--input-bg); color:var(--text-sub); }
body.dark .wk-item { background:var(--card); border-color:var(--border); color:var(--text); }
body.dark .referral-card { background:var(--input-bg); color:var(--text); }
body.dark .vacation-card { background:var(--input-bg); border-color:var(--border); color:var(--text); }

/* ============ R57 Toast定位修复 ============ */
/* Toast 从屏幕中央移到底部（避开操作区与TabBar） */
.toast { top:auto; bottom:120px; transform:translateX(-50%); }
@keyframes toastSlideInBottom {
    from { opacity:0; transform:translateX(-50%) translateY(20px); }
    to { opacity:1; transform:translateX(-50%) translateY(0); }
}
.toast { animation:toastSlideInBottom .25s ease-out; }

/* ============ R83 深色模式·新组件补齐 ============ */
body.dark .pkg-card { background:var(--card); color:var(--text); border-color:var(--border); }
body.dark .pkg-card .pkg-name, body.dark .pkg-card div[style*="font-weight:700"] { color:var(--text); }
body.dark #leakLevel, body.dark #leakLevel option { background:var(--input-bg); color:var(--text); }
body.dark .invoice-card, body.dark .iv-card { background:var(--card); color:var(--text); }
body.dark .export-income-csv, body.dark .export-income-btn { background:var(--card); border-color:var(--primary); color:var(--primary); }
body.dark .cat-side-nav span { background:var(--text-sub); color:var(--color-on-accent); }
body.dark .chart-tip { background:var(--scrim-a90); color:var(--text); }
body.dark .refund-btn { background:var(--color-warning-bg); color:var(--text); }
body.dark .cs-chips { background:var(--input-bg); border-color:var(--primary); color:var(--primary); }
body.dark .invite-box .iv-head { background:var(--ss-brand); color:var(--color-on-field); }
body.dark .skill-tag.on { background:var(--tag-bg); color:var(--tag-text); border-color:var(--primary); }
body.dark .q-opt { color:var(--text); }
body.dark .preset-msg { background:var(--input-bg); border-color:var(--border); color:var(--text); }

/* ============ R110 深色模式·最终补齐 ============ */
body.dark .order-msg-display, body.dark .o-msg { background:var(--card); color:var(--text); border-color:var(--border); }
body.dark #pkgSelectRow { background:var(--card); color:var(--text); }
body.dark .pkg-opt { background:var(--card); border-color:var(--border); color:var(--text); }
body.dark .pkg-opt.on, body.dark .pkg-opt[style*="fa8c16"] { border-color:var(--primary); background:var(--input-bg); color:var(--text); }
body.dark .leak-dot { background:var(--input-bg) !important; color:var(--text); }
body.dark .leak-dot[data-lv] { opacity:0.3; }
body.dark #leakLevelTip { color:var(--text-sub) !important; }
body.dark .order-msg, body.dark #orderMsg { background:var(--input-bg); color:var(--text); border-color:var(--input-border); }
body.dark .hist-row { background:var(--card); color:var(--text); border-color:var(--border); }
body.dark .cs-chips-bar { background:var(--card); color:var(--text); }
body.dark .cs-chips { background:var(--input-bg); border-color:var(--primary); color:var(--primary); }
body.dark .review-user-btn, body.dark .worker-review-user-btn { background:var(--input-bg); border-color:var(--primary); color:var(--primary); }
body.dark .wr-tag { background:var(--input-bg); border-color:var(--border); color:var(--text-sub); }
body.dark .reward-progress, body.dark .reward-bar { background:var(--input-bg); color:var(--text); }
body.dark .reward-claim-btn { background:var(--tag-orange-bg); color:var(--tag-orange-text); }
body.dark .ads-stat .num { color:var(--text); }
body.dark .toggle-state { color:var(--text-weak); }
body.dark .ai-hist-card { background:var(--card); color:var(--text); }
body.dark .sg-chip { border-color:var(--primary); color:var(--primary); }
body.dark #aiCtxBadge { color:var(--tag-text); }
body.dark .empty-state .empty-icon { animation:none; }
body.dark .tl-node { background:var(--input-bg); color:var(--text); }
body.dark .tl-line { background:linear-gradient(180deg, var(--border), transparent) !important; }
body.dark .daily-trend { color:var(--text-sub); }
body.dark .ai-msg { background:var(--card); color:var(--text); }

/* ============ 深色模式·最终补齐 R134 ============ */
/* worker.js:在线开关组件 */
body.dark .online-switch { color:var(--veil-a90); }
body.dark .os-track { background:var(--veil-a20); color:var(--text); }
body.dark .os-track.on { background:var(--color-success); color:var(--color-on-accent); }

/* worker.js:年份按钮 (R133) */
body.dark .yr-btn { border-color:var(--border) !important; background:var(--input-bg) !important; color:var(--text-sub) !important; }
body.dark .yr-btn.on { border-color:var(--primary) !important; background:var(--tag-bg) !important; color:var(--tag-text) !important; }

/* worker.js:待办容器 & 直达按钮 (R129) */
body.dark #todoCard { background:var(--card); color:var(--text); box-shadow:0 1px 4px var(--scrim-a30); }
body.dark .todo-goto { background:var(--input-bg); color:var(--primary); }

/* home.js / worker.js:常用地址等 home-section 内联白色背景 */
body.dark .home-section { background:var(--card) !important; color:var(--text); }
body.dark .home-section .hs-head h3 { color:var(--text); }
body.dark .home-section .hs-head .more { color:var(--text-weak); }

/* order.js:支付通道 (R123) */
body.dark .pay-channel { background:var(--input-bg) !important; border-color:var(--border) !important; color:var(--text); }
body.dark .pay-channel[data-channel="wechat"] { border-color:var(--primary) !important; background:var(--input-bg) !important; color:var(--text); }

/* home.js:家人健康卡片 */
body.dark .family-row { background:var(--input-bg) !important; color:var(--text); }

/* home.js:限时特惠卡片 */
body.dark .promo-claim-card { background:var(--card); color:var(--text); }

/* home.js:注意提示 */
body.dark .note-tips { background:color-mix(in srgb, var(--color-danger) 8%, transparent) !important; color:var(--color-danger) !important; }

/* home.js:装修套餐卡片 */
body.dark .pkg-card { background:var(--card) !important; border-color:var(--border) !important; }

/* home.js:首页轮播 */
body.dark .ss-ads { background:var(--ss-earn); color:var(--color-on-field); }
body.dark .ss-warranty { background:var(--ss-warranty); color:var(--text); }
body.dark .sw-dot { background:var(--veil-a20); color:var(--text); }
body.dark .sw-dot.on { background:var(--veil-a90); color:var(--text); }

/* worker.js:偏好设置弹窗内联白底覆盖 */
body.dark #prefOverlay > div { background:var(--card) !important; color:var(--text) !important; }
body.dark #prefOverlay > div label { background:var(--input-bg) !important; border-color:var(--border) !important; color:var(--text) !important; }

/* ===== 建材商户模块 ===== */
.mall-pill{font-size:12px;min-height:30px;padding:5px 13px;border-radius:var(--radius-round);background:var(--card);border:1px solid var(--border);color:var(--text-sub);cursor:pointer;transition: background-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out), border-color var(--dur-short) var(--ease-out), opacity var(--dur-short) var(--ease-out), transform var(--dur-short) var(--ease-out), box-shadow var(--dur-short) var(--ease-out)}
.mall-pill.on{background:var(--primary);border-color:var(--primary);color:var(--color-on-accent);font-weight:600}
.mall-tag{display:inline-block;font-size:9.5px;color:var(--color-accent-deep);background:var(--color-accent-tint);border-radius:var(--radius-xs);padding:1px 6px;margin-right:var(--space-3xs);vertical-align:1px}
.mall-tag.rec{color:var(--color-accent-deep);background:var(--color-accent-tint)}
.mall-tag.ok{color:var(--color-success);background:var(--color-success-bg)}
.mall-note{margin:10px var(--space-sm);font-size:10.5px;color:var(--text-weak);line-height:1.8;background:var(--color-well);border-radius:var(--radius-md);padding:10px var(--space-sm)}
.mall-sec{background:var(--card);border-radius:var(--radius-lg);padding:14px;margin:10px var(--space-sm)}
.mall-sec h3{font-size:14px;font-weight:700;margin-bottom:var(--space-xs)}
.rs-icon.merchant{background:var(--color-success-bg)}

/* ---- R168 去AI化：Lucide 图标与缮青品牌色 ---- */
svg.ic { vertical-align:-0.18em; flex:none; }
.tab-item .tab-icon .ic, .tab-icon svg.ic { width:22px; height:22px; }
.tab-item .tab-icon { display:flex; align-items:center; justify-content:center; }
.cat-icon .ic, .category-icon .ic { width:24px; height:24px; }
.page-header .back-btn .ic { width:21px; height:21px; }

/* R202 Hallmark：商城角标停用无限脉冲（craft 5） */
.mall-msg-badge { animation:none !important; }

/* R202 Hallmark：标题换行平衡 + 数字表格对齐 */
.home-banner h1, .swiper-slide h1, .role-page h1, .login-page h1, .detail-name, .page-title { text-wrap: balance; }
.adp-count, .num, .ps-num, .ads-stat .num, .wb-stat .num, .income-card .num, .oc-price, .price-big, .ah-bal, .rank-row .rk-earn, .rk-no { font-variant-numeric: tabular-nums; }

.ad-play-mask .adp-count { font-variant-numeric: tabular-nums; }

/* R202 Hallmark 终审修复：六段工单时间线（签名对象）静默化——统一品牌节点，弃彩虹内联与过冲/脉冲/光晕 */
.tl-icon { background: var(--color-accent-tint) !important; border-color: var(--color-accent-mid) !important; box-shadow: none !important; animation: none !important; }
.tl-wrap[style*="#faad14"] { border-left: 1px solid var(--color-accent) !important; background: var(--color-accent-tint) !important; }
.tl-line { background: var(--border) !important; }

/* R202 终审R2：order.js 注入动画三处静默（stage-node 脉冲 / 状态微点光晕 / 「最新」chip 内联琥珀） */
.stage-node.now .dot { animation: none !important; box-shadow: none !important; }
.tl-icon > div[style*="box-shadow:0 0 3px"] { box-shadow: none !important; }
.tl-body span[style*="#faad14"] { background: var(--color-accent) !important; }
.status-badge .badge-dot { animation: none !important; }