:root{--green: #16a34a;--teal: #0d9488;--turq: #06b6d4;--ink: #0b2b2a;--muted: #5b7574;--line: #d9e9e6;--bg: #f0faf7;--red: #dc2626;--grad: linear-gradient(135deg, #16a34a 0%, #0d9488 50%, #06b6d4 100%);--shadow: 0 10px 30px -12px rgba(13, 148, 136, .35);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;color:var(--ink)}*{box-sizing:border-box}body{margin:0;background:var(--bg);min-height:100vh;-webkit-font-smoothing:antialiased}h1,h2,p{margin:0}h2{font-size:1.25rem}button,input{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}:focus-visible{outline:3px solid rgba(6,182,212,.55);outline-offset:2px}.muted{color:var(--muted);margin-top:4px}.small{font-size:.85rem}.card{background:#fff;border-radius:20px;padding:24px;box-shadow:var(--shadow);border:1px solid var(--line)}.field{display:block;margin-top:16px}.field-label{display:flex;justify-content:space-between;font-size:.85rem;font-weight:600;margin-bottom:6px;color:#24504d}.field-label em{font-weight:400;font-style:normal;color:var(--muted)}input{width:100%;padding:13px 14px;border:1.5px solid var(--line);border-radius:12px;background:#fbfefd;font-size:1rem;transition:border-color .15s,box-shadow .15s}input:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 4px #0d948826}input:disabled{background:#f1f5f4;color:var(--muted)}.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.hint{font-size:.82rem;color:var(--muted);margin-top:6px}.hint-error{color:var(--red)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:12px;padding:12px 18px;font-weight:700;transition:transform .1s,filter .15s,opacity .15s}.btn:active:not(:disabled){transform:scale(.98)}.btn-primary{background:var(--grad);color:#fff;box-shadow:0 8px 20px -8px #0d9488b3}.btn-primary:hover:not(:disabled){filter:brightness(1.07)}.btn-primary:disabled{opacity:.5;box-shadow:none}.btn-ghost{background:#e6f6f2;color:var(--teal)}.btn-light{background:#fff3;color:#fff;padding:9px 14px}.btn-light:hover{background:#ffffff4d}.btn-block{width:100%;margin-top:20px}.btn-lg{padding:16px;font-size:1.1rem;border-radius:14px}.link{background:none;border:0;padding:0;font-weight:700;text-decoration:underline;color:inherit}.spinner{width:18px;height:18px;border-radius:50%;border:2.5px solid rgba(255,255,255,.4);border-top-color:#fff;animation:spin .7s linear infinite;flex:none}.spinner.dark{border-color:#0d948840;border-top-color:var(--teal)}@keyframes spin{to{transform:rotate(360deg)}}.alert{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:12px;margin-top:16px;font-size:.93rem;line-height:1.4}.alert-error{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}.alert-success{background:#ecfdf5;color:#065f46;border:1px solid #a7f3d0}.alert-icon{flex:none;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:.75rem;font-weight:800;color:#fff}.alert-error .alert-icon{background:var(--red)}.alert-success .alert-icon{background:var(--green)}.auth{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:48px;padding:32px max(24px,6vw);background:var(--grad)}.auth-hero{color:#fff}.auth-hero svg{border-radius:14px;box-shadow:0 0 0 3px #ffffff80}.auth-hero h1{font-size:clamp(2rem,4.5vw,3.4rem);line-height:1.08;margin:20px 0 14px;letter-spacing:-.02em}.auth-hero p{font-size:1.1rem;opacity:.92;max-width:26em}.auth-card{max-width:440px;width:100%;justify-self:center;box-shadow:0 30px 60px -20px #00000059;border:0}.tabs,.segmented{display:grid;grid-template-columns:1fr 1fr;background:#e6f6f2;border-radius:12px;padding:4px}.tabs button,.segmented button{border:0;background:none;padding:10px;border-radius:9px;font-weight:700;color:var(--muted)}.tabs .active,.segmented .active{background:#fff;color:var(--teal);box-shadow:0 2px 6px #0d948833}.topbar{background:var(--grad);color:#fff;display:flex;align-items:center;gap:12px;padding:14px max(16px,4vw) 70px}.brand{display:flex;align-items:center;gap:12px;margin-right:auto;min-width:0}.brand svg{border-radius:10px;box-shadow:0 0 0 2px #ffffff80;flex:none}.brand div{display:flex;flex-direction:column;min-width:0}.brand strong{font-size:1.1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.brand span{font-size:.82rem;opacity:.9}.demo{background:#fde047;color:#713f12;font-size:.7rem;font-weight:800;padding:4px 8px;border-radius:6px;letter-spacing:.08em}.grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:24px;max-width:1080px;margin:-50px auto 0;padding:0 16px 48px;align-items:start}aside{display:grid;gap:24px}.segmented{margin-top:18px}.telcos{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.telco{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 6px 10px;background:#fff;border:2px solid var(--line);border-radius:16px;font-weight:700;font-size:.9rem;transition:border-color .15s,transform .15s,box-shadow .15s}.telco small{font-weight:500;color:var(--muted)}.telco svg{border-radius:14px}.telco:hover:not(:disabled){transform:translateY(-2px);border-color:#9ddfd3}.telco.active{border-color:var(--teal);background:#ecfdf8;box-shadow:0 0 0 4px #0d948826}.lookup{display:flex;align-items:center;gap:12px;margin-top:12px;padding:12px 14px;border-radius:12px;background:#f1f8f7;color:var(--muted);font-size:.93rem}.lookup-ok{background:#ecfdf5;border:1px solid #a7f3d0;color:var(--ink)}.lookup-ok small{display:block;color:var(--muted);font-size:.75rem}.lookup-ok strong{font-size:1.05rem}.avatar{width:34px;height:34px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-weight:800;flex:none}.amount{display:flex;align-items:center;border:1.5px solid var(--line);border-radius:14px;background:#fbfefd;padding-left:16px;transition:border-color .15s,box-shadow .15s}.amount:focus-within{border-color:var(--teal);box-shadow:0 0 0 4px #0d948826}.amount span{font-weight:800;color:var(--teal)}.amount input{border:0;background:none;box-shadow:none!important;font-size:1.7rem;font-weight:800;padding:12px}.success-card{text-align:center;padding:36px 24px}.big-tick{width:76px;height:76px;margin:0 auto 16px;border-radius:50%;background:var(--grad);color:#fff;font-size:2.4rem;display:grid;place-items:center;box-shadow:0 0 0 10px #16a34a1f;animation:pop .4s cubic-bezier(.2,1.6,.4,1)}@keyframes pop{0%{transform:scale(.4);opacity:0}}.success-amount{font-size:2.3rem;font-weight:800;margin-top:8px;color:var(--teal);letter-spacing:-.02em}.ref{margin-top:14px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.85rem;color:var(--muted)}.actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:24px}.stat{background:#063f3b;color:#fff;border-radius:20px;padding:22px 24px;box-shadow:var(--shadow);display:grid;gap:2px}.stat span{font-size:.85rem;opacity:.8}.stat b{font-size:2rem;letter-spacing:-.02em}.stat small{color:#5eead4;font-weight:600}.empty{color:var(--muted);padding:24px 0 8px;text-align:center;font-size:.93rem}.history{list-style:none;margin:12px -10px -10px;padding:0}.history button{width:100%;display:flex;align-items:center;gap:12px;padding:12px 10px;border:0;background:none;border-radius:12px;text-align:left}.history button:hover{background:#f0faf7}.history li+li{border-top:1px solid #eef5f3}.who{flex:1;min-width:0;display:flex;flex-direction:column}.who strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.95rem}.who small{color:var(--muted);font-size:.78rem}.history b{white-space:nowrap;color:var(--green)}.badge{flex:none;min-width:58px;text-align:center;font-size:.72rem;font-weight:800;padding:6px 8px;border-radius:8px}.badge.momo{background:#cffafe;color:#0e7490}.badge.cash{background:#dcfce7;color:#166534}.modal{position:fixed;inset:0;background:#06282699;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:grid;place-items:center;padding:16px;z-index:10;overflow-y:auto}.receipt{background:#fff;width:100%;max-width:380px;border-radius:20px;padding:24px;box-shadow:0 30px 60px -20px #00000080}.receipt header{display:flex;gap:12px;align-items:center}.receipt header div{display:flex;flex-direction:column}.receipt header span{font-size:.82rem;color:var(--muted)}.receipt-amount{text-align:center;margin:20px 0;padding:20px;border-radius:16px;background:#ecfdf8;display:grid;gap:2px;justify-items:center}.receipt-amount b{font-size:2rem;letter-spacing:-.02em}.receipt-amount small{color:var(--green);font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:.72rem}.tick{width:32px;height:32px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-weight:800;margin-bottom:6px}.receipt dl{margin:0}.receipt dl div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px dashed var(--line);font-size:.92rem}.receipt dt{color:var(--muted)}.receipt dd{margin:0;font-weight:600;text-align:right;overflow-wrap:anywhere}.receipt footer{display:grid;grid-template-columns:1fr 1.4fr;gap:12px;margin-top:20px}@media(max-width:820px){.auth{grid-template-columns:1fr;gap:24px;align-content:center}.auth-hero{text-align:center}.auth-hero p{margin:0 auto}.auth-hero h1 br{display:none}.grid{grid-template-columns:1fr}}@media(max-width:420px){.card{padding:18px}.row{grid-template-columns:1fr;gap:0}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media print{.no-print{display:none!important}body{background:#fff}.modal{position:static;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;padding:0}.receipt{box-shadow:none;margin:0 auto}*{-webkit-print-color-adjust:exact;print-color-adjust:exact}}.card-head{display:flex;align-items:center;gap:8px}.card-head h2{margin-right:auto}select{font:inherit;font-size:.85rem;font-weight:600;color:var(--teal);background:#e6f6f2;border:0;border-radius:10px;padding:8px 10px;cursor:pointer}.icon-btn{width:36px;height:36px;border:0;border-radius:10px;background:#e6f6f2;color:var(--teal);font-size:1.15rem;font-weight:700;display:grid;place-items:center}.icon-btn:disabled{opacity:.6}.spin{display:inline-block;animation:spin .8s linear infinite}.history{max-height:520px;overflow-y:auto;transition:opacity .15s}.history.is-loading{opacity:.5}.badge{background:#cffafe;color:#0e7490;max-width:76px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.amt{display:flex;flex-direction:column;align-items:flex-end}.history .amt b{color:var(--ink)}.status{font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.status.is-success{color:var(--green)}.status.is-failed{color:var(--red)}.status.is-pending{color:#b45309}.receipt-amount.is-failed{background:#fef2f2}.receipt-amount.is-failed .tick{background:var(--red)}.receipt-amount.is-failed small{color:var(--red)}.receipt-amount.is-pending{background:#fffbeb}.receipt-amount.is-pending .tick{background:#d97706}.receipt-amount.is-pending small{color:#b45309}.field select{width:100%;padding:13px 14px;border:1.5px solid var(--line);border-radius:12px;background:#fbfefd;font-size:1rem;font-weight:400;color:var(--ink)}.field select:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 4px #0d948826}.field input[type=date]{min-height:49px}.auth-card{max-height:calc(100vh - 32px);overflow-y:auto}