:root{
  /* 主色 */
  --blue:#2F6BFF;
  --blue-deep:#1D4ED8;
  --blue-soft:#E8EFFF;
  --ink:#0F172A;
  --ink-2:#475569;
  --ink-3:#94A3B8;
  --line:#E6E9F0;
  --card:#FFFFFF;
  --bg:#F4F6FB;
  --green:#0E9F6E;
  --red:#E5484D;
  --amber:#F59E0B;
  --tabbar-h:58px;
  --kb-h:238px;
  --radius:16px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;height:100%}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  color:var(--ink);font-size:16px;line-height:1.45;
  overscroll-behavior-y:none;
  background:
    radial-gradient(1100px 480px at 10% -8%, #E4EDFF 0%, rgba(228,237,255,0) 62%),
    radial-gradient(900px 420px at 105% 4%, #F3E8FF 0%, rgba(243,232,255,0) 58%),
    linear-gradient(180deg,#F7F9FE 0%, #F1F4FA 100%);
  background-attachment:fixed;
}
button,input,select{font-family:inherit;font-size:inherit;color:inherit}
button{border:none;background:none;padding:0;cursor:pointer}

/* ---------- 顶栏：渐变 ---------- */
.topbar{
  position:sticky;top:0;z-index:30;
  display:flex;align-items:center;justify-content:space-between;
  padding:calc(env(safe-area-inset-top) + 11px) 14px 11px;
  background:linear-gradient(120deg,#2F6BFF 0%,#5B4BFF 52%,#8B5CF6 100%);
  color:#fff;
  border-bottom:none;
  box-shadow:0 4px 18px rgba(47,107,255,.22);
}
.brand{display:flex;align-items:center;gap:8px;font-weight:700;font-size:17px;color:#fff}
.dot{width:9px;height:9px;border-radius:50%;background:#7CFFCB;display:inline-block;box-shadow:0 0 0 3px rgba(124,255,203,.25)}
.topRight{display:flex;align-items:center;gap:10px}
.saveState{font-size:12px;color:rgba(255,255,255,.82)}
.iconBtn{font-size:14px;color:#fff;padding:6px 9px;border-radius:9px;background:rgba(255,255,255,.16)}
.iconBtn:active{background:rgba(255,255,255,.3)}

/* ---------- 视图 ---------- */
.view{display:none;padding:12px 12px calc(var(--tabbar-h) + var(--kb-h) + 24px)}
.view.active{display:block}
#view-list.active,#view-review.active,#view-cats.active{padding-bottom:calc(var(--tabbar-h) + 24px)}

/* ---------- 金额卡 ---------- */
.amountCard{
  border-radius:var(--radius);padding:15px 16px;
  background:linear-gradient(135deg,#FFFFFF 0%,#F7FAFF 100%);
  box-shadow:0 2px 10px rgba(15,23,42,.05), inset 0 0 0 1px rgba(47,107,255,.10);
}
.amountRow{display:flex;align-items:baseline;gap:6px}
.cur{font-size:22px;color:var(--blue);font-weight:600}
.amountText{
  font-size:46px;font-weight:800;letter-spacing:-1.2px;flex:1;overflow:hidden;white-space:nowrap;
  background:linear-gradient(120deg,#1D4ED8,#7C3AED);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.amountText.is-income{background:linear-gradient(120deg,#059669,#10B981);-webkit-background-clip:text;background-clip:text}
.amountText.is-expense{background:linear-gradient(120deg,#DC2626,#F97316);-webkit-background-clip:text;background-clip:text}
.backspace{font-size:22px;color:var(--ink-3);padding:4px 6px}
.alertLine{min-height:20px;font-size:13px;color:#B45309;margin-top:5px;font-weight:500}
.alertLine.warn{color:#DC2626;font-weight:700}

/* ---------- 类型 ---------- */
.segRow{display:flex;gap:8px;margin:12px 0}
.seg{
  flex:1;padding:11px;border-radius:12px;font-weight:700;
  background:#fff;color:var(--ink-3);border:1.5px solid var(--line);transition:.16s;
}
.seg[data-kind="支出"].active{
  background:linear-gradient(120deg,#F43F5E,#FB7185);color:#fff;border-color:transparent;
  box-shadow:0 4px 14px rgba(244,63,94,.30);
}
.seg[data-kind="收入"].active{
  background:linear-gradient(120deg,#059669,#34D399);color:#fff;border-color:transparent;
  box-shadow:0 4px 14px rgba(5,150,105,.28);
}

/* ---------- 通用 ---------- */
.row2{display:flex;gap:10px}
.field{flex:1;background:var(--card);border-radius:var(--radius);padding:10px 12px;box-shadow:0 1px 6px rgba(15,23,42,.04)}
.field label{display:block;font-size:12px;color:var(--ink-3);margin-bottom:6px}
.quickDates{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.dateInput{border:1.5px solid var(--line);border-radius:10px;padding:6px 8px;background:#fff}
.block{background:var(--card);border-radius:var(--radius);padding:12px;margin-top:12px;box-shadow:0 1px 6px rgba(15,23,42,.04)}
.blockHead{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--ink-2);margin-bottom:9px}
.blockHead>span:first-child{font-weight:600;color:var(--ink)}
.hint{font-size:12px;color:var(--ink-3)}
.picked{font-size:13px;color:var(--blue);font-weight:700}
.chipWrap{display:flex;flex-wrap:wrap;gap:6px}
.chipWrap.tiny{margin-top:8px}
.chip{padding:7px 12px;border-radius:999px;background:#F1F4F9;color:var(--ink-2);font-size:14px;border:1.5px solid transparent;transition:.14s}
.chip:active{transform:scale(.95)}
.chip.on{background:var(--blue);color:#fff;border-color:var(--blue);font-weight:600;box-shadow:0 3px 10px rgba(47,107,255,.28)}
.chip.mini{font-size:12px;padding:5px 9px;background:#F6F7FA}

/* 日期快捷 chip */
.chip[data-day].on{background:linear-gradient(120deg,#2F6BFF,#7C3AED);color:#fff;border-color:transparent;font-weight:600}

/* ---------- 分类彩色编码 ---------- */
.c1{display:inline-flex;align-items:center;gap:6px}
.c1 .c1dot{width:8px;height:8px;border-radius:50%;background:currentColor;flex:none}
.c1.on{color:#fff}
.c1.on .c1dot{background:#fff;box-shadow:0 0 0 2px rgba(255,255,255,.45)}
.cat-01{--tint:#FFF3E6;--soft:#EA580C;--deep:#C2410C}
.cat-02{--tint:#FDE9F3;--soft:#DB2777;--deep:#BE185D}
.cat-03{--tint:#E7F0FF;--soft:#2563EB;--deep:#1D4ED8}
.cat-04{--tint:#E6F7F7;--soft:#0D9488;--deep:#0F766E}
.cat-05{--tint:#F2EBFF;--soft:#7C3AED;--deep:#6D28D9}
.cat-06{--tint:#E8F8EE;--soft:#16A34A;--deep:#15803D}
.cat-07{--tint:#EAF6EC;--soft:#4D9A5F;--deep:#3F7C4C}
.cat-08{--tint:#E6F6FD;--soft:#0284C7;--deep:#0369A1}
.cat-09{--tint:#EAEBFF;--soft:#4F46E5;--deep:#4338CA}
.cat-10{--tint:#F3EAFE;--soft:#9333EA;--deep:#7E22CE}
.cat-11{--tint:#EAF4E2;--soft:#65A30D;--deep:#4D7C0F}
.cat-12{--tint:#FDEAEA;--soft:#DC2626;--deep:#B91C1C}
.cat-13{--tint:#EEF1F5;--soft:#64748B;--deep:#475569}
.cat-14{--tint:#E4F1F5;--soft:#0E7490;--deep:#155E75}
.cat-15{--tint:#FFF6E3;--soft:#D97706;--deep:#B45309}
.cat-99{--tint:#F1F5F9;--soft:#94A3B8;--deep:#64748B}
.cat-in-01{--tint:#E6FAF1;--soft:#059669;--deep:#047857}
.cat-in-02{--tint:#EAF7E6;--soft:#3F9142;--deep:#2F7A33}
.cat-in-03{--tint:#FDF3E3;--soft:#D97706;--deep:#B45309}
.cat-in-04{--tint:#FDECF3;--soft:#DB2777;--deep:#BE185D}
.cat-in-05{--tint:#EEF1F6;--soft:#64748B;--deep:#475569}

.chip.catTint{background:var(--tint);color:var(--soft);border-color:transparent;font-weight:600}
.chip.catTint:active{background:var(--tint)}
.chip.catSolid{background:var(--soft);color:#fff;border-color:transparent;font-weight:700;box-shadow:0 3px 10px rgba(15,23,42,.16)}
.chip.on-sub{background:var(--tint);color:var(--deep);border-color:var(--soft);font-weight:700}
.subWrap{margin-top:8px;padding-top:9px;border-top:1px dashed var(--line)}
.remarkRow{display:flex;gap:8px}
.textInput{flex:1;min-width:0;border:1.5px solid var(--line);border-radius:11px;padding:11px 12px;background:#fff}
.textInput:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(47,107,255,.12)}
.textInput.small{padding:8px 10px;font-size:14px}
.saveBtn{
  background:linear-gradient(120deg,#2F6BFF,#7C3AED);color:#fff;font-weight:700;
  border-radius:11px;padding:11px 16px;white-space:nowrap;box-shadow:0 4px 14px rgba(47,107,255,.30);
}
.saveBtn:active{filter:brightness(.94)}
.saveBtn.wide{width:100%;margin-top:14px}
.smallBtn{border:1.5px solid var(--line);border-radius:10px;padding:7px 11px;font-size:13px;color:var(--ink-2);background:#fff}
.smallBtn.danger{color:var(--red);border-color:#FBD5D5}

/* ---------- 迷你列表 ---------- */
.miniList{display:flex;flex-direction:column;gap:6px}
.miniRow{display:flex;justify-content:space-between;align-items:center;font-size:14px;padding:8px 10px;background:#F7F9FC;border-radius:10px;border-left:3px solid transparent}
.miniRow .m1{color:var(--ink-3);font-size:12px;min-width:74px}
.miniRow .m2{flex:1;margin:0 8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.miniRow .m3{font-weight:700}
.m3.exp{color:var(--red)}
.m3.inc{color:var(--green)}
.miniRow .del{color:var(--ink-3);font-size:15px;padding:0 2px}

/* ---------- 账目列表 ---------- */
.filterRow{display:flex;gap:8px;margin-bottom:10px}
.select{border:1.5px solid var(--line);border-radius:10px;padding:8px 10px;background:#fff}
.txnList{display:flex;flex-direction:column}
.txnDay{font-size:12px;color:var(--ink-3);padding:10px 2px 4px;display:flex;justify-content:space-between}
.txnItem{display:flex;align-items:center;gap:10px;padding:11px 2px;border-bottom:1px solid #F1F3F7}
.txnItem .t1{flex:1;min-width:0}
.txnItem .t1 .a{font-size:15px;font-weight:600}
.txnItem .t1 .b{font-size:12px;color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.txnItem .t2{font-weight:700;white-space:nowrap}
.txnDot{width:9px;height:9px;border-radius:50%;flex:none}

/* ---------- 复盘 ---------- */
.kpiGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.kpi{background:var(--card);border-radius:var(--radius);padding:12px;box-shadow:0 1px 6px rgba(15,23,42,.04);position:relative;overflow:hidden}
.kpi::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--accent,#2F6BFF)}
.kpi .k{font-size:12px;color:var(--ink-3)}
.kpi .v{font-size:23px;font-weight:800;margin-top:2px;letter-spacing:-.4px}
.kpi .s{font-size:11px;color:var(--ink-3);margin-top:2px}
.alertList{display:flex;flex-direction:column;gap:8px}
.alertItem{border-left:4px solid var(--amber);background:linear-gradient(90deg,#FFF9EC,#FFFDF8);padding:9px 11px;border-radius:9px;font-size:13px}
.alertItem.high{border-color:var(--red);background:linear-gradient(90deg,#FFF1F1,#FFFAFA);color:#991B1B;font-weight:600}
.rankList{display:flex;flex-direction:column;gap:10px}
.rankRow .rTop{display:flex;justify-content:space-between;font-size:14px}
.rankRow .rTop .nm{font-weight:600}
.rankRow .rTop .vv{color:var(--ink-2)}
.rankRow .bar{height:8px;border-radius:5px;background:#EEF1F6;margin-top:6px;overflow:hidden}
.rankRow .bar i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,var(--soft,#2F6BFF),var(--deep,#1D4ED8))}
.trendChart{display:flex;align-items:flex-end;gap:5px;height:130px;padding-top:8px}
.trendCol{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:5px}
.trendCol .tb{width:100%;border-radius:5px 5px 0 0;min-height:3px;
  background:linear-gradient(180deg,#60A5FA,#2F6BFF)}
.trendCol.now .tb{background:linear-gradient(180deg,#A78BFA,#7C3AED)}
.trendCol .tl{font-size:9px;color:var(--ink-3)}
.healthBox{font-size:14px}
.healthBox .hRow{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px dashed var(--line);gap:10px}
.healthBox .ok{color:var(--green);font-weight:600}
.healthBox .bad{color:var(--red);font-weight:600}

/* ---------- 分类树 ---------- */
.catTree{display:flex;flex-direction:column;gap:10px}
.catNode{border-radius:12px;overflow:hidden;box-shadow:0 1px 6px rgba(15,23,42,.05);background:#fff}
.catNode .head{display:flex;align-items:center;gap:8px;padding:11px;background:var(--tint,#F7F9FC);border-left:4px solid var(--soft,#2F6BFF)}
.catNode .head .nm{font-weight:700;flex:1;color:var(--deep,var(--ink))}
.catNode .head .amt{font-size:13px;color:var(--ink-2)}
.catNode .body{padding:10px 11px;display:flex;flex-wrap:wrap;gap:6px;background:#fff}
.subChip{display:flex;align-items:center;gap:6px;background:var(--tint,#F4F6FA);border-radius:9px;padding:6px 9px;font-size:13px;color:var(--deep,var(--ink-2));font-weight:500}
.subChip .cnt{color:var(--soft,var(--ink-3));font-size:11px;font-weight:700}
.subChip .x{color:var(--soft,var(--ink-3));font-size:12px;opacity:.75}
.budBar{height:6px;border-radius:4px;background:#E9EDF3;margin-top:6px;overflow:hidden}
.budBar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--soft,#2F6BFF),var(--deep,#1D4ED8))}

/* ---------- 账户选择 ---------- */
.chip.acct{display:inline-flex;align-items:center;gap:5px;background:#F1F4F9;color:var(--ink-2);border:1.5px solid transparent;font-size:14px}
.chip.acct .ai{font-size:14px;line-height:1}
.chip.acct.credit{background:#FFF1F2;color:#BE123C}
.chip.acct.on{background:linear-gradient(120deg,#2F6BFF,#7C3AED);color:#fff;box-shadow:0 3px 10px rgba(47,107,255,.26)}
.chip.acct.on.credit{background:linear-gradient(120deg,#E11D48,#F97316);box-shadow:0 3px 10px rgba(225,29,72,.26)}
.chip.acct.addAcct{background:#fff;border:1.5px dashed var(--line);color:var(--ink-3)}
.creditHint{display:none;margin-top:9px;padding:8px 10px;border-radius:9px;font-size:12.5px;
  background:linear-gradient(120deg,#FFF1F2,#FFF7F7);color:#9F1239;border-left:3px solid #E11D48;line-height:1.5}
.acctManage{display:flex;flex-direction:column;gap:6px;margin-bottom:8px}
.acctRow{display:flex;align-items:center;gap:8px;font-size:13px;padding:8px 10px;background:#F7F9FC;border-radius:9px}
.acctRow .an{flex:1;font-weight:600}
.acctRow .at,.acctRow .au{color:var(--ink-3);font-size:12px}
.acctRow .x{color:var(--ink-3);font-size:13px;padding:0 3px}
.acctBars{display:flex;flex-direction:column;gap:10px}
.acctBar .t{display:flex;justify-content:space-between;font-size:13.5px}
.acctBar .t .nm{font-weight:600}
.acctBar .t .nm .tp{font-size:11px;color:var(--ink-3);font-weight:400;margin-left:5px}
.acctBar .bar{height:8px;border-radius:5px;background:#EEF1F6;margin-top:6px;overflow:hidden}
.acctBar .bar i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,#60A5FA,#2F6BFF)}
.acctBar.credit .bar i{background:linear-gradient(90deg,#FB7185,#E11D48)}

/* ---------- 转账 ---------- */
.seg[data-kind="转账"].active{
  background:linear-gradient(120deg,#7C3AED,#A855F7);color:#fff;border-color:transparent;
  box-shadow:0 4px 14px rgba(124,58,237,.30);
}
.trRow{display:flex;align-items:flex-start;gap:8px}
.trSide{flex:1;min-width:0}
.trLabel{font-size:12px;color:var(--ink-3);margin-bottom:6px}
.trArrow{align-self:center;color:var(--blue);font-size:18px;font-weight:700;padding-top:14px}
.trHint{display:none;margin-top:10px;padding:8px 10px;border-radius:9px;font-size:12.5px;line-height:1.5;
  background:linear-gradient(120deg,#F3E8FF,#FAF5FF);color:#5B21B6;border-left:3px solid #7C3AED}
.m3.tr{color:#7C3AED}

/* ---------- 家庭净资产 ---------- */
.netBox .netTop{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;
  padding-bottom:10px;border-bottom:1px dashed var(--line);flex-wrap:wrap}
.netBox .nl{font-size:12px;color:var(--ink-3)}
.netBox .nv{font-size:26px;font-weight:800;letter-spacing:-.6px;margin-top:2px}
.netBox .netSub{font-size:12px;color:var(--ink-2);text-align:right;line-height:1.7}
.netBox .netSub b{margin-left:5px}
.netList{margin-top:10px;display:flex;flex-direction:column;gap:2px}
.netRow{display:flex;justify-content:space-between;font-size:13.5px;padding:7px 0;border-bottom:1px solid #F4F6FA}
.netRow .nn{font-weight:600}
.netRow .nt{font-size:11px;color:var(--ink-3);font-weight:400;margin-left:5px}
.netRow.credit .nn{color:#BE123C}
.netRow .nv2{font-weight:700}
.netBox .tip{font-size:11.5px;color:var(--ink-3);margin-top:10px;line-height:1.5}

/* ---------- 账户页 ---------- */
.acctCards{display:flex;flex-direction:column;gap:10px}
.acctCard{background:#fff;border-radius:13px;border:1px solid var(--line);overflow:hidden}
.acctCard.credit{border-color:#FBD5D5;background:linear-gradient(180deg,#FFF8F8,#fff)}
.acctCard .acHead{display:flex;align-items:center;gap:8px;padding:11px;background:#FAFBFC;border-bottom:1px solid var(--line)}
.acctCard.credit .acHead{background:#FFF1F2}
.acctCard .acHead .ai{font-size:16px}
.acctCard .acHead .anm{font-weight:700;flex:1}
.acctCard .acHead .atp{font-size:11px;color:var(--ink-3);background:#EEF1F6;border-radius:6px;padding:2px 7px}
.acctCard .acHead .aval{font-weight:800;font-size:16px}
.acctCard .acBody{padding:11px;display:flex;flex-direction:column;gap:9px}
.acField{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13.5px;color:var(--ink-2)}
.acField .numInput{width:130px;text-align:right;font-weight:600}
.acField .select{padding:7px 9px}
.acMeta{font-size:12px;color:var(--ink-3)}
.acBtns{display:flex;gap:8px}

/* ---------- 还款提醒 ---------- */
.remCard{border-radius:14px;padding:12px;margin-bottom:12px;box-shadow:0 2px 10px rgba(15,23,42,.06);
  background:#fff;border-left:5px solid var(--ink-3)}
.remCard.urgent{background:linear-gradient(135deg,#FFF1F1,#FFF8F8);border-left-color:#DC2626}
.remCard.soon{background:linear-gradient(135deg,#FFF9EC,#FFFDF7);border-left-color:#F59E0B}
.remCard.ok{background:linear-gradient(135deg,#ECFDF5,#F7FEFB);border-left-color:#0E9F6E}
.remCard .rcHead{display:flex;justify-content:space-between;align-items:center;font-size:13.5px;font-weight:700;margin-bottom:8px}
.remCard .rcState{font-size:12px;font-weight:700;padding:3px 9px;border-radius:999px;background:#EEF1F6;color:var(--ink-2)}
.remCard .rcState.urgent{background:#DC2626;color:#fff}
.remCard .rcState.soon{background:#F59E0B;color:#fff}
.remCard .rcState.ok{background:#D1FAE5;color:#065F46}
.rcList{display:flex;flex-direction:column;gap:6px}
.rcRow{display:flex;align-items:center;gap:8px;font-size:13.5px;padding:7px 9px;border-radius:9px;background:rgba(255,255,255,.75)}
.rcRow.u{background:#fff;box-shadow:inset 0 0 0 1.5px #FCA5A5}
.rcRow.s{background:#fff;box-shadow:inset 0 0 0 1.5px #FCD34D}
.rcRow .rcName{flex:1;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rcRow .rcAmt{font-weight:700;white-space:nowrap}
.rcRow .rcDue{font-size:12px;color:var(--ink-3);white-space:nowrap}
.rcRow .rcDue b{margin-left:4px;color:var(--red)}
.remCard .rcFoot{font-size:11px;color:var(--ink-3);margin-top:8px}
.cardDays{display:flex;flex-direction:column;gap:9px;padding:9px;border-radius:10px;background:#FFF8F8}
.acField.chk{justify-content:flex-start;gap:8px}
.acField.chk input{width:20px;height:20px}
.acRemind{font-size:12.5px;color:var(--ink-2);background:#fff;border-radius:8px;padding:7px 9px;line-height:1.5}
.acRemind.u{color:#991B1B;box-shadow:inset 0 0 0 1.5px #FCA5A5}
.acRemind.s{color:#92400E;box-shadow:inset 0 0 0 1.5px #FCD34D}
.notifyRow{display:flex;gap:10px;align-items:flex-start;justify-content:space-between;font-size:13.5px}
.notifyRow .ok{color:var(--green);font-weight:700}
.notifyRow .bad{color:var(--red);font-weight:700}

.acctCard.gold{border-color:#F3D9A4;background:linear-gradient(180deg,#FFFCF4,#fff)}
.acctCard.gold .acHead{background:linear-gradient(120deg,#FFF6E0,#FFFBF0)}
.acctCard.gold .acHead .atp{background:#FBEBC7;color:#8A5A00}
.acctCard.gold .acHead .aval{color:#A16207}

/* ---------- 键盘 ---------- */
.keypad{
  position:fixed;left:0;right:0;bottom:var(--tabbar-h);z-index:25;
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--line);border-top:1px solid var(--line);height:var(--kb-h);
}
.keypad button{background:#fff;font-size:22px;font-weight:600;color:var(--ink)}
.keypad button:active{background:linear-gradient(120deg,#EEF3FF,#F5EEFF)}
.keypad .okKey{background:linear-gradient(120deg,#2F6BFF,#7C3AED);color:#fff;font-weight:800;font-size:17px}
.keypad .okKey:active{filter:brightness(.93)}
.keypad button[data-k="+"],.keypad button[data-k="-"]{color:var(--blue);font-weight:700}

/* ---------- 底部导航：彩色 ---------- */
.tabbar{
  position:fixed;left:0;right:0;bottom:0;z-index:26;height:var(--tabbar-h);
  display:grid;grid-template-columns:repeat(4,1fr);
  background:rgba(255,255,255,.97);backdrop-filter:blur(14px) saturate(180%);
  border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom);
}
.tab{color:var(--ink-3);font-size:12px;display:flex;align-items:center;justify-content:center;position:relative;font-weight:500}
.tab.active{color:var(--blue);font-weight:800}
.tab.active::after{
  content:"";position:absolute;bottom:6px;width:22px;height:3px;border-radius:2px;
  background:linear-gradient(90deg,#2F6BFF,#7C3AED);
}

/* ---------- 设置面板 ---------- */
.sheet{position:fixed;inset:0;z-index:50;background:rgba(15,23,42,.45);display:none;align-items:flex-end;backdrop-filter:blur(2px)}
.sheet.open{display:flex}
.sheetCard{background:#fff;width:100%;max-height:86vh;overflow:auto;border-radius:20px 20px 0 0;padding:18px 16px calc(18px + env(safe-area-inset-bottom))}
.sheetCard h3{margin:8px 0 10px;font-size:15px;color:var(--blue-deep)}
.cfgRow{display:flex;align-items:center;gap:8px;font-size:14px;padding:8px 0;color:var(--ink-2)}
.numInput{width:88px;border:1.5px solid var(--line);border-radius:9px;padding:7px 9px}
.btnRow{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.tip{font-size:12px;color:var(--ink-3);margin:14px 0 0}

/* ---------- 提示 ---------- */
.toast{
  position:fixed;left:50%;bottom:calc(var(--tabbar-h) + var(--kb-h) + 18px);
  transform:translateX(-50%) translateY(20px);z-index:60;
  background:linear-gradient(120deg,rgba(29,78,216,.96),rgba(124,58,237,.96));
  color:#fff;font-size:14px;font-weight:600;padding:10px 18px;border-radius:999px;
  opacity:0;transition:.22s;pointer-events:none;max-width:88vw;text-align:center;
  box-shadow:0 8px 22px rgba(47,107,255,.32);
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.empty{color:var(--ink-3);font-size:13px;padding:14px 4px;text-align:center}