.cn-notice-stack{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:10040;
  display:flex;
  width:min(430px,calc(100vw - 36px));
  max-height:min(70vh,620px);
  flex-direction:column;
  gap:10px;
  overflow-y:auto;
  overscroll-behavior:contain;
  pointer-events:none;
  transition:bottom .18s ease;
}

body.cn-status-visible .cn-notice-stack{
  bottom:88px;
}

#appStatus.cn-notice-enhanced,
.cn-notice-stack .cnx-notice{
  display:flex;
  align-items:flex-start;
  gap:12px;
  width:auto;
  min-width:260px;
  max-width:min(430px,calc(100vw - 36px));
  box-sizing:border-box;
  padding:13px 12px 13px 15px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:10px;
  background:#073b70;
  color:#fff;
  box-shadow:0 10px 30px rgba(7,31,54,.25);
  font-size:13px;
  font-weight:700;
  line-height:1.4;
  pointer-events:auto;
}

#appStatus.cn-notice-enhanced{
  z-index:10050;
  right:18px;
  bottom:18px;
}

#appStatus.cn-notice-enhanced:not(.show){
  pointer-events:none;
}

#appStatus.cn-notice-enhanced.error,
.cn-notice-stack .cnx-notice.error{
  border-color:rgba(255,255,255,.2);
  background:#a72c37;
}

.cn-notice-stack .cnx-notice{
  position:relative;
  right:auto;
  bottom:auto;
  flex:none;
  min-width:0;
  max-width:none;
  margin:0;
  opacity:1;
  transform:none;
  transition:opacity .18s ease,transform .18s ease;
}

.cn-notice-stack .cnx-notice.cn-notice-leaving{
  opacity:0;
  transform:translateY(6px);
}

.cn-notice-message{
  min-width:0;
  flex:1 1 auto;
  overflow-wrap:anywhere;
  white-space:normal;
}

.cn-notice-close{
  display:grid;
  width:27px;
  height:27px;
  flex:0 0 27px;
  place-items:center;
  margin:-5px -4px -5px 0;
  padding:0;
  border:0;
  border-radius:7px;
  background:rgba(255,255,255,.14);
  color:#fff;
  font:700 20px/1 Arial,sans-serif;
  cursor:pointer;
}

.cn-notice-close:hover,
.cn-notice-close:focus-visible{
  outline:0;
  background:rgba(255,255,255,.25);
}

@media(max-width:700px){
  .cn-notice-stack{
    right:10px;
    bottom:calc(88px + env(safe-area-inset-bottom));
    left:10px;
    width:auto;
    max-height:48vh;
  }

  body.cn-status-visible .cn-notice-stack{
    bottom:calc(158px + env(safe-area-inset-bottom));
  }

  #appStatus.cn-notice-enhanced{
    right:10px;
    bottom:calc(88px + env(safe-area-inset-bottom));
    left:10px;
    min-width:0;
    max-width:none;
  }

  .cn-notice-stack .cnx-notice{
    width:100%;
  }
}

@media(prefers-reduced-motion:reduce){
  .cn-notice-stack,
  .cn-notice-stack .cnx-notice{
    transition:none;
  }
}