DataScope26/WEB

1.extension-alert {2  position: fixed;3  top: 6rem;4  right: 1.125rem;5  z-index: 50;6  pointer-events: auto;7}8 9.extension-alert__content {10  display: flex;11  align-items: center;12  gap: 0.5rem;13  padding: 0.5rem 0.625rem 0.5rem 0.75rem;14  border-radius: 0.75rem;15  background: linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 100%);16  box-shadow: 0 0.625rem 1.25rem rgba(0, 0, 0, 0.18);17  color: white;18}19 20.extension-alert__main {21  display: flex;22  align-items: center;23  gap: 0.5rem;24}25 26.extension-alert__badge {27  font-size: 0.6875rem;28  font-weight: 700;29  letter-spacing: 0.04em;30  text-transform: uppercase;31  white-space: nowrap;32}33 34.extension-alert__link {35  display: inline-flex;36  align-items: center;37  justify-content: center;38  padding: 0.3125rem 0.625rem;39  border-radius: 62.4375rem;40  background: rgba(255, 255, 255, 0.18);41  border: 0.0625rem solid rgba(255, 255, 255, 0.35);42  color: white;43  text-decoration: none;44  font-size: 0.6875rem;45  font-weight: 700;46  line-height: 1;47  transition: opacity 0.2s ease, transform 0.2s ease;48}49 50.extension-alert__link:hover {51  opacity: 0.9;52  transform: translateY(-0.0625rem);53}54 55.extension-alert__close {56  background: transparent;57  border: none;58  color: white;59  font-size: 1.125rem;60  line-height: 1;61  cursor: pointer;62  padding: 0;63  width: 1.125rem;64  height: 1.125rem;65  display: flex;66  align-items: center;67  justify-content: center;68  opacity: 0.9;69}70 71@media (max-width: 48rem) {72  .extension-alert {73    top: 5.625rem;74    right: 0.75rem;75  }76 77  .extension-alert__content {78    padding: 0.4375rem 0.5625rem 0.4375rem 0.625rem;79  }80 81  .extension-alert__badge {82    font-size: 0.625rem;83  }84 85  .extension-alert__link {86    padding: 0.25rem 0.5rem;87    font-size: 0.625rem;88  }89}90