:root{ --ink:#1a1a1a; --grey:#6b6b6b; --line:#e5e5e5; --accent:#E9A23B; --bg:#fff; }
*{ box-sizing:border-box; }
body{ margin:0; background:var(--bg); color:var(--ink);
  font-family:-apple-system,"Apple SD Gothic Neo","Malgun Gothic",sans-serif; font-size:17px; line-height:1.6; }
main{ max-width:520px; margin:0 auto; padding:24px 20px 60px; }

header{ padding:8px 0 24px; }
.label{ margin:0; color:var(--grey); font-size:15px; }
.total{ margin:4px 0 0; font-size:38px; font-weight:700; letter-spacing:-.5px; }

form{ display:flex; flex-direction:column; gap:8px; padding-bottom:28px; border-bottom:1px solid var(--line); }
label{ margin-top:12px; font-size:15px; color:var(--grey); }
input{ width:100%; padding:14px 16px; font-size:18px; border:1px solid var(--line);
  border-radius:12px; background:#fff; color:var(--ink); }
input:focus{ outline:2px solid var(--accent); outline-offset:1px; border-color:transparent; }

.chips{ display:flex; gap:8px; flex-wrap:wrap; }
.chip{ flex:1 1 auto; padding:12px 10px; font-size:16px; border:1px solid var(--line);
  border-radius:12px; background:#fff; color:var(--grey); cursor:pointer; }
.chip.on{ border-color:var(--ink); color:var(--ink); font-weight:600; }

.save{ margin-top:20px; width:100%; padding:17px; font-size:18px; font-weight:700;
  border:0; border-radius:14px; background:var(--accent); color:#1a1a1a; cursor:pointer; }
.save:disabled{ opacity:.6; cursor:default; }
.msg{ margin:10px 0 0; font-size:15px; color:#b4531f; }

.list{ list-style:none; margin:0; padding:0; }
.list li{ display:flex; align-items:center; gap:12px; padding:16px 2px; border-bottom:1px solid var(--line); }
.li-main{ flex:1; min-width:0; }
.li-title{ font-size:17px; }
.li-sub{ font-size:14px; color:var(--grey); }
.li-amount{ font-size:18px; font-weight:600; white-space:nowrap; }
.del{ border:0; background:none; color:var(--grey); font-size:15px; padding:8px; cursor:pointer; }
.empty{ padding:36px 0; text-align:center; color:var(--grey); }