/* Механика из ds-screen (кнопка-отпечаток), перекрашено под токены среднего прода: круг = .glass-btn.glass-round (скло эталона),
   тон «закрыто» = --red-rgb, «открыто» = --green-rgb (через --rim-rgb / --round-tint, как у состояний err/ok круглой кнопки). Без свечений.
   Прогресс --p (0..1) задаёт JS: заливка и «прорисовка» линий идут снизу вверх. */
.unlock-wrap { position: relative; height: calc(var(--p-screen-h) - var(--p-content-top) - var(--p-content-bottom)); min-height: 360px; display: grid; place-items: center;
  transition: transform .45s cubic-bezier(.4, 0, .2, 1), opacity .45s ease, visibility 0s .45s; }
.unlock-wrap.is-gone { transform: translateY(28px) scale(.55); opacity: 0; visibility: hidden; pointer-events: none; }
.unlock-wrap.is-removed { display: none; }
.glass-btn.glass-round.unlock { --unlock-rgb: var(--red-rgb); --rim-rgb: var(--unlock-rgb); --round-tint: rgba(var(--unlock-rgb), .14);
  width: 168px; height: 168px; border-radius: 50%; padding: 0; border: 0; display: grid; place-items: center; color: rgb(var(--unlock-rgb)); touch-action: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
/* размер и масштаб кнопки не зависят от состояния: глушим ход круглой (ПК ±1px, телефон ×1.25) */
.glass-btn.glass-round.unlock, .glass-btn.glass-round.unlock:hover, .glass-btn.glass-round.unlock:active { transform: none; transition: transform .2s ease, background-color .5s ease, color .5s ease; }
.glass-btn.glass-round.unlock.is-holding { transform: scale(.965); }
.glass-btn.glass-round.unlock[data-tone="positive"] { --unlock-rgb: var(--green-rgb); }
.unlock__charge { position: absolute; inset: 0; border-radius: 50%; background: rgba(var(--unlock-rgb), .5); clip-path: inset(calc((1 - var(--p, 0)) * 100%) 0 0 0); transition: background-color .35s ease, opacity .5s ease; }
.unlock.is-open .unlock__charge { opacity: 0; }
.unlock.is-open .unlock__charge.is-flash { opacity: 1; }
.unlock__ic { position: relative; display: grid; place-items: center; }
.unlock__ic svg { grid-area: 1 / 1; width: 72px; height: 72px; fill: none; stroke: currentColor; stroke-width: .4667; stroke-linecap: round; stroke-linejoin: round; overflow: visible; transition: opacity .35s ease, transform .35s ease, color .5s ease; }   /* .4667 в viewBox 24 = 1.4 px при 72 px */
.unlock__fp { color: var(--text2); opacity: .6; }
.unlock__fp-on { color: var(--red); clip-path: inset(calc((1 - var(--p, 0)) * 100% - 1px) -4px -4px -4px); }   /* линии красятся снизу вверх */
.unlock__lock { color: var(--green); opacity: 0; transform: scale(.8); }
.unlock.is-open .unlock__fp, .unlock.is-open .unlock__fp-on { opacity: 0; transform: scale(.8); }
.unlock.is-open .unlock__lock { opacity: 1; transform: scale(1); }
.unlock__caption { position: absolute; left: 0; right: 0; top: calc(50% + 84px + 20px); text-align: center; pointer-events: none; font-family: var(--font-ui); }
.unlock__title { display: block; font: 600 12px/16px var(--font-ui); letter-spacing: .04em; text-transform: uppercase; color: var(--text2); }
.unlock__hint { display: block; margin-top: 4px; font: 400 14px/20px var(--font-ui); color: var(--text3); transition: opacity .3s ease; }
.unlock__caption.is-open .unlock__hint { opacity: 0; }
.unlock-sub { transition: transform .5s cubic-bezier(.2, .8, .2, 1), opacity .4s ease, visibility 0s; }
.unlock-sub.is-hidden { transform: translateY(24px); opacity: 0; visibility: hidden; pointer-events: none; transition: none; }
@media (prefers-reduced-motion: reduce) {
  .unlock-wrap, .unlock-sub, .glass-btn.glass-round.unlock, .unlock__charge, .unlock__ic svg, .unlock__hint { transition: none !important; }
}