.notifications-page{margin:0 auto;max-width:800px;padding:24px 16px}.notif-header{align-items:center;display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;margin-bottom:24px}.notif-header h1{color:#1a1a1a;font-size:24px;font-weight:700;margin:0}.notif-list{background:rgba(0,0,0,.06);border-radius:2px;display:flex;flex-direction:column;gap:1px;overflow:hidden}.notif-item{background:#fff;display:flex;gap:12px;padding:16px;position:relative}.notif-item:hover{background:rgba(0,0,0,.02)}.notif-item.is-unread{background:rgba(232,111,45,.04)}.notif-item.is-unread:before{background:var(--accent-color);border-radius:0 2px 2px 0;bottom:0;content:"";left:0;position:absolute;top:0;width:3px}.notif-icon{align-items:center;background:rgba(0,0,0,.06);border-radius:50%;color:#666;display:flex;flex-shrink:0;height:40px;justify-content:center;width:40px}.notif-icon svg{height:20px;width:20px}.notif-content{flex:1;min-width:0}.notif-body{color:#1a1a1a;font-size:14px;line-height:1.5;margin-bottom:4px}.notif-body-detail,.notif-meta{color:#666;font-size:13px;margin-top:6px}.notif-body strong{font-weight:700}.notif-body-detail{line-height:1.6}.notif-body-detail ul{margin:6px 0 0;padding-left:18px}.notif-body-detail ul li{margin-bottom:3px}.notif-meta{align-items:center;display:flex;flex-wrap:wrap;gap:8px}.notif-guest-cta{background:rgba(232,111,45,.06);border-radius:2px;margin-top:24px;padding:24px 16px;text-align:center}.notif-guest-cta-title{color:#1a1a1a;font-size:16px;font-weight:600;margin-bottom:8px}.notif-guest-cta-text{color:#666;font-size:14px;margin-bottom:16px}.notif-guest-cta-btn{background:var(--accent-color,#e86f2d);border-radius:2px;color:#fff;display:inline-block;font-size:14px;font-weight:600;padding:10px 28px;text-decoration:none;transition:opacity .15s}.notif-guest-cta-btn:hover{opacity:.85}body.dark .notif-body,body.dark .notif-guest-cta-title,body.dark .notif-header h1{color:#fff}body.dark .notif-item{background:hsla(0,0%,100%,.04)}body.dark .notif-item:hover{background:hsla(0,0%,100%,.08)}body.dark .notif-item.is-unread{background:rgba(232,111,45,.08)}body.dark .notif-body-detail,body.dark .notif-meta{color:hsla(0,0%,100%,.5)}body.dark .notif-guest-cta{background:rgba(232,111,45,.12)}body.dark .notif-guest-cta-text{color:hsla(0,0%,100%,.6)}@media (max-width:640px){.notifications-page{padding:16px 12px}.notif-header h1{font-size:20px}.notif-item{padding:12px}}