@layer legacy {
/*
 * 财务虾产品适配层。
 * 唯一共享真源：@shrimp-family/visual；本文件只保存旧 token → 家族 token 映射和财务例外。
 */

:root[data-shrimp="finance"] {
  /* 财务虾浅态：保留家族原有纸张中性层，只增强宝石强调与语义色。 */
  --finance-light-paper: #efeee7;
  --finance-light-surface: #fbfbf7;
  --finance-light-surface-2: #e5e4db;
  --finance-light-surface-raised: #ffffff;
  --finance-light-field: #fbfbf7;
  --finance-light-ink: #22201a;
  --finance-light-ink-2: #565248;
  --finance-light-ink-3: #767166;
  --finance-light-line: #d8d5c8;
  --finance-light-line-2: #bdb9a8;
  --finance-light-accent: #103f79;
  --finance-light-accent-hover: #0b315f;
  --finance-light-accent-action: #103f79;
  --finance-light-accent-soft: #e0e9f3;
  --finance-light-hero: #103f79;
  --finance-light-navigation: #103f79;
  --finance-light-gold: #98680c;
  --finance-light-gold-bright: #c88d19;
  --finance-light-gold-soft: #fff2cc;
  --finance-light-ok: #07845f;
  --finance-light-ok-soft: #daf5ea;
  --finance-light-warn: #b96605;
  --finance-light-warn-soft: #fff0d0;
  --finance-light-bad: #cc3448;
  --finance-light-bad-soft: #ffe1e6;
  --finance-light-info: #276bc4;
  --finance-light-info-soft: #e1edff;

  /* 品牌与财务语义 */
  --primary: var(--accent);
  --primary-hover: var(--accent-hover);
  --primary-light: var(--accent-soft);
  --primary-mask: color-mix(in srgb, var(--accent) 12%, transparent);
  --red: var(--finance-rise);
  --red-light: var(--bad-soft);
  --green: var(--finance-fall);
  --green-light: var(--ok-soft);
  --blue: var(--info);
  --blue-light: var(--info-soft);
  --amber: var(--warn);
  --amber-light: var(--warn-soft);
  --violet: var(--gold);
  --violet-light: var(--gold-soft);
  --cyan: var(--info);
  --cyan-light: var(--info-soft);

  /* 旧中性 token 回迁；同名 --surface 用 revert-layer 取回共享层真值。 */
  --surface: revert-layer;
  --bg: var(--paper);
  --surface-soft: var(--surface-2);
  --surface-tint: var(--accent-soft);
  --field-bg: var(--surface);
  --border: var(--line);
  --border-soft: var(--line);
  --text: var(--ink);
  --text-2: var(--ink-2);
  --text-3: var(--ink-3);
  --gray-50: var(--surface);
  --gray-100: var(--surface-2);
  --gray-200: var(--line);
  --gray-300: var(--line-2);
  --gray-400: var(--ink-3);
  --gray-500: var(--ink-2);
  --gray-600: var(--ink-2);
  --gray-700: var(--ink);
  --gray-800: var(--ink);

  /* 旧阴影、圆角、字号、动效 token 回迁。 */
  --shadow-0: var(--shadow-card);
  --shadow: var(--shadow-card);
  --shadow-m: var(--shadow-float);
  --shadow-l: var(--shadow-drawer);
  --radius-4: 4px;
  --radius-6: var(--radius-control);
  --radius-8: var(--radius-control);
  --radius-10: var(--radius-control);
  --radius-12: var(--radius-card);
  --radius-14: var(--radius-card);
  --radius-16: var(--radius-large);
  --radius-20: var(--radius-drawer);
  --radius-full: revert-layer;
  --font: var(--sans);
  --dur-fast: var(--duration-fast);
  --dur-ui: var(--duration-ui);
  --dur-pop: var(--duration-pop);
  --dur-celebrate: var(--duration-celebrate);

  /* 财务专属：红涨/收入、绿跌/支出；高密度元数据允许 12px。 */
  --finance-income: var(--finance-rise);
  --finance-expense: var(--finance-fall);
  --finance-ledger-row: 38px;
  --finance-dense-meta: var(--text-dense-meta);
  --finance-selection-bg: #c5d6ee;
  --finance-selection-ink: var(--finance-light-ink);
  --finance-toast-ok-bg: #0f9f77;
  --finance-toast-warn-bg: #d77a08;
  --finance-toast-bad-bg: #dc4054;
  --finance-toast-info-bg: #276bc4;
  --finance-toast-ink: #ffffff;
  --finance-toast-ok-ink: var(--finance-toast-ink);
  --finance-toast-warn-ink: var(--finance-toast-ink);
  --finance-toast-bad-ink: var(--finance-toast-ink);
  --finance-toast-info-ink: var(--finance-toast-ink);
  --finance-toast-line: rgb(255 255 255 / 16%);
  --finance-toast-shadow: var(--shadow-drawer);

  /* 财务虾暗态专属：深海蓝宝石中性层 + 红宝石 / 祖母绿状态色。 */
  --finance-dark-paper: #050914;
  --finance-dark-surface: #0d192b;
  --finance-dark-surface-2: #172943;
  --finance-dark-surface-raised: #1e3555;
  --finance-dark-field: #091321;
  --finance-dark-ink: #f5f8ff;
  --finance-dark-ink-2: #b9c7dc;
  --finance-dark-ink-3: #8295b1;
  --finance-dark-line: #294263;
  --finance-dark-line-2: #3d5d88;
  --finance-dark-accent: #326ac6;
  --finance-dark-accent-hover: #4b87ed;
  --finance-dark-accent-action: #285daf;
  --finance-dark-accent-soft: #102c55;
  --finance-dark-hero: #0b2b57;
  --finance-dark-navigation: #0b2b57;
  --finance-dark-gold: #e9c96f;
  --finance-dark-gold-bright: #ffe29a;
  --finance-dark-gold-soft: #30250f;
  --finance-dark-ok: #38d7a4;
  --finance-dark-ok-soft: #0a3028;
  --finance-dark-warn: #ffb84d;
  --finance-dark-warn-soft: #382506;
  --finance-dark-bad: #ff7078;
  --finance-dark-bad-soft: #3b161f;
  --finance-dark-info: #6da8ff;
  --finance-dark-info-soft: #10294b;

  /* 默认浅态：中性底色与共享家族保持一致，深态在后续选择器中接管。 */
  --paper: var(--finance-light-paper);
  --surface: var(--finance-light-surface);
  --surface-2: var(--finance-light-surface-2);
  --finance-surface-raised: var(--finance-light-surface-raised);
  --field-bg: var(--finance-light-field);
  --ink: var(--finance-light-ink);
  --ink-2: var(--finance-light-ink-2);
  --ink-3: var(--finance-light-ink-3);
  --line: var(--finance-light-line);
  --line-2: var(--finance-light-line-2);
  --accent: var(--finance-light-accent);
  --accent-hover: var(--finance-light-accent-hover);
  --accent-action: var(--finance-light-accent-action);
  --accent-soft: var(--finance-light-accent-soft);
  --on-accent: #ffffff;
  --on-accent-action: #ffffff;
  --hero-bg: var(--finance-light-hero);
  --hero-foreground: #ffffff;
  --hero-subtle: rgb(239 246 255 / 84%);
  --hero-line: rgb(218 233 255 / 34%);
  --hero-panel: rgb(8 43 92 / 12%);
  --finance-navigation: var(--finance-light-navigation);
  --gold: var(--finance-light-gold);
  --gold-bright: var(--finance-light-gold-bright);
  --gold-soft: var(--finance-light-gold-soft);
  --ok: var(--finance-light-ok);
  --ok-soft: var(--finance-light-ok-soft);
  --on-ok: #ffffff;
  --warn: var(--finance-light-warn);
  --warn-soft: var(--finance-light-warn-soft);
  --bad: var(--finance-light-bad);
  --bad-soft: var(--finance-light-bad-soft);
  --on-bad: #ffffff;
  --info: var(--finance-light-info);
  --info-soft: var(--finance-light-info-soft);
  --finance-rise: var(--finance-light-bad);
  --finance-fall: var(--finance-light-ok);
  --shadow-card: 0 1px 2px rgb(34 32 26 / 8%), 0 8px 24px rgb(34 32 26 / 5%);
  --shadow-float: 0 10px 30px rgb(34 32 26 / 12%);
  --shadow-drawer: 0 24px 64px rgb(34 32 26 / 18%);
  --transition-color: color var(--duration-fast) var(--ease-out),
    background-color var(--duration-fast) var(--ease-out),
    border-color var(--duration-fast) var(--ease-out);
  --transition-control: var(--transition-color),
    box-shadow var(--duration-fast) var(--ease-out),
    transform var(--duration-fast) var(--ease-out);
}

/* 浅色主题的所有页面顶栏统一落在同一张云白纸面；深色主题继续使用原有深色表面。 */
:root[data-shrimp="finance"][data-theme="light"] .hdr {
  background:var(--paper);
}

@media (prefers-color-scheme: light) {
  :root[data-shrimp="finance"]:not([data-theme]) .hdr {
    background:var(--paper);
  }
}

html {
  font-size: var(--text-body);
  background: var(--paper);
  color: var(--ink);
}

body {
  background: var(--paper);
  color: var(--ink);
}

/*
 * 对账页只保留 #content 这一条纵向滚动主轴，避免 body 与内容区的双滚动
 * 让左侧账户摘要卡始终以用户正在滚动的容器为 sticky 参照。
 */
body:has(#content.reconcile-mode) {
  height: 100vh;
  overflow: hidden;
}

body:has(#content.reconcile-mode) .main-wrap {
  height: 100vh;
  min-height: 0;
}

#content.reconcile-mode {
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: auto;
}

