.notification-bell{position:fixed;top:18px;right:18px;z-index:1200;width:46px;height:46px;border:1px solid rgba(255,255,255,.16);border-radius:50%;background:#111827;color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 10px 28px rgba(0,0,0,.28);font-size:20px}.notification-bell:hover{transform:translateY(-1px)}.notification-count{position:absolute;top:-5px;right:-5px;min-width:21px;height:21px;padding:0 5px;border-radius:999px;background:#ef4444;color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center;border:2px solid #111827}.notification-panel{position:fixed;top:72px;right:18px;z-index:1199;width:min(390px,calc(100vw - 28px));max-height:520px;overflow:auto;background:#fff;color:#111827;border-radius:18px;box-shadow:0 22px 60px rgba(0,0,0,.32);border:1px solid #e5e7eb}.notification-panel[hidden]{display:none}.notification-panel-header{display:flex;align-items:center;justify-content:space-between;padding:18px;border-bottom:1px solid #e5e7eb}.notification-panel-header h2{font-size:17px;margin:0}.notification-panel-list{list-style:none;margin:0;padding:0}.notification-item{display:grid;grid-template-columns:42px 1fr;gap:11px;padding:14px 18px;border-bottom:1px solid #f1f5f9;text-decoration:none;color:inherit}.notification-item.unread{background:#eff6ff}.notification-item-icon{width:38px;height:38px;border-radius:12px;background:#f3f4f6;display:grid;place-items:center}.notification-item strong{display:block;font-size:14px}.notification-item p{margin:4px 0;color:#4b5563;font-size:12px;line-height:1.4}.notification-item time{font-size:11px;color:#6b7280}.notification-panel-empty{padding:28px;text-align:center;color:#6b7280}.notification-panel-footer{display:block;padding:14px;text-align:center;font-weight:800;text-decoration:none;color:#2563eb}.notifications-page{min-height:100vh;background:#f8fafc;padding:32px 18px}.notifications-shell{max-width:920px;margin:auto}.notifications-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}.notifications-top h1{margin:0}.notifications-actions{display:flex;gap:10px;flex-wrap:wrap}.notifications-button{border:0;border-radius:10px;padding:10px 14px;font-weight:800;cursor:pointer;background:#111827;color:#fff}.notifications-list{display:grid;gap:12px}.notifications-card{display:grid;grid-template-columns:52px 1fr auto;gap:14px;align-items:start;background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:16px}.notifications-card.unread{border-color:#93c5fd;background:#eff6ff}.notifications-card-icon{width:48px;height:48px;border-radius:14px;background:#f3f4f6;display:grid;place-items:center;font-size:22px}.notifications-card h2{font-size:16px;margin:0 0 5px}.notifications-card p{margin:0 0 7px;color:#4b5563}.notifications-card time{font-size:12px;color:#6b7280}.notifications-card button{border:1px solid #d1d5db;background:#fff;border-radius:9px;padding:8px 10px;cursor:pointer}.notifications-empty{background:#fff;border:1px dashed #cbd5e1;border-radius:16px;padding:44px;text-align:center;color:#64748b}.notifications-back{display:inline-block;margin-top:20px;color:#2563eb;text-decoration:none;font-weight:800}@media(max-width:640px){.notification-bell{top:12px;right:12px}.notification-panel{top:65px;right:10px}.notifications-card{grid-template-columns:44px 1fr}.notifications-card button{grid-column:2}.notifications-top{align-items:flex-start;flex-direction:column}}