*{margin:0;padding:0;box-sizing:border-box}.welcome-container{width:100%;height:100vh;background:#0d0d0d;color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}.welcome-title{font-size:2rem;margin-bottom:40px;letter-spacing:1px}.start-button{padding:15px 30px;background:#1a73e8;border:none;outline:none;color:#fff;border-radius:8px;font-size:1.1rem;cursor:pointer;transition:.2s ease}.start-button:hover{background:#0f5fcc}.welcome-footer{margin-top:50px;font-size:.9rem;opacity:.7}.pin-container{width:100%;height:100vh;background:linear-gradient(135deg,#0f172a,#1e293b);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:Segoe UI,system-ui,sans-serif}.pin-header{text-align:center;margin-bottom:30px}.pin-header h2{font-size:1.8rem;font-weight:600;letter-spacing:.5px;margin-bottom:8px}.pin-subtitle{color:#94a3b8;font-size:.95rem}.pin-display-container{width:280px;margin-bottom:40px;text-align:center}.pin-display{display:flex;justify-content:center;gap:20px;margin-bottom:15px}.pin-dot{width:16px;height:16px;border-radius:50%;background:#334155;transition:all .3s ease;position:relative}.pin-dot.filled{background:#3b82f6;transform:scale(1.2);box-shadow:0 0 12px #3b82f680}.pin-dot.filled:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:8px;height:8px;border-radius:50%;background:#fff}.pin-status{color:#94a3b8;font-size:.9rem;min-height:20px}.keypad-container{background:#1e293bb3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;padding:25px;box-shadow:0 10px 30px #0000004d;border:1px solid rgba(255,255,255,.1)}.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;width:300px}.keypad button{width:80px;height:80px;background:linear-gradient(145deg,#1e293b,#0f172a);border:none;color:#fff;border-radius:15px;font-size:1.8rem;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;box-shadow:0 4px 15px #0003}.keypad button:hover{background:linear-gradient(145deg,#334155,#1e293b);transform:translateY(-2px);box-shadow:0 6px 20px #0000004d}.keypad button:active{transform:translateY(0);box-shadow:0 2px 10px #0003}.keypad button.number{background:linear-gradient(145deg,#2563eb,#1d4ed8)}.keypad button.number:hover{background:linear-gradient(145deg,#3b82f6,#2563eb)}.keypad button.special{background:linear-gradient(145deg,#475569,#334155)}.keypad button.special:hover{background:linear-gradient(145deg,#64748b,#475569)}.keypad button.cancel{background:linear-gradient(145deg,#dc2626,#b91c1c)}.keypad button.cancel:hover{background:linear-gradient(145deg,#ef4444,#dc2626)}.keypad button.enter{background:linear-gradient(145deg,#16a34a,#15803d)}.keypad button.enter:hover{background:linear-gradient(145deg,#22c55e,#16a34a)}.keypad-label{font-size:.7rem;color:#cbd5e1;margin-top:4px;font-weight:400;opacity:.8}.keypad-row{display:contents}.enter-icon,.cancel-icon,.clear-icon{font-size:1.2rem;margin-top:2px}@media(max-width:480px){.keypad button{width:70px;height:70px;font-size:1.5rem}.keypad{width:260px;gap:12px}}.menu-container{height:100vh;background:#0f172a;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center}.menu-buttons{display:flex;flex-direction:column;gap:15px;width:220px}.menu-buttons button{padding:15px;font-size:1rem;border-radius:8px;border:none;cursor:pointer;background:#1a73e8;color:#fff}.exit-btn{background:#dc2626}.balance-container{height:100vh;background:#0f172a;color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}.balance-amount{font-size:2rem;margin:30px 0;font-weight:700}.back-button{padding:12px 25px;font-size:1rem;border-radius:8px;border:none;cursor:pointer;background:#1a73e8;color:#fff;transition:.2s}.back-button:hover{background:#0f5fcc}.withdraw-container{height:100vh;background:#0f172a;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center}.withdraw-container input{padding:12px;font-size:1rem;margin:20px 0;width:220px;border-radius:6px;border:none}.buttons button{padding:12px 20px;border:none;border-radius:6px;cursor:pointer;background:#1a73e8;color:#fff}.deposit-container{height:100vh;background:#0f172a;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center}.deposit-container input{padding:12px;font-size:1rem;margin:20px 0;width:220px;border-radius:6px;border:none}.balance{font-size:1.2rem;margin-bottom:10px}.buttons{display:flex;gap:15px}.buttons button{padding:12px 20px;border:none;border-radius:6px;cursor:pointer;background:#16a34a;color:#fff}.buttons button:hover{opacity:.9}.transfer-container{height:100vh;background:#0f172a;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center}.current-balance{margin-bottom:15px;font-size:1.1rem}.transfer-container input{padding:12px;font-size:1rem;margin:10px 0;width:260px;border-radius:6px;border:none}.buttons{display:flex;gap:15px;margin-top:15px}.buttons button{padding:12px 20px;border:none;border-radius:6px;cursor:pointer;background:#2563eb;color:#fff}.cancel{background:#dc2626}.receipt-container{height:100vh;background:#020617;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center}.receipt-box{background:#0f172a;padding:20px 30px;border-radius:10px;margin:20px 0;width:300px}.receipt-box p{margin:10px 0}button{padding:12px 20px;border:none;border-radius:6px;cursor:pointer;background:#16a34a;color:#fff}button:hover{background:#15803d}.notification{position:fixed;top:20px;right:20px;padding:16px 20px;border-radius:8px;color:#fff;display:flex;align-items:center;justify-content:space-between;min-width:300px;max-width:400px;box-shadow:0 4px 12px #00000026;z-index:1000;transform:translate(120%);transition:transform .3s ease}.notification.show{transform:translate(0)}.notification.hide{transform:translate(120%)}.notification.info{background:#2563eb}.notification.success{background:#16a34a}.notification.error{background:#dc2626}.notification.warning{background:#d97706}.notification-text{flex:1;margin-right:15px}.notification-close{background:transparent;border:none;color:#fff;font-size:20px;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:50%}.notification-close:hover{background:#fff3}
