.inbox-page{display:grid;gap:22px;max-width:1180px;margin:0 auto;padding-top:38px}
.inbox-page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:28px}
.inbox-page-head h1{margin-bottom:8px;font-size:44px}
.inbox-page-head p:last-child{max-width:650px;margin:0;color:var(--muted);font-size:15px}
.inbox-head-actions{display:flex;align-items:center;gap:12px}
.inbox-unread-summary{display:grid;min-width:154px;padding:10px 14px;border:1px solid #d7e4fa;border-radius:13px;background:#f7faff}
.inbox-unread-summary strong{color:#175cd3;font-size:21px;line-height:1}
.inbox-unread-summary span{margin-top:4px;color:#526681;font-size:11px;font-weight:700}
.inbox-mark-all{min-height:43px;padding:0 16px;border:1px solid var(--line-strong);border-radius:11px;background:#fff;cursor:pointer;font-size:12px;font-weight:780}
.inbox-mark-all:hover:not(:disabled){border-color:#98a2b3;background:var(--soft)}
.inbox-mark-all:disabled{cursor:not-allowed;opacity:.5}
.inbox-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:9px;border:1px solid var(--line);border-radius:15px;background:#fff;box-shadow:0 2px 9px rgba(23,32,51,.035)}
.inbox-filter-tabs,.inbox-category-tabs{display:flex;align-items:center;gap:5px}
.inbox-filter-tabs button,.inbox-category-tabs button{display:inline-flex;min-height:36px;align-items:center;gap:7px;padding:7px 11px;border:0;border-radius:9px;background:transparent;color:#536071;cursor:pointer;font-size:12px;font-weight:750}
.inbox-filter-tabs button span,.inbox-category-tabs button span{display:grid;min-width:21px;height:20px;place-items:center;padding:0 6px;border-radius:999px;background:#eef1f5;color:#5d6878;font-size:10px}
.inbox-filter-tabs button:hover,.inbox-category-tabs button:hover{background:var(--soft);color:var(--ink)}
.inbox-filter-tabs button.active{background:#172033;color:#fff}
.inbox-filter-tabs button.active span{background:rgba(255,255,255,.18);color:#fff}
.inbox-category-tabs button.active{background:#eef5ff;color:#175cd3}
.inbox-category-tabs button.active span{background:#dbeafe;color:#175cd3}
.inbox-error{margin:0;padding:11px 14px;border:1px solid #f0c3c3;border-radius:11px;background:var(--danger-soft);color:var(--danger);font-size:12px;font-weight:720}
.inbox-loading{display:flex;align-items:center;gap:10px;padding:14px;color:var(--muted);font-size:12px;font-weight:700}
.inbox-loading:before{width:16px;height:16px;border:2px solid #d0d5dd;border-top-color:var(--accent);border-radius:50%;content:"";animation:inbox-spin .8s linear infinite}
@keyframes inbox-spin{to{transform:rotate(360deg)}}
.inbox-feed{display:grid;gap:24px}
.inbox-day-group{display:grid;gap:9px}
.inbox-day-group>header{display:flex;align-items:center;justify-content:space-between;padding:0 5px}
.inbox-day-group>header h2{margin:0;color:#344054;font-size:12px;font-weight:820;letter-spacing:.02em}
.inbox-day-group>header span{color:#98a2b3;font-size:10px;font-weight:700}
.inbox-day-list{overflow:hidden;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 3px 12px rgba(23,32,51,.045)}
.inbox-notification{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:13px;min-height:112px;padding:17px 17px 17px 19px;border-bottom:1px solid #edf0f3;background:#fff;transition:background 120ms ease}
.inbox-notification:last-child{border-bottom:0}
.inbox-notification.unread{background:linear-gradient(90deg,#f3f8ff 0,#fff 38%)}
.inbox-notification.unread:before{position:absolute;top:20px;left:7px;width:5px;height:5px;border-radius:50%;background:#2e73da;content:""}
.inbox-notification:hover{background:#fafbfc}
.inbox-notification.unread:hover{background:linear-gradient(90deg,#eef5ff 0,#fafbfc 42%)}
.inbox-notification-identity{position:relative;width:44px;height:44px}
.inbox-notification-avatar{display:grid;width:42px;height:42px;overflow:hidden;place-items:center;border:1px solid #e1e6ed;border-radius:13px;background:#eef2f6;color:#526681;font-size:11px;font-weight:850}
.inbox-notification-avatar img{width:100%;height:100%;object-fit:cover}
.inbox-notification-avatar.system svg{width:20px;height:20px}
.inbox-source-icon{position:absolute;right:-3px;bottom:-4px;display:grid;width:20px;height:20px;place-items:center;border:2px solid #fff;border-radius:7px;background:#eef5ff;color:#175cd3}
.inbox-source-icon svg{width:12px;height:12px}
.inbox-source-icon.requests{background:#fff7e5;color:#b26c00}
.inbox-source-icon.tasks{background:#ecf8f2;color:#27845d}
.inbox-source-icon.system{background:#f2f4f7;color:#667085}
.inbox-notification-link{display:grid;min-width:0;align-content:start;text-decoration:none}
.inbox-notification-meta{display:flex;align-items:center;gap:9px;margin-bottom:4px}
.inbox-notification-meta strong{color:#667085;font-size:10px;font-weight:820;letter-spacing:.045em;text-transform:uppercase}
.inbox-notification-meta time{color:#98a2b3;font-size:10px;font-weight:650}
.inbox-notification-title{color:#172033;font-size:14px;font-weight:800;line-height:1.35}
.inbox-notification-body{display:-webkit-box;max-width:830px;margin-top:4px;overflow:hidden;color:#596579;font-size:12px;line-height:1.45;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.inbox-notification-action{display:inline-flex;align-items:center;gap:5px;margin-top:9px;color:#175cd3;font-size:11px;font-weight:780}
.inbox-notification-action span{transition:transform 120ms ease}
.inbox-notification-link:hover .inbox-notification-action span{transform:translateX(2px)}
.inbox-read-toggle{display:inline-flex;min-width:96px;height:34px;align-items:center;justify-content:center;gap:6px;align-self:center;padding:0 10px;border:1px solid #d7dce3;border-radius:9px;background:#fff;color:#536071;cursor:pointer;font-size:10px;font-weight:780}
.inbox-read-toggle:hover:not(:disabled){border-color:#b5bdc9;background:#f8fafc;color:#172033}
.inbox-read-toggle:disabled{cursor:wait;opacity:.55}
.inbox-unread-dot{width:7px;height:7px;border-radius:50%;background:#2e73da}
.inbox-empty{display:grid;min-height:330px;place-items:center;align-content:center;padding:50px 20px;border:1px dashed #d7dce3;border-radius:17px;background:#fff;text-align:center}
.inbox-empty>span{display:grid;width:48px;height:48px;place-items:center;margin-bottom:13px;border-radius:15px;background:#eaf7f0;color:#27845d;font-size:20px;font-weight:900}
.inbox-empty h2{margin:0 0 6px;font-size:20px}
.inbox-empty p{max-width:430px;margin:0;color:var(--muted);font-size:13px}
.inbox-pagination{display:flex;align-items:center;justify-content:flex-end;gap:10px}
.inbox-pagination span{color:var(--muted);font-size:11px;font-weight:700}
.inbox-pagination button{min-height:35px;padding:0 12px;border:1px solid var(--line);border-radius:9px;background:#fff;cursor:pointer;font-size:11px;font-weight:750}
.inbox-pagination button:disabled{cursor:not-allowed;opacity:.45}
@media(max-width:900px){
  .inbox-page-head{align-items:flex-start;flex-direction:column}
  .inbox-head-actions{width:100%;justify-content:space-between}
  .inbox-toolbar{align-items:stretch;flex-direction:column}
  .inbox-category-tabs{overflow-x:auto;padding-bottom:2px}
}
@media(max-width:640px){
  .inbox-page{padding-top:26px}
  .inbox-page-head h1{font-size:38px}
  .inbox-head-actions{align-items:stretch;flex-direction:column}
  .inbox-unread-summary{width:100%}
  .inbox-mark-all{width:100%}
  .inbox-filter-tabs button,.inbox-category-tabs button{white-space:nowrap}
  .inbox-notification{grid-template-columns:42px minmax(0,1fr);padding:15px 14px}
  .inbox-notification-identity{width:39px;height:39px}
  .inbox-notification-avatar{width:38px;height:38px;border-radius:11px}
  .inbox-read-toggle{grid-column:2;width:max-content;min-width:0;margin-top:1px}
}