*{box-sizing:border-box}
html,body{
  margin:0;
  width:100%;
  height:100%;
  overflow:hidden;
  background:transparent;
  font-family:Inter,Arial,sans-serif
}
body{display:grid;place-items:center}

.v32-overlay{
  position:relative;
  width:100%;
  height:100%;
  min-height:180px;
  overflow:hidden;
  display:grid;
  grid-template-columns:120px minmax(0,1fr) 130px;
  gap:14px;
  align-items:center;
  padding:15px 17px;
  border:1px solid #ff0a687e;
  border-radius:18px;
  background:
    radial-gradient(circle at 88% 48%,#ff0a6828 0,transparent 31%),
    radial-gradient(circle at 8% 18%,#ffffff0c 0,transparent 25%),
    linear-gradient(135deg,#11131af5,#07080df5 58%,#16060ff4);
  box-shadow:
    0 0 42px #ff0a6838,
    inset 0 0 0 1px #ffffff09,
    inset 0 -24px 60px #0006;
  color:#fff;
  backdrop-filter:blur(13px)
}

.v32-overlay::before{
  content:"";
  position:absolute;
  inset:0;
  opacity:.28;
  background-image:
    linear-gradient(90deg,transparent 0 49%,#ffffff06 50%,transparent 51%),
    linear-gradient(transparent 0 49%,#ffffff04 50%,transparent 51%);
  background-size:44px 44px;
  mask-image:linear-gradient(90deg,#000,transparent 72%);
  pointer-events:none
}

.v32-accent{
  position:absolute;
  z-index:2;
  left:0;
  height:2px;
  background:linear-gradient(90deg,transparent,#ff0a68 18%,#ff8abc 55%,transparent 92%);
  box-shadow:0 0 14px #ff0a68
}
.v32-accent.top{top:0;width:72%}
.v32-accent.bottom{right:0;left:auto;bottom:0;width:56%;transform:scaleX(-1)}

.v32-energy{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.v32-energy i{
  position:absolute;
  width:4px;
  height:4px;
  border-radius:50%;
  background:#ff83b6;
  box-shadow:0 0 12px #ff0a68;
  opacity:.18;
  animation:v32Particle 5.8s ease-in-out infinite
}
.v32-energy i:nth-child(1){left:12%;top:76%;animation-delay:-.3s}
.v32-energy i:nth-child(2){left:27%;top:22%;animation-delay:-1.1s}
.v32-energy i:nth-child(3){left:52%;top:82%;animation-delay:-2.4s}
.v32-energy i:nth-child(4){left:68%;top:24%;animation-delay:-3.2s}
.v32-energy i:nth-child(5){left:82%;top:67%;animation-delay:-4.4s}
.v32-energy i:nth-child(6){left:93%;top:17%;animation-delay:-5.1s}
@keyframes v32Particle{
  0%,100%{transform:translateY(15px) scale(.6);opacity:.08}
  50%{transform:translateY(-28px) scale(1.4);opacity:.62}
}

.v32-logo{
  position:relative;
  z-index:3;
  display:grid;
  place-items:center;
  height:100%
}
.v32-logo::after{
  content:"";
  position:absolute;
  width:90px;
  height:90px;
  border-radius:50%;
  background:radial-gradient(circle,#ff0a6831,transparent 68%);
  filter:blur(8px)
}
.v32-logo img{
  position:relative;
  z-index:2;
  width:108px;
  max-height:142px;
  object-fit:contain;
  filter:drop-shadow(0 0 16px #ff0a6872)
}

.v32-copy{position:relative;z-index:3;min-width:0}
.v32-kicker{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
  color:#ff6fa9;
  font-size:9px;
  letter-spacing:1.25px;
  font-weight:900
}
.v32-kicker em{
  min-width:0;
  overflow:hidden;
  color:#aab0ba;
  font-style:normal;
  white-space:nowrap;
  text-overflow:ellipsis
}
.v32-live-dot{
  width:7px;
  height:7px;
  flex:0 0 auto;
  border-radius:50%;
  background:#ff0a68;
  box-shadow:0 0 12px #ff0a68;
  animation:v32Live 1.6s ease-in-out infinite
}
@keyframes v32Live{
  0%,100%{opacity:.4;transform:scale(.8)}
  50%{opacity:1;transform:scale(1.2)}
}

.v32-copy h1{
  margin:5px 0 2px;
  overflow:hidden;
  color:#fff;
  font-size:clamp(22px,5vw,31px);
  line-height:1;
  white-space:nowrap;
  text-overflow:ellipsis;
  text-shadow:0 0 16px #ff0a6848
}
.v32-copy p{
  margin:0;
  overflow:hidden;
  color:#adb3bd;
  font-size:12px;
  white-space:nowrap;
  text-overflow:ellipsis
}
.v32-badges{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:9px
}
.v32-badges span{
  padding:5px 8px;
  border:1px solid #ff0a6848;
  border-radius:999px;
  background:#1b0710cc;
  color:#ff8abb;
  font-size:9px;
  font-weight:900;
  box-shadow:inset 0 0 10px #ff0a680e
}

.v32-preview{
  position:relative;
  z-index:3;
  height:118px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:1px solid #ff0a6852;
  border-radius:13px;
  background:
    radial-gradient(circle,#350a20,#07080d 72%);
  box-shadow:
    0 0 20px #ff0a6824,
    inset 0 0 24px #000b
}
.v32-preview-ring{
  position:absolute;
  width:100px;
  height:100px;
  border:1px solid #ff0a6848;
  border-radius:50%;
  animation:v32Ring 8s linear infinite
}
.v32-preview-ring::before,.v32-preview-ring::after{
  content:"";
  position:absolute;
  width:6px;
  height:6px;
  border-radius:50%;
  background:#ff5a9f;
  box-shadow:0 0 10px #ff0a68
}
.v32-preview-ring::before{top:7px;left:17px}
.v32-preview-ring::after{right:8px;bottom:20px}
@keyframes v32Ring{to{transform:rotate(360deg)}}
.v32-preview img{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:top;
  filter:contrast(1.05) brightness(.98)
}
.v32-preview>span{
  position:relative;
  z-index:2;
  color:#ff5a9f;
  font-size:36px;
  font-weight:900;
  text-shadow:0 0 18px #ff0a68
}

.v32-change-banner{
  position:absolute;
  z-index:20;
  inset:0;
  display:grid;
  place-content:center;
  text-align:center;
  background:
    radial-gradient(circle,#4c0a27 0,#12060df3 62%,#050609f7 100%);
  backdrop-filter:blur(10px)
}
.v32-change-banner[hidden]{display:none}
.v32-change-banner span{
  color:#ff7caf;
  font-size:11px;
  letter-spacing:2px;
  font-weight:900
}
.v32-change-banner strong{
  margin-top:5px;
  color:#fff;
  font-size:28px;
  text-shadow:0 0 22px #ff0a68
}
.v32-overlay.build-change .v32-change-banner{
  animation:v32Change 2.6s ease both
}
@keyframes v32Change{
  0%{opacity:0;transform:scale(.96)}
  13%,72%{opacity:1;transform:scale(1)}
  100%{opacity:0;transform:scale(1.03)}
}

.v32-overlay.updated .v32-copy,
.v32-overlay.updated .v32-preview{
  animation:v32Update .45s ease
}
@keyframes v32Update{
  0%{opacity:.45;transform:translateY(5px)}
  100%{opacity:1;transform:translateY(0)}
}

@media(max-width:430px){
  .v32-overlay{
    grid-template-columns:84px minmax(0,1fr) 92px;
    gap:9px;
    padding:10px
  }
  .v32-logo img{width:78px}
  .v32-preview{height:92px}
  .v32-copy h1{font-size:20px}
  .v32-copy p{font-size:10px}
}