@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap";:root{--bg-color: #0f111a;--card-bg: rgba(23, 25, 35, .7);--primary: #635bff;--primary-hover: #7a73ff;--text-main: #ffffff;--text-muted: #a0aec0;--border: rgba(255, 255, 255, .08);--glass-border: rgba(255, 255, 255, .05);--danger: #ef4444;--success: #10b981;--radius: 16px;--font-family: "Outfit", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--bg-color);color:var(--text-main);min-height:100vh;display:flex;justify-content:center;overflow-x:hidden;padding:2rem}.background-blobs{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;overflow:hidden}.blob{position:absolute;border-radius:50%;filter:blur(80px);opacity:.4;animation:float 10s infinite ease-in-out}.blob-1{width:400px;height:400px;background:#635bff;top:-50px;left:-100px}.blob-2{width:300px;height:300px;background:#00d4ff;bottom:100px;right:-50px;animation-delay:-2s}.blob-3{width:250px;height:250px;background:#ff00bf;top:40%;left:40%;opacity:.2;animation-delay:-5s}@keyframes float{0%,to{transform:translate(0)}50%{transform:translate(30px,-30px)}}.app-container{width:100%;max-width:1100px;z-index:1}header{text-align:center;margin-bottom:3rem}.logo{display:flex;align-items:center;justify-content:center;gap:1rem;margin-bottom:.5rem;font-size:2rem;color:var(--primary)}.logo h1{color:var(--text-main);font-weight:700}.subtitle{color:var(--text-muted);font-size:1.1rem}.card{background:var(--card-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:var(--radius);padding:2rem;box-shadow:0 8px 32px #0003;margin-bottom:1.5rem;transition:transform .2s,box-shadow .2s}.config-section h2,.section-header h2,.output-section h2{font-size:1.25rem;margin-bottom:1.5rem;display:flex;align-items:center;gap:.75rem;color:var(--text-main)}.split-view{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}@media (max-width: 900px){.split-view{grid-template-columns:1fr}}.input-group{margin-bottom:1.5rem}.input-group label{display:block;margin-bottom:.5rem;color:var(--text-muted);font-size:.9rem;font-weight:500}.input-wrapper{position:relative;display:flex;align-items:center}.input-icon{position:absolute;left:1rem;color:var(--text-muted);font-size:1.2rem;pointer-events:none;display:flex;align-items:center}input[type=text]{width:100%;background:#0003;border:1px solid var(--border);color:var(--text-main);padding:1rem 1rem 1rem 3rem;border-radius:12px;font-family:inherit;font-size:1rem;transition:all .2s}input[type=text]:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #635bff33}.hint{font-size:.8rem;color:var(--text-muted);margin-top:.5rem}.stripe-input{background:#0003;border:1px solid var(--border);padding:1rem;border-radius:12px;margin-bottom:.5rem}.StripeElement--focus{border-color:var(--primary);box-shadow:0 0 0 3px #635bff33}.StripeElement--invalid{border-color:var(--danger)}#card-errors{color:var(--danger);font-size:.9rem;margin-top:.5rem;min-height:20px}.btn{cursor:pointer;border:none;padding:.8rem 1.5rem;border-radius:12px;font-family:inherit;font-weight:600;transition:all .2s;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-size:1rem}.btn-primary{background:var(--primary);color:#fff;width:100%}.btn-primary:hover{background:var(--primary-hover);transform:translateY(-1px);box-shadow:0 4px 12px #635bff4d}.btn-primary:disabled{opacity:.7;cursor:not-allowed;transform:none;box-shadow:none}.btn-secondary{background:#ffffff1a;color:var(--text-main)}.btn-secondary:hover{background:#ffffff26}.btn-ghost{background:transparent;border:1px solid var(--border);color:var(--text-muted);padding:.5rem 1rem;font-size:.9rem}.btn-ghost:hover{color:var(--text-main);border-color:var(--text-muted)}.test-cards{margin-top:2rem;margin-bottom:2rem}.test-cards h3{font-size:.9rem;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-bottom:1rem}.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.8rem}.test-card-btn{background:#ffffff08;border:1px solid var(--border);padding:.8rem;border-radius:10px;cursor:pointer;text-align:left;transition:all .2s;color:var(--text-muted);display:flex;flex-direction:column;gap:4px;position:relative;overflow:hidden}.test-card-btn:hover{background:#ffffff14;border-color:var(--primary)}.test-card-btn .copy-icon{position:absolute;top:8px;right:8px;opacity:0;transition:opacity .2s}.test-card-btn:hover .copy-icon{opacity:1}.card-brand{font-size:.75rem;font-weight:700;color:var(--text-main)}.card-number{font-family:monospace;font-size:.9rem}.hint-text{font-size:.8rem;color:var(--text-muted);margin-top:.8rem;font-style:italic}.console-window{background:#000;border-radius:8px;border:1px solid var(--border);height:400px;overflow:hidden;display:flex;flex-direction:column}.console-header{background:#1a1a1a;padding:.8rem;display:flex;gap:6px;border-bottom:1px solid var(--border)}.dot{width:10px;height:10px;border-radius:50%}.red{background:#ff5f56}.yellow{background:#ffbd2e}.green{background:#27c93f}pre{padding:1rem;color:#00ff9d;font-family:Consolas,Monaco,monospace;font-size:.9rem;overflow-y:auto;flex:1;white-space:pre-wrap;line-height:1.4}.disabled{opacity:.5;pointer-events:none;filter:grayscale(1)}.hidden{display:none}.badge{background:#ffbd2e33;color:#ffbd2e;padding:4px 8px;border-radius:6px;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.toast-container{position:fixed;bottom:2rem;left:50%;transform:translate(-50%) translateY(100px);background:var(--text-main);color:var(--bg-color);padding:.8rem 1.5rem;border-radius:50px;font-weight:600;box-shadow:0 10px 30px #00000080;transition:transform .3s cubic-bezier(.175,.885,.32,1.275);z-index:100;opacity:0}.toast-container.show{transform:translate(-50%) translateY(0);opacity:1}