@font-face{font-family:Sarabun;font-weight:400;src:url(./sarabun-thai-400-normal-C2DaJlKK.woff2)format("woff2");unicode-range:U+E01-E5B,U+200C-200D,U+25CC}@font-face{font-family:Sarabun;font-weight:700;src:url(./sarabun-thai-700-normal-CbuDipM3.woff2)format("woff2");unicode-range:U+E01-E5B,U+200C-200D,U+25CC}@font-face{font-family:Sarabun;font-weight:400;src:url(./sarabun-latin-400-normal-URPBxl-K.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Sarabun;font-weight:700;src:url(./sarabun-latin-700-normal-DQKyWxHq.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--primary:#1f6b4f;--bg:#f1f4f2;--card:#fff;--border:#d5ddd8;--text:#1b2420;--muted:#55625a;--tint:#e6f2ec;--warning:#d97706}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font-family:Sarabun,sans-serif;font-size:20px}.screen{flex-direction:column;gap:20px;max-width:880px;margin:0 auto;padding:24px;display:flex}h1{color:var(--primary);margin:0;font-size:32px}.field{color:var(--muted);flex-direction:column;gap:8px;display:flex}select{min-height:56px;font:inherit;border:1px solid var(--border);background:var(--card);color:var(--text);border-radius:12px;padding:0 14px}.buttons{flex-direction:column;gap:16px;display:flex}button{min-height:72px;font:inherit;border:2px solid var(--primary);background:var(--card);color:var(--primary);border-radius:14px;font-size:24px;font-weight:700}button.primary{background:var(--primary);color:#fff}button:active:not(:disabled){background:var(--tint);color:var(--primary)}button:disabled{opacity:.45}#status{background:var(--card);border:1px solid var(--border);min-height:72px;color:var(--text);border-radius:12px;margin:0;padding:16px}.tabbar{gap:8px;max-width:880px;margin:0 auto;padding:12px 24px 0;display:flex}button.tab{border:2px solid var(--border);min-height:56px;color:var(--muted);border-radius:12px;flex:1;font-size:20px}button.tab[aria-selected=true]{background:var(--primary);border-color:var(--primary);color:#fff}[hidden]{display:none!important}h2{margin:0;font-size:26px}.muted{color:var(--muted);margin:0}.card{background:var(--card);border:1px solid var(--border);border-radius:14px;flex-direction:column;gap:16px;padding:20px;display:flex}.row-buttons{flex-wrap:wrap;gap:12px;display:flex}.row-buttons>button{flex:200px}.notice{border:1px solid var(--border);background:var(--bg);border-radius:12px;margin:0;padding:12px 16px}.notice.problem{color:#7a1a12;background:#fdecea;border-color:#b42318}.badge{border:2px solid var(--border);background:var(--bg);border-radius:12px;padding:14px 16px;font-weight:700}.badge.tone-ok{border-color:var(--primary);color:#14513a;background:#e3f3ea}.badge.tone-pending,.badge.tone-syncing{border-color:var(--warning);color:#7a4300;background:#fff3e0}.badge.tone-stale{border:5px solid var(--warning);color:#5e2f00;background:#ffe2bf;padding:12px 14px;font-size:1.1em}.badge.tone-problem{color:#7a1a12;background:#fdecea;border-color:#b42318}.bill-list{flex-direction:column;gap:12px;display:flex}.bill{background:var(--card);border:1px solid var(--border);border-radius:14px;flex-direction:column;gap:8px;padding:16px;display:flex}.bill.cancelled{background:#f6f6f4}.bill-head{flex-wrap:wrap;align-items:baseline;gap:4px 16px;display:flex}.bill-head .amount{font-weight:700}.bill-head .sync{margin-left:auto;font-weight:700}.bill-head .sync.wait{color:#8a5a00}.bill-head .sync.done{color:var(--primary)}.sample-label{color:var(--muted);margin:0;font-size:18px}.cancel-note{color:#7a1a12;overflow-wrap:anywhere;margin:0;font-weight:700}button.small{align-self:flex-start;min-height:48px;padding:0 20px;font-size:18px}button.danger{color:#fff;background:#b42318;border-color:#b42318}.cancel-form{flex-direction:column;gap:12px;display:flex}.cancel-form textarea{font:inherit;border:1px solid var(--border);background:var(--card);color:var(--text);border-radius:12px;padding:12px}@media (width<=600px){.tabbar{gap:6px;padding:8px 12px 0}button.tab{padding:0 4px;font-size:16px}.screen{padding:16px 12px}h1{font-size:26px}button{font-size:20px}}.bills-body{flex-direction:column;gap:16px;display:flex}