/* ── Converter hero background ── */
.converter-hero {
  background:
    radial-gradient(ellipse 80% 60% at 50% 0%, rgba(161, 229, 255, 0.06) 0%, transparent 70%),
    #16111f;
}

/* ── Ambient orbs ── */
.converter-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  pointer-events: none;
  opacity: 0.35;
}

.converter-orb-1 {
  width: 480px;
  height: 480px;
  background: radial-gradient(circle, #a1e5ff 0%, transparent 70%);
  top: -160px;
  left: -120px;
  animation: orbFloat1 18s ease-in-out infinite;
}

.converter-orb-2 {
  width: 360px;
  height: 360px;
  background: radial-gradient(circle, #5dcdf1 0%, transparent 70%);
  top: -80px;
  right: -100px;
  animation: orbFloat2 14s ease-in-out infinite;
}

@keyframes orbFloat1 {
  0%, 100% { transform: translate(0, 0); }
  33%       { transform: translate(30px, 20px); }
  66%       { transform: translate(-20px, 35px); }
}

@keyframes orbFloat2 {
  0%, 100% { transform: translate(0, 0); }
  50%       { transform: translate(-25px, 25px); }
}

/* ── Drop zone drag-over state ── */
#drop-zone.drag-over {
  border-color: rgba(161, 229, 255, 0.7);
  background-color: rgba(161, 229, 255, 0.05);
}

/* ── Animate spinner inline with button ── */
#btn-loading {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
