.notification-region{position:fixed;z-index:2147483647;inset:auto 20px 20px auto;width:min(390px,calc(100vw - 32px));height:auto;margin:0;padding:0;border:0;background:transparent;overflow:visible;pointer-events:none}
.bki-notification{--notice-color:#199a50;--notice-soft:#eaf8ef;position:relative;display:grid;grid-template-columns:42px minmax(0,1fr) 30px;gap:12px;align-items:center;overflow:hidden;padding:14px 12px 14px 14px;border:1px solid color-mix(in srgb,var(--notice-color) 24%,#fff);border-radius:14px;background:rgba(255,255,255,.97);color:#18304c;box-shadow:0 18px 48px rgba(20,48,34,.16);pointer-events:auto;transform:translate3d(calc(100% + 32px),0,0);opacity:0;transition:transform .42s cubic-bezier(.22,.9,.3,1),opacity .28s ease;backdrop-filter:blur(14px)}
.bki-notification.is-visible{transform:translate3d(0,0,0);opacity:1}.bki-notification.is-leaving{transform:translate3d(18px,0,0);opacity:0}.bki-notification--error{--notice-color:#c5404f;--notice-soft:#fff0f2}.bki-notification--info{--notice-color:#3271c8;--notice-soft:#edf5ff}
.notification-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--notice-soft);color:var(--notice-color);font-size:19px;font-weight:900}.notification-copy{min-width:0}.notification-title{display:block;margin-bottom:2px;color:#172b46;font-size:13px;font-weight:850}.notification-text{margin:0;color:#667891;font-size:12px;line-height:1.45;overflow-wrap:anywhere}.notification-close{display:grid;place-items:center;width:30px;height:30px;padding:0;border:0;border-radius:8px;background:transparent;color:#8190a3;font-size:20px;line-height:1}.notification-close:hover{background:var(--notice-soft);color:var(--notice-color)}
.notification-progress{position:absolute;right:0;bottom:0;left:0;height:3px;background:var(--notice-soft)}.notification-progress::after{content:"";display:block;width:100%;height:100%;background:var(--notice-color);transform-origin:left;animation:bki-notification-progress var(--notice-duration,4s) linear forwards}@keyframes bki-notification-progress{to{transform:scaleX(0)}}
@media (max-width:560px){.notification-region{right:16px;bottom:12px;left:16px;width:auto}.bki-notification{grid-template-columns:38px minmax(0,1fr) 28px;padding:12px}.notification-icon{width:38px;height:38px}}@media (prefers-reduced-motion:reduce){.bki-notification{transition:opacity .15s ease;transform:none}.notification-progress::after{animation:none}}