#content.reconcile-mode .rc-panel {
  position: sticky;
  top: 14px;
  z-index: 12;
  align-self: start;
  height: max-content;
}

/* 对账页已有自己的上下跳转提示，只保留这一组，避免与全局提示重复。 */
body:has(#content.reconcile-mode) #scroll-fab {
  display: none !important;
}

/* 进入单列布局后卡片不再占据视口，避免遮挡下方对账流水。 */
@media (max-width: 980px) {
  #content.reconcile-mode .rc-panel {
    position: static;
    top: auto;
    z-index: auto;
  }
}

/*
 * 流水页采用唯一滚动主轴：
 * - 全局顶栏固定在 #content 之外，只有 #content 承担页面纵向滚动；
 * - .tx-scroll 不再形成内部滚动容器，流水卡随完整内容自适应增高；
 * - 清单表头在页面滚动主轴内保持 sticky；
 * - stable gutter 让全部/按月、噪声显隐切换时工具区和表格宽度不抖动。
 */
body:has(#content.transactions-mode) {
  height: 100vh;
  overflow: hidden;
}

body:has(#content.transactions-mode) .main-wrap {
  height: 100vh;
  min-height: 0;
}

#content.transactions-mode {
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
}

#content.transactions-mode > .tx-page {
  min-height: 0;
  height:auto!important;
  container: transactions-page / inline-size;
}

