/* Layout additions only. Mobile typography/tokens/components come from lvju-app.css;
   desktop geometry follows screens/p-jz-product.html. No global theme changes. */
.commerce-page .scr{padding-bottom:24px}
.commerce-content{padding:16px;display:grid;gap:14px;align-content:start}
.commerce-content h2{font-family:var(--serif);font-size:21px;margin:0 0 8px}
.commerce-content h3{font-size:15px;margin:0 0 8px}
.commerce-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px;min-width:0;overflow-wrap:anywhere}
.commerce-card p{font-size:13px;line-height:1.7;margin:8px 0;color:var(--muted)}
.commerce-card .money{font:700 28px var(--serif);color:var(--gold-deep)}
.commerce-hero{background:linear-gradient(135deg,var(--brand),var(--brand-deep));color:white;border:0;padding:24px 20px}
.commerce-hero p{color:rgba(255,255,255,.85)}
.commerce-hero .eyebrow{letter-spacing:.14em;font-size:10px;margin-bottom:12px}
.commerce-hero h2{font-size:25px;line-height:1.4}
.commerce-note{padding:9px 14px;background:var(--gold-soft);font-size:11px;line-height:1.6;color:var(--gold-deep)}
.commerce-toolbar{padding:10px 14px;background:var(--surface);display:flex;gap:8px;align-items:center;flex-wrap:wrap;border-bottom:1px solid var(--border)}
.commerce-toolbar label{font-size:11px;color:var(--muted)}
.commerce-toolbar select{max-width:100%;min-width:0}
.commerce-tabs{display:flex;gap:7px;padding:12px 14px;background:var(--surface);flex-wrap:wrap;border-bottom:1px solid var(--border)}
.commerce-tabs button,.commerce-tabs a{padding:7px 12px;border-radius:999px;border:1px solid var(--border);background:white;font:12px var(--font);color:var(--muted);cursor:pointer}
.commerce-tabs .on{background:var(--brand-soft);color:var(--brand);border-color:var(--brand)}
.commerce-page button,.commerce-page input,.commerce-page select,.commerce-page textarea{font:inherit}
.commerce-page button{cursor:pointer}
.commerce-page button:disabled{opacity:.45;cursor:not-allowed}
.commerce-page input:not([type=checkbox]),.commerce-page select,.commerce-page textarea{padding:9px;border:1px solid var(--border);border-radius:8px;background:white;max-width:100%;color:var(--fg)}
.commerce-page input:not([type=checkbox]),.commerce-page textarea{width:100%}
.commerce-page .field{display:grid;gap:6px;margin:12px 0;font-size:12px;color:var(--muted)}
.commerce-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;align-items:center}
.commerce-actions .btn{border:1px solid var(--border);border-radius:8px;padding:9px 13px;background:white;color:var(--brand);font:13px var(--font);display:inline-block;text-align:center}
.commerce-actions .btn.pri{background:var(--brand);border-color:var(--brand);color:white}
.commerce-badge{display:inline-block;font-size:10px;padding:3px 8px;border-radius:999px;background:var(--brand-soft);color:var(--brand);margin:0 6px 6px 0}
.commerce-list{list-style:none;margin:0;padding:0}
.commerce-list li{padding:12px 0;border-bottom:1px solid var(--border);font-size:13px;line-height:1.6}
.commerce-list li:last-child{border:0}
.commerce-list small{display:block;color:var(--muted);font-size:11px}
.commerce-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.commerce-kpi{padding:13px;background:#f5f7f6;border-radius:9px;min-width:0}
.commerce-kpi b{font-size:20px;display:block;overflow-wrap:anywhere}
.commerce-kpi span{font-size:11px;color:var(--muted)}
.commerce-empty{text-align:center;padding:36px 18px}
.commerce-empty h3{font-family:var(--serif);font-size:20px}
#commerce-status{margin:0 14px;font-size:12px;line-height:1.7;overflow-wrap:anywhere}
#commerce-status:not(:empty){padding:10px;border:1px solid var(--border);border-radius:8px;background:var(--surface)}
#commerce-status.error{color:#b91c1c;border-color:#fecaca}
.commerce-code{font-family:monospace;font-size:13px;overflow-wrap:anywhere;user-select:all;padding:12px;background:#f5f7f6;border:1px dashed var(--brand);border-radius:8px}
.commerce-page .detail-row{display:flex;justify-content:space-between;gap:12px;margin:8px 0;font-size:12px}
.commerce-page .detail-row span{color:var(--muted)}
.commerce-page .receipt{padding-top:12px;border-top:1px dashed var(--border);margin-top:12px}
.commerce-desktop{display:block;background:#f8fafc;min-height:100vh;color:var(--fg)}
.commerce-desktop .console{display:grid;grid-template-columns:240px minmax(0,1fr);min-height:100vh}
.commerce-desktop .main{min-width:0}
.commerce-desktop .appbar{position:static}
.commerce-desktop .commerce-content{padding:20px 24px;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
.commerce-desktop .commerce-content>.wide{grid-column:1/-1}
.commerce-desktop .commerce-content h2{font:700 20px var(--font)}
.commerce-desktop .commerce-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.commerce-desktop .commerce-card{padding:16px 18px}
/* 工作台导航去重：≥1024px 共享侧栏在场，页面内模块 chips 隐藏；≤1023px 侧栏隐藏（_nav.js），chips 作为唯一导航。 */
@media(min-width:1024px){.commerce-desktop .commerce-tabs{display:none}}
/* 登录后身份与退出在侧栏用户盒，account-bar 仅匿名登录入口；模块名由面板承担，顶栏只留空间名。 */
.commerce-desktop .account-bar.is-auth{display:none}
.commerce-desktop .management-panel .eyebrow{display:none}
/* 侧栏密度（仅权益工作台作用域，不动全站 _nav.js 样式） */
.commerce-desktop .nv-side .nv-group{padding:11px 18px 4px;font-size:10px;letter-spacing:1px}
.commerce-desktop .nv-side .nv-link{padding:7px 16px;font-size:12.5px}
.commerce-desktop .nv-side .nv-link svg{width:15px;height:15px}
.commerce-desktop .nv-side .nv-link.active{font-weight:600}
@media(max-width:1023px){.commerce-desktop .console{grid-template-columns:minmax(0,1fr)}.commerce-desktop #side-nav,.commerce-desktop .nv-side{display:none}.commerce-desktop .commerce-content{padding:14px;grid-template-columns:minmax(0,1fr)}.commerce-desktop .commerce-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.commerce-desktop .commerce-tabs{position:sticky;top:0;z-index:5;flex-wrap:nowrap;overflow:auto;white-space:nowrap;box-shadow:0 6px 14px -10px #00000038}.commerce-desktop .commerce-tabs a,.commerce-desktop .commerce-tabs button{flex-shrink:0}}
/* M1-A: reuse the existing site palette and card/navigation system. */
.commerce-page{font-size:14px}.commerce-page *{box-sizing:border-box}.commerce-page [hidden]{display:none!important}.commerce-page .btn{display:inline-flex;justify-content:center;align-items:center;gap:6px;border:1px solid var(--border);border-radius:8px;padding:9px 13px;background:white;color:var(--brand);font-size:13px;text-decoration:none}.commerce-page .btn.pri{background:var(--brand);color:white;border-color:var(--brand)}.commerce-page button:focus-visible,.commerce-page a:focus-visible{outline:3px solid #d6ab67;outline-offset:3px}.account-bar{display:flex;align-items:center;gap:12px;padding:12px 16px;background:white;border-bottom:1px solid var(--border);font-size:12px}.account-bar span{flex:1;color:var(--muted)}.empty-mark{font-size:36px;color:var(--brand);margin:0 0 14px}.panel-heading{display:flex;justify-content:space-between;gap:20px;align-items:start}.eyebrow{display:block;letter-spacing:.12em;font-size:10px;color:var(--muted);margin-bottom:10px}.commerce-hero .eyebrow{color:#d8eee8}.management-filter{display:flex;align-items:end;gap:12px;flex-wrap:wrap;padding:16px 0;border-top:1px solid var(--border);margin-top:18px}.management-filter label{display:grid;gap:6px;font-size:12px;color:var(--muted)}.commerce-table-wrap{overflow:auto;width:100%;border:1px solid var(--border);border-radius:9px}.commerce-table-wrap table{width:100%;border-collapse:collapse;text-align:left;font-size:12.5px;min-width:650px}.commerce-table-wrap th{background:#f5f7f7;font-weight:500;color:var(--muted)}.commerce-table-wrap td,.commerce-table-wrap th{padding:13px 12px;border-bottom:1px solid var(--border);max-width:240px;overflow-wrap:anywhere}.commerce-table-wrap tbody tr:hover{background:#f8fbfa}.row-actions{display:flex;gap:6px;flex-wrap:wrap;min-width:130px}.row-actions .btn{font-size:12px;padding:6px 9px}.pagination{display:flex;justify-content:flex-end;align-items:center;gap:10px;padding-top:16px;font-size:12px;color:var(--muted)}.pagination span{margin-right:auto}.state-submitted,.state-awaiting_provider{background:#fff4df;color:#895f20}.state-rejected,.state-frozen{background:#fff0ed;color:#ad4438}.state-archived,.state-expired{background:#f1f3f5;color:#64748b}.commerce-dialog{border:1px solid var(--border);border-radius:16px;width:min(640px,calc(100vw - 28px));max-height:90dvh;padding:0;color:var(--fg);box-shadow:0 20px 90px #0003}.commerce-dialog::backdrop{background:#102b2870}
.commerce-dialog form{display:flex;flex-direction:column;max-height:90dvh}
.commerce-dialog header,.commerce-dialog footer{display:flex;align-items:center;justify-content:space-between;padding:15px 20px;border-bottom:1px solid var(--border);gap:12px;flex-shrink:0}.commerce-dialog h2{margin:0;font-size:17px;line-height:1.45}.dialog-close{border:0;background:transparent;font-size:24px;line-height:1;color:var(--muted)}.dialog-close:hover{color:var(--fg)}
.commerce-dialog footer{border-top:1px solid var(--border);border-bottom:0;justify-content:flex-end}.commerce-dialog footer .btn{min-width:84px}
/* 弹窗正文：详情行/说明全宽，文本与数字输入两列成组；长内容在体内滚动。 */
.dialog-body{padding:4px 22px 18px;overflow-wrap:anywhere;overflow-y:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 18px;align-content:start}
.dialog-body>*{grid-column:1/-1}
.dialog-body>label.field{grid-column:span 1;margin:0;padding:9px 0 3px}
.dialog-body>label.field:has(textarea),.dialog-body>label.field:has(select),.dialog-body>label.field:has(input[type=checkbox]),.dialog-body>label.field:only-child{grid-column:1/-1}
.voucher-code-dialog .dialog-body{display:block}
.dialog-error{color:#b91c1c;padding:2px 22px 10px;font-size:12.5px;flex-shrink:0}
/* lvju-app.css 的 .field 是移动端列表行样式（padding 16px / 白底 / 下边框 / space-between），
   会漏进弹层把控件挤窄；这里把弹层内 field 收口为自绘基线，控件轨道恒满宽。 */
.commerce-dialog .field{font-size:12.5px;padding:0;background:transparent;border:0;justify-content:normal;grid-template-columns:minmax(0,1fr)}
.commerce-dialog .field input,.commerce-dialog .field select,.commerce-dialog .field textarea{width:100%;min-width:0;box-sizing:border-box;padding:9px 11px;border:1px solid var(--border);border-radius:8px;font:14px/1.5 var(--font);background:white;color:var(--fg)}
.commerce-dialog .field input:focus,.commerce-dialog .field select:focus,.commerce-dialog .field textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.commerce-dialog .field textarea{resize:vertical;min-height:78px;line-height:1.7}
.commerce-dialog .field:has(input[type=checkbox]),.commerce-dialog .field:has(input[type=radio]){display:flex;align-items:center;gap:8px;font-size:13px;color:var(--fg)}
.commerce-dialog .field:has(input[type=checkbox]) input,.commerce-dialog .field:has(input[type=radio]) input{width:auto}
.commerce-dialog .detail-row{display:grid;grid-template-columns:112px minmax(0,1fr);gap:12px;padding:11px 0;border-bottom:1px solid var(--border)}
.commerce-dialog .detail-row span{color:var(--muted);font-size:12.5px}
.commerce-dialog .detail-row b{font-weight:500;font-size:14px;white-space:pre-wrap}.package-items{border:1px solid var(--border);border-radius:8px;padding:12px}.item-line{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px 0;border-bottom:1px solid var(--border);margin-bottom:12px}.item-line label{display:grid;gap:6px;font-size:12px}.form-hint,.consumer-footnote{color:var(--muted);font-size:12px;line-height:1.8}.setup-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;padding-left:20px;margin:22px 0}.product-benefits{display:flex;gap:6px;flex-wrap:wrap;margin:16px 0}.product-benefits span{background:var(--brand-soft);border-radius:6px;padding:6px 9px;color:var(--brand);font-size:11px}.product-bottom{display:flex;justify-content:space-between;gap:14px;align-items:center}.consumer-footnote{text-align:center;padding:0 10px}.commerce-kpi{color:var(--fg);text-decoration:none}.commerce-kpi b{margin:10px 0}.commerce-kpi small{font-size:11px;color:var(--brand)}
@keyframes kpi-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
.spot-reference-options{display:grid;gap:8px;max-height:180px;overflow-y:auto;margin-top:8px}.spot-reference-options label{display:flex;align-items:center;gap:8px;font-size:12px}.spot-reference-options input{width:auto}
.commerce-grid .commerce-kpi{animation:kpi-in .4s cubic-bezier(.2,.7,.3,1) both}
.commerce-grid .commerce-kpi:nth-child(2){animation-delay:.05s}.commerce-grid .commerce-kpi:nth-child(3){animation-delay:.1s}.commerce-grid .commerce-kpi:nth-child(4){animation-delay:.15s}.commerce-grid .commerce-kpi:nth-child(5){animation-delay:.2s}.commerce-grid .commerce-kpi:nth-child(6){animation-delay:.25s}
@media(prefers-reduced-motion:reduce){.commerce-grid .commerce-kpi{animation:none}}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
@media(max-width:760px){.panel-heading{flex-direction:column;gap:8px}.setup-steps{grid-template-columns:1fr;gap:12px}.commerce-dialog .detail-row{grid-template-columns:90px minmax(0,1fr)}.dialog-body{grid-template-columns:minmax(0,1fr)}.commerce-tabs{flex-wrap:nowrap;overflow:auto;white-space:nowrap}.commerce-tabs a,.commerce-tabs button{flex-shrink:0}.management-filter label{flex:1;min-width:110px}.management-filter input,.management-filter select{width:100%}.item-line{grid-template-columns:minmax(0,1fr)}.account-bar .btn{font-size:11px;padding:7px 9px}}

/* ── 2026-10-02 美化轮：工作台层次与反馈（不改视觉体系，青绿 + 金范围内） ── */
/* KPI：平铺色块 → 白卡 + 数字主视觉（均为链接入口，悬浮给反馈） */
.commerce-desktop .commerce-kpi{background:white;border:1px solid var(--border);border-radius:12px;box-shadow:0 1px 3px #16382c08;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}
.commerce-desktop a.commerce-kpi:hover{transform:translateY(-2px);box-shadow:0 8px 22px #16382c14;border-color:#bcd9cf}
.commerce-desktop .commerce-kpi span{display:block;font-size:11.5px}
.commerce-desktop .commerce-kpi b{font:700 25px/1.2 var(--font);color:var(--brand-deep);font-variant-numeric:tabular-nums}
/* 概览 hero：与推广端同词汇的径向金色点缀（限定工作台作用域，不碰 C 端/推广端 hero） */
.commerce-desktop .commerce-hero{position:relative;isolation:isolate;overflow:hidden}
.commerce-desktop .commerce-hero::after{content:"";position:absolute;right:-46px;top:-52px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,#d6ab6730,transparent 68%);z-index:-1}
/* 按钮：悬浮/按压反馈（悬浮态仅桌面作用域，避免触屏粘滞高亮） */
.commerce-page .btn{transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease,transform .12s ease}
.commerce-desktop .btn:hover{border-color:var(--brand);background:#f4f9f7}
.commerce-desktop .btn.pri:hover{background:var(--brand-deep);border-color:var(--brand-deep);box-shadow:0 4px 14px #0f766e33}
.commerce-desktop .btn:active{transform:translateY(1px)}
/* 页签 chips（≤1023px 唯一导航）：选中白底描边 + 轻投影 */
.commerce-tabs a:hover,.commerce-tabs button:hover{border-color:#bcd9cf;color:var(--brand-deep)}
.commerce-tabs .on{background:white;border-color:var(--brand);color:var(--brand-deep);font-weight:600;box-shadow:0 1px 4px #16382c0f}
/* 表格：表头吸顶 + 斑马纹 + 行悬浮增强 */
.commerce-table-wrap th{position:sticky;top:0;z-index:1;letter-spacing:.02em}
.commerce-table-wrap tbody tr:nth-child(even){background:#fbfcfb}
.commerce-table-wrap tbody tr:hover{background:#f2f7f5}
/* 状态徽章语义补色（沿用既有浅底深字规格；未列出的状态走缺省青绿） */
.state-available,.state-published,.state-approved,.state-fulfilled,.state-completed{background:#e8f3ec;color:#22704f}
.state-reserved,.state-paid_pending_fulfillment,.state-booked,.state-processing{background:#fdf3e2;color:#8a6a1f}
.state-closed,.state-cancelled,.state-rescheduled{background:#f1f3f5;color:#64748b}
/* 空态：字符 mark 收进浅底圆片 */
.commerce-desktop .empty-mark{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#eef4f1;font-size:24px}
/* 弹窗入场动效 + 背板轻模糊；状态条出现轻过渡 */
.commerce-dialog[open]{animation:commerce-dialog-in .16s ease-out}
.commerce-dialog::backdrop{backdrop-filter:blur(2px)}
@keyframes commerce-dialog-in{from{opacity:0;transform:translateY(6px) scale(.985)}to{opacity:1;transform:none}}
#commerce-status:not(:empty){animation:commerce-status-in .18s ease-out}
@keyframes commerce-status-in{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}
/* 筛选表单输入件统一高度；聚焦描边品牌色 */
.management-filter input,.management-filter select{min-height:36px;padding:7px 10px}
.management-filter input:focus,.management-filter select:focus{border-color:var(--brand);outline:none;box-shadow:0 0 0 3px var(--brand-soft)}
.pagination .btn{padding:6px 11px;font-size:12px}
@media(prefers-reduced-motion:reduce){.commerce-dialog[open],#commerce-status:not(:empty){animation:none}.commerce-desktop .commerce-kpi,.commerce-page .btn{transition:none}.commerce-dialog::backdrop{backdrop-filter:none}}

/* ── 2026-10-02 品类色板（C 端 + 推广端共用；浅底/深字随奶油纸底校准，与家政域 _jzapi.js CAT_THEME 无耦合）── */
.cat-cleaning{--cat-bg:#e8f0e3;--cat-fg:#4c7442}
.cat-repair{--cat-bg:#fcede4;--cat-fg:#b05a1c}
.cat-moving{--cat-bg:#e6f0fc;--cat-fg:#1f62c6}
.cat-nanny{--cat-bg:#f9e9ec;--cat-fg:#b0506b}
.cat-telecom{--cat-bg:#eeeafa;--cat-fg:#6353b8}
.cat-insurance{--cat-bg:#e7eef6;--cat-fg:#33618f}
.cat-consumer_finance{--cat-bg:#f6ecd7;--cat-fg:#8a6a1f}
.cat-health_care{--cat-bg:#e3f0ec;--cat-fg:#1d7367}
.cat-home_maintain{--cat-bg:#f1e9dd;--cat-fg:#8a6a45}
.cat-asset{--cat-bg:#e8eaf2;--cat-fg:#4a5482}
.cat-recycle{--cat-bg:#edf0dd;--cat-fg:#6d7a2f}
.cat-community{--cat-bg:#eceee4;--cat-fg:#5f6d4f}
.cat-hotel_exchange{--cat-bg:#f7f1e2;--cat-fg:#8a6d2f}
.cat-scenic_ticket{--cat-bg:#fdeae6;--cat-fg:#c05a44}
.cat-dining{--cat-bg:#f8e8e3;--cat-fg:#a84a35}
.cat-online_service{--cat-bg:#e4f1f2;--cat-fg:#22707d}
.cat-packages{--cat-bg:#f7f1e2;--cat-fg:#8a6d2f}
.cat-plans{--cat-bg:#f6ecd7;--cat-fg:#8a6a1f}

/* ── 2026-10-02 A3 骨架屏（C 端 + 推广端共用）── */
.skel-wrap{display:grid;gap:14px;padding:2px 0}
.skel{display:block;height:64px;border-radius:13px;background:#ebe9dd;position:relative;overflow:hidden}
.skel::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,#f9f8f2b3,transparent);animation:skel-sweep 1.4s infinite}
@keyframes skel-sweep{to{transform:translateX(100%)}}
.skel-hero{height:140px;border-radius:16px}
.skel-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.skel-cards .skel{height:200px}
.skel-row{height:40px;border-radius:999px}
@media(prefers-reduced-motion:reduce){.skel::after{animation:none}}