.notifications-page{max-width:980px;margin:0 auto;padding:36px 30px 80px;color:var(--t)}
.notifications-page [hidden]{display:none!important}
.notifications-page h1{font:800 28px/1.2 var(--disp);letter-spacing:-.025em;margin:0 0 10px}
.notifications-page h2{font:700 15px/1.4 var(--disp);margin:0}
.notifications-page p{margin:0;line-height:1.6}
.notifications-heading{display:flex;align-items:center;justify-content:space-between;gap:24px}
.notifications-heading p{font-size:13px;color:var(--t2)}
.notifications-page button,.notifications-page .notification-link{min-height:44px;border:1px solid var(--line);border-radius:9px;padding:10px 15px;background:var(--bg);color:var(--t);font:700 12px/1.4 var(--disp);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:7px}
.notifications-page .notification-primary{background:#ff6810;border-color:#ff6810;color:#111519}
.notifications-page button:disabled{opacity:.5;cursor:default}
.notifications-page button:not(:disabled):active{transform:translateY(1px)}
.notifications-page button:not(:disabled):hover{border-color:var(--t3)}
.notifications-page :focus-visible{outline:2px solid #ff6810;outline-offset:3px}
.notifications-page .notification-status{min-height:24px;margin:16px 0 12px;color:var(--t2);font-size:12px}
.notification-status[data-error=true],.notification-error{color:var(--red,#d44c3c)!important}
.notification-list-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:0 0 13px;border-bottom:1px solid var(--line)}
.notification-list-heading h2{font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:var(--t2)}
.notification-list-heading>span{font-size:12px;color:var(--t3);font-variant-numeric:tabular-nums}
.notification-row{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:20px;padding:27px 0;border-bottom:1px solid var(--line);align-items:start}
.notification-number{font:600 12px/1.5 ui-monospace,monospace;color:var(--t3);padding-top:3px}
.notification-row h3{font:750 17px/1.4 var(--disp);margin:0 0 8px}
.notification-row .notification-description{font-size:14px;color:var(--t);margin-bottom:6px}
.notification-row .notification-description strong{font-weight:800;font-variant-numeric:tabular-nums}
.notification-book-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 24px;max-width:420px;margin:14px 0}
.notification-book-pair dt{font-size:11px;color:var(--t3);margin-bottom:4px}
.notification-book-pair dd{font-size:13px;font-weight:650;margin:0;overflow-wrap:anywhere}
.notification-meta,.notification-help{font-size:12px;color:var(--t2)}
.notification-row .notification-blocked{font-size:12px;color:var(--red,#d44c3c);margin-top:8px}
.notification-actions{display:flex;flex-wrap:wrap;gap:8px}
.notification-row .notification-delete{background:transparent;color:var(--t3);border-color:transparent}
.notification-empty{padding:42px 18px 40px;text-align:center;border-bottom:1px solid var(--line)}
.notification-empty svg{width:36px;height:36px;color:var(--t3);margin-bottom:14px}
.notification-empty h3{font:700 18px var(--disp);margin:0 0 9px}
.notification-empty p{font-size:13px;color:var(--t2);max-width:420px;margin:0 auto 18px}
.notification-skeleton{height:110px;margin:16px 0;background:var(--line);opacity:.4;border-radius:10px}
.notification-delivery{margin-top:32px;padding:22px;display:grid;grid-template-columns:25px minmax(0,1fr) auto;gap:17px;align-items:start;background:var(--bg2,var(--bg));border:1px solid var(--line);border-radius:12px}
.notification-delivery>svg{width:24px;height:28px;color:var(--t3)}
.notification-delivery h2{margin-bottom:9px}
.notification-delivery h2 span{display:inline-block;margin-left:9px;color:var(--t3);font-size:11px;font-weight:500}
.notification-delivery p+p{margin-top:5px}
.notification-delivery>button{align-self:center}
.notification-editor{padding:24px;background:var(--bg2,var(--bg));border:1px solid var(--line);border-radius:12px;margin-bottom:30px}
.notification-editor-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}
.notification-editor-heading>span{color:var(--t3);font-size:11px}
.notification-editor form{display:grid;gap:19px;max-width:680px}
.notification-editor label{display:grid;gap:8px;font-size:12px;color:var(--t2);min-width:0}
.notification-editor input,.notification-editor select{min-height:46px;width:100%;min-width:0;padding:11px 12px;background:var(--bg);color:var(--t);border:1px solid var(--line);border-radius:8px;font:500 14px var(--disp)}
.notification-fields{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.notification-error{font-size:12px}
@media(max-width:650px){
 .notifications-page{padding:25px 18px 60px}
 .notifications-heading{align-items:flex-start;flex-direction:column;gap:18px}
 .notifications-page h1{font-size:25px}
 .notification-row{grid-template-columns:25px minmax(0,1fr);gap:12px;padding:23px 0}
 .notification-row .notification-actions{grid-column:2}
 .notification-delivery{grid-template-columns:23px minmax(0,1fr);padding:18px;gap:13px}
 .notification-delivery>button{grid-column:2;justify-self:start}
 .notification-delivery h2 span{display:block;margin:4px 0 0}
 .notification-editor{padding:18px}
 .notification-editor-heading{align-items:flex-start;flex-direction:column;gap:4px}
 .notification-fields{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.notifications-page button:active{transform:none!important}}
