:root{color:#eef0f6;font-synthesis:none;background:#111216;font-family:Inter,ui-sans-serif,system-ui,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at 50% -20%,#2e303a,#111216 46rem);min-width:320px;margin:0}button{font:inherit}.page{width:min(720px,100% - 32px);margin:auto;padding:64px 0 48px}header{justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:28px;display:flex}.overline{color:#9fa3af;letter-spacing:.1em;text-transform:uppercase;margin:0 0 8px;font-size:11px;font-weight:700}h1{letter-spacing:-.045em;margin:0;font-size:clamp(30px,5vw,40px);line-height:1}.subtitle{color:#aeb1bc;margin:10px 0 0;font-size:14px}.connection-status{color:#aeb1bc;white-space:nowrap;flex:none;align-items:center;gap:7px;font-size:12px;display:inline-flex}.connection-status i{background:#7f8592;border-radius:50%;width:7px;height:7px}.connection-status.connected{color:#a8d8bd}.connection-status.connected i{background:#54c279}.connection-status.offline{color:#d4a4a4}.connection-status.offline i{background:#dc6a6a}.header-actions{justify-items:end;gap:8px;display:grid}button.logout{color:#aeb1bc;background:0 0;border:0;padding:0;font-size:12px}button.logout:hover{color:#f0f1f5;background:0 0}.list,.skeleton{gap:12px;display:grid}.notification-card,.empty-state,.error-state{background:#1e1f24ed;border:1px solid #30323a;border-radius:13px;overflow:hidden;box-shadow:0 10px 25px #00000021}.notification-card:hover{border-color:#4a4d57}.card-summary{width:100%;color:inherit;text-align:left;cursor:pointer;background:0 0;border:0;gap:14px;padding:18px 20px;display:grid}.card-summary:focus-visible,button:focus-visible{outline-offset:-2px;outline:2px solid #8eb9ff}.card-title{justify-content:space-between;align-items:baseline;gap:16px;display:flex}.card-title strong{overflow-wrap:anywhere;font-size:16px}time,.package-name{color:#a2a5b0;font-size:13px}time{font-variant-numeric:tabular-nums;white-space:nowrap}.card-text{overflow-wrap:anywhere;white-space:pre-wrap;color:#e0e2e8;font-size:15px;line-height:1.5}.package-name{overflow-wrap:anywhere}.details{border-top:1px solid #373941;padding:17px 20px 20px}dl{margin:0}dl>div{border-bottom:1px solid #30323a;grid-template-columns:126px minmax(0,1fr);gap:16px;padding:8px 0;font-size:13px;line-height:1.45;display:grid}dt,.raw>span{color:#9ea2ae}dd{overflow-wrap:anywhere;white-space:pre-wrap;margin:0}.raw{padding-top:16px;font-size:13px}pre{color:#c7d8ff;overflow-wrap:anywhere;white-space:pre-wrap;background:#15161a;border-radius:9px;max-height:360px;margin:8px 0 0;padding:14px;font:12px/1.5 ui-monospace,monospace;overflow:auto}.empty-state,.error-state{text-align:center;padding:42px 28px}.empty-state h2{margin:0;font-size:18px}.empty-state p,.error-state p{color:#b0b3bf;margin:9px 0 0;font-size:14px;line-height:1.5}.error-state{text-align:left;border-color:#68474b;justify-content:space-between;align-items:center;gap:20px;display:flex}.error-state.compact{margin-bottom:12px;padding:14px 16px}.error-state.compact p{margin-top:3px}button:not(.card-summary){color:#f3f4f7;cursor:pointer;background:#2a2c33;border:1px solid #4b4e58;border-radius:9px;padding:9px 13px}button:not(.card-summary):hover{background:#353740}button:disabled{cursor:wait;opacity:.65}.load-more{justify-content:center;padding:22px 0 0;display:flex}.skeleton>div{background:#1e1f24;border:1px solid #30323a;border-radius:13px;gap:16px;padding:20px;display:grid}.skeleton i{background:linear-gradient(100deg,#292b31,#3a3d46,#292b31) 0 0/200% 100%;border-radius:10px;width:76%;height:12px;animation:1.2s linear infinite shimmer;display:block}.skeleton i:first-child{width:45%}.skeleton i:last-child{width:30%}@keyframes shimmer{to{background-position-x:-200%}}.login-page{place-items:center;min-height:100vh;padding:24px;display:grid}.login-card{background:#1e1f24;border:1px solid #34363f;border-radius:14px;width:min(100%,390px);padding:30px;box-shadow:0 18px 40px #0003}.login-card h1{margin-bottom:12px}.login-card>p:not(.overline){color:#afb2bd;margin:0 0 24px;font-size:14px;line-height:1.5}.login-card label{color:#c7c9d1;gap:7px;font-size:13px;display:grid}.login-card input{color:#f2f3f6;background:#15161a;border:1px solid #4a4d58;border-radius:9px;width:100%;padding:11px}.login-card button{width:100%;margin-top:18px}.login-error{color:#f0a4a4;margin-top:12px;font-size:13px}@media (width<=560px){.page{width:calc(100% - 24px);padding-top:36px}header{flex-direction:column;align-items:flex-start;gap:14px}.card-summary,.details{padding-left:16px;padding-right:16px}dl>div{grid-template-columns:1fr;gap:3px}.error-state{flex-direction:column;align-items:flex-start;padding:22px 20px}}