:root {
  color-scheme:light;
  --primary:#00a2ed;
  --ink:#182235;
  --muted:#697386;
  --paper:#fbfaf7;
  --divider:#e5edf7;
  font-family:Arial,"PingFang SC","Microsoft YaHei",sans-serif;
  color:var(--ink)}

* {
  box-sizing:border-box}
body {
  margin:0;
  min-height:100vh;
  min-height:100svh;
  display:flex;
  flex-direction:column;
  background:#171c26 url('assets/fintech-illustration.webp') center/cover fixed no-repeat}
body::before {
  content:"";
  position:fixed;
  inset:0;
  background:rgb(0 0 0 / 16%);
  pointer-events:none;
  z-index:-1}
header {
  border-bottom:1px solid #ffffff1a;
  padding:16px 24px;
  color:white}
.header-inner {
  max-width:1400px;
  margin:auto;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px}
.wordmark {
  font-size:28px;
  font-weight:500;
  letter-spacing:4px;
  line-height:32px}
nav {
  display:flex;
  align-items:center;
  gap:20px}
a {
  color:inherit;
  text-decoration:none}
a:hover {
  text-decoration:underline}
select {
  font:inherit;
  color:inherit;
  background:transparent;
  border:0;
  padding:8px;
  cursor:pointer}
select option {
  color:var(--ink);
  background:white}
.contact {
  border:0;
  padding:8px 0;
  background:none;
  color:inherit;
  cursor:pointer;
  font-family:inherit;
  display:flex;
  align-items:center;
  gap:8px;
  font-size:14px}
.contact img {
  width:16px;
  filter:brightness(0) invert(1)}
main {
  width:100%;
  max-width:1400px;
  margin:auto;
  flex:1;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:48px;
  padding:36px 24px;
  min-height:0}
.card {
  position:relative;
  width:430px;
  flex-shrink:0;
  background:var(--paper);
  border:1px solid #d7e2f1;
  border-top:2px solid var(--primary);
  border-radius:8px;
  box-shadow:0 24px 80px #0f172a47;
  padding:36px}
.back {
  display:flex;
  align-items:center;
  gap:8px;
  background:none;
  border:none;
  padding:0;
  margin-bottom:16px;
  font-size:14px;
  color:var(--muted);
  cursor:pointer}
.back img {
  width:16px}
.card-heading {
  padding-bottom:24px;
  border-bottom:1px solid var(--divider);
  margin-bottom:32px}
h1 {
  font-size:24px;
  font-weight:600;
  line-height:1.35;
  margin:0}
#subtitle {
  font-size:16px;
  line-height:1.6;
  color:var(--muted);
  margin:8px 0 0}
label {
  display:block;
  font-size:14px;
  font-weight:500;
  margin-bottom:8px}
.input-shell {
  display:flex;
  align-items:center;
  gap:10px;
  height:48px;
  border-bottom:1px solid #b8c0cc;
  min-width:0;
  margin-bottom:20px}
.input-shell:focus-within {
  border-bottom:2px solid var(--primary)}
.input-shell>img {
  width:20px;
  height:20px;
  margin:0 10px;
  flex-shrink:0}
input {
  width:100%;
  min-width:0;
  flex:1;
  font:inherit;
  font-size:16px;
  color:var(--ink);
  background:transparent;
  border:0;
  outline:0;
  height:32px}
