/* 鱼宝账本 —— 绘本风（奶油纸底 #FBF3E1 / 深褐墨 #3D3229 / 暖橙主色 #F0913C / 蜡笔色分类 / 硬描边 + 硬投影） */
* { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }
:root {
  --bg: #FBF3E1; --card: #FFFDF7; --ink: #3D3229; --sub: #8A7A66; --sub2: #B4A48C;
  --pri: #F0913C; --pri-d: #C9681F; --pri-ink: #FFFFFF; --pri-soft: #FFF1E0;
  --ok: #3F9D6A; --bad: #C0492B; --warn: #D9481F; --warn-s: #FCE9E2;
  --income: #3F8E2E; --income-s: #EAF6E0;
  --track: #F1E6D4; --line: #EFE4D2; --line-2: #F8F2E7;
  --sh: 0 3px 0 rgba(61,50,41,.12);          /* 硬投影：零模糊 */
  --r-sm: 10px; --r: 14px; --r-lg: 20px;
  --c1: #F0913C; --c1s: #FDEBD8; --c2: #3E92E0; --c2s: #E2F0FB;
  --c3: #9B6DD3; --c3s: #F0E9FA; --c4: #EE6B7E; --c4s: #FCE6EA;
  --c5: #4FB38A; --c5s: #E5F4ED; --c6: #5C7FE0; --c6s: #E6EBFB;
  --c7: #E8A93C; --c7s: #FBF0D8; --c8: #B08968; --c8s: #F2EAE3;
  --amt-exp: var(--ink);                       /* 支出金额用深褐，不刺眼红 */
  --h1-font: "Yuanti SC", "YouYuan", "PingFang SC", "Microsoft YaHei", sans-serif;
}
html, body { height: 100%; }
body {
  font-family: var(--h1-font);
  background: var(--bg); color: var(--ink); font-size: 15px; line-height: 1.5;
}
#app { max-width: 560px; margin: 0 auto; min-height: 100vh; display: flex; flex-direction: column; }

/* 顶栏 */
#topbar {
  position: sticky; top: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px; background: var(--card); border-bottom: 2px solid var(--ink);
}
#topbar .brand { font-weight: 700; font-size: 16px; display: flex; align-items: center; gap: 8px; min-width: 0; flex: 1; }
/* 品牌标：橙底 ¥ 圆角方块（原型 .app-head .brand i） */
#topbar .brand .brand-mark {
  width: 26px; height: 26px; border-radius: 9px; background: var(--pri); color: #fff;
  border: 2px solid var(--ink); display: inline-flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 700; flex-shrink: 0; line-height: 1;
}
#topbar .brand-name { font-family: var(--h1-font); color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#topbar .who { font-size: 13px; color: var(--sub); display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
#topbar .who .who-name { white-space: nowrap; }
#topbar .avatar {
  width: 28px; height: 28px; border-radius: 50%; background: var(--pri-soft);
  border: 2px solid var(--ink); display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0; overflow: hidden; line-height: 0;
}
#topbar .avatar svg { width: 100%; height: 100%; display: block; }
#topbar .back-btn {
  position: absolute; left: 14px; border: 2px solid var(--ink); background: var(--card);
  color: var(--ink); border-radius: 999px; padding: 4px 12px; font-size: 13px; font-weight: 600;
  box-shadow: var(--sh); cursor: pointer; font-family: var(--h1-font);
}
#topbar .back-btn.hidden { display: none; }

/* 主视图 */
#view { flex: 1; padding: 12px 16px 124px; }
.loading, .error { text-align: center; padding: 48px 16px; color: var(--sub); }
.error .btn { margin-top: 12px; }
.hidden { display: none !important; }

/* 底部 Tab + 记一笔 FAB */
#tabs {
  position: fixed; bottom: 0; left: 50%; transform: translateX(-50%); z-index: 20;
  width: 100%; max-width: 560px; display: flex; align-items: flex-start;
  background: var(--card); border-top: 2px solid var(--ink);
  padding: 7px 6px calc(7px + env(safe-area-inset-bottom));
}
#tabs .tab {
  flex: 1; min-width: 0; border: 0; background: none; padding: 2px 0 0; color: var(--sub2);
  cursor: pointer; font-family: var(--h1-font); display: flex; flex-direction: column;
  align-items: center; gap: 3px; position: relative;
}
#tabs .tab .tab-icon { display: block; line-height: 0; }
#tabs .tab .tab-icon svg { width: 22px; height: 22px; stroke-width: 2.1; display: block; }
#tabs .tab .tab-label { font-size: 10.5px; font-weight: 600; }
#tabs .tab.active { color: var(--ink); }
#tabs .tab.active .tab-label { font-weight: 700; }
/* 激活指示条（原型 .tab.on::before） */
#tabs .tab.active::before {
  content: ""; position: absolute; top: -7px; left: 50%; transform: translateX(-50%);
  width: 18px; height: 3px; border-radius: 0 0 3px 3px; background: var(--pri);
}

/* 记一笔 FAB：底栏中央向上凸起，与原型一致 */
#tabs .fab {
  position: relative; left: auto; bottom: auto; transform: none;
  flex: 0 0 auto; width: 58px; height: 58px; border-radius: 50%;
  background: var(--pri); color: var(--pri-ink);
  border: 3px solid var(--ink); box-shadow: 0 4px 0 var(--ink);
  cursor: pointer; margin: -22px 6px 0; padding-bottom: 3px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
  font-family: var(--h1-font);
}
#tabs .fab:active { transform: translateY(2px); box-shadow: 0 1px 0 var(--ink); }
#tabs .fab .fab-ico { font-size: 27px; line-height: 1; font-weight: 700; }
#tabs .fab .fab-label { display: none; }

/* 卡片：硬描边 + 硬投影 */
.card { background: var(--card); border: 2px solid var(--ink); border-radius: var(--r-lg); padding: 14px 16px; margin-bottom: 12px; box-shadow: var(--sh); }
.card h3 { font-size: 15px; margin-bottom: 10px; color: var(--ink); font-weight: 700; }
.card-title-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.card-title-row h3 { margin: 0; }
/* 卡片右上角动作（原型 .card-head .more） */
.card-title-row .more { font-size: 12px; color: var(--pri-d); font-weight: 600; cursor: pointer; }
.card-title-row .more.static { color: var(--sub); cursor: default; }

/* 月份条 + 作用域切换（原型 monthbar） */
.monthbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.monthbar .mbtn {
  border: 2px solid var(--ink); background: var(--card); color: var(--ink); border-radius: 999px;
  padding: 6px 13px 6px 10px; font-size: 13px; font-weight: 600; font-family: var(--h1-font); cursor: pointer;
  font-variant-numeric: tabular-nums; box-shadow: 0 2px 0 rgba(61,50,41,.10);
}
.monthbar .mbtn .mbtn-ar { color: var(--sub); font-size: 13px; }
.monthbar .mbtn .mbtn-t { margin: 0 4px; }

/* 月份选择器弹层（自绘，不依赖原生 input[type=month]；沿用 .modal-card 底部抽屉样式） */
.month-card .mc-title { font-family: var(--h1-font); font-size: 16px; margin-bottom: 12px; color: var(--ink); font-weight: 700; }
.month-card .mc-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.month-card .mc-nav {
  width: 34px; height: 34px; border-radius: 50%; border: 2px solid var(--ink); background: var(--card);
  color: var(--ink); font-size: 17px; line-height: 1; cursor: pointer; font-family: var(--h1-font);
  display: flex; align-items: center; justify-content: center; padding-bottom: 2px;
}
.month-card .mc-nav:active { transform: translateY(2px); }
.month-card .mc-year { font-family: var(--h1-font); font-weight: 700; font-size: 15px; color: var(--ink); font-variant-numeric: tabular-nums; }
.month-card .mc-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 12px; }
.month-card .mc-cell {
  border: 2px solid var(--ink); background: var(--card); color: var(--ink); border-radius: 12px;
  padding: 9px 0; font-size: 14px; font-weight: 600; font-family: var(--h1-font); cursor: pointer;
  font-variant-numeric: tabular-nums;
}
.month-card .mc-cell.on { background: var(--pri); color: var(--pri-ink); }
.month-card .mc-cell:active { transform: translateY(2px); }
.monthbar .scope { display: flex; background: var(--pri-soft); border: 2px solid var(--ink); border-radius: 999px; padding: 3px; }
.monthbar .scope button { border: 0; background: none; padding: 5px 13px; border-radius: 999px; font-size: 12.5px; color: var(--sub); cursor: pointer; font-family: var(--h1-font); font-weight: 600; }
.monthbar .scope button.on { background: var(--pri); color: var(--pri-ink); font-weight: 700; }