/* 工具块没有批量区时直接衔接表头；批量区出现后由真实内容高度自然推开清单。 */
#content.transactions-mode > .tx-page.workspace-layout-grid {
  --workspace-gap:0px;
  row-gap:0!important;
}

#content.transactions-mode .tx-scroll {
  min-height: 0;
  overflow: visible !important;
  overscroll-behavior: contain;
}

#content.transactions-mode .tx-list-thead {
  top:var(--transactions-sticky-offset,var(--workspace-sticky-toolbar-offset,0px));
  z-index:20;
}

#content.transactions-mode > .tx-page > [data-workspace-block="controls"] {
  position: sticky !important;
  top: 0;
  z-index: 30;
  align-self: start;
  contain:none;
  container-type:normal;
  overflow: visible;
  background:var(--paper);
  box-shadow:0 8px 16px color-mix(in srgb,var(--paper) 92%,transparent);
}

#content.transactions-mode .tx-filter-panel {
  position: relative;
  z-index: 50;
}

#content.transactions-mode .tx-selbar {
  position: relative;
  z-index: 20;
}

/* 流水页保留自身分离式上下跳转按钮，隐藏全局连体浮钮，避免出现两套进度/跳转提示。 */
body:has(#content.transactions-mode) #scroll-fab {
  display:none!important;
}

/* 通知落在动态工具条之后，布局保存提示不再遮住首排按钮。 */
body:has(#content.transactions-mode) #toast-container {
  top:var(--transactions-toast-top,72px);
}

/* sticky 表头向上铺一段不透明纸面，遮住网格间距内向上滚动的流水字样。 */
#content.transactions-mode .tx-list-thead::before {
  content:"";
  position:absolute;
  left:-2px;
  right:-2px;
  bottom:calc(100% - 2px);
  height:8px;
  background:var(--paper);
  pointer-events:none;
}

/* 设置页只保留 #content 这一条纵向主轴，不显示通用的上下跳转浮钮。 */
body:has(#content.settings-page-mode) {
  height:100vh;
  overflow:hidden;
}

body:has(#content.settings-page-mode) .main-wrap {
  height:100vh;
  min-height:0;
}

#content.settings-page-mode {
  min-height:0;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
}

body:has(#content.settings-page-mode) #scroll-fab {
  display:none!important;
}

/* 分页只保留文字与页码控件，不再制造第二张填充卡。 */
#content.transactions-mode .qel-pager {
  padding:10px 0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

#content.transactions-mode .tx-filter-primary {
  display:grid;
  grid-template-columns:max-content minmax(0,1fr);
  align-items:center;
  gap:8px 12px;
}

#content.transactions-mode .tx-filter-meta {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  justify-self:end;
  flex-wrap:nowrap;
}

/* 只有真实可用宽度不足时才派生换行；桌面保持用户指定的四排工具层。 */
@container transactions-page (max-width: 900px) {
  #content.transactions-mode .tx-filter-primary {
    grid-template-columns: minmax(0, 1fr);
  }

  #content.transactions-mode .tx-filter-meta {
    justify-self:end;
  }

  #content.transactions-mode .tx-filter-context {
    grid-template-columns:minmax(0,1fr);
  }

  #content.transactions-mode .tx-context-actions {
    justify-self:stretch;
  }

  #content.transactions-mode .tx-filter-count {
    margin-right:auto;
  }
}

/* 侧栏存在时按流水工作区实宽派生列，而不是按 viewport 猜测；只改可见性，不改冻结行 DOM/列语义。 */
@container transactions-page (max-width: 820px) {
  #content.transactions-mode .qel-c-tag,
  #content.transactions-mode .qel-c-prj,
  #content.transactions-mode .qel-c-note {
    display:none;
  }
}

/* 暗态台账改用纸面与表面色的中性混合；选中控件统一采用页码当前项的主色底 / 白字。 */
:root[data-shrimp="finance"][data-theme="dark"] #content.transactions-mode .tx-list-body {
  background:color-mix(in srgb,var(--surface) 42%,var(--paper));
}

:root[data-shrimp="finance"][data-theme="dark"] #content.transactions-mode .tx-list-thead,
:root[data-shrimp="finance"][data-theme="dark"] #content.transactions-mode .tx-ghdr2 {
  background:color-mix(in srgb,var(--surface) 54%,var(--paper));
}

:root[data-shrimp="finance"][data-theme="dark"] #content.transactions-mode .qel-row:hover {
  background:color-mix(in srgb,var(--surface-2) 34%,var(--paper));
}

:root[data-shrimp="finance"][data-theme="dark"] #content.transactions-mode .qel-row.sel,
:root[data-shrimp="finance"][data-theme="dark"] #content.transactions-mode .qel-row.sel:hover {
  background:color-mix(in srgb,var(--primary) 24%,var(--paper));
}

:root[data-shrimp="finance"][data-theme="dark"] #content.transactions-mode .fchip.on,
:root[data-shrimp="finance"][data-theme="dark"] #content.transactions-mode .tx-fp-btn.on,
:root[data-shrimp="finance"][data-theme="dark"] #content.transactions-mode .tx-fp-btn.act,
:root[data-shrimp="finance"][data-theme="dark"] #content.transactions-mode .qel-colopt.on {
  border-color:var(--primary);
  background:var(--primary);
  color:var(--on-accent,#fff);
}

button,
input,
select,
textarea {
  font-family: var(--sans);
}

:focus-visible {
  outline-color: var(--accent);
}

input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline-color: color-mix(in srgb, var(--accent) 42%, transparent);
}

:root[data-shrimp="finance"] ::selection {
  background: var(--finance-selection-bg);
  color: var(--finance-selection-ink);
}

