/* Telefon raqami barabani (slot.js). O'lcham --ps-size bilan beriladi: jonli sahifada katta, panelda kichikroq. */
.phone-slot {
  --ps-size: clamp(2rem, 7.4vw, 6.6rem);
  display: inline-flex; flex-wrap: nowrap; justify-content: center; align-items: center; gap: .26em;
  font: italic 800 var(--ps-size)/1 "Barlow Condensed", "Arial Narrow", sans-serif; font-variant-numeric: tabular-nums;
  max-width: 100%;
}
.ps-fixed {
  color: #fff; padding: 0 .12em; letter-spacing: .02em; line-height: 1.18;
  border-bottom: .07em solid #f6b91c;
}
.ps-group { display: inline-flex; gap: .07em; }
.ps-d {
  position: relative; display: inline-grid; place-items: center; width: .82em; height: 1.18em; overflow: hidden;
  background: linear-gradient(180deg, #0a1638 0%, #1a3270 48%, #0a1638 52%, #12265f 100%);
  border: .03em solid rgba(255, 255, 255, .22); border-radius: .1em; color: #fff;
  box-shadow: inset 0 .08em .14em rgba(0, 0, 0, .55), 0 .04em 0 rgba(0, 0, 0, .35);
}
.ps-d::after { /* barabanning o'rtadagi chizig'i */
  content: ""; position: absolute; left: 0; right: 0; top: 50%; height: .02em; background: rgba(0, 0, 0, .45);
}
.ps-ink { display: block; transform: skewX(-6deg); }
.phone-slot.spinning .ps-d:not(.settled) .ps-ink { animation: ps-roll .11s linear infinite; filter: blur(.012em); opacity: .9; }
@keyframes ps-roll { from { transform: translateY(-38%) skewX(-6deg); } to { transform: translateY(38%) skewX(-6deg); } }
.ps-d.settled {
  background: linear-gradient(180deg, #ffe07a, #f6b91c); color: #2a1c00; border-color: #ffe07a;
  animation: ps-land .42s cubic-bezier(.2, 1.6, .4, 1) both; box-shadow: 0 0 .35em rgba(246, 185, 28, .55);
}
.ps-d.masked { background: linear-gradient(180deg, #d8262c, #a5161b); color: #fff; border-color: #ff6b6b; box-shadow: 0 0 .3em rgba(216, 38, 44, .5); }
@keyframes ps-land { 0% { transform: translateY(-30%) scale(1.25); } 100% { transform: none; } }
.phone-slot.tense .ps-d:not(.settled) { border-color: #ffe07a; animation: ps-beat .5s ease-in-out infinite; }
@keyframes ps-beat { 50% { transform: scale(1.08); } }
.phone-slot.done { animation: ps-glow 1.4s ease-out; }
@keyframes ps-glow { 0% { filter: drop-shadow(0 0 0 rgba(246, 185, 28, 0)); } 30% { filter: drop-shadow(0 0 .4em rgba(246, 185, 28, .9)); } 100% { filter: none; } }
@media (prefers-reduced-motion: reduce) {
  .phone-slot *, .phone-slot { animation: none !important; }
}