body.nw-notifications .hero{padding:18px 20px 14px}
body.nw-notifications .hero h1{font-size:clamp(24px,3vw,34px);margin:4px 0 5px}
body.nw-notifications .hero p{max-width:680px;font-size:12px;line-height:1.55}
body.nw-notifications .hero-row{display:flex;align-items:center;justify-content:space-between;gap:16px}
body.nw-notifications .layout{grid-template-columns:minmax(0,1fr);gap:0}
body.nw-notifications .inbox-controls{display:flex;align-items:flex-start;gap:12px;margin-bottom:10px}
body.nw-notifications .filters{display:flex;flex:1 1 auto;gap:7px;flex-wrap:wrap;margin-bottom:0}
body.nw-notifications .filter{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:6px 8px 6px 12px;font-size:10px}
body.nw-notifications .filter-count{display:inline-grid;place-items:center;box-sizing:border-box;min-width:24px;height:22px;padding:0 6px;border:1px solid rgba(255,255,255,.1);border-radius:999px;background:rgba(255,255,255,.055);color:#c8bfd5;font-size:10px;font-weight:900;font-variant-numeric:tabular-nums;line-height:1}
body.nw-notifications .filter.active .filter-count{border-color:rgba(196,181,253,.26);background:rgba(196,181,253,.14);color:#fff}
body.nw-notifications .notification-list{display:grid;gap:8px;list-style:none;margin:0;padding:0}
body.nw-notifications .notification{position:relative;display:grid;grid-template-columns:42px minmax(0,1fr);gap:11px;padding:13px 14px;border:1px solid var(--line);border-radius:14px;background:rgba(17,13,27,.78)}
body.nw-notifications .notification.unread{border-color:rgba(167,139,250,.42);box-shadow:inset 3px 0 0 #a78bfa}
body.nw-notifications .notice-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;color:#dcd3ff;border:1px solid rgba(139,92,246,.2);background:rgba(139,92,246,.1)}
body.nw-notifications .notice-icon svg{width:21px;height:21px;display:block}
body.nw-notifications .notice-copy{min-width:0;padding-right:0}
body.nw-notifications .notice-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;min-width:0}
body.nw-notifications .notice-copy h2{font-size:13px;line-height:1.35;margin:0;color:#f7f2ff}
body.nw-notifications .notice-heading h2{min-width:0}
body.nw-notifications .notice-unread{flex:0 0 auto;margin-top:2px;color:#c4b5fd;font-size:8px;font-weight:900;letter-spacing:.08em;line-height:1.2;text-transform:uppercase}
body.nw-notifications .notice-copy p{font-size:11px;line-height:1.48;margin:4px 0 0;color:#b8afc8}
body.nw-notifications .notice-meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:7px;color:#91879f;font-size:9px}
body.nw-notifications .notice-category{display:inline-flex;align-items:center;min-height:20px;padding:2px 7px;border-radius:999px;border:1px solid rgba(139,92,246,.16);color:#c7bdd8}
body.nw-notifications .notice-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}
body.nw-notifications .notice-actions a,body.nw-notifications .notice-actions button{min-height:36px;padding:8px 11px;border-radius:9px;font-size:10px;font-weight:850}
body.nw-notifications .notice-actions .primary{background:#7c3aed;color:#fff;border:1px solid #8b5cf6}
body.nw-notifications .notice-actions .accept{background:#7c3aed;color:#fff;border:1px solid #8b5cf6}
body.nw-notifications .notice-actions .decline{background:transparent;color:#d8d0e2;border:1px solid var(--line)}
body.nw-notifications .notice-actions button:disabled{opacity:.55;cursor:wait}
body.nw-notifications .filter:focus-visible,body.nw-notifications .mark-all:focus-visible,body.nw-notifications .notice-actions a:focus-visible,body.nw-notifications .notice-actions button:focus-visible,body.nw-notifications .load-more:focus-visible{outline:2px solid #c4b5fd;outline-offset:2px}
body.nw-notifications .empty{padding:24px 14px;border:1px dashed var(--line);border-radius:14px;text-align:center}
body.nw-notifications .empty b{font-size:14px}
body.nw-notifications .empty span{font-size:11px;color:var(--muted)}
body.nw-notifications .mark-all{flex:0 0 auto;min-height:38px;padding:9px 12px}
body.nw-notifications .load-more{min-height:38px}

@media(max-width:900px){
  body.nw-notifications .layout{grid-template-columns:1fr}
}
@media(max-width:560px){
  body.nw-notifications .shell{padding-bottom:calc(90px + env(safe-area-inset-bottom,0px))}
  body.nw-notifications .hero{padding:14px}
  body.nw-notifications .hero-row{align-items:flex-start;flex-direction:column;gap:10px}
  body.nw-notifications .inbox-controls{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
  body.nw-notifications .filters{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px;scrollbar-width:none}
  body.nw-notifications .filter{flex:0 0 auto;min-height:42px}
  body.nw-notifications .mark-all{justify-self:start;min-height:42px}
  body.nw-notifications .notification{grid-template-columns:38px minmax(0,1fr);padding:12px;gap:9px}
  body.nw-notifications .notice-icon{width:38px;height:38px}
  body.nw-notifications .notice-copy{padding-right:0}
  body.nw-notifications .notice-heading{gap:8px}
  body.nw-notifications .notice-actions a,body.nw-notifications .notice-actions button{min-height:42px;flex:1 1 auto;text-align:center}
}
