.notification-card-preview{background:var(--color-white);border-color:#e6e6eb;gap:6px;padding:12px}.notification-card-preview .notification-card-head{justify-content:space-between;align-items:center;gap:8px;display:flex}.notification-card-preview .notification-card-head b{color:#2f2f37;font-weight:800;font-size:12px!important}.notification-card-preview .notification-card-head .notification-card-badge{color:#fff;background:#2f2f37;border-radius:99px;padding:2px 7px;font-weight:800;font-size:9px!important}.notification-card-preview .notification-card-list{gap:4px;width:100%;margin:0;padding:0;list-style:none;display:grid}.notification-card-preview .notification-card-list li{background:#fafafa;border:1px solid #e5e5ea;border-left:3px solid #cfd0d6;border-radius:6px;gap:2px;padding:6px 8px;display:grid}.notification-card-preview .notification-card-list li.is-unread{background:#fff;border-left-color:#2f2f37}.notification-card-preview .notification-card-list li b{color:#2f2f37;font-size:9.5px;font-weight:800;line-height:1.3}.notification-card-preview .notification-card-list li.is-read b{color:#6a6a73;font-weight:650}.notification-card-preview .notification-card-list li small{color:#6a6a73;font-size:7.5px}.notification-card-preview .notification-card-list .notification-card-mark{font-weight:800}.notification-card-preview .notification-card-list li.is-unread .notification-card-mark{color:#2f2f37}.notification-card-preview .notification-card-list li.is-read .notification-card-mark{color:#9a9aa3}.notification-card-preview .notification-card-verdict{color:#2f2f37;margin:2px 0 0;font-size:8px;line-height:1.5}.notification-card-preview .notification-card-verdict b{color:#2f2f37;font-weight:800}.notification-card-preview .notification-card-bad{background:#fdf3f4;border:1px solid #ecdde0;border-radius:6px;margin:0;padding:5px 7px}.notification-card-preview .notification-card-bad small{color:#8a2f3a;font-size:7px;font-weight:800}.notification-card-preview .notification-card-bad span{color:#6a6a73;font-size:7.5px;line-height:1.45;display:block}.term-interactive-demo.notification-demo{background:#e9f5f3;border-color:#b9d7d4;gap:12px}.term-interactive-demo.notification-demo button{color:#174b4a;background:#fff;border:1px solid #afd0cc;border-radius:6px}.term-interactive-demo.notification-demo button:hover:not(:disabled){color:#174b4a;background:#f2fbf9;border-color:#247a76}.term-interactive-demo.notification-demo button:focus-visible{outline-offset:2px;outline:2px solid #247a76}.term-interactive-demo.notification-demo button:disabled,.term-interactive-demo.notification-demo button:disabled:hover{color:#6b9590;cursor:not-allowed;background:#fff;border-color:#cde2df}.term-interactive-demo.notification-demo .notification-cta{color:#fff;background:#247a76;border:0;border-radius:6px;font-size:13px;font-weight:800}.term-interactive-demo.notification-demo .notification-cta:hover{color:#fff;background:#17615e}.term-interactive-demo.notification-demo .notification-cta:focus-visible{outline-offset:2px;outline:2px solid #174b4a}.notification-demo .notification-demo-brief{color:#174b4a;margin:0;font-size:13px;line-height:1.55}.notification-demo .notification-demo-bell-bar{background:#fff;border:1px solid #b9d7d4;border-radius:8px;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px;display:flex}.notification-demo .notification-demo-bell{color:#174b4a;background:#fff;border:1px solid #afd0cc;border-radius:99px;align-items:center;gap:7px;min-height:34px;padding:6px 11px;font-size:13px;font-weight:800;display:inline-flex}.notification-demo .notification-demo-bell[aria-expanded=true]{background:#effaf8;border-color:#247a76}.notification-demo .notification-demo-bell-icon{font-size:15px;line-height:1}.notification-demo .notification-demo-badge{color:#fff;background:#cfd0d6;border-radius:99px;justify-content:center;align-items:center;min-width:18px;height:18px;padding:0 5px;font-size:11px;font-weight:800;display:inline-flex}.notification-demo .notification-demo-badge.is-on{color:#fff;background:#247a76}.notification-demo .notification-demo-bell-meta{color:#5e8581;align-items:baseline;gap:5px;font-size:12px;font-weight:700;display:inline-flex}.notification-demo .notification-demo-bell-meta b{color:#174b4a;font-size:12px;font-weight:800}.notification-demo .notification-demo-bell-bar .notification-cta{min-height:34px;margin-left:auto;padding:7px 16px}.notification-demo .notification-demo-reset{min-height:32px;padding:6px 12px;font-size:12.5px;font-weight:700}.notification-demo .notification-demo-panel{background:#f3fbfa;border:1px solid #b9d7d4;border-radius:8px;gap:8px;padding:12px;display:grid}.notification-demo .notification-demo-panel-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.notification-demo .notification-demo-panel-title{color:var(--muted);letter-spacing:.03em;text-transform:uppercase;font-size:11px;font-weight:800}.notification-demo .notification-demo-panel-actions{flex-wrap:wrap;gap:6px;display:flex}.notification-demo .notification-demo-panel-actions button{min-height:30px;padding:5px 11px;font-size:12.5px;font-weight:700}.notification-demo .notification-demo-collapsed{border:1px dashed var(--line);background:var(--soft);color:var(--muted);border-radius:8px;margin:0;padding:10px 12px;font-size:12.5px;line-height:1.5}.notification-demo .notification-demo-collapsed b{color:var(--ink);font-weight:800}.notification-demo .notification-demo-list{gap:7px;margin:0;padding:0;list-style:none;display:grid}.notification-demo .notification-demo-item{background:#fff;border:1px solid #c7dfdc;border-left:4px solid #b7d2ce;border-radius:8px;gap:5px;padding:10px 12px;display:grid}.notification-demo .notification-demo-item.is-unread{background:#fff;border-left-color:#247a76}.notification-demo .notification-demo-item.is-read{background:#f7f7f8}.notification-demo .notification-demo-item-head{flex-wrap:wrap;align-items:baseline;gap:6px;display:flex}.notification-demo .notification-demo-source{color:#4b4e58;letter-spacing:.02em;background:#eef0f3;border-radius:4px;padding:1px 6px;font-size:10px;font-weight:800}.notification-demo .notification-demo-item.is-read .notification-demo-source{color:#8a8b93;background:#ededf0}.notification-demo .notification-demo-item-head strong{color:#174b4a;flex:auto;min-width:0;font-size:13px;font-weight:800;line-height:1.35}.notification-demo .notification-demo-item.is-read .notification-demo-item-head strong{color:#6a6a73;font-weight:650}.notification-demo .notification-demo-state{border-radius:4px;padding:1px 6px;font-size:10px;font-weight:800}.notification-demo .notification-demo-state.is-unread{color:#fff;background:#247a76}.notification-demo .notification-demo-state.is-read{color:#6a6a73;background:#e6e6eb}.notification-demo .notification-demo-item p{color:#4a4a52;margin:0;font-size:12px;line-height:1.45}.notification-demo .notification-demo-item.is-read p{color:#7a7a82}.notification-demo .notification-demo-item-meta{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.notification-demo .notification-demo-item-meta time{color:var(--muted);font-size:11px;font-weight:700}.notification-demo .notification-demo-item-actions{flex-wrap:wrap;gap:6px;display:flex}.notification-demo .notification-demo-item-actions button{min-height:26px;padding:3px 9px;font-size:12px;font-weight:700}.notification-demo .notification-demo-empty{border:1px dashed var(--line);background:var(--color-white);text-align:center;border-radius:8px;gap:3px;padding:18px 14px;display:grid}.notification-demo .notification-demo-empty strong{color:var(--ink);font-size:13px;font-weight:800}.notification-demo .notification-demo-empty span{color:var(--muted);font-size:12px;line-height:1.45}.term-interactive-demo.notification-demo .notification-demo-status{border-left:3px solid var(--ink);color:#3d3d45;background:#f5f5f5;border-radius:0 6px 6px 0;margin:0;padding:11px 12px;font-size:12.5px;line-height:1.6}.notification-examples{gap:10px;display:grid}.notification-example{border:1px solid var(--line);background:var(--color-white);border-left:4px solid #b6b6be;border-radius:8px;gap:4px;padding:12px 14px;display:grid}.notification-example.is-good{background:#f4faf6;border-left-color:#3c8055}.notification-example.is-bad{background:#fdf3f4;border-left-color:#a83a44}.notification-example small{color:var(--muted);letter-spacing:.03em;text-transform:uppercase;font-size:11px;font-weight:800}.notification-example b{color:var(--ink);font-size:13.5px;font-weight:800;line-height:1.35}.notification-example p{color:#4a4a52;margin:0;font-size:12.5px;line-height:1.55}@media (max-width:560px){.notification-demo .notification-demo-bell-bar{gap:6px}.notification-demo .notification-demo-bell-bar .notification-cta{flex:100%;margin-left:0}.notification-demo .notification-demo-item-head strong{flex-basis:100%}}