@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;800&family=Tiro+Devanagari+Hindi:ital@0;1&display=swap'); :root { --primary: #f97316; --bg-dark: #0f172a; --bg-card: rgba(30, 41, 59, 0.7); --text-main: #f8fafc; --text-muted: #94a3b8; } body { font-family: 'Inter', sans-serif; background-color: var(--bg-dark); color: var(--text-main); overflow-x: hidden; margin: 0; padding: 0; } .font-hindi { font-family: 'Tiro Devanagari Hindi', serif; } /* Custom Animations */ @keyframes pulse-red { 0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.7); } 50% { box-shadow: 0 0 0 15px rgba(239, 68, 68, 0); } } @keyframes slide-up { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } @keyframes shake { 0%, 100% { transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { transform: translateX(-5px); } 20%, 40%, 60%, 80% { transform: translateX(5px); } } @keyframes glow-green { 0% { box-shadow: 0 0 5px rgba(34, 197, 94, 0.2); } 50% { box-shadow: 0 0 20px rgba(34, 197, 94, 0.6); } 100% { box-shadow: 0 0 5px rgba(34, 197, 94, 0.2); } } .animate-shake { animation: shake 0.5s; } .animate-enter { animation: slide-up 0.4s ease-out forwards; } .karma-positive { animation: glow-green 1s ease-in-out; border-color: #22c55e !important; } .debt-critical { border: 2px solid #ef4444 !important; animation: pulse-red 2s infinite; } /* Utility */ .no-scrollbar::-webkit-scrollbar { display: none; } .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; } /* Components */ .glass-panel { background: var(--bg-card); backdrop-filter: blur(10px); border: 1px solid rgba(255, 255, 255, 0.1); } .neon-text { text-shadow: 0 0 10px rgba(249, 115, 22, 0.7); } /* Dual Wallet Specific */ .wallet-group { display: flex; flex-direction: column; gap: 4px; } .wallet-label { font-size: 0.65rem; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text-muted); } .wallet-bar-bg { height: 6px; background: #334155; border-radius: 3px; overflow: hidden; width: 100px; } .wallet-bar-fill { height: 100%; background: var(--primary); transition: width 0.5s ease; } .wallet-business .wallet-bar-fill { background: #22c55e; /* Green for business */ }