:root { --blue:#168bd2; --navy:#102534; --bg:#f2f6f8; --line:#dae5eb; --green:#17875b; --red:#c64755; font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif; color:#17212b; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); }
.topbar { min-height:64px; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:0 5vw; color:white; background:linear-gradient(100deg,#102534,#16435d); }
.topbar>div { display:flex; align-items:center; gap:10px; }
.mini-logo,.logo { display:grid; place-items:center; color:white; font-weight:900; background:linear-gradient(135deg,#24c3ff,#1251d4); border-radius:12px; box-shadow:0 5px 16px rgba(18,81,212,.25); }
.mini-logo { width:36px; height:36px; }.logo { width:72px; height:72px; margin:auto; font-size:25px; border-radius:20px; }
.export { padding:9px 13px; border:1px solid rgba(255,255,255,.4); border-radius:9px; color:white; text-decoration:none; }
.container { width:min(1180px,calc(100% - 28px)); margin:30px auto 70px; }
.heading { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; }.heading h1 { margin:3px 0 0; }.eyebrow { margin:0; color:var(--blue); font-weight:800; }.hint { color:#6b7a89; }
.summary-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:24px 0; }.summary,.ledger-card,.welcome-card { border:1px solid var(--line); border-radius:16px; background:white; box-shadow:0 8px 25px rgba(16,37,52,.05); }.summary { padding:20px; }.summary span { display:block; color:#6b7a89; }.summary strong { display:block; margin-top:10px; font-size:25px; }.summary.income strong,.number.income { color:var(--green); }.summary.expense strong,.number.expense { color:var(--red); }.summary.balance { color:white; background:linear-gradient(135deg,#168bd2,#1268b4); }.summary.balance span { color:#dff2ff; }
.ledger-card { padding:22px; }.ledger-card h2 { margin:0 0 17px; }.table-wrap { overflow:auto; }table { width:100%; border-collapse:collapse; white-space:nowrap; }th,td { padding:13px 11px; border-bottom:1px solid var(--line); text-align:left; }th { color:#71808c; font-size:12px; }.tag { display:inline-flex; padding:4px 9px; border-radius:999px; font-size:12px; }.tag.income { color:var(--green); background:#dff5eb; }.tag.expense { color:var(--red); background:#fde8eb; }.voided { opacity:.48; text-decoration:line-through; }.empty { padding:50px; text-align:center; color:#71808c; }
.filter-card { display:grid; grid-template-columns:repeat(4,minmax(140px,1fr)) auto; gap:12px; align-items:end; margin-top:22px; padding:18px; border:1px solid var(--line); border-radius:16px; background:#fff; box-shadow:0 8px 25px rgba(16,37,52,.05); }
.filter-card label span { display:block; margin-bottom:7px; color:#60717f; font-size:13px; font-weight:700; }.filter-card input { width:100%; height:42px; padding:0 11px; border:1px solid #cad9e1; border-radius:9px; font:inherit; }.filter-actions { display:flex; gap:8px; }.filter-actions button,.filter-actions a { height:42px; display:inline-flex; align-items:center; justify-content:center; padding:0 18px; border-radius:9px; font:inherit; text-decoration:none; cursor:pointer; }.filter-actions .primary { border:0; color:#fff; background:var(--blue); }.filter-actions .reset { border:1px solid #cad9e1; color:#40515f; background:#fff; }
.summary-grid.four { grid-template-columns:repeat(4,1fr); }.summary small { display:block; margin-top:6px; color:#6b7a89; font-size:14px; }.summary.balance small { color:#dff2ff; }.summary.rate-card { color:#fff; background:linear-gradient(135deg,#102534,#2a6079); }.summary.rate-card span,.summary.rate-card small { color:#dceaf1; }
.accordion-stack { display:grid; gap:14px; }.ledger-card { padding:0; overflow:hidden; }.ledger-card summary { list-style:none; display:flex; justify-content:space-between; gap:16px; padding:19px 22px; cursor:pointer; font-weight:800; }.ledger-card summary::-webkit-details-marker { display:none; }.ledger-card summary::after { content:"＋"; order:3; color:var(--blue); }.ledger-card[open] summary::after { content:"－"; }.ledger-card summary b { margin-left:auto; color:#526575; font-size:14px; }.ledger-card .table-wrap { border-top:1px solid var(--line); }.ledger-card table { background:#fff; }
.landing { min-height:100vh; display:grid; place-items:center; padding:20px; background:linear-gradient(145deg,#102534,#176c9d); }.welcome-card { width:min(520px,100%); padding:46px 34px; text-align:center; }.welcome-card h1 { margin:20px 0 10px; }.welcome-card p { margin:0; color:#6b7a89; line-height:1.7; }
@media(max-width:980px){.filter-card{grid-template-columns:repeat(2,1fr)}.summary-grid.four{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.heading{align-items:flex-start;flex-direction:column}.summary-grid,.summary-grid.four{grid-template-columns:1fr}.topbar{padding:10px 14px}.container{margin-top:18px}.filter-card{grid-template-columns:1fr}.filter-actions>*{flex:1}.ledger-card summary{padding:16px;flex-wrap:wrap}.ledger-card summary b{width:100%;margin:0}.table-wrap{font-size:13px}}