/* U-26 selected notification-center option 01; shared chrome owns screen geometry. */
.notification-page { background:var(--wm-color-primary-wash); }
.notification-page .b45-topbar { background:var(--wm-color-primary-wash); }
.notification-scroll { padding:10px 12px 28px; }
.notification-intro { display:grid; grid-template-columns:36px minmax(0,1fr); gap:12px; align-items:center; margin:0 0 15px; }
.notification-intro-icon { display:grid; width:36px; height:36px; place-items:center; border-radius:50%; background:var(--wm-color-primary-soft); }
.notification-intro-icon img { display:block; width:24px; height:24px; }
.notification-intro h2 { margin:0 0 3px; font-size:16px; line-height:21px; font-weight:600; }
.notification-intro p { margin:0; color:var(--wm-color-muted-strong); font-size:12px; line-height:18px; }
.notification-day + .notification-day { margin-top:16px; }
.notification-date { display:table; margin:0 0 8px; padding:2px 10px; border-radius:999px; background:var(--wm-color-primary-soft); color:var(--wm-color-muted-strong); font-size:12px; line-height:18px; font-weight:500; }
.notification-card { display:grid; grid-template-columns:40px minmax(0,1fr); column-gap:13px; padding:14px 14px 16px; border-radius:12px; background:var(--wm-color-surface); }
.notification-card + .notification-card { margin-top:10px; }
.notification-symbol { display:grid; grid-column:1; grid-row:1 / span 4; align-self:start; place-items:center; width:40px; height:40px; border-radius:50%; background:var(--wm-color-primary-soft); }
.notification-symbol > img { display:block; width:20px; height:26px; object-fit:contain; }
.notification-video-icon { width:26px; height:26px; background:var(--wm-color-primary); mask:url('./assets/notification/video.svg') center / contain no-repeat; -webkit-mask:url('./assets/notification/video.svg') center / contain no-repeat; }
.notification-card-heading,.notification-body,.notification-topic,.notification-actions { grid-column:2; min-width:0; }
.notification-card-heading { display:flex; justify-content:space-between; align-items:center; gap:6px; }
.notification-card h3 { margin:0; font-size:15px; font-weight:600; line-height:21px; }
.notification-time { flex:none; color:var(--wm-color-muted); font-size:12px; line-height:18px; }
.notification-body { margin:6px 0 0; color:var(--wm-color-muted-strong); font-size:12px; line-height:18px; overflow-wrap:anywhere; }
.notification-card--service .notification-body { max-width:224px; }
.notification-topic { display:flex; align-items:center; gap:7px; min-height:34px; margin:10px 0 0; padding:7px 10px; border-radius:7px; color:var(--wm-color-muted-strong); background:var(--wm-color-primary-soft); font-size:12px; line-height:18px; }
.notification-play { display:grid; flex:none; width:15px; height:15px; place-items:center; border-radius:50%; background:var(--wm-color-primary); }
.notification-play img { display:block; width:9px; height:9px; filter:brightness(0) invert(1); }
.notification-actions { display:flex; justify-content:flex-end; margin-top:14px; }
.notification-page .notification-action { display:inline-flex; align-items:center; justify-content:center; gap:4px; min-height:30px; padding:5px 7px; border:1px solid var(--wm-color-primary-strong); border-radius:999px; color:var(--wm-color-primary-strong); background:var(--wm-color-surface); font-size:13px; font-weight:600; line-height:18px; white-space:nowrap; }
.notification-page .notification-action.is-primary { padding-inline:6px; color:#fff; background:var(--wm-color-primary-strong); }
.notification-action img { display:block; flex:none; width:12px; height:12px; }
.notification-action.is-primary img { filter:brightness(0) invert(1); }
.notification-action:active { opacity:.8; }
.notification-end { display:flex; align-items:center; justify-content:center; gap:10px; margin:28px 0 0; color:var(--wm-color-muted-soft); font-size:12px; line-height:18px; text-align:center; }
.notification-end::before,.notification-end::after { content:''; width:38px; height:1px; background:var(--wm-color-line-strong); }