/* Інтерактивні кнопки Luna Nails: об'ємний "нігтик" + мазок пензля. */
.nail-button{
  --nail-top:#8e5d5b;
  --nail-bottom:#573836;
  --nail-edge:#3a2524;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  border:0!important;
  border-radius:48% 48% 43% 43% / 72% 72% 52% 52%!important;
  background:linear-gradient(165deg,var(--nail-top) 0%,#a56f6d 21%,var(--nail-bottom) 100%)!important;
  box-shadow:0 9px 0 var(--nail-edge),0 15px 23px rgba(57,35,34,.24),inset 0 2px 1px rgba(255,255,255,.35),inset 0 -6px 10px rgba(44,25,24,.28)!important;
  color:#fff!important;
  text-shadow:0 1px 1px rgba(38,21,20,.28);
  transform:translateY(0) perspective(260px) rotateX(0deg);
  transform-origin:center bottom;
  transition:transform .16s cubic-bezier(.2,.9,.25,1.35),box-shadow .16s ease,filter .2s ease;
  will-change:transform;
}

.nail-button::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:-1px;
  opacity:0;
  clip-path:inset(0 100% 0 0 round 50%);
  background:repeating-linear-gradient(103deg,rgba(255,250,247,.12) 0 5px,rgba(255,238,232,.78) 6px 9px,rgba(255,255,255,.25) 10px 13px,rgba(234,166,162,.18) 14px 18px);
  filter:blur(.15px);
}

.nail-button::after{
  content:"";
  pointer-events:none;
  position:absolute;
  z-index:-1;
  inset:4px 13% auto 13%;
  height:25%;
  border-radius:50%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.48),transparent);
  opacity:.72;
  transform:rotate(-4deg);
}

.nail-button:hover,
.nail-button:focus-visible{
  filter:saturate(1.08) brightness(1.06);
  transform:translateY(-2px) perspective(260px) rotateX(4deg);
  box-shadow:0 11px 0 var(--nail-edge),0 19px 28px rgba(57,35,34,.28),inset 0 2px 1px rgba(255,255,255,.43),inset 0 -6px 10px rgba(44,25,24,.24)!important;
  outline:none;
}

.nail-button:focus-visible{outline:3px solid #f0c7b9;outline-offset:4px}
.nail-button.is-brushed::before{animation:nail-brush .62s cubic-bezier(.2,.82,.25,1) both}
.nail-button.is-pressed,.nail-button:active{
  transform:translateY(7px) scale(.965) perspective(260px) rotateX(-5deg)!important;
  box-shadow:0 2px 0 var(--nail-edge),0 5px 10px rgba(57,35,34,.22),inset 0 5px 11px rgba(42,22,21,.45),inset 0 1px 1px rgba(255,255,255,.22)!important;
  filter:brightness(.9) saturate(.93)!important;
}
.nail-button.has-clicked::after{animation:nail-glint .42s ease-out both}

/* Невеликі круглі нігтики для стрілок галереї. */
.carousel-controls .nail-button{
  width:46px;
  min-width:46px;
  height:46px;
  min-height:46px;
  padding:0;
  border-radius:50%!important;
  font-size:19px;
}

.header-book.nail-button{padding:10px 16px;border-bottom:0!important;min-height:44px}
.crypto-close.nail-button{
  --nail-top:#9a6d68;
  --nail-bottom:#5b3c39;
  --nail-edge:#422b29;
  width:34px;
  min-width:34px;
  height:34px;
  min-height:34px;
  padding:0;
  border-radius:50%!important;
  font-size:18px;
}

/* Кнопки оплати лишаються компактними, але мають ту саму тактильність. */
.crypto-pay.nail-button{margin-top:20px;padding:8px 15px;min-height:38px;font-size:10px;letter-spacing:.45px}
.nowpayments-test.nail-button{padding:8px 14px;min-height:49px;background:linear-gradient(165deg,#b87d78,#6b4542)!important}
.nowpayments-test.nail-button img{position:relative;z-index:1}
.light.nail-button{--nail-top:#faece6;--nail-bottom:#dcb7ae;--nail-edge:#b58d86;color:#382724!important;text-shadow:none}

@keyframes nail-brush{
  0%{opacity:0;clip-path:inset(0 100% 0 0 round 50%)}
  18%{opacity:1}
  100%{opacity:.28;clip-path:inset(0 0 0 0 round 50%)}
}
@keyframes nail-glint{
  0%{opacity:.18;transform:translateX(-130%) rotate(-4deg)}
  100%{opacity:0;transform:translateX(130%) rotate(-4deg)}
}
@media (prefers-reduced-motion:reduce){
  .nail-button{transition:none!important}
  .nail-button::before,.nail-button::after{animation:none!important}
}