/* ===========================================================
   Коридор до депозита (corridor.js)
   Один экран — одна главная кнопка. Цвета — только токены темы из
   style.css, поэтому экран сам работает и в светлой, и в тёмной теме.
   Ритм отступов: 6 · 10 · 14 · 18 · 24. Всё, что больше, — воздух
   вокруг композиции, а не дыра под текстом.
   =========================================================== */
.corr { padding-top: 12px; }

/* ---------- верхняя строка ---------- */
.corr-top { display: flex; align-items: center; gap: 8px; min-height: 34px; flex-shrink: 0; }
.corr-sp { flex: 1; }
.corr-back {
    background: none; border: none; padding: 6px 2px; cursor: pointer;
    font-family: var(--font); font-size: 15px; font-weight: 600; color: var(--muted);
}
/* Помощь — та же капсула, что и язык рядом: значок цветом акцента и слово. */
.corr-chip {
    display: inline-flex; align-items: center; gap: 6px;
    height: 34px; padding: 0 12px 0 10px; border-radius: 999px; cursor: pointer;
    border: 1px solid var(--border); background: var(--surface); color: var(--text);
    font-family: var(--font); font-size: 13px; font-weight: 700; letter-spacing: .02em;
}
.corr-chip svg { width: 17px; height: 17px; color: var(--accent); }
.corr-chip:active { background: var(--accent-soft); }
.corr-back:active { opacity: .7; }

.corr-demo-pill {
    display: inline-flex; align-items: center; height: 24px; padding: 0 9px; border-radius: 999px;
    border: 1px dashed var(--accent); color: var(--accent);
    font-size: 10.5px; font-weight: 800; letter-spacing: .1em;
}
.corr-demo-btns { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin-top: 16px; }
.corr-demo-btns button {
    font: 600 12px var(--font); color: var(--accent); background: transparent; cursor: pointer;
    border: 1px dashed var(--accent); border-radius: 999px; padding: 6px 11px;
}

/* ---------- шкала шагов ---------- */
.corr-steps { display: grid; grid-template-columns: repeat(4, 1fr); margin: 14px -6px 0; flex-shrink: 0; }
.corr-st { display: flex; flex-direction: column; align-items: center; position: relative; }
.corr-st::before {
    content: ""; position: absolute; top: 12px; right: 50%; width: 100%; height: 2px; background: var(--border);
}
.corr-st:first-child::before { display: none; }
.corr-st.done::before, .corr-st.cur::before { background: var(--accent); }
.corr-dot {
    width: 26px; height: 26px; border-radius: 50%; border: 2px solid var(--border); background: var(--bg);
    display: grid; place-items: center; position: relative; z-index: 1;
    font-size: 12.5px; font-weight: 700; color: var(--muted);
}
.corr-dot svg { width: 13px; height: 13px; }
.corr-st.done .corr-dot { background: var(--accent); border-color: var(--accent); color: #fff; }
.corr-st.cur .corr-dot { border-color: var(--accent); box-shadow: 0 0 0 5px var(--accent-soft); }
.corr-st.cur .corr-dot::after { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--accent); }
.corr-st-l { font-size: 11.5px; margin-top: 7px; color: var(--muted); font-weight: 500; white-space: nowrap; }
.corr-st.done .corr-st-l, .corr-st.cur .corr-st-l { color: var(--text); }
.corr-st.cur .corr-st-l { font-weight: 700; }
[dir="rtl"] .corr-st::before { right: auto; left: 50%; }

/* ---------- тело и низ ---------- */
.corr-body {
    flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch;
    padding: 18px 2px 14px;
}
.corr-foot { flex-shrink: 0; display: flex; flex-direction: column; gap: 2px; padding-top: 8px; }
.corr-ghost {
    display: block; width: 100%; background: transparent; border: none; cursor: pointer;
    color: var(--muted); font-family: var(--font); font-weight: 600; font-size: 14.5px;
    padding: 12px; text-align: center;
}
.corr-ghost:active { color: var(--text); }
.corr-fine { text-align: center; font-size: 13px; color: var(--muted); margin-top: 10px; line-height: 1.4; }

.corr-h {
    font-family: 'Lora', Georgia, serif; font-size: 28px; line-height: 1.14; font-weight: 600;
    letter-spacing: -.015em; margin: 0; text-wrap: balance;
}
.corr-h-xl { font-size: 34px; line-height: 1.08; }
.corr-h-sm { font-size: 25px; }
.corr-eyebrow {
    font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
    color: var(--accent); margin-bottom: 8px;
}
.corr-lead { font-size: 15.5px; line-height: 1.5; color: var(--muted); margin: 10px 0 0; }
.corr-lead-sm { font-size: 14.5px; margin-top: 8px; }
.corr-lead b, .corr-trust b, .corr-note b { color: var(--text); font-weight: 600; }

.corr-note {
    display: flex; gap: 10px; padding: 12px 14px; border-radius: 14px; background: var(--accent-soft);
    font-size: 14px; line-height: 1.45; margin-top: 14px; text-align: start;
}
.corr-note-i {
    flex-shrink: 0; width: 21px; height: 21px; border-radius: 50%; background: var(--accent); color: #fff;
    display: grid; place-items: center; font-size: 12px; font-weight: 800; margin-top: 1px;
}
.corr-trust {
    display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; line-height: 1.45;
    color: var(--muted); margin-top: 14px; text-align: start;
}
.corr-trust svg { flex-shrink: 0; width: 17px; height: 17px; margin-top: 1px; color: var(--muted); }
.corr-trust.ok svg { color: var(--up); }

/* ---------- приветствие: логотип в середине, текст у кнопки ---------- */
.corr-body.is-welcome { display: flex; flex-direction: column; padding-bottom: 6px; }
.corr-art {
    position: relative; flex: 1 1 auto; min-height: 190px;
    display: grid; place-items: center;
}
.corr-art > * { grid-area: 1 / 1; }
.corr-aura {
    width: 300px; height: 300px; border-radius: 50%; filter: blur(40px); opacity: .22;
    background: radial-gradient(circle, var(--accent) 0%, transparent 66%);
}
.corr-halo { width: 168px; height: 168px; border-radius: 50%; border: 1.5px solid var(--accent); opacity: .22; }
.corr-halo-2 { width: 244px; height: 244px; opacity: .09; }
.corr-art img {
    width: 118px; height: 118px; position: relative; z-index: 1;
    filter: drop-shadow(0 12px 30px rgba(217,119,87,.34));
}
.corr-copy { padding-top: 6px; }

/* ---------- экраны-состояния: композиция по центру свободного места ---------- */
.corr-body.is-center { display: flex; flex-direction: column; }
.corr-center {
    margin: auto 0;                      /* центр, но без обрезки, если не влезло */
    display: flex; flex-direction: column; align-items: center; text-align: center;
    padding: 6px 0 18px;
}
.corr-center .corr-lead { max-width: 34ch; }
.corr-center .corr-h { margin-top: 22px; }
.corr-orb {
    position: relative; width: 96px; height: 96px; border-radius: 50%; flex-shrink: 0;
    display: grid; place-items: center;
    background: var(--accent-soft); color: var(--accent);
}
.corr-orb svg { width: 40px; height: 40px; }
.corr-orb::before {
    content: ""; position: absolute; inset: -12px; border-radius: 50%;
    border: 1px solid var(--border);
}
.corr-orb-arc {
    position: absolute; inset: -6px; border-radius: 50%;
    border: 3px solid transparent; border-top-color: var(--accent); border-right-color: var(--accent);
    animation: corrSpin 1.2s linear infinite;
}
.corr-orb.ok { background: var(--surface); background: color-mix(in srgb, var(--up) 15%, transparent); color: var(--up); }
.corr-orb.ok svg { width: 42px; height: 42px; stroke-width: 2.6; }
.corr-orb.glow { box-shadow: 0 14px 48px rgba(31, 169, 113, .28); }

/* «проверяем автоматически»: живая точка — видно, что экран не завис */
.corr-live {
    display: inline-flex; align-items: center; gap: 8px; margin-top: 16px;
    padding: 7px 13px; border-radius: 999px; background: var(--surface);
    font-size: 12.5px; font-weight: 600; color: var(--muted);
}
.corr-live span {
    width: 8px; height: 8px; border-radius: 50%; background: var(--up);
    animation: corrBlink 1.6s ease-in-out infinite;
}
@keyframes corrBlink { 50% { opacity: .25; } }
.corr-card {
    width: 100%; margin-top: 18px; padding: 12px 14px; border-radius: 16px; background: var(--surface);
}
.corr-card .corr-trust { margin-top: 0; }
.corr-center .corr-note { width: 100%; margin-top: 18px; }

/* уровень после депозита — единственное место, где карточка залита акцентом */
.corr-level {
    width: 100%; margin-top: 22px; padding: 16px 18px; border-radius: 18px; text-align: start;
    background: linear-gradient(135deg, var(--accent) 0%, var(--accent-press) 100%); color: #fff;
    box-shadow: 0 12px 34px rgba(217, 119, 87, .28);
}
.corr-level span {
    display: block; font-size: 11.5px; font-weight: 700; letter-spacing: .08em;
    text-transform: uppercase; opacity: .85;
}
.corr-level b { display: block; font-family: 'Lora', Georgia, serif; font-size: 26px; font-weight: 600; margin-top: 4px; }
.corr-level em { display: block; font-style: normal; font-size: 13px; opacity: .9; margin-top: 4px; }

/* ---------- сигнал ---------- */
.corr-pair { display: flex; align-items: center; gap: 13px; }
.corr-pair .avatar.corr-av { width: 50px; height: 50px; font-size: 13px; flex-shrink: 0; }
.corr-pair-n { font-size: 22px; font-weight: 700; }
.corr-pair-s { font-size: 13px; color: var(--muted); margin-top: 2px; }
.corr-chart { position: relative; height: 132px; margin-top: 12px; }
.corr-chart canvas { display: block; width: 100%; height: 100%; }
.corr-now {
    position: absolute; width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%;
    background: var(--up); box-shadow: 0 0 0 3px var(--bg);
}
.corr-now.down { background: var(--down); }
.corr-now.up { color: var(--up); }
.corr-now.down { color: var(--down); }
.corr-now::after {
    content: ""; position: absolute; inset: -6px; border-radius: 50%;
    border: 2px solid currentColor; opacity: 0; animation: corrPulse 1.6s ease-out infinite;
}
@keyframes corrPulse {
    0%   { transform: scale(.6); opacity: .8; }
    100% { transform: scale(1.8); opacity: 0; }
}
.corr-status {
    display: flex; align-items: center; gap: 12px; padding: 14px 15px;
    border-radius: 16px; background: var(--surface);
}
.corr-status b { display: block; font-size: 15.5px; }
.corr-status-tight { margin: 12px 0 0; }
.corr-spin {
    width: 24px; height: 24px; border-radius: 50%; flex-shrink: 0;
    border: 3px solid var(--border); border-top-color: var(--accent);
    animation: corrSpin 1s linear infinite;
}
@keyframes corrSpin { to { transform: rotate(360deg); } }
.corr-dir { margin-top: 12px; border-radius: 22px; padding: 14px 16px; display: flex; align-items: center; gap: 16px; }
.corr-dir.up { background: var(--surface); background: color-mix(in srgb, var(--up) 13%, transparent); color: var(--up); }
.corr-dir.down { background: var(--surface); background: color-mix(in srgb, var(--down) 13%, transparent); color: var(--down); }
.corr-dir-b { width: 50px; height: 50px; border-radius: 50%; display: grid; place-items: center; flex-shrink: 0; }
.corr-dir.up .corr-dir-b { background: var(--up); }
.corr-dir.down .corr-dir-b { background: var(--down); }
.corr-dir-b svg { width: 28px; height: 28px; }
.corr-dir-t { font-size: 27px; font-weight: 800; letter-spacing: .02em; }
.corr-dir-s { font-size: 13.5px; color: var(--muted); font-weight: 500; }
.corr-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 10px; }
.corr-meta div { background: var(--surface); border-radius: 14px; padding: 11px 13px; }
.corr-meta span { display: block; font-size: 12px; color: var(--muted); }
.corr-meta b { display: block; font-size: 17px; font-weight: 700; margin-top: 2px; font-variant-numeric: tabular-nums; }
.corr-meta b.live { color: var(--accent); }
.corr-calc { margin: 12px 0 0; font-size: 14px; line-height: 1.45; color: var(--muted); }
.corr-calc b { font-weight: 700; font-variant-numeric: tabular-nums; }
.corr-calc b.pos { color: var(--up); }
.corr-calc b.neg { color: var(--text); }

