.notification-popover{width:430px;max-width:calc(100vw - 24px);max-height:calc(100dvh - var(--header,70px) - 22px);display:flex;flex-direction:column;overflow:hidden;border:1px solid #3b3e46;border-top:2px solid #a82534;border-radius:14px;background:#121519;box-shadow:0 22px 70px #000a}.notification-popover[hidden]{display:none}.notice-popover-heading{display:flex;align-items:flex-start;justify-content:space-between;padding:20px 20px 14px;background:linear-gradient(110deg,#2b1a20,#171a20 70%);flex-shrink:0}.notice-popover-heading .eyebrow,.notice-page-heading .eyebrow{font-size:8px;letter-spacing:1.7px;color:#ad7d86}.notice-popover-heading h3{font-size:21px;margin:5px 0;letter-spacing:-.4px}.notice-popover-heading p,.notice-page-heading p{font-size:10px;color:#969fae;margin:0}.notice-dismiss{width:28px;height:28px;display:grid;place-items:center;background:#ffffff06;border:1px solid #ffffff15;border-radius:50%;font-size:21px;line-height:1;color:#adb5c1;cursor:pointer}.notice-dismiss:hover{background:#383039;color:#fff}.notice-popover-toolbar{padding:10px 14px;display:flex;align-items:center;justify-content:space-between;gap:8px;background:#191c22;border-block:1px solid #ffffff0a;flex-shrink:0}.notice-filters{display:flex;gap:4px}.notice-filters>button{display:flex;align-items:center;gap:5px;padding:7px 9px;min-height:31px;border:1px solid transparent;border-radius:5px;background:none;color:#939dac;font-family:inherit;font-size:10px;line-height:1.2;font-weight:600;cursor:pointer}.notice-filters>button[aria-pressed=true]{border-color:#4d3740;background:#3b232c;color:#f1c6cd}.notice-filters>button>span{padding:2px 5px;border-radius:4px;background:#10121677;font-size:8px;font-variant-numeric:tabular-nums}.notice-read-all{border:0;background:none;color:#d2b8be;white-space:nowrap;font-size:9px;padding:7px 0;cursor:pointer}.notice-read-all:hover{color:#fff}.notice-read-all:disabled{color:#646d7a;cursor:default}.notification-popover #notification-popover-list{max-height:min(560px,calc(100dvh - var(--header,70px) - 214px));overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#454a55 transparent;padding:0 10px 10px;min-height:90px}.notice-day{color:#747f90;font-size:8px;text-transform:uppercase;font-weight:700;letter-spacing:1.4px;padding:15px 9px 8px}.notification-item{--notice-accent:#98a6bb;--notice-tint:#202733;display:block;margin:0 0 5px;padding:12px 11px;border:1px solid transparent;border-radius:8px;background:transparent;text-decoration:none;transition:background .18s,border-color .18s;overflow:hidden}.notification-item:hover{background:#1d222b;border-color:#3b4350}.notification-item.unread{background:#1d2129;border-color:#323946}.notification-item.notice-giveaway{--notice-accent:#e26c78;--notice-tint:#351c25}.notification-item.notice-market{--notice-accent:#e5af65;--notice-tint:#33281c}.notification-item.notice-leaderboard{--notice-accent:#e2bf5f;--notice-tint:#302a1c}.notification-item.notice-battle{--notice-accent:#6cbdf2;--notice-tint:#1b2a39}.notification-item.notice-news{--notice-accent:#8fb6d7;--notice-tint:#1e2933}.notification-item.notice-system{--notice-accent:#d9a4aa;--notice-tint:#302126}.notification-item.notice-reward{--notice-accent:#bcb096;--notice-tint:#2c2924}.notification-item.notice-featured{border-color:#ffffff12;border-left:3px solid var(--notice-accent);background:linear-gradient(105deg,var(--notice-tint),#181c23)}.notification-item.notice-featured.unread{box-shadow:inset 0 0 30px #ffffff02;border-top-color:#ffffff22;border-right-color:#ffffff22;border-bottom-color:#ffffff22}.notification-item.notice-featured:hover{border-color:var(--notice-accent);background:var(--notice-tint)}.notice-content{min-width:0}.notice-meta{display:flex;align-items:center;gap:7px;min-height:17px;margin-bottom:7px}.notice-category{color:var(--notice-accent);font-size:8px;letter-spacing:.5px;font-weight:700;text-transform:uppercase;line-height:1.4}.notice-meta time{font-size:9px;color:#778497;margin-left:auto;white-space:nowrap;font-variant-numeric:tabular-nums}.notice-new{font-size:7px;letter-spacing:.6px;color:#f0d9dd;background:#752632;border-radius:3px;padding:3px 4px;font-weight:800}.notice-content>strong{display:block;color:#e0e5ee;font-size:12px;line-height:1.5;font-weight:650;overflow-wrap:anywhere}.notification-item.unread .notice-content>strong{color:#fff}.notice-content>p{color:#929eaf;font-size:11px;line-height:1.6;margin:5px 0 0;overflow-wrap:anywhere}.notification-popover .notice-content>p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.notice-action{display:flex;align-items:center;gap:7px;font-size:9px;font-weight:650;color:var(--notice-accent);margin-top:10px}.notice-action>span{margin-left:auto;font-size:14px}.notice-center-link{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 19px;border-top:1px solid #353a45;background:#1a1d23;flex-shrink:0;color:#e4e8ef;text-decoration:none;font-size:11px;font-weight:700}.notice-center-link small{display:block;font-size:9px;font-weight:400;color:#8390a3;margin-top:4px}.notice-center-link>span:last-child{font-size:20px;color:#d26976}.notice-center-link:hover{background:#22242c}.notice-empty-line{height:2px;width:35px;background:#9c2b39;margin:8px}.notification-empty{padding:40px 22px;color:#bec8d8}.notification-empty strong{font-size:13px}.notification-empty p{max-width:240px;line-height:1.7;color:#7d8a9c}.notice-page-panel{overflow:hidden;border-color:#353b46}.notice-page-heading{padding:23px;display:flex;align-items:center;justify-content:space-between;gap:15px;background:linear-gradient(110deg,#2b1d23,#191d24)}.notice-page-heading h3{font-size:22px;letter-spacing:-.5px;margin:6px 0}.notice-page-heading .notice-read-all{font-size:11px;border:1px solid #56404a;border-radius:5px;padding:9px 12px}.notice-page-panel #notification-page-tools{padding:12px 20px;background:#1a1e25;border-block:1px solid #ffffff09}.notice-page-panel .notice-filters button{font-size:11px;padding:8px 13px}.notice-page-panel #notifications-list{padding:0 16px 16px}.notice-page-panel .notification-item{padding:16px 18px;margin-bottom:8px}.notice-page-panel .notice-content>strong{font-size:14px}.notice-page-panel .notice-content>p{font-size:12px}.notice-page-panel .notice-meta{margin-bottom:8px}.notice-page-panel .notice-category{font-size:9px}.notice-page-panel .notice-action{font-size:10px;justify-content:flex-start}.notice-page-panel .notice-action>span{margin-left:5px}.notice-more{width:100%;border:1px solid #363e4b;background:#202630;color:#e0e7f2;padding:13px;border-radius:7px;cursor:pointer;font-size:11px;font-weight:600;margin-top:12px}.notice-more>span{margin-left:8px;font-size:9px;color:#8d9bb0}.notification-page-grid>#preferences{border-color:#353b46;border-radius:12px;overflow:hidden}.notification-page-grid>#preferences .card-heading{background:#1c2027}.notification-page-grid>#preferences .card-icon{display:none}.notification-page-grid>#preferences .preference-row{padding:14px 0}.notification-popover :focus-visible,.notice-page-panel :focus-visible{outline:2px solid #d67482;outline-offset:-3px}@media(max-width:520px){.notification-popover{left:8px;right:8px;max-width:none;width:auto;top:calc(var(--header,64px) + 5px)!important;max-height:calc(100dvh - var(--header,64px) - 14px);border-radius:11px}.notice-popover-heading{padding:16px 15px 13px}.notice-popover-heading h3{font-size:19px}.notice-popover-toolbar{padding:9px 10px;gap:5px}.notice-filters>button{font-size:9px;padding:7px}.notice-read-all{font-size:8px}.notification-popover #notification-popover-list{max-height:none;flex:1;padding:0 8px 8px}.notification-item{padding:11px}.notice-content>strong{font-size:12px}.notice-category{font-size:7px;letter-spacing:.35px}.notice-meta time{font-size:8px}.notice-center-link{padding:12px 15px}.notice-page-heading{padding:18px}.notice-page-heading h3{font-size:20px}.notice-page-heading .notice-read-all{font-size:9px;padding:8px}.notice-page-panel #notifications-list{padding:0 10px 12px}.notice-page-panel .notification-item{padding:13px}.notice-page-panel .notice-content>strong{font-size:13px}.notice-page-panel .notice-content>p{font-size:11px}}@media(prefers-reduced-motion:reduce){.notification-item{transition:none}}
.notice-content>p .community-custom-emoji{display:inline-block;width:24px;height:24px;max-width:none;object-fit:contain;vertical-align:-6px;margin:0 2px}
/* People, shared reaction threads and readable message context. */
.notice-row{display:flex;align-items:flex-start;gap:11px}.notice-row>.notice-content{flex:1;min-width:0}.notice-avatars{display:flex;flex:0 0 34px;flex-direction:column;align-items:center;padding-top:2px}.notice-avatars>.avatar{width:32px;height:32px;flex-shrink:0;font-size:10px}.notice-avatars>.avatar+.avatar{margin-top:-13px;border:2px solid #171a20}.notice-symbol{display:grid;place-items:center;flex:0 0 34px;height:34px;border-radius:9px;background:var(--notice-tint);color:var(--notice-accent);border:1px solid #ffffff0b}.notice-symbol svg{width:16px;height:16px}.notice-content>p.notice-quote{border-left:2px solid #62515b;padding:6px 9px;margin-top:8px;background:#ffffff03;border-radius:0 4px 4px 0}.notice-content>p .community-custom-emoji{width:18px;height:18px;vertical-align:-4px;margin:0 1px}.notice-popover-toolbar{flex-wrap:wrap}.notice-filters{max-width:100%;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#49404a transparent;padding-bottom:3px}.notice-filters>button{flex:0 0 auto;white-space:nowrap}.notice-popover-toolbar .notice-filters{flex:1 1 100%;order:2}.notice-popover-toolbar .notice-read-all{margin-left:auto}.notice-page-panel .notice-avatars>.avatar{width:36px;height:36px}.notice-page-panel .notice-avatars{flex-basis:38px}

.notice-row>.notice-market-preview{flex:0 0 48px;width:48px;height:48px;overflow:hidden;border-color:#b58c493d;border-radius:7px;background:#191a1d}
.notice-market-preview>img{display:block;width:100%;height:100%;object-fit:contain;padding:3px}
.notice-market-preview>svg{display:none}.notice-market-preview.is-failed>svg{display:block}
.notice-page-panel .notice-row>.notice-market-preview{width:58px;height:58px;flex-basis:58px}
@media(max-width:380px){.notice-row>.notice-market-preview{width:42px;height:42px;flex-basis:42px}}

/* Market alerts read like a small product listing, without a duplicate headline. */
.notification-item.notice-market.notice-featured{padding:12px 14px 12px 9px;border-left-width:2px;border-color:#a47d4240;border-left-color:#c59b59;background:#1b1e22;box-shadow:none}
.notification-item.notice-market.notice-featured:hover{background:#21252a;border-color:#ad8b535c;border-left-color:#e4b872}
.notice-market .notice-row{align-items:center;gap:15px}
.notice-market .notice-row>.notice-market-preview{width:64px;height:76px;flex-basis:64px;border:0;border-radius:0;background:none}
.notice-market .notice-market-preview>img{padding:0;object-fit:contain}
.notice-market .notice-meta{margin-bottom:8px;gap:6px}
.notice-market .notice-category{font-size:8px;letter-spacing:.8px;color:#c5a374}
.notice-market .notice-content>strong{font-size:13px;line-height:1.45;font-weight:600;letter-spacing:-.15px;color:#eceef1}
.notice-market .notice-action{font-size:10px;font-weight:550;margin-top:12px;color:#c5a374}
.notice-market .notice-action>span{font-size:15px;color:#dbb87e}
.notice-page-panel .notice-market .notice-row>.notice-market-preview{width:76px;height:84px;flex-basis:76px}
.notice-page-panel .notice-market .notice-content>strong{font-size:15px}
@media(max-width:380px){.notice-market .notice-row{gap:11px}.notice-market .notice-row>.notice-market-preview{width:56px;height:70px;flex-basis:56px}}

/* Personal stream attendance uses the shared notification typography at every viewport. */
.notification-item.notice-stream{padding:12px 11px;border:1px solid #395368;border-left:3px solid #75bdea;border-radius:8px;background:#192026;margin:9px 0;box-shadow:none}
.notification-item.notice-stream:hover{background:#1e2830;border-color:#648ba6;border-left-color:#9cd5fa}
.notice-stream .notice-row{gap:11px;align-items:start}.notice-stream .notice-stream-symbol{width:34px;height:34px;flex:0 0 34px;border:0;background:none;border-radius:0}.notice-stream-symbol img{display:block;width:100%;height:100%;object-fit:contain}
.notice-stream .notice-category{color:#91c4e7}.notice-stream .notice-content>strong{color:#f0f2f5;white-space:normal}.notice-stream .notice-content>.notice-stream-thanks{color:#b7c1ce;display:block;overflow:visible;-webkit-line-clamp:unset;margin:5px 0 10px}
.notice-stream-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;padding:10px 0;border-top:1px solid #3a4651;border-bottom:1px solid #3a4651}
.notice-stream-metrics>span{display:grid;gap:4px;min-width:0}.notice-stream-metrics>span+span{padding-left:14px;border-left:1px solid #3a4651}.notice-stream-metrics small{font:500 11px/1.6 var(--font-body,Inter,Arial,sans-serif);color:#a9b7c7}.notice-stream-metrics strong{font:700 16px/1.4 var(--font-display,Oxanium,Inter,sans-serif);color:#e6f0f7;white-space:normal;overflow-wrap:anywhere}.notice-stream-metrics .notice-stream-xp{color:#e7c991}.notice-stream-metrics em{font:550 9px/1.4 var(--font-body,Inter,sans-serif);font-style:normal}
.notice-stream .notice-action{justify-content:space-between;width:100%;color:#96c9ec}.notice-page-panel .notice-stream{max-width:780px}
.notice-page-panel .notice-stream-metrics small{font-size:12px}
@media(max-width:520px){.notice-page-panel .notice-stream-metrics small{font-size:11px}}
@media(max-width:400px){.notice-stream .notice-row{gap:9px}.notice-stream .notice-stream-symbol{width:28px;height:28px;flex-basis:28px}.notice-stream-metrics>span+span{padding-left:12px}}
