.notification-inbox{margin:0;background:#f7f4f4;color:#292326;font:13px/1.5 Poppins,Arial,sans-serif}.notification-inbox *{box-sizing:border-box}.inbox-shell{width:100%;max-width:430px;min-height:100dvh;margin:auto;background:#f7f4f4}.notification-inbox header{display:grid;grid-template-columns:32px 1fr 32px;align-items:center;min-height:64px;padding:12px 16px;background:#fff;border-bottom:1px solid #ead7d9}.notification-inbox h1{font:600 16px/1.4 Poppins,Arial,sans-serif;text-align:center;color:#4f171b;margin:0}.notification-inbox a{color:#4f171b;text-decoration:none}.notification-inbox .back-btn{font-size:28px;line-height:1}.notification-inbox main{padding:16px 14px 24px}.inbox-count{background:#4f171b;color:#fff;border-radius:20px;text-align:center;font-size:11px;padding:3px}.inbox-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:14px}.notification-inbox button{font:500 11px/1.4 Poppins,Arial,sans-serif;border:1px solid #e8d9da;background:#fff;color:#4f171b;padding:8px 10px;border-radius:8px;cursor:pointer}.notification-inbox button:disabled{opacity:.45;cursor:default}.notification-inbox button.selected{background:#4f171b;color:white}.inbox-toolbar>div{display:flex;gap:5px}#inbox-items{list-style:none;margin:0;padding:0;display:grid;gap:10px}.inbox-card{position:relative;display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;padding:12px;background:#fff;border:1px solid #ead7d9;border-radius:12px;overflow-wrap:anywhere}.inbox-card.unread{border-left:3px solid #3866df;background:#fdfcff}.inbox-card .inbox-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#f0ecec;color:#4f171b}.inbox-card h2{font-size:12px!important;line-height:1.45;margin:2px 0 5px;font-weight:600;color:#4f171b}.inbox-card p{font-size:12px;line-height:1.6;margin:0 0 8px;color:#51494b}.inbox-card time{font-size:10px;color:#80767a}.inbox-card .inbox-meta{display:flex;gap:8px;justify-content:space-between;align-items:center;flex-wrap:wrap}.inbox-card button{border:0;padding:2px 0;font-size:10px;color:#3866df}.inbox-card .inbox-link{display:inline-block;font-size:11px;margin-top:6px;color:#3866df}.inbox-types{margin-top:22px;padding-top:12px;border-top:1px solid #e7dddd;font-size:11px;color:#77666a}.inbox-types summary{cursor:pointer;color:#4f171b;font-weight:600}.inbox-types ul{padding-left:18px;columns:2;column-gap:20px}.inbox-types li{break-inside:avoid;margin:7px 0}.inbox-bottom{display:flex;justify-content:space-around;background:#fff;border-top:1px solid #ead7d9;padding:15px 10px calc(15px + env(safe-area-inset-bottom));font-size:12px}#inbox-status{font-size:12px;padding:20px 4px;color:#716468;text-align:center}#inbox-status:empty{display:none}#load-more{display:block;margin:16px auto}#load-more[hidden]{display:none}.notification-inbox :focus-visible{outline:2px solid #3866df;outline-offset:3px}
.notification-inbox main{padding-bottom:calc(84px + env(safe-area-inset-bottom))}.notification-inbox .inbox-bottom{position:fixed;bottom:0;left:50%;transform:translateX(-50%);z-index:20;width:100%;max-width:430px;min-height:60px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:space-between;background:#fff;border-top:1px solid #ead7d9}.notification-inbox .inbox-bottom a{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;color:#4f171b}.notification-inbox .inbox-bottom i{display:block;font-size:20px;line-height:1}.notification-inbox .inbox-bottom a.active{background:#4f171b;color:#fff}
.inbox-swipe-hint{font-size:10px;color:#80767a;margin:0 0 12px;text-align:center}.inbox-card{touch-action:pan-y;transition:transform .16s ease,opacity .16s ease}.inbox-card.swiping{transition:none;user-select:none}.notification-inbox .inbox-card button.inbox-dismiss{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:8px 12px;border:1px solid #b8152b;border-radius:7px;background:#b8152b;color:#fff;font-size:11px;font-weight:600;line-height:1.4;white-space:nowrap}.notification-inbox .inbox-card button.inbox-dismiss:hover{background:#961025;border-color:#961025}.notification-inbox .inbox-card button.inbox-dismiss:active{transform:scale(.97)}.notification-inbox main{overflow-x:hidden}@media(prefers-reduced-motion:reduce){.inbox-card{transition:none}}
