:root{color-scheme:light dark;--bg: #EFEDE6;--surface: #FAF8F3;--line: #DFD9CB;--line-soft: #E8E3D6;--ink: #1F1D18;--ink-2: #6E6A5E;--ink-3: #8A857A;--solid: #22201B;--solid-ink: #FAF8F3;--solid-ink-2: #D6D2C6;--solid-ink-3: #B5B0A2;--accent: #1E5B48;--accent-soft: #6FB39A;--accent-bg: #E3EAE4;--accent-ink: #FAF8F3;--pay: #8F3427;--pay-bg: #F6E4DF;--recv: #1F6B4C;--period: #6B5527;--period-bg: #EDE7DA;--chip-bg: #E4DFD2;--focus: #1E5B48;--radius: 16px;--radius-solid: 18px;--tap: 44px;--tabbar-h: 56px;--fab-h: 52px}@media(prefers-color-scheme:dark){:root{--bg: #1A1814;--surface: #232019;--line: #332F27;--line-soft: #2B2820;--ink: #EDEAE0;--ink-2: #A8A294;--ink-3: #918C7E;--solid: #2E2A22;--accent: #6FB39A;--accent-soft: #9ED4BC;--accent-bg: #1E2A26;--accent-ink: #14201C;--pay: #E8897A;--pay-bg: #3A2420;--recv: #68C39C;--period: #D4BC86;--period-bg: #332B1C;--chip-bg: #2B2820;--focus: #9ED4BC}}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Anuphan,Noto Sans Thai,-apple-system,Helvetica Neue,sans-serif;font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}#app{max-width:520px;margin:0 auto;padding:16px 16px calc(var(--tabbar-h) + var(--fab-h) + 28px + env(safe-area-inset-bottom))}h1{font-size:20px;line-height:1.5;margin:0 0 12px}h2{font-size:15px;line-height:1.5;margin:0 0 10px;color:var(--ink-2);font-weight:600}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;margin-bottom:12px}.card.solid{background:var(--solid);color:var(--solid-ink);border-color:var(--solid);border-radius:var(--radius-solid)}.card.solid .meta{color:var(--solid-ink-3)}.card.solid .label{color:var(--solid-ink-2)}.amount-hero{font-size:38px;line-height:1.5;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.01em}.amount-sub{font-size:20px;line-height:1.5;font-weight:700;font-variant-numeric:tabular-nums}.amount-hero .unit,.amount-hero .dec{font-size:20px;opacity:.62;font-weight:600}.label,.meta{font-size:13px;line-height:1.5;color:var(--ink-2)}.row{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:var(--tap);padding:8px 0;border-bottom:1px solid var(--line-soft)}.row:last-child{border-bottom:none}.row .num{font-variant-numeric:tabular-nums;font-weight:600;white-space:nowrap}.row .stack{display:flex;flex-direction:column;gap:2px;min-width:0}.chip{display:inline-block;font-size:12px;line-height:1.5;padding:1px 8px;border-radius:999px;background:var(--chip-bg);color:var(--ink-2);white-space:nowrap}.chip.owner{background:var(--accent-bg);color:var(--accent)}.chip.period{background:var(--period-bg);color:var(--period)}.chip.last{background:var(--pay-bg);color:var(--pay)}.chip.shadow{background:transparent;border:1px dashed var(--ink-2)}.avatar{width:36px;height:36px;border-radius:999px;flex:none;background:var(--chip-bg);display:grid;place-items:center;font-size:13px;line-height:1.5;color:var(--ink-2)}.avatar.dashed{background:transparent;border:2px dashed var(--ink-2)}.bar{height:8px;background:var(--chip-bg);border-radius:999px;overflow:hidden;display:flex}.card.solid .bar{background:#ffffff2e}.bar>span{height:100%;background:var(--accent)}.card.solid .bar>span{background:var(--accent-soft)}.bar>span.carried{opacity:.38}button{font:inherit;line-height:1.5;min-height:var(--tap);padding:11px 18px;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer}button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600;width:100%}button.ghost{background:transparent}button:disabled{opacity:.45;cursor:not-allowed}button.link{border:none;background:none;color:var(--accent);padding:12px 0;text-decoration:underline}button:active:not(:disabled){filter:brightness(.94)}:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:8px}.warn{background:var(--pay-bg);border:1px solid var(--pay);color:var(--pay);border-radius:var(--radius);padding:14px;margin-bottom:12px;font-size:15px;line-height:1.6}.ok{color:var(--recv)}.bad{color:var(--pay)}.empty{color:var(--ink-2);font-size:15px;line-height:1.6;padding:10px 0}.segmented{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;margin-bottom:8px}.segmented button{min-height:var(--tap);padding:8px 14px;font-size:13px;white-space:nowrap}.segmented button[aria-pressed=true]{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.viewtabs{display:flex;gap:4px;overflow-x:auto;border-bottom:1px solid var(--line);margin-bottom:12px}.viewtabs button{flex:1 0 auto;min-width:120px;min-height:var(--tap);padding:10px 12px;border:none;border-radius:0;background:none;border-bottom:2px solid transparent;color:var(--ink-2);font-size:15px;line-height:1.5;white-space:nowrap}.viewtabs button[aria-selected=true]{color:var(--ink);font-weight:700;border-bottom-color:var(--accent)}.viewtabs-count{display:inline-block;min-width:20px;padding:0 6px;margin-left:4px;border-radius:999px;background:var(--chip-bg);color:var(--ink-2);font-size:12px;line-height:1.5;font-weight:400}.viewtabs button[aria-selected=true] .viewtabs-count{background:var(--accent-bg);color:var(--accent)}.tabbar{position:fixed;left:0;right:0;bottom:0;display:flex;background:var(--surface);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom);z-index:10}.tabbar button{flex:1;min-height:var(--tabbar-h);border:none;border-radius:0;background:none;font-size:12px;line-height:1.5;color:var(--ink-2)}.tabbar button[aria-current=page]{color:var(--ink);font-weight:700;box-shadow:inset 0 2px 0 var(--accent)}.fab{position:fixed;right:16px;z-index:11;bottom:calc(var(--tabbar-h) + 12px + env(safe-area-inset-bottom));min-height:var(--fab-h);width:auto;padding:0 20px;border-radius:999px;font-weight:700;background:var(--accent);border-color:var(--accent);color:var(--accent-ink);box-shadow:0 6px 18px #0000002e}.field{margin-bottom:14px}.field label{display:block;font-size:13px;line-height:1.5;margin-bottom:6px;color:var(--ink-2)}.field input,.field select{width:100%;min-height:var(--tap);font:inherit;line-height:1.5;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink)}.sheet-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0c0b0880;display:flex;align-items:flex-end;justify-content:center;z-index:20}.sheet{background:var(--surface);width:100%;max-width:520px;border-radius:20px 20px 0 0;padding:10px 16px calc(20px + env(safe-area-inset-bottom));max-height:72vh;overflow-y:auto}.sheet-handle{width:40px;height:4px;border-radius:999px;background:var(--ink-3);margin:4px auto 12px}.appbar{display:flex;align-items:center;gap:4px;min-height:var(--tap);margin:-4px 0 10px}.appbar-back{min-width:var(--tap);min-height:var(--tap);padding:0;border:none;background:none;color:var(--ink);display:grid;place-items:center}.appbar-back svg{width:24px;height:24px;display:block}.appbar-title{font-size:17px;line-height:1.5;font-weight:700;margin:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.groupbar{display:flex;align-items:center;gap:8px;min-height:var(--tap);margin-bottom:8px}.groupbar button{display:flex;align-items:center;gap:8px;border:none;background:none;padding:8px 0;font-size:17px;line-height:1.5;font-weight:700;color:var(--ink)}.groupbar .caret{font-size:12px;line-height:1.5;color:var(--ink-3)}.groupbar .solo{font-size:17px;line-height:1.5;font-weight:700;padding:8px 0}.row[data-member-detail],.row[data-expense]{cursor:pointer}.row[data-member-detail]:active,.row[data-expense]:active{background:var(--chip-bg)}.chevron{color:var(--ink-3);font-size:20px;line-height:1.5;flex:none}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0c0b0880;display:flex;align-items:center;justify-content:center;z-index:30;padding:16px}.modal{background:var(--surface);width:100%;max-width:440px;border-radius:var(--radius);padding:18px;max-height:84vh;overflow-y:auto}.modal h2{margin-bottom:14px;color:var(--ink);font-size:17px;line-height:1.5}.modal-error{background:var(--pay-bg);border:1px solid var(--pay);color:var(--pay);border-radius:12px;padding:10px 12px;margin-bottom:12px;font-size:13px;line-height:1.6}.modal .actions{display:flex;gap:8px;margin-top:16px}.modal .actions button{flex:1}.invite-code{font-size:38px;line-height:1.5;font-weight:700;letter-spacing:6px;text-align:center;padding:14px;border:1px dashed var(--line);border-radius:12px;font-variant-numeric:tabular-nums;margin-bottom:10px}