@layer z.tokens,z.base,z.components;@layer z.pages{.z-notifs{gap:var(--z-space-6);padding-block:var(--z-space-10) var(--z-space-18);flex-direction:column;display:flex}.z-notifs__head{gap:var(--z-space-2);flex-direction:column;max-width:44rem;display:flex}.z-notifs__lead{color:var(--z-sub);font:var(--z-text-body-lg)}.z-notifs__panel{gap:var(--z-space-4);flex-direction:column;display:flex}.z-notifs__panel:has(.z-pending[data-pending=true]) .z-rows{opacity:.55;transition:opacity var(--z-dur) var(--z-ease)}.z-notifs__bar{justify-content:space-between;align-items:center;gap:var(--z-space-2) var(--z-space-4);flex-wrap:wrap;display:flex}.z-notifs__bar .z-tabs{flex:auto}.z-notifs__side{align-items:center;gap:var(--z-space-2) var(--z-space-4);flex-wrap:wrap;display:flex}.z-notifs__tools{justify-content:space-between;align-items:flex-end;gap:var(--z-space-2) var(--z-space-4);flex-wrap:wrap;display:flex}.z-notifs__filter{align-items:flex-end;gap:var(--z-space-2);flex-wrap:wrap;flex:auto;display:flex}.z-notifs__filter .z-field{width:16rem;max-width:100%}.z-notifs__count{color:var(--z-sub);font:var(--z-text-small)}.z-notifs__reason{gap:var(--z-space-1);padding:var(--z-space-3) var(--z-space-4);border-inline-start:3px solid var(--z-line-strong);background:var(--z-muted);font:var(--z-text-small);flex-direction:column;display:flex}.z-row--unread .z-notifs__reason{background:var(--z-surface)}.z-notifs__reason strong{font:var(--z-text-small-strong)}.z-notifs__reason p{color:var(--z-sub);white-space:pre-line;overflow-wrap:anywhere}@media (max-width:59.9375em){.z-notifs{gap:var(--z-space-5);padding-block:var(--z-space-6) var(--z-space-12)}}@media (max-width:39.9375em){.z-notifs__bar{flex-direction:column;align-items:stretch}.z-notifs .z-tabs{-webkit-mask-image:linear-gradient(to right, black calc(100% - var(--z-space-6)), transparent);mask-image:linear-gradient(to right, black calc(100% - var(--z-space-6)), transparent);padding-inline-end:var(--z-space-6);scroll-padding-inline-end:var(--z-space-6)}.z-notifs__filter{width:100%}.z-notifs__filter .z-field{flex:auto;width:auto}}}@layer z.utilities;
