/* NEW-order alarm: the top New tab flashes until every NEW order is accepted/cancelled. */
.tab-btn[data-tab="new"].new-order-alarm{
  color:#fff!important;
  border-color:transparent!important;
  box-shadow:0 0 0 3px rgba(255,74,74,.12),0 7px 20px rgba(234,67,53,.26)!important;
  animation:lordNewOrderFlash 1.15s steps(1,end) infinite!important;
  transform-origin:center;
}
.tab-btn[data-tab="new"].new-order-alarm .ref-count{
  background:#fff!important;
  color:#20242a!important;
  font-weight:950!important;
  animation:lordNewCountPulse .58s ease-in-out infinite alternate!important;
}

@keyframes lordNewOrderFlash{
  0%,100%{background:#e53935!important;transform:scale(1)}
  20%{background:#ff8f00!important;transform:scale(1.035)}
  40%{background:#f6c400!important;color:#1c232b!important;transform:scale(1)}
  60%{background:#22a06b!important;color:#fff!important;transform:scale(1.035)}
  80%{background:#4169e1!important;color:#fff!important;transform:scale(1)}
}
@keyframes lordNewCountPulse{
  from{transform:scale(1);box-shadow:0 0 0 0 rgba(255,255,255,.3)}
  to{transform:scale(1.18);box-shadow:0 0 0 5px rgba(255,255,255,.18)}
}

/* Keep a visible warning even if reduced-motion is enabled, but avoid rapid motion. */
@media(prefers-reduced-motion:reduce){
  .tab-btn[data-tab="new"].new-order-alarm{animation:lordNewOrderFlashReduced 2.4s steps(1,end) infinite!important}
  .tab-btn[data-tab="new"].new-order-alarm .ref-count{animation:none!important}
}
@keyframes lordNewOrderFlashReduced{
  0%,49%{background:#e53935!important;color:#fff!important}
  50%,100%{background:#f6c400!important;color:#1c232b!important}
}