:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--brand:#047857;--brand-strong:#065f46;--brand-soft:#ecfdf5;--on-brand:#fff;--ink:#0f172a;--muted:#475569;--line:#e2e8f0;--bg:#f8fafc;--surface:#fff;--surface-2:#f1f5f9;--danger:#b91c1c;--danger-soft:#fef2f2;--warn:#92400e;--warn-soft:#fffbeb;--warn-line:#f59e0b;--focus:#2563eb;--r-sm:8px;--r-md:12px;--r-lg:20px;--r-pill:999px;--s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--sh-sm:0 1px 2px #0f172a0f;--sh-md:0 4px 16px #0f172a14;--sh-lg:0 12px 32px #0f172a24;--fs-xs:.8125rem;--fs-sm:.9375rem;--fs-md:1rem;--fs-lg:1.25rem;--fs-xl:1.625rem;--fs-2xl:2.5rem;--font:system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans Thai", "Leelawadee UI", "Sukhumvit Set", Thonburi, Tahoma, sans-serif;--ease:cubic-bezier(.2, .8, .2, 1)}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--brand:#34d399;--brand-strong:#6ee7b7;--brand-soft:#064e3b;--on-brand:#022c22;--ink:#e2e8f0;--muted:#94a3b8;--line:#1e293b;--bg:#0b1220;--surface:#111a2e;--surface-2:#17223a;--danger:#f87171;--danger-soft:#3b1219;--warn:#fcd34d;--warn-soft:#3a2a08;--warn-line:#b45309;--focus:#93c5fd;--sh-sm:none;--sh-md:0 4px 16px #0006;--sh-lg:0 12px 32px #00000080}}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{font-family:var(--font);font-size:var(--fs-md);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;margin:0;line-height:1.7}main{max-width:480px;padding:var(--s4) var(--s4) var(--s6);margin:0 auto}h1,h2,h3{margin:0 0 var(--s2);line-height:1.5}h1{font-size:var(--fs-xl)}h2{font-size:var(--fs-lg)}h3{font-size:var(--fs-md)}p{margin:0 0 var(--s3)}code{font-size:var(--fs-xs);background:var(--surface-2);word-break:break-all;border-radius:6px;padding:2px 6px}.num{font-variant-numeric:tabular-nums}.muted{color:var(--muted);font-size:var(--fs-sm)}.err{color:var(--danger)}.ok{color:var(--brand)}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.icon{flex:none;width:20px;height:20px}label{margin:0 0 var(--s4);font-size:var(--fs-sm);font-weight:600;display:block}input,select,textarea{font:inherit;color:var(--ink);border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);width:100%;min-height:48px;margin-top:6px;padding:10px 14px;font-weight:400;transition:border-color .15s,box-shadow .15s}input:focus,select:focus,textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb, var(--brand) 30%, transparent);outline:none}textarea{line-height:1.7}fieldset{border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s3) var(--s4);margin:0 0 var(--s4)}legend{font-size:var(--fs-sm);padding:0 var(--s1);font-weight:600}.check{align-items:flex-start;gap:var(--s3);cursor:pointer;min-height:44px;font-weight:400;display:flex}.check input{width:22px;height:22px;min-height:0;accent-color:var(--brand);flex:none;margin:3px 0 0}.checks{gap:0 var(--s5);flex-wrap:wrap;display:flex}.checks .check{align-items:center;margin:0}.checks .check input{margin:0}button,.btn{font:inherit;justify-content:center;align-items:center;gap:var(--s2);border-radius:var(--r-md);background:var(--brand);width:100%;min-height:48px;color:var(--on-brand);cursor:pointer;transition:transform .15s var(--ease), opacity .15s, background-color .15s;border:1px solid #0000;padding:10px 18px;font-weight:700;text-decoration:none;display:inline-flex}button:hover:not(:disabled){background:var(--brand-strong)}button:active:not(:disabled){transform:scale(.98)}button:disabled{opacity:.45;cursor:not-allowed}button.ghost{background:var(--surface);color:var(--brand);border-color:currentColor}button.ghost:hover:not(:disabled){background:var(--brand-soft)}button.quiet{color:var(--muted);border-color:var(--line);background:0 0}button.quiet:hover:not(:disabled){background:var(--surface-2)}button.sm{width:auto;min-height:44px;font-size:var(--fs-sm);padding:6px 14px}button.xl{min-height:64px;font-size:var(--fs-lg);border-radius:var(--r-lg)}.row{gap:var(--s3);flex-wrap:wrap;display:flex}.row>*{flex:180px}.stack>*+*{margin-top:var(--s3)}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s5);margin:0 0 var(--s4);box-shadow:var(--sh-sm)}.card>h2:first-child{margin-top:0}.banner{gap:var(--s3);background:var(--warn-soft);color:var(--warn);border:1px solid var(--warn-line);padding:var(--s3) var(--s4);border-radius:var(--r-md);margin:0 0 var(--s4);align-items:flex-start;font-weight:600;display:flex}.banner .icon{margin-top:3px}.badge{border-radius:var(--r-pill);font-size:var(--fs-xs);background:var(--surface-2);color:var(--muted);white-space:nowrap;align-items:center;gap:4px;padding:0 10px;font-weight:700;line-height:1.9;display:inline-flex}.badge.on{background:var(--brand-soft);color:var(--brand)}.consent{font-size:var(--fs-sm);color:var(--muted);background:var(--surface-2);padding:var(--s3) var(--s4);border-radius:var(--r-md);max-height:180px;overflow:auto}.list{margin:0;padding:0;list-style:none}.list li{align-items:center;gap:var(--s3);padding:var(--s3) 0;border-bottom:1px solid var(--line);display:flex}.list li:last-child{border-bottom:0}.list .grow{flex:1;min-width:0}.list .pts{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:700}.table-wrap{margin:0 calc(-1 * var(--s5));padding:0 var(--s5);overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:var(--fs-sm)}th{text-align:left;font-size:var(--fs-xs);color:var(--muted);padding:var(--s2) var(--s3);border-bottom:1px solid var(--line);white-space:nowrap;font-weight:700}td{padding:var(--s3);border-bottom:1px solid var(--line);vertical-align:middle}tbody tr:hover{background:var(--surface-2)}td.r,th.r{text-align:right;font-variant-numeric:tabular-nums}td.nowrap{white-space:nowrap}.state{text-align:center;padding:var(--s6) var(--s4);color:var(--muted)}.state .icon{width:40px;height:40px;color:var(--muted);margin-bottom:var(--s2)}.state.error .icon{color:var(--danger)}.state h2{color:var(--ink);font-size:var(--fs-md)}.state button{width:auto;margin-top:var(--s2)}.alert{gap:var(--s2);padding:var(--s3) var(--s4);border-radius:var(--r-md);background:var(--danger-soft);color:var(--danger);margin:0 0 var(--s4);align-items:flex-start;font-weight:600;display:flex}.alert.okay{background:var(--brand-soft);color:var(--brand)}.alert .icon{margin-top:3px}.skel{background:var(--surface-2);border-radius:var(--r-sm);height:16px;margin:0 0 var(--s3);animation:1.2s ease-in-out infinite pulse;display:block}@keyframes pulse{50%{opacity:.45}}.fade-in{animation:fade .25s var(--ease) both}@keyframes fade{0%{opacity:0;transform:translateY(6px)}}.member{color:#fff;text-align:center;background:linear-gradient(140deg, var(--t1), var(--t2));box-shadow:var(--sh-lg);border:0;position:relative;overflow:hidden}.member:after{content:"";aspect-ratio:1;pointer-events:none;background:#ffffff14;border-radius:50%;width:70%;position:absolute;inset:-40% -30% auto auto}.tier-0{--t1:#065f46;--t2:#047857}.tier-1{--t1:#334155;--t2:#64748b}.tier-2{--t1:#78350f;--t2:#b45309}.tier-3{--t1:#1e1b4b;--t2:#4338ca}.member-head{justify-content:space-between;align-items:center;gap:var(--s2);text-align:left;font-weight:700;display:flex}.member .badge{color:#fff;background:#fff3}.points{font-size:var(--fs-2xl);margin:var(--s3) 0 0;font-variant-numeric:tabular-nums;font-weight:800;line-height:1.5}.points small{font-size:var(--fs-md);opacity:.9;font-weight:600}.progress{border-radius:var(--r-pill);height:8px;margin:var(--s2) 0 var(--s1);background:#ffffff40;display:block;overflow:hidden}.progress>span{border-radius:inherit;transform-origin:0;width:100%;height:100%;transition:transform .3s var(--ease);background:#fff;display:block}.progress.dim{background:var(--surface-2)}.progress.dim>span{background:var(--brand)}.member .hint{font-size:var(--fs-xs);color:#fff;opacity:.95;margin:0}.qr{border-radius:var(--r-md);margin:var(--s4) 0 var(--s2);background:#fff;padding:12px;display:inline-block}.qr img,.qr .skel{width:216px;height:216px;margin:0;display:block}.member .skel{background:#ffffff40}.qr .skel{background:#e2e8f0}.member-id{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:var(--fs-sm);letter-spacing:2px;word-break:break-all;font-weight:700}.coupon{letter-spacing:1px;border:2px dashed var(--brand);border-radius:var(--r-sm);color:var(--brand);padding:2px 10px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:700}.who{align-items:center;gap:var(--s3);display:flex}.avatar{background:var(--brand-soft);width:48px;height:48px;color:var(--brand);font-weight:800;font-size:var(--fs-lg);border-radius:50%;flex:none;place-items:center;display:grid}.amount{justify-content:flex-end;align-items:baseline;gap:var(--s2);min-height:72px;padding:var(--s2) var(--s4);background:var(--surface-2);border-radius:var(--r-md);font-variant-numeric:tabular-nums;margin:var(--s2) 0 var(--s3);overflow-wrap:anywhere;font-size:2.25rem;font-weight:800;line-height:1.6;display:flex}.amount small{font-size:var(--fs-md);color:var(--muted);font-weight:600}.keypad{gap:var(--s2);margin:0 0 var(--s4);grid-template-columns:repeat(3,1fr);display:grid}.keypad button{background:var(--surface);min-height:60px;color:var(--ink);border-color:var(--line);border-radius:var(--r-md);font-size:1.5rem}.keypad button:hover:not(:disabled){background:var(--surface-2)}.success{text-align:center;border:2px solid var(--brand)}.success .icon{width:56px;height:56px;color:var(--brand)}.success .big{font-size:var(--fs-2xl);color:var(--brand);font-variant-numeric:tabular-nums;font-weight:800;line-height:1.5}.success.dup{border-color:var(--warn-line)}.success.dup .icon{color:var(--warn)}.shell{grid-template-columns:240px 1fr;min-height:100vh;display:grid}.side{background:var(--surface);border-right:1px solid var(--line);height:100vh;padding:var(--s5) var(--s3);gap:var(--s1);flex-direction:column;display:flex;position:sticky;top:0}.brand{align-items:center;gap:var(--s2);font-weight:800;font-size:var(--fs-lg);color:var(--ink);padding:0 var(--s3) var(--s4);display:flex}.brand .icon{width:28px;height:28px;color:var(--brand)}.nav-btn{color:var(--muted);background:0 0;border:0;justify-content:flex-start;min-height:44px;font-weight:600}.nav-btn:hover:not(:disabled){background:var(--surface-2);color:var(--ink)}.nav-btn[aria-current=page]{background:var(--brand-soft);color:var(--brand)}.side .spacer{flex:1}.content{padding:var(--s5) var(--s6) var(--s6);width:100%;min-width:0;max-width:1200px}.page-head{justify-content:space-between;align-items:center;gap:var(--s3);margin:0 0 var(--s4);flex-wrap:wrap;display:flex}.page-head h1{margin:0}.kpis{gap:var(--s4);margin:0 0 var(--s4);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));display:grid}.kpi{margin:0}.kpi .label{align-items:center;gap:var(--s2);color:var(--muted);font-size:var(--fs-sm);font-weight:600;display:flex}.kpi .label .icon{color:var(--brand)}.kpi .value{font-size:var(--fs-xl);font-variant-numeric:tabular-nums;font-weight:800;line-height:1.6}.filters{gap:var(--s3);margin:0 0 var(--s4);flex-wrap:wrap;display:flex}.filters label{flex:200px;margin:0}.filters label.narrow{flex:0 200px}.copy{gap:var(--s2);align-items:center;display:flex}.copy code{flex:1;min-width:0;padding:10px}.login{max-width:420px;margin:10vh auto 0}@media (width<=900px){.shell{grid-template-rows:auto 1fr;grid-template-columns:1fr}.side{z-index:10;height:auto;padding:var(--s2) var(--s3);border-right:0;border-bottom:1px solid var(--line);scrollbar-width:none;flex-direction:row;align-items:center;position:sticky;overflow-x:auto}.brand{padding:0 var(--s2) 0 0}.brand span{display:none}.nav-btn{flex:none;width:auto;padding:6px 12px}.side .spacer{display:none}.content{padding:var(--s4)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}