/* Кодовый замок регистрации DoubleThink. Механика, материал дисков и размеры —
   точная копия рабочего замка AirAppro (sealed
   20260819-airappro-surface-auth-entry-lock-v121). Диск крутится протягиванием
   с любой своей точки, включая шевроны; строка ошибки живёт вне потока, поэтому
   под кнопкой нет пустого поля. */

[data-registration-gate-root] [data-auth-pane-stack],
[data-registration-gate-root] [data-auth-status] {
  position: relative;
}

[data-registration-gate-main] {
  display: none;
  min-width: 0;
}

[data-registration-gate-root][data-auth-mode="register"][data-registration-gate-state]:not([data-registration-gate-state="open"]):not([data-registration-gate-state="unlocked"]) [data-registration-gate-form-owner],
[data-registration-gate-root][data-auth-mode="register"][data-registration-gate-state]:not([data-registration-gate-state="open"]):not([data-registration-gate-state="unlocked"]) [data-registration-gate-legal-owner] {
  display: none;
  visibility: hidden;
  pointer-events: none;
}

[data-registration-gate-root][data-auth-mode="register"][data-registration-gate-state]:not([data-registration-gate-state="open"]):not([data-registration-gate-state="unlocked"]) [data-registration-gate-main] {
  position: relative;
  z-index: 2;
  display: grid;
  min-width: 0;
  place-items: start stretch;
  color: #fff8e5;
  background: rgba(17, 21, 31, 0.99);
}

[data-registration-gate-root][data-auth-geometry-ready="true"][data-auth-mode="register"][data-registration-gate-state]:not([data-registration-gate-state="open"]):not([data-registration-gate-state="unlocked"]) [data-registration-gate-main] {
  position: absolute;
  top: 0;
  right: 0;
  bottom: auto;
  left: 0;
}

.registration-code-gate__panel {
  position: relative;
  display: grid;
  inline-size: min(100%, 420px);
  min-width: 0;
  justify-items: center;
  justify-self: center;
  gap: 8px;
  padding: 4px 4px 0;
  margin-inline: auto;
  text-align: center;
}

.registration-code-gate__eyebrow,
.registration-code-gate__copy,
.registration-code-gate__feedback {
  margin: 0;
}

