/* Мастер регистрации: одно окно на все страницы.

   Отдельный файл, а не продолжение core.css: core весит 72 КБ и грузится
   на десяти страницах, а эти правила нужны только пока окно открыто.

   Цвета по дому: мята — состояние «хорошо» (галочки, график, знак),
   синий — действие (те же кнопки, что и «Получить доступ» в шапке). */

/* ─────────────────── наложение ─────────────────── */

.aw {
  position: fixed; inset: 0; z-index: 140;
  display: grid; place-items: center;
  padding: 24px;
  /* Свой фон, а не просвечивающий сайт: за формой регистрации не должно
     читаться содержимое главной — оно спорит с карточкой. */
  background:
    radial-gradient(900px 520px at 24% 18%, rgba(63, 196, 137, 0.10), transparent 70%),
    radial-gradient(760px 480px at 82% 78%, rgba(63, 196, 137, 0.06), transparent 72%),
    #050607;
  overflow-y: auto;
  animation: awFade 0.2s ease both;
}
/* Та же сетка, что на сайте: окно выглядит частью платформы, а не вырезкой. */
.aw::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.028) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(ellipse 120% 100% at 50% 0%, #000 35%, transparent 92%);
  -webkit-mask-image: radial-gradient(ellipse 120% 100% at 50% 0%, #000 35%, transparent 92%);
}
.aw[hidden] { display: none; }
@keyframes awFade { from { opacity: 0; } to { opacity: 1; } }

/* Пока окно открыто, страница под ним не прокручивается. */
body.aw-open { overflow: hidden; }

.aw__inner {
  position: relative; z-index: 1;
  width: 100%; max-width: 1060px;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 468px);
  gap: 48px; align-items: center;
  animation: awRise 0.26s cubic-bezier(0.22, 0.61, 0.36, 1) both;
}
@keyframes awRise {
  from { opacity: 0; transform: translateY(12px) scale(0.985); }
  to { opacity: 1; transform: none; }
}

/* Узкая карточка для шагов «готово» — без левой колонки. */
.aw__inner.is-narrow { max-width: 520px; grid-template-columns: minmax(0, 1fr); }
.aw__inner.is-narrow .awPromo { display: none; }

.aw__close {
  position: absolute; top: -6px; right: -6px; z-index: 2;
  width: 44px; height: 44px; padding: 0;
  display: grid; place-items: center;
  border: 1px solid var(--line); border-radius: var(--r-pill);
  background: var(--surface-2); color: var(--text-2);
  cursor: pointer;
  transition: background 0.16s ease, color 0.16s ease, transform 0.16s ease;
}
.aw__close:hover { background: var(--surface-3); color: var(--text); transform: scale(1.06); }
.aw__close svg { width: 17px; height: 17px; }

/* ─────────────────── левая колонка ─────────────────── */

.awPromo { min-width: 0; }
.awPromo__eyebrow {
  display: flex; align-items: center; gap: 12px;
  font-size: 12px; font-weight: 800; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--text-3);
}
.awPromo__eyebrow::before {
  content: ""; width: 26px; height: 1.5px; flex: none;
  background: var(--mint); border-radius: 2px;
}
.awPromo__title {
  margin: 18px 0 0; font-size: clamp(26px, 3vw, 34px); font-weight: 800;
  letter-spacing: -0.035em; line-height: 1.15; color: var(--text);
}

.awPromo__foot {
  display: flex; align-items: flex-start; gap: 14px;
  margin-top: 26px; padding-top: 22px;
  border-top: 1px solid var(--line-soft);
}
.awPromo__lock {
  width: 38px; height: 38px; flex: none;
  display: grid; place-items: center;
  border-radius: var(--r-small);
  background: var(--surface-2); color: var(--text-3);
}
.awPromo__lock svg { width: 17px; height: 17px; }
.awPromo__footT { display: block; font-size: 15px; font-weight: 700; color: var(--text); }
.awPromo__footN { display: block; margin-top: 3px; font-size: 13.5px; line-height: 1.5; color: var(--text-3); }

/* ─────────────────── график ─────────────────── */

