.notification{border-radius:var(--border-radius);display:flex;font-size:.75em;line-height:1.5;min-width:200px;padding:var(--space-s);position:relative}.notification--read{opacity:.5}.notification:hover{background-color:color-mix(in srgb,var(--color-primary-rgb),.125)}.notification:hover .notifications__icon{color:var(--color-foreground);--icon-fill:color-mix(in srgb,var(--color-primary-rgb),.25)}.notification__icon{color:var(--color-primary);font-size:2em;grid-area:icon}.notification__title{font-size:1em;grid-area:title;white-space:nowrap}[data-contrast-mode] .notification__title{color:currentColor}.notification__message{grid-area:message;min-width:10em;opacity:.5}.notification__container{display:grid;width:-moz-fit-content;width:fit-content;grid-gap:var(--space-xs) var(--space-s);grid-template:"icon title" auto "icon message" auto/2em 1fr}.notification__container--loading{opacity:0}.notification__loader{left:50%;position:absolute;top:50%}:root{--media-max-width:34em}.notifications{--block-title-color:var(--color-primary);position:relative}.notifications__title{font-size:1em;grid-area:title;white-space:nowrap}[data-contrast-mode] .notifications__title{color:currentColor}.notifications__list{display:flex;flex-direction:column;gap:.5em;list-style:none;margin:0;padding:0}.notifications__item--empty{background-color:var(--color-accent);border-radius:var(--border-radius);color:rgba(var(--color-accent-rgb),.5);padding:var(--space-s);text-align:center}.notifications__item--empty .icon{font-size:1.5em}.notifications__message{align-items:center;display:flex;flex-direction:row;gap:.5em;justify-content:center;opacity:.5}