:root{--blue: #0343fc;--blue-deep: #0233d4;--blue-dark: #021ea0;--lime: #c2ef54;--lime-bright: #c5ff44;--ink: #0a0a0a;--surface: #141414;--surface-2: #1d1d1d;--line: rgba(255, 255, 255, .12);--line-strong: rgba(255, 255, 255, .22);--white: #ffffff;--muted: rgba(255, 255, 255, .66);--muted-dim: rgba(255, 255, 255, .42);--danger: #ff4444;--warn: #ffb020;--ok: #3ddc97;--radius: 16px;--radius-sm: 10px;--pad: 16px;--font: "IBM Plex Sans Thai", "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;--mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;padding:0}body{min-height:100vh;background:var(--blue);color:var(--white);font-family:var(--font);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}#root{min-height:100vh}button{font:inherit;color:inherit;cursor:pointer}a{color:var(--lime)}.shell{max-width:1180px;margin:0 auto;padding:0 18px 64px}.topbar{position:sticky;top:0;z-index:20;background:var(--blue);border-bottom:1.5px solid rgba(255,255,255,.18)}.topbar-inner{max-width:1180px;margin:0 auto;padding:12px 18px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}.brand{display:flex;align-items:baseline;gap:8px;font-weight:900;letter-spacing:-.4px;font-size:19px}.brand small{font-size:11px;font-weight:800;letter-spacing:1.6px;text-transform:uppercase;color:var(--lime)}.spacer{flex:1}.who{display:flex;align-items:center;gap:10px;font-size:12px;color:#ffffffd9;min-width:0}.who span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:220px}.btn{border:1.5px solid var(--line-strong);background:transparent;color:var(--white);border-radius:999px;padding:7px 14px;font-size:13px;font-weight:700;white-space:nowrap;transition:background .12s ease,border-color .12s ease}.btn:hover{background:#ffffff1a}.btn-primary{background:var(--lime);border-color:var(--lime);color:var(--ink);font-weight:900}.btn-primary:hover{background:var(--lime-bright)}.btn-lg{padding:12px 22px;font-size:15px}.btn:disabled{opacity:.5;cursor:not-allowed}.tabs{display:flex;gap:6px;overflow-x:auto;padding:14px 0 2px;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}.tab{border:1.5px solid rgba(255,255,255,.35);background:transparent;color:var(--white);border-radius:999px;padding:7px 15px;font-size:13px;font-weight:700;white-space:nowrap}.tab[aria-selected=true]{background:var(--lime);border-color:var(--lime);color:var(--ink);font-weight:900}.select{background:var(--ink);color:var(--white);border:1.5px solid var(--line-strong);border-radius:var(--radius-sm);padding:7px 11px;font-size:13px;font-weight:700}.card{background:var(--ink);border:1.5px solid var(--line);border-radius:var(--radius);padding:var(--pad)}.card+.card{margin-top:14px}.card-title{margin:0 0 2px;font-size:12px;font-weight:800;letter-spacing:1.4px;text-transform:uppercase;color:var(--lime)}.card-sub{margin:0 0 14px;font-size:12px;color:var(--muted-dim)}.grid{display:grid;gap:14px}.grid-stats{grid-template-columns:repeat(auto-fit,minmax(168px,1fr))}.grid-2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}.stat{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius);padding:14px 16px}.stat-label{font-size:11px;font-weight:800;letter-spacing:1.1px;text-transform:uppercase;color:var(--muted-dim)}.stat-value{margin-top:6px;font-size:26px;font-weight:900;letter-spacing:-.8px;font-variant-numeric:tabular-nums}.stat-hint{margin-top:3px;font-size:11px;color:var(--muted-dim)}.stat-accent .stat-value{color:var(--lime)}.table-wrap{overflow-x:auto;border-radius:var(--radius-sm);border:1.5px solid var(--line)}table{width:100%;border-collapse:collapse;font-size:13px;min-width:560px}thead th{position:sticky;top:0;background:var(--surface-2);text-align:left;font-size:11px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--muted);padding:9px 12px;white-space:nowrap;border-bottom:1.5px solid var(--line)}tbody td{padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.07);vertical-align:top}tbody tr:last-child td{border-bottom:none}tbody tr.clickable{cursor:pointer}tbody tr.clickable:hover{background:#ffffff0d}.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}.mono{font-family:var(--mono);font-size:12px;color:var(--muted)}.dim{color:var(--muted-dim)}.strong{font-weight:800}.lime{color:var(--lime)}.sub{display:block;font-size:11px;color:var(--muted-dim);margin-top:2px}.badge{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11px;font-weight:800;white-space:nowrap;border:1.5px solid var(--line-strong);color:var(--white)}.badge-paid{background:#3ddc9729;border-color:#3ddc9780;color:var(--ok)}.badge-open{background:#ffb02026;border-color:#ffb02080;color:var(--warn)}.badge-void,.badge-discarded{background:#ff444424;border-color:#ff444473;color:var(--danger)}.badge-lime{background:#c2ef5429;border-color:#c2ef548c;color:var(--lime)}.bar-row{display:grid;grid-template-columns:minmax(120px,1.4fr) 1fr auto;gap:12px;align-items:center;padding:7px 0}.bar-track{height:9px;border-radius:999px;background:#ffffff1a;overflow:hidden}.bar-fill{height:100%;border-radius:999px;background:var(--lime)}.state{text-align:center;padding:40px 20px;color:var(--muted);font-size:14px}.state-error{border:1.5px solid rgba(255,68,68,.5);background:#ff44441a;border-radius:var(--radius);padding:16px;color:#ffd9d9;font-size:14px}.state-error .btn{margin-top:10px}.spinner{width:22px;height:22px;border-radius:999px;border:2.5px solid rgba(255,255,255,.25);border-top-color:var(--lime);animation:spin .7s linear infinite;margin:0 auto 10px}@keyframes spin{to{transform:rotate(360deg)}}.gate{min-height:100vh;display:grid;place-items:center;padding:24px}.gate-card{width:min(440px,100%);background:var(--ink);border:1.5px solid var(--line);border-radius:22px;padding:30px 26px;text-align:center}.gate-card h1{margin:14px 0 6px;font-size:24px;font-weight:900;letter-spacing:-.6px}.gate-card p{margin:0 0 20px;color:var(--muted);font-size:14px}.readonly-note{display:inline-block;margin-top:16px;font-size:11px;font-weight:800;letter-spacing:.8px;color:var(--lime);border:1.5px solid rgba(194,239,84,.5);border-radius:999px;padding:4px 12px}.drawer-backdrop{position:fixed;inset:0;background:#0000009e;z-index:40;display:flex;justify-content:flex-end}.drawer{width:min(560px,100%);height:100%;overflow-y:auto;background:var(--ink);border-left:1.5px solid var(--line);padding:18px}.drawer-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:16px}.drawer-head h2{margin:0;font-size:18px;font-weight:900}.kv{display:grid;grid-template-columns:minmax(96px,auto) 1fr;gap:6px 14px;font-size:13px;margin:0}.kv dt{color:var(--muted-dim);font-size:12px}.kv dd{margin:0;font-weight:600}.slip-img{width:100%;border-radius:var(--radius-sm);border:1.5px solid var(--line);margin-top:10px;display:block}.totals-row{display:flex;justify-content:space-between;gap:12px;padding:5px 0;font-size:13px}.totals-row.total{border-top:1.5px solid var(--line);margin-top:6px;padding-top:10px;font-size:17px;font-weight:900}.section-gap{margin-top:18px}@media(max-width:560px){.stat-value{font-size:22px}.drawer{width:100%}}