@media (prefers-color-scheme: dark) {
  :root[data-shrimp="finance"]:not([data-theme]) {
    --paper: var(--finance-dark-paper);
    --surface: var(--finance-dark-surface);
    --surface-2: var(--finance-dark-surface-2);
    --finance-surface-raised: var(--finance-dark-surface-raised);
    --field-bg: var(--finance-dark-field);
    --ink: var(--finance-dark-ink);
    --ink-2: var(--finance-dark-ink-2);
    --ink-3: var(--finance-dark-ink-3);
    --line: var(--finance-dark-line);
    --line-2: var(--finance-dark-line-2);
    --accent: var(--finance-dark-accent);
    --accent-hover: var(--finance-dark-accent-hover);
    --accent-action: var(--finance-dark-accent-action);
    --accent-soft: var(--finance-dark-accent-soft);
    --on-accent: #ffffff;
    --on-accent-action: #ffffff;
    --hero-bg: var(--finance-dark-hero);
    --hero-subtle: rgb(235 244 255 / 78%);
    --hero-line: rgb(186 214 255 / 24%);
    --hero-panel: rgb(2 14 35 / 30%);
    --finance-navigation: var(--finance-dark-navigation);
    --gold: var(--finance-dark-gold);
    --gold-bright: var(--finance-dark-gold-bright);
    --gold-soft: var(--finance-dark-gold-soft);
    --ok: var(--finance-dark-ok);
    --ok-soft: var(--finance-dark-ok-soft);
    --on-ok: #031913;
    --warn: var(--finance-dark-warn);
    --warn-soft: var(--finance-dark-warn-soft);
    --bad: var(--finance-dark-bad);
    --bad-soft: var(--finance-dark-bad-soft);
    --on-bad: #21060a;
    --info: var(--finance-dark-info);
    --info-soft: var(--finance-dark-info-soft);
    --finance-rise: var(--finance-dark-bad);
    --finance-fall: var(--finance-dark-ok);
    --shadow-card: 0 1px 0 rgb(126 171 238 / 9%), 0 14px 30px rgb(0 0 0 / 28%);
    --shadow-float: 0 1px 0 rgb(145 184 241 / 12%), 0 18px 42px rgb(0 0 0 / 38%);
    --shadow-drawer: 0 1px 0 rgb(160 194 244 / 14%), 0 28px 72px rgb(0 0 0 / 52%);
    --finance-toast-ok-bg: #2bcf9b;
    --finance-toast-ok-ink: #031913;
    --finance-toast-warn-bg: #f5ae42;
    --finance-toast-warn-ink: #211300;
    --finance-toast-bad-bg: #f05b68;
    --finance-toast-bad-ink: #21060a;
    --finance-toast-info-bg: #2f72d6;
    --finance-toast-info-ink: #ffffff;
    --finance-toast-line: rgb(255 255 255 / 24%);
    --finance-selection-bg: #2b62ae;
    --finance-selection-ink: #ffffff;
  }
}

:root[data-shrimp="finance"][data-theme="dark"] {
  --paper: var(--finance-dark-paper);
  --surface: var(--finance-dark-surface);
  --surface-2: var(--finance-dark-surface-2);
  --finance-surface-raised: var(--finance-dark-surface-raised);
  --field-bg: var(--finance-dark-field);
  --ink: var(--finance-dark-ink);
  --ink-2: var(--finance-dark-ink-2);
  --ink-3: var(--finance-dark-ink-3);
  --line: var(--finance-dark-line);
  --line-2: var(--finance-dark-line-2);
  --accent: var(--finance-dark-accent);
  --accent-hover: var(--finance-dark-accent-hover);
  --accent-action: var(--finance-dark-accent-action);
  --accent-soft: var(--finance-dark-accent-soft);
  --on-accent: #ffffff;
  --on-accent-action: #ffffff;
  --hero-bg: var(--finance-dark-hero);
  --hero-subtle: rgb(235 244 255 / 78%);
  --hero-line: rgb(186 214 255 / 24%);
  --hero-panel: rgb(2 14 35 / 30%);
  --finance-navigation: var(--finance-dark-navigation);
  --gold: var(--finance-dark-gold);
  --gold-bright: var(--finance-dark-gold-bright);
  --gold-soft: var(--finance-dark-gold-soft);
  --ok: var(--finance-dark-ok);
  --ok-soft: var(--finance-dark-ok-soft);
  --on-ok: #031913;
  --warn: var(--finance-dark-warn);
  --warn-soft: var(--finance-dark-warn-soft);
  --bad: var(--finance-dark-bad);
  --bad-soft: var(--finance-dark-bad-soft);
  --on-bad: #21060a;
  --info: var(--finance-dark-info);
  --info-soft: var(--finance-dark-info-soft);
  --finance-rise: var(--finance-dark-bad);
  --finance-fall: var(--finance-dark-ok);
  --shadow-card: 0 1px 0 rgb(126 171 238 / 9%), 0 14px 30px rgb(0 0 0 / 28%);
  --shadow-float: 0 1px 0 rgb(145 184 241 / 12%), 0 18px 42px rgb(0 0 0 / 38%);
  --shadow-drawer: 0 1px 0 rgb(160 194 244 / 14%), 0 28px 72px rgb(0 0 0 / 52%);
  --finance-toast-ok-bg: #2bcf9b;
  --finance-toast-ok-ink: #031913;
  --finance-toast-warn-bg: #f5ae42;
  --finance-toast-warn-ink: #211300;
  --finance-toast-bad-bg: #f05b68;
  --finance-toast-bad-ink: #21060a;
  --finance-toast-info-bg: #2f72d6;
  --finance-toast-info-ink: #ffffff;
  --finance-toast-line: rgb(255 255 255 / 24%);
  --finance-selection-bg: #2b62ae;
  --finance-selection-ink: #ffffff;
}

