.notification-shell{min-height:100vh;overflow:hidden;background:radial-gradient(circle at 78% 10%,rgba(56,217,245,.13),transparent 30rem),#071013}.notification-content{position:relative;z-index:1;width:min(100% - 40px,900px);margin:auto;padding:72px 0 110px}.notification-header{margin-bottom:34px}.notification-header h1{margin:10px 0;font-size:clamp(54px,10vw,96px);letter-spacing:-.07em}.notification-header>p:last-child{color:#91a2a6;line-height:1.6}.notification-tabs{display:grid;grid-template-columns:repeat(3,1fr);margin-bottom:24px;border:1px solid rgba(123,244,207,.18)}.notification-tabs a{padding:15px;text-align:center;color:#91a2a6;font-size:12px;font-weight:900;letter-spacing:.09em}.notification-tabs a+a{border-left:1px solid rgba(123,244,207,.18)}.notification-tabs a.active{background:#7bf4cf;color:#071013}.notification-list{display:grid;gap:10px}.notification-item{display:block;padding:23px;border:1px solid rgba(123,244,207,.16);background:linear-gradient(145deg,#0d191c,#081114);transition:.18s}.notification-item:hover{transform:translateY(-2px);border-color:#7bf4cf}.notification-item.official{border-left:4px solid #7bf4cf}.notification-item.community{border-left:4px solid #77c8ff}.notification-meta{display:flex;justify-content:space-between;gap:15px;color:#607377;font:10px monospace;letter-spacing:.08em}.notification-item.official .notification-meta span{color:#7bf4cf}.notification-item.community .notification-meta span{color:#77c8ff}.notification-item h2{margin:13px 0 3px;font-size:24px}.notification-item small{color:#91a2a6}.notification-item p{margin:14px 0 0;color:#c0d1d2;line-height:1.65}.notification-empty{padding:40px;border:1px dashed rgba(123,244,207,.2);text-align:center}.notification-empty strong,.notification-empty span{display:block}.notification-empty span{margin-top:8px;color:#91a2a6}.follow-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:18px}.follow-bar>strong{color:#b8c8ca;font-size:13px}.follow-button{padding:10px 16px;border:1px solid #7bf4cf;background:#7bf4cf;color:#071013;font-size:11px;font-weight:900;letter-spacing:.08em;cursor:pointer}.follow-button.following{background:rgba(123,244,207,.09);color:#7bf4cf}.follow-button:disabled{opacity:.55}@media(max-width:600px){.notification-content{padding-top:50px}.notification-meta{flex-direction:column;gap:5px}}
.notification-item.opening{pointer-events:none;opacity:.55;transform:translateX(8px)}
.notification-item{position:relative}.notification-item.unread{border-color:rgba(123,244,207,.36);box-shadow:inset 0 0 22px rgba(123,244,207,.035)}.notification-item.unread::after{content:"NEW";position:absolute;right:18px;bottom:16px;padding:4px 7px;border:1px solid rgba(123,244,207,.38);color:#7bf4cf;font:900 9px monospace;letter-spacing:.08em}.notification-item.read{opacity:.82}.notification-item.read:hover{opacity:1}
/* Phase 5 */
.notification-tabs{grid-template-columns:repeat(4,1fr)}
.notification-settings{padding:28px;border:1px solid rgba(123,244,207,.18);background:linear-gradient(145deg,#0d191c,#081114)}
.notification-settings h2{margin-top:0;font-size:32px}.notification-settings>p{color:#91a2a6}
.notification-settings form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:24px}
.notification-settings label{display:flex;align-items:center;gap:12px;padding:14px;border:1px solid rgba(123,244,207,.13);background:#071013}
.notification-settings .auth-button{grid-column:1/-1}@media(max-width:620px){.notification-tabs{grid-template-columns:repeat(2,1fr)}.notification-settings form{grid-template-columns:1fr}}