body{margin:0;padding:0;font-family:Segoe UI,Roboto,sans-serif;background-color:#f4f4f4;color:#333}.mobile-container{max-width:430px;margin:0 auto;min-height:100vh;background:linear-gradient(to bottom,#f4f0fa,#fff);box-shadow:0 0 12px #0000000f;display:flex;flex-direction:column;position:relative;overflow-x:hidden;border-radius:12px}.app{padding-bottom:80px}.navbar{background:linear-gradient(to right,#5b2baf,#7b2cbf);color:#fff;padding:16px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom-left-radius:16px;border-bottom-right-radius:16px;box-shadow:0 4px 8px #0000001f}.h1{font-size:22px;font-weight:700}.right{display:flex;align-items:center;gap:12px}.input{padding:6px 12px;border-radius:20px;border:none;outline:none;font-size:14px}.img{width:32px;height:32px;border-radius:50%;border:2px solid white}.wallet-section{margin:16px;padding:20px;background:linear-gradient(135deg,#f6ecff,#e3d3ff);border-radius:18px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 4px 14px #5a3f9726}.wh2{margin:0;font-size:15px;color:#5b2baf;font-weight:600}.wp{font-size:24px;font-weight:700;margin-top:5px;color:#1e1e1e}.button{background:#5b2baf;color:#fff;padding:10px 20px;font-size:14px;border-radius:25px;border:none;cursor:pointer;transition:background .2s ease-in-out}.button:hover{background:#6d3bcb}.quick-actions{margin:16px;padding:16px;background:#fff;border-radius:16px;box-shadow:0 2px 8px #5b2baf14}.wh3{margin-bottom:16px;font-size:15px;font-weight:600;color:#333}.action-buttons{display:flex;justify-content:space-around;text-align:center;flex-wrap:wrap;gap:12px}.action{transition:transform .2s ease;cursor:pointer;padding:12px;border-radius:12px;background:#faf7ff;box-shadow:0 1px 4px #9065e31a}.action:hover{background-color:#f1e9ff;transform:scale(1.05)}.icon{font-size:26px;margin-bottom:6px}.ap{margin:0;font-size:13px;color:#555}.categories-grid{margin:16px;padding:16px;background:#fff;border-radius:16px;box-shadow:0 2px 8px #5b2baf14}.ch3{margin-bottom:16px;font-size:15px;font-weight:600;color:#333}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;text-align:center}.category{cursor:pointer;transition:transform .2s ease;padding:12px 0;border-radius:10px;background-color:#faf7ff;box-shadow:0 1px 4px #9065e30f}.category:hover{transform:scale(1.05);background-color:#f0e7ff}.ticon{font-size:26px;margin-bottom:5px}.cp{font-size:13px;color:#444}.recent-transactions{margin:16px;padding:16px;background:#fff;border-radius:16px;box-shadow:0 2px 8px #5b2baf14}.rh3{margin-bottom:16px;font-size:15px;font-weight:600;color:#333}.ul{list-style:none;margin:0;padding:0}.li{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid #eee}.tp{margin:0;font-weight:500;color:#222}.tpp{font-size:12px;color:#888}.amount{color:#d32f2f;font-weight:600}.bottom-nav{bottom:0;left:0;right:0;height:60px;background:#fff;display:flex;justify-content:space-around;align-items:center;border-top:1px solid #ddd;box-shadow:0 -2px 8px #0000000d;z-index:100}.nav-item{display:flex;flex-direction:column;align-items:center;font-size:14px;color:#666;cursor:pointer;transition:all .3s ease}.nav-item:hover{color:#5b2baf;transform:translateY(-3px)}.nav-item.active{color:#5b2baf;font-weight:600}.nav-item .icon{font-size:20px;margin-bottom:3px}.nav-item .label{font-size:11px;font-weight:500;margin:0}.nav-item.active .icon{transform:scale(1.2)}