/* Finsai Trade · SPP · registration + thank-you pages (loads after main.css) */

.topbar--mini { background: rgba(5, 10, 26, .78); border-bottom: 1px solid var(--line); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.topbar--mini .topbar__inner { justify-content: space-between; }
.back-link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line-2); color: var(--text); text-decoration: none; font-size: .92rem; font-weight: 600; transition: border-color .3s; }
.back-link:hover { border-color: rgba(63, 212, 255, .7); }
.back-link svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* ---------------------------------------------------------------- registration layout */
.reg { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); min-height: 100svh; }
.reg__stage {
  position: sticky; top: 0; height: 100svh; display: grid; place-content: center; justify-items: center; gap: 46px;
  padding: calc(var(--topbar-h) + 24px) var(--gutter) 56px; overflow: hidden; isolation: isolate;
  background: radial-gradient(60% 50% at 50% 40%, rgba(47, 139, 255, .24), transparent 70%), linear-gradient(180deg, #06122B, #050A1A 70%);
  border-right: 1px solid var(--line);
}
.reg__floor { position: absolute; left: -30%; right: -30%; bottom: 0; height: 46%; z-index: -2; overflow: hidden; perspective: 460px; perspective-origin: 50% 0; -webkit-mask-image: linear-gradient(to top, #000 15%, transparent 92%); mask-image: linear-gradient(to top, #000 15%, transparent 92%); }
.reg__grid {
  position: absolute; left: 0; right: 0; top: -80%; bottom: 0; transform-origin: 50% 100%; transform: rotateX(64deg);
  background-image: linear-gradient(rgba(63, 212, 255, .34) 1px, transparent 1px), linear-gradient(90deg, rgba(47, 139, 255, .26) 1px, transparent 1px);
  background-size: 56px 56px; animation: grid-run 2.6s linear infinite;
}
@keyframes grid-run { from { transform: rotateX(64deg) translateY(0); } to { transform: rotateX(64deg) translateY(56px); } }
.reg__stage.is-paused .reg__grid { animation-play-state: paused; }
.reg__glow { position: absolute; left: 50%; top: 42%; width: 560px; height: 560px; margin: -280px 0 0 -280px; border-radius: 50%; background: radial-gradient(circle, rgba(63, 212, 255, .2), transparent 64%); filter: blur(12px); z-index: -1; }

/* ---------------------------------------------------------------- partner pass (3D, flips between steps) */
.pass-wrap { position: relative; perspective: 1200px; }
.pass-tilt { transform-style: preserve-3d; will-change: transform; }
.pass { position: relative; width: min(440px, 36vw); aspect-ratio: 1.586; transform-style: preserve-3d; will-change: transform; }
.pass__face {
  position: absolute; inset: 0; border-radius: 26px; overflow: hidden; isolation: isolate;
  -webkit-backface-visibility: hidden; backface-visibility: hidden;
  border: 1px solid rgba(207, 245, 255, .4); box-shadow: 0 40px 90px -30px rgba(47, 139, 255, .65), inset 0 1px 0 rgba(255, 255, 255, .3);
}
.pass__face--front { display: grid; grid-template-rows: auto 1fr auto auto; gap: 8px; padding: 26px 28px 22px; }
.pass__face--front::after { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(90% 70% at 20% 0%, rgba(255, 255, 255, .28), transparent 55%); }
.pass__half { position: absolute; top: 0; bottom: 0; width: 50%; z-index: -1; }
.pass__half--a { left: 0; background: linear-gradient(140deg, #1CB4E3, #117CB4); }
.pass__half--b { right: 0; background: linear-gradient(140deg, #2474EC, #13439C); }
.pass__top { display: flex; align-items: center; justify-content: space-between; }
.pass__label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 700 .82rem var(--font-display); letter-spacing: .12em; text-transform: uppercase; color: rgba(255, 255, 255, .95); }
.pass__top { gap: 12px; }
.pass__chipset { display: flex; align-items: center; gap: 10px; }
.pass__chip { width: 46px; height: 34px; border-radius: 8px; background: linear-gradient(135deg, rgba(255, 255, 255, .8), rgba(255, 255, 255, .25)); }
.pass__wave { width: 22px; height: 22px; fill: none; stroke: rgba(255, 255, 255, .85); stroke-width: 1.8; stroke-linecap: round; }
.pass__id { align-self: end; display: grid; gap: 3px; min-width: 0; }
.pass__org { color: rgba(255, 255, 255, .92); font-size: .84rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pass__org:empty { display: none; }
.pass__name { display: block; font: 800 clamp(1.35rem, 1rem + 1.3vw, 2rem)/1.15 var(--font-display); color: #fff; letter-spacing: -.02em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-shadow: 0 2px 16px rgba(0, 0, 0, .25); }
.pass__name.is-typing { animation: name-glow .6s var(--ease); }
@keyframes name-glow { from { text-shadow: 0 0 22px rgba(207, 245, 255, 1), 0 0 4px #fff; } to { text-shadow: 0 2px 16px rgba(0, 0, 0, .25); } }
.pass__meta { display: flex; gap: 8px; flex-wrap: wrap; }
.pass__tag { padding: 5px 11px; border-radius: 999px; background: rgba(4, 18, 38, .45); color: #fff; font-size: .8rem; font-weight: 600; }
.pass__tag--ghost { background: transparent; border: 1px solid rgba(255, 255, 255, .5); }
.pass__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 10px; border-top: 1px dashed rgba(255, 255, 255, .45); color: rgba(255, 255, 255, .94); font-size: .82rem; }
.pass__foot b { white-space: nowrap; font-weight: 700; }
.pass__stamp {
  position: absolute; right: 24px; top: 50%; margin-top: -22px; height: 44px; display: inline-flex; align-items: center; gap: 6px; padding: 0 16px 0 12px;
  border-radius: 12px; border: 2px solid #fff; background: rgba(4, 18, 38, .3); color: #fff; font: 800 1.05rem var(--font-display); letter-spacing: .08em; text-transform: uppercase;
  transform: rotate(-10deg); opacity: 0; box-shadow: 0 0 24px rgba(207, 245, 255, .6);
}
.pass__stamp svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.pass__sheen { position: absolute; inset: -30% -60%; pointer-events: none; opacity: 0; background: linear-gradient(105deg, transparent 42%, rgba(255, 255, 255, .45) 50%, transparent 58%); }
.pass-shadow { position: absolute; left: 12%; right: 12%; bottom: -36px; height: 30px; border-radius: 50%; background: radial-gradient(closest-side, rgba(47, 139, 255, .5), transparent); filter: blur(8px); z-index: -1; }
.pass-scan { position: absolute; left: -4%; right: -4%; top: 0; height: 3px; border-radius: 3px; background: linear-gradient(90deg, transparent, #CFF5FF, transparent); box-shadow: 0 0 18px 4px rgba(63, 212, 255, .8); opacity: 0; pointer-events: none; }
.spark { position: absolute; width: 8px; height: 8px; margin: -4px 0 0 -4px; border-radius: 50%; background: #CFF5FF; box-shadow: 0 0 10px 2px rgba(63, 212, 255, .9); pointer-events: none; z-index: 5; }
.reg__facts { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 22px; color: var(--text-2); font-size: .95rem; }
.reg__facts li { display: flex; align-items: center; gap: 8px; }
.reg__facts li::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: linear-gradient(90deg, var(--cyan) 50%, var(--blue) 50%); box-shadow: 0 0 10px rgba(63, 212, 255, .7); }
.reg__facts b { color: #fff; }
.reg__facts li.is-hot::before { display: none; }

/* ---------------------------------------------------------------- panel + stepper */
.reg__panel { position: relative; padding: calc(var(--topbar-h) + 52px) clamp(24px, 6vw, 88px) 64px; max-width: 700px; width: 100%; }
.reg__title { font: 800 clamp(1.9rem, 1.1rem + 2.2vw, 2.9rem)/1.1 var(--font-display); letter-spacing: -.03em; }
.reg__intro { margin-top: 12px; color: var(--text-2); }
.minipass { display: none; }

/* ---------------------------------------------------------------- form */
.form { position: relative; display: grid; gap: 18px; }
.form > .field__err { margin-top: -8px; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.field { display: grid; gap: 8px; }
.field label, .field__label { font-size: .92rem; font-weight: 600; color: var(--text-2); transition: color .25s; }
.field:focus-within > label, .field:focus-within > .field__label { color: #9FE7FF; }
.opt { font-weight: 500; color: var(--text-3); font-size: .85em; }
.form input[type=text], .form input[type=email], .form input[type=tel], .form input[type=password], .form select, .form textarea {
  width: 100%; min-height: 54px; padding: 0 16px; border-radius: 14px;
  background: rgba(9, 24, 50, .85); border: 1px solid rgba(150, 190, 255, .24); color: var(--text);
  font: 500 1rem/1.4 var(--font-body); transition: border-color .25s, box-shadow .25s, background-color .25s, padding .25s;
  -webkit-appearance: none; appearance: none;
}
.form select { padding-right: 42px; color: var(--text); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239FE7FF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; background-size: 18px; }
.form select option { background: #0A1E33; color: #EEF4FF; }
.form input:hover, .form select:hover, .form textarea:hover { border-color: rgba(150, 190, 255, .42); }
.form input:focus-visible, .form select:focus-visible, .form textarea:focus-visible { outline: none; border-color: var(--cyan); box-shadow: 0 0 0 4px rgba(63, 212, 255, .16), 0 0 22px -6px rgba(63, 212, 255, .7); background-color: rgba(12, 32, 64, .95); }
.form [aria-invalid=true] { border-color: var(--danger) !important; box-shadow: 0 0 0 4px rgba(255, 107, 122, .14) !important; }
.ctl { position: relative; }
.ctl::after { z-index: 3;
  content: ""; position: absolute; right: 14px; top: 50%; width: 24px; height: 24px; margin-top: -12px; border-radius: 50%; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238FF0CB' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4L18 8.5'/%3E%3C/svg%3E") center / 15px no-repeat, rgba(91, 227, 176, .16);
  transform: scale(.4); opacity: 0; transition: transform .35s var(--ease), opacity .25s;
}
.ctl.is-valid::after { transform: scale(1); opacity: 1; }
.ctl.is-valid input { padding-right: 48px; }
.ctl--pw input { padding-right: 56px; }
.ctl--pw.is-valid input { padding-right: 92px; }
.ctl--pw.is-valid::after { right: 54px; }
.pw-toggle { position: absolute; z-index: 3; right: 6px; top: 50%; width: 44px; height: 44px; margin-top: -22px; display: grid; place-items: center; border-radius: 10px; color: #9FE7FF; transition: background-color .25s, color .25s; }
.pw-toggle:hover { background: rgba(63, 212, 255, .12); color: #fff; }
.pw-toggle svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pw-toggle .pw-toggle__hide { display: none; }
.pw-toggle.is-on .pw-toggle__show { display: none; }
.pw-toggle.is-on .pw-toggle__hide { display: block; }
.rules { list-style: none; display: grid; gap: 6px; margin-top: 2px; }
.rule { display: flex; align-items: center; gap: 10px; color: var(--text-3); font-size: .88rem; transition: color .3s; }
.rule i { flex: none; width: 18px; height: 18px; border-radius: 50%; border: 1.5px solid rgba(150, 190, 255, .45); transition: background-color .3s, border-color .3s, box-shadow .3s; }
.rule.is-ok { color: #8FF0CB; }
.rule.is-ok i { border-color: transparent; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238FF0CB' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4L18 8.5'/%3E%3C/svg%3E") center / 11px no-repeat, rgba(91, 227, 176, .2); box-shadow: 0 0 10px rgba(91, 227, 176, .35); }
.form__submit { width: 100%; margin-top: 2px; transition: box-shadow .6s var(--ease), transform .3s var(--ease); }
.form.is-ready .form__submit { box-shadow: 0 0 0 4px rgba(63, 212, 255, .16), 0 16px 44px -12px rgba(63, 212, 255, .95); }
@property --fa { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
.fl { position: relative; }
.fl__icon { position: absolute; left: 16px; top: 50%; width: 20px; height: 20px; margin-top: -10px; fill: none; stroke: rgba(159, 231, 255, .7); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; pointer-events: none; transition: stroke .25s; }
.fl:focus-within .fl__icon { stroke: var(--cyan); }
.form .fl input, .form .fl select { min-height: 60px; padding-top: 24px; padding-bottom: 8px; padding-left: 48px; }
.fl > label { position: absolute; left: 48px; top: 50%; transform: translateY(-50%); margin: 0; color: var(--text-3); font-size: 1rem; font-weight: 500; pointer-events: none; white-space: nowrap; transition: top .25s var(--ease), transform .25s var(--ease), font-size .25s var(--ease), color .25s; }
.fl input:focus ~ label, .fl input:not(:placeholder-shown) ~ label, .fl select:focus ~ label, .fl select:valid ~ label { top: 11px; transform: none; font-size: .72rem; font-weight: 600; color: #9FE7FF; letter-spacing: .01em; }
.fl__ring { position: absolute; inset: -1px; z-index: 2; border-radius: 15px; padding: 1.5px; pointer-events: none; opacity: 0; transition: opacity .35s;
  background: conic-gradient(from var(--fa), transparent 0 60%, rgba(63, 212, 255, .35) 72%, #E6FAFF 80%, rgba(63, 212, 255, .35) 88%, transparent 96%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); mask-composite: exclude;
  animation: ring-run 2.4s linear infinite; animation-play-state: paused; }
.fl:focus-within .fl__ring { opacity: 1; animation-play-state: running; }
@keyframes ring-run { to { --fa: 360deg; } }
.fl--select .fl__ring { z-index: 0; }
.form .fl--code select { min-height: 60px; padding: 0 34px 0 14px; font-weight: 600; }
.phone { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 10px; }
.strength { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto; gap: 6px; align-items: center; margin-top: 2px; }
.strength i { height: 5px; border-radius: 5px; background: rgba(150, 190, 255, .16); transition: background-color .35s, box-shadow .35s; }
.strength[data-score="1"] i:nth-child(-n+1) { background: var(--danger); }
.strength[data-score="2"] i:nth-child(-n+2) { background: var(--blue); }
.strength[data-score="3"] i:nth-child(-n+3) { background: var(--cyan); }
.strength[data-score="4"] i:nth-child(-n+4) { background: #5BE3B0; box-shadow: 0 0 10px rgba(91, 227, 176, .5); }
.strength span { min-width: 4.4em; text-align: right; font-size: .78rem; font-weight: 700; color: var(--text-3); }
.strength span:empty { display: none; }
.strength[data-score="4"] span { color: #8FF0CB; }
.form__terms { margin-top: 0; display: grid; gap: 8px; color: var(--text-3); font-size: .86rem; line-height: 1.55; }
.form__terms a { color: #9FE7FF; }
.field__err { color: var(--danger); font-size: .88rem; font-weight: 500; }
.field__err:empty { display: none; }

  content: ""; position: absolute; right: 9px; top: 9px; width: 18px; height: 18px; border-radius: 50%; transform: scale(0); transition: transform .35s var(--ease);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23041226' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4L18 8.5'/%3E%3C/svg%3E") center / 12px no-repeat, linear-gradient(135deg, #3FD4FF, #2F8BFF);
}

.field__note { display: flex; align-items: flex-start; gap: 8px; color: var(--text-3); font-size: .86rem; line-height: 1.45; }
.field__note::before { content: ""; flex: none; width: 7px; height: 7px; margin-top: .45em; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 8px rgba(63, 212, 255, .7); }
.field__note--stop { padding: 10px 12px; border-radius: 12px; background: rgba(255, 107, 122, .1); border: 1px solid rgba(255, 107, 122, .4); color: #FFD1D6; }
.field__note--stop::before { background: var(--danger); box-shadow: none; }
.form input::placeholder, .form textarea::placeholder { color: rgba(207, 226, 255, .62); }


/* trading journey: a short section of its own after the account details, one tap, styled like the inputs */
.journey { margin-top: 6px; padding-top: 22px; border-top: 1px solid var(--line); }
.journey__set { min-width: 0; margin: 0; padding: 0; border: 0; }
.journey__legend { display: grid; gap: 4px; width: 100%; margin: 0 0 14px; padding: 0; }
.journey__lead { font: 700 1.08rem/1.3 var(--font-display); color: var(--text); letter-spacing: -.01em; text-wrap: balance; }
.journey__q { font-size: .92rem; font-weight: 600; color: var(--text-2); }
.journey__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.journey .journey__opt {
  position: relative; display: flex; align-items: center; gap: 12px; min-height: 58px; padding: 12px 16px; border-radius: 14px;
  background: rgba(9, 24, 50, .85); border: 1px solid rgba(150, 190, 255, .24); color: var(--text);
  font: 500 .95rem/1.3 var(--font-body); cursor: pointer; -webkit-tap-highlight-color: transparent;
  transition: border-color .25s, box-shadow .25s, background-color .25s;
}
.journey .journey__opt:hover { border-color: rgba(150, 190, 255, .42); }
.journey__opt input { position: absolute; left: 16px; top: 50%; width: 20px; height: 20px; margin: -10px 0 0; opacity: 0; pointer-events: none; }
.journey__dot { position: relative; flex: none; width: 20px; height: 20px; border-radius: 50%; border: 1.5px solid rgba(150, 190, 255, .45); transition: border-color .25s, box-shadow .25s; }
.journey__dot::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: var(--cyan); transform: scale(0); transition: transform .35s var(--ease); }
.journey__opt input:checked + .journey__dot { border-color: var(--cyan); box-shadow: 0 0 10px rgba(63, 212, 255, .45); }
.journey__opt input:checked + .journey__dot::after { transform: scale(1); }
.journey .journey__opt.is-on, .journey .journey__opt:has(input:checked) { border-color: var(--cyan); background-color: rgba(12, 32, 64, .95); box-shadow: 0 0 0 4px rgba(63, 212, 255, .1); }
.journey .journey__opt:has(input:focus-visible) { border-color: var(--cyan); box-shadow: 0 0 0 4px rgba(63, 212, 255, .16), 0 0 22px -6px rgba(63, 212, 255, .7); }
.journey.has-err .journey__opt { border-color: rgba(255, 107, 122, .55); }
.pass__meta:has(.pass__tag--journey:not([hidden])) { flex-wrap: nowrap; }
.pass__meta:has(.pass__tag--journey:not([hidden])) .pass__tag { white-space: nowrap; }
.pass__tag--journey { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.pass__tag--journey[hidden] { display: none; }
.check { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 12px; align-items: start; color: var(--text-2); font-size: .95rem; line-height: 1.55; cursor: pointer; }
.check input { width: 22px; height: 22px; margin: 2px 0 0; accent-color: var(--cyan); cursor: pointer; }
.check a { color: var(--cyan); }
.check.has-err span { color: #FFD1D6; }
.form__risk { color: var(--text-3); font-size: .85rem; line-height: 1.55; }
.form__status { margin-top: 0; color: var(--text-2); font-size: .95rem; }
.form__status:empty { display: none; }
.form__status.is-error { color: var(--danger); }
.form__trust { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 0; color: var(--text-3); font-size: .84rem; text-align: center; }
.form__trust svg { flex: none; width: 16px; height: 16px; fill: none; stroke: #9FE7FF; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* send button: stretches into its own progress plate, then floods into the sent state */
.send { overflow: hidden; isolation: isolate; min-width: 220px; }
.send__plate { position: absolute; left: 0; bottom: 0; width: 0; height: 4px; z-index: -1; background: linear-gradient(90deg, #CFF5FF, #fff); transition: width 1.6s var(--ease-quart), height .6s var(--ease), background .4s; }
.send__label { transition: opacity .25s, transform .4s var(--ease); }
.send__ring, .send__tick { position: absolute; top: 50%; width: 22px; height: 22px; margin-top: -11px; fill: none; stroke: #041226; stroke-linecap: round; stroke-linejoin: round; }
.send__ring { left: 50%; margin-left: -11px; stroke-width: 2.6; stroke-dasharray: 40 60; opacity: 0; transform: scale(.5); transition: opacity .3s, transform .4s var(--ease); }
.send__tick { left: 20px; stroke-width: 3; stroke-dasharray: 24; stroke-dashoffset: 24; transition: stroke-dashoffset .5s .2s var(--ease); }
.send.is-loading .send__label { opacity: 0; transform: translateY(-12px); }
.send.is-loading .send__ring { opacity: 1; transform: scale(1); animation: ring-spin .8s linear infinite; }
.send.is-loading .send__plate { width: 86%; }
.send.is-done .send__plate { width: 100%; height: 100%; background: linear-gradient(100deg, #8FF0CB, #5BE3B0); }
.send.is-done .send__label { opacity: 1; transform: none; padding-left: 22px; }
.send.is-done .send__tick { stroke-dashoffset: 0; }
.send[disabled] { cursor: progress; }
@keyframes ring-spin { to { transform: rotate(360deg); } }

.mini-foot { display: grid; gap: 8px; padding: 26px var(--gutter) calc(26px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: var(--ink-3); text-align: center; }
.mini-foot p { max-width: 110ch; margin-inline: auto; color: rgba(255, 255, 255, .72); font-size: .82rem; line-height: 1.6; }
.mini-foot a { color: rgba(255, 255, 255, .9); }

/* ---------------------------------------------------------------- thank-you */
.thanks { position: relative; min-height: 100svh; display: grid; grid-template-columns: minmax(0, 1fr); align-content: center; justify-items: center; text-align: center; padding: calc(var(--topbar-h) + 10px) var(--gutter) 64px; overflow: hidden; isolation: isolate; background: radial-gradient(60% 50% at 50% 34%, rgba(47, 139, 255, .22), transparent 70%), var(--ink); }
.thanks__stage { position: relative; width: min(560px, 100%); height: min(46svh, 440px); }
.thanks__stage canvas { width: 100%; height: 100%; opacity: 0; transition: opacity 1.2s var(--ease); }
.thanks__stage.is-live canvas { opacity: 1; }
.thanks__stage .hero__fallback { right: 50%; transform: translate(50%, -50%); width: min(240px, 60vw); }
.thanks__stage.is-fallback .hero__fallback { display: block; }
.thanks__title { font: 800 clamp(2.2rem, 1.2rem + 3.6vw, 3.8rem)/1.05 var(--font-display); letter-spacing: -.035em; }
.thanks__name { margin-top: 14px; font: 700 clamp(1.1rem, 1rem + .5vw, 1.35rem) var(--font-display); color: #9FE7FF; }
.thanks__text { margin-top: 12px; max-width: 52ch; color: var(--text-2); }
.nexts { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; width: min(900px, 100%); margin-top: 40px; text-align: left; counter-reset: n; }
.nexts li { position: relative; padding: 22px; border-radius: 20px; border: 1px solid var(--line-2); background: rgba(10, 30, 51, .55); }
.nexts li::before { counter-increment: n; content: counter(n); display: grid; place-items: center; width: 34px; height: 34px; margin-bottom: 14px; border-radius: 50%; background: linear-gradient(135deg, var(--cyan), var(--blue)); color: #041226; font: 800 .95rem var(--font-display); }
.nexts h2 { font-size: 1.1rem; font-weight: 700; letter-spacing: -.01em; }
.nexts p { margin-top: 6px; color: var(--text-2); font-size: .95rem; line-height: 1.55; }
.thanks__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 36px; }

@media (max-width: 959px) {
  body.page-apply, body.page-thanks { padding-bottom: 0; }
  .reg { grid-template-columns: minmax(0, 1fr); }
  .reg__stage { position: relative; height: auto; gap: 0; padding: calc(var(--topbar-h) + 26px) var(--gutter) 42px; border-right: 0; border-bottom: 1px solid var(--line); }
  .reg__floor { height: 62%; }
  .reg__glow { width: 420px; height: 420px; margin: -210px 0 0 -210px; }
  .reg__facts { display: none; }
  .pass { width: min(360px, 84vw); }
  .pass__face { border-radius: 22px; }
  .pass__face--front { padding: 18px 20px 16px; }
  .pass__label { font-size: .72rem; letter-spacing: .1em; }
  .pass__tag--journey { display: none; }
  .pass__chip { width: 38px; height: 28px; }
  .pass__strength { padding-top: 6px; }
  .pass-shadow { bottom: -28px; }
  .reg__panel { padding: 26px var(--gutter) 22px; margin-inline: auto; }
  .minipass {
    position: sticky; top: calc(var(--topbar-h) + env(safe-area-inset-top)); z-index: 20; isolation: isolate; display: flex; align-items: center; gap: 10px; height: 50px;
    margin: -26px calc(var(--gutter) * -1) -24px; padding: 0 var(--gutter);
    background: linear-gradient(100deg, #1CB4E3, #2474EC); box-shadow: 0 12px 26px -14px rgba(0, 0, 0, .9); color: #fff;
    opacity: 0; transform: translateY(-10px); transition: opacity .35s, transform .45s var(--ease); pointer-events: none;
  }
  .minipass.is-on { opacity: 1; transform: none; }
  .minipass__chip { flex: none; width: 30px; height: 22px; border-radius: 5px; background: linear-gradient(135deg, rgba(255, 255, 255, .85), rgba(255, 255, 255, .3)); }
  .minipass__name { flex: 1; min-width: 0; font: 800 1rem var(--font-display); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .minipass__step { flex: none; padding: 4px 10px; border-radius: 999px; background: rgba(4, 18, 38, .35); font-size: .8rem; font-weight: 700; white-space: nowrap; }
  .nexts { grid-template-columns: minmax(0, 1fr); }
  .thanks__actions .btn { flex: 1 1 100%; white-space: normal; text-align: center; text-wrap: balance; }
  .back-link span { display: none; }
  .back-link { width: 48px; padding: 0; justify-content: center; }
}
@media (max-width: 540px) {
  .journey__grid { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .journey .journey__opt { min-height: 52px; }
}
@media (max-width: 380px) {
  .pass__offer { display: none; }
  .pass__wave { display: none; }
}
.mini-foot a { display: inline-block; padding: 10px 4px; margin: -10px -4px; }