.awChart {
  margin-top: 26px; padding: 18px;
  border: 1px solid var(--line); border-radius: var(--r-card);
  background:
    radial-gradient(420px 200px at 70% 0%, rgba(85, 223, 160, 0.09), transparent 70%),
    var(--surface);
}
.awChart svg { width: 100%; height: auto; display: block; }

.awChart__grid line { stroke: rgba(255, 255, 255, 0.05); stroke-width: 1; stroke-dasharray: 3 7; }

/* pathLength="1" убирает измерение длины из JS: одна черта = весь путь,
   поэтому сдвиг с 1 до 0 и есть полная прорисовка. */
.awChart__line {
  stroke-dasharray: 1; stroke-dashoffset: 1;
  animation: awcDraw 1.25s cubic-bezier(0.22, 0.61, 0.36, 1) 0.15s forwards;
}
@keyframes awcDraw { to { stroke-dashoffset: 0; } }

.awChart__area {
  opacity: 0; transform-box: fill-box; transform-origin: 50% 100%; transform: scaleY(0.6);
  animation: awcRise 0.9s cubic-bezier(0.22, 0.61, 0.36, 1) 0.55s forwards;
}
@keyframes awcRise { to { opacity: 1; transform: none; } }

.awChart__dot {
  opacity: 0; transform-box: fill-box; transform-origin: 50% 50%; transform: scale(0.4);
  animation: awcDot 0.38s cubic-bezier(0.22, 0.61, 0.36, 1) 1.35s forwards;
}
@keyframes awcDot { to { opacity: 1; transform: none; } }

/* Блик идёт по той же повадке, что heroSheen на главной: долгая пауза,
   быстрый проход. Чаще — начинает мельтешить. */
.awChart__sheen { animation: awcSheen 5.5s ease-in-out 1.9s infinite; }
@keyframes awcSheen {
  0%, 62% { transform: translateX(0); opacity: 0; }
  68% { opacity: 1; }
  92%, 100% { transform: translateX(760px); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .aw, .aw__inner { animation: none; }
  .awChart__line { stroke-dashoffset: 0; animation: none; }
  .awChart__area, .awChart__dot { opacity: 1; transform: none; animation: none; }
  .awChart__sheen { animation: none; opacity: 0; }
}

/* ─────────────────── карточка ─────────────────── */

.awCard {
  min-width: 0; padding: 30px;
  border: 1px solid var(--line); border-radius: var(--r-card);
  background:
    radial-gradient(500px 220px at 80% 0%, rgba(63, 196, 137, 0.07), transparent 70%),
    var(--surface);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5);
}

/* шагомер */
.awSteps { display: flex; align-items: center; gap: 10px; margin-bottom: 24px; }
.awSteps__i { display: flex; align-items: center; gap: 9px; flex: none; }
.awSteps__n {
  width: 28px; height: 28px; flex: none;
  display: grid; place-items: center;
  border: 1.6px solid var(--line); border-radius: var(--r-pill);
  font-size: 12.5px; font-weight: 700; color: var(--text-4);
  transition: border-color 0.2s ease, color 0.2s ease, background 0.2s ease;
}
.awSteps__t {
  font-size: 14px; font-weight: 700; color: var(--text-4); white-space: nowrap;
  transition: color 0.2s ease;
}
.awSteps__line {
  flex: 1 1 auto; height: 1.6px; min-width: 14px;
  background: var(--line); border-radius: 2px;
  transition: background 0.2s ease;
}
.awSteps__i.is-now .awSteps__n { border-color: var(--mint); color: var(--mint); }
.awSteps__i.is-now .awSteps__t { color: var(--text); }
.awSteps__i.is-done .awSteps__n {
  border-color: var(--mint); background: var(--mint); color: #04170E;
}
.awSteps__i.is-done .awSteps__t { color: var(--text-2); }
.awSteps__line.is-done { background: var(--mint); }

/* панели состояний */
.awPanel { animation: awPanelIn 0.22s cubic-bezier(0.22, 0.61, 0.36, 1) both; }
@keyframes awPanelIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .awPanel { animation: none; } }

