.page { display:flex; flex-direction: column; height: 100vh; } .filters { display:flex; gap: 0.5rem; padding: 0.5rem; background:#fff; } .field { display:flex; justify-content: space-between; align-items:center; padding: 0.5rem; border:0.03125rem solid #eee; border-radius: 0.375rem; min-width: 9.375rem; } .label { color:#666; } .value { color:#333; } .summary { display:grid; grid-template-columns: repeat(4,1fr); gap: 0.375rem; padding: 0.375rem 0.5rem; background:#fff; border-top:0.03125rem solid #f1f1f1; border-bottom:0.03125rem solid #f1f1f1; } .sum-item { padding: 0.375rem; text-align:center; } .k { display:block; color:#888; font-size: 0.75rem; } .v { display:block; margin-top:0.1875rem; font-weight:700; color:#333; } .list { flex:1; } .item { padding: 0.5625rem 0.5rem; border-bottom:0.03125rem solid #f4f4f4; background:#fff; } .row { display:flex; align-items:center; justify-content: space-between; margin-bottom: 0.1875rem; } .title { color:#333; } .amount { font-weight:700; } .amount.in { color:#2a9d8f; } .amount.out { color:#d35b5b; } .meta { color:#999; font-size: 0.75rem; }