@import "/demos/topaz-checkout/fonts/gf-cc80de6f61.css";:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#fff;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#08080a;font-family:Plus Jakarta Sans,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-weight:400;line-height:1.5}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;margin:0;padding:0;overflow:hidden}body{background:#08080a url(/demos/topaz-checkout/image.png) 50%/cover no-repeat;width:100vw;height:100dvh;position:fixed;inset:0;overflow:hidden}body:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(circle,#0000001a 0%,#000000a6 100%);position:fixed;inset:0}#root{z-index:1;justify-content:center;align-items:center;width:100%;height:100%;margin:0;padding:0;display:flex;position:relative;overflow:hidden}:root{--neon-lime:#ffd600;--neon-lime-bright:#fff04d;--neon-lime-glow:#ffd6007a;--circuit-orange:#ff8c00;--circuit-gold:#fa0;--gp-gold:#ffd600;--gp-gold-bright:#fff04d;--gp-gold-glow:#ffd60073;--gp-cyan:#06b6d4;--gp-cyan-glow:#06b6d459;--gp-indigo:#4f46e5;--gp-indigo-light:#6366f1;--gp-emerald:#10b981;--gp-emerald-glow:#10b98166;--gp-text-primary:#fff;--gp-text-secondary:#ffffffb8;--gp-text-muted:#ffffff6b;--gp-input-bg:#1010188c;--gp-font-main:"Plus Jakarta Sans", system-ui, -apple-system, sans-serif;--gp-font-heading:"Space Grotesk", system-ui, -apple-system, sans-serif;--gp-font-mono:"Space Mono", monospace}.glassy-checkout-container{width:100vw;height:100dvh;max-height:100vh;font-family:var(--gp-font-main);color:var(--gp-text-primary);box-sizing:border-box;justify-content:center;align-items:center;padding:36px 16px 12px;display:flex;position:relative;overflow:hidden;background:0 0!important}.gp-ambient-orbs{pointer-events:none;z-index:0;position:fixed;inset:0;overflow:hidden}.gp-orb{filter:blur(90px);opacity:.6;border-radius:50%;animation:20s ease-in-out infinite alternate gpOrbDrift;position:absolute}.gp-orb-1{background:radial-gradient(circle,#6366f159 0%,#4f46e500 70%);width:520px;height:520px;top:-120px;left:8%}.gp-orb-2{background:radial-gradient(circle,#ffd60040 0%,#ff8c0000 70%);width:480px;height:480px;animation-delay:-7s;bottom:-60px;right:10%}.gp-orb-3{background:radial-gradient(circle,#06b6d438 0%,#06b6d400 70%);width:360px;height:360px;animation-delay:-12s;top:35%;left:48%}@keyframes gpOrbDrift{0%{transform:translate(0)scale(1)}50%{transform:translate(25px,-20px)scale(1.03)}to{transform:translate(-20px,30px)scale(.97)}}.gp-checkout-stage{z-index:10;flex-shrink:0;justify-content:center;align-items:center;width:980px;max-width:96vw;height:560px;max-height:calc(100vh - 60px);margin:auto;display:flex;position:relative}.gp-chip-container{pointer-events:none;z-index:6;filter:drop-shadow(0 16px 32px #000000bf);will-change:transform;width:88px;height:88px;transition:filter .3s;position:absolute}.gp-chip-tl{top:-2px;left:-2px}.gp-chip-br{bottom:-2px;right:-2px}.gp-chip-inner-floater{width:100%;height:100%;position:relative}.gp-float-tl{animation:6s ease-in-out infinite alternate gpFloatTL}.gp-float-br{animation:6s ease-in-out infinite alternate gpFloatBR}@keyframes gpFloatTL{0%{transform:translate(0)}to{transform:translate(-3px,-3px)}}@keyframes gpFloatBR{0%{transform:translate(0)}to{transform:translate(3px,3px)}}.gp-chip-blur-panel{-webkit-backdrop-filter:blur(30px)saturate(180%)brightness(1.05);clip-path:url(#gp-chip-clip);background:linear-gradient(135deg,#ffffff2e 0%,#20202880 50%,#101016a6 100%);position:absolute;inset:0}.gp-chip-svg-border{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.gp-glass-card-wrapper{filter:drop-shadow(0 35px 70px #000000d9)drop-shadow(0 15px 30px #00000080)drop-shadow(0 0 35px #ff8c001f);will-change:transform;width:100%;height:100%;transition:filter .4s;position:relative}.gp-glass-card-wrapper:hover{filter:drop-shadow(0 40px 80px #000000e6)drop-shadow(0 15px 35px #0009)drop-shadow(0 0 45px #ffa00038)}.gp-glass-blur-panel{clip-path:url(#gp-card-clip);-webkit-backdrop-filter:blur(40px)saturate(200%)brightness(1.06);background:linear-gradient(135deg,#ffffff21 0%,#16161c85 35%,#0a0a0ebf 100%),radial-gradient(at 85% 70%,#e6af4b29 0%,#0000 60%),radial-gradient(at 15% 15%,#ffffff1f 0%,#0000 50%);position:absolute;inset:0}.gp-card-svg-border{pointer-events:none;z-index:3;width:100%;height:100%;position:absolute;inset:0}.gp-glass-surface-overlay{clip-path:url(#gp-card-clip);pointer-events:none;z-index:2;background:radial-gradient(circle at 50% 0,#ffffff1f 0%,#0000 60%);position:absolute;inset:0}.gp-glass-card-wrapper:before{content:"";pointer-events:none;z-index:15;background:linear-gradient(90deg,#0000 0%,#ffffffbf 30%,#ffd6008c 50%,#ffffffbf 70%,#0000 100%);height:1px;position:absolute;top:0;left:140px;right:50px}.gp-card-content{z-index:4;box-sizing:border-box;flex-direction:column;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.gp-checkout-header{box-sizing:border-box;background:#ffffff05;border-bottom:1px solid #ffffff1f;flex-shrink:0;justify-content:space-between;align-items:center;padding:14px 48px 10px 140px;display:flex}.gp-brand-logo{font-family:var(--gp-font-heading);letter-spacing:-.3px;color:#fff;align-items:center;gap:10px;font-size:16px;font-weight:700;display:flex}.gp-brand-icon{color:#08080a;background:linear-gradient(135deg,#ffd600 0%,#ff8c00 100%);border-radius:9px;justify-content:center;align-items:center;width:30px;height:30px;display:flex;box-shadow:0 0 16px #ffd60073}.gp-checkout-steps{align-items:center;gap:22px;margin:0;padding:0;list-style:none;display:flex}.gp-step-item{color:var(--gp-text-muted);cursor:pointer;align-items:center;gap:6px;font-size:12px;font-weight:500;transition:all .2s;display:flex;position:relative}.gp-step-item:hover,.gp-step-item.completed{color:var(--gp-text-secondary)}.gp-step-item.active{color:var(--gp-gold);font-weight:700}.gp-step-number{width:19px;height:19px;color:var(--gp-text-muted);background:#ffffff14;border:1px solid #ffffff26;border-radius:50%;justify-content:center;align-items:center;font-size:10px;font-weight:700;display:flex}.gp-step-item.active .gp-step-number{background:var(--gp-gold);color:#08080a;border-color:var(--gp-gold);box-shadow:0 0 12px var(--gp-gold-glow)}.gp-step-item.completed .gp-step-number{color:#10b981;background:#10b98133;border-color:#10b98166}.gp-checkout-content{box-sizing:border-box;flex:1;grid-template-columns:1.05fr 1fr;min-height:0;padding:10px 48px 16px 40px;display:grid;overflow:hidden}.gp-card-preview-section{box-sizing:border-box;border-right:none;flex-direction:column;justify-content:center;align-items:center;padding:12px 28px 12px 14px;display:flex;position:relative;overflow:visible}.gp-card-stack-container{justify-content:center;align-items:center;width:100%;max-width:360px;height:220px;margin:6px 0 16px;display:flex;position:relative}.gp-bg-card-shadow-1{clip-path:url(#gp-cc-clip);opacity:.5;z-index:1;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);background:linear-gradient(135deg,#6366f126 0%,#1e1e2a80 100%);border:1px solid #ffffff14;width:90%;height:100%;transition:all .35s;position:absolute;top:14px;right:-12px;transform:rotate(4deg);box-shadow:0 15px 30px #0006}.gp-bg-card-shadow-2{clip-path:url(#gp-cc-clip);opacity:.35;z-index:0;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:linear-gradient(135deg,#ffd6001f 0%,#14141e66 100%);border:1px solid #ffffff0f;width:84%;height:100%;transition:all .35s;position:absolute;top:26px;right:-20px;transform:rotate(8deg);box-shadow:0 20px 40px #00000080}.gp-card-stack-container:hover .gp-bg-card-shadow-1{opacity:.65;transform:rotate(6deg)translate(8px,-4px)}.gp-card-stack-container:hover .gp-bg-card-shadow-2{opacity:.45;transform:rotate(11deg)translate(15px,-7px)}.gp-perspective-container{perspective:1200px;z-index:5;width:100%;height:100%;position:relative}.gp-card-3d-inner{width:100%;height:100%;transform-style:preserve-3d;-webkit-transform-style:preserve-3d;transition:transform .75s cubic-bezier(.34,1.56,.64,1);position:relative}.gp-card-3d-inner.is-flipped{transform:rotateY(180deg)}.gp-processing-border{clip-path:url(#gp-cc-border-clip);z-index:0;opacity:0;pointer-events:none;transition:opacity .3s;position:absolute;inset:-3px;overflow:hidden}.gp-processing-border.active{opacity:1;filter:drop-shadow(0 0 18px #ffd600cc)drop-shadow(0 0 35px #ff8c0073)}.gp-processing-border:before{content:"";background:conic-gradient(#0000 0deg 120deg,#ffd600 180deg,#ff8c00 240deg,#f50 300deg,#0000 360deg);width:200%;height:200%;animation:1.6s linear infinite gpSpinConic;position:absolute;top:-50%;left:-50%}@keyframes gpSpinConic{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.gp-success-border{clip-path:url(#gp-cc-border-clip);z-index:0;opacity:0;pointer-events:none;filter:drop-shadow(0 0 20px var(--gp-emerald-glow)) drop-shadow(0 0 40px #10b98180);background:linear-gradient(135deg,#10b981,#34d399,#059669);transition:opacity .4s;position:absolute;inset:-3px}.gp-success-border.active{opacity:1}.gp-card-face{backface-visibility:hidden;clip-path:url(#gp-cc-clip);color:#fff;box-sizing:border-box;z-index:1;flex-direction:column;justify-content:space-between;padding:20px 22px;transition:background .4s,box-shadow .4s;display:flex;position:absolute;inset:0;overflow:hidden}.gp-card-vector-border{pointer-events:none;z-index:5;width:100%;height:100%;position:absolute;inset:0}.gp-card-front{transform-style:preserve-3d;backface-visibility:hidden;background:linear-gradient(135deg,#181a28 0%,#121320 50%,#0b0c14 100%);transition:opacity .2s,visibility .2s;transform:rotateY(0);box-shadow:inset 0 1px 2px #fff3,inset 0 -1px 2px #00000080}.gp-card-3d-inner.is-flipped .gp-card-front{opacity:0!important;visibility:hidden!important;pointer-events:none!important;z-index:0!important}.gp-card-3d-inner.is-flipped .gp-card-back{opacity:1!important;visibility:visible!important;pointer-events:auto!important;z-index:3!important}.gp-card-3d-inner:not(.is-flipped) .gp-card-back{opacity:0!important;visibility:hidden!important;pointer-events:none!important;z-index:0!important}.gp-card-3d-inner:not(.is-flipped) .gp-card-front{opacity:1!important;visibility:visible!important;pointer-events:auto!important;z-index:3!important}.gp-card-front:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(at 80% 20%,#ffffff1a 0%,#0000 50%),radial-gradient(at 20% 80%,#6366f12e 0%,#0000 40%);width:200%;height:200%;position:absolute;top:-50%;left:-50%}.gp-card-face.is-processing{box-shadow:inset 0 0 12px #ffd60040}.gp-card-front.is-success,.gp-card-back.is-success{background:linear-gradient(135deg,#065f46 0%,#047857 40%,#064e3b 80%,#022c22 100%)!important;box-shadow:inset 0 1px 2px #ffffff59,inset 0 0 20px #34d3994d!important}.gp-card-front.is-success:before{background:radial-gradient(at 80% 20%,#34d39940 0%,#0000 50%),radial-gradient(at 20% 80%,#10b98133 0%,#0000 40%)}.gp-card-texture{opacity:.6;pointer-events:none;z-index:1;background-image:radial-gradient(#ffffff1a 1px,#0000 1px);background-size:14px 14px;position:absolute;inset:0}.gp-card-top,.gp-card-middle,.gp-card-bottom{z-index:2;position:relative}.gp-card-top{justify-content:space-between;align-items:flex-start;display:flex}.gp-card-chip-nfc{align-items:center;gap:12px;display:flex}.gp-emv-chip{background:linear-gradient(135deg,gold 0%,#fa0 50%,#b8860b 100%);border:1px solid #ffd700b3;border-radius:5px;width:38px;height:28px;position:relative;overflow:hidden;box-shadow:inset 0 1px 2px #fff9,0 2px 5px #0006}.gp-emv-chip:before{content:"";background:#00000059;height:1px;position:absolute;top:33%;left:0;right:0}.gp-emv-chip:after{content:"";background:#00000059;height:1px;position:absolute;top:66%;left:0;right:0}.gp-emv-chip-line{background:#00000059;width:1px;position:absolute;top:0;bottom:0;left:50%}.gp-nfc-icon{color:#ffffffd9;transform:rotate(90deg)}.gp-card-bank-name{font-family:var(--gp-font-heading);letter-spacing:2px;color:var(--gp-gold);text-shadow:0 0 12px var(--gp-gold-glow);font-size:12px;font-weight:700}.gp-card-number-display{font-family:var(--gp-font-mono);letter-spacing:2px;color:#fff;text-shadow:0 2px 6px #00000080;margin:10px 0 4px;font-size:16px;font-weight:700}.gp-card-bottom{justify-content:space-between;align-items:flex-end;display:flex}.gp-card-holder-label,.gp-card-expiry-label{text-transform:uppercase;color:#fff9;letter-spacing:.8px;margin-bottom:2px;font-size:8px}.gp-card-holder-value{letter-spacing:.8px;text-transform:uppercase;color:#fff;white-space:nowrap;text-overflow:ellipsis;max-width:160px;font-size:12px;font-weight:700;overflow:hidden}.gp-card-expiry-value{font-family:var(--gp-font-mono);color:#fff;font-size:11.5px;font-weight:700}.gp-card-brand-logo{font-family:var(--gp-font-heading);letter-spacing:1px;color:#fff;text-shadow:0 0 12px #ffffff80;font-size:17px;font-style:italic;font-weight:800}.gp-card-back{transform-style:preserve-3d;clip-path:url(#gp-cc-clip-back);background:linear-gradient(135deg,#181a28 0%,#121320 50%,#0b0c14 100%);flex-direction:column;justify-content:flex-start;padding:16px 0;transition:opacity .2s,visibility .2s;display:flex;transform:rotateY(180deg);box-shadow:inset 0 1px 2px #ffffff2e,inset 0 -1px 2px #00000080;backface-visibility:visible!important}.gp-card-stripe{background:linear-gradient(90deg,#111 0%,#222 50%,#111 100%);width:100%;height:36px;margin-bottom:12px}.gp-card-back-content{flex-direction:column;padding:0 22px;display:flex}.gp-card-cvv-label{color:#fff9;text-align:right;margin-bottom:3px;font-size:8.5px}.gp-card-cvv-strip{width:100%;height:30px;font-family:var(--gp-font-mono);letter-spacing:3px;color:#fff;box-sizing:border-box;background:#ffffff1f;border:1px solid #fff3;border-radius:6px;justify-content:flex-end;align-items:center;padding-right:14px;font-size:13px;font-weight:700;display:flex}.gp-card-back-disclaimer{color:#fff6;margin-top:10px;font-size:7.5px;line-height:1.35}.gp-flip-card-btn{color:var(--gp-text-secondary);cursor:pointer;background:#ffffff0f;border:1px solid #ffffff26;border-radius:20px;align-items:center;gap:6px;margin-bottom:6px;padding:4px 12px;font-family:inherit;font-size:11px;font-weight:600;transition:all .2s;display:flex}.gp-flip-card-btn:hover{color:#fff;border-color:var(--gp-gold);background:#ffffff1f}.gp-security-badges{align-items:center;gap:16px;margin-top:2px;display:flex}.gp-security-badge{color:var(--gp-text-muted);align-items:center;gap:6px;font-size:10.5px;display:flex}.gp-spinner{border:3px solid #ffd60033;border-top-color:var(--gp-gold);width:32px;height:32px;box-shadow:0 0 16px var(--gp-gold-glow);border-radius:50%;animation:.9s linear infinite gpSpin}@keyframes gpSpin{to{transform:rotate(360deg)}}.gp-payment-form-section{box-sizing:border-box;flex-direction:column;justify-content:center;padding:10px 24px 10px 28px;display:flex;overflow:hidden}.gp-section-title{font-family:var(--gp-font-heading);color:#fff;letter-spacing:-.3px;margin-bottom:2px;font-size:19px;font-weight:700}.gp-section-subtitle{color:var(--gp-text-muted);margin-bottom:12px;font-size:11px}.gp-payment-form{flex-direction:column;gap:10px;display:flex}.gp-form-group{flex-direction:column;gap:3px;display:flex}.gp-form-label{color:var(--gp-text-secondary);justify-content:space-between;align-items:center;font-size:10.5px;font-weight:600;display:flex}.gp-input-wrapper{align-items:center;display:flex;position:relative}.gp-input-icon{color:var(--gp-text-muted);pointer-events:none;align-items:center;display:flex;position:absolute;left:12px}.gp-form-input{background:var(--gp-input-bg);width:100%;color:var(--gp-text-primary);font-family:var(--gp-font-main);box-sizing:border-box;border:1px solid #ffffff29;border-radius:11px;outline:none;padding:8px 12px 8px 36px;font-size:12px;transition:all .22s}.gp-form-input.mono-input{font-family:var(--gp-font-mono);letter-spacing:.8px}.gp-form-input:focus{border-color:var(--gp-gold);box-shadow:0 0 14px var(--gp-gold-glow), inset 0 1px 2px #0006;background:#ffffff14}.gp-form-input:focus+.gp-input-icon,.gp-input-wrapper:focus-within .gp-input-icon{color:var(--gp-gold)}.gp-card-type-indicator{font-family:var(--gp-font-heading);pointer-events:none;font-size:12px;font-style:italic;font-weight:800;position:absolute;right:12px}.gp-form-input.has-action-btn{padding-right:34px}.gp-input-action-btn{color:var(--gp-text-muted);cursor:pointer;z-index:2;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;transition:color .2s,background .2s;display:flex;position:absolute;right:10px}.gp-input-action-btn:hover{color:var(--gp-gold);background:#ffd6001f}.gp-form-row{grid-template-columns:1fr 1fr;gap:10px;display:grid}.gp-payment-summary{background:#ffffff0a;border:1px solid #ffffff1f;border-radius:11px;justify-content:space-between;align-items:center;margin:2px 0;padding:8px 12px;display:flex}.gp-summary-label{color:var(--gp-text-secondary);font-size:11.5px}.gp-summary-amount{font-family:var(--gp-font-heading);color:var(--gp-gold);text-shadow:0 0 14px var(--gp-gold-glow);font-size:16px;font-weight:800}.gp-pay-button{color:#08080a;width:100%;font-family:var(--gp-font-main);letter-spacing:.8px;cursor:pointer;box-shadow:0 0 24px var(--gp-gold-glow), 0 8px 24px #ff8c0059;box-sizing:border-box;background:linear-gradient(135deg,#ffd600 0%,#fa0 50%,#ff8c00 100%);border:none;border-radius:11px;justify-content:center;align-items:center;gap:8px;padding:10.5px;font-size:12.5px;font-weight:800;transition:all .22s cubic-bezier(.16,1,.3,1);display:flex}.gp-pay-button:hover:not(:disabled){box-shadow:0 0 32px var(--gp-gold-glow), 0 12px 28px #ff8c0080;filter:brightness(1.05);transform:translateY(-2px)}.gp-pay-button:active:not(:disabled){transform:translateY(0)}.gp-pay-button:disabled{opacity:.7;cursor:not-allowed}.gp-return-btn{color:var(--gp-text-secondary);cursor:pointer;background:0 0;border:1px solid #ffffff29;border-radius:20px;align-items:center;gap:6px;margin-top:10px;padding:6px 16px;font-family:inherit;font-size:11px;font-weight:600;transition:all .2s;display:flex}.gp-return-btn:hover{color:#fff;border-color:var(--gp-gold);background:#ffffff14}@media (width<=860px){.gp-checkout-stage{height:auto;max-height:94vh}.gp-checkout-content{grid-template-columns:1fr;padding:10px 24px 20px;overflow-y:auto}.gp-checkout-header{padding:14px 24px 10px 80px}.gp-card-preview-section{border-bottom:1px solid #ffffff1f;border-right:none;padding:14px}.gp-payment-form-section{padding:14px}}
