/* Top header bar */
header { position:absolute; top:0; left:0; width:100%; height:65px; padding:0 20px; background:var(--bg-card); border-bottom:1px solid var(--border); display:flex; justify-content:space-between; align-items:center; z-index:100; box-shadow:0 2px 10px rgba(0,0,0,0.03); transition:transform 0.3s ease-in-out; }
.header-right { display:flex; align-items:center; gap:12px; }
.wallet-pill { background:var(--bg-input); padding:6px 14px; border-radius:30px; display:flex; align-items:center; gap:8px; font-weight:700; border:1px solid var(--border); font-size:0.9rem; cursor:pointer; }
.notification-btn { font-size:1.2rem; color:var(--text-main); position:relative; cursor:pointer; padding:5px; }
.notif-dot { position:absolute; top:2px; right:2px; width:8px; height:8px; background:var(--danger); border-radius:50%; border:1px solid white; display:none; }
.app-brand-title {
    font-size:1.35rem; font-weight:900; letter-spacing:0.3px;
    background:linear-gradient(135deg,#4f46e5,#f43f5e);
    -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
    text-shadow:0 1px 2px rgba(79,70,229,0.10);
}
@keyframes bell-shake {
    0%,100% {transform:rotate(0)}
    15% {transform:rotate(18deg)} 30% {transform:rotate(-15deg)}
    45% {transform:rotate(12deg)} 60% {transform:rotate(-8deg)}
    75% {transform:rotate(4deg)}
}
.bell-shake { animation: bell-shake 0.9s ease-in-out; transform-origin: top center; display:inline-block; }