#cdr {
  position: relative;
  max-width: 240px;
  margin: 20px auto;
  padding: 1rem 1.2rem;
  background: rgba(255, 255, 255, 0.28);
  -webkit-backdrop-filter: blur(12px) saturate(180%);
  backdrop-filter: blur(12px) saturate(180%);
  border-radius: 16px;
  overflow: hidden;
  text-align: center;
  font-family: "Times New Roman", serif;
  font-size: 15px;
  color: #00335d;
  box-shadow: 
    0 0 22px rgba(255, 255, 255, 0.7), 
    0 6px 18px rgba(0, 0, 0, 0.3), 
    inset 0 1px 6px rgba(255, 255, 255, 0.6), 
    inset 0 -3px 6px rgba(0, 0, 0, 0.2);
}

#cdr::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 50%;
  border-radius: inherit;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0));
  pointer-events: none;
}

#cdr::after {
  content: "";
  position: absolute;
  inset: -25px;
  border-radius: inherit;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.45) 0%, rgba(255, 255, 255, 0) 70%);
  animation: angelPulse 4s ease-in-out infinite;
  pointer-events: none;
}

#cdr a {
  background: linear-gradient(90deg, #6db8ff 0%, #dff3ff 50%, #fff 100%);
  background-size: 200% 100%;
  -webkit-background-clip: text;
  color: transparent;
  animation: shimmer 3s linear infinite;
}

#aero-ring {
  position: relative;
  max-width: 240px;
  margin: 20px auto;
  padding: 1rem 1.2rem;
  background: rgba(255, 255, 255, 0.28);
  -webkit-backdrop-filter: blur(12px) saturate(180%);
  backdrop-filter: blur(12px) saturate(180%);
  border-radius: 16px;
  overflow: hidden;
  text-align: center;
  font-family: "Times New Roman", serif;
  font-size: 15px;
  color: #00335d;
  box-shadow: 
    0 0 22px rgba(255, 255, 255, 0.7), 
    0 6px 18px rgba(0, 0, 0, 0.3), 
    inset 0 1px 6px rgba(255, 255, 255, 0.6), 
    inset 0 -3px 6px rgba(0, 0, 0, 0.2);
}

#aero-ring::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 50%;
  border-radius: inherit;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0));
  pointer-events: none;
}

#aero-ring::after {
  content: "";
  position: absolute;
  inset: -25px;
  border-radius: inherit;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.45) 0%, rgba(255, 255, 255, 0) 70%);
  animation: angelPulse 4s ease-in-out infinite;
  pointer-events: none;
}

#aero-ring a {
  color: #00335d !important;
  text-decoration: none;
  font-weight: normal;
}

#aero-ring a:hover {
  text-decoration: underline;
}

.webring-box {
  position: relative;
  max-width: 333px;
  margin: 20px auto;
  padding: 0.1rem 0.1rem;
  background: rgba(255, 255, 255, 0.28);
  -webkit-backdrop-filter: blur(12px) saturate(180%);
  backdrop-filter: blur(12px) saturate(180%);
  border-radius: 16px;
  overflow: hidden;
  text-align: center;
  font-family: "Times New Roman", serif;
  font-size: 15px;
  color: #00335d;
  box-shadow: 
    0 0 22px rgba(255, 255, 255, 0.7), 
    0 6px 18px rgba(0, 0, 0, 0.3), 
    inset 0 1px 6px rgba(255, 255, 255, 0.6), 
    inset 0 -3px 6px rgba(0, 0, 0, 0.2);
}

.webring-box::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 50%;
  border-radius: inherit;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0));
  pointer-events: none;
}

.webring-box::after {
  content: "";
  position: absolute;
  inset: -25px;
  border-radius: inherit;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.45) 0%, rgba(255, 255, 255, 0) 70%);
  animation: angelPulse 4s ease-in-out infinite;
  pointer-events: none;
}

.webring-box span {
  font-weight: bold;
  background: linear-gradient(90deg, #003b7d 0%, #4ba3ff 40%, #ffffff 70%, #003b7d 100%);
  background-size: 200% auto;
  color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  animation: shineMove 3.5s linear infinite;
}

.webring-box a {
  color: #00335d !important;
  text-decoration: none;
}

.webring-box a:hover {
  text-decoration: underline;
}

@keyframes angelPulse {
  0%, 100% {
    opacity: 0.55;
    filter: blur(18px);
  }
  50% {
    opacity: 0.95;
    filter: blur(28px);
  }
}

@keyframes shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

@keyframes shineMove {
  0% { background-position: 200% center; }
  100% { background-position: 0% center; }
}