:root{color-scheme:light;--ink: #1f2933;--muted: #6b7280;--brand: #2563eb;--brand-dark: #1d4ed8;--danger: #dc2626;--success: #16a34a;--bg: #f4f6fb;--card-bg: #ffffff;--border: #e2e8f0;font-family:Noto Sans Thai,Inter,system-ui,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}.page{min-height:100vh;display:flex;align-items:flex-start;justify-content:center;padding:32px 16px}.card{width:100%;max-width:420px;background:var(--card-bg);border:1px solid var(--border);border-radius:16px;padding:24px;box-shadow:0 1px 3px #0000000f}h1{font-size:1.25rem;margin:0 0 4px}h2{font-size:1.05rem;margin:20px 0 8px}.muted{color:var(--muted);font-size:.9rem}.price{font-size:1.5rem;font-weight:700;margin:8px 0 20px}.tabs{display:flex;gap:8px;margin-bottom:16px}.tab{flex:1;padding:10px;text-align:center;border:1px solid var(--border);border-radius:10px;background:#fff;cursor:pointer;font-weight:600;color:var(--muted)}.tab.active{border-color:var(--brand);color:var(--brand);background:#eff4ff}.field{margin-bottom:12px}.field label{display:block;font-size:.85rem;margin-bottom:4px;color:var(--muted)}.field input{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:8px;font-size:1rem}.field-row{display:flex;gap:8px}.field-row .field{flex:1}button.primary{width:100%;padding:12px;border:none;border-radius:10px;background:var(--brand);color:#fff;font-size:1rem;font-weight:600;cursor:pointer;margin-top:8px}button.primary:disabled{background:#93c5fd;cursor:not-allowed}button.primary:hover:not(:disabled){background:var(--brand-dark)}.error{color:var(--danger);font-size:.9rem;margin-top:10px}.success{color:var(--success);font-weight:600}.qr-box{text-align:center}.qr-box img{width:220px;height:220px;margin:12px 0}.hidden{display:none!important}