.toast {
  border: 1px solid var(--finance-toast-line);
  box-shadow: var(--finance-toast-shadow), inset 0 1px 0 rgb(255 255 255 / 12%);
}

.toast.ok {
  background: var(--finance-toast-ok-bg);
  color: var(--finance-toast-ok-ink);
}

.toast.warn {
  background: var(--finance-toast-warn-bg);
  color: var(--finance-toast-warn-ink);
}

.toast.err {
  background: var(--finance-toast-bad-bg);
  color: var(--finance-toast-bad-ink);
}

.toast.info {
  background: var(--finance-toast-info-bg);
  color: var(--finance-toast-info-ink);
}

.amt.inc,
.ti-inc {
  color: var(--finance-income);
}

.amt.exp,
.ti-exp {
  color: var(--finance-expense);
}

.tx-table tbody tr,
.qel-table tbody tr {
  height: var(--finance-ledger-row);
}

.qel-row {
  min-height: var(--finance-ledger-row);
  padding-block: 6px;
}

.tx-table,
.qel-table,
.amt,
[data-money] {
  font-variant-numeric: tabular-nums;
}

.sidebar.env-dev {
  background: var(--finance-navigation);
  color: var(--on-finance-navigation);
}

/* 将遗留的硬编码亮色表面收回语义层，保证显式暗态和系统暗态共用一套结果。 */
.asset-card,
.asset-search:focus-within,
.asset-inline-grid .fi,
.asset-inline-grid-edit .asset-edit-preview,
.acm-tab.on .acm-tab-cnt,
.rc-date-filter.on,
.settings-ledger-stats div.primary {
  background: var(--surface);
}

.ni.prim,
.lk-cyc.on,
.qle-feature-btn.on,
.qle-fixed-btn.on,
.qle-amort-btn.on,
.qel-pgbtn.on,
.btn-p,
.asset-disp-on,
.rc-panel-card,
.rec-component-tabs button.on,
.rwaf-feat.on,
.cal-day.cal-sel,
.cal-mon.cal-sel,
.cal-yr.cal-sel,
.settings-admin-nav nav > button.on {
  color: var(--on-accent);
}

.btn-d,
.btn-delete,
.qle-action-btn.danger {
  color: var(--on-bad);
}

.btn-ok {
  color: var(--on-ok);
}

.hero-card,
.asset-hero,
.loan-hero,
.report-hero,
.rc-panel-card,
.bdg-summary,
.rec-overview,
.settings-hero-main,
.settings-ledger-hero {
  background: var(--hero-bg);
  color: var(--hero-foreground, #ffffff);
}

.acm-nw,
.aa-detail-card,
.home-budget {
  background: var(--hero-bg);
  color: var(--hero-foreground, #ffffff);
}

.report-hero-stats .report-metric b.income {
  color: var(--finance-income);
}

.report-hero-stats .report-metric b.expense {
  color: var(--finance-expense);
}

/* R2-C · 对账证据工作区：账户/范围只保留一个工具面，直属证据与其无缝衔接。 */
#content.reconcile-mode .rc-split.workspace-layout-grid {
  --workspace-gap: 0px;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  grid-auto-rows: 4px;
  column-gap: 12px !important;
  row-gap: 0 !important;
  height: auto !important;
  align-items: start;
}

#content.reconcile-mode .rc-split > [data-workspace-block] {
  min-width: 0;
}

#content.reconcile-mode .rc-split > [data-workspace-block="controls"] {
  position: sticky !important;
  top: 0;
  z-index: 30;
  align-self: start;
  height: auto !important;
  overflow: visible !important;
  contain: none;
  container-type: normal;
  background: var(--paper);
}

#content.reconcile-mode .rc-split > [data-workspace-block="evidence"] {
  align-self: start;
  height: auto !important;
  overflow: visible !important;
}

@media (min-width: 1101px) {
  /* v2 仍保留旧工具条的 24 个网格行；单排工具条只占 13 行，证据按实测底边派生，且不改写保存布局。 */
  #content.reconcile-mode .rc-split > [data-workspace-block="evidence"] {
    --workspace-row-start: 14 !important;
    margin-top: -4px;
  }
}

#content.reconcile-mode .rc-account-summary {
  display: grid;
  min-width: 0;
  gap: 6px;
  margin-bottom: 15px;
}

#content.reconcile-mode .rc-account-summary > label {
  color: color-mix(in srgb, var(--on-accent) 72%, transparent);
  font-size: 11px;
  font-weight: 760;
  letter-spacing: .08em;
}

#content.reconcile-mode .rc-account-summary > .fi {
  width: 100%;
  min-width: 0;
  min-height: 40px;
  color: var(--text);
  background: var(--paper);
}

#content.reconcile-mode .rc-account-summary > small {
  color: color-mix(in srgb, var(--on-accent) 78%, transparent);
  font-size: 12px;
  font-weight: 620;
}

#content.reconcile-mode .rc-panel-stmt .rc-stmt-brk {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

#content.reconcile-mode .rc-panel-stmt .rc-stmt-section {
  padding: 9px 0;
  border-top: 1px solid color-mix(in srgb, var(--on-accent) 34%, transparent);
}

#content.reconcile-mode .rc-panel-stmt .rc-stmt-section:first-child {
  padding-top: 9px;
}

