/* Telegram verification (tgverify.js): the full-screen page and the slim reminder bar.
   Below the lock screen (.lock z 70), above sheets (z 30) and the tab bar. */
.tgv { position: fixed; inset: 0; z-index: 60; display: flex; align-items: center; justify-content: center;
  padding: calc(var(--safe-t) + 24px) calc(var(--safe-r) + 20px) calc(var(--safe-b) + 24px) calc(var(--safe-l) + 20px);
  background: radial-gradient(120% 80% at 50% 0%, rgba(201, 204, 209, .18), transparent 60%), rgba(8, 9, 11, .94);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
  overflow-y: auto; overscroll-behavior: contain; opacity: 0; transition: opacity 260ms var(--ease-out); }
.tgv[hidden] { display: none; }
.tgv.in { opacity: 1; }
.tgv-card { width: 100%; max-width: 420px; display: flex; flex-direction: column; align-items: center; text-align: center;
  gap: 14px; transform: translateY(var(--rise)); transition: transform 420ms var(--ease-out); }
.tgv.in .tgv-card { transform: none; }

.tgv-logo { width: 104px; height: 104px; border-radius: 50%; margin-bottom: 4px;
  box-shadow: 0 0 0 10px rgba(201, 204, 209, .10), 0 0 0 22px rgba(201, 204, 209, .05), 0 18px 50px rgba(0, 0, 0, .45);
  animation: tgv-float 4.5s var(--ease-in-out) infinite; }
.tgv-logo svg { width: 100%; height: 100%; display: block; }
.tgv-logo.pulse { animation: tgv-pulse 1.6s var(--ease-in-out) infinite; }

.tgv h2 { margin: 2px 0 0; font-size: clamp(1.7rem, 1.3rem + 2vw, 2.2rem); line-height: 1.12; letter-spacing: -.02em; color: var(--fg); }
.tgv-lead { margin: 0; max-width: 360px; color: var(--fg-2); font-size: var(--fs-lead); line-height: 1.5; }
.tgv-lead b { color: var(--fg); }

.tgv-badge { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: var(--r-pill);
  font-size: var(--fs-sm); font-weight: 600; letter-spacing: .01em; }