/* ---------- счёт: форма брокера с номерами на полях ---------- */
.corr-form { position: relative; margin-top: 14px; }
.corr-form img {
    display: block; width: 100%; height: auto; border-radius: 14px; border: 1px solid var(--border);
}
.corr-pin {
    position: absolute; transform: translate(-50%, -50%);
    width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center;
    background: var(--accent); color: #fff; font: 800 12.5px var(--font); font-style: normal;
    box-shadow: 0 0 0 3px #fff, 0 4px 14px rgba(0, 0, 0, .28);
    animation: corrPin .38s var(--ease) both;
}
.corr-pin:nth-of-type(2) { animation-delay: .12s; }
.corr-pin:nth-of-type(3) { animation-delay: .24s; }
@keyframes corrPin {
    from { opacity: 0; transform: translate(-50%, -50%) scale(.4); }
    to   { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}
.corr-num { list-style: none; padding: 0; margin: 12px 0 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 10px; }
.corr-num li { display: flex; gap: 9px; align-items: center; font-size: 14px; font-weight: 600; }
.corr-num li i {
    font-style: normal; width: 24px; height: 24px; border-radius: 50%; background: var(--accent-soft); color: var(--accent);
    display: grid; place-items: center; font-weight: 800; font-size: 12.5px; flex-shrink: 0;
}
.corr-shot { margin-top: 14px; border-radius: 16px; overflow: hidden; border: 1px solid var(--border); }
.corr-shot img { display: block; width: 100%; height: auto; }

/* ---------- депозит: сумма плитками и бонус чеком ---------- */
.corr-pill {
    display: inline-flex; align-items: center; gap: 6px; margin-bottom: 10px;
    padding: 5px 12px 5px 8px; border-radius: 999px; font-size: 12.5px; font-weight: 700;
}
.corr-pill svg { width: 15px; height: 15px; stroke-width: 3; }
.corr-pill.ok { background: var(--surface); background: color-mix(in srgb, var(--up) 15%, transparent); color: var(--up); }
.corr-dep {
    margin-top: 16px; padding: 14px; border-radius: 20px;
    background: var(--surface); border: 1px solid var(--border);
}
.corr-dep-h {
    font-size: 11.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase;
    color: var(--muted); margin: 0 2px 10px;
}
.corr-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.corr-tile {
    position: relative; padding: 12px 4px 10px; border-radius: 14px; cursor: pointer; text-align: center;
    border: 1.5px solid var(--border); background: var(--bg); color: var(--text); font-family: var(--font);
    transition: border-color .2s var(--ease), background .2s var(--ease), box-shadow .2s var(--ease);
}
.corr-tile b { display: block; font-size: 21px; font-weight: 800; font-variant-numeric: tabular-nums; }
.corr-tile span { display: block; margin-top: 3px; font-size: 11.5px; font-weight: 600; color: var(--muted); }
.corr-tile.on {
    border-color: var(--accent); background: var(--accent-soft);
    box-shadow: 0 8px 22px rgba(217, 119, 87, .20);
}
.corr-tile.on span { color: var(--accent); }
.corr-tile:active { transform: scale(.98); }
.corr-rcpt { margin-top: 12px; padding: 2px 2px 0; }
.corr-row {
    display: flex; justify-content: space-between; align-items: center; gap: 10px;
    padding: 6px 0; font-size: 14.5px; color: var(--muted);
}
.corr-row > span { display: inline-flex; align-items: center; gap: 8px; }
.corr-row > b { color: var(--text); font-weight: 700; font-variant-numeric: tabular-nums; }
.corr-row.bonus > b { color: var(--up); }
.corr-row.total { margin-top: 4px; padding-top: 11px; border-top: 1px dashed var(--border); }
.corr-row.total > span { color: var(--text); font-weight: 600; }
.corr-row.total > b { font-family: 'Lora', Georgia, serif; font-size: 27px; font-weight: 600; }
.corr-codechip {
    display: inline-flex; align-items: center; gap: 6px; padding: 3px 3px 3px 9px; border-radius: 8px;
    border: 1px dashed var(--accent); background: var(--accent-soft); color: var(--accent); cursor: pointer;
    font-family: var(--font);
}
.corr-codechip b { font-size: 12.5px; font-weight: 800; letter-spacing: .1em; }
.corr-codechip span {
    display: grid; place-items: center; width: 22px; height: 20px; border-radius: 6px;
    color: #fff; background: var(--accent);
}
.corr-codechip span svg { width: 12px; height: 12px; }
.corr-terms { margin: 8px 2px 0; font-size: 11.5px; color: var(--muted); }
.corr-dep + .corr-trust { margin-top: 16px; }
.corr-trust + .corr-trust { margin-top: 10px; }

/* ---------- ввод ID ---------- */
.corr-field {
    display: block; margin-top: 16px; border: 1.5px solid var(--accent); border-radius: 14px;
    padding: 11px 14px; background: var(--surface);
}
.corr-field small { display: block; font-size: 11.5px; color: var(--muted); font-weight: 600; margin-bottom: 3px; }
.corr-field input {
    width: 100%; border: none; outline: none; background: transparent; color: var(--text);
    font-family: var(--font); font-size: 18px; font-weight: 600; letter-spacing: .04em; padding: 0;
}
.corr-msg { margin-top: 10px; font-size: 14px; line-height: 1.45; color: var(--muted); }
.corr-msg.bad { color: var(--down); }
.corr-where { margin-top: 18px; }
.corr-where-h { font-size: 13px; font-weight: 700; }
.corr-where .corr-shot { margin-top: 8px; }

/* ---------- ролик ---------- */
.corr-video { margin-top: 14px; border-radius: 16px; overflow: hidden; background: #000; border: 1px solid var(--border); }
.corr-video video { display: block; width: 100%; max-height: 44vh; background: #000; }
.corr-video-cap { margin-top: 8px; font-size: 13.5px; }
.corr-video-cap b { display: block; }
.corr-video-cap span { color: var(--muted); font-size: 12.5px; }

/* ---------- появление ---------- */
/* направление появляется на уже нарисованном графике — подъёмом, а не подменой */
.corr-dir { animation: corrRise .45s var(--ease) both; }
.corr-meta { animation: corrRise .45s var(--ease) .08s both; }
.corr-calc { animation: corrRise .45s var(--ease) .14s both; }
.corr-center > * { animation: corrRise .42s var(--ease) both; }
.corr-center > :nth-child(2) { animation-delay: .06s; }
.corr-center > :nth-child(3) { animation-delay: .1s; }
.corr-center > :nth-child(n+4) { animation-delay: .14s; }
@keyframes corrRise {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: none; }
}

/* ---------- маленькие экраны: сжимаем воздух, а не текст ---------- */
@media (max-height: 700px) {
    .corr-steps { margin-top: 10px; }
    .corr-body { padding-top: 14px; }
    .corr-art { min-height: 150px; }
    .corr-halo-2 { display: none; }
    .corr-h-xl { font-size: 30px; }
    .corr-chart { height: 112px; }
    .corr-orb { width: 80px; height: 80px; }
    .corr-orb svg { width: 34px; height: 34px; }
    .corr-center .corr-h { margin-top: 18px; }
}

@media (prefers-reduced-motion: reduce) {
    .corr-spin, .corr-orb-arc { animation-duration: 3s; }
    .corr-dir, .corr-meta, .corr-calc, .corr-now::after, .corr-center > *, .corr-pin, .corr-live span { animation: none; }
}

/* ---------- ввод ID: поле сверху, подсказка у кнопки ---------- */
.corr-body.is-split { display: flex; flex-direction: column; }
.corr-body.is-split .corr-where { margin-top: auto; padding-top: 18px; }

/* ---------- подтверждённый счёт: какой ID привязан ---------- */
.corr-idcard {
    width: 100%; margin-top: 22px; padding: 14px 16px; border-radius: 16px; text-align: start;
    background: var(--surface); border: 1px solid var(--border);
}
.corr-idcard span { display: block; font-size: 12px; color: var(--muted); font-weight: 600; }
.corr-idcard b { display: block; font-size: 20px; font-weight: 700; letter-spacing: .04em; margin-top: 2px; font-variant-numeric: tabular-nums; }
.corr-idcard em {
    display: flex; align-items: center; gap: 6px; margin-top: 8px;
    font-style: normal; font-size: 13px; font-weight: 600; color: var(--up);
}
.corr-idcard em svg { width: 15px; height: 15px; }
.corr-form { margin-top: 12px; }
.corr-num { gap: 6px 10px; margin-top: 10px; }
/* предупреждение над кнопкой счёта */
.corr-foot-note .corr-note { margin: 0 0 10px; padding: 10px 12px; font-size: 13.5px; }


/* ---------- форма брокера: ширина из свободной высоты ----------
   Ширину считаем от высоты окна (снимок 576×492, отсюда ×1.17): на
   высоком экране — во всю ширину, на низком — уже и по центру. Номера на
   полях стоят в процентах от блока и едут вместе со снимком. */
.corr-form {
    width: clamp(180px, calc((var(--app-h, 100vh) - 468px) * 1.17), 100%);
    margin: 12px auto 0;
}

/* ---------- телефон в Telegram: окно ~720 px и ниже ----------
   Шапка Telegram и нижняя полоса iPhone съедают сотню пикселей, поэтому
   под 760 всё поджимается: меньше воздух и значки, а не текст. */
@media (max-height: 760px) {
    .corr { padding-top: 8px; }
    .corr-top { min-height: 30px; }
    .corr-chip, .corr .lang-fab { height: 30px; }
    .corr-steps { margin-top: 8px; }
    .corr-dot { width: 22px; height: 22px; font-size: 11px; }
    .corr-dot svg { width: 12px; height: 12px; }
    .corr-st::before { top: 10px; }
    .corr-st.cur .corr-dot { box-shadow: 0 0 0 4px var(--accent-soft); }
    .corr-st.cur .corr-dot::after { width: 8px; height: 8px; }
    .corr-st-l { margin-top: 5px; font-size: 11px; }
    .corr-body { padding-top: 12px; padding-bottom: 8px; }
    .corr-h-sm { font-size: 23px; }
    .corr-lead { font-size: 14.5px; margin-top: 8px; }
    .corr-lead-sm { font-size: 14px; }
    .corr-foot { padding-top: 6px; }
    .corr-foot .btn { padding: 14px 18px; }
    .corr-ghost { padding: 9px; }
    .corr-fine { font-size: 12px; margin-top: 6px; }
    .corr-trust { font-size: 12.5px; margin-top: 10px; }

    /* сигнал */
    .corr-pair { gap: 11px; }
    .corr-pair .avatar.corr-av { width: 42px; height: 42px; font-size: 11.5px; }
    .corr-pair-n { font-size: 20px; }
    .corr-pair-s { font-size: 12.5px; }
    .corr-chart { height: 100px; margin-top: 8px; }
    .corr-dir { margin-top: 10px; padding: 10px 14px; border-radius: 18px; gap: 12px; }
    .corr-dir-b { width: 42px; height: 42px; }
    .corr-dir-b svg { width: 24px; height: 24px; }
    .corr-dir-t { font-size: 23px; }
    .corr-dir-s { font-size: 12.5px; }
    .corr-meta { margin-top: 8px; gap: 8px; }
    .corr-meta div { padding: 8px 12px; border-radius: 12px; }
    .corr-meta b { font-size: 16px; }
    .corr-calc { margin-top: 10px; font-size: 13px; }

    /* счёт */
    .corr-form { margin-top: 10px; }
    .corr-num { margin-top: 8px; gap: 4px 10px; }
    .corr-num li { font-size: 13.5px; }
    .corr-num li i { width: 22px; height: 22px; font-size: 12px; }
    .corr-foot-note .corr-note { padding: 9px 12px; font-size: 13px; margin-bottom: 8px; }

    /* депозит */
    .corr-pill { margin-bottom: 8px; }
    .corr-dep { margin-top: 12px; padding: 12px; border-radius: 18px; }
    .corr-dep-h { margin-bottom: 8px; }
    .corr-tile { padding: 9px 4px 8px; }
    .corr-tile b { font-size: 19px; }
    .corr-rcpt { margin-top: 8px; }
    .corr-row { padding: 4px 0; font-size: 14px; }
    .corr-row.total { padding-top: 8px; }
    .corr-row.total > b { font-size: 24px; }
    .corr-terms { margin-top: 4px; }
    .corr-dep + .corr-trust { margin-top: 12px; }
    .corr-trust + .corr-trust { margin-top: 8px; }

    /* состояния по центру */
    .corr-orb { width: 80px; height: 80px; }
    .corr-orb svg { width: 34px; height: 34px; }
    .corr-orb::before { inset: -10px; }
    .corr-center { padding-bottom: 10px; }
    .corr-center .corr-h { margin-top: 18px; }
    .corr-live { margin-top: 12px; }
    .corr-card, .corr-center .corr-note, .corr-idcard { margin-top: 14px; }
    .corr-level { margin-top: 16px; }

    /* ввод ID и ролик */
    .corr-field { margin-top: 12px; }
    .corr-where { padding-top: 12px; }
    .corr-video { margin-top: 10px; }
    .corr-video video { max-height: calc(var(--app-h, 100vh) - 420px); }
    .corr-art { min-height: 150px; }
}

/* ---------- совсем низкие окна (iPhone SE в Telegram) ---------- */
@media (max-height: 640px) {
    .corr-h-sm { font-size: 21px; }
    .corr-pair .avatar.corr-av { width: 38px; height: 38px; font-size: 10.5px; }
    .corr-pair-n { font-size: 18px; }
    .corr-chart { height: 84px; }
    .corr-dir { padding: 8px 12px; }
    .corr-dir-b { width: 38px; height: 38px; }
    .corr-dir-b svg { width: 21px; height: 21px; }
    .corr-dir-t { font-size: 21px; }
    .corr-meta div { padding: 6px 10px; }
    .corr-meta b { font-size: 15px; }
    .corr-calc, .corr-trust { font-size: 12px; margin-top: 8px; }
    .corr-dep { padding: 10px; }
    .corr-tile { padding: 7px 4px 6px; }
    .corr-tile b { font-size: 17px; }
    .corr-row { padding: 3px 0; font-size: 13.5px; }
    .corr-row.total > b { font-size: 22px; }
    .corr-dep + .corr-trust { margin-top: 10px; }
    .corr-trust + .corr-trust { margin-top: 6px; }
}

/* ---------- приветствие: «бот бесплатный» до кнопки ---------- */
.corr-free {
    margin-top: 14px; padding: 12px 14px; border-radius: 16px;
    background: var(--surface); border: 1px solid var(--border);
    display: flex; flex-direction: column; gap: 9px;
}
.corr-free > div { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; line-height: 1.4; color: var(--muted); }
.corr-free i {
    flex-shrink: 0; width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center;
    background: var(--accent-soft); color: var(--accent);
}
.corr-free i svg { width: 15px; height: 15px; }
.corr-free b { color: var(--text); font-weight: 600; }
.corr-free span { padding-top: 3px; }

/* ---------- «счёт не наш»: что случилось — красным, что делать — акцентом ---------- */
.corr-bad {
    display: flex; gap: 10px; align-items: center; padding: 12px 14px; border-radius: 14px;
    background: var(--surface); background: color-mix(in srgb, var(--down) 14%, transparent);
    color: var(--down);
}
.corr-bad i {
    flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center;
    background: var(--down); color: #fff;
}
.corr-bad i svg { width: 13px; height: 13px; }
.corr-bad b { font-size: 16px; font-weight: 700; line-height: 1.3; }
.corr-bad + .corr-note { margin-top: 10px; }
.corr-guide { list-style: none; padding: 0; margin: 12px 0 0; display: flex; flex-direction: column; gap: 8px; }
.corr-guide li { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; line-height: 1.4; color: var(--muted); }
.corr-guide li i {
    flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center;
    background: var(--accent-soft); color: var(--accent); font: 800 12px var(--font); font-style: normal;
}
.corr-guide li span { padding-top: 1px; }
.corr-guide b { color: var(--text); font-weight: 600; }
.corr-video video { max-height: calc(var(--app-h, 100vh) - 470px); min-height: 150px; }

@media (max-height: 760px) {
    .corr-free { margin-top: 10px; padding: 10px 12px; gap: 7px; }
    .corr-free > div { font-size: 13px; }
    .corr-free i { width: 24px; height: 24px; }
    .corr-bad { padding: 10px 12px; }
    .corr-bad b { font-size: 15px; }
    .corr-guide { gap: 6px; margin-top: 10px; }
    .corr-guide li { font-size: 13px; }
    .corr-video video { max-height: calc(var(--app-h, 100vh) - 450px); }
}
@media (max-height: 640px) {
    .corr-art { min-height: 96px; }
    .corr-aura { width: 200px; height: 200px; }
    .corr-halo { width: 120px; height: 120px; }
    .corr-art img { width: 80px; height: 80px; }
    .corr-h-xl { font-size: 26px; }
    .corr-free > div { font-size: 12.5px; }
}

/* ---------- приветствие: заголовок по делу и логотип → «FREE» ---------- */
.corr-h-welcome { font-size: 28px; line-height: 1.12; }
.corr-art .corr-logo { animation: corrLogoCycle 4.8s var(--ease) infinite; }
.corr-free-word {
    position: relative; z-index: 2; padding-inline-start: .06em;
    font-family: 'Lora', Georgia, serif; font-weight: 700; font-size: 54px; line-height: 1;
    letter-spacing: .06em; white-space: nowrap;
    background: linear-gradient(100deg, var(--accent) 25%, var(--shine, #FFE1D3) 45%, var(--accent) 65%);
    background-size: 260% 100%;
    -webkit-background-clip: text; background-clip: text; color: transparent;
    opacity: 0;
    animation: corrWordCycle 4.8s var(--ease) infinite, corrShimmer 4.8s linear infinite;
}
.corr-free-word.long { font-size: 34px; }
:root[data-theme="light"] .corr-free-word { --shine: #F7C9B6; }
.corr-art .corr-halo { animation: corrHaloBeat 4.8s var(--ease) infinite; }
@keyframes corrLogoCycle {
    0%, 11%  { opacity: 1; transform: scale(1) rotate(0deg); }
    22%      { opacity: 0; transform: scale(.2) rotate(170deg); }
    83%      { opacity: 0; transform: scale(.2) rotate(-170deg); }
    95%, 100% { opacity: 1; transform: scale(1) rotate(0deg); }
}
@keyframes corrWordCycle {
    0%, 15%  { opacity: 0; letter-spacing: -.45em; filter: blur(10px); transform: scale(.6); }
    27%      { opacity: 1; letter-spacing: .06em; filter: blur(0); transform: scale(1); }
    77%      { opacity: 1; letter-spacing: .06em; filter: blur(0); transform: scale(1); }
    87%, 100% { opacity: 0; letter-spacing: -.45em; filter: blur(10px); transform: scale(.6); }
}
@keyframes corrShimmer {
    0%, 28%  { background-position: 110% 0; }
    52%, 100% { background-position: -10% 0; }
}
/* кольца вздрагивают в момент превращения — связывают два состояния */
@keyframes corrHaloBeat {
    0%, 12%  { transform: scale(1); }
    22%      { transform: scale(1.12); }
    34%, 84% { transform: scale(1); }
    92%      { transform: scale(1.08); }
    100%     { transform: scale(1); }
}
@media (max-height: 760px) {
    .corr-h-welcome { font-size: 25px; }
    .corr-free-word { font-size: 46px; }
    .corr-free-word.long { font-size: 30px; }
}
@media (max-height: 640px) {
    .corr-h-welcome { font-size: 22px; }
    .corr-free-word { font-size: 36px; }
    .corr-free-word.long { font-size: 24px; }
}
@media (prefers-reduced-motion: reduce) {
    .corr-art .corr-logo, .corr-art .corr-halo { animation: none; }
    .corr-free-word { display: none; }
}

/* ---------- депозит: что даёт выбранный уровень ---------- */
.corr-lvl { margin-top: 10px; padding: 10px 12px; border-radius: 12px; background: var(--bg); }
.corr-lvl-top { display: flex; align-items: center; gap: 10px; }
.corr-lvl-top b { font-size: 14px; font-weight: 700; color: var(--accent); white-space: nowrap; }
.corr-meter { display: flex; gap: 3px; flex: 1; }
.corr-meter i { flex: 1; height: 6px; border-radius: 3px; background: var(--border); transition: background .25s var(--ease); }
.corr-meter i.on { background: var(--accent); }
.corr-lvl-top em { font-style: normal; font-size: 11.5px; font-weight: 600; color: var(--muted); white-space: nowrap; }
.corr-lvl-txt { margin-top: 5px; font-size: 12.5px; line-height: 1.4; color: var(--muted); }
@media (max-height: 760px) {
    .corr-lvl { margin-top: 8px; padding: 8px 10px; }
    .corr-lvl-txt { margin-top: 3px; font-size: 12px; }
}
@media (max-height: 640px) {
    .corr-lvl-txt { display: none; }
}

/* ---------- депозит: «это не оплата бота» — крупно и до сумм ---------- */
.corr-safe {
    display: flex; gap: 12px; align-items: center; margin-top: 12px; padding: 12px 14px;
    border-radius: 16px; border: 1px solid var(--border);
    background: var(--surface); background: color-mix(in srgb, var(--up) 12%, var(--surface));
}
.corr-safe i {
    flex-shrink: 0; width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center;
    background: var(--up); color: #fff;
}
.corr-safe i svg { width: 20px; height: 20px; }
.corr-safe b { display: block; font-size: 16px; font-weight: 700; color: var(--text); }
.corr-safe span { display: block; margin-top: 2px; font-size: 13px; line-height: 1.4; color: var(--muted); }
.corr-safe + .corr-dep { margin-top: 12px; }
.corr-dir-s b { color: var(--text); font-weight: 800; letter-spacing: .03em; }
@media (max-height: 760px) {
    .corr-safe { margin-top: 10px; padding: 10px 12px; }
    .corr-safe i { width: 34px; height: 34px; }
    .corr-safe b { font-size: 15px; }
    .corr-safe span { font-size: 12.5px; }
    .corr-safe + .corr-dep { margin-top: 10px; }
}

/* ---------- строки в карточке: выходы («счёт уже был», «поддержка») и доводы ---------- */
.corr-opts, .corr-perks {
    width: 100%; margin-top: 18px; border-radius: 16px; overflow: hidden; text-align: start;
    background: var(--surface); border: 1px solid var(--border);
}
.corr-opts button, .corr-perks > div {
    display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 14px;
}
.corr-opts button {
    background: transparent; border: none; cursor: pointer; text-align: start;
    font-family: var(--font); color: var(--text);
    transition: background .15s var(--ease);
}
.corr-opts button:active { background: var(--accent-soft); }
.corr-opts button + button, .corr-perks > div + div { border-top: 1px solid var(--border); }
.corr-opts i, .corr-perks i {
    flex-shrink: 0; width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center;
    background: var(--accent-soft); color: var(--accent);
}
.corr-perks i.up { background: var(--surface); background: color-mix(in srgb, var(--up) 16%, transparent); color: var(--up); }
.corr-opts i svg, .corr-perks i svg { width: 19px; height: 19px; }
.corr-opts span, .corr-perks span { flex: 1; min-width: 0; }
.corr-opts span > b, .corr-perks span > b {
    display: block; font-size: 15px; font-weight: 600; line-height: 1.3; color: var(--text);
}
.corr-opts em, .corr-perks em {
    display: block; margin-top: 2px; font-style: normal; font-size: 13px; line-height: 1.4; color: var(--muted);
}
.corr-perks em b { color: var(--text); font-weight: 700; }
.corr-chev { flex-shrink: 0; width: 18px; height: 18px; color: var(--muted); }
[dir="rtl"] .corr-chev { transform: scaleX(-1); }
.corr-ghost b { color: var(--accent); font-weight: 700; white-space: nowrap; }
@media (max-height: 760px) {
    .corr-opts, .corr-perks { margin-top: 14px; }
    .corr-opts button, .corr-perks > div { padding: 10px 12px; }
    .corr-opts i, .corr-perks i { width: 32px; height: 32px; }
}
@media (max-height: 680px) {
    .corr-center { padding-bottom: 8px; }
    .corr-center .corr-h { margin-top: 16px; }
    .corr-center .corr-live { margin-top: 12px; }
    .corr-opts, .corr-perks { margin-top: 12px; }
    .corr-opts span > b, .corr-perks span > b { font-size: 14.5px; }
    .corr-opts em, .corr-perks em { font-size: 12.5px; }
}

/* вставки слева направо внутри арабского текста (суммы, названия кнопок
   брокера) — изолированы, иначе знак «−» и кавычки уезжают не туда */
.corr b[dir="ltr"] { unicode-bidi: isolate; direction: ltr; }
/* суммы в чеке: «+$25» в арабской строке иначе читается как «$25+» */
.corr-row > b { unicode-bidi: isolate; direction: ltr; }

/* ---------- «уже есть счёт»: вопросы и гайд перехода по шагам ---------- */
.corr-h-gap { margin-top: 14px; }
.corr-gsteps { list-style: none; padding: 0; margin: 14px 0 0; text-align: start; }
.corr-gsteps li { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.corr-gsteps li:last-child { border-bottom: none; }
.corr-gsteps li > i {
    flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center;
    font: 800 12px var(--font); font-style: normal; color: var(--muted); border: 1.5px solid var(--border);
}
.corr-gsteps li > i svg { width: 14px; height: 14px; }
.corr-gsteps li.done > i { background: var(--up); border-color: var(--up); color: #fff; }
.corr-gsteps li.cur > i { border-color: var(--accent); color: var(--accent); }
.corr-gsteps li.lock { opacity: .45; }
.corr-gsteps li > div { flex: 1; min-width: 0; padding-top: 3px; }
.corr-gsteps li > div > b { display: block; font-size: 15px; font-weight: 600; line-height: 1.35; }
.corr-gsteps li.done > div > b { color: var(--muted); font-weight: 500; }
.corr-gsteps li > div > span { display: block; margin-top: 4px; font-size: 13.5px; line-height: 1.5; color: var(--muted); }
.corr-gsteps li > div > span b { color: var(--text); font-weight: 600; white-space: nowrap; }
/* карусель кадров в шаге гайда: листается пальцем, точки — где ты */
.corr-car { margin-top: 10px; }
.corr-car-track {
    display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
    -webkit-overflow-scrolling: touch; border-radius: 16px;
}
.corr-car-track::-webkit-scrollbar { display: none; }
.corr-car-slide { flex: 0 0 100%; margin: 0; scroll-snap-align: center; scroll-snap-stop: always; }
/* Кадр — участок экрана вокруг подсветки (почти квадрат): на всю ширину,
   а по высоте не больше, чем остаётся до кнопки, — тогда он чуть
   подрезается сверху и снизу, подсветка стоит по центру и не уходит. */
.corr-car-shot {
    position: relative; overflow: hidden; width: 100%; aspect-ratio: 480 / 500;
    max-height: max(170px, calc(var(--app-h, 100vh) - 474px));
    background: #000; border: 1px solid var(--border); border-radius: 16px;
}
.corr-car-shot img { display: block; width: 100%; height: 100%; object-fit: cover; }
.corr-car-shot i {
    position: absolute; top: 8px; right: 10px; padding: 3px 8px; border-radius: 999px;
    font: 700 11px var(--font); font-style: normal; color: #fff; background: rgba(0, 0, 0, .6);
}
.corr-car-slide figcaption {
    margin-top: 8px; text-align: center; font-size: 14px; line-height: 1.4; color: var(--text);
    unicode-bidi: plaintext;
}
.corr-car-slide figcaption b { font-weight: 600; white-space: nowrap; }
.corr-car-dots { display: flex; justify-content: center; gap: 6px; margin-top: 8px; }
.corr-car-dots span {
    width: 6px; height: 6px; border-radius: 3px; background: var(--border); cursor: pointer;
    transition: width .2s var(--ease), background .2s var(--ease);
}
.corr-car-dots span.on { width: 18px; background: var(--accent); }
@media (prefers-reduced-motion: reduce) { .corr-car-dots span { transition: none; } }

/* ===== Коридор v2 (под флагом CORR_V2) ===== */
.corr-sigcard { display: flex; gap: 11px; align-items: center; padding: 11px 13px; border-radius: 16px; margin-bottom: 14px;
    background: var(--surface); background: color-mix(in srgb, var(--up) 11%, transparent); }
.corr-sigcard.down { background: var(--surface); background: color-mix(in srgb, var(--down) 11%, transparent); }
.corr-sigcard .corr-dir-b { flex-shrink: 0; width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center; background: var(--up); }
.corr-sigcard.down .corr-dir-b { background: var(--down); }
.corr-sigcard .corr-dir-b svg { width: 18px; height: 18px; }
.corr-sigcard b { display: block; font-size: 14px; font-weight: 700; color: var(--text); }
.corr-sigcard span { display: block; font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.corr-perks2 { list-style: none; padding: 0; margin: 10px 0 0; display: flex; flex-direction: column; gap: 7px; }
.corr-perks2 li { display: flex; gap: 9px; align-items: center; font-size: 14px; font-weight: 500; color: var(--text); }
.corr-perks2 li svg { flex-shrink: 0; width: 16px; height: 16px; color: var(--up); }
.corr-next { width: 100%; margin-top: 14px; padding: 13px 14px; border-radius: 16px; background: var(--surface); text-align: start; }
.corr-next-t { font-size: 12.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.corr-next ol { list-style: none; padding: 0; margin: 10px 0 0; display: flex; flex-direction: column; gap: 8px; }
.corr-next li { display: flex; gap: 10px; align-items: center; font-size: 14.5px; font-weight: 600; color: var(--text); }
.corr-next li i { flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-style: normal;
    font-size: 12px; font-weight: 800; background: var(--accent); color: #fff; }

/* ===== Коридор v2: один стиль с новым приложением (тёмная палитра proto.html) ===== */
:root.corr-v2 {
    --bg: #121211; --surface: #1B1A18; --text: #F5F3EE; --muted: #9A978F; --border: #2E2D2A;
    --accent: #E08A6B; --accent-press: #C9744F; --accent-soft: rgba(224, 138, 107, .14);
    --up: #3CCB8E; --down: #F2645F;
    color-scheme: dark;
}
:root.corr-v2, :root.corr-v2 body { background: #121211; color: #F5F3EE; }
:root.corr-v2 .corr { background: radial-gradient(120% 55% at 50% -12%, rgba(224, 138, 107, .12), transparent 62%), #121211; }
:root.corr-v2 .corr .btn { color: #1a1310; border-radius: 16px; font-weight: 600; box-shadow: none; }
:root.corr-v2 .corr-chip, :root.corr-v2 .corr .lang-fab { background: #1B1A18; border-color: #2E2D2A; color: #F5F3EE; }
:root.corr-v2 .corr-st.done .corr-dot, :root.corr-v2 .corr-note-i, :root.corr-v2 .corr-next li i, :root.corr-v2 .corr-pin { color: #1a1310; }
:root.corr-v2 .corr-pin { box-shadow: 0 0 0 3px #121211, 0 4px 14px rgba(0, 0, 0, .45); }
:root.corr-v2 .corr-free, :root.corr-v2 .corr-dep, :root.corr-v2 .corr-opts, :root.corr-v2 .corr-perks,
:root.corr-v2 .corr-idcard, :root.corr-v2 .corr-next, :root.corr-v2 .corr-meta div, :root.corr-v2 .corr-status,
:root.corr-v2 .corr-live, :root.corr-v2 .corr-card { background: #1B1A18; border: 1px solid #2E2D2A; }
:root.corr-v2 .corr-lvl, :root.corr-v2 .corr-tile { background: #121211; }
:root.corr-v2 .corr-tile.on { background: rgba(224, 138, 107, .12); box-shadow: none; }
:root.corr-v2 .corr-form img, :root.corr-v2 .corr-shot { border-color: #2E2D2A; }
/* приветствие: логотип спокойно «дышит», под ним — «1 сигнал — бесплатно» */
:root.corr-v2 .corr-art .corr-logo { animation: corrBreath 5s ease-in-out infinite; }
:root.corr-v2 .corr-art .corr-halo { animation: none; }
:root.corr-v2 .corr-aura { opacity: .32; }
.corr-try {
    align-self: end; justify-self: center; position: relative; z-index: 2; margin-bottom: 4px;
    padding: 6px 13px; border-radius: 999px; font-size: 12.5px; font-weight: 700; letter-spacing: .02em;
    color: #F2B498; background: rgba(224, 138, 107, .12); border: 1px solid rgba(224, 138, 107, .35);
}
@keyframes corrBreath { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } }
/* направление — как карточка сигнала в приложении */
:root.corr-v2 .corr-dir {
    --dr: 60, 203, 142; position: relative; overflow: hidden; border: 1px solid rgba(var(--dr), .35);
    background: radial-gradient(130% 160% at 0% 0%, rgba(var(--dr), .26), transparent 62%), #1B1A18;
}
:root.corr-v2 .corr-dir.down { --dr: 242, 100, 95; }
:root.corr-v2 .corr-dir-b { background: rgb(var(--dr)); box-shadow: 0 0 0 6px rgba(var(--dr), .14), 0 10px 28px rgba(var(--dr), .35); }
:root.corr-v2 .corr-dir-t {
    background: linear-gradient(180deg, #fff 5%, rgb(var(--dr)) 85%); -webkit-background-clip: text; background-clip: text;
    color: transparent; font-size: 30px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase;
}
:root.corr-v2 .corr-dir-s { color: #c9c5bc; }
:root.corr-v2 .corr-dir-s b { color: #fff; }
/* уровень после доступа — как карточка уровня в приложении */
:root.corr-v2 .corr-level {
    background: linear-gradient(150deg, rgba(224, 138, 107, .28), rgba(224, 138, 107, .06) 70%), #1B1A18;
    border: 1px solid rgba(224, 138, 107, .4); box-shadow: none; color: #F5F3EE;
}
:root.corr-v2 .corr-level span { color: #F2B498; opacity: 1; }
@media (max-height: 760px) { :root.corr-v2 .corr-dir-t { font-size: 25px; } }
@media (prefers-reduced-motion: reduce) { :root.corr-v2 .corr-art .corr-logo { animation: none; } }
.corr-coins { position: relative; width: 56px; height: 48px; flex-shrink: 0; }
.corr-coins i {
    position: absolute; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center;
    font-style: normal; font-size: 17px; font-weight: 700; border: 2px solid #121211;
}
.corr-coins i:first-child { left: 0; top: 0; }
.corr-coins i:last-child { left: 18px; top: 12px; }
:root.corr-v2 .corr-form img { filter: brightness(.9); }
@media (max-height: 760px) { .corr-coins { transform: scale(.88); transform-origin: left center; margin-right: -6px; } }

/* ===== Коридор v2: подсказки с подсветкой (анимация лёгкая: без изменения размеров огромной тени) ===== */
#corr-tour { position: fixed; inset: 0; z-index: 90; display: none; -webkit-tap-highlight-color: transparent; }
#corr-tour.on { display: block; }
.ct-hole {
    position: fixed; border-radius: 16px; pointer-events: none;
    box-shadow: 0 0 0 2px rgba(224, 138, 107, .95), 0 0 0 7px rgba(224, 138, 107, .18), 0 0 0 9999px rgba(6, 6, 5, .72);
}
.ct-hole::after {
    content: ""; position: absolute; inset: -5px; border-radius: 21px; border: 2px solid rgba(242, 180, 152, .9);
    opacity: 0; will-change: transform, opacity;
}
#corr-tour.in .ct-hole::after { animation: ctPop .5s ease-out both; }
.ct-tip {
    position: fixed; background: #232220; border: 1px solid #3a3834; border-radius: 18px; padding: 14px 16px 10px;
    color: #F5F3EE; box-shadow: 0 18px 50px rgba(0, 0, 0, .55); will-change: transform, opacity; text-align: start;
}
#corr-tour.in .ct-tip { animation: ctIn .22s ease-out both; }
.ct-tip b { display: block; font-size: 17px; font-weight: 700; }
.ct-tip p { font-size: 14px; line-height: 1.45; color: #cfcac0; margin: 5px 0 0; }
.ct-btns { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; }
.ct-skip { font-size: 13.5px; font-weight: 600; color: #9A978F; cursor: pointer; padding: 8px 2px; }
#corr-tour .ct-next {
    display: inline-flex; align-items: center; justify-content: center; width: auto; flex: none; margin-left: auto;
    padding: 10px 18px; font: 600 14.5px var(--font); border-radius: 12px; border: none; cursor: pointer;
    background: #E08A6B; color: #1a1310;
}
.ct-arr { position: absolute; width: 14px; height: 14px; background: #232220; transform: rotate(45deg); }
.ct-arr.up { top: -8px; border-left: 1px solid #3a3834; border-top: 1px solid #3a3834; }
.ct-arr.dn { bottom: -8px; border-right: 1px solid #3a3834; border-bottom: 1px solid #3a3834; }
@keyframes ctPop { from { opacity: .95; transform: scale(1.07); } to { opacity: 0; transform: scale(1); } }
@keyframes ctIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { #corr-tour.in .ct-hole::after, #corr-tour.in .ct-tip { animation: none; } }
/* логотип «дышит» на своём слое — без перерисовки соседей */
:root.corr-v2 .corr-art .corr-logo { will-change: transform; }

/* ===== Коридор v2: язык — «Русский ▾» на каждом экране и выбор шторкой ===== */
:root.corr-v2 .corr .lang-fab { gap: 6px; padding: 0 10px 0 11px; }
.lang-fab-nm { display: none; }
:root.corr-v2 .corr .lang-fab .lang-fab-code { display: none; }
:root.corr-v2 .corr .lang-fab .lang-fab-nm { display: inline-flex; align-items: center; gap: 4px; font-size: 13.5px; font-weight: 600; letter-spacing: 0; text-transform: none; }
.lang-fab-nm .cd { width: 13px; height: 13px; opacity: .55; }
#corr-lang, #corr-sheet { position: fixed; inset: 0; z-index: 400; background: rgba(0, 0, 0, .55); opacity: 0; pointer-events: none; transition: opacity .25s ease; }
#corr-lang.on, #corr-sheet.on { opacity: 1; pointer-events: auto; }
.cl-sh { position: absolute; left: 0; right: 0; bottom: 0; max-width: 480px; max-height: 80vh; margin: 0 auto; display: flex; flex-direction: column;
    padding: 8px 14px calc(14px + env(safe-area-inset-bottom, 0px)); border-radius: 26px 26px 0 0; background: #1d1c1a; border-top: 1px solid #34322e;
    transform: translateY(100%); transition: transform .38s cubic-bezier(.16, 1, .3, 1); }
#corr-lang.on .cl-sh, #corr-sheet.on .cl-sh { transform: none; }
/* «Зачем нужен депозит?» — три коротких ответа и пополнение */
.cw-list { overflow-y: auto; display: flex; flex-direction: column; gap: 14px; padding: 2px 2px 16px; -webkit-overflow-scrolling: touch; }
.cw-row { display: flex; gap: 12px; align-items: flex-start; }
.cw-row i { flex: none; width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center; background: rgba(224, 138, 107, .16); color: #E08A6B; }
.cw-row i.up { background: rgba(60, 203, 142, .16); color: #3CCB8E; }
.cw-row i.amb { background: rgba(232, 176, 75, .16); color: #E8B04B; }
.cw-row i svg { width: 18px; height: 18px; }
.cw-row b { display: block; font-size: 15.5px; font-weight: 700; color: #F5F3EE; }
.cw-row span { display: block; margin-top: 3px; font-size: 13.5px; line-height: 1.45; color: #a9a59c; }
.cw-fine { margin: 0 2px; font-size: 12.5px; line-height: 1.45; color: #7d7a72; }
.cw-fine b { color: #cfcac0; }
#corr-sheet .btn { flex: none; width: 100%; }
/* карточка «Это не оплата бота» — кнопка к ответу */
.cv-why { width: 100%; font: inherit; color: inherit; text-align: start; cursor: pointer; }
.cv-why > div { flex: 1; min-width: 0; }
.cv-why:active { transform: scale(.99); }
.cv-state .cv-why { margin-top: 16px; }
.cl-grab { flex: none; width: 38px; height: 5px; margin: 0 auto 10px; border-radius: 3px; background: #403e3a; }
.cl-h { flex: none; display: flex; align-items: center; gap: 10px; padding: 0 2px 12px; }
.cl-ic { width: 34px; height: 34px; border-radius: 11px; display: grid; place-items: center; background: rgba(224, 138, 107, .16); color: #E08A6B; }
.cl-ic svg { width: 18px; height: 18px; }
.cl-h b { flex: 1; font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", Inter, "Segoe UI", Roboto, sans-serif; font-size: 20px; font-weight: 700; letter-spacing: -.01em; color: #F5F3EE; }
.cl-h button { padding: 6px; background: none; border: 0; font: inherit; font-size: 15px; font-weight: 700; color: #E08A6B; cursor: pointer; }
.cl-list { overflow-y: auto; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 2px; -webkit-overflow-scrolling: touch; }
.cl-row { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 12px; border-radius: 14px; background: #1B1A18; border: 1px solid #2E2D2A;
    color: #F5F3EE; font: inherit; font-size: 15px; font-weight: 600; text-align: start; cursor: pointer; transition: border-color .2s, background .2s; }
.cl-row:active { transform: scale(.98); }
.cl-row .lf { flex: none; font-size: 20px; line-height: 1; }
.cl-row .nm { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cl-row .ck { flex: none; width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; background: #E08A6B; color: #1a1310;
    opacity: 0; transform: scale(.6); transition: opacity .2s, transform .2s; }
.cl-row .ck svg { width: 12px; height: 12px; }
.cl-row.on { border-color: rgba(224, 138, 107, .8); background: linear-gradient(160deg, rgba(224, 138, 107, .16), rgba(224, 138, 107, .03) 70%), #1B1A18; }
.cl-row.on .ck { opacity: 1; transform: none; }

/* ===== Коридор v2: один стиль шагов — кольцо со значком, карточки как в приложении, всё на одном экране ===== */
:root.corr-v2 .corr-h, :root.corr-v2 .corr-level b, :root.corr-v2 .corr-row.total > b { font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", Inter, "Segoe UI", Roboto, sans-serif; font-weight: 700; letter-spacing: -.02em; }
.cv-rg { position: relative; width: 60px; height: 60px; flex: none; display: grid; place-items: center; }
.cv-rg > svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.cv-rg circle { fill: none; stroke-width: 3; }
.cv-rg .bg { stroke: rgba(var(--c), .2); }
.cv-rg .pg { stroke: rgb(var(--c)); stroke-linecap: round; stroke-dasharray: 219.9; stroke-dashoffset: 0; }
.cv-rg.spin .pg { stroke-dashoffset: 160; }
.cv-rg.spin > svg { animation: cvSpin 1.1s linear infinite; }
@keyframes cvSpin { from { transform: rotate(-90deg); } to { transform: rotate(270deg); } }
.cv-bd { width: 72%; height: 72%; border-radius: 50%; display: grid; place-items: center; color: #fff;
    background: radial-gradient(circle at 34% 26%, rgba(255, 255, 255, .42), transparent 52%), linear-gradient(170deg, rgba(255, 255, 255, .08), rgba(0, 0, 0, .18)), rgb(var(--c));
    box-shadow: 0 12px 26px -10px rgba(var(--c), .95), inset 0 -3px 8px rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .35); }
.cv-bd svg { width: 46%; height: 46%; }
/* карточка-заголовок экранов-действий */
.cv-hero {
    position: relative; display: flex; align-items: center; gap: 14px; padding: 15px 16px; border-radius: 22px; overflow: hidden; isolation: isolate;
    border: 1px solid transparent; animation: cvIn .5s cubic-bezier(.16, 1, .3, 1) both;
    background: linear-gradient(#181716, #181716) padding-box, linear-gradient(130deg, rgba(var(--c), .55), rgba(var(--c), .06) 45%, rgba(var(--c), .25)) border-box;
}
.cv-hero::before { content: ""; position: absolute; left: -8%; top: 50%; z-index: -1; width: 200px; height: 200px; margin-top: -100px; border-radius: 50%;
    background: radial-gradient(circle, rgba(var(--c), .26), transparent 65%); }
.cv-tx { flex: 1; min-width: 0; }
.cv-eb { font-size: 11.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: rgb(var(--c)); }
.cv-tx h1 { margin: 3px 0 0; font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", Inter, "Segoe UI", Roboto, sans-serif; font-size: 21px; line-height: 1.15; font-weight: 700; letter-spacing: -.02em; color: #F5F3EE; }
.cv-tx p { margin: 5px 0 0; font-size: 13.5px; line-height: 1.4; color: #9A978F; }
.cv-tx p b { color: #F5F3EE; font-weight: 600; }
/* экраны-состояния */
.corr-body.is-center > .cv-state { margin: auto 0; }
.cv-state { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 6px 0; isolation: isolate; }
.cv-state::before { content: ""; position: absolute; left: 50%; top: -60px; z-index: -1; width: 340px; height: 340px; margin-left: -170px; border-radius: 50%;
    background: radial-gradient(circle, rgba(var(--c), .16), transparent 62%); pointer-events: none; }
.cv-state > .cv-rg { width: 92px; height: 92px; animation: cvPop .6s cubic-bezier(.2, 1.4, .4, 1) both; }
.cv-state > h1 { margin: 18px 0 0; font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", Inter, "Segoe UI", Roboto, sans-serif; font-size: 25px; line-height: 1.15; font-weight: 700; letter-spacing: -.02em; color: #F5F3EE; }
.cv-state > p { max-width: 32ch; margin: 8px auto 0; font-size: 15px; line-height: 1.45; color: #9A978F; }
.cv-state > p b { color: #F5F3EE; font-weight: 600; }
.cv-state > * + * { animation: cvIn .5s cubic-bezier(.16, 1, .3, 1) both; }
.cv-state > :nth-child(3) { animation-delay: .06s; } .cv-state > :nth-child(4) { animation-delay: .12s; } .cv-state > :nth-child(n+5) { animation-delay: .18s; }
.cv-state .corr-live { margin-top: 14px; }
.cv-state .corr-opts, .cv-state .corr-perks, .cv-state .corr-note, .cv-state .corr-idcard, .cv-state .corr-next { width: 100%; margin-top: 16px; text-align: start; }
@keyframes cvIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes cvPop { 0% { opacity: 0; transform: scale(.6); } 70% { opacity: 1; transform: scale(1.06); } 100% { transform: none; } }
/* счёт: форма брокера в «окне браузера» рядом с шагами */
.cv-got { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; padding: 9px 12px; border-radius: 14px; background: rgba(60, 203, 142, .09);
    border: 1px solid rgba(60, 203, 142, .3); font-size: 13px; color: #cfe9dc; white-space: nowrap; animation: cvIn .45s both; }
.cv-got svg { width: 16px; height: 16px; flex: none; color: #3CCB8E; }
.cv-got span { overflow: hidden; text-overflow: ellipsis; }
.cv-got b { color: #3CCB8E; font-weight: 700; }
.cv-reg { display: flex; align-items: center; gap: 14px; margin-top: 12px; animation: cvIn .5s .08s cubic-bezier(.16, 1, .3, 1) both; }
.cv-form { flex: 0 0 50%; border-radius: 14px; overflow: hidden; background: #fff; box-shadow: 0 0 0 1px #2E2D2A, 0 18px 38px rgba(0, 0, 0, .5); }
.cv-url { display: flex; align-items: center; justify-content: center; gap: 4px; padding: 5px 8px; background: #ebebeb; color: #5b5b5b; font-size: 10px; font-weight: 600; }
.cv-url svg { width: 9px; height: 9px; }
.cv-shot { position: relative; }
.cv-shot img { display: block; width: 100%; height: auto; }
.cv-shot .corr-pin { width: 20px; height: 20px; font-size: 11px; }
.cv-steps { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; list-style: none; }
.cv-steps li { display: flex; align-items: flex-start; gap: 9px; font-size: 13.5px; line-height: 1.35; color: #d6d3cb; }
.cv-steps li i { flex: none; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 12px; font-weight: 800;
    background: #E08A6B; color: #1a1310; }
.cv-steps li b { color: #F5F3EE; }
/* депозит: суммы плитками в цвете модели */
:root.corr-v2 .cv-safe { margin-top: 10px; padding: 11px 12px; animation: cvIn .5s .06s cubic-bezier(.16, 1, .3, 1) both; }
:root.corr-v2 .cv-safe b { font-size: 15px; }
:root.corr-v2 .cv-safe span { font-size: 12.5px; }
:root.corr-v2 .cv-safe + .corr-dep { margin-top: 10px; }
.cv-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.cv-tile { position: relative; padding: 11px 4px 10px; border-radius: 16px; background: #1B1A18; border: 1px solid #2E2D2A; color: #F5F3EE; font: inherit;
    text-align: center; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: transform .15s ease, border-color .2s, background .2s, box-shadow .2s; }
.cv-tile b { display: block; font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", Inter, "Segoe UI", Roboto, sans-serif; font-size: 21px; font-weight: 800; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.cv-tile span { display: block; margin-top: 2px; font-size: 11.5px; font-weight: 600; color: #9A978F; }
.cv-tile.on { border-color: rgba(var(--c), .9); background: linear-gradient(160deg, rgba(var(--c), .2), rgba(var(--c), .04) 70%), #1B1A18; box-shadow: 0 10px 26px -12px rgba(var(--c), .8); }
.cv-tile.on span { color: rgb(var(--c)); }
.cv-tile:active { transform: scale(.97); }
.cv-perks { display: flex; flex-direction: column; gap: 8px; margin: 10px 0 0; padding: 12px 14px; list-style: none; border-radius: 16px;
    background: linear-gradient(160deg, rgba(var(--c), .1), transparent 70%), #1B1A18; border: 1px solid #2E2D2A; }
.cv-perks li { display: flex; align-items: center; gap: 9px; font-size: 14px; line-height: 1.3; color: #e9e6df; animation: cvIn .4s cubic-bezier(.16, 1, .3, 1) both;
    animation-delay: calc(var(--i) * 60ms); }
.cv-perks li svg { width: 16px; height: 16px; flex: none; color: rgb(var(--c)); }
.cv-rcpt { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 10px; padding: 8px 10px 8px 12px; border-radius: 14px;
    background: rgba(60, 203, 142, .08); border: 1px solid rgba(60, 203, 142, .25); font-size: 13px; color: #cfe9dc; }
.cv-rcpt > span { display: flex; align-items: center; gap: 6px; }
.cv-rcpt > b { color: #3CCB8E; font-variant-numeric: tabular-nums; white-space: nowrap; }
/* доступ открыт: уровень в цвете модели */
.cv-level { width: 100%; margin-top: 16px; padding: 13px 16px; border-radius: 18px; text-align: start;
    background: linear-gradient(150deg, rgba(var(--c), .22), rgba(var(--c), .04) 70%), #141413; border: 1px solid rgba(var(--c), .45); }
.cv-level span { font-size: 11.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: rgb(var(--c)); }
.cv-level b { display: block; margin-top: 3px; font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", Inter, "Segoe UI", Roboto, sans-serif; font-size: 24px; font-weight: 800; letter-spacing: -.01em; color: #F5F3EE; }
.cv-level em { display: block; margin-top: 2px; font-style: normal; font-size: 13px; color: #a09d96; }
.cv-hero + .cs-list { margin-top: 12px; }
/* невысокий экран: всё то же, только плотнее */
@media (max-height: 700px) {
    .cv-hero { padding: 12px 14px; gap: 12px; }
    .cv-hero .cv-rg { width: 52px; height: 52px; }
    .cv-tx h1 { font-size: 19px; }
    .cv-tx p { font-size: 13px; margin-top: 3px; }
    .cv-state > .cv-rg { width: 76px; height: 76px; }
    .cv-state > h1 { margin-top: 14px; font-size: 22px; }
    .cv-state > p { font-size: 14px; }
    .cv-state .corr-opts, .cv-state .corr-perks, .cv-state .corr-note, .cv-state .corr-idcard, .cv-state .corr-next, .cv-level { margin-top: 12px; }
    .cv-reg { margin-top: 10px; gap: 12px; }
    .cv-steps { gap: 9px; }
    .cv-steps li { font-size: 13px; }
    .cv-tile { padding: 9px 4px 8px; }
    .cv-tile b { font-size: 19px; }
    .cv-perks { padding: 10px 12px; gap: 6px; }
    .cv-perks li { font-size: 13.5px; }
    .cv-got { padding: 7px 10px; margin-bottom: 8px; }
    .cs-row { padding: 10px 10px 10px 12px; }
}
/* совсем невысокий экран (iPhone SE и похожие, окно Telegram ~600) — ещё плотнее; «Шаг N из 3» видно по шкале сверху */
@media (max-height: 640px) {
    :root.corr-v2 .corr-steps { margin-top: 8px; }
    :root.corr-v2 .corr-st-l { margin-top: 4px; font-size: 11px; }
    :root.corr-v2 .corr-dot { width: 22px; height: 22px; }
    .cv-eb { display: none; }
    .cv-hero { padding: 10px 12px; }
    .cv-hero .cv-rg { width: 46px; height: 46px; }
    .cv-tx h1 { margin-top: 0; font-size: 18px; }
    .cv-tx p { font-size: 12.5px; }
    .cv-state { padding: 0; }
    .cv-state > .cv-rg { width: 62px; height: 62px; }
    .cv-state > h1 { margin-top: 10px; font-size: 20px; }
    .cv-state > p { margin-top: 5px; font-size: 13.5px; line-height: 1.4; }
    .cv-state .corr-live { margin-top: 10px; padding: 5px 11px; }
    .cv-state .corr-opts, .cv-state .corr-perks, .cv-state .corr-note, .cv-state .corr-idcard, .cv-state .corr-next, .cv-level { margin-top: 10px; }
    .cv-state .corr-opts button, .cv-state .corr-perks > div { padding: 9px 12px; gap: 10px; }
    .cv-state .corr-opts i, .cv-state .corr-perks i { width: 30px; height: 30px; border-radius: 9px; }
    .cv-level { padding: 10px 14px; }
    .cv-level b { font-size: 21px; }
    .cv-state .corr-next { padding: 10px 12px; }
    .cv-state .corr-next ol { margin-top: 7px; gap: 6px; }
    .cv-state .corr-next li { font-size: 13.5px; }
    :root.corr-v2 .cv-safe { margin-top: 8px; padding: 8px 11px; }
    :root.corr-v2 .cv-safe i { width: 30px; height: 30px; }
    :root.corr-v2 .cv-safe + .corr-dep { margin-top: 8px; }
    .cv-tile { padding: 7px 4px 6px; border-radius: 14px; }
    .cv-tile b { font-size: 18px; }
    .cv-perks { margin-top: 8px; padding: 9px 12px; gap: 5px; }
    .cv-perks li { font-size: 13px; }
    .cv-rcpt { margin-top: 8px; padding: 5px 8px 5px 10px; }
    :root.corr-v2 .corr-fine { margin-top: 6px; }
    .cv-reg { margin-top: 8px; }
}
@media (prefers-reduced-motion: reduce) {
    .cv-hero, .cv-state *, .cv-reg, .cv-got, .cv-perks li, :root.corr-v2 .cv-safe { animation-duration: .01s !important; animation-delay: 0s !important; }
    .cv-rg.spin .pg { animation-duration: 3s !important; }
}

/* ===== Коридор v2: бесплатный сигнал как в приложении (выбор пары -> анализ -> направление) ===== */
.cs-eb { margin: 2px 0 6px; font-size: 13px; font-weight: 700; letter-spacing: .02em; color: #F2B498; }
.cs-list { display: flex; flex-direction: column; gap: 10px; margin-top: 18px; }
.cs-row {
    display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 12px 12px 14px; border-radius: 20px;
    background: #1B1A18; border: 1px solid #2E2D2A; color: #F5F3EE; font: inherit; text-align: start; cursor: pointer;
    -webkit-tap-highlight-color: transparent; transition: transform .15s ease, border-color .2s; animation: csIn .55s cubic-bezier(.16, 1, .3, 1) both;
}
.cs-row:nth-child(2) { animation-delay: .07s; } .cs-row:nth-child(3) { animation-delay: .14s; }
.cs-row:active { transform: scale(.98); border-color: rgba(224, 138, 107, .5); }
.cs-row .corr-coins { flex: none; }
.cs-tx { flex: 1; min-width: 0; }
.cs-tx b { display: block; font-size: 17px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cs-tx small { display: block; margin-top: 2px; font-size: 13px; color: #9A978F; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cs-tx small.hi { color: #F2B498; }
.cs-go { flex: none; min-width: 76px; padding: 8px 10px; border-radius: 14px; text-align: center; background: rgba(224, 138, 107, .16); }
.cs-go b { display: block; font-size: 15px; font-weight: 700; color: #F2B498; }
.cs-go small { display: block; font-size: 11.5px; font-weight: 600; color: #d09c86; }
@keyframes csIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.cs-pair { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 20px; background: #1B1A18; border: 1px solid #2E2D2A; }
.cs-pair b { display: block; font-size: 17px; font-weight: 700; }
.cs-pair small { display: block; margin-top: 1px; font-size: 13px; color: #9A978F; }
/* карточка анализа / направления — как в приложении */
.cs-card {
    --c: 60, 203, 142; position: relative; display: flex; align-items: center; gap: 16px; margin-top: 10px; padding: 18px; border-radius: 22px;
    overflow: hidden; isolation: isolate; color: rgb(var(--c)); border: 1px solid transparent; transition: opacity .4s;
    background: linear-gradient(#181716, #181716) padding-box, linear-gradient(130deg, rgba(var(--c), .6), rgba(var(--c), .06) 45%, rgba(var(--c), .3)) border-box;
}
.cs-card.dn { --c: 242, 100, 95; } .cs-card.an { --c: 224, 138, 107; } .cs-card.gone { opacity: .5; }
.cs-card::before { content: ""; position: absolute; left: 2%; top: 50%; z-index: 0; width: 220px; height: 220px; margin-top: -110px; border-radius: 50%;
    background: radial-gradient(circle, rgba(var(--c), .3), transparent 65%); }
.cs-card.an::before { animation: csBreath 2.4s ease-in-out infinite; }
@keyframes csBreath { 50% { opacity: .45; transform: scale(1.12); } }
.cs-rg { position: relative; z-index: 2; width: 76px; height: 76px; flex: none; display: grid; place-items: center; }
.cs-rg > svg { position: absolute; inset: 0; width: 76px; height: 76px; transform: rotate(-90deg); }
.cs-rg circle { fill: none; stroke-width: 3; }
.cs-rg .bg { stroke: rgba(var(--c), .18); }
.cs-rg .pg { stroke: rgb(var(--c)); stroke-linecap: round; stroke-dasharray: 219.9; transition: stroke-dashoffset .8s ease; }
.cs-bd { position: relative; width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center;
    background: radial-gradient(circle at 34% 26%, rgba(255, 255, 255, .42), transparent 52%), linear-gradient(170deg, rgba(255, 255, 255, .08), rgba(0, 0, 0, .18)), rgb(var(--c));
    box-shadow: 0 14px 30px -10px rgba(var(--c), .95), inset 0 -3px 8px rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .35); }
.cs-bd svg { width: 28px; height: 28px; }
.cs-card.an .cs-bd { background: none; box-shadow: none; }
.cs-bd .gl { position: absolute; left: 50%; top: 50%; width: 84px; height: 84px; margin: -42px 0 0 -42px; border-radius: 50%;
    background: radial-gradient(circle, #E08A6B, transparent 70%); opacity: .3; animation: csGlow 1.3s ease-in-out infinite; }
.cs-bd img { position: relative; width: 48px; height: 48px; animation: csSpin 1.8s linear infinite; }
@keyframes csGlow { 0%, 100% { transform: scale(1); opacity: .22; } 50% { transform: scale(1.3); opacity: .45; } }
@keyframes csSpin { to { transform: rotate(360deg); } }
.cs-ctx { position: relative; z-index: 2; flex: 1; min-width: 0; }
.cs-ctx b { display: block; font-size: 32px; line-height: 1; font-weight: 800; letter-spacing: .01em; text-transform: uppercase;
    background: linear-gradient(180deg, #fff 5%, rgb(var(--c)) 80%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.cs-card.an .cs-ctx b { font-size: 24px; line-height: 32px; text-transform: none; letter-spacing: 0;
    background: linear-gradient(90deg, #9b8a80 0%, #fff 45%, #9b8a80 90%); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text;
    animation: csShine 2.2s linear infinite; }
@keyframes csShine { from { background-position: 200% 0; } to { background-position: -200% 0; } }
.cs-ctx small { display: flex; align-items: center; gap: 5px; min-height: 18px; margin-top: 7px; font-size: 13px; color: #9A978F; white-space: nowrap; overflow: hidden; }
.cs-ctx small svg { width: 14px; height: 14px; flex: none; color: rgb(var(--c)); }
.cs-ctx small em { font-style: normal; font-weight: 700; color: #F5F3EE; font-variant-numeric: tabular-nums; }
.cs-ctx small span { animation: csFade .35s ease both; }
.cs-card.rev .cs-bd { animation: csPop .55s cubic-bezier(.2, 1.5, .4, 1) both; }
.cs-card.rev .cs-ctx b { animation: csUp .45s .1s ease both; }
.cs-card.rev::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: radial-gradient(circle at 22% 50%, rgba(var(--c), .6), transparent 62%); animation: csFlash 1.1s ease-out both; }
@keyframes csPop { 0% { transform: scale(.5); opacity: 0; } 70% { transform: scale(1.1); opacity: 1; } 100% { transform: none; } }
@keyframes csUp { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes csFlash { from { opacity: 1; } to { opacity: 0; } }
@keyframes csFade { from { opacity: 0; } to { opacity: 1; } }
.cs-what { margin-top: 12px; text-align: center; font-size: 15px; line-height: 22px; color: #d6d3cb; animation: csFade .5s .2s ease both; }
.cs-what b.u { color: #3CCB8E; } .cs-what b.d { color: #F2645F; }
.cs-rh { display: flex; justify-content: space-between; align-items: baseline; margin: 14px 2px 8px; font-size: 13px; font-weight: 600; color: #9A978F; }
.cs-rh span:last-child { color: #F5F3EE; font-variant-numeric: tabular-nums; }
.cs-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.cs-rt { display: flex; align-items: center; gap: 10px; min-width: 0; height: 54px; padding: 0 10px; border-radius: 15px;
    background: #1B1A18; border: 1px solid #2E2D2A; transition: opacity .35s, border-color .35s; }
.cs-rt .ic { width: 30px; height: 30px; border-radius: 9px; background: #232220; display: grid; place-items: center; flex: none; color: #cfcac0; }
.cs-rt .ic svg { width: 16px; height: 16px; }
.cs-rt .tx { min-width: 0; flex: 1; }
.cs-rt b { display: block; font-size: 13.5px; font-weight: 600; line-height: 17px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cs-rt .v { display: block; height: 16px; margin-top: 2px; font-size: 12.5px; font-weight: 600; line-height: 16px; white-space: nowrap; overflow: hidden;
    text-overflow: ellipsis; color: #9A978F; }
.cs-rt .v.u { color: #3CCB8E; } .cs-rt .v.d { color: #F2645F; }
.cs-rt.wait { opacity: .4; }
.cs-rt.wait .v, .cs-rt.act .v { width: 70%; height: 9px; margin-top: 5px; border-radius: 5px;
    background: linear-gradient(90deg, #262522 25%, #34322e 50%, #262522 75%); background-size: 200% 100%; animation: csSh 1.1s linear infinite; }
.cs-rt.act { border-color: rgba(224, 138, 107, .55); }
.cs-rt.act .ic { color: #E08A6B; animation: csPulse 1.1s ease-in-out infinite; }
.cs-rt.done .v { animation: csBub .5s cubic-bezier(.2, 1.6, .4, 1) both; transform-origin: left center; }
.cs-rt.lk { border-style: dashed; border-color: rgba(232, 176, 75, .45); }
.cs-rt.lk .ic { color: #E8B04B; background: rgba(232, 176, 75, .12); }
.cs-rt.lk .v { color: #E8B04B; }
@keyframes csSh { from { background-position: 200% 0; } to { background-position: -200% 0; } }
@keyframes csPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(224, 138, 107, 0); } 50% { box-shadow: 0 0 0 4px rgba(224, 138, 107, .16); } }
@keyframes csBub { 0% { transform: scale(.3); opacity: 0; } 55% { transform: scale(1.15); opacity: 1; } 100% { transform: none; } }
.cs-fine { margin: 14px 4px 0; font-size: 12.5px; line-height: 1.45; color: #6d6a63; text-align: center; }
.corr-foot .cs-prog { position: relative; overflow: hidden; background: #232220; color: #F5F3EE; cursor: default; font-variant-numeric: tabular-nums; }
.corr-foot .cs-prog .pf { position: absolute; left: 0; top: 0; bottom: 0; width: 100%; transform-origin: left center;
    background: rgba(224, 138, 107, .32); transition: transform .8s ease; }
.corr-foot .cs-prog span { position: relative; }
/* 01.10: три показания в ряд — подпись мелко, значение крупно */
.cs-card + .cs-tiles { margin-top: 12px; }
.cs-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cs-rt { flex-direction: column; align-items: flex-start; gap: 8px; height: auto; padding: 10px 10px 11px; }
.cs-rt .ic { width: 26px; height: 26px; border-radius: 8px; }
.cs-rt .ic svg { width: 15px; height: 15px; }
.cs-rt .tx { width: 100%; }
.cs-rt b { font-size: 12px; font-weight: 500; line-height: 15px; color: #9A978F; }
.cs-rt .v { height: 18px; margin-top: 2px; font-size: 14px; font-weight: 700; line-height: 18px; color: #F5F3EE; }
.cs-rt.wait .v, .cs-rt.act .v { margin-top: 6px; }
/* невысокий экран — чуть плотнее, чтобы результат влез без прокрутки */
@media (max-height: 700px) {
    .cs-card { padding: 14px 16px; margin-top: 8px; }
    .cs-what { margin-top: 8px; }
    .cs-rh { margin: 10px 2px 6px; }
    .cs-fine { margin-top: 10px; }
}
@media (prefers-reduced-motion: reduce) {
    .cs-row, .cs-card, .cs-card *, .cs-card::before, .cs-card::after, .cs-rt, .cs-rt * { animation-duration: .01s !important; animation-iteration-count: 1 !important; }
}

/* ===== Коридор v2: презентация «что внутри» — кинематографичная (только transform/opacity) ===== */
:root.corr-v2 .corr[data-step="show"] { background: #000; }
:root.corr-v2 .corr[data-step="show"] .corr-foot .btn { position: relative; overflow: hidden; }
:root.corr-v2 .corr[data-step="show"] .corr-foot .btn::after {
    content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 45%; pointer-events: none;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .38), transparent);
    transform: translateX(-120%) skewX(-18deg); animation: kxSheen 4.2s 1.2s ease-in-out infinite;
}
@keyframes kxSheen { 0% { transform: translateX(-120%) skewX(-18deg); } 38%, 100% { transform: translateX(330%) skewX(-18deg); } }
/* сцена во всю ширину: у .screen поля 22px, их занимаем, чтобы телефоны выглядывали по краям */
.corr-body.is-show { position: relative; padding: 0; overflow: visible; }
.kx {
    --gx: 22px; --ease: cubic-bezier(.16, 1, .3, 1);
    position: absolute; top: 0; bottom: 0; left: calc(-1 * var(--gx)); right: calc(-1 * var(--gx));
    overflow: hidden; cursor: pointer; -webkit-tap-highlight-color: transparent; user-select: none; -webkit-user-select: none;
}
/* фон: цветные свечения перетекают между битами (меняется только opacity) */
.kx-bg i { position: absolute; left: -15%; right: -15%; bottom: -30%; height: 95%; opacity: 0; transition: opacity 1.4s ease;
    background: radial-gradient(closest-side, rgba(var(--g), .5) 0%, rgba(var(--g), .14) 45%, transparent 100%); }
.kx-bg .g-or { --g: 224, 138, 107; } .kx-bg .g-gr { --g: 60, 203, 142; } .kx-bg .g-rd { --g: 242, 100, 95; }
.kx-bg .g-am { --g: 232, 176, 75; } .kx-bg .g-vi { --g: 170, 140, 255; }
.kx[data-beat="0"] .g-or { opacity: .8; transition-duration: 1.2s; }
.kx[data-beat="6"] .g-or, .kx[data-beat="1"] .g-gr, .kx[data-beat="2"] .g-rd,
.kx[data-beat="3"] .g-am, .kx[data-beat="4"] .g-rd, .kx[data-beat="5"] .g-vi { opacity: 1; }
.kx-bars { position: absolute; top: 4px; left: calc(var(--gx) + 2px); right: calc(var(--gx) + 2px); z-index: 9; display: flex; gap: 4px; }
.kx-bars i { flex: 1; height: 2px; border-radius: 1px; background: rgba(255, 255, 255, .13); overflow: hidden; }
.kx-bars i b { display: block; height: 100%; background: rgba(255, 255, 255, .85); transform: scaleX(0); transform-origin: left center; }
.kx-bars i.done b { transform: none; }
.kx-bars i.cur b { animation: kxBar var(--dur, 3600ms) linear both; }
@keyframes kxBar { to { transform: none; } }
/* кинетическая типографика: строки выезжают из-под маски */
.kx-copy { position: absolute; top: 22px; left: 0; right: 0; z-index: 8; text-align: center; padding: 0 calc(var(--gx) + 6px); }
.kx-eb {
    display: inline-block; min-height: 17px; font-size: 13.5px; font-weight: 700; letter-spacing: .04em;
    background: linear-gradient(90deg, #F2B498, #E08A6B 50%, #c9a6ff); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.kx-h {
    margin: 6px 0 0; font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", Inter, "Segoe UI", Roboto, sans-serif;
    font-size: 35px; line-height: 1.06; font-weight: 700; letter-spacing: -.03em;
}
.kx-h .ln { display: block; overflow: hidden; padding: 0 0 .1em; }
.kx-h .ln > span {
    display: inline-block; background: linear-gradient(180deg, #fff 35%, #b9b3a9); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.kx-p { margin: 8px auto 0; max-width: 30ch; font-size: 14.5px; line-height: 1.45; color: #99958d; }
.kx-p:empty { display: none; }
/* вступление: плашка «Бесплатно», по ней один раз проходит блик */
.kx-free {
    display: none; align-items: center; gap: 7px; width: max-content; max-width: 100%; margin: 14px auto 0; padding: 7px 15px 7px 10px;
    position: relative; overflow: hidden; border-radius: 999px; font-size: 13.5px; font-weight: 700; color: #F7C2A9;
    background: rgba(224, 138, 107, .12); border: 1px solid rgba(224, 138, 107, .42); box-shadow: 0 0 26px rgba(224, 138, 107, .16);
}
.kx-free span { display: grid; place-items: center; width: 17px; height: 17px; color: #E08A6B; }
.kx-free svg { width: 16px; height: 16px; }
.kx-free::after {
    content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 40%; pointer-events: none;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .3), transparent); transform: translateX(-150%) skewX(-18deg);
}
.kx-copy.intro .kx-free { display: flex; }
.kx-copy.intro.upd .kx-free { display: none; }          /* обновление: у клиента уже есть доступ — «Бесплатно» не к месту */
.kx-copy.in .kx-free { animation: kxPill .8s var(--ease) .3s both; }
.kx-copy.in .kx-free::after { animation: kxFreeSheen 1s .85s ease-in-out both; }
@keyframes kxPill { from { opacity: 0; transform: translateY(10px) scale(.94); } to { opacity: 1; transform: none; } }
@keyframes kxFreeSheen { to { transform: translateX(360%) skewX(-18deg); } }
.kx-copy.in .kx-eb { animation: kxFadeUp .6s var(--ease) both; }
.kx-copy.in .ln > span { animation: kxLine .95s var(--ease) calc(var(--i) * 95ms + 60ms) both; }
.kx-copy.in .kx-p { animation: kxFadeUp .8s var(--ease) .3s both; }
/* уход — анимацией, не переходом: появление держит текст (fill: both), переход под ним не запускался,
   и старый текст стоял, а через 280 мс пропадал рывком */
.kx-copy.out .kx-eb, .kx-copy.out .kx-p, .kx-copy.out .kx-specs, .kx-copy.out .kx-free { animation: kxOut .22s ease both; }
.kx-copy.out .ln > span { animation: kxLineOut .28s cubic-bezier(.5, 0, .75, 0) both; }
@keyframes kxOut { from { opacity: 1; } to { opacity: 0; } }
@keyframes kxLineOut { from { transform: none; } to { transform: translateY(-108%); } }
@keyframes kxLine { from { transform: translateY(108%); } to { transform: none; } }
@keyframes kxFadeUp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
/* финал: строгая строка цифр под заголовком, тонкие разделители */
.kx-specs { display: none; grid-template-columns: repeat(3, 1fr); max-width: 330px; margin: 20px auto 0; }
.kx-copy.fin .kx-specs { display: grid; }
.kx-specs > div { padding: 0 6px; border-left: 1px solid rgba(255, 255, 255, .12); }
.kx-specs > div:first-child { border-left: 0; }
.kx-specs b { display: block; font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", Inter, "Segoe UI", Roboto, sans-serif;
    font-size: 26px; line-height: 1.05; font-weight: 600; letter-spacing: -.02em; color: #F5F3EE; font-variant-numeric: tabular-nums; }
.kx-specs small { display: block; margin-top: 5px; font-size: 11.5px; line-height: 1.3; color: #8f8b83; }
.kx-copy.in .kx-specs > div { animation: kxFadeUp .9s var(--ease) calc(.35s + var(--k) * 90ms) both; }
/* сцена в 3D */
.kx-stage { position: absolute; inset: 0; perspective: 1100px; perspective-origin: 50% 40%; }
.kx-fade { position: absolute; left: 0; right: 0; bottom: 0; height: 64px; z-index: 7; pointer-events: none; background: linear-gradient(to top, #000 8%, transparent); }
/* iPhone: главный — один на всю презентацию; два боковых — только в финале */
.kx-phone, .kx-sp {
    position: absolute; left: 50%; bottom: 0; width: min(226px, 57vw); aspect-ratio: 390 / 844; border-radius: 44px; padding: 8px;
    background: linear-gradient(140deg, #4a4845 0%, #151514 38%, #0d0d0c 62%, #3a3835 100%);
    box-shadow: 0 0 0 1px #56534f, inset 0 1px 0 rgba(255, 255, 255, .16), inset 0 0 0 1px rgba(255, 255, 255, .05), 0 50px 90px rgba(0, 0, 0, .7);
}
/* без preserve-3d: с ним в Safari/WebView на iOS не работает opacity, и спрятанный телефон торчит снизу.
   visibility — страховка: прячет в конце перехода, показывает сразу */
.kx-phone {
    z-index: 3; visibility: hidden;
    opacity: 0; transform: translate3d(-50%, 78%, 0) rotateX(28deg) scale(.9);
    transition: transform 1.3s var(--ease), opacity .8s ease, visibility 1.3s;
}
.kx[data-beat="0"] .kx-phone, .kx[data-beat="1"] .kx-phone, .kx[data-beat="2"] .kx-phone, .kx[data-beat="3"] .kx-phone,
.kx[data-beat="4"] .kx-phone, .kx[data-beat="6"] .kx-phone { visibility: visible; }
.kx[data-beat="0"] .kx-phone { opacity: 1; transform: translate3d(-50%, 13%, 0) rotateX(10deg) scale(.96); transition-duration: 1.3s, .7s; }
.kx[data-beat="1"] .kx-phone { opacity: 1; transform: translate3d(-50%, 31%, 0) rotateX(12deg) rotateY(-16deg) rotateZ(3deg); }
.kx[data-beat="2"] .kx-phone { opacity: 1; transform: translate3d(-50%, 29%, 0) rotateX(5deg) rotateY(0deg) scale(1.03); }
.kx[data-beat="3"] .kx-phone { opacity: 1; transform: translate3d(-50%, 31%, 0) rotateX(8deg) rotateY(17deg) rotateZ(-3deg); }
.kx[data-beat="4"] .kx-phone { opacity: 1; transform: translate3d(-104%, 36%, 0) rotateX(6deg) rotateY(24deg) scale(.86); }
.kx[data-beat="5"] .kx-phone { opacity: 0; transform: translate3d(-50%, 70%, 0) rotateX(30deg) scale(.82); }
.kx[data-beat="6"] .kx-phone { opacity: 1; transform: translate3d(-50%, 17%, 0) rotateX(6deg) scale(.9); transition-duration: 1.5s, .9s; }
.kx-sp {
    z-index: 2; opacity: 0; visibility: hidden; transform: translate3d(-50%, 34%, 0) rotateX(6deg) scale(.7);
    transition: transform 1.5s var(--ease), opacity .9s ease, visibility 1.5s;
}
.kx-sp::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
    background: linear-gradient(180deg, rgba(0, 0, 0, .22), rgba(0, 0, 0, .6)); }
.kx[data-beat="6"] .kx-sp { opacity: 1; visibility: visible; transition-delay: .25s; }
.kx[data-beat="6"] .kx-sp.l { transform: translate3d(-122%, 26%, 0) rotateX(6deg) rotateY(-22deg) scale(.76); }
.kx[data-beat="6"] .kx-sp.r { transform: translate3d(22%, 26%, 0) rotateX(6deg) rotateY(22deg) scale(.76); }
.kx-scr { position: relative; width: 100%; height: 100%; border-radius: 36px; overflow: hidden; background: #121211; }
.kx-scr > img { position: absolute; left: 0; top: 0; display: block; width: 100%; height: auto; opacity: 0; transition: opacity .6s ease; }
.kx-sp .kx-scr > img { opacity: 1; }
.kx[data-beat="1"] img[data-s="sig-run"], .kx[data-beat="2"] img[data-s="sig-res"], .kx[data-beat="3"] img[data-s="today"],
.kx[data-beat="4"] img[data-s="news"], .kx[data-beat="6"] img[data-s="today"] { opacity: 1; }
.kx[data-beat="3"] img.tall { animation: kxScroll 1.9s .35s cubic-bezier(.45, 0, .25, 1) both; }
@keyframes kxScroll { to { transform: translateY(-23%); } }
/* «включение»: чёрный экран, на нём проявляется логотип */
.kx-boot {
    position: absolute; inset: 0; z-index: 1; display: grid; place-items: center; opacity: 0; transition: opacity .5s ease;
    background: radial-gradient(46% 26% at 50% 50%, rgba(224, 138, 107, .2), transparent 100%), #000;
}
.kx-boot img { width: 30%; opacity: 0; transform: scale(.84); filter: drop-shadow(0 0 16px rgba(224, 138, 107, .5));
    transition: transform 1.6s var(--ease), opacity .8s ease; }
.kx[data-beat="0"] .kx-boot { opacity: 1; transition-duration: .01s; }
.kx[data-beat="0"] .kx-boot img { opacity: 1; transform: none; transition-delay: .45s; }
.kx-glare {
    position: absolute; top: -20%; bottom: -20%; left: -30%; width: 60%; z-index: 2; pointer-events: none;
    background: linear-gradient(105deg, transparent 20%, rgba(255, 255, 255, .16) 50%, transparent 80%); transform: translateX(-140%) rotate(8deg);
}
.kx.go .kx-glare { animation: kxGlare 1.5s .45s cubic-bezier(.3, .6, .3, 1) both; }
.kx.go[data-beat="0"] .kx-glare { animation-delay: .7s; animation-duration: 1.1s; }
@keyframes kxGlare { to { transform: translateX(330%) rotate(8deg); } }
.kx-island { position: absolute; top: 9px; left: 50%; z-index: 3; width: 32%; height: 19px; transform: translateX(-50%); border-radius: 12px; background: #000; }
/* «взорванный вид»: показания вылетают из телефона */
.kx-chip {
    position: absolute; z-index: 5; opacity: 0; pointer-events: none;
    transform: translate3d(var(--fx, 0), var(--fy, 26px), 0) scale(.82) rotate(var(--r, 0deg));
    transition: transform .9s var(--ease), opacity .45s ease;
}
.kx-chip .fl {
    display: flex; align-items: center; gap: 9px; padding: 9px 12px 9px 9px; border-radius: 15px; white-space: nowrap;
    background: rgba(30, 29, 27, .92); border: 1px solid rgba(255, 255, 255, .09);
    box-shadow: 0 18px 40px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(255, 255, 255, .06);
    animation: kxFloat 5.5s ease-in-out infinite alternate;
}
.kx-chip .ic { flex: none; width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; background: rgba(255, 255, 255, .07); color: #cfcac0; }
.kx-chip .ic svg { width: 16px; height: 16px; }
.kx-chip .ic.u { background: rgba(60, 203, 142, .16); color: #3CCB8E; }
.kx-chip .ic.d { background: rgba(242, 100, 95, .16); color: #F2645F; }
.kx-chip .ic.hot { background: rgba(255, 122, 61, .18); color: #ff8a5c; }
.kx-chip small { display: block; font-size: 11px; color: #9a968e; }
.kx-chip b { display: block; font-size: 13.5px; font-weight: 700; color: #F5F3EE; }
.kx-chip b.u { color: #3CCB8E; } .kx-chip b.d { color: #F2645F; } .kx-chip b.hot { color: #ff9d6b; } .kx-chip b.acc { color: #F2B498; }
.k1 { left: calc(var(--gx) + 2%); top: 43%; --r: -4deg; --fx: 50px; }
.k2 { right: calc(var(--gx) + 1%); top: 53%; --r: 3deg; --fx: -50px; }
.k3 { left: calc(var(--gx) + 4%); top: 66%; --r: 2deg; --fx: 50px; }
.k4 { right: calc(var(--gx) + 3%); top: 76%; --r: -3deg; --fx: -50px; }
.k5 { left: calc(var(--gx) + 1%); top: 47%; --r: -3deg; --fx: 50px; }
.k6 { right: calc(var(--gx) + 1%); top: 66%; --r: 3deg; --fx: -50px; }
.k1 .fl { animation-delay: -1s; } .k2 .fl { animation-delay: -2.4s; } .k3 .fl { animation-delay: -3.3s; } .k4 .fl { animation-delay: -.4s; }
.kx[data-beat="1"] .k1, .kx[data-beat="1"] .k2, .kx[data-beat="1"] .k3, .kx[data-beat="1"] .k4,
.kx[data-beat="3"] .k5, .kx[data-beat="3"] .k6 { opacity: 1; transform: translate3d(0, 0, 0) scale(1) rotate(var(--r)); }
.kx[data-beat="1"] .k1 { transition-delay: .3s; } .kx[data-beat="1"] .k2 { transition-delay: .4s; }
.kx[data-beat="1"] .k3 { transition-delay: .5s; } .kx[data-beat="1"] .k4 { transition-delay: .6s; }
.kx[data-beat="3"] .k5 { transition-delay: .4s; } .kx[data-beat="3"] .k6 { transition-delay: .55s; }
@keyframes kxFloat { from { transform: translateY(-4px); } to { transform: translateY(5px); } }
.kx-coins { position: relative; flex: none; width: 36px; height: 30px; }
.kx-coins i { position: absolute; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 12px; font-weight: 700; border: 2px solid #1e1d1b; }
.kx-coins i:first-child { left: 0; top: 0; background: #2b3b6b; color: #cfe0ff; }
.kx-coins i:last-child { left: 12px; top: 6px; background: #1f4a3a; color: #c8f5dc; }
/* «НИЖЕ» поднимается с экрана к зрителю */
.kx-lift {
    position: absolute; left: 50%; top: 45%; z-index: 6; width: min(262px, 70vw); display: flex; align-items: center; gap: 13px;
    padding: 13px 16px; border-radius: 22px; border: 1px solid rgba(242, 100, 95, .5);
    background: radial-gradient(120% 160% at 0% 0%, rgba(242, 100, 95, .38), transparent 60%), #1c1716;
    box-shadow: 0 30px 70px rgba(0, 0, 0, .7), 0 0 50px rgba(242, 100, 95, .22);
    opacity: 0; transform: translate3d(-50%, 30px, 0) scale(.9);
    transition: transform 1s var(--ease), opacity .5s ease;
}
.kx[data-beat="2"] .kx-lift { opacity: 1; transform: translate3d(-50%, -8px, 0) scale(1.05); transition-delay: .55s; }
.kx-lift .rg { flex: none; width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; background: #F2645F;
    box-shadow: 0 0 0 6px rgba(242, 100, 95, .16), 0 10px 26px rgba(242, 100, 95, .45); }
.kx-lift .rg svg { width: 26px; height: 26px; }
.kx-lift b { display: block; font-size: 28px; font-weight: 800; letter-spacing: .03em; line-height: 1;
    background: linear-gradient(180deg, #fff 5%, #F2645F 90%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.kx-lift small { display: block; margin-top: 5px; font-size: 12.5px; color: #cfc6bf; }
/* новость с живой шкалой паузы */
.kx-news {
    position: absolute; right: calc(var(--gx) + 3%); top: 37%; z-index: 6; width: min(222px, 58vw); padding: 13px 14px 12px; border-radius: 20px; text-align: start;
    background: linear-gradient(165deg, rgba(255, 110, 60, .2), rgba(242, 100, 95, .04) 62%), #1a1817; border: 1px solid rgba(255, 120, 70, .45);
    box-shadow: 0 30px 70px rgba(0, 0, 0, .7);
    opacity: 0; transform: translate3d(60px, 0, 0) scale(.92); transition: transform 1s var(--ease), opacity .5s ease;
}
.kx[data-beat="4"] .kx-news { opacity: 1; transform: none; transition-delay: .3s; }
.kx-news .tg { display: flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; color: #ff9d6b; text-transform: uppercase; letter-spacing: .04em; }
.kx-news .tg svg { width: 13px; height: 13px; }
.kx-news > b { display: block; margin-top: 7px; font-size: 16.5px; font-weight: 700; color: #F5F3EE; }
.kx-news > small { display: block; margin-top: 1px; font-size: 12px; color: #9a968e; }
.kx-news .w { margin-top: 9px; padding: 8px 10px; border-radius: 11px; background: rgba(0, 0, 0, .32); font-size: 12.5px; line-height: 1.35; color: #ffd9cc; }
.kx-news .tl { position: relative; height: 40px; margin-top: 12px; }
.kx-news .bar { position: absolute; left: 6px; right: 6px; top: 5px; height: 2px; border-radius: 1px; background: rgba(255, 255, 255, .12); overflow: hidden; }
.kx-news .bar i { display: block; height: 100%; background: linear-gradient(90deg, #ff8a5c, #F2645F 60%, #3CCB8E); transform: scaleX(0); transform-origin: left center; }
.kx[data-beat="4"] .kx-news .bar i { animation: kxTl 1.3s .6s cubic-bezier(.4, 0, .2, 1) both; }
@keyframes kxTl { to { transform: none; } }
.kx-news .pt { position: absolute; top: 0; font-size: 11.5px; font-weight: 700; color: #F5F3EE; font-variant-numeric: tabular-nums; }
.kx-news .pt i { display: block; width: 12px; height: 12px; margin: 0 0 4px 0; border-radius: 50%; background: #2a2826; border: 2px solid #3a3835; }
.kx-news .pt em { display: block; font-style: normal; font-weight: 500; font-size: 10.5px; color: #9a968e; }
.kx-news .p1 { left: 0; } .kx-news .p2 { left: 50%; transform: translateX(-50%); text-align: center; } .kx-news .p3 { right: 0; text-align: end; }
.kx-news .p2 i { margin: 0 auto 4px; } .kx-news .p3 i { margin: 0 0 4px auto; }
.kx[data-beat="4"] .kx-news .p1 i { animation: kxDot .3s .65s both; --dc: #ff8a5c; }
.kx[data-beat="4"] .kx-news .p2 i { animation: kxDot .3s 1.25s both; --dc: #F2645F; }
.kx[data-beat="4"] .kx-news .p3 i { animation: kxDot .3s 1.85s both; --dc: #3CCB8E; }
@keyframes kxDot { to { background: var(--dc); border-color: var(--dc); transform: scale(1.15); } }
/* модели — веер стеклянных карточек */
.kx-tiers { position: absolute; left: 50%; top: 42%; z-index: 5; width: min(338px, calc(100% - 2 * var(--gx))); height: 230px; transform: translateX(-50%); perspective: 900px; }
.kx-tier {
    position: absolute; left: 0; right: 0; top: 0; display: flex; align-items: center; gap: 12px; padding: 13px 15px; border-radius: 20px; text-align: start;
    background: linear-gradient(150deg, rgba(var(--c), .26), rgba(var(--c), .04) 70%), #141413;
    border: 1px solid rgba(var(--c), .45); box-shadow: 0 20px 50px rgba(0, 0, 0, .6), 0 0 34px rgba(var(--c), .16);
    opacity: 0; transform: translate3d(0, 60px, -120px) rotateX(55deg); transition: transform 1.1s var(--ease), opacity .5s ease;
}
.kx[data-beat="5"] .kx-tier { opacity: 1; }
.kx[data-beat="5"] .t1 { transform: translate3d(0, 0, 0) rotateX(0); transition-delay: .2s; }
.kx[data-beat="5"] .t2 { transform: translate3d(0, 76px, 0) rotateX(0); transition-delay: .3s; }
.kx[data-beat="5"] .t3 { transform: translate3d(0, 152px, 0) rotateX(0); transition-delay: .4s; }
.kx-tier .ic { flex: none; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: rgba(var(--c), .18); color: rgb(var(--c)); }
.kx-tier .ic svg { width: 21px; height: 21px; }
.kx-tier > div { flex: 1; min-width: 0; }
.kx-tier b { display: block; font-size: 17px; font-weight: 700; color: #F5F3EE; }
.kx-tier small { display: block; margin-top: 2px; font-size: 12px; color: #a09d96; }
.kx-tier .pp { margin-left: auto; display: flex; gap: 3px; flex: none; }
.kx-tier .pp i { width: 5px; height: 17px; border-radius: 3px; background: rgba(255, 255, 255, .12); }
.kx[data-beat="5"] .kx-tier .pp i.f { animation: kxPip .25s both; animation-delay: calc(.6s + var(--j) * 60ms); }
@keyframes kxPip { to { background: rgb(var(--c)); } }
/* ниже экран — всё компактнее */
@media (max-height: 740px) {
    .kx-copy { top: 16px; }
    .kx-h { font-size: 30px; }
    .kx-p { font-size: 13.5px; margin-top: 6px; }
    .kx-specs { margin-top: 16px; }
    .kx-specs b { font-size: 23px; }
    .kx-phone, .kx-sp { width: min(200px, 52vw); border-radius: 38px; padding: 7px; }
    .kx-scr { border-radius: 31px; }
    .kx-free { margin-top: 12px; font-size: 13px; }
    .kx[data-beat="0"] .kx-phone { transform: translate3d(-50%, 20%, 0) rotateX(10deg) scale(.96); }
    .kx[data-beat="6"] .kx-phone { transform: translate3d(-50%, 22%, 0) rotateX(6deg) scale(.9); }
    .kx[data-beat="6"] .kx-sp.l { transform: translate3d(-122%, 30%, 0) rotateX(6deg) rotateY(-22deg) scale(.76); }
    .kx[data-beat="6"] .kx-sp.r { transform: translate3d(22%, 30%, 0) rotateX(6deg) rotateY(22deg) scale(.76); }
    .kx-chip .fl { padding: 7px 10px 7px 7px; gap: 7px; }
    .kx-chip .ic { width: 26px; height: 26px; }
    .kx-chip b { font-size: 12.5px; }
    .kx-tiers { top: 37%; }
    .kx-tier { padding: 10px 13px; }
    .kx[data-beat="5"] .t2 { transform: translate3d(0, 66px, 0); }
    .kx[data-beat="5"] .t3 { transform: translate3d(0, 132px, 0); }
}
@media (max-height: 640px) {
    .kx-p { display: none; }
    .kx-h { font-size: 27px; }
}
@media (prefers-reduced-motion: reduce) {
    .kx *, .kx *::after { animation-duration: .01s !important; animation-delay: 0s !important; transition-duration: .01s !important; transition-delay: 0s !important; }
}

/* ===== 01.10 аудит вёрстки: ничего не режется и не вылезает на 320–430 px ===== */
/* Крутилка ожидания: вращается дуга внутри SVG, а не весь квадрат — повёрнутые углы раздували экран, и он прокручивался */
.cv-rg.spin > svg { animation: none; }
.cv-rg.spin .pg { transform-box: fill-box; transform-origin: center; animation: cvArc 1.1s linear infinite; }
@keyframes cvArc { to { transform: rotate(360deg); } }
/* Три показания сигнала: подпись — до двух строк (длинные слова не режутся многоточием), значения — по низу, в одну линию */
.cs-rt .tx { flex: 1; display: flex; flex-direction: column; gap: 3px; }
.cs-rt b { white-space: normal; text-overflow: clip; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.cs-rt .v, .cs-rt.wait .v, .cs-rt.act .v { margin-top: auto; }
.cs-rt.wait .v, .cs-rt.act .v { margin-bottom: 4px; }
/* Выбор языка: галочка не отнимает ширину у названия */
.cl-row { position: relative; }
.cl-row .ck { position: absolute; top: 50%; right: 10px; margin-top: -10px; }
.cl-row.on .nm { padding-right: 24px; }
/* Узкие экраны (320–359 px) */
@media (max-width: 359px) {
    :root.corr-v2 .corr .lang-fab .lang-fab-nm { display: none; }
    :root.corr-v2 .corr .lang-fab .lang-fab-code { display: inline; font-size: 12.5px; font-weight: 700; letter-spacing: .04em; }
    .cs-row { gap: 10px; padding: 10px 10px 10px 12px; }
    .cs-tx b { font-size: 15px; }
    .cs-tx small { font-size: 12px; }
    .cs-go { min-width: 62px; padding: 7px 8px; }
    .cs-go b { font-size: 14px; }
    .cs-go small { font-size: 11px; }
    .cs-pair b { font-size: 15px; }
    .cs-card { gap: 12px; padding: 14px; }
    .cs-rg, .cs-rg > svg { width: 64px; height: 64px; }
    .cs-bd { width: 48px; height: 48px; }
    .cs-bd img { width: 40px; height: 40px; }
    .cs-ctx b { font-size: 28px; }
    .cs-card.an .cs-ctx b { font-size: 21px; }
    .cs-ctx small { font-size: 12px; gap: 4px; }
    .cs-tiles { gap: 6px; }
    .cs-rt { padding: 9px 8px 10px; }
    .cs-rt .v { font-size: 13px; }
    .cv-rcpt { gap: 6px; padding: 7px 8px 7px 10px; font-size: 12.5px; }
    .cl-row { gap: 8px; padding: 11px 10px; font-size: 14px; }
    .cl-row .lf { font-size: 18px; }
}
/* Свечение за значком экрана-состояния: тенью от точки, а не кругом 340 px — тень не раздувает экран (раньше «Ждём регистрацию» прокручивался на 17 px) */
.cv-state::before { top: 110px; width: 2px; height: 2px; margin: -1px 0 0 -1px; background: none; box-shadow: 0 0 140px 60px rgba(var(--c), .18); }
/* Подпись под парой — до двух строк вместо многоточия */
.cs-tx small { white-space: normal; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
@media (max-width: 359px) {
    /* главная кнопка — в одну строку: «Пополнить $500 на PocketOption» */
    .corr .corr-foot .btn { font-size: 15px; letter-spacing: -.01em; padding-left: 12px; padding-right: 12px; }
}
/* Длинные языки (fr, de, pt…): строка бонуса переносит сумму вниз, а не наезжает; шаг анализа — до двух строк */
.cv-rcpt { flex-wrap: wrap; row-gap: 4px; }
.cv-rcpt > b { margin-inline-start: auto; }
.cs-ctx small#cs-step { white-space: normal; align-items: flex-start; line-height: 1.3; }
/* Невысокое окно Telegram (Android 360×560 и ниже): то, что повторяет шторка или следующий экран, прячем */
@media (max-height: 620px) {
    :root.corr-v2 .cv-safe span { display: none; }                  /* пояснение — в шторке «Зачем нужен депозит» по тапу */
    .corr-gsteps li.lock { display: none; }                          /* будущие шаги гайда: их число — в подзаголовке */
    .corr-gsteps li.done { padding: 7px 0; }                         /* пройденные — одной плотной строкой */
    .corr-body.is-split .corr-where .corr-shot { max-height: 124px; } /* где найти ID: верх кадра — аватар и номер */
    .cv-form { flex-basis: 44%; }                                    /* кадр формы регистрации чуть меньше */
}