/*
 * 有稿 · 视觉层（2026-10-14 改版）
 * 放在所有样式之后加载，只覆盖外观，不改结构；删掉这个文件的引用即可回到原版。
 * 原则（依据见对话中的研究）：简单、眼熟、浅色；一种蓝色主色；红色只给金额；
 * 绿/橙/灰只给状态；去掉渐变和重阴影；手机上主按钮至少 44px。
 */
:root {
  --bg: #f5f7fa;
  --surface-2: #f7f8fa;
  --surface-hover: #f2f3f5;
  --border: #eef0f3;
  --border-strong: #e0e3e8;

  --text: #1d2129;
  --text-2: #4e5969;
  --text-3: #6b7280;
  --text-4: #a3aab5;

  --accent: #2f6bff;
  --accent-hover: #1f5af0;
  --accent-ink: #1d5ae0;
  --accent-soft: #eef3ff;
  --accent-soft-2: #dfe8ff;
  --accent-ring: rgba(47, 107, 255, .2);

  --red: #e5383b;
  --red-soft: #fff0f0;
  --green: #12924f;
  --green-soft: #e8f8ef;
  --amber: #c25e00;
  --amber-soft: #fff5e8;
  --blue: #1d5ae0;
  --blue-soft: #eef3ff;

  --shadow-card: 0 0 0 1px rgba(16, 24, 40, .03), 0 1px 2px rgba(16, 24, 40, .04);
  --shadow-pop: 0 8px 28px rgba(16, 24, 40, .12), 0 2px 6px rgba(16, 24, 40, .06);

  --radius-lg: 12px;
  --radius: 8px;
  --radius-sm: 6px;
}

h1, h2, h3, h4 { font-weight: 600; letter-spacing: 0; }

/* ---------- 品牌标志 ---------- */
.sidebar-brand .logo-mark, .login-brand-top .mark, .login-mobile-brand .mark, .picker-mark {
  background: url(/shared/logo.svg) center / cover no-repeat !important;
  box-shadow: none !important; font-size: 0 !important;
}
.login-brand-top .mark { box-shadow: 0 0 0 2px rgba(255, 255, 255, .35) !important; }
.sidebar-brand .name { font-size: 17px; letter-spacing: 1px; }

/* ---------- 去掉渐变，统一为纯色 ---------- */
.login-brand-pane { background: var(--accent); }
.login-brand-pane::before, .login-brand-pane::after { background: rgba(255, 255, 255, .06); }
.designer-stat-grid { background: var(--accent); border-radius: var(--radius-lg); }
.metric-settledAmount, .metric-settlingAmount, .metric-reviewAmount { background: var(--surface); }