.registration-code-gate__eyebrow {
  color: var(--entry-gold);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.registration-code-gate__copy,
.registration-code-gate__feedback {
  font-size: 12px;
  line-height: 1.25;
}

.registration-code-gate__copy {
  color: #d8d1c5;
}

/* Строка состояния лежит вне потока, в уже существующем отступе под кнопкой:
   её появление не меняет высоту панели и не создаёт пустое поле под замком. */
.registration-code-gate__feedback {
  position: absolute;
  inset-inline: 0;
  top: 100%;
  max-height: 15px;
  margin-top: 4px;
  overflow: hidden;
  color: var(--entry-danger);
  white-space: nowrap;
  text-overflow: ellipsis;
}

.registration-code-gate__mechanism {
  display: grid;
  inline-size: min(100%, 276px);
  min-width: 0;
}

.registration-code-gate__wheels {
  display: grid;
  grid-template-columns: repeat(4, minmax(36px, 1fr));
  gap: 5px;
  min-width: 0;
}

.registration-code-gate__wheel {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 2px;
  padding: 3px;
  border: 1px solid rgba(241, 208, 113, 0.38);
  border-radius: 10px;
  background: linear-gradient(180deg, #4a3a1a, #c79a3f 30%, #8a6a2f 70%, #4a3a1a);
  touch-action: pinch-zoom;
}

.registration-code-gate__wheel[data-registration-gate-selected] {
  border-color: #fff2af;
  box-shadow: 0 0 0 1px rgba(255, 242, 175, 0.36);
}

.registration-code-gate__digit,
.registration-code-gate__step {
  box-sizing: border-box;
  min-width: 0;
  border: 0;
  color: inherit;
  font: inherit;
}

.registration-code-gate__digit {
  width: 100%;
  min-height: 44px;
  padding: 0;
  border-radius: 9px;
  outline: 0;
  background: rgba(4, 5, 8, 0.48);
  color: #eae6da;
  font-size: 27px;
  font-variant-numeric: tabular-nums;
  font-weight: 900;
  text-align: center;
  text-shadow: 0 0 5px rgba(234, 230, 218, 0.28);
}

.registration-code-gate__step {
  flex: 0 0 20px;
  width: 100%;
  min-height: 20px;
  padding: 0;
  border-radius: 9px;
  background: transparent;
  color: rgba(35, 26, 10, 0.65);
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  transition: color 100ms ease, transform 100ms ease;
}

.registration-code-gate__step:hover {
  color: rgba(35, 26, 10, 0.95);
}

.registration-code-gate__step:active {
  transform: scale(0.85);
}

.registration-code-gate__handle {
  box-sizing: border-box;
  width: min(100%, 276px);
  min-height: 48px;
  justify-self: center;
  border: 1px solid rgba(241, 208, 113, 0.5);
  border-radius: 999px;
  background: linear-gradient(
    180deg,
    var(--entry-gate-gradient-start),
    var(--entry-gate-gradient-mid) 55%,
    var(--entry-gate-gradient-end)
  );
  color: var(--entry-gate-label);
  cursor: pointer;
  font: inherit;
  font-weight: 900;
  animation: registration-gate-gold-pulse 3800ms ease-in-out infinite;
}

.registration-code-gate__step:focus-visible,
.registration-code-gate__digit:focus-visible {
  outline: 2px solid var(--entry-gate-focus);
  outline-offset: -2px;
}

.registration-code-gate__handle:focus-visible {
  outline: 2px solid var(--entry-gate-focus);
  outline-offset: 2px;
}

.registration-code-gate__handle:disabled,
.registration-code-gate__digit:disabled,
.registration-code-gate__step:disabled {
  cursor: progress;
}

[data-registration-gate-root][data-registration-gate-state="checking"] .registration-code-gate__handle:disabled,
[data-registration-gate-root][data-registration-gate-state="checking"] .registration-code-gate__digit:disabled,
[data-registration-gate-root][data-registration-gate-state="checking"] .registration-code-gate__step:disabled,
[data-registration-gate-root][data-registration-gate-state="closed"] .registration-code-gate__handle:disabled,
[data-registration-gate-root][data-registration-gate-state="closed"] .registration-code-gate__digit:disabled,
[data-registration-gate-root][data-registration-gate-state="closed"] .registration-code-gate__step:disabled {
  opacity: 0.62;
}

[data-registration-gate-root][data-auth-mode="register"][data-registration-gate-state="unlocking"] [data-registration-gate-main] {
  animation: registration-gate-yield 180ms ease-out both;
}

/* Замок гаснет за 180ms, а форма под ним должна ПРОЯВИТЬСЯ той же самой
   ступенью, что и смена вкладок: без этого правила форма просто возникала,
   потому что её `aria-hidden` не менялся — она всё это время была скрыта
   только гейтом. */
[data-registration-gate-root][data-auth-mode="register"][data-registration-gate-state="unlocked"] [data-registration-gate-form-owner],
[data-registration-gate-root][data-auth-mode="register"][data-registration-gate-state="unlocked"] [data-registration-gate-legal-owner] {
  animation: auth-pane-reveal 180ms var(--entry-motion-ease) both;
}

@keyframes registration-gate-yield {
  to { opacity: 0; transform: scale(.97); }
}

@keyframes registration-gate-gold-pulse {
  0% { box-shadow: -4px 3px 15px -4px rgba(241, 208, 113, 0.32); }
  50% { box-shadow: 4px 3px 15px -4px rgba(241, 208, 113, 0.48); }
  100% { box-shadow: -4px 3px 15px -4px rgba(241, 208, 113, 0.32); }
}

@media (max-width: 360px) {
  .registration-code-gate__wheels {
    grid-template-columns: repeat(4, minmax(34px, 1fr));
    gap: 4px;
  }
}

@media (prefers-reduced-motion: reduce) {
  [data-registration-gate-root][data-auth-mode="register"][data-registration-gate-state="unlocking"] [data-registration-gate-main] {
    animation: none;
  }

  .registration-code-gate__handle {
    animation: none;
  }

  .registration-code-gate__step {
    transition: none;
  }

  [data-registration-gate-root][data-auth-mode="register"][data-registration-gate-state="unlocked"] [data-registration-gate-form-owner],
  [data-registration-gate-root][data-auth-mode="register"][data-registration-gate-state="unlocked"] [data-registration-gate-legal-owner] {
    animation: none;
  }
}

@media (forced-colors: active) {
  .registration-code-gate__wheel,
  .registration-code-gate__handle {
    border: 1px solid CanvasText;
  }
}