.awTitle { margin: 0; font-size: 30px; font-weight: 800; letter-spacing: -0.035em; color: var(--text); }
.awLead { margin: 8px 0 0; font-size: 14.5px; line-height: 1.55; color: var(--text-3); }
.awLead a, .awLink {
  color: var(--mint); font-weight: 700; cursor: pointer;
  background: none; border: 0; padding: 0; font: inherit;
}
.awLead a:hover, .awLink:hover { color: #8CF5C8; }

/* поля */
.awField { margin-top: 18px; }
.awField__lbl {
  display: block; margin-bottom: 7px;
  font-size: 13.5px; font-weight: 600; color: var(--text-2);
}
.awField__lbl i { font-style: normal; color: var(--mint); }
.awField__wrap { position: relative; }
.awInput {
  width: 100%; padding: 15px 16px;
  border: 1px solid var(--line); border-radius: var(--r-mid);
  background: var(--surface-2); color: var(--text);
  font: inherit; font-size: 15px;
  transition: border-color 0.16s ease, background 0.16s ease;
}
.awInput::placeholder { color: var(--text-4); }
.awInput:focus {
  outline: none; border-color: rgba(85, 223, 160, 0.5); background: var(--surface-3);
}
.awField__wrap .awInput { padding-right: 50px; }
.awEye {
  position: absolute; top: 50%; right: 8px; transform: translateY(-50%);
  width: 36px; height: 36px; padding: 0;
  display: grid; place-items: center;
  border: 0; border-radius: var(--r-small);
  background: none; color: var(--text-3); cursor: pointer;
  transition: color 0.16s ease, background 0.16s ease;
}
.awEye:hover { color: var(--text); background: var(--surface-3); }
.awEye svg { width: 19px; height: 19px; }

/* шкала надёжности */
.awMeter { margin-top: 12px; }
.awMeter__top {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  margin-bottom: 7px;
}
.awMeter__lbl {
  font-size: 11px; font-weight: 800; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--text-4);
}
.awMeter__val { font-size: 14px; font-weight: 700; color: var(--text-4); }
.awMeter__bars { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.awMeter__bars i {
  height: 3px; border-radius: 2px; background: var(--surface-3);
  transition: background 0.22s ease;
}
.awMeter[data-score="1"] .awMeter__val { color: var(--red); }
.awMeter[data-score="2"] .awMeter__val { color: var(--accent-4); }
.awMeter[data-score="3"] .awMeter__val { color: #7FD9B4; }
.awMeter[data-score="4"] .awMeter__val { color: var(--mint); }
.awMeter[data-score="1"] .awMeter__bars i:nth-child(-n + 1) { background: var(--red); }
.awMeter[data-score="2"] .awMeter__bars i:nth-child(-n + 2) { background: var(--accent-4); }
.awMeter[data-score="3"] .awMeter__bars i:nth-child(-n + 3) { background: #7FD9B4; }
.awMeter[data-score="4"] .awMeter__bars i { background: var(--mint); }

/* чек-лист требований */
.awReqs {
  list-style: none; margin: 12px 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px;
}
.awReqs li {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; color: var(--text-4);
  transition: color 0.18s ease;
}
.awReqs li::before {
  content: ""; width: 16px; height: 16px; flex: none;
  border: 1.5px solid var(--line); border-radius: var(--r-pill);
  background: no-repeat center / 10px 10px;
  transition: background 0.18s ease, border-color 0.18s ease;
}
.awReqs li.is-ok { color: var(--text-2); }
.awReqs li.is-ok::before {
  border-color: var(--mint); background-color: var(--mint);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3.5 8.4l3 3 6-6.4' stroke='%2304120B' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
@media (max-width: 420px) { .awReqs { grid-template-columns: minmax(0, 1fr); } }

/* кнопки */
.awBtn {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  width: 100%; margin-top: 20px; padding: 16px 22px;
  border: 0; border-radius: var(--r-pill);
  font: inherit; font-size: 15.5px; font-weight: 700;
  cursor: pointer; text-align: center;
  transition: transform 0.18s cubic-bezier(0.22, 0.61, 0.36, 1),
              box-shadow 0.18s ease, filter 0.18s ease, background 0.18s ease;
}
.awBtn--primary {
  background: linear-gradient(180deg, #4FD39A, #2FB97E);
  color: #04170E;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.14) inset, 0 6px 20px rgba(47, 185, 126, 0.3);
}
.awBtn--primary:hover:not(:disabled) {
  transform: translateY(-2px); filter: brightness(1.06);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2) inset, 0 10px 28px rgba(47, 185, 126, 0.46);
}
.awBtn--primary:active:not(:disabled) { transform: translateY(0); }
.awBtn--ghost {
  background: var(--surface-2); color: var(--text);
  box-shadow: 0 0 0 1px var(--line) inset;
}
.awBtn--ghost:hover:not(:disabled) { background: var(--surface-3); }
.awBtn:disabled { opacity: 0.45; cursor: default; }
.awBtn svg { width: 16px; height: 16px; flex: none; }

.awTextBtn {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  width: 100%; margin-top: 14px; padding: 10px;
  border: 0; background: none; color: var(--text-4);
  font: inherit; font-size: 14px; font-weight: 600; cursor: pointer;
  transition: color 0.16s ease;
}
.awTextBtn:hover { color: var(--text-2); }
.awTextBtn svg { width: 16px; height: 16px; }

/* сообщения */
.awMsg { margin-top: 14px; font-size: 13.5px; line-height: 1.5; color: var(--red); }
.awMsg:empty { display: none; }
.awMsg--wait { color: var(--text-3); }
.awMsg--ok { color: var(--mint); }
.awMsg .awLink { margin-left: 6px; }

.awNote {
  display: flex; align-items: flex-start; gap: 9px;
  margin-top: 18px; padding-top: 16px;
  border-top: 1px solid var(--line-soft);
  font-size: 12.5px; line-height: 1.5; color: var(--text-4);
}
.awNote svg { width: 15px; height: 15px; flex: none; margin-top: 1px; }
.awNote b { color: var(--text-3); font-weight: 700; }

.awTerms { margin: 14px 0 0; font-size: 12.5px; line-height: 1.55; color: var(--text-4); text-align: center; }
.awTerms a { color: var(--mint); }

/* ─────────────────── брокеры ─────────────────── */

.awBrokers { display: grid; gap: 10px; margin-top: 20px; }
.awBrokers.is-multi { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.awBroker {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 16px;
  border: 1.5px solid var(--line); border-radius: var(--r-mid);
  background: var(--surface-2); color: var(--text);
  font: inherit; text-align: left; cursor: pointer;
  transition: border-color 0.16s ease, background 0.16s ease;
}
.awBroker:hover { background: var(--surface-3); }
.awBroker.is-on { border-color: var(--mint); background: rgba(85, 223, 160, 0.07); }
.awBroker__ico {
  width: 38px; height: 38px; flex: none;
  display: grid; place-items: center;
  border-radius: var(--r-small);
  background: var(--surface-3); color: var(--mint);
  font-size: 14px; font-weight: 800;
}
.awBroker__name { flex: 1 1 auto; font-size: 15px; font-weight: 700; }
.awBroker__tick {
  width: 20px; height: 20px; flex: none;
  border: 1.5px solid var(--line); border-radius: var(--r-pill);
  background: no-repeat center / 11px 11px;
}
.awBroker.is-on .awBroker__tick {
  border-color: var(--mint); background-color: var(--mint);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3.5 8.4l3 3 6-6.4' stroke='%2304170E' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.awSplit {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  margin-top: 22px; padding-top: 18px;
  border-top: 1px solid var(--line-soft);
  font-size: 13.5px; color: var(--text-4);
}

/* ─────────────────── экраны «готово» ─────────────────── */

.awDone { padding: 22px 0 10px; text-align: center; }
.awDone__ring {
  width: 86px; height: 86px; margin: 0 auto 22px;
  display: grid; place-items: center;
  border: 2.5px solid var(--mint); border-radius: var(--r-pill);
  color: var(--mint);
  animation: awRing 0.4s cubic-bezier(0.22, 0.61, 0.36, 1) both;
}
.awDone__ring svg { width: 38px; height: 38px; }
@keyframes awRing { from { transform: scale(0.75); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .awDone__ring { animation: none; } }
.awDone__title { margin: 0; font-size: 27px; font-weight: 800; letter-spacing: -0.03em; color: var(--text); }
.awDone__text { margin: 10px auto 0; max-width: 34ch; font-size: 14.5px; line-height: 1.55; color: var(--text-3); }

/* ─────────────────── пополнение ─────────────────── */

.awLinked {
  display: flex; align-items: center; gap: 10px;
  margin-top: 20px; padding: 13px 16px;
  border: 1px solid var(--line); border-radius: var(--r-mid);
  background: var(--surface-2);
  font-size: 14px; color: var(--text-2);
  font-variant-numeric: tabular-nums;
}
.awLinked__ok {
  width: 20px; height: 20px; flex: none;
  display: grid; place-items: center;
  border-radius: var(--r-pill); background: var(--mint); color: #04120B;
}
.awLinked__ok svg { width: 12px; height: 12px; }

.awWallet { margin-top: 18px; }
.awWallet__row {
  display: flex; align-items: center; gap: 10px; margin-bottom: 10px;
  font-size: 19px; font-weight: 800; letter-spacing: -0.02em;
  color: var(--text); font-variant-numeric: tabular-nums;
}
.awWallet__row svg { width: 19px; height: 19px; flex: none; color: var(--mint); }
.awWallet__row s { color: var(--text-4); text-decoration: none; font-weight: 700; }
.awWallet__bar { height: 6px; border-radius: 3px; background: var(--surface-3); overflow: hidden; }
.awWallet__fill {
  display: block; height: 100%; width: 0; border-radius: inherit;
  background: linear-gradient(90deg, #2FB97E, #8CF5C8);
  transition: width 0.5s cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* ─────────────────── окно «Где найти ID?» ─────────────────── */

.awModal {
  position: fixed; inset: 0; z-index: 160;
  display: grid; place-items: center; padding: 24px;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  animation: awFade 0.18s ease both;
}
.awModal[hidden] { display: none; }
.awModal__card {
  width: 100%; max-width: 420px;
  border: 1px solid var(--line); border-radius: var(--r-card);
  background: var(--surface);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.55);
  animation: awRise 0.22s cubic-bezier(0.22, 0.61, 0.36, 1) both;
}
.awModal__head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 14px;
  padding: 22px 22px 18px; border-bottom: 1px solid var(--line-soft);
}
.awModal__kicker {
  display: flex; align-items: center; gap: 10px;
  font-size: 11px; font-weight: 800; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--text-3);
}
.awModal__kicker::before {
  content: ""; width: 20px; height: 1.5px; background: var(--mint); border-radius: 2px;
}
.awModal__title { margin: 10px 0 0; font-size: 22px; font-weight: 800; letter-spacing: -0.03em; color: var(--text); }
.awModal__x {
  width: 34px; height: 34px; flex: none; padding: 0;
  display: grid; place-items: center;
  border: 1px solid var(--line); border-radius: var(--r-small);
  background: none; color: var(--text-3); cursor: pointer;
  transition: color 0.16s ease, background 0.16s ease;
}
.awModal__x:hover { color: var(--text); background: var(--surface-2); }
.awModal__x svg { width: 15px; height: 15px; }
.awModal__body { padding: 20px 22px 24px; font-size: 14.5px; line-height: 1.6; color: var(--text-2); }

/* ─────────────────── узкий экран ─────────────────── */

@media (max-width: 900px) {
  .aw { padding: 16px; place-items: start center; }
  .aw__inner { grid-template-columns: minmax(0, 1fr); gap: 0; max-width: 520px; }
  .awPromo { display: none; }
  .aw__close { top: -4px; right: 0; width: 40px; height: 40px; }
  .awCard { padding: 24px 20px; margin-top: 46px; }
  .awTitle { font-size: 26px; }
  /* В шагомере на телефоне остаются кружки и подпись текущего шага. */
  .awSteps__i:not(.is-now) .awSteps__t { display: none; }
}