#content.reconcile-mode .rc-panel-stmt .rc-stmt-section:last-child {
  padding-bottom: 9px;
}

#content.reconcile-mode .rc-panel-stmt .rc-stmt-row {
  padding: 3px 0;
}

#content.reconcile-mode .rc-panel-stmt .rc-stmt-row.strong {
  margin-top: 0;
  padding-top: 3px;
  border-top: 0;
}

#content.reconcile-mode .rc-panel-stmt .rc-stmt-row.strong + .rc-stmt-row {
  margin-top: 4px;
}

#content.reconcile-mode .rc-panel-stmt .rc-prog-lbl {
  margin-top: 0;
  padding-top: 11px;
  border-top: 1px solid color-mix(in srgb, var(--on-accent) 34%, transparent);
}

#content.reconcile-mode .rc-evidence-toolbar {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 8px;
  padding: 0 0 8px;
  overflow-x: auto;
  overflow-y: hidden;
  border: 0;
  border-radius: 0;
  background: var(--paper);
  scrollbar-width: thin;
}

#content.reconcile-mode .rc-evidence-toolbar .rc-list-filter {
  flex: 0 0 auto;
  width: auto;
  min-width: 0;
  align-items: center;
  margin: 0;
}

#content.reconcile-mode .rc-evidence-toolbar .rc-list-filter,
#content.reconcile-mode .rc-evidence-toolbar .rc-time-filter {
  position: relative;
  isolation: isolate;
  height: 40px;
  min-height: 40px;
  gap: 4px;
  padding: 3px;
  border: 0;
  border-radius: var(--radius-10);
  background: var(--surface-2);
}

#content.reconcile-mode .rc-evidence-toolbar .rc-segment-glider {
  position: absolute;
  z-index: 0;
  pointer-events: none;
  border: 1px solid var(--border-soft, var(--border));
  border-radius: var(--radius-10);
  background: var(--surface);
  box-shadow: var(--shadow-m);
  transform: translateY(1px) scaleY(1.04);
  transform-origin: center;
  will-change: left, top, width, height;
}

#content.reconcile-mode .rc-evidence-toolbar :is(.rc-list-filter, .rc-time-filter) > :is(button, .rc-date-filter) {
  position: relative;
  z-index: 1;
}

#content.reconcile-mode .rc-evidence-toolbar :is(.rc-list-filter, .rc-time-filter) > :is(button.on, .rc-date-filter.on) {
  background: transparent !important;
  box-shadow: none !important;
}

#content.reconcile-mode .rc-evidence-toolbar :is(.rc-list-filter, .rc-time-filter) > .tab-ink {
  display: none !important;
}

#content.reconcile-mode .rc-evidence-toolbar .pill-tab,
#content.reconcile-mode .rc-evidence-toolbar .rc-time-filter button,
#content.reconcile-mode .rc-evidence-toolbar .rc-actions .btn,
#content.reconcile-mode .rc-evidence-toolbar .rec-lock-inline {
  min-height: 40px;
}

#content.reconcile-mode .rc-evidence-toolbar .rc-actions .btn,
#content.reconcile-mode .rc-evidence-toolbar .rec-lock-inline {
  border-radius: var(--radius-control);
}

#content.reconcile-mode .rc-evidence-toolbar .pill-tab {
  justify-content: center;
  min-width: 66px;
  padding: 0 12px;
  border: 0;
  font: inherit;
  font-size: 13px;
  font-weight: 720;
  cursor: pointer;
}

#content.reconcile-mode .rc-evidence-toolbar .rc-time-filter {
  flex: 0 1 auto;
  min-width: 0;
  align-items: center;
}

#content.reconcile-mode .rc-evidence-toolbar .rc-time-filter > button {
  min-width: 68px;
  padding-inline: 10px;
  white-space: nowrap;
}

#content.reconcile-mode .rc-evidence-toolbar .rc-date-filter {
  height: 40px;
  min-height: 40px;
  background: transparent;
  box-shadow: none;
}

#content.reconcile-mode .rc-evidence-toolbar .rc-date-filter.on {
  background: var(--surface);
  box-shadow: var(--shadow-0);
}

#content.reconcile-mode .rc-evidence-toolbar .rc-date-filter .rec-mn-cal .cal-trigger,
#content.reconcile-mode .rc-evidence-toolbar .rc-date-filter .rec-mn-cal .cal-trigger:hover,
#content.reconcile-mode .rc-evidence-toolbar .rc-date-filter .rec-mn-cal .cal-trigger:focus {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: inherit !important;
}

#content.reconcile-mode .rc-evidence-toolbar .rc-stmt-nav {
  position: relative;
  flex: 0 1 276px;
  min-width: 252px;
  max-width: 292px;
}

#content.reconcile-mode .rc-evidence-toolbar .rc-stmt-trigger {
  display: inline-flex;
  flex: 1 1 auto;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  height: 40px;
  min-height: 40px;
  padding: 0 11px 0 13px;
  border: 1px solid var(--border);
  border-radius: var(--radius-control);
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-size: 13px;
  font-weight: 680;
  cursor: pointer;
  box-shadow: var(--shadow-0);
}

#content.reconcile-mode .rc-evidence-toolbar .rc-stmt-trigger > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#content.reconcile-mode .rc-evidence-toolbar .rc-stmt-trigger > i {
  flex: 0 0 auto;
  color: var(--text-3);
  transition: transform var(--dur-ui) var(--ease-spring);
}

#content.reconcile-mode .rc-evidence-toolbar .rc-stmt-trigger[aria-expanded="true"] > i {
  transform: rotate(180deg);
}

