:root{
  --bg:#0f1115; --panel:#171a21; --panel2:#1e222b; --line:#272c37;
  --text:#e9edf3; --muted:#8b93a1; --accent:#34d399; --accent-dim:#1f7a5c;
  --in:#34d399; --out:#f87171; --warn:#fbbf24;
  --r:14px; --pad:16px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
/* 必须放在所有布局规则之前：hidden 属性不能被 display:flex/grid 覆盖 */
[hidden]{display:none !important}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Noto Sans CJK SC","Microsoft YaHei",sans-serif;
  font-size:15px;line-height:1.5;overscroll-behavior-y:none}
button,input{font-family:inherit;font-size:inherit;color:inherit}
button{border:0;background:none;cursor:pointer}

.boot{position:fixed;inset:0;display:grid;place-items:center}
.spin{width:26px;height:26px;border:2px solid var(--line);border-top-color:var(--accent);
  border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;
  padding:calc(env(safe-area-inset-top) + 12px) var(--pad) 12px;background:rgba(15,17,21,.86);
  backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.ledger-switch{display:flex;align-items:center;gap:8px;font-weight:600}
.ledger-switch .dot{width:7px;height:7px;border-radius:50%;background:var(--accent)}
.caret{width:0;height:0;border:4px solid transparent;border-top-color:var(--muted);margin-top:3px}
.tag{font-size:11px;letter-spacing:.08em;color:var(--muted);border:1px solid var(--line);
  padding:3px 8px;border-radius:999px}

.page{padding:var(--pad) var(--pad) 110px}
h3.sect{font-size:12px;font-weight:600;color:var(--muted);letter-spacing:.1em;margin:22px 0 10px}

.hero{background:linear-gradient(160deg,#1b2130,#151821);border:1px solid var(--line);
  border-radius:20px;padding:22px var(--pad)}
.hero.small{padding:16px var(--pad)}
.hero-label{font-size:12px;color:var(--muted);letter-spacing:.1em}
.hero-value{font-size:34px;font-weight:700;letter-spacing:-.02em;margin:6px 0 14px;
  font-variant-numeric:tabular-nums}
.hero.small .hero-value{font-size:26px;margin:4px 0 10px}
.hero-split{display:flex;gap:24px}
.hero-split .k{display:block;font-size:11px;color:var(--muted)}
.hero-split .v{font-size:16px;font-weight:600;font-variant-numeric:tabular-nums}
.in{color:var(--in)} .out{color:var(--out)}

.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:14px}
.card-k{font-size:11px;color:var(--muted);letter-spacing:.06em}
.card-v{font-size:20px;font-weight:600;margin-top:6px;font-variant-numeric:tabular-nums}
.card-sub{font-size:11px;color:var(--muted);margin-top:2px}
.chartcard{padding:14px;margin-top:4px}
.legend{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--muted);margin-top:8px}
.legend i{width:8px;height:8px;border-radius:2px;display:inline-block;margin-left:10px}
.legend i.in{background:var(--in)} .legend i.out{background:var(--out)}

.list{display:flex;flex-direction:column;gap:8px}
.row{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);
  border-radius:12px;padding:11px 13px}
.row .mid{flex:1;min-width:0}
.row .t1{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row .t2{font-size:11px;color:var(--muted);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row .amt{font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.row .amt small{display:block;font-size:10px;color:var(--muted);font-weight:400}
.row.void{opacity:.45}
.row .strip{width:3px;align-self:stretch;border-radius:2px;background:var(--line)}
.row .strip.in{background:var(--in)} .row .strip.out{background:var(--out)}
.empty{color:var(--muted);font-size:13px;text-align:center;padding:28px 0}

.segmented{display:flex;gap:6px;background:var(--panel);border:1px solid var(--line);
  border-radius:12px;padding:4px;margin-bottom:12px;overflow-x:auto}
.segmented button{flex:1;padding:7px 10px;border-radius:9px;font-size:13px;color:var(--muted);white-space:nowrap}
.segmented button.on{background:var(--panel2);color:var(--text);font-weight:600}
.statline{font-size:12px;color:var(--muted);margin-bottom:10px;font-variant-numeric:tabular-nums}
.more{width:100%;padding:12px;margin-top:10px;border:1px dashed var(--line);border-radius:12px;
  color:var(--muted);font-size:13px}

.rowline{display:flex;gap:8px;margin-bottom:12px}
input{flex:1;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:11px 13px;outline:none}
input:focus{border-color:var(--accent-dim)}
.btn{padding:11px 16px;border-radius:12px;background:var(--accent);color:#062b1f;font-weight:600}
.btn.ghost{background:var(--panel);border:1px solid var(--line);color:var(--text);font-weight:500}
.btn.wide{width:100%;margin-top:10px}
.btn.danger{background:#7f1d1d;color:#fee2e2}

.bars{display:flex;flex-direction:column;gap:9px}
.bar-row{display:grid;grid-template-columns:82px 1fr auto;gap:10px;align-items:center;font-size:12px}
.bar-name{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bar-track{height:7px;background:var(--panel2);border-radius:4px;overflow:hidden}
.bar-fill{height:100%;background:var(--accent);border-radius:4px}
.bar-fill.out{background:var(--out)}
.bar-val{font-variant-numeric:tabular-nums}

.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;
  background:rgba(15,17,21,.94);backdrop-filter:blur(14px);border-top:1px solid var(--line);
  padding:8px 6px calc(env(safe-area-inset-bottom) + 8px)}
.tabbar button{flex:1;padding:6px 0;font-size:12px;color:var(--muted)}
.tabbar button.on{color:var(--text)}
.tabbar button.on b::after{content:"";display:block;width:16px;height:2px;border-radius:2px;
  background:var(--accent);margin:4px auto 0}

.fab{position:fixed;right:18px;bottom:calc(env(safe-area-inset-bottom) + 70px);z-index:31;
  width:54px;height:54px;border-radius:50%;background:var(--accent);color:#062b1f;font-size:26px;
  font-weight:600;box-shadow:0 10px 26px rgba(52,211,153,.28)}

.sheet-wrap{position:fixed;inset:0;z-index:40}
.sheet-bg{position:absolute;inset:0;background:rgba(0,0,0,.55)}
.sheet{position:absolute;left:0;right:0;bottom:0;background:var(--panel);
  border-radius:20px 20px 0 0;border-top:1px solid var(--line);padding:18px var(--pad)
  calc(env(safe-area-inset-bottom) + 20px);max-height:88vh;overflow-y:auto;
  animation:up .22s ease-out}
@keyframes up{from{transform:translateY(18px);opacity:.6}to{transform:none;opacity:1}}
.sheet h2{margin:0 0 14px;font-size:16px}
.field{margin-bottom:12px}
.field label{display:block;font-size:11px;color:var(--muted);letter-spacing:.06em;margin-bottom:6px}
.field input,.field select{width:100%}
.chips{display:flex;flex-wrap:wrap;gap:7px}
.chip{padding:7px 12px;border:1px solid var(--line);border-radius:999px;font-size:13px;color:var(--muted)}
.chip.on{border-color:var(--accent);color:var(--accent)}
.dirc{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.dirc button{padding:12px;border-radius:12px;border:1px solid var(--line);background:var(--panel2);font-weight:600}
.dirc button.on.out{border-color:var(--out);color:var(--out)}
.dirc button.on.in{border-color:var(--in);color:var(--in)}

.toast{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom) + 96px);transform:translateX(-50%);
  z-index:60;background:#232833;border:1px solid var(--line);border-radius:999px;
  padding:9px 18px;font-size:13px;box-shadow:0 8px 22px rgba(0,0,0,.4)}