:root {
  --ink:#141520; --muted:#595b69; --line:#dcdde4; --indigo:#231d86; --lavender:#eeedfd;
  --green:#12612d; --mint:#e9f7ed; --red:#a32130; --pink:#fceced;
  font-family:Inter,"Segoe UI",system-ui,sans-serif; color:var(--ink); background:#fdfdfd;
  font-size:16px; line-height:1.45; font-variant-numeric:tabular-nums;
}
* {box-sizing:border-box}
body {margin:0}
[hidden] {display:none!important}
.shell {width:min(1520px,100%); margin-inline:auto; padding-inline:clamp(16px,3vw,48px)}
main.shell {padding-block:clamp(24px,3.2vw,48px) 48px}
a {color:var(--indigo)}
button,select,input {font:inherit}
button,select,summary {cursor:pointer}
button,.upload-button,.export {font-weight:650; border-radius:9px; line-height:1.2}
button {color:#fff; background:var(--indigo); border:0; padding:11px 15px}
input,select {background:white; color:var(--ink); border:1px solid #babcc9; border-radius:7px; padding:9px; min-width:0}
a:focus-visible,button:focus-visible,select:focus-visible,summary:focus-visible,input:focus-visible,.upload-button:focus-within {
  outline:3px solid #7068dc; outline-offset:3px;
}
h1,h2,h3,p {margin:0}
h1,h2,.brand {letter-spacing:-.04em}
h1 {font-size:clamp(32px,3.35vw,52px); line-height:1.12; overflow-wrap:anywhere}
h2 {font-size:clamp(21px,1.75vw,28px); line-height:1.2}
p {color:var(--muted)}
.topbar {border-bottom:1px solid var(--line); background:white}
.nav,.brand,.nav nav,.export,.page-head,.upload-button,.panel-head,.filters,.entry,.review-link,.recordHead,.actions,.doc-filters {display:flex; align-items:center}
.nav {min-height:72px; gap:24px}
.nav a,.entry,.card,.doc-filters a,.review-link {text-decoration:none}
.brand {gap:11px; color:var(--ink); font-size:24px; font-weight:750; white-space:nowrap}
.nav nav {border-left:1px solid var(--line); padding-left:22px; gap:6px}
.nav nav a,.doc-filters a {color:var(--ink); padding:10px 15px; border-radius:8px; font-weight:570}
.nav a[aria-current],.doc-filters a[aria-current],.filters button[aria-pressed=true] {background:var(--lavender); color:var(--indigo); font-weight:700}
.export {margin-left:auto; border:1px solid #bfc0cd; padding:11px 15px; gap:8px; color:var(--ink); background:#fff}
.export span,.upload-button span {font-size:1.3em; line-height:1}
.page-head {gap:22px; flex-wrap:wrap; margin-bottom:24px}
.date-form select {font-weight:620; padding:10px 14px; min-height:44px}
#upload {margin-left:auto}
.upload-button {cursor:pointer; position:relative; justify-content:center; gap:9px; background:var(--indigo); color:white; padding:13px 19px; min-height:46px}
.upload-button input {position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer}
.upload-button:has(input:disabled) {opacity:.65}
.upload-status:not(:empty),.notice {display:block; padding:12px; background:var(--lavender); margin-bottom:12px; overflow-wrap:anywhere}
.totals {display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-bottom:28px}
.metric {border-radius:12px; padding:clamp(17px,2vw,30px); min-width:0}
.metric h2 {font-size:clamp(17px,1.45vw,23px); font-weight:660; letter-spacing:-.025em}
.metric strong {display:block; font-size:clamp(24px,3vw,51px); font-weight:720; line-height:1.12; letter-spacing:-.045em; margin-top:13px; overflow-wrap:anywhere}
.metric.income,.matched {background:var(--mint)}
.metric.income strong,.incoming {color:var(--green)}
.metric.expense {background:var(--pink)}
.metric.expense strong,.outgoing {color:var(--red)}
.metric.balance {background:#1b1b6d; color:white}
.dashboard {display:grid; grid-template-columns:minmax(0,1.75fr) minmax(0,1fr); align-items:start; gap:18px}
.panel,.record,.card,.review details,.day-breakdown {background:#fff; border:1px solid var(--line); border-radius:13px}
.panel {padding:clamp(14px,1.55vw,23px); min-width:0}
.panel-head {justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:16px}
.filters {border:1px solid var(--line); border-radius:8px; overflow:hidden}
.filters button {color:var(--ink); background:white; border-radius:0; padding:9px 13px; font-size:14px}
.filters button+button {border-left:1px solid var(--line)}
.filters button:focus-visible {outline-offset:-3px}
.ledger {width:100%; border-spacing:0; font-size:16px}
.ledger th {font-weight:640; color:#393b48; background:#f4f4f6; font-size:14px; text-align:left}
.ledger th:first-child {border-radius:6px 0 0 6px}
.ledger th:last-child {border-radius:0 6px 6px 0}
.ledger th,.ledger td {padding:12px 9px}
.ledger td {border-bottom:1px solid #ececf1}
.ledger tr:last-child td {border-bottom:0}
.ledger th:last-child,.ledger .amount {text-align:right}
.kind {color:var(--ink)}
.entry {gap:11px; color:inherit; width:fit-content}
.entry b,.mobile-kind {color:var(--ink)}
.entry b {overflow-wrap:anywhere}
.entry:hover b,.review-link:hover b,.card:hover b {text-decoration:underline}
.entry small {display:block; font-size:12px; color:var(--muted)}
.entry .mobile-kind {display:none}
.amount {font-weight:730; white-space:nowrap; font-size:clamp(16px,1.45vw,23px); letter-spacing:-.025em}
.sign {display:grid; place-items:center; border-radius:50%; width:32px; height:32px; flex:none; font-size:21px; font-weight:700}
.incoming .sign {background:var(--mint)}
.outgoing .sign {background:var(--pink)}
#empty-list {padding:16px 0}
.controls {display:grid; gap:14px}
.matched {border-radius:8px; padding:12px; color:#124b26}
.matched summary {font-weight:680}
.matched summary span {padding-right:4px}
.matched div,.warning dl div {display:flex; justify-content:space-between; gap:10px; align-items:baseline}
.matched div {margin-top:10px; font-size:14px}
.matched b,.warning dd {white-space:nowrap}
.warning {background:#fff8e8; border:1px solid #dfae58; border-radius:9px; padding:13px}
.warning h3 {color:#79450b; font-size:19px}
.warning p {font-size:13px; margin:4px 0 9px}
.warning dl {margin:0; border-top:1px solid #e9d6b3; padding-top:7px}
.warning dd {margin:0}
.review-link {background:#f4f4f8; color:var(--ink); justify-content:space-between; border-radius:8px; gap:8px; padding:13px; font-size:15px}
.review-link b {color:var(--indigo); white-space:nowrap}
.more,.soft {color:var(--indigo); background:var(--lavender)}
.more {margin-top:10px}
.doc-filters {gap:4px; margin-bottom:18px}
.cards {display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,245px),1fr)); gap:12px}
.card {display:flex; gap:12px; padding:12px; align-items:center; color:var(--ink); overflow-wrap:anywhere}
.card img {width:52px; height:64px; border-radius:5px; object-fit:cover}
.card p {font-size:13px; margin-top:3px}
.review {display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:24px; margin-top:22px}
.preview {width:100%; max-height:70vh; object-fit:contain; background:#f3f3f6}
.record,.review details,.day-breakdown {padding:16px; margin:14px 0}
.day-breakdown p {padding-top:12px}
.recordHead {justify-content:space-between; flex-wrap:wrap; gap:7px}
.fields {display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}
.fields label {display:grid; font-size:13px; gap:3px}
.actions {flex-wrap:wrap; gap:8px; margin-top:14px}
.evidence,pre {overflow-wrap:anywhere}
.evidence,.review h2+p {margin:8px 0 14px}
pre {white-space:pre-wrap}
.tag,.attention {font-size:13px; padding:4px 8px; border-radius:6px}
.tag {background:var(--mint); color:var(--green)}
.attention {background:#fff2d4; color:#774700}
.eyebrow {margin:18px 0 4px; font-size:12px}
@media (max-width:900px) {
  .dashboard {grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
  .ledger th,.ledger td {padding-inline:5px}
}
@media (max-width:700px) {
  .nav {min-height:60px; gap:8px; flex-wrap:wrap; padding-block:9px}
  .brand {font-size:19px; gap:7px}
  .nav nav {border:0; padding:0; gap:0}
  .nav nav a {padding:9px 8px; font-size:13px}
  .export {padding:9px; font-size:13px; gap:3px}
  .page-head {display:grid; grid-template-columns:1fr auto; gap:12px; margin-bottom:16px}
  .date-form {grid-row:2; grid-column:1/-1}
  #upload {grid-row:1; grid-column:2}
  .upload-button {padding:11px 14px}
  .totals {grid-template-columns:1fr 1fr; gap:9px; margin-bottom:16px}
  .metric {padding:14px 10px}
  .metric h2 {font-size:15px}
  .metric strong {font-size:clamp(19px,5.2vw,32px); letter-spacing:-.045em; margin-top:7px}
  .metric.balance {grid-column:1/-1; display:flex; justify-content:space-between; align-items:baseline; gap:8px}
  .metric.balance strong {margin:0}
  .dashboard,.review {grid-template-columns:minmax(0,1fr); gap:14px}
  .movements {padding:14px 11px}
  .panel-head {gap:12px; margin-bottom:12px}
  .filters button {min-height:40px}
  .ledger th,.ledger td {padding:10px 3px}
  .ledger th:nth-child(2),.ledger .kind {display:none}
  .entry {gap:7px}
  .entry b {font-size:14px}
  .entry .mobile-kind {display:inline; font-size:12px; color:inherit; font-weight:650}
  .entry small {display:inline; font-size:11px}
  .entry b {display:block}
  .entry small::after {content:' · '}
  .sign {width:24px; height:24px; font-size:17px}
  .amount {font-size:clamp(14px,4vw,19px)}
  .preview {max-height:330px}
  .record {padding:12px}
}
@media (max-width:364px) {
  .nav {display:grid;grid-template-columns:1fr auto}
  .nav nav {grid-row:2;grid-column:1/-1}
  .export {grid-column:2;grid-row:1}
  .fields {grid-template-columns:1fr}
  .metric strong {font-size:18px}
}