#content.reconcile-mode .rc-evidence-toolbar .rc-stmt-trigger:hover:not(:disabled),
#content.reconcile-mode .rc-evidence-toolbar .rc-stmt-trigger:focus-visible {
  border-color: var(--primary);
}

#content.reconcile-mode .rc-evidence-toolbar .rc-stmt-step {
  flex: 0 0 44px;
  width: 44px;
  height: 40px;
  min-height: 40px;
  padding: 0;
}

#content.reconcile-mode .rc-stmt-menu[hidden] {
  display: none;
}

#content.reconcile-mode .rc-stmt-menu {
  position: fixed;
  z-index: 220;
  overflow: hidden;
  padding: 6px;
  border: 1px solid var(--border);
  border-radius: var(--radius-14);
  background: var(--surface);
  box-shadow: var(--shadow-l);
}

#content.reconcile-mode .rc-stmt-list {
  display: grid;
  gap: 3px;
  max-height: 708px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--scrollbar-thumb-idle) transparent;
}

#content.reconcile-mode .rc-stmt-list::-webkit-scrollbar {
  width: 8px;
}

#content.reconcile-mode .rc-stmt-list::-webkit-scrollbar-thumb {
  min-height: 32px;
  border: 2px solid transparent;
  border-radius: var(--radius-full);
  background: var(--scrollbar-thumb-idle);
  background-clip: padding-box;
}

#content.reconcile-mode .rc-stmt-option {
  display: grid;
  gap: 7px;
  width: 100%;
  padding: 10px 11px;
  border: 0;
  border-radius: var(--radius-10);
  background: transparent;
  color: var(--text);
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}

#content.reconcile-mode .rc-stmt-option:hover,
#content.reconcile-mode .rc-stmt-option:focus-visible {
  background: var(--surface-2);
}

#content.reconcile-mode .rc-stmt-option.is-selected {
  background: var(--surface-2);
  box-shadow: inset 3px 0 0 var(--primary);
}

#content.reconcile-mode .rc-stmt-option-head,
#content.reconcile-mode .rc-stmt-option-metrics,
#content.reconcile-mode .rc-stmt-option-progress > span:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

#content.reconcile-mode .rc-stmt-option-head strong {
  min-width: 0;
  overflow: hidden;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#content.reconcile-mode .rc-stmt-option-metrics {
  color: var(--text-3);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

#content.reconcile-mode .rc-stmt-option-metrics b {
  color: var(--text-2);
  font-weight: 720;
}

#content.reconcile-mode .rc-stmt-option-progress {
  display: grid;
  gap: 4px;
  color: var(--text-3);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}

#content.reconcile-mode .rc-stmt-option-progress .prog-track {
  height: 4px;
  margin: 0;
  background: var(--surface-3, var(--gray-200));
}

#content.reconcile-mode .rc-stmt-menu-empty {
  padding: 18px;
  color: var(--text-3);
  font-size: 13px;
  text-align: center;
}

#content.reconcile-mode .rc-evidence-toolbar .rc-actions {
  display: flex;
  flex: 0 0 auto;
  margin-left: auto;
  width: auto;
  align-items: center;
  gap: 8px;
  justify-content: flex-end;
  flex-wrap: nowrap;
}

#content.reconcile-mode .rc-reconcile-split {
  position: relative;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: stretch;
}

#content.reconcile-mode .rc-evidence-toolbar .rc-actions .rc-reconcile-split .rc-reconcile-main {
  border-radius: var(--radius-control) 0 0 var(--radius-control);
}

#content.reconcile-mode .rc-reconcile-more {
  display: inline-flex;
  width: 40px;
  min-width: 40px;
  height: 40px;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-left: 1px solid color-mix(in srgb, var(--on-accent) 30%, transparent);
  border-radius: 0 var(--radius-control) var(--radius-control) 0;
  background: var(--primary);
  color: var(--on-accent);
  font: inherit;
  cursor: pointer;
}

#content.reconcile-mode .rc-reconcile-more:hover,
#content.reconcile-mode .rc-reconcile-more[aria-expanded="true"] {
  background: color-mix(in srgb, var(--primary) 88%, black);
}

#content.reconcile-mode .rc-reconcile-more:focus-visible {
  position: relative;
  z-index: 1;
  outline: 2px solid var(--focus-ring, var(--primary));
  outline-offset: 2px;
}

#content.reconcile-mode .rc-reconcile-more > i {
  transition: transform var(--dur-ui) var(--ease-spring);
}

#content.reconcile-mode .rc-reconcile-more[aria-expanded="true"] > i {
  transform: rotate(180deg);
}

#content.reconcile-mode .rc-reconcile-menu[hidden] {
  display: none;
}

#content.reconcile-mode .rc-reconcile-menu {
  position: fixed;
  z-index: 230;
  display: grid;
  gap: 3px;
  padding: 6px;
  border: 1px solid var(--border);
  border-radius: var(--radius-12);
  background: var(--surface);
  box-shadow: var(--shadow-l);
}

#content.reconcile-mode .rc-reconcile-menu-item {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr) 18px;
  min-height: 40px;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  border: 0;
  border-radius: var(--radius-control);
  background: transparent;
  color: var(--text);
  font: inherit;
  font-size: 13px;
  font-weight: 680;
  text-align: left;
  cursor: pointer;
}

#content.reconcile-mode .rc-reconcile-menu-item > i:first-child {
  color: var(--text-2);
  font-size: 16px;
}

#content.reconcile-mode .rc-reconcile-menu-item > i:last-child {
  color: var(--primary);
}

