#notification{position:fixed;bottom:22px;left:20px;z-index:99999;display:flex;align-items:center;gap:13px;max-width:calc(100vw - 40px);padding:14px 19px 16px 14px;overflow:hidden;border:1px solid #415039;border-radius:14px;background:linear-gradient(110deg,#202c20,#0d130f 80%);color:#edf4e9;font:600 14px/1.45 "Segoe UI",sans-serif;box-shadow:0 10px 30px #0006;opacity:0;transform:translateY(10px);transition:opacity .25s,transform .25s;pointer-events:none}
#notification::before{content:"";flex:0 0 32px;height:32px;background:url("/icon.svg") center/contain no-repeat}
#notification.show{opacity:1;transform:none}
#notification.show::after{content:"";position:absolute;bottom:0;left:0;width:100%;height:2px;background:#adff66;transform-origin:left;animation:notice-time 5s linear forwards}
@keyframes notice-time{to{transform:scaleX(0)}}
@media(max-width:760px){#notification{bottom:calc(72px + env(safe-area-inset-bottom));left:14px;max-width:calc(100vw - 28px)}}
@media(prefers-reduced-motion:reduce){#notification{transition:none}#notification.show::after{animation:none}}