:root{--primary: #7636ff;--primary-soft: rgba(118, 54, 255, .08);--primary-ink: #4c1d95;--accent: #a855f7;--link: #6366f1;--ink: #0f172a;--ink-strong: #020617;--muted: #64748b;--muted-2: #6b7280;--faint: #9ca3af;--line: #e5e7eb;--surface: #ffffff;--surface-page: #f9fafb;--table-head: #f3f4ff;--tag-bg: #eef2ff;--tag-ink: #4338ca;--error: #b91c1c;--ok: #16a34a;--warning: #b45309;font-family:Instrument Sans,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:var(--ink)}*{box-sizing:border-box}html,body{min-height:100%}body{margin:0;background:radial-gradient(circle at top left,#9f7bff,#7636ff 40%,#2b147a 90%);background-attachment:fixed}.main-wrapper{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}.page-shell{width:100%;max-width:1200px;background:#0f172a14;border-radius:32px;padding:2px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.page-inner{background:var(--surface-page);border-radius:30px;padding:32px 28px;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:28px}.col-right{display:flex;flex-direction:column;gap:20px;min-width:0}.logo{display:block;width:150px;height:auto;margin-bottom:16px}.brand-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:var(--primary-soft);color:var(--primary-ink);font-size:13px;font-weight:500;margin-bottom:12px}.brand-pill .dot{width:8px;height:8px;border-radius:999px;background:#22c55e}.page-title{font-size:26px;font-weight:600;color:var(--ink-strong);margin:0 0 4px}.page-subtitle{font-size:14px;color:var(--muted);margin:0 0 24px;line-height:1.5}.card-modern{background:var(--surface);border-radius:24px;padding:24px 22px;box-shadow:0 24px 60px #0f172a14}.card-modern h3{font-size:20px;font-weight:600;margin:0 0 4px}.card-subtitle{font-size:13px;color:var(--muted-2);margin:0 0 16px;line-height:1.5}.step-label{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);margin-bottom:4px}.input-label{display:block;font-size:13px;font-weight:500;color:var(--ink);margin:0 0 6px}.input-pill{display:block;width:100%;font:inherit;font-size:16px;color:var(--ink);background:var(--surface);border-radius:999px;border:1px solid var(--line);padding:12px 16px;margin-bottom:14px;outline:none}.input-pill:focus{border-color:var(--primary);box-shadow:0 0 0 1px #7636ff59}.input-cvv{max-width:180px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.section-divider{height:1px;width:100%;background:linear-gradient(90deg,transparent,var(--line),transparent);margin:4px 0 16px}.recaptcha{min-height:78px;margin-bottom:8px}.hint-text{font-size:12px;color:var(--muted-2)}.hint-ok{font-size:12px;color:var(--ok);margin:-8px 0 12px 8px}.alert-inline{font-size:13px;color:var(--error);margin:-6px 0 12px 8px}.card-modern form>.alert-inline:last-of-type{margin-top:8px}.btn-stack{display:flex;flex-direction:column;gap:8px;margin-top:18px}.btn-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}.btn-pill{display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:999px;border:none;padding:12px 22px;font:inherit;font-size:15px;font-weight:500;cursor:pointer;text-decoration:none;transition:all .18s ease}.btn-pill:disabled{opacity:.6;cursor:progress;transform:none}.btn-primary-pill{background:var(--primary);color:#fff;box-shadow:0 14px 40px #7636ff66}.btn-primary-pill:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 18px 55px #7636ff8c}.btn-secondary-pill{background:var(--line);color:#111827}.btn-secondary-pill:hover:not(:disabled){background:#d1d5db}.btn-sm{padding:8px 16px;font-size:13px;box-shadow:0 8px 24px #7636ff4d;white-space:nowrap}.footnote{font-size:11px;color:var(--faint);margin:18px 0 0;line-height:1.5}.table-scroll{overflow-x:auto;margin:0 -4px}.invoice-table{width:100%;border-collapse:collapse;font-size:14px}.invoice-table thead tr{background:var(--table-head)}.invoice-table th,.invoice-table td{padding:10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}.invoice-table th{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--muted-2)}.invoice-table tr.selected td{background:#faf7ff}.invoice-table .mono{font-variant-numeric:tabular-nums;color:var(--muted)}.invoice-table .amount{font-weight:600;white-space:nowrap}.invoice-table .action{text-align:right}.invoice-tag{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;background:var(--tag-bg);font-size:12px;color:var(--tag-ink);white-space:nowrap}.selected-info{display:flex;flex-wrap:wrap;gap:6px;font-size:14px;padding:10px 14px;border-radius:14px;background:var(--primary-soft);margin-bottom:16px}.selected-info span{color:#4f46e5}.empty-state{height:100%;min-height:260px;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--faint);font-size:14px;line-height:1.5;border:1px dashed var(--line);border-radius:24px;padding:24px}.empty-state>div:last-child{max-width:280px}.empty-icon{font-size:38px;margin-bottom:10px}.empty-state{flex-direction:column}.result .badge{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-size:24px;font-weight:700;color:#fff;margin:8px 0 12px}.badge.success{background:var(--ok)}.badge.warning{background:var(--warning)}.badge.error{background:var(--error)}.ref code{background:var(--table-head);padding:2px 8px;border-radius:6px}@media (max-width: 991px){.main-wrapper{padding:16px}.page-shell{padding:0;background:none}.page-inner{grid-template-columns:1fr;padding:24px 18px}.empty-state{min-height:0}}@media (max-width: 560px){.invoice-table thead{display:none}.invoice-table,.invoice-table tbody{display:block}.invoice-table tr{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px 12px;padding:12px 6px;border-bottom:1px solid var(--line)}.invoice-table td{display:block;padding:0;border:0}.invoice-table td:nth-child(2){display:none}.invoice-table td:nth-child(3){grid-column:2;grid-row:1;text-align:right}.invoice-table .due{grid-column:1;grid-row:2;font-size:12px;color:var(--muted-2)}.invoice-table .due:before{content:attr(data-label) ": "}.invoice-table .action{grid-column:2;grid-row:2}}