input::placeholder {
  color:#9aa5b5}
input:-webkit-autofill {
  box-shadow:inset 0 0 0 1000px var(--paper);
  -webkit-text-fill-color:var(--ink)}
button {
  font-family:inherit}
button:disabled {
  cursor:not-allowed;
  opacity:.45}
.code-row {
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:20px}
.code-row .input-shell {
  margin:0;
  flex:1}
.text-button {
  flex-shrink:0;
  border:0;
  background:none;
  padding:8px 0;
  color:#007eb8;
  font-size:14px;
  font-weight:500;
  min-height:44px;
  cursor:pointer}
.primary {
  display:block;
  width:100%;
  min-height:48px;
  border:0;
  border-radius:6px;
  background:var(--primary);
  color:white;
  font-size:16px;
  font-weight:500;
  line-height:1.53;
  padding:14px 12px;
  box-shadow:0 14px 28px #00a2ed42;
  cursor:pointer}
.primary:hover {
  background:#0088c7}
.primary:active {
  transform:scale(.99)}
.visibility {
  width:44px;
  height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  border:0;
  background:none;
  cursor:pointer}
.visibility img {
  width:20px}
.hint,.auth-note {
  color:var(--muted);
  font-size:12px;
  line-height:1.6}
.hint {
  margin:-8px 0 20px}
.auth-note {
  margin:16px 0 0}
.feedback {
  color:#b42318;
  font-size:13px;
  line-height:1.6;
  margin:12px 0 0}
.feedback:empty {
  display:none}
.feedback[data-kind="info"] {
  color:#007eb8}
.card-footer {
  margin-top:20px;
  border-top:1px solid var(--divider);
  padding-top:24px;
  text-align:center;
  color:#566274;
  font-size:14px;
  line-height:1.55}
.card-footer .text-button {
  color:#007eb8;
  font-weight:500}
.notice {
  align-self:flex-end;
  margin-right:auto;
  max-width:510px;
  background:#111111d9;
  color:#d1d5db;
  border-radius:2px;
  padding:24px;
  box-shadow:0 18px 40px #00000038}
.notice h2 {
  display:flex;
  align-items:center;
  gap:8px;
  margin:0 0 16px;
  font-size:16px;
  font-weight:500;
  color:#e5e7eb}
.notice h2 img {
  width:16px;
  filter:brightness(0) invert(.85)}
.notice-content {
  max-height:220px;
  overflow:auto;
  padding-right:8px}
.notice p {
  font-size:14px;
  line-height:1.55;
  margin:0 0 16px}
.notice h3 {
  font-size:14px;
  font-weight:500;
  color:#e5e7eb;
  margin:0 0 4px}
.notice p:last-child {
  margin-bottom:0}
footer {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:16px;
  border-top:1px solid #ffffff1a;
  background:#020617e6;
  padding:24px;
  color:#94a3b8;
  font-size:12px;
  line-height:1.6}
.separator {
  color:#334155}
[hidden] {
  display:none!important}
:focus-visible {
  outline:2px solid var(--primary);
  outline-offset:4px}
input:focus-visible {
  outline:0}
.noscript {
  padding:12px;
  background:var(--paper);
  text-align:center}

@media(max-width:1535px) {
  main {
  padding:28px 24px;
  gap:32px}
.card {
  width:400px;
  padding:28px}
.card-heading {
  margin-bottom:24px;
  padding-bottom:20px}
.notice {
  max-width:460px;
  padding:16px}
.notice-content {
  max-height:180px}
}

@media(max-width:1199px) {
  main {
  min-height:0;
  justify-content:center;
  padding:32px 20px}
.notice {
  display:none}
.card {
  width:100%;
  max-width:430px}
footer {
  justify-content:center;
  text-align:center}
footer .separator:nth-last-child(2) {
  display:none}
footer>span:last-child {
  flex-basis:100%}
}

@media(max-width:479px) {
  header {
  padding:16px 20px}
.contact {
  border:0;
  padding:8px 0;
  background:none;
  color:inherit;
  cursor:pointer;
  font-family:inherit;
  display:none}
nav {
  gap:0}
select {
  font-size:13px;
  padding:8px 0}
.card {
  padding:24px}
main {
  padding:24px 20px}
.card-heading {
  margin-bottom:24px}
h1 {
  font-size:23px}
footer {
  gap:12px;
  padding:20px}
.code-row {
  gap:8px}
.input-shell>img {
  margin:0 4px}
.input-shell {
  gap:8px}
.text-button {
  font-size:13px}
}

@media(prefers-reduced-motion:reduce) {
  .primary:active {
  transform:none}
}


footer button {
  font:inherit;
  color:inherit;
  border:0;
  background:none;
  padding:0;
  cursor:pointer;
  min-height:32px}
footer button:hover {
  text-decoration:underline}
dialog {
  max-width:440px;
  width:calc(100% - 40px);
  border:1px solid var(--divider);
  border-radius:8px;
  padding:28px;
  color:var(--ink);
  background:var(--paper);
  box-shadow:0 24px 80px #0f172a47}
dialog::backdrop {
  background:#02061799}
dialog h2 {
  font-size:20px;
  font-weight:500;
  margin:0 0 16px}
dialog p {
  font-size:14px;
  line-height:1.7;
  margin:0 0 24px}


.card-footer a { display:inline-flex; align-items:center; }
/* Individual onboarding uses the same account palette and controls. */
.onboarding { max-width:1200px; align-items:flex-start; justify-content:center; gap:32px; padding:36px 24px; }
.kyc-sidebar { width:240px; flex-shrink:0; position:sticky; top:24px; color:#fff; padding:24px; border:1px solid rgba(172,207,255,.28); border-radius:12px; background:rgba(8,24,49,.78); backdrop-filter:blur(20px) saturate(130%); -webkit-backdrop-filter:blur(20px) saturate(130%); box-shadow:0 16px 40px rgba(0,8,24,.3), inset 0 1px 0 rgba(255,255,255,.08); }
.kyc-sidebar h2 { font-size:24px; font-weight:500; margin:12px 0; }
.kyc-sidebar .hint { color:#b8c5d9; margin:0 0 28px; font-size:14px; }
.eyebrow { color:var(--primary); letter-spacing:2px; font-size:12px; font-weight:500; margin:0 0 12px; }
#kyc-steps { display:flex; flex-direction:column; align-items:stretch; gap:8px; margin-bottom:24px; }
.step-link { min-height:48px; text-align:left; border:1px solid transparent; border-radius:6px; padding:12px 16px; background:transparent; color:#ccd7e9; font-size:14px; cursor:pointer; }
.step-link.active { color:white; border-color:#00a2ed66; background:#00a2ed22; }
.step-link:disabled { opacity:1; color:#9eafc7; cursor:default; }
.kyc-card { flex:1; min-width:0; max-width:840px; padding:36px; border-radius:8px; background:var(--paper); border:1px solid #d7e2f1; border-top:2px solid var(--primary); box-shadow:0 24px 80px #0f172a47; }
.kyc-heading { border-bottom:1px solid var(--divider); padding-bottom:24px; margin-bottom:28px; }
.kyc-heading p:last-child { color:var(--muted); font-size:14px; line-height:1.7; margin:12px 0 0; }
.kyc-section { border:0; padding:0; margin:0; min-width:0; }
.kyc-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.kyc-field { min-width:0; }
.kyc-field.full { grid-column:1 / -1; }
.kyc-field label { line-height:1.6; margin-bottom:8px; }
.kyc-field input:not([type=checkbox]),.kyc-field select,.kyc-field textarea { width:100%; min-height:48px; height:48px; padding:10px 12px; border:1px solid #b8c0cc; border-radius:6px; background:transparent; font:inherit; font-size:14px; color:var(--ink); }
.kyc-field textarea { resize:vertical; min-height:96px; }
.kyc-field select { white-space:normal; }
.kyc-field input[type=file] { padding:10px; font-size:12px; }
.kyc-field input:focus-visible,.kyc-field select:focus-visible,.kyc-field textarea:focus-visible { border-color:var(--primary); outline:2px solid #00a2ed33; outline-offset:1px; }
.choices { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 16px; }
.choice { display:flex; align-items:flex-start; gap:10px; font-size:14px; font-weight:400; min-height:40px; padding:8px 0; line-height:1.6; cursor:pointer; }
.choice input { flex:none; width:18px; height:18px; margin:3px 0 0; accent-color:var(--primary); }
.kyc-field .hint { margin:8px 0 0; }
.kyc-actions { display:flex; justify-content:space-between; gap:16px; border-top:1px solid var(--divider); margin-top:32px; padding-top:24px; }
.kyc-actions button { width:auto; min-width:120px; box-shadow:none; }
.kyc-actions .primary { margin-left:auto; }
.secondary { min-height:48px; padding:12px 20px; border:1px solid #b8c0cc; border-radius:6px; color:var(--ink); background:transparent; font-size:14px; cursor:pointer; }
.declaration { font-size:15px; line-height:1.8; margin:0 0 24px; }
.declaration-choice { margin-top:24px; }
.verification { text-align:center; padding:24px 0; }
.verification-icon { width:64px; height:64px; }
.verification h2 { font-size:24px; font-weight:500; margin:24px 0 12px; }
.verification p { font-size:14px; line-height:1.8; color:var(--muted); }
.provider { letter-spacing:1px; font-size:12px!important; }
#kyc-sections .kyc-section> .primary { margin-top:24px; }
#kyc-sections .kyc-section> .kyc-field { margin-bottom:20px; }
.file-name { font-size:12px; color:#007eb8; overflow-wrap:anywhere; margin:8px 0 0; }
#application-complete { text-align:center; padding:20px 0; }
.completion-icon { width:64px; height:64px; }
#application-complete h2,#login-complete h2 { font-size:24px; font-weight:500; }
#application-complete p,#login-complete p { color:var(--muted); line-height:1.8; font-size:14px; margin-bottom:24px; }
#application-complete a,#login-complete a { text-align:center; }
#login-complete>button { display:block; margin:16px auto 0; }
.review { display:grid; grid-template-columns:1fr 1fr; gap:16px; padding:20px 0; border-bottom:1px solid var(--divider); margin:0 0 24px; }
.review dt { color:var(--muted); font-size:12px; }
.review dd { margin:4px 0 0; font-size:14px; overflow-wrap:anywhere; }
@media(max-width:899px) {
  .onboarding { flex-direction:column; gap:20px; padding:24px 20px; }
  .kyc-sidebar { position:static; width:100%; padding:20px; }
  .kyc-sidebar h2 { font-size:20px; }
  .kyc-sidebar .hint { margin-bottom:16px; }
  #kyc-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; margin:0; }
  .step-link { padding:8px; font-size:12px; min-height:44px; }
  .kyc-sidebar>a { display:none; }
  .kyc-card { width:100%; padding:24px; }
}
@media(max-width:599px) {
  .kyc-grid,.choices { grid-template-columns:1fr; gap:16px; }
  .choices { gap:0; }
  .kyc-field.full { grid-column:auto; }
  .kyc-heading { margin-bottom:24px; }
  .kyc-card { padding:20px; }
  .kyc-heading h1 { font-size:23px; }
  .kyc-actions { gap:12px; }
  .kyc-actions button { min-width:100px; }
  .review { grid-template-columns:1fr; }
}

#sumsub-websdk-container { width:100%; }
#sumsub-websdk-container iframe { border:0; width:100%; }

iframe#sumsub-websdk-container { width:100%; height:780px; border:0; background:#fff; border-radius:8px; }

.kyc-field .required-mark { color:#dc2626; }