.tgv-badge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.tgv-badge.bad { color: #FFB4AE; background: rgba(217, 68, 58, .14); border: 1px solid rgba(217, 68, 58, .45); }
.tgv-badge.bad::before { animation: tgv-blink 1.4s steps(2, jump-none) infinite; }
.tgv-badge.warn { color: #E9EAEC; background: rgba(201, 204, 209, .1); border: 1px solid rgba(201, 204, 209, .4); }

.tgv-steps { list-style: none; margin: 6px 0 0; padding: 14px; width: 100%; display: grid; gap: 10px; text-align: left;
  background: var(--surface); border: 1px solid var(--line-2); border-radius: var(--r-card); }
.tgv-steps li { display: flex; align-items: center; gap: 12px; color: var(--fg-2); font-size: var(--fs-body); }
.tgv-steps b { flex: none; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center;
  background: rgba(201, 204, 209, .16); color: #E9EAEC; font-size: 14px; }
.tgv-steps em { font-style: normal; color: var(--fg); font-weight: 600; }

.tgv-calm { margin: 0; padding: 11px 13px; width: 100%; border-radius: var(--r-btn); font-size: var(--fs-sm); line-height: 1.45;
  color: #A8E6B4; background: rgba(63, 185, 80, .08); border: 1px solid rgba(63, 185, 80, .3); }

.tgv-go { margin-top: 6px; width: 100%; height: 58px; border: 0; border-radius: 14px; display: inline-flex; align-items: center;
  justify-content: center; gap: 12px; font: 600 17px/1 var(--font); color: #fff; cursor: pointer;
  background: linear-gradient(180deg, #FFFFFF, #C9CCD1); box-shadow: 0 10px 28px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 255, 255, .25);
  transition: transform var(--t-fast) var(--ease-out), box-shadow var(--t-base) var(--ease-out), opacity var(--t-base); }
.tgv-go svg { width: 26px; height: 26px; }
.tgv-go svg circle { fill: #fff; }
.tgv-go svg path { fill: #0A0A0A; }
.tgv-go:active { transform: scale(var(--press)); }
.tgv-go:disabled { opacity: .6; cursor: wait; }
.tgv-go.ghost { background: var(--surface-2); color: var(--fg); box-shadow: none; border: 1px solid var(--line-2); height: 50px; font-size: 15px; }
.tgv-go.prime { background: linear-gradient(180deg, var(--accent), var(--accent-2)); color: var(--accent-ink);
  box-shadow: 0 10px 28px rgba(201, 204, 209, .35), inset 0 1px 0 rgba(255, 255, 255, .35); }
.tgv-go:focus-visible, .tgv-later:focus-visible, .tgv-bar:focus-visible { outline: 2px solid #E9EAEC; outline-offset: 3px; }

.tgv-later { background: none; border: 0; padding: 10px 16px; color: var(--muted); font: 500 15px/1 var(--font); cursor: pointer; }
.tgv-err { margin: 0; min-height: 1em; color: var(--bad); font-size: var(--fs-sm); }
.tgv-err:empty { display: none; }

.tgv-dots { display: flex; gap: 8px; margin: 4px 0 2px; }
.tgv-dots i { width: 9px; height: 9px; border-radius: 50%; background: #E9EAEC; animation: tgv-dot 1.2s var(--ease-in-out) infinite; }
.tgv-dots i:nth-child(2) { animation-delay: .15s; }
.tgv-dots i:nth-child(3) { animation-delay: .3s; }

.tgv-check { width: 112px; height: 112px; margin-bottom: 4px; }
.tgv-check svg { width: 100%; height: 100%; }
.tgv-ring { fill: rgba(63, 185, 80, .12); stroke: var(--good); stroke-width: 2.5; stroke-dasharray: 151; stroke-dashoffset: 151;
  animation: tgv-draw 600ms var(--ease-out) forwards; }
.tgv-tick { fill: none; stroke: var(--good); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round;
  stroke-dasharray: 36; stroke-dashoffset: 36; animation: tgv-draw 420ms 420ms var(--ease-out) forwards; }

/* the slim reminder bar: under the status bar, above everything but the page and the lock */
.tgv-bar { position: fixed; left: 50%; transform: translateX(-50%); top: calc(var(--safe-t) + 8px); z-index: 55;
  width: min(560px, calc(100% - 24px)); display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 12px;
  font: 500 14px/1.3 var(--font); text-align: left; cursor: pointer; -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .4); animation: tgv-drop 360ms var(--ease-out); }
.tgv-bar[hidden] { display: none; }
.tgv-bar svg { flex: none; width: 22px; height: 22px; }
.tgv-bar span { flex: 1; }
.tgv-bar i { font-style: normal; font-size: 20px; opacity: .7; }
.tgv-bar.warn { color: #E9EAEC; background: rgba(42, 33, 14, .92); border: 1px solid rgba(201, 204, 209, .45); }
.tgv-bar.bad { color: #FFD0CC; background: rgba(48, 16, 14, .94); border: 1px solid rgba(217, 68, 58, .55); }

@keyframes tgv-float { 50% { transform: translateY(-6px); } }
@keyframes tgv-pulse { 50% { transform: scale(1.06); box-shadow: 0 0 0 16px rgba(201, 204, 209, .12), 0 0 0 30px rgba(201, 204, 209, .05), 0 18px 50px rgba(0, 0, 0, .5); } }
@keyframes tgv-dot { 0%, 100% { opacity: .25; transform: translateY(0); } 50% { opacity: 1; transform: translateY(-4px); } }
@keyframes tgv-draw { to { stroke-dashoffset: 0; } }
@keyframes tgv-blink { 50% { opacity: .3; } }
@keyframes tgv-drop { from { opacity: 0; transform: translate(-50%, -12px); } }

@media (prefers-reduced-motion: reduce) {
  .tgv, .tgv-card { transition: none; }
  .tgv-logo, .tgv-logo.pulse, .tgv-dots i, .tgv-badge.bad::before, .tgv-bar { animation: none; }
  .tgv-ring, .tgv-tick { animation: none; stroke-dashoffset: 0; }
}

/* ---- shared by fixit.js ("Fix this") and forgot.js ("Forgot password?"): same full-page style ---- */
.fix-icon { width: 96px; height: 96px; border-radius: 50%; display: grid; place-items: center; font-size: 42px; margin-bottom: 4px;
  animation: tgv-float 4.5s var(--ease-in-out) infinite; }
.fix-icon svg { width: 44px; height: 44px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.fix-icon.bad { background: rgba(217, 68, 58, .14); box-shadow: 0 0 0 10px rgba(217, 68, 58, .07), 0 18px 50px rgba(217, 68, 58, .25); }
.fix-icon.warn { background: rgba(201, 204, 209, .14); box-shadow: 0 0 0 10px rgba(201, 204, 209, .07), 0 18px 50px rgba(201, 204, 209, .2); }
.fix-icon.prime { color: var(--accent); background: rgba(201, 204, 209, .14); box-shadow: 0 0 0 10px rgba(201, 204, 209, .07), 0 18px 50px rgba(201, 204, 209, .22); }
.fix-icon.blue { color: #E9EAEC; background: rgba(201, 204, 209, .15); box-shadow: 0 0 0 10px rgba(201, 204, 209, .07), 0 18px 50px rgba(0, 0, 0, .3); }
.fix-spin span { display: grid; place-items: center; width: 100%; height: 100%; font-size: 52px; color: #fff; animation: fix-rot 1.1s linear infinite; }
.fix-form { width: 100%; display: grid; gap: 12px; margin-top: 4px; text-align: left; }
.fix-field { display: grid; gap: 6px; }
.fix-field span { color: var(--fg-2); font-size: var(--fs-sm); font-weight: 500; }
.fix-field input { box-sizing: border-box; width: 100%; min-width: 0; height: 50px; padding: 0 14px; border-radius: 12px; border: 1px solid var(--line-2); background: var(--bg-sunk);
  color: var(--fg); font: 500 16px/1 var(--font); outline: none; transition: border-color var(--t-base), box-shadow var(--t-base); }
.fix-field input:focus { border-color: rgba(201, 204, 209, .7); box-shadow: 0 0 0 3px var(--accent-glow); }
.fix-field input[readonly] { color: var(--muted); }
.fix-field input.fix-code { height: 58px; text-align: center; font: 700 28px/1 var(--font-mono); letter-spacing: .4em; padding-left: .4em; }
.tgv a.tgv-later { text-decoration: none; display: inline-block; }
.tgv-bar .fix-bar-ico { flex: none; font-size: 18px; }
.fp-link { display: block; margin: -2px 0 6px auto; padding: 4px 0; background: none; border: 0; color: var(--accent);
  font: 500 14px/1.2 var(--font); cursor: pointer; }
.fp-link[hidden] { display: none; }
@keyframes fix-rot { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .fix-icon, .fix-spin span { animation: none; } }