/* ---------- 卡片、按钮、标签 ---------- */
.card { border-radius: var(--radius-lg); box-shadow: var(--shadow-card); }
.btn { border-radius: var(--radius); font-weight: 500; }
.btn-primary { box-shadow: none; }
.btn-danger-solid { background: var(--red); }
.badge { border-radius: 4px; font-weight: 500; }
.badge.gray { background: #f2f3f5; color: #6b7280; }
.mono, .designer-stat-value, .hall-price strong { font-variant-numeric: tabular-nums; }
.hall-price strong { color: var(--red); }
.nav-item.active { font-weight: 600; }

/* ---------- 手机底部导航（块状，替代左侧菜单） ---------- */
.tabbar, .more-sheet { display: none; }
@media (max-width: 860px) {
  .has-tabbar .sidebar, .has-tabbar .sidebar-backdrop, .has-tabbar .menu-toggle { display: none !important; }
  .tabbar {
    display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
    background: #fff; border-top: 1px solid var(--border); box-shadow: 0 -4px 16px rgba(16, 24, 40, .05);
    padding: 8px 8px calc(8px + env(safe-area-inset-bottom));
  }
  .tabbar .tab-item {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    min-height: 52px; padding: 0; margin: 0; border: 0 !important; border-radius: 12px; background: var(--surface-2) !important;
    font: inherit; font-size: 12px; color: var(--text-2); font-weight: 500; cursor: pointer;
    transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);
  }
  .tabbar .tab-item:active { transform: scale(.96); }
  .tabbar .tab-item .icon { width: 22px; height: 22px; color: inherit; }
  .tabbar .tab-item.active { background: var(--accent) !important; color: #fff; }
  .tabbar .tab-item.active .icon { color: #fff; }
  .has-tabbar .content { padding-bottom: calc(96px + env(safe-area-inset-bottom)); }
  .has-tabbar .topbar { padding-left: 14px; }
  .has-tabbar .feature-contact-button { bottom: calc(86px + env(safe-area-inset-bottom)); width: 48px; height: 48px; padding: 12px; }
  .has-tabbar .feature-contact-panel { bottom: calc(146px + env(safe-area-inset-bottom)); }
  .more-sheet:not([hidden]) { display: flex; position: fixed; inset: 0; z-index: 90; background: rgba(15, 20, 30, .45); align-items: flex-end; animation: fade-in 160ms var(--ease) both; }
  .more-sheet-panel { width: 100%; background: #fff; border-radius: 18px 18px 0 0; padding: 18px 14px calc(14px + env(safe-area-inset-bottom)); }
  .more-sheet-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
  .more-sheet-item {
    position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-height: 76px;
    border: 0; border-radius: 12px; background: var(--surface-2); font: inherit; font-size: 13px; color: var(--text); cursor: pointer;
  }
  .more-sheet-item .icon { width: 24px; height: 24px; color: var(--accent); }
  .more-sheet-item.active { background: var(--accent-soft); color: var(--accent-ink); font-weight: 500; }
  .more-sheet-item.danger { color: var(--red); } .more-sheet-item.danger .icon { color: var(--red); }
  .more-sheet-item .badge-dot { position: absolute; top: 8px; right: 10px; margin: 0; font-style: normal; }
  .btn-block { width: 100%; }

  /* 手机上主操作按钮加高，方便拇指点 */
  .hall-grab, .login-card .btn-primary, .modal .btn-primary { min-height: 44px; }
  .content { padding-left: 12px; padding-right: 12px; }
}

/* ---------- 逐页巡检后的修正 ---------- */
.overview-value.green { color: var(--red); }  /* 金额统一用红色 */
@media (max-width: 860px) {
  .report-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px; }
  .metric-report { padding: 14px; }
  .metric-report strong { font-size: 22px; margin: 6px 0 8px; }
}

/* ---------- 报表：横向漏斗、趋势说明、金额色 ---------- */
.report-funnel { min-height: 0; padding: 4px 0; display: flex; flex-direction: column; gap: 12px; }
.funnel-row { display: grid; grid-template-columns: 64px minmax(0, 1fr) 92px; align-items: center; gap: 10px; margin: 0; min-height: 0; padding: 0; position: static; justify-content: stretch; }
.funnel-label { font-size: 13px; color: var(--text-2); }
.funnel-track { position: relative; height: 28px; background: var(--surface-2); border-radius: 6px; display: flex; align-items: center; }
.funnel-bar { height: 100%; border-radius: 6px; }
.funnel-track strong { position: absolute; left: 10px; font-size: 13px; color: #fff; font-variant-numeric: tabular-nums; text-shadow: 0 0 2px rgba(0,0,0,.15); }
.funnel-row:nth-child(n+3) .funnel-track strong { color: var(--text); text-shadow: none; }
.funnel-rate { font-size: 12px; color: var(--text-3); text-align: right; white-space: nowrap; }
.funnel-note { margin-top: 14px; font-size: 12px; }
.report-chart { height: 260px; }
.report-empty { height: 100%; display: flex; align-items: center; justify-content: center; }
.metric-change .trend { font-weight: 500; white-space: nowrap; }
.metric-change .rise { color: var(--green); }
.metric-change .fall { color: var(--red); }
.metric-report strong.money, .business-grid strong.money { color: var(--red); }
.business-grid strong.pending { color: var(--text-4); }
.business-grid em { display: block; font-style: normal; font-size: 12px; color: var(--text-4); margin-top: 2px; }

/* ---------- 下拉框（电脑端，配合 select.js） ---------- */
select.ys-native { position: absolute !important; width: 1px !important; height: 1px !important; opacity: 0; pointer-events: none; padding: 0; border: 0; }
.ys-select {
  width: 100%; height: 38px; padding: 0 10px 0 12px; border-radius: var(--radius-sm); border: 1px solid var(--border-strong);
  background: var(--surface); font: inherit; font-size: 14px; color: var(--text); cursor: pointer;
  display: inline-flex; align-items: center; justify-content: space-between; gap: 8px; text-align: left;
  transition: border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
}
.ys-select span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ys-select svg { flex-shrink: 0; color: var(--text-3); transition: transform var(--dur-fast) var(--ease); }
.ys-select:hover { border-color: #b9c4d4; }
.ys-select:focus-visible, .ys-select[aria-expanded="true"] { outline: none; border-color: var(--accent); box-shadow: var(--shadow-focus); }
.ys-select[aria-expanded="true"] svg { transform: rotate(180deg); }
.ys-select:disabled { background: var(--surface-2); color: var(--text-3); cursor: not-allowed; }
.ys-select-list {
  position: fixed; z-index: 300; max-height: 280px; overflow-y: auto; padding: 4px;
  background: var(--surface); border: 1px solid var(--border); border-radius: 10px; box-shadow: var(--shadow-pop);
  animation: fade-in 120ms var(--ease) both;
}
.ys-select-option { padding: 8px 12px; border-radius: 6px; font-size: 14px; color: var(--text); cursor: pointer; white-space: nowrap; }
.ys-select-option.active { background: var(--surface-hover); }
.ys-select-option.selected { color: var(--accent-ink); font-weight: 500; background: var(--accent-soft); }
.ys-select-option.disabled { color: var(--text-4); cursor: not-allowed; }
.btn-sm + .ys-select, .admin-pager .ys-select { height: 32px; width: auto; min-width: 72px; }
@media (max-width: 860px) {
  .tabbar .tab-item { position: relative; }
  .tabbar .tab-item .badge-dot { position: absolute; top: 4px; right: 8px; margin: 0; font-style: normal; }
}

/* ---------- 表格放不下时（手机，或窄的电脑窗口）：每行变成多列小卡片，字段名在上、内容在下 ----------
   由 enhance.js 判断：表格比容器宽就加 as-cards 类，所以任何宽度都不会出现被遮挡、被截断的列 */
table.data-table.as-cards, table.data-table.as-cards tbody, table.data-table.as-cards tr, table.data-table.as-cards td { display: block; width: 100%; }
table.data-table.as-cards { min-width: 0 !important; }
table.data-table.as-cards thead { display: none; }
table.data-table.as-cards tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; padding: 14px; background: var(--surface); border-bottom: 8px solid var(--bg); }
table.data-table.as-cards tbody tr:last-child { border-bottom: 0; }
table.data-table.as-cards td {
  display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 2px; position: static !important;
  padding: 0 !important; border: 0; text-align: left; font-size: 14px; color: var(--text); min-width: 0 !important; max-width: none !important;
  white-space: normal; overflow-wrap: anywhere; word-break: break-word; box-shadow: none !important; background: transparent !important;
}
table.data-table.as-cards td::before { content: attr(data-label); font-size: 12px; color: var(--text-3); }
table.data-table.as-cards td[data-label=""]::before, table.data-table.as-cards td:last-child::before { content: none; }
table.data-table.as-cards td.wrap, table.data-table.as-cards td.title-cell, table.data-table.as-cards td.remark-cell,
table.data-table.as-cards td.select-cell, table.data-table.as-cards td:last-child { grid-column: 1 / -1; }
table.data-table.as-cards td.select-cell, table.data-table.as-cards td:first-child:has(> input[type=checkbox]) { grid-column: 1 / -1; flex-direction: row; }
table.data-table.as-cards td:last-child { flex-direction: row; justify-content: flex-end; align-items: center; padding-top: 12px !important; border-top: 1px solid var(--border) !important; }
table.data-table.as-cards td .icon-actions { justify-content: flex-end; flex-wrap: wrap; }
@media (min-width: 600px) { table.data-table.as-cards tr { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1000px) { table.data-table.as-cards tr { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ---------- 设计师管理卡片（卡片模式下：昵称放大在左上，右侧业绩详情 + 状态） ---------- */
#designerTable table.as-cards tr { position: relative; grid-template-columns: repeat(5, minmax(0, 1fr)) !important; gap: 10px 6px; padding: 14px; }
#designerTable table.as-cards td { display: none; }
#designerTable table.as-cards td::before { content: none; }
#designerTable table.as-cards td.select-cell { display: flex; position: absolute !important; left: 14px; top: 16px; width: auto; }
#designerTable table.as-cards td[data-label="设计师"] { display: flex; grid-column: 1 / 4; grid-row: 1; margin-left: 36px; }
#designerTable table.as-cards td[data-label="设计师"] .cell-main { font-size: 17px; font-weight: 600; }
#designerTable table.as-cards td[data-label="状态"] { display: flex; flex-direction: row; grid-column: 4 / 6; grid-row: 1; align-items: center; justify-content: flex-end; gap: 8px; }
#designerTable table.as-cards td:last-child { display: flex; grid-column: 1 / -1; grid-row: 4; }
#designerTable .perf-toggle { height: 28px; padding: 0 10px; border-radius: 14px; border: 1px solid var(--border-strong); background: #fff; font: inherit; font-size: 12px; color: var(--accent-ink); cursor: pointer; white-space: nowrap; }
#designerTable tr.open .perf-toggle { background: var(--accent-soft); border-color: transparent; }
#designerTable table.as-cards tr.open td.perf { display: flex; grid-row: 2; align-items: center; text-align: center; background: var(--surface-2); padding: 8px 2px !important; border-radius: 8px; font-weight: 600; }
#designerTable table.as-cards tr.open td.perf::before { content: attr(data-label); font-weight: 400; }
#designerTable table.as-cards tr.open td.perf .cell-stack { align-items: center; }
#designerTable table.as-cards tr.open td.extra { display: flex; grid-row: 3; grid-column: 1 / -1; }
#designerTable table.as-cards tr.open td.extra::before { content: attr(data-label); }

#designerTable table:not(.as-cards) .perf-toggle { display: none; }

/* ---------- 批量导入步骤 ---------- */
.bulk-steps { list-style: none; counter-reset: step; margin: 0 0 16px; padding: 0; display: grid; gap: 10px; }
.bulk-steps li { counter-increment: step; position: relative; padding: 12px 14px 12px 50px; background: var(--surface-2); border-radius: 10px; }
.bulk-steps li::before { content: counter(step); position: absolute; left: 14px; top: 12px; width: 24px; height: 24px; border-radius: 50%; background: var(--accent); color: #fff; font-size: 13px; font-weight: 600; display: flex; align-items: center; justify-content: center; }
.bulk-steps b { display: block; font-size: 14px; margin-bottom: 2px; }
.bulk-steps span { font-size: 13px; color: var(--text-2); line-height: 1.6; }
.bulk-steps em { font-style: normal; color: var(--red); }
.bulk-actions { align-items: center; flex-wrap: wrap; }
.bulk-file { cursor: pointer; }
@media (min-width: 861px) { .bulk-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* ---------- 勾选后的批量操作条 ---------- */
.select-bar:not([hidden]) {
  position: fixed; left: 50%; transform: translateX(-50%); bottom: 24px; z-index: 70; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: center;
  max-width: calc(100vw - 24px); padding: 10px 12px 10px 16px; background: #1d2129; color: #fff; border-radius: 14px; box-shadow: var(--shadow-pop);
  animation: fade-in 160ms var(--ease) both; font-size: 14px;
}
.select-bar b { color: #8fb1ff; font-variant-numeric: tabular-nums; }
.select-bar .btn-ghost { color: #c9cdd4; } .select-bar .btn-ghost:hover { background: rgba(255,255,255,.08); color: #fff; }
.select-bar .btn-danger { background: #fff0f0; }
@media (max-width: 860px) { .has-tabbar .select-bar:not([hidden]) { bottom: calc(84px + env(safe-area-inset-bottom)); } }

/* ---------- 状态颜色（每个状态一种颜色，红色只留给金额） ----------
   待接单=青  待完成/已接单=蓝  审核中/待审核=橙  已驳回=玫红  结算中=紫  已结算=绿  已取消/待定=灰 */
:root {
  --st-hall: #0e9fb8;     --st-hall-soft: #e6f8fb;
  --st-accepted: #2f6bff; --st-accepted-soft: #eef3ff;
  --st-review: #c25e00;   --st-review-soft: #fff5e8;
  --st-rejected: #c2187a; --st-rejected-soft: #fdeef6;
  --st-settling: #6a4fe0; --st-settling-soft: #f1edfe;
  --st-settled: #12924f;  --st-settled-soft: #e8f8ef;
}
.badge.cyan { background: var(--st-hall-soft); color: var(--st-hall); }
.badge.blue { background: var(--st-accepted-soft); color: var(--st-accepted); }
.badge.amber { background: var(--st-review-soft); color: var(--st-review); }
.badge.rose { background: var(--st-rejected-soft); color: var(--st-rejected); }
.badge.violet { background: var(--st-settling-soft); color: var(--st-settling); }
.badge.green { background: var(--st-settled-soft); color: var(--st-settled); }
.st-text-settling { color: var(--st-settling) !important; }
.st-text-settled { color: var(--st-settled) !important; }
.value.money, .designer-metric .value.money, .designer-finance-pair .value.money { color: var(--red) !important; }
.value.pending { color: var(--text-4) !important; }
.pending-note { font-size: 12px; color: var(--text-4); }

/* 设计师首页蓝卡：每个数字前加状态色点 */
.designer-stat-label { display: inline-flex; align-items: center; gap: 6px; }
.st-dot { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.6); box-shadow: 0 0 0 2px rgba(255,255,255,.25); }
.st-accepted .st-dot { background: #9cc0ff; } .st-review .st-dot { background: #ffc46b; } .st-rejected .st-dot { background: #ff8cc6; }
.st-hall .st-dot { background: #6be3f5; } .st-done .st-dot { background: rgba(255,255,255,.4); }
.designer-stat-value small { display: block; font-size: 11px; font-weight: 400; color: rgba(255,255,255,.7); line-height: 1.2; }
.designer-stat:disabled .designer-stat-value { font-size: 28px; }

/* 订单卡片、表格中的金额统一红色 */
.order-money, .money, td[data-label*="佣金"], td[data-label*="金额"], td[data-label="利润"] { color: var(--red); }
td[data-label*="佣金"] *:not(.badge):not(button), td[data-label*="金额"] *:not(.badge):not(button) { color: inherit; }
@media (max-width: 860px) { table.data-table td:first-child:has(> input[type=checkbox]) { grid-column: 1 / -1; flex-direction: row; } }

/* ---------- 电脑端表格：表头不折行、排序符号跟在字后、列更紧凑 ---------- */
@media (min-width: 861px) {
  table.data-table { font-size: 13px; }
  table.data-table th { white-space: nowrap !important; word-break: keep-all; padding: 10px 8px !important; font-size: 13px; font-weight: 500; color: var(--text-2); vertical-align: middle; }
  table.data-table td { padding: 10px 8px !important; vertical-align: middle; }
  table.data-table th:first-child, table.data-table td:first-child { padding-left: 14px !important; }
  table.data-table th.select-cell, table.data-table td.select-cell { width: 36px; }
  .sort-mark { margin-left: 2px; font-size: 10px; vertical-align: 1px; }
  /* 长文字列：最多两行宽度，超出换行，不把整张表撑宽 */
  table.data-table td.wrap, table.data-table td.title-cell, table.data-table td.remark-cell { min-width: 96px !important; max-width: 200px; white-space: normal; }
  /* 操作列：固定在右侧，图标排成一行 */
  table.data-table.sticky-ops th:last-child, table.data-table.sticky-ops td:last-child { background: var(--surface); box-shadow: -6px 0 8px -6px rgba(16, 24, 40, .12); border-left: 0 !important; }
  table.data-table.sticky-ops th:last-child { background: var(--surface-2); }
  table.data-table td:last-child .icon-actions { flex-wrap: nowrap; gap: 2px; }
  table.data-table .icon-btn { width: 30px; height: 30px; }
}
@media (min-width: 861px) {
  table.data-table th, table.data-table td { padding-left: 6px !important; padding-right: 6px !important; }
  table.data-table td.wrap, table.data-table td.title-cell, table.data-table td.remark-cell { max-width: 150px; }
  table.data-table td .mono, table.data-table td[data-label$="号"] { font-size: 12px; }
  table.data-table td .btn-sm { height: 28px; padding: 0 8px; font-size: 12px; }
}
@media (min-width: 861px) {
  #designerTable table.as-cards tbody { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 12px; background: var(--bg); }
  #designerTable table.as-cards tr { border: 0; border-radius: 12px; }
}

/* ---------- 复合单元格（方案 1）：主信息 + 灰色辅助行；顶部对齐；数字靠右 ---------- */
.cell-stack { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cell-stack .cell-main { color: var(--text); font-weight: 500; line-height: 1.5; overflow-wrap: anywhere; }
.cell-stack .cell-sub { color: var(--text-3); font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.cell-stack .cell-sub .text-link, .cell-stack .cell-sub a { color: var(--accent-ink); }
.cell-stack .btn, .cell-links .btn { height: auto !important; padding: 0 !important; border: 0; background: none !important; color: var(--accent-ink); font-size: 12px; font-weight: 400; }
.cell-stack .btn:hover, .cell-links .btn:hover { text-decoration: underline; }
.cell-links { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
@media (min-width: 861px) {
  table.data-table:not(.as-cards) td { vertical-align: top; }
  table.data-table:not(.as-cards) th { vertical-align: middle; }
  table.data-table.has-cols { table-layout: fixed; width: 100%; }
  table.data-table:not(.as-cards) td.num, table.data-table:not(.as-cards) th[data-num] { text-align: right; }
  table.data-table:not(.as-cards) td.num .cell-stack { align-items: flex-end; }
  table.data-table:not(.as-cards) td { white-space: normal !important; }
  table.data-table:not(.as-cards) td.select-cell, table.data-table:not(.as-cards) td:last-child { white-space: nowrap !important; }
  table.data-table:not(.as-cards) td.select-cell input { margin-top: 3px; }
  table.data-table:not(.as-cards) td .icon-actions { align-items: center; }
  table.data-table.has-cols td:last-child, table.data-table.has-cols th:last-child { width: auto; }
}
td.num, .amount, .amount-plain { font-variant-numeric: tabular-nums; }
.amount, .amount-plain, .cell-amount, td .amount, table.data-table.as-cards td .amount, table.data-table.as-cards td .amount-plain, table.data-table.as-cards td .cell-amount { color: var(--red) !important; font-weight: 600; }
#designerTable table.as-cards tr:not(.open) td:last-child { grid-row: 2; }

/* ---------- 已完成（等结算日）状态色：靛蓝 ---------- */
:root { --st-completed: #4b4fd8; --st-completed-soft: #eeeffd; }
.badge.indigo { background: var(--st-completed-soft); color: var(--st-completed); }
.st-text-completed { color: var(--st-completed) !important; }
.st-done .st-dot { background: #b3b5ff; }

/* ---------- 结算中心：结算周期 ---------- */
.cycle-main { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 14px; }
.cycle-seg { display: inline-flex; gap: 4px; padding: 4px; margin-top: 6px; background: var(--surface-2); border-radius: 10px; }
.cycle-seg button { border: 0; background: none; font: inherit; font-size: 14px; color: var(--text-2); padding: 7px 18px; border-radius: 8px; cursor: pointer; min-height: 36px; }
.cycle-seg button.active { background: var(--accent); color: #fff; font-weight: 500; }
.cycle-next { text-align: right; }
.cycle-next strong { font-size: 18px; font-variant-numeric: tabular-nums; margin-right: 4px; }
.settle-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding-bottom: 14px; }
.designer-finance-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 860px) { .designer-finance-summary { grid-template-columns: 1fr; } .cycle-next { text-align: left; } }

/* ---------- 联系客服：先选人，再看详情 ---------- */
.feature-contact-panel { text-align: left; padding: 16px; width: 300px; border-radius: 16px; animation: fade-in 140ms var(--ease) both; }
.feature-contact-panel > .modal-close { display: none; }
.contact-title { font-size: 15px; margin: 2px 4px 10px !important; }
.contact-list { display: flex; flex-direction: column; gap: 6px; }
.contact-option { display: flex; align-items: center; gap: 12px; width: 100%; padding: 10px 12px; min-height: 56px; border: 0; border-radius: 12px; background: var(--surface-2); font: inherit; text-align: left; cursor: pointer; color: var(--text); }
.contact-option:hover, .contact-option:focus-visible { background: var(--accent-soft); outline: none; }
.contact-avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--accent); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 600; flex-shrink: 0; }
.contact-meta { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.contact-meta b { font-weight: 500; font-size: 15px; }
.contact-meta small { font-size: 12px; color: var(--text-3); }
.contact-arrow { color: var(--text-4); font-size: 20px; }
.contact-back { border: 0; background: none; font: inherit; font-size: 13px; color: var(--accent-ink); padding: 2px 0 10px; cursor: pointer; }
.contact-head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.contact-head h3 { margin: 0 !important; font-size: 16px; }
.contact-head p { margin: 0; font-size: 12px; color: var(--text-3); }
.feature-contact-panel img { display: block; margin: 0 auto 4px; border-radius: 8px; }
.feature-contact-panel img + .text-sub { text-align: center; margin: 0 0 8px; }
.feature-contact-panel dd { display: flex; align-items: center; gap: 8px; }
.contact-copy { border: 1px solid var(--border-strong); background: #fff; border-radius: 12px; font: inherit; font-size: 12px; padding: 1px 8px; color: var(--accent-ink); cursor: pointer; }
.contact-edit { border: 1px solid var(--border); border-radius: 12px; padding: 14px; margin-bottom: 12px; }
.contact-edit-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }

/* ---------- 去掉顶部“首页 / …”栏；退出、语音提醒放进侧边菜单 ---------- */
.has-tabbar .topbar { display: none !important; }
.has-tabbar .content { padding-top: 20px; }
.sidebar-logout { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 40px; margin-top: 8px; padding: 0 14px; border: 0; border-radius: var(--radius); background: none; font: inherit; font-size: 14px; color: var(--text-2); cursor: pointer; }
.sidebar-logout .icon { width: 18px; height: 18px; color: var(--text-3); }
.sidebar-logout:hover { background: var(--red-soft); color: var(--red); } .sidebar-logout:hover .icon { color: var(--red); }
.sidebar-voice { display: flex !important; align-items: center; justify-content: space-between; margin: 6px 4px 8px; padding: 10px 12px; border-radius: var(--radius); background: var(--surface-2); font-size: 14px; color: var(--text-2); }
/* 电脑端收起导航后，用左上角悬浮按钮重新展开 */
body > .menu-toggle { position: fixed; left: 14px; top: 14px; z-index: 40; display: none; width: 40px; height: 40px; background: var(--surface); box-shadow: var(--shadow-pop); border-radius: 10px; }
@media (min-width: 861px) { .nav-collapsed ~ .menu-toggle, body:has(.nav-collapsed) > .menu-toggle { display: flex !important; } }
@media (max-width: 860px) { body > .menu-toggle { display: none !important; } .has-tabbar .content { padding-top: 14px; } }
.hours-pick { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.hours-pick > select:not(.ys-native), .hours-pick > .ys-select { width: 140px; flex: 0 0 140px; }
.hours-pick > span { color: var(--text-3); font-size: 14px; }

/* 退出按钮放进侧栏底部的用户卡片右侧，不再额外占高度；矮屏幕时菜单项收紧 */
.sidebar-foot { min-width: 0; }
.sidebar-foot > div:not(.avatar) { min-width: 0; flex: 1; }
.sidebar-foot .uname, .sidebar-foot .urole { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-foot .sidebar-logout { width: auto; min-height: 32px; margin: 0 0 0 auto; padding: 0 10px; gap: 4px; flex-shrink: 0; font-size: 13px; border: 1px solid var(--border-strong); background: var(--surface); border-radius: 16px; }
.sidebar-foot .sidebar-logout .icon { width: 15px; height: 15px; }
.sidebar-foot .sidebar-logout:hover { border-color: transparent; }
@media (min-width: 861px) and (max-height: 760px) {
  .sidebar { padding-top: 12px; padding-bottom: 12px; }
  .sidebar-brand { padding-bottom: 10px; }
  .sidebar .nav-item { min-height: 36px; }
  .sidebar-voice { margin: 4px; padding: 6px 12px; }
  .sidebar-fold { padding: 6px 14px; margin-top: 2px; }
}