/* 旧版作用域切换（兼容其它页面） */
.scope-switch { display: flex; background: var(--pri-soft); border: 2px solid var(--ink); border-radius: 999px; padding: 3px; margin-bottom: 12px; }
.scope-switch button { flex: 1; border: 0; background: none; padding: 8px; border-radius: 999px; color: var(--ink); font-size: 14px; cursor: pointer; font-family: var(--h1-font); }
.scope-switch button.active { background: var(--pri); color: var(--pri-ink); font-weight: 700; }

/* 分析页 pills */
.pill-row { display: flex; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.pill { border: 1px solid var(--line); background: var(--card); color: var(--sub); padding: 6px 14px; border-radius: 999px; font-size: 13px; cursor: pointer; font-family: var(--h1-font); }
.pill.active { background: var(--pri); color: var(--pri-ink); border-color: var(--pri-d); font-weight: 600; }
.summary .cell .d { font-size: 11px; margin-top: 2px; color: var(--sub); }
.summary .cell .d.good { color: var(--ok); }
.summary .cell .d.bad { color: var(--bad); }
.item-row .dot { width: 8px; height: 8px; border-radius: 2px; display: inline-block; margin-right: 6px; flex-shrink: 0; }

/* 汇总卡 */
.summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 12px; }
.summary .cell { background: var(--card); border: 2px solid var(--ink); border-radius: var(--r); padding: 12px; text-align: center; min-width: 0; box-shadow: var(--sh); }
.summary .cell .v { font-size: 18px; font-weight: 700; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink); }
.summary .cell .l { font-size: 12px; color: var(--sub); }
.v-income { color: var(--ok); } .v-expense { color: var(--amt-exp); } .v-net { color: var(--pri); }

/* 行内控件条 */
.row-tools { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; flex-wrap: wrap; }
.row-tools input[type="month"] { border: 1px solid var(--line); border-radius: var(--r-sm); padding: 6px 8px; font-size: 13px; background: var(--card); color: var(--ink); font-family: var(--h1-font); }
.row-tools .spacer { flex: 1; }

/* 按钮：硬描边玩具钮 */
.btn { border: 2px solid var(--ink); border-radius: var(--r-sm); padding: 9px 16px; font-size: 14px; cursor: pointer; background: var(--card); color: var(--ink); font-family: var(--h1-font); font-weight: 600; box-shadow: var(--sh); transition: transform .05s, box-shadow .05s; }
.btn:active { transform: translateY(2px); box-shadow: 0 1px 0 rgba(61,50,41,.12); }
.btn.gated { opacity: .6; filter: grayscale(.3); }
.btn.gated:hover { opacity: .8; }
.btn.primary { background: var(--pri); color: var(--pri-ink); border-color: var(--pri-d); }
.btn.ghost { background: transparent; color: var(--sub); border: 1px solid var(--line); box-shadow: none; }
.btn.danger { background: var(--pri-soft); color: var(--bad); border-color: var(--bad); }
.btn.sm { padding: 5px 10px; font-size: 12px; }
.btn.block { width: 100%; }
.btn:disabled { opacity: .5; }

/* 流水列表：按天分组（原型结构） */
.txn-list .day + .day { margin-top: 4px; }
.txn-list .day-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 0 7px; border-top: 1px dashed var(--line-2);
  position: sticky; top: -1px; background: var(--card); z-index: 1;
}
.txn-list .day:first-child .day-head { border-top: 0; }
.txn-list .day-head .dl { color: var(--sub); font-weight: 600; font-size: 12px; display: flex; align-items: baseline; gap: 4px; }
.txn-list .day-head .dl b { color: var(--ink); }
.txn-list .day-head .ds { font-family: var(--h1-font); font-size: 12px; color: var(--sub); font-variant-numeric: tabular-nums; }
.txn-list .day-head .ds.inc { color: var(--income); }
.txn-list .day-head .ds.exp { color: var(--amt-exp); }

.txn-list .txn { display: flex; align-items: center; gap: 11px; padding: 9px 0; border-bottom: 1px solid var(--line-2); }
.txn-list .txn:last-child { border-bottom: 0; }
.txn .ic { width: 36px; height: 36px; border-radius: 50%; background: var(--pri-soft); color: var(--pri-d); display: flex; align-items: center; justify-content: center; font-size: 16px; flex-shrink: 0; border: 1.5px solid var(--ink); }
.txn .ti { width: 34px; height: 34px; border-radius: 50%; flex: 0 0 auto; background: var(--is, var(--line-2)); display: flex; align-items: center; justify-content: center; font-size: 16px; border: 2px solid var(--ink); }
.txn .body { flex: 1; min-width: 0; }
.txn .body .t1 { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.txn .body .cat { font-weight: 600; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; color: var(--ink); }
.txn .body .tag { font-size: 10px; color: var(--sub); background: var(--bg); padding: 1px 6px; border-radius: 4px; border: 1px solid var(--line); }
.txn .body .t2 { font-size: 12px; color: var(--sub); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.txn .tb { flex: 1; min-width: 0; }
.txn .tb .t1 { font-size: 13.5px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 600; }
.txn .tb .t2 { font-size: 11.5px; color: var(--sub); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 1px; }
.txn .amt { font-weight: 700; font-size: 15px; white-space: nowrap; color: var(--ink); }
.txn .ta { font-family: var(--h1-font); font-size: 15px; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; color: var(--ink); }
.txn .amt.inc, .txn .ta.inc { color: var(--income); }
.txn .amt.exp, .txn .ta.exp { color: var(--amt-exp); }
.txn .amt.transfer, .txn .ta.transfer { color: var(--warn); }
/* 流水行可点开编辑/删除菜单 + 右侧 ⋯ 提示 */
.txn.tap { cursor: pointer; }
.txn.tap:active { background: var(--pri-soft); }
.txn .txn-more {
  flex: 0 0 auto; width: 28px; height: 28px; margin-left: 2px; border-radius: 50%;
  border: 2px solid var(--ink); background: var(--card); color: var(--ink);
  display: flex; align-items: center; justify-content: center; font-size: 17px; line-height: 1;
}
.amt-income { color: var(--ok); } .amt-expense { color: var(--amt-exp); } .amt-transfer { color: var(--warn); }
.empty { text-align: center; color: var(--sub); padding: 28px 0; font-size: 13px; }

/* 分类树 / 账户 / 成员 / 预算 列表 */
.item-row { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px dashed var(--line-2); }
.item-row:last-child { border-bottom: 0; }
.item-row .name { flex: 1; min-width: 0; color: var(--ink); }
.item-row .name .s { font-size: 12px; color: var(--sub); }
.item-row .sub { font-size: 12px; color: var(--sub); }
.item-row .ops { display: flex; gap: 6px; }
.item-row.child { padding-left: 22px; }
.item-row.child::before { content: "└"; color: var(--sub); }
.progress { height: 8px; border-radius: 999px; background: var(--track); overflow: hidden; margin-top: 4px; border: 1px solid var(--line); }
.progress i { display: block; height: 100%; background: var(--pri); }
.progress.warn i { background: var(--warn); }
.progress.over i { background: var(--bad); }

/* 支出分类 bars（原型 .brow） */
.cat-bars { display: flex; flex-direction: column; gap: 11px; }
.cb-row { display: grid; grid-template-columns: 16px 62px 1fr 78px; align-items: center; gap: 8px; }
.cb-row .cbd { width: 9px; height: 9px; border-radius: 50%; border: 1.5px solid var(--ink); background: var(--bc, var(--pri)); }
.cb-row .cbn { font-size: 12.5px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 600; }
.cb-row .cbt { height: 10px; border-radius: 999px; background: var(--track); overflow: hidden; border: 1.5px solid var(--ink); }
.cb-row .cbt i { display: block; height: 100%; border-radius: 999px; background: var(--bc, var(--pri)); }
.cb-row .cba { font-family: var(--h1-font); font-size: 12.5px; font-weight: 700; color: var(--ink); text-align: right; font-variant-numeric: tabular-nums; }
.cb-row .cba em { font-style: normal; color: var(--sub2); font-size: 11px; margin-left: 5px; font-weight: 600; }

/* ===== 预算独立页 ===== */
.budget-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.month-nav { display: flex; align-items: center; gap: 8px; }
.month-nav .month-label { font-weight: 700; font-size: 16px; min-width: 84px; text-align: center; color: var(--ink); }
.month-nav .btn { width: 34px; padding: 4px 0; }
.seg { display: inline-flex; background: var(--bg); border: 2px solid var(--ink); border-radius: 999px; padding: 2px; }
.seg-btn { border: 0; background: none; padding: 6px 16px; border-radius: 999px; font-size: 13px; color: var(--sub); cursor: pointer; font-family: var(--h1-font); }
.seg-btn.on { background: var(--pri); color: var(--pri-ink); font-weight: 600; }

.budget-overview { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 12px; }
.stat-chip { background: var(--card); border: 2px solid var(--ink); border-radius: var(--r); padding: 12px 14px; box-shadow: var(--sh); }
.stat-chip .n { font-size: 19px; font-weight: 700; color: var(--ink); }
.stat-chip .l { font-size: 12px; color: var(--sub); margin-top: 2px; }
.stat-chip.ok .n { color: var(--ok); }
.stat-chip.danger .n { color: var(--bad); }
.stat-chip.warn .n { color: var(--warn); }

.budget-actions { display: flex; gap: 8px; margin-bottom: 12px; }
.budget-actions .btn { flex: 1; }
.budget-card { background: var(--card); border: 2px solid var(--ink); border-radius: var(--r); padding: 14px 16px; margin-bottom: 10px; box-shadow: var(--sh); }
.bc-top { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.bc-ico { width: 32px; height: 32px; border-radius: 9px; background: var(--pri-soft); color: var(--pri-d); display: flex; align-items: center; justify-content: center; font-weight: 700; flex-shrink: 0; border: 1.5px solid var(--ink); }
.bc-name { flex: 1; font-weight: 600; color: var(--ink); }
.bc-pct { font-weight: 700; font-size: 14px; color: var(--ok); }
.bc-pct.warn { color: var(--warn); }
.bc-pct.over { color: var(--bad); }
/* 超支小药丸（替代整行染红） */
.warn-pill { display: inline-block; margin-left: 6px; background: var(--warn-s); color: var(--warn); border: 1px solid var(--warn); border-radius: 999px; font-size: 11px; font-weight: 700; padding: 1px 8px; }
/* 资产状态徽章（物资/固定资产通用）：绘本风圆角小药丸 */
.badge { display: inline-block; font-size: 11px; line-height: 1.4; font-weight: 700; padding: 2px 9px; border-radius: 999px; border: 1px solid var(--line); background: var(--bg); color: var(--sub); }
.badge.ok { background: #E7F4EC; color: var(--ok); border-color: var(--ok); }
.badge.warn { background: var(--warn-s); color: var(--warn); border-color: var(--warn); }
.badge.exp { background: #FBE6E0; color: var(--bad); border-color: var(--bad); }
.badge.muted { background: var(--bg); color: var(--sub); border-color: var(--line); }
.bc-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 8px; }
.bc-amt { font-size: 13px; color: var(--sub); }

.empty.big { text-align: center; padding: 48px 16px; color: var(--sub); }
.empty-ico { font-size: 44px; margin-bottom: 8px; }
.empty-title { font-size: 15px; font-weight: 600; color: var(--ink); }
.empty-sub { font-size: 13px; margin-top: 4px; }

/* 轻量节标题（信用卡/储蓄卡等纯分组标签，替代重白卡，避免像可点） */
.sec { font-size: 13px; font-weight: 700; color: var(--ink); padding: 6px 2px 4px; margin: 4px 0 2px; }

/* 登录 */
.login-wrap { min-height: 70vh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 32px 20px; }
.login-logo { width: 72px; height: 72px; margin-bottom: 16px; }
.login-title { font-size: 20px; font-weight: 700; margin-bottom: 4px; color: var(--ink); }
.login-sub { color: var(--sub); font-size: 13px; margin-bottom: 28px; }
.login-card { width: 100%; max-width: 320px; }
.login-card .field { margin-bottom: 12px; }

/* 表单字段 */
.field { display: block; margin-bottom: 10px; }
.field span { display: block; font-size: 12px; color: var(--sub); margin-bottom: 4px; }
.field input, .field select, .field textarea {
  width: 100%; border: 1.5px solid var(--line); border-radius: var(--r-sm); padding: 10px 12px;
  font-size: 14px; background: var(--card); color: var(--ink); outline: none; font-family: var(--h1-font);
}
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--pri); }
.field.active-provider span { color: var(--pri-d); font-weight: 600; }
.field.active-provider input, .field.active-provider select { border-color: var(--pri); background: var(--pri-soft); }
.field.inactive-provider { opacity: .55; }
.field.inactive-provider input, .field.inactive-provider select { background: #F3F4F6; }
.field-row { display: flex; gap: 10px; flex-wrap: wrap; }
.field-row .field { flex: 1; min-width: 120px; }

/* 弹层 */
.modal { position: fixed; inset: 0; z-index: 50; background: rgba(61,50,41,.45); display: none; align-items: flex-end; justify-content: center; }
.modal.show { display: flex; }
.modal-card { width: 100%; max-width: 560px; max-height: 90vh; overflow-y: auto; background: var(--card); border: 2px solid var(--ink); border-radius: 20px 20px 0 0; padding: 18px 16px 20px; box-shadow: var(--sh); }
.modal-card h3 { font-size: 16px; margin-bottom: 14px; color: var(--ink); font-weight: 700; }
.modal-actions { display: flex; gap: 10px; margin-top: 16px; }
.modal-actions .btn { flex: 1; }

/* 截图视觉记账 + 凭据缩略图 */
.muted { color: var(--sub); font-size: 12px; margin: 0 0 12px; }
.shot-preview { max-width: 100%; max-height: 240px; border-radius: var(--r-sm); margin-top: 12px; display: block; }
.receipt-tag { color: var(--pri-d); cursor: pointer; user-select: none; }
.receipt-tag:active { opacity: .6; }
.receipt-widget { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.receipt-thumb { width: 56px; height: 56px; object-fit: cover; border-radius: var(--r-sm); border: 1.5px solid var(--ink); cursor: pointer; }
.receipt-full { max-width: 100%; border-radius: var(--r-sm); margin-top: 8px; }
.receipt-modal { max-width: 420px; }

/* toast */
.toast { position: fixed; left: 50%; bottom: 100px; transform: translate(-50%, 16px); z-index: 60; background: rgba(61,50,41,.94); color: #fff; padding: 10px 18px; border-radius: 20px; font-size: 13px; opacity: 0; pointer-events: none; transition: all .25s; max-width: 86vw; }
.toast.show { opacity: 1; transform: translate(-50%, 0); }
.toast.error { background: rgba(192,73,43,.95); }
.toast.success { background: rgba(63,157,106,.95); }
.toast.warn { background: #854F0B; }

/* 导出说明卡 */
.hint { font-size: 12px; color: var(--sub); margin-top: 6px; }
.divider { border: 0; border-top: 1px dashed var(--line); margin: 10px 0; }

/* 语音记账 */
.voice-btn {
  width: 38px; height: 38px; border-radius: 50%; border: 2px solid var(--ink); cursor: pointer;
  background: var(--pri); color: #fff; font-size: 17px;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  box-shadow: var(--sh);
}
.voice-btn:active { transform: translateY(2px); box-shadow: 0 1px 0 rgba(61,50,41,.12); }
.voice-bar {
  position: fixed; left: 50%; transform: translateX(-50%); bottom: 84px; z-index: 70;
  width: min(92vw, 480px); display: flex; align-items: center; gap: 10px;
  background: var(--card); border: 2px solid var(--ink); border-radius: 999px;
  padding: 10px 14px; box-shadow: var(--sh);
}
.voice-dot {
  width: 12px; height: 12px; border-radius: 50%; background: var(--bad); flex-shrink: 0;
  animation: vpulse 1.2s ease-in-out infinite;
}
@keyframes vpulse { 0%,100% { box-shadow: 0 0 0 0 rgba(192,73,43,.4); } 50% { box-shadow: 0 0 0 8px rgba(192,73,43,0); } }
.voice-text { flex: 1; font-size: 14px; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.voice-stop { border: 0; background: var(--pri-soft); color: var(--pri-d); font-size: 12px; padding: 6px 12px; border-radius: 999px; cursor: pointer; font-family: var(--h1-font); }
.voice-confirm {
  position: fixed; left: 50%; transform: translateX(-50%); bottom: 72px; z-index: 70;
  width: min(92vw, 480px); background: var(--card); border: 2px solid var(--ink); border-radius: 16px;
  padding: 14px 16px; box-shadow: var(--sh);
}
.vc-head { display: flex; align-items: center; gap: 8px; }
.vc-tag { font-size: 11px; color: var(--pri-d); background: var(--pri-soft); padding: 2px 8px; border-radius: 999px; }
.vc-raw { font-size: 12px; color: var(--sub); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vc-main { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.vc-amount { font-size: 24px; font-weight: 700; color: var(--bad); }
.chip { font-size: 12px; padding: 3px 10px; border-radius: 999px; }
.chip-type { background: #EAF3DE; color: #3B6D11; }
.chip-cat { background: #E6F1FB; color: #185FA5; }
.chip-acc { background: var(--pri-soft); color: var(--pri-d); }
.vc-actions { display: flex; gap: 10px; margin-top: 12px; }
.vc-actions .btn { flex: 1; }

/* 语音记账面板（点按式，纯点击、无长按） */
.voice-sheet {
  position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 80;
  width: min(88vw, 360px); background: var(--card); border: 2px solid var(--ink); border-radius: 20px;
  padding: 18px 18px 20px; box-shadow: var(--sh);
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; touch-action: manipulation;
}
.voice-sheet-head { width: 100%; display: flex; align-items: center; justify-content: space-between; }
.voice-sheet-head > span { font-size: 15px; font-weight: 600; color: var(--ink); }
.voice-close { border: 0; background: transparent; color: var(--sub); font-size: 22px; line-height: 1; cursor: pointer; padding: 0 4px; }
.voice-mic {
  width: 92px; height: 92px; border-radius: 50%; background: var(--pri-d); display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: transform .1s;
  user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; touch-action: manipulation; border: 2px solid var(--ink);
}
.voice-mic:active { transform: scale(.95); }
.voice-mic.rec { background: var(--bad); animation: vpulse 1.2s ease-in-out infinite; }
.voice-live { font-size: 14px; color: var(--ink); text-align: center; min-height: 20px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.voice-stop2 { border: 0; background: var(--pri-soft); color: var(--pri-d); font-size: 13px; padding: 9px 22px; border-radius: 999px; cursor: pointer; font-family: var(--h1-font); }

/* 移动端：消除按钮 300ms 点击延迟 */
.btn { touch-action: manipulation; }

/* 分类管理 Tab */
.cat-tabs { display: flex; gap: 10px; margin: 12px 0 4px; }
.cat-tabs .btn { flex: 1; }
.cat-stat { font-size: 12px; color: var(--sub); margin: 6px 2px 10px; }

/* 推送引导卡 */
.push-guide {
  display: flex; align-items: center; gap: 10px;
  background: var(--pri-soft);
  border: 2px solid var(--pri); border-radius: var(--r);
  padding: 12px 14px; margin-bottom: 12px;
}
.pg-icon { font-size: 22px; flex-shrink: 0; }
.pg-body { flex: 1; min-width: 0; }
.pg-title { font-size: 14px; font-weight: 600; color: var(--ink); }
.pg-sub { font-size: 12px; color: var(--sub); margin-top: 2px; line-height: 1.5; }
.push-guide .btn { flex-shrink: 0; }
.toast.warn { background: #854F0B; }

/* 记账日历 */
.cal-title { font-weight: 700; font-size: 16px; color: var(--ink); }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.cal-head { text-align: center; font-size: 12px; color: var(--sub); padding: 4px 0; }
.cal-cell {
  background: var(--card); border: 2px solid var(--ink); border-radius: var(--r-sm);
  padding: 6px 4px; min-height: 56px; cursor: pointer; display: flex; flex-direction: column;
  gap: 2px; transition: border-color .15s;
}
.cal-cell:hover { border-color: var(--pri); }
.cal-cell.empty { background: transparent; border: 0; cursor: default; }
.cal-cell.today { box-shadow: inset 0 0 0 2px var(--pri); }
/* 三态：有支出 / 零支出 / 未来天 */
.cal-cell.has { background: var(--pri-soft); }
.cal-cell.zero { background: var(--card); }
.cal-cell.future { background: #F4EEDF; }
.cal-cell .cal-d { font-size: 13px; font-weight: 600; color: var(--ink); }
.cal-cell .cal-e { font-size: 11px; color: var(--ink); line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cal-cell .cal-e.muted { color: var(--sub); }
.cal-cell .cal-n { font-size: 10px; color: var(--sub); }
.cal-cell.heat1 { background: #FCEBD8; }
.cal-cell.heat2 { background: #F7D9BC; }
.cal-cell.heat3 { background: #F2C29A; }
.cal-cell.heat4 { background: #ECAE84; }
.cal-cell.heat1 .cal-e, .cal-cell.heat2 .cal-e, .cal-cell.heat3 .cal-e, .cal-cell.heat4 .cal-e { color: var(--ink); }
.cal-hint { text-align: center; color: var(--sub); font-size: 12px; margin-top: 4px; }
.cal-day-modal { max-width: 480px; }
.cal-day-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; gap: 10px; }
.cal-day-head h3 { margin: 0; }

/* 周期账（自动记账） */
.rec-list { display: flex; flex-direction: column; gap: 10px; }
.rec-item.disabled { opacity: .55; }
.rec-main { display: flex; flex-direction: column; gap: 6px; }
.rec-title { display: flex; align-items: baseline; gap: 10px; }
.rec-amt { font-size: 17px; font-weight: 700; color: var(--ink); }
.rec-freq { color: var(--sub); font-size: 13px; }
.rec-meta { display: flex; flex-wrap: wrap; gap: 6px; }
.rec-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 10px; gap: 10px; flex-wrap: wrap; }
.rec-next { color: var(--sub); font-size: 13px; }
.rec-next.overdue { color: var(--bad); font-weight: 600; }
.rec-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.row-tools { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; flex-wrap: wrap; }
.row-tools h3 { margin: 0; }

/* 分析-分类同比表 */
.cmp-head, .cmp-row { display: flex; align-items: center; padding: 7px 0; border-bottom: 1px dashed var(--line-2); }
.cmp-head { color: var(--sub); font-size: 12px; }
.cmp-row:last-child { border-bottom: 0; }
.cmp-head .c-name, .cmp-row .c-name { flex: 1; text-align: left; }
.cmp-head .c-num, .cmp-row .c-num { flex: 0 0 72px; text-align: right; font-variant-numeric: tabular-nums; }
.cmp-row .c-num.up { color: var(--bad); }
.cmp-row .c-num.down { color: var(--ok); }
.cmp-row .c-num.new { color: var(--pri); }

/* ============ 财务助理（FAB + 聊天浮层） ============ */
.assistant-fab {
  position: fixed; right: max(16px, calc(50% - 264px)); bottom: 72px; z-index: 60;
  display: inline-flex; align-items: center; gap: 7px;
  height: 46px; padding: 0 16px 0 11px; border-radius: 999px; border: 2px solid var(--ink);
  background: var(--pri, #F0913C); color: #fff; cursor: pointer;
  font-family: var(--h1-font); font-size: 14px; font-weight: 600; line-height: 1;
  box-shadow: var(--sh);
  transition: transform .15s ease, box-shadow .15s ease;
  -webkit-tap-highlight-color: transparent;
}
.assistant-fab:hover { box-shadow: 0 5px 16px rgba(240,145,60,.5); }
.assistant-fab:active { transform: scale(.95); }
.assistant-fab .fab-ico {
  width: 24px; height: 24px; border-radius: 50%; flex-shrink: 0;
  background: rgba(255,255,255,.24);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 15px; font-weight: 700; line-height: 1;
}
.assistant-fab .fab-txt { white-space: nowrap; }
.assistant-overlay { position: fixed; inset: 0; z-index: 70; display: none; }
.assistant-overlay.open { display: block; }
.assistant-mask { position: absolute; inset: 0; background: rgba(61,50,41,.35); }
.assistant-panel {
  position: absolute; right: 0; bottom: 0; top: 0; width: min(420px, 100%);
  background: var(--bg, #FBF3E1); display: flex; flex-direction: column;
  box-shadow: -4px 0 24px rgba(61,50,41,.2);
}
.assistant-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 14px; background: var(--pri, #F0913C); color: #fff; font-weight: 600;
}
.assistant-head-title { display: inline-flex; align-items: center; gap: 7px; }
.assistant-head-title .fab-ico { width: 22px; height: 22px; font-size: 14px; }
.assistant-close { background: transparent; border: none; color: #fff; font-size: 18px; cursor: pointer; }
.assistant-hint {
  display: flex; align-items: center; gap: 7px;
  padding: 8px 14px; font-size: 12px; line-height: 1.45;
  color: #7a5a12; background: #fff7e6; border-bottom: 1px solid #ffe2b0;
}
.assistant-hint .ah-ico { font-size: 13px; }
.field-help { display: block; margin-top: 4px; font-size: 11px; line-height: 1.5; color: var(--sub, #8a7a66); font-weight: 400; }
.assistant-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 12px; border-bottom: 1px solid var(--line, #EFE4D2); }
.chip { border: 1px solid var(--line, #EFE4D2); background: #fff; color: #444; border-radius: 999px; padding: 5px 10px; font-size: 12px; cursor: pointer; }
.chip:active { background: #fdebd8; }
.assistant-msgs { flex: 1; overflow-y: auto; padding: 14px 12px; display: flex; flex-direction: column; gap: 10px; }
.msg { display: flex; }
.msg.user { justify-content: flex-end; }
.msg.assistant { justify-content: flex-start; }
.bubble { max-width: 86%; padding: 9px 12px; border-radius: 14px; line-height: 1.5; word-break: break-word; }
.btext { white-space: pre-wrap; }
.msg.user .bubble { background: var(--pri, #F0913C); color: #fff; border-bottom-right-radius: 4px; }
.msg.assistant .bubble { background: #fff; color: #222; border: 1px solid var(--line, #EFE4D2); border-bottom-left-radius: 4px; }
.assistant-inputbar { display: flex; gap: 8px; padding: 10px 12px; border-top: 1px solid var(--line, #EFE4D2); background: #fff; }
.assistant-input { flex: 1; border: 1.5px solid var(--line, #EFE4D2); border-radius: 10px; padding: 9px 10px; font-size: 14px; }
.assistant-send { flex: 0 0 auto; }
.acard { margin-top: 8px; border: 1.5px solid var(--line, #EFE4D2); border-radius: 10px; padding: 10px; background: #fffaf0; display: flex; flex-direction: column; gap: 6px; }
.acard-title { font-size: 12px; color: #888; font-weight: 600; }
.acard-big { font-size: 22px; font-weight: 700; color: var(--pri, #F0913C); }
.acard-sub { font-size: 12px; color: #999; }
.rrow { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.rname { flex: 0 0 96px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #555; }
.rtrack { flex: 1; height: 8px; border-radius: 4px; background: #E8EDF8; overflow: hidden; }
.rbar { display: block; height: 100%; border-radius: 4px; background: var(--pri, #F0913C); opacity: .8; }
.ramt { flex: 0 0 92px; margin-left: auto; text-align: right; font-variant-numeric: tabular-nums; color: #333; }
.mm-line { display: flex; justify-content: space-between; font-size: 14px; }
.mm-line .up { color: var(--bad); } .mm-line .down { color: var(--ok); }
.brow { display: flex; justify-content: space-between; font-size: 12px; color: #555; }
.bname { flex: 1; } .bnum { flex: 0 0 auto; color: var(--ok); }
.drow { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 13px; padding: 3px 0; }
.dkey { color: #888; flex: 0 0 auto; }
.dval { color: #222; font-weight: 600; }
.dwarn { font-size: 12px; color: var(--bad); }
.dactions { display: flex; gap: 8px; margin-top: 4px; }
.dinput {
  flex: 0 1 62%; min-width: 0; max-width: 62%;
  border: 1.5px solid var(--line); border-radius: 8px; padding: 6px 8px;
  font-size: 13px; font-family: inherit; color: var(--ink); background: var(--card);
}
.dinput:focus { outline: none; border-color: var(--pri); }
.type-seg { display: inline-flex; border: 1.5px solid var(--line); border-radius: 8px; overflow: hidden; }
.type-btn { border: 0; background: var(--card); color: var(--sub); font-family: inherit; font-size: 12px; padding: 6px 11px; cursor: pointer; }
.type-btn.active { background: var(--pri); color: #fff; }
.dhint { font-size: 11px; color: var(--sub); margin-top: 6px; line-height: 1.5; }
.dhint.err { color: var(--bad); }

/* ===== 更多聚合页（原型：个人信息卡 + 单列分组列表） ===== */
.more-profile { display: flex; align-items: center; gap: 12px; }
.more-profile .avatar {
  width: 44px; height: 44px; flex: 0 0 auto; border-radius: 50%; border: 2px solid var(--ink);
  overflow: hidden; line-height: 0; display: block;
}
.more-profile .avatar svg { width: 100%; height: 100%; display: block; }
.more-profile .mp-t { min-width: 0; }
.more-profile .mp-n { font-size: 15px; font-weight: 700; color: var(--ink); }
.more-profile .mp-s { font-size: 12px; color: var(--sub); margin-top: 1px; }
.mgroup { margin-bottom: 12px; }
.mgroup > .gt { font-size: 11.5px; color: var(--sub2); padding: 0 4px 7px; font-weight: 700; }
.mlist { background: var(--card); border: 2px solid var(--ink); border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--sh); }
.mrow {
  display: flex; align-items: center; gap: 11px; padding: 12px 14px; width: 100%; text-align: left;
  font-family: var(--h1-font); font-size: 13.5px; color: var(--ink); cursor: pointer; background: none; border: 0;
}
.mrow + .mrow { border-top: 1px solid var(--line-2); }
.mrow:active { background: var(--pri-soft); }
.mrow .mi {
  width: 30px; height: 30px; border-radius: 50%; background: var(--is, var(--line-2));
  display: flex; align-items: center; justify-content: center; font-size: 15px; flex: 0 0 auto;
  border: 1.5px solid var(--ink);
}
.mrow .mt { flex: 1; min-width: 0; }
.mrow .mt b { font-weight: 700; display: block; }
.mrow .mt span { font-size: 11.5px; color: var(--sub); display: block; }
.mrow .arw { color: var(--sub2); font-size: 15px; margin-left: 2px; }

/* 兼容旧网格类（如仍有引用） */
.more-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.more-cell {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; text-align: left;
  background: var(--card); border: 2px solid var(--ink); border-radius: var(--r-lg);
  padding: 14px 28px 14px 14px; box-shadow: var(--sh); cursor: pointer; font-family: var(--h1-font); color: var(--ink);
}
.more-cell:active { transform: translateY(2px); box-shadow: 0 1px 0 rgba(61,50,41,.12); }
.more-ico { font-size: 24px; }
.more-title { font-weight: 700; font-size: 15px; color: var(--ink); }
.more-desc { font-size: 12px; color: var(--sub); }
.more-arrow { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: var(--sub); font-size: 22px; line-height: 1; }

/* ===== 绘本风 hero（dashboard 顶部，严格对齐原型 .hero） ===== */
.hero {
  background: var(--card); border: 2px solid var(--ink); border-radius: 22px;
  padding: 16px; margin-bottom: 11px; box-shadow: var(--sh); position: relative;
}
.hero .row1 { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.hero .cap { font-size: 12px; color: var(--sub); margin-bottom: 3px; display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.hero .big { font-family: var(--h1-font); font-size: 40px; line-height: 1.06; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
.hero .big .dec { font-size: 20px; opacity: .6; }
.hero .sub {
  display: flex; gap: 20px; margin-top: 11px; padding-top: 10px;
  border-top: 2px dashed var(--line); font-size: 12.5px; color: var(--sub);
}
.hero .sub b { font-family: var(--h1-font); font-size: 14.5px; font-weight: 700; color: var(--ink); margin-left: 5px; font-variant-numeric: tabular-nums; }
.hero .sub b.in { color: var(--income); }
/* 存钱罐插画：hero 右上角，负外边距贴边（同原型 .piggy） */
.hero .piggy { width: 84px; height: 84px; flex: 0 0 auto; margin: -6px -8px -8px 0; }
.hero .piggy svg { width: 100%; height: 100%; display: block; }

/* 旧 hero 类保留兼容（无引用亦可） */
.ledger-hero {
  background: var(--card); border: 2px solid var(--ink); border-radius: var(--r-lg);
  padding: 16px; margin-bottom: 12px; box-shadow: var(--sh); position: relative;
}
.ledger-hero .row1 { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ledger-hero .lh-main { flex: 1; min-width: 0; }
.ledger-hero .lh-cap { font-size: 12px; color: var(--sub); margin-bottom: 3px; display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.ledger-hero .lh-big { font-family: var(--h1-font); font-size: 40px; line-height: 1.06; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
.ledger-hero .lh-sub { display: flex; gap: 20px; margin-top: 11px; padding-top: 10px; border-top: 2px dashed var(--line); font-size: 12.5px; color: var(--sub); }
.ledger-hero .lh-sub b { font-family: var(--h1-font); font-size: 14.5px; font-weight: 700; color: var(--ink); margin-left: 5px; font-variant-numeric: tabular-nums; }
.ledger-hero .lh-sub b.in { color: var(--income); }
.ledger-hero .lh-label { margin-right: 2px; }
.ledger-hero .lh-fish { width: 64px; height: 40px; flex: 0 0 auto; margin: -6px -4px -8px 0; }
.ledger-hero .lh-fish svg { width: 100%; height: 100%; display: block; }

/* ===== 最近常记（原型 .recent） ===== */
.recent { display: flex; gap: 8px; margin-bottom: 11px; overflow-x: auto; padding: 3px 1px 5px; scrollbar-width: none; }
.recent::-webkit-scrollbar { display: none; }
.rec-lead { font-size: 12px; color: var(--sub); align-self: center; flex: 0 0 auto; padding-right: 2px; font-weight: 600; }
.rec {
  flex: 0 0 auto; border: 2px solid var(--ink); background: var(--card); border-radius: 999px;
  padding: 8px 14px 8px 10px; font-size: 13px; color: var(--ink); font-family: inherit; cursor: pointer;
  display: flex; align-items: center; gap: 7px; box-shadow: var(--sh); font-weight: 600;
}
.rec:active { transform: translateY(2px); box-shadow: 0 1px 0 rgba(61,50,41,.12); }
.rec .re { font-size: 15px; width: 20px; text-align: center; }
.rec .rn { white-space: nowrap; }
.rec .rp { color: var(--sub); font-variant-numeric: tabular-nums; font-size: 12.5px; }
.rec .rp b { color: var(--ink); font-weight: 700; }

/* ===== 快捷入口（原型 .quick） ===== */
.quick { display: flex; gap: 8px; margin-bottom: 11px; }
.quick .q {
  flex: 1; border: 2px dashed var(--ink); background: transparent; border-radius: var(--r);
  padding: 10px 6px; font-size: 12.5px; color: var(--ink); font-family: inherit; cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: 6px; font-weight: 600;
}
.quick .q svg { width: 16px; height: 16px; flex: 0 0 auto; display: block; }
.quick .q.gated { opacity: .7; }

/* ===== 记一笔：实时摘要 ===== */
.txn-live {
  margin: 2px 0 10px; padding: 8px 12px; font-size: 13px; font-weight: 600; color: var(--ink);
  background: var(--card); border: 2px dashed var(--line); border-radius: 12px;
}

/* ===== 记一笔：最近常记 chips ===== */
.recent-chips { margin: 4px 0 12px; }
.recent-chips .rc-label { font-size: 12px; color: var(--sub); margin-bottom: 6px; font-weight: 600; }
.recent-chips .rc-row { display: flex; flex-wrap: wrap; gap: 8px; }
.rc-chip {
  display: flex; flex-direction: column; align-items: flex-start; gap: 1px; padding: 6px 10px;
  background: var(--card); border: 2px solid var(--ink); border-radius: 12px; box-shadow: var(--sh);
  cursor: pointer; font: inherit;
}
.rc-chip:active { transform: translateY(2px); box-shadow: 0 1px 0 rgba(61,50,41,.12); }
.rc-chip .rc-cat { font-size: 13px; font-weight: 700; color: var(--ink); }
.rc-chip .rc-acc { font-size: 11px; color: var(--sub); }

/* ===== 记一笔：回执撤销条 ===== */
.undo-bar {
  position: fixed; left: 50%; transform: translateX(-50%); bottom: 84px; z-index: 60;
  display: flex; align-items: center; gap: 12px; padding: 10px 14px; max-width: 92vw;
  background: var(--card); border: 2px solid var(--ink); border-radius: 14px; box-shadow: var(--sh);
}
.undo-bar .ub-text { font-size: 13px; font-weight: 600; color: var(--ink); }
.undo-bar .ub-btn {
  flex: 0 0 auto; padding: 6px 14px; font: inherit; font-weight: 700; color: #fff;
  background: var(--pri); border: 2px solid var(--ink); border-radius: 10px; cursor: pointer; box-shadow: var(--sh);
}
.undo-bar .ub-btn:active { transform: translateY(2px); box-shadow: 0 1px 0 rgba(61,50,41,.12); }

/* =====================================================================
   次级屏版式（对齐 design/原型-账本UI-绘本风.html）
   ===================================================================== */

/* 顶栏返回钮：圆形 ‹（原型 .app-head .back，flex 首项） */
#topbar .back-btn {
  order: -1; position: static; width: 30px; height: 30px; padding: 0 0 2px; flex: 0 0 auto;
  border-radius: 50%; border: 2px solid var(--ink); background: var(--card); color: var(--ink);
  display: flex; align-items: center; justify-content: center; cursor: pointer;
  font-size: 18px; line-height: 1; font-weight: 700; font-family: var(--h1-font);
  box-shadow: 0 2px 0 rgba(61,50,41,.10);
}
#topbar .back-btn.hidden { display: none; }

/* 卡片头（h3 + 右侧动作/静态说明）；.card-title-row 为旧名，一并统一 */
.card-head, .card-title-row { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 12px; }
.card-head h3, .card-title-row h3 { font-size: 14px; font-weight: 700; color: var(--ink); font-family: var(--h1-font); }
.card-head .more, .card-title-row .more { font-size: 12px; color: var(--pri-d); font-weight: 600; cursor: pointer; background: none; border: 0; font-family: inherit; padding: 0; }
.card-head .more.static, .card-title-row .more.static { color: var(--sub); cursor: default; }

/* 次级屏轻量节标题 */
.sec { display: flex; align-items: baseline; justify-content: space-between; padding: 6px 4px 9px; font-size: 13px; margin: 0; }
.sec h3 { font-family: var(--h1-font); color: var(--ink); font-size: 13px; font-weight: 700; }
.sec span { font-size: 12px; color: var(--sub); font-weight: 600; }

/* hero 环比药丸 */
.hero .delta {
  display: inline-flex; align-items: center; gap: 3px; font-size: 11.5px; font-weight: 700;
  padding: 3px 9px; border-radius: 999px; white-space: nowrap; border: 2px solid var(--ink);
  background: var(--warn-s); color: var(--warn);
}
.hero .delta.ok { background: var(--pri-soft); color: var(--pri-d); }

/* ---------------- 日历 ---------------- */
.cal-week { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin-bottom: 6px; }
.cal-week span { text-align: center; font-size: 11px; color: var(--sub2); font-weight: 600; }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.cd {
  aspect-ratio: 1 / 1.06; border-radius: var(--r-sm); border: 1px solid transparent; background: transparent;
  font-family: inherit; cursor: pointer; padding: 3px 2px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
}
.cd .dn { font-size: 12.5px; color: var(--ink); font-variant-numeric: tabular-nums; font-weight: 600; }
.cd .dv { font-size: 9.5px; color: var(--sub2); font-variant-numeric: tabular-nums; }
.cd.has { background: var(--pri-soft); border: 1.5px solid var(--ink); }
.cd.has .dv { color: var(--pri-d); font-weight: 700; }
.cd.zero { background: var(--card); border: 1px solid var(--line); }
.cd.zero .dn { color: var(--sub2); font-weight: 500; }
.cd.zero .dv { color: var(--sub2); }
.cd.future { background: transparent; }
.cd.future .dn { color: #D9CDBA; font-weight: 500; }
.cd.future .dv { color: #E5DBC8; }
.cd.on { background: var(--pri); border-color: var(--ink); }
.cd.on .dn, .cd.on .dv { color: var(--pri-ink); font-weight: 700; }
.cd.today .dn { color: var(--pri-d); font-weight: 800; box-shadow: inset 0 -2px 0 var(--pri); }
.cd.on.today .dn { color: var(--pri-ink); box-shadow: none; }

/* ---------------- 分析 ---------------- */
.donut-wrap { display: flex; align-items: center; gap: 16px; }
.donut { flex: 0 0 auto; }
.legend-list { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 7px; }
.legend-list .lg { display: flex; align-items: center; gap: 7px; font-size: 12.5px; color: var(--ink); font-weight: 600; }
.legend-list .lg i { width: 9px; height: 9px; border-radius: 50%; border: 1.5px solid var(--ink); flex: 0 0 auto; }
.legend-list .lg .lv { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.legend-list .lg .la { font-family: var(--h1-font); font-weight: 700; font-variant-numeric: tabular-nums; color: var(--ink); }
.legend-list .lg .lp { color: var(--sub2); font-size: 11px; width: 30px; text-align: right; font-variant-numeric: tabular-nums; }

.trend { display: flex; align-items: flex-end; gap: 5px; height: 108px; margin-top: 4px; }
.trend .tb2 { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 5px; height: 100%; justify-content: flex-end; }
.trend .tb2 i { width: 100%; max-width: 22px; border-radius: 5px 5px 3px 3px; background: var(--track); position: relative; border: 1.5px solid var(--ink); }
.trend .tb2 i b { position: absolute; left: 0; right: 0; bottom: 0; border-radius: 3px; background: var(--pri); opacity: 0; }
.trend .tb2.hi i b { opacity: 1; }
.trend .tb2 span { font-size: 10px; color: var(--sub2); font-variant-numeric: tabular-nums; }
.trend .tb2.hi span { color: var(--pri-d); font-weight: 700; }

/* 成员/分类对比 bars（原型 .bars / .brow；覆盖旧版 flex 规则） */
.bars { display: flex; flex-direction: column; gap: 11px; }
.brow { display: grid; grid-template-columns: 16px 62px 1fr 78px; align-items: center; gap: 8px; font-size: inherit; color: var(--ink); }
.brow .bd { width: 9px; height: 9px; border-radius: 50%; border: 1.5px solid var(--ink); }
.brow .bn { font-size: 12.5px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 600; }
.brow .bt { height: 10px; border-radius: 999px; background: var(--track); overflow: hidden; border: 1.5px solid var(--ink); }
.brow .bt i { display: block; height: 100%; border-radius: 999px; background: var(--bc, var(--pri)); }
.brow .ba { font-family: var(--h1-font); font-size: 12.5px; font-weight: 700; color: var(--ink); text-align: right; font-variant-numeric: tabular-nums; }
.brow .ba em { font-style: normal; color: var(--sub2); font-size: 11px; margin-left: 5px; font-weight: 600; }

/* ---------------- 预算 ---------------- */
.bgt { display: flex; flex-direction: column; gap: 13px; }
.bgt-row .bh { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 6px; }
.bgt-row .bnm { font-size: 13px; color: var(--ink); font-weight: 700; display: flex; align-items: center; gap: 7px; }
.bgt-row .bnm i { width: 9px; height: 9px; border-radius: 50%; border: 1.5px solid var(--ink); flex: 0 0 auto; }
.bgt-row .bamt { font-family: var(--h1-font); font-size: 12.5px; color: var(--sub); font-variant-numeric: tabular-nums; }
.bgt-row .bamt b { color: var(--ink); font-weight: 700; font-size: 13.5px; }
.bgt-row .bamt .warn-pill {
  display: inline-block; margin-left: 6px; font-size: 10.5px; font-weight: 700;
  background: var(--warn-s); color: var(--warn); border: 1.5px solid var(--warn); border-radius: 999px; padding: 1px 7px;
}
.bgt-bar { height: 11px; border-radius: 999px; background: var(--track); overflow: hidden; border: 1.5px solid var(--ink); }
.bgt-bar i { display: block; height: 100%; background: var(--pri); }
.bgt-row.over .bgt-bar i { background: var(--warn); }
.bgt-row .bnote { font-size: 11px; color: var(--sub2); margin-top: 5px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.bgt-row .bnote .bx { background: none; border: 0; font: inherit; font-size: 11px; color: var(--sub2); cursor: pointer; padding: 0 2px; }
.bgt-row.over .bnote { color: var(--warn); font-weight: 600; }
.bgt-row.over .bnote b { color: var(--warn); }

/* ---------------- 通用列表（周期账 / 账户 / 随礼） ---------------- */
.list { background: var(--card); border: 2px solid var(--ink); border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--sh); margin-bottom: 11px; }
.lrow {
  display: flex; align-items: center; gap: 11px; padding: 12px 14px;
  font-family: inherit; font-size: 13.5px; color: var(--ink); border: 0; width: 100%; text-align: left; background: none;
}
.lrow + .lrow { border-top: 1px solid var(--line-2); }
.lrow .li { width: 32px; height: 32px; border-radius: 50%; border: 2px solid var(--ink); display: flex; align-items: center; justify-content: center; font-size: 16px; flex: 0 0 auto; }
.lrow .lb { flex: 1; min-width: 0; }
.lrow .lb b { font-weight: 700; display: block; }
.lrow .lb span { font-size: 11.5px; color: var(--sub); display: block; margin-top: 1px; }
.lrow .lv { text-align: right; flex: 0 0 auto; }
.lrow .lv .n { font-family: var(--h1-font); font-weight: 700; font-variant-numeric: tabular-nums; font-size: 14px; }
.lrow .lv .n.exp { color: var(--amt-exp); }
.lrow .lv .n.inc { color: var(--income); }
.lrow .lv .s { font-size: 10.5px; color: var(--sub2); display: block; margin-top: 1px; }
.lrow .lops { display: flex; gap: 6px; flex: 0 0 auto; }
.lrow .lops .btn { padding: 3px 9px; font-size: 12px; }

/* ---------------- 分类管理：网格 ---------------- */
.cat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.cat-cell {
  background: var(--card); border: 2px solid var(--ink); border-radius: var(--r); padding: 11px 12px;
  display: flex; align-items: center; gap: 9px; box-shadow: var(--sh); cursor: pointer;
  font-family: inherit; text-align: left;
}
.cat-cell .ce { width: 30px; height: 30px; border-radius: 50%; border: 1.5px solid var(--ink); display: flex; align-items: center; justify-content: center; font-size: 15px; flex: 0 0 auto; }
.cat-cell .ct { min-width: 0; flex: 1; }
.cat-cell .ct b { font-size: 12.5px; font-weight: 700; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cat-cell .ct span { font-size: 10.5px; color: var(--sub); display: block; }
.cat-cell .cx { flex: 0 0 auto; color: var(--sub2); font-size: 13px; padding: 2px 4px; background: none; border: 0; font-family: inherit; cursor: pointer; }

/* =====================================================================
   记一笔：底部 sheet（对齐 design/原型-账本UI-绘本风.html 的 #sheet）
   ---------------------------------------------------------------------
   刻意不复用 .modal-card —— 后者被 9 个模块 12 处共享（月份选择器 /
   formModal / 分类管理 / 设置页 / 凭据预览 / 截图记账…），改它会连带变形。
   内部一律带 .sheet 作用域前缀：既有全局 .chip（voice 标签 / assistant 快捷问）
   与 .summary（分析屏 3 列汇总卡）已被占用，不加前缀会串味。
   ===================================================================== */

/* 弹层栈中非顶层隐藏：遮罩是 flex 容器，两层同时显示会并排 */
.modal .modal-behind { display: none !important; }

.sheet {
  width: 100%; max-width: 560px;
  max-height: 92vh; max-height: 92dvh;
  display: flex; flex-direction: column;
  background: var(--card);
  border: 2px solid var(--ink); border-bottom: 0;
  border-radius: 26px 26px 0 0;
  box-shadow: 0 -10px 40px rgba(38,32,24,.20);
  animation: sheet-in .28s cubic-bezier(.22,.68,.24,1);
}
@keyframes sheet-in { from { transform: translateY(102%); } to { transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .sheet { animation: none; } }

/* 三段结构：把手条头 / 独立滚动体 / 固定底栏 */
.sheet .sh-head {
  flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between;
  padding: 13px 16px 10px; position: relative;
}
.sheet .sh-head::before {
  content: ""; position: absolute; top: 6px; left: 50%; transform: translateX(-50%);
  width: 36px; height: 4px; border-radius: 2px; background: #DCD5C6;
}
.sheet .sh-head h3 { font-size: 15px; font-weight: 700; color: var(--ink); font-family: var(--h1-font); margin: 0; }
.sheet .sh-head button {
  border: 0; background: none; font-family: inherit; font-size: 13.5px; cursor: pointer;
  color: var(--sub); padding: 4px 0; min-width: 34px; text-align: left; font-weight: 600;
}
.sheet .sh-head .save { color: var(--pri-d); font-weight: 700; text-align: right; }

.sheet .sh-body {
  flex: 1 1 auto; overflow-y: auto; padding: 0 16px 10px;
  scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
}
.sheet .sh-body::-webkit-scrollbar { display: none; }

/* 类型药丸（7 态，窄屏自动折行） */
.sheet .seg {
  display: flex; flex-wrap: wrap; gap: 3px;
  background: var(--pri-soft); border: 2px solid var(--ink);
  border-radius: 16px; padding: 3px; margin-bottom: 14px;
}
.sheet .seg button {
  flex: 1 1 auto; min-width: 44px; border: 0; background: none;
  font-family: inherit; font-size: 12.5px; color: var(--sub);
  padding: 8px; border-radius: 13px; cursor: pointer; font-weight: 600; white-space: nowrap;
}
.sheet .seg button.active { background: var(--pri); color: var(--pri-ink); font-weight: 700; }

/* 大金额（真实输入，非文本） */
.sheet .amount {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 12px;
  padding: 2px 2px 12px; border-bottom: 2px dashed var(--line); margin-bottom: 13px;
}
.sheet .amount .cap { flex: 0 0 auto; font-size: 12px; color: var(--sub); padding-bottom: 7px; font-weight: 600; }
.sheet .amount .val { flex: 1 1 auto; min-width: 0; display: flex; align-items: baseline; line-height: 1; }
.sheet .amount .val .cur { flex: 0 0 auto; font-size: 22px; font-weight: 700; color: var(--sub); margin-right: 3px; }
.sheet .amount .val .amt {
  flex: 1 1 auto; min-width: 0; width: 100%; padding: 0; border: 0; background: none; outline: none;
  font-family: var(--h1-font); font-size: 42px; font-weight: 700; color: var(--ink);
  font-variant-numeric: tabular-nums; line-height: 1;
}
.sheet .amount .val .amt::placeholder { color: #CFC6B6; }

/* 实时摘要行（分段，点号分隔） */
.sheet .sh-summary {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  background: var(--pri-soft); border: 2px solid var(--ink); border-radius: var(--r);
  padding: 9px 12px; margin-bottom: 14px; font-size: 12.5px; color: var(--pri-d); font-weight: 700;
}
.sheet .sh-summary .dot { flex: 0 0 auto; width: 3px; height: 3px; border-radius: 50%; background: currentColor; opacity: .55; }

/* 字段标签 */
.sheet .flabel {
  display: flex; align-items: baseline; justify-content: space-between;
  font-size: 12px; color: var(--sub); margin-bottom: 8px; font-weight: 700;
}
.sheet .flabel em { font-style: normal; font-weight: 600; color: var(--pri-d); font-size: 12px; }

/* chips 点选（视图层；真正的值仍存在隐藏的 select 里） */
.sheet .sh-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 13px; }
.sheet .sh-chip {
  max-width: 100%; border: 2px solid var(--ink); background: var(--card); border-radius: 999px;
  padding: 7px 13px; font-size: 12.5px; color: var(--ink); font-family: inherit; cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px; font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.sheet .sh-chip.active { background: var(--pri); color: var(--pri-ink); font-weight: 700; }
.sheet .sh-chip.sub { font-size: 12px; padding: 6px 12px; }
.sheet .sh-chip.more { color: var(--pri-d); border-style: dashed; }
/* chips 视图容器：在 .field-row 里独占一行（隐藏的状态源 select 也占位，但 display:none 不占） */
.sheet .views { flex: 1 0 100%; min-width: 0; }

/* 日期 / 备注 */
.sheet .frow { display: flex; gap: 9px; margin-bottom: 13px; }
.sheet .fbox {
  flex: 1; min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 8px;
  border: 2px solid var(--ink); border-radius: var(--r); padding: 9px 12px;
  font-size: 13px; color: var(--ink); background: var(--card);
}
.sheet .fbox .k { flex: 0 0 auto; font-size: 11.5px; color: var(--sub); }
.sheet .fbox .v {
  flex: 1 1 auto; min-width: 0; padding: 0; border: 0; background: none; outline: none;
  font-family: inherit; font-size: 13px; font-weight: 700; color: var(--ink);
  font-variant-numeric: tabular-nums; text-align: right;
}
.sheet .fbox .v::placeholder { color: var(--sub2); font-weight: 500; }

/* 财务助理：本地解析模式徽标 + 说明（语音记账统一进助理后，记一笔内不再有语音专用样式） */
.assistant-head .assistant-badge { font-size: 11px; font-weight: 700; color: var(--c1); border: 1.5px solid var(--c1); border-radius: 999px; padding: 1px 8px; margin-left: 6px; }
.assistant-local-note { font-size: 11.5px; color: var(--sub2); background: var(--c1s); border: 1px dashed var(--c1); border-radius: 10px; padding: 8px 10px; margin: 0 12px 8px; line-height: 1.45; }

/* 折叠区（更多选项 / 最近常记） */
.sheet .fold { border: 2px solid var(--ink); border-radius: var(--r); overflow: hidden; margin-bottom: 13px; }
.sheet .fold > .fh {
  display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%;
  padding: 11px 13px; cursor: pointer; font-size: 12.5px; color: var(--ink); font-weight: 700;
  background: var(--line-2); border: 0; font-family: inherit; text-align: left;
}
.sheet .fold > .fh .fhl { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.sheet .fold > .fh .fhl i {
  font-style: normal; font-weight: 500; color: var(--sub); font-size: 11.5px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sheet .fold > .fh .arw { flex: 0 0 auto; transition: transform .2s; font-size: 11px; color: var(--pri-d); }
.sheet .fold.open > .fh .arw { transform: rotate(180deg); }
.sheet .fold .fc { display: none; padding: 12px 13px; }
.sheet .fold.open .fc { display: block; }
.sheet .fold .rc-row { display: flex; flex-wrap: wrap; gap: 8px; }

.sheet .fin { display: flex; align-items: center; gap: 9px; font-size: 12.5px; color: var(--ink); margin-bottom: 11px; }
.sheet .fin:last-child { margin-bottom: 0; }
.sheet .fin .fk { flex: 0 0 auto; width: 76px; color: var(--sub); font-size: 12px; }
.sheet .fin input, .sheet .fin select {
  flex: 1 1 auto; min-width: 0; border: 1.5px solid var(--ink); border-radius: var(--r-sm);
  padding: 7px 10px; font-family: inherit; font-size: 12.5px; color: var(--ink);
  background: var(--card); outline: none;
}
.sheet .fin input::placeholder { color: var(--sub2); }
.sheet .fin .fold-inline { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 8px; }

/* 底栏：容器内固定（非 position:fixed）；键盘弹出时由 visualViewport 收窄 sheet 高度 */
.sheet .sh-foot {
  flex: 0 0 auto; padding: 10px 16px calc(14px + env(safe-area-inset-bottom, 0px));
  border-top: 1px dashed var(--line-2); background: var(--card);
}
.sheet .btn-save {
  width: 100%; border: 2.5px solid var(--ink); border-radius: 999px;
  background: var(--pri); color: var(--pri-ink); font-family: var(--h1-font);
  font-size: 15px; font-weight: 700; padding: 14px 0; cursor: pointer;
  box-shadow: 0 4px 0 var(--ink); transition: transform .05s, box-shadow .05s;
}
.sheet .btn-save:active { box-shadow: 0 1px 0 var(--ink); transform: translateY(3px); }
.sheet .btn-save:disabled { opacity: .55; box-shadow: 0 4px 0 rgba(61,50,41,.30); }
.sheet .sh-foot .hint { text-align: center; font-size: 11px; color: var(--sub2); margin-top: 8px; }

/* 流水操作菜单：编辑 / 删除 */
.sheet .sh-preview { display: flex; align-items: center; gap: 11px; padding: 2px 2px 14px; border-bottom: 1px solid var(--line-2); margin-bottom: 6px; }
.sheet .sh-pv-ic { width: 36px; height: 36px; border-radius: 50%; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; font-size: 16px; border: 2px solid var(--ink); background: var(--pri-soft); }
.sheet .sh-pv-b { flex: 1; min-width: 0; }
.sheet .sh-pv-t1 { font-size: 14px; font-weight: 600; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sheet .sh-pv-t2 { font-size: 11.5px; color: var(--sub); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sheet .sh-pv-amt { font-family: var(--h1-font); font-size: 16px; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.sheet .sh-pv-amt.inc { color: var(--income); }
.sheet .sh-pv-amt.exp { color: var(--amt-exp); }
.sheet .sh-act {
  width: 100%; text-align: left; font: inherit; font-size: 16px; font-weight: 600; color: var(--ink);
  background: var(--card); border: 2px solid var(--ink); border-radius: 14px; padding: 14px 16px;
  margin-top: 10px; cursor: pointer; box-shadow: 0 3px 0 rgba(61,50,41,.18);
}
.sheet .sh-act:active { box-shadow: 0 1px 0 rgba(61,50,41,.18); transform: translateY(2px); }
.sheet .sh-act.danger { color: var(--amt-exp); }
.sheet .sh-confirm-text { font-size: 13px; color: var(--sub); padding: 2px 2px 12px; }
.sheet .sh-confirm-row { display: flex; gap: 10px; }
.sheet .sh-confirm-row .btn { flex: 1; }
.btn.danger { color: #fff; background: var(--amt-exp); border-color: var(--ink); }
.btn.danger:active { transform: translateY(2px); }

/* =====================================================================
   通用选择器弹层（分类/账户「全部 N 项 ›」入口）
   ===================================================================== */
.modal-card.picker { display: flex; flex-direction: column; max-height: 86vh; }
.picker .picker-search { flex: 0 0 auto; margin-bottom: 10px; }
.picker .picker-search input {
  width: 100%; border: 2px solid var(--ink); border-radius: 999px; padding: 9px 14px;
  font-family: inherit; font-size: 13px; background: var(--card); color: var(--ink); outline: none;
}
.picker .picker-search input:focus { border-color: var(--pri); }
.picker .picker-back {
  border: 0; background: none; font-family: inherit; font-size: 13px; color: var(--pri-d);
  font-weight: 700; padding: 4px 0; margin-bottom: 6px; cursor: pointer; text-align: left;
}
.picker .picker-list { flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.picker .picker-item {
  display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%;
  border: 0; border-bottom: 1px dashed var(--line-2); background: none; font-family: inherit;
  font-size: 13.5px; color: var(--ink); padding: 11px 2px; cursor: pointer; text-align: left; font-weight: 600;
}
.picker .picker-item:last-child { border-bottom: 0; }
.picker .picker-item .pi-sub { flex: 0 0 auto; font-size: 11.5px; color: var(--sub); font-weight: 500; }
.picker .picker-item .arw { flex: 0 0 auto; color: var(--pri-d); font-size: 12px; }
.picker .picker-item.active { color: var(--pri-d); }
.picker .picker-empty { padding: 20px 0; text-align: center; font-size: 12.5px; color: var(--sub2); }
.picker .picker-actions { flex: 0 0 auto; margin-top: 12px; }