:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;--ink: #f8fbf7;--muted: #a8b4b1;--faint: #6f7d7a;--page: #0a0f0e;--page-2: #18191d;--surface: rgba(12, 17, 20, .92);--surface-2: rgba(21, 28, 34, .88);--surface-3: rgba(28, 36, 43, .82);--line: rgba(255, 255, 255, .13);--line-strong: rgba(255, 255, 255, .2);--aqua: #4bd8ff;--jade: #49e6a5;--coral: #ff6b6b;--amber: #ffd166;--stripe: #7467ff;--shadow: 0 26px 90px rgba(0, 0, 0, .36)}*{box-sizing:border-box}html{min-width:320px;min-height:100%;background:var(--page)}body{margin:0;min-width:320px;min-height:100vh;color:var(--ink);background:linear-gradient(135deg,rgba(73,230,165,.08) 0%,transparent 28%),linear-gradient(215deg,rgba(255,107,107,.1) 0%,transparent 26%),linear-gradient(145deg,#07100e,#151a1a 42%,#27212a)}body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:42px 42px;-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.72),transparent 78%);mask-image:linear-gradient(to bottom,rgba(0,0,0,.72),transparent 78%)}button,input,a{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}h1,h2,p{margin:0}.app-shell{min-height:100vh;display:grid;grid-template-columns:minmax(320px,448px) minmax(300px,430px);justify-content:center;align-items:center;gap:28px;padding:32px}.terminal{width:min(100%,448px);min-height:min(840px,calc(100vh - 64px));max-height:none;display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line-strong);border-radius:30px;background:linear-gradient(180deg,rgba(255,255,255,.08),transparent 28%),linear-gradient(160deg,#11181cfa,#0d1017fa);box-shadow:var(--shadow),inset 0 0 0 8px #ffffff09}.terminal-header,.sub-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;border-bottom:1px solid var(--line);background:#ffffff06}.brand{min-width:0;display:flex;align-items:center;gap:12px}.brand-mark{width:46px;height:46px;display:grid;place-items:center;flex:0 0 auto;border-radius:14px;color:#06110e;background:linear-gradient(135deg,var(--jade),var(--aqua));font-weight:950;box-shadow:0 14px 30px #49e6a538}.brand h1{font-size:18px;line-height:1.15;letter-spacing:0;white-space:nowrap}.brand p,.panel-kicker,.amount-panel span{margin-top:4px;color:var(--muted);font-size:11px;font-weight:800;letter-spacing:0}.header-actions{display:flex;align-items:center;gap:8px}.env-pill{min-width:54px;padding:8px 10px;border:1px solid rgba(73,230,165,.28);border-radius:999px;color:var(--jade);background:#49e6a51a;font-size:11px;font-weight:950;text-align:center}.env-pill.live{border-color:#ff6b6b57;color:#ffb0b0;background:#ff6b6b1c}.icon-button{width:42px;height:42px;display:grid;place-items:center;flex:0 0 auto;border:1px solid var(--line);border-radius:14px;color:var(--ink);background:#ffffff0f;text-decoration:none;transition:transform .16s ease,border-color .16s ease,background .16s ease}.icon-button:hover{transform:translateY(-1px);border-color:#4bd8ff5c;background:#4bd8ff17}.home-screen,.provider-screen,.payment-screen,.qr-screen{flex:1;min-height:0}.home-screen,.provider-screen,.payment-screen,.qr-screen{display:flex;flex-direction:column}.payment-screen{overflow:visible}.terminal-summary{margin:22px 22px 4px;padding:16px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(135deg,#49e6a51f,#4bd8ff0f),#ffffff0a}.terminal-summary span{display:inline-flex;padding:5px 9px;border:1px solid rgba(73,230,165,.28);border-radius:999px;color:var(--jade);font-size:10px;font-weight:950}.terminal-summary strong{display:block;margin-top:9px;font-size:22px}.screen-grid,.provider-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:14px;padding:18px 22px 28px}.action-tile,.provider-button{min-height:132px;border:1px solid var(--line);border-radius:18px;color:var(--ink);background:#ffffff0e;text-align:center;transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease}.action-tile:hover:not(:disabled),.provider-button:hover:not(:disabled){transform:translateY(-2px);border-color:#4bd8ff57;background:#ffffff14;box-shadow:0 16px 34px #00000038}.action-tile span{width:62px;height:62px;display:grid;place-items:center;margin:0 auto 12px;border-radius:18px;color:#06110e;background:linear-gradient(135deg,#f8fbf7f5,#d1efe5f5)}.action-tile strong,.provider-button span{display:block;color:#f8fbf7eb;font-size:12px;font-weight:950;letter-spacing:0}.action-tile.highlight{border-color:#4bd8ff59;background:linear-gradient(145deg,#4bd8ff24,#49e6a514)}.action-tile.highlight span{background:linear-gradient(135deg,var(--aqua),#eafff8)}.action-tile.muted{opacity:.54}.sub-header h2{font-size:14px;letter-spacing:0}.mode-toggle{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:16px 22px 8px;padding:5px;border:1px solid var(--line);border-radius:16px;background:#ffffff0e}.mode-toggle button{min-height:40px;border:0;border-radius:12px;color:var(--muted);background:transparent;font-size:13px;font-weight:950}.mode-toggle button.active{color:#06110e;background:linear-gradient(135deg,var(--jade),var(--aqua));box-shadow:0 10px 24px #49e6a52b}.mode-toggle button.active.live{color:#fff;background:linear-gradient(135deg,var(--coral),#ff9f6e);box-shadow:0 10px 24px #ff6b6b2e}.mode-notice{margin:0 22px 12px;padding:10px 12px;border:1px solid rgba(73,230,165,.23);border-radius:14px;color:#f8fbf7d1;background:#49e6a514;font-size:12px;font-weight:850;line-height:1.35}.mode-notice.live{border-color:#ff6b6b52;background:#ff6b6b1a}.provider-grid{padding-top:24px}.provider-button{display:grid;place-items:center;gap:10px}.provider-button.stripe{border-color:#7467ff75;color:#fff;background:linear-gradient(145deg,#7467ffeb,#5fd6ff85),#ffffff14;box-shadow:0 18px 38px #7467ff33}.provider-button:disabled{opacity:.58}.alipay{color:#7ec7ff}.wechat{color:var(--jade)}.npci{color:var(--amber)}.ansari{color:#9ee9ff}.amount-panel{display:grid;place-items:center;gap:9px;padding:20px 22px 14px}.amount-panel strong,.qr-amount{font-size:38px;line-height:1.06;font-weight:950}.amount-input{width:210px;min-height:46px;padding:10px 14px;border:1px solid var(--line);border-radius:15px;color:var(--ink);background:#ffffff0f;text-align:center;outline:none}.amount-input:focus,.form-grid input:focus,.admin-login input:focus{border-color:#4bd8ff6b;box-shadow:0 0 0 3px #4bd8ff14}.quick-amounts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:0 22px 14px}.quick-amounts button,.qr-actions button,.qr-actions a,.secondary-action,.primary-link{min-height:43px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);border-radius:13px;color:var(--ink);background:#fff1;text-decoration:none;transition:transform .16s ease,background .16s ease,border-color .16s ease}.quick-amounts button:hover,.qr-actions button:hover,.qr-actions a:hover,.secondary-action:hover,.primary-link:hover{transform:translateY(-1px);border-color:#4bd8ff57;background:#ffffff18}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 22px 14px}.form-grid label{min-width:0;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:7px;padding:11px;border:1px solid var(--line);border-radius:15px;background:#ffffff0d}.form-grid label span{color:var(--muted);font-size:12px;font-weight:850}.form-grid input{grid-column:1 / -1;width:100%;min-width:0;min-height:28px;border:0;color:var(--ink);background:transparent;outline:none}.form-grid input::placeholder,.admin-login input::placeholder{color:#f8fbf761}.file-control small{grid-column:1 / -1;color:var(--muted);font-size:11px}.file-control input[type=file]{color:var(--muted);font-size:12px}.file-control input[type=file]::file-selector-button{min-height:30px;margin-right:8px;border:1px solid var(--line);border-radius:10px;color:var(--ink);background:#ffffff1a}.terms-box{margin:0 22px 14px;border:1px solid var(--line);border-radius:16px;background:#0000002e;overflow:hidden}.terms-box pre{max-height:110px;overflow:auto;margin:0;padding:12px;white-space:pre-wrap;color:#f8fbf7b8;font-size:11px;line-height:1.45}.agree-row{display:flex;align-items:center;gap:10px;padding:11px 12px;border-top:1px solid var(--line);color:var(--ink);font-size:12px;font-weight:760}.agree-row input{width:18px;height:18px;accent-color:var(--jade)}.keypad{display:grid;grid-template-columns:repeat(3,68px);justify-content:center;gap:11px;padding:0 22px 14px}.keypad button{width:68px;height:56px;display:grid;place-items:center;border:0;border-radius:50%;color:#15201d;background:#f8fbf7f0;font-size:23px;font-weight:950;box-shadow:0 10px 20px #0003}.keypad .clear-key,.keypad .done-key{color:#fff;background:linear-gradient(135deg,var(--coral),#ff8f70);font-size:12px}.primary-action{min-height:52px;display:inline-flex;align-items:center;justify-content:center;gap:10px;margin:0 22px 22px;border:0;border-radius:15px;color:#07110e;background:linear-gradient(135deg,var(--jade),var(--aqua));font-weight:950;box-shadow:0 18px 36px #49e6a52e}.primary-action:disabled{opacity:.48}.status-error{margin:0 22px 12px;padding:11px 12px;border:1px solid rgba(255,107,107,.38);border-radius:13px;color:#ffd3d3;background:#ff6b6b1f;font-size:13px}.qr-screen{align-items:center;overflow:visible;padding-bottom:24px}.qr-amount{margin:26px 0 10px}.demo-badge{margin-bottom:13px;padding:6px 11px;border:1px solid rgba(255,209,102,.42);border-radius:999px;color:var(--amber);background:#ffd1661a;font-size:11px;font-weight:950}.demo-badge.live{border-color:#ff6b6b85;color:#ffb6b6;background:#ff6b6b24}.qr-card{width:282px;height:282px;display:grid;place-items:center;border:10px solid rgba(255,255,255,.08);border-radius:24px;background:#fff;box-shadow:0 24px 44px #0000004d}.checkout-link{width:calc(100% - 44px);max-width:368px;display:flex;align-items:center;gap:8px;margin:18px 0 12px;padding:11px 12px;border:1px solid var(--line);border-radius:15px;color:var(--ink);background:#fff1;text-decoration:none;font-size:12px;overflow-wrap:anywhere}.qr-actions{display:grid;grid-template-columns:1fr 1fr;width:calc(100% - 44px);max-width:368px;gap:10px}.secondary-action{width:calc(100% - 44px);max-width:368px;margin-top:12px}.ops-panel{width:min(100%,430px);display:grid;gap:14px;padding:22px;border:1px solid var(--line);border-radius:24px;background:var(--surface);box-shadow:var(--shadow)}.ops-panel>div:first-child strong{display:block;margin-top:6px;font-size:24px}.ops-row{display:flex;align-items:center;gap:10px;padding:14px;border:1px solid var(--line);border-radius:14px;color:#f8fbf7d6;background:var(--surface-2)}.ops-row span{min-width:74px;color:var(--muted)}.ops-row strong{margin-left:auto;font-size:13px;text-align:right}.result-shell{min-height:100vh;display:grid;place-items:center;padding:24px}.result-card{width:min(100%,420px);display:grid;justify-items:center;gap:16px;padding:34px;border:1px solid var(--line);border-radius:24px;background:var(--surface);text-align:center;box-shadow:var(--shadow)}.result-card h1{font-size:30px}.result-card p{max-width:100%;color:var(--muted);overflow-wrap:anywhere}.success-icon{color:var(--jade)}.cancel-icon{color:var(--coral)}.primary-link{padding:0 16px}.admin-shell{min-height:100vh;width:min(1180px,100%);margin:0 auto;padding:30px}.admin-header,.admin-login{display:flex;align-items:center;justify-content:space-between;gap:18px}.admin-header{margin-bottom:22px}.admin-header h1{margin-top:5px;font-size:34px}.admin-login{margin-bottom:18px;padding:16px;border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:0 18px 46px #0003}.admin-login label{flex:1;display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:9px;color:var(--muted);font-weight:850}.admin-login input{width:100%;min-height:42px;min-width:0;padding:0 12px;border:1px solid var(--line);border-radius:13px;color:var(--ink);background:#ffffff12;outline:none}.admin-login .primary-action{min-width:132px;margin:0}.admin-error{margin-bottom:18px;padding:12px 14px;border:1px solid rgba(255,107,107,.38);border-radius:14px;color:#ffd3d3;background:#ff6b6b1f}.metric-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin-bottom:18px}.metric-card,.admin-panel{border:1px solid var(--line);border-radius:18px;background:var(--surface)}.metric-card{padding:16px}.metric-card span{display:block;color:var(--muted);font-size:12px;font-weight:850}.metric-card strong{display:block;margin-top:8px;font-size:22px}.admin-panels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.admin-panel{min-width:0;padding:16px}.admin-panel h2{display:flex;align-items:center;gap:8px;margin-bottom:14px;font-size:16px}.admin-rows{display:grid;gap:8px}.admin-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px;border:1px solid var(--line);border-radius:13px;background:var(--surface-2)}.admin-row span{min-width:0;color:#f8fbf7d1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-row strong{flex:0 0 auto;font-size:12px;text-align:right}.spin{animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:900px){.app-shell{grid-template-columns:1fr;align-items:start;padding:16px}.terminal{width:min(100%,430px);min-height:calc(100vh - 32px);max-height:none;margin:0 auto}.ops-panel{display:none}.admin-shell{padding:16px}.admin-header,.admin-login{align-items:stretch;flex-direction:column}.admin-login label{width:100%;grid-template-columns:auto 1fr}.admin-login input{grid-column:1 / -1}.metric-grid,.admin-panels{grid-template-columns:1fr}}@media(max-width:440px){.app-shell{padding:12px}.terminal{width:100%;border-radius:24px}.terminal-header{padding:16px}.brand h1{font-size:16px}.brand p{font-size:10px}.brand-mark{width:42px;height:42px}.screen-grid,.provider-grid{gap:12px;padding:14px 16px 24px}.terminal-summary,.mode-toggle,.mode-notice,.terms-box,.status-error{margin-left:16px;margin-right:16px}.quick-amounts,.form-grid,.keypad{padding-left:16px;padding-right:16px}.form-grid{grid-template-columns:1fr}.keypad{grid-template-columns:repeat(3,64px);gap:10px}.keypad button{width:64px;height:54px}.primary-action{margin-left:16px;margin-right:16px}.qr-card{width:min(282px,calc(100vw - 92px));height:min(282px,calc(100vw - 92px))}}
