.notification-button{position:relative;width:40px;height:40px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:rgba(255,255,255,.045);color:#f5f5f5;cursor:pointer;transition:background .18s ease,border-color .18s ease,transform .18s ease}.notification-button:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.28);transform:translateY(-1px)}.notification-button svg{width:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.notification-badge{position:absolute;top:-5px;right:-5px;min-width:18px;height:18px;padding:0 4px;display:grid;place-items:center;border:2px solid #090a0c;border-radius:99px;background:#fff;color:#050505;font:700 10px/1 system-ui}.notification-backdrop{position:fixed;inset:0;z-index:990;background:rgba(0,0,0,.48);backdrop-filter:blur(3px)}.notification-backdrop[hidden]{display:none}.notification-panel{position:fixed;z-index:991;top:0;right:0;width:min(460px,100vw);height:100dvh;display:flex;flex-direction:column;color:#f5f5f5;background:linear-gradient(145deg,rgba(28,29,32,.97),rgba(9,10,12,.94));border-left:1px solid rgba(255,255,255,.16);box-shadow:-24px 0 80px rgba(0,0,0,.55);backdrop-filter:blur(26px) saturate(120%);transform:translateX(102%);visibility:hidden;transition:transform .3s cubic-bezier(.2,.75,.2,1),visibility .3s}.notification-panel.open{transform:translateX(0);visibility:visible}.notification-panel-head{display:flex;align-items:center;justify-content:space-between;padding:28px 28px 20px;border-bottom:1px solid rgba(255,255,255,.1)}.notification-panel-head small{letter-spacing:.16em;color:#999;font-size:10px}.notification-panel-head h2{margin:4px 0 0;font-size:24px}.notification-close{width:38px;height:38px;border:1px solid rgba(255,255,255,.13);border-radius:11px;background:rgba(255,255,255,.04);color:#ddd;font-size:24px;cursor:pointer}.notification-tabs{display:flex;gap:5px;padding:14px 18px 0;overflow-x:auto;border-bottom:1px solid rgba(255,255,255,.08)}.notification-tabs button{flex:0 0 auto;padding:10px 11px;border:0;border-bottom:2px solid transparent;background:transparent;color:#8f9298;font:600 12px system-ui;cursor:pointer}.notification-tabs button.active{color:#fff;border-bottom-color:#fff}.notification-content{flex:1;overflow:auto;padding:20px 22px 40px}.notification-list{display:grid;gap:12px}.notification-item{padding:17px;border:1px solid rgba(255,255,255,.1);border-radius:15px;background:rgba(255,255,255,.035)}.notification-item h3{margin:11px 0 7px;font-size:15px}.notification-item p{margin:0;color:#bdc0c5;line-height:1.75;white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px}.notification-item-top{display:flex;align-items:center;justify-content:space-between;gap:12px}.notification-item time{color:#777;font-size:10px}.notification-type{padding:4px 7px;border:1px solid rgba(255,255,255,.13);border-radius:6px;color:#ddd;font-size:10px}.notification-type.alert,.notification-type.open{background:#fff;color:#080808}.notification-type.resolved{color:#999}.notification-item.resolved{opacity:.62}.notification-item .notification-meta{margin-top:12px;color:#777;font-size:11px}.notification-text-button{margin-top:12px;padding:0;border:0;background:none;color:#eee;text-decoration:underline;text-underline-offset:3px;font-size:11px;cursor:pointer}.notification-lead{margin:0 0 18px;color:#a8abb1;font-size:13px;line-height:1.7}.notification-form{display:grid;gap:16px}.notification-field{display:grid;gap:7px}.notification-field span{color:#a6a8ad;font-size:11px;font-weight:700}.notification-field input,.notification-field textarea,.notification-field select{width:100%;box-sizing:border-box;padding:12px 13px;border:1px solid rgba(255,255,255,.13);border-radius:10px;outline:none;background:rgba(0,0,0,.3);color:#f5f5f5;font:13px/1.6 system-ui;resize:vertical}.notification-field input:focus,.notification-field textarea:focus,.notification-field select:focus{border-color:rgba(255,255,255,.5);box-shadow:0 0 0 3px rgba(255,255,255,.06)}.notification-field select option{background:#17181b}.notification-submit{padding:13px;border:1px solid #fff;border-radius:10px;background:#fff;color:#080808;font-weight:800;cursor:pointer}.notification-submit:disabled{opacity:.55}.notification-feedback{padding:11px 12px;border-radius:9px;background:#e9e9e9;color:#111;font-size:12px}.notification-feedback.error{background:#4b2329;color:#ffdce1}.notification-empty{margin-top:60px;text-align:center;color:#777;font-size:13px}@media(max-width:680px){.account #username{display:none}.notification-panel-head{padding:22px 20px 16px}.notification-content{padding:18px 16px 32px}}