#content.reconcile-mode .rc-reconcile-menu-item:hover:not(:disabled),
#content.reconcile-mode .rc-reconcile-menu-item:focus-visible {
  background: var(--surface-2);
}

#content.reconcile-mode .rc-reconcile-menu-item.on {
  background: var(--primary-light);
  color: var(--primary);
}

#content.reconcile-mode .rc-reconcile-menu-item:disabled {
  opacity: .46;
  cursor: not-allowed;
}

#content.reconcile-mode .rc-evidence-fit {
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: var(--radius-14);
  background: var(--surface);
}

#content.reconcile-mode .rc-evidence-fit[data-reconcile-evidence-state="error"] {
  border-color: color-mix(in srgb, var(--amber) 56%, var(--border));
}

#content.reconcile-mode .rc-evidence-fit[data-reconcile-locked="true"] {
  box-shadow: inset 3px 0 0 color-mix(in srgb, var(--primary) 72%, transparent);
}

#content.reconcile-mode .rc-evidence-fit .rec-component-console {
  margin: 0;
  overflow: visible;
  border: 0;
  border-bottom: 1px solid var(--border);
  border-radius: 0;
}

#content.reconcile-mode .rc-evidence-fit .rec-component-list {
  max-height: none;
  overflow: visible;
  overscroll-behavior: auto;
}

#content.reconcile-mode .rc-evidence-fit .rec-table {
  overflow: visible;
  border-radius: 0 0 var(--radius-14) var(--radius-14);
  background: transparent;
  box-shadow: none;
}

#content.reconcile-mode .rc-evidence-fit .rec-thdr {
  position: sticky;
  top: var(--workspace-sticky-toolbar-offset, 0px);
  z-index: 20;
  background: var(--surface-2, var(--gray-50));
}

#content.reconcile-mode .rc-evidence-fit .rec-thdr::before {
  content: "";
  position: absolute;
  right: -1px;
  bottom: calc(100% - 1px);
  left: -1px;
  height: 3px;
  background: var(--paper);
}

#content.reconcile-mode .rc-evidence-fit .qel-pager {
  margin: 0;
  border: 0;
  border-top: 1px solid var(--border);
  border-radius: 0 0 var(--radius-14) var(--radius-14);
  box-shadow: none;
}

@media (max-width: 1100px) {
  #content.reconcile-mode .rc-split.workspace-layout-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-auto-rows: auto !important;
    column-gap: 0 !important;
    row-gap: 0 !important;
  }

  #content.reconcile-mode .rc-split > [data-workspace-block="accounts"] {
    margin-bottom: 10px;
  }

  #content.reconcile-mode .rc-split > [data-workspace-block="controls"] {
    position: static !important;
    top: auto;
    z-index: auto;
  }

  #content.reconcile-mode .rc-panel {
    position: static;
    top: auto;
    z-index: auto;
  }

  #content.reconcile-mode .rc-evidence-fit .rec-thdr {
    top: 0;
  }

}

@media (max-width: 900px) {
  #content.reconcile-mode .rc-evidence-toolbar {
    padding-bottom: 7px;
  }

  #content.reconcile-mode .rc-evidence-toolbar .rc-stmt-nav {
    flex-basis: 252px;
    min-width: 240px;
  }
}

@media (max-width: 760px) {
  #content.reconcile-mode .rc-evidence-toolbar {
    padding-bottom: 6px;
  }
}

/* 2026-08-23 · 普通单笔行内编辑器：辅助属性改为无标签、无框下拉，状态紧跟主体。 */
.qle-redesign .qle-orderprops {
  gap: 8px 12px;
}

.qle-redesign .lk-combo-wrap {
  min-height: 36px;
  padding: 0 4px 0 2px;
  border-radius: var(--radius-8, 8px);
  background: transparent;
  transition: background-color var(--dur-fast, 120ms), box-shadow var(--dur-fast, 120ms);
}

.qle-redesign .lk-combo-wrap:hover {
  background: var(--surface-soft, var(--gray-50));
}

.qle-redesign .lk-combo-wrap:focus-within {
  background: var(--surface);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 24%, transparent);
}

.qle-redesign .lk-combo-arr {
  transition: color var(--dur-fast, 120ms);
}

.qle-redesign .lk-combo-wrap:hover .lk-combo-arr,
.qle-redesign .lk-combo-wrap:focus-within .lk-combo-arr {
  color: var(--primary);
}

.qle-redesign .lk-combo {
  height: 36px;
  border: 0;
  background: transparent;
  border-radius: var(--radius-6, 6px);
  padding: 0 2px;
}

.qle-redesign .lk-combo:hover,
.qle-redesign .lk-combo:focus {
  border: 0;
  background: transparent;
}

.qle-redesign .qle-footer-state {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 36px;
}

.qle-redesign .qle-footer-state > .lk-statebtn {
  height: 36px;
  min-width: 68px;
  padding: 0 13px;
}

.qle-redesign .lk-kindcell-footer {
  display: none;
}

@media (prefers-reduced-motion: reduce) {
  #content.reconcile-mode .rc-evidence-toolbar .rc-segment-glider {
    will-change: auto;
  }

  #content.reconcile-mode .rc-evidence-toolbar .rc-stmt-trigger > i,
  #content.reconcile-mode .rc-stmt-option,
  #content.reconcile-mode .rc-reconcile-more > i {
    transition-duration: 1ms;
  }

  .sidebar,
  .main-wrap,
  .sw-slide > i,
  .settings-switch,
  .settings-switch > i,
  #content.reconcile-mode .rec-row,
  #content.reconcile-mode .rec-component-chevron,
  #content.reconcile-mode .rc-mlock {
    transition-duration: 1ms;
  }
}
}