:root{color-scheme:dark;--text:#f4f6f8;--muted:#939ca8;--line:rgba(255,255,255,.10);--panel:#0c0f13;--font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
    *{box-sizing:border-box} [hidden]{display:none!important}
    html,body{margin:0;width:100%;height:100%;background:#040507;color:var(--text)}
    body{font-family:var(--font);-webkit-font-smoothing:antialiased;overflow:hidden;background:#040507}
    button,input{font:inherit}
    .shell{position:relative;width:100%;height:100%;display:grid;grid-template-columns:minmax(320px,520px) minmax(0,760px);align-items:center;justify-content:center;gap:clamp(28px,4vw,72px);padding:34px clamp(28px,4vw,64px);overflow:hidden}
    .registration-companion{position:relative;width:100%;max-width:450px;display:grid;place-items:center;isolation:isolate;pointer-events:none;justify-self:center}
    .registration-companion__glow{position:absolute;inset:14% 8% 10%;z-index:-1;border-radius:50%;background:radial-gradient(circle,rgba(119,120,255,.18) 0%,rgba(255,60,185,.14) 40%,transparent 76%);filter:blur(38px);animation:companionGlow 4.8s ease-in-out infinite}
    .registration-companion img{display:block;width:min(86%,400px);max-height:74vh;height:auto;object-fit:contain;filter:drop-shadow(0 20px 38px rgba(0,0,0,.36)) drop-shadow(0 0 18px rgba(124,105,255,.14));transform-origin:50% 55%;animation:companionFloat 7.2s ease-in-out infinite}
    @keyframes companionFloat{0%,100%{transform:translate3d(0,4px,0) scale(.985)}50%{transform:translate3d(0,-8px,0) scale(1)}}
    @keyframes companionGlow{0%,100%{opacity:.62;transform:scale(.96)}50%{opacity:1;transform:scale(1.035)}}
    .close{position:absolute;top:12px;right:24px;width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:#0b0d10;color:#aeb6c0;font-size:20px;cursor:pointer;z-index:5}
    .stage{width:min(100%,760px);min-height:390px;display:grid;place-items:center;position:relative;padding:0}
    .scene{position:relative;z-index:1;width:100%;display:grid;gap:18px;align-content:center;justify-items:stretch;opacity:1;transform:translateY(0);padding:18px 14px}
    .scene.is-leaving{animation:leave .34s ease forwards}
    .scene.is-entering{animation:enter .38s cubic-bezier(.2,.72,.2,1) both}
    @keyframes leave{to{opacity:0;transform:translateY(-22px)}}
    @keyframes enter{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}

    .ksan-row{width:min(100%,690px);margin:0 auto;display:grid;gap:0;justify-items:center;align-items:center;text-align:left}
    .message{width:min(100%,610px);min-width:0;padding-top:0}
    .name{margin-bottom:7px;color:#707985;font-size:10px;font-weight:760;letter-spacing:.07em;text-transform:uppercase}
    .title{margin:0;color:#f5f7f9;font-size:25px;line-height:1.15;font-weight:680;letter-spacing:-.04em;min-height:1.15em}
    .copy{max-width:610px;margin:9px 0 0;color:#aab3bd;font-size:15px;line-height:1.52;min-height:1.5em}
    .copy strong{color:#edf1f4;font-weight:650}
    .aside{max-width:590px;margin:11px 0 0;color:#737c87;font-size:13px;line-height:1.48;min-height:1.48em}

    @keyframes dot{0%,70%,100%{opacity:.25;transform:translateY(0)}35%{opacity:.95;transform:translateY(-2px)}}

    .controls{width:min(100%,610px);margin:0 auto;display:flex;gap:10px;flex-wrap:wrap}
    .primary,.secondary{height:46px;padding:0 20px;border-radius:14px;font-weight:740;cursor:pointer;transition:transform .13s ease,background .15s ease,border-color .15s ease}
    .primary{border:0;background:#f1f2f3;color:#0a0c0e}.primary:hover{background:#fff}
    .secondary{border:1px solid var(--line);background:#0c0f13;color:#e4e8ec}.secondary:hover{background:#11151a;border-color:rgba(255,255,255,.16)}
    .primary:active,.secondary:active{transform:scale(.985)}

    .id-box{width:min(100%,610px);margin:0 auto;display:grid;gap:10px}
    .field-label{color:#727b86;font-size:11px;font-weight:650}
    .field{height:54px;padding:0 15px;border-radius:15px;border:1px solid var(--line);background:#0b0d10;display:flex;align-items:center}
    .field input{width:100%;border:0;outline:0;background:transparent;color:#f5f7f9;font-size:16px;letter-spacing:.045em;font-weight:650}
    .field input::placeholder{color:#5e6671;font-weight:450;letter-spacing:0}
    .field-note{margin:0;color:#69727d;font-size:12px;line-height:1.45}
    .id-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:3px}
    .id-actions .secondary{min-width:160px}.id-actions .primary{min-width:190px}

    .selected-pill{display:inline-flex;align-items:center;gap:8px;margin-top:10px;padding:7px 10px;border:1px solid var(--line);border-radius:999px;color:#cbd2da;background:#0b0d10;font-size:12px}
    .nick-box{width:min(100%,610px);margin:0 auto;display:grid;gap:10px}
    .nick-status{min-height:20px;margin:1px 0 0;color:#8f98a4;font-size:12px;line-height:1.4}
    .nick-status.is-good{color:#dfe5eb}.nick-status.is-bad{color:#aeb6c0}
    .nick-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:3px}
    .nick-actions .secondary{min-width:150px}.nick-actions .primary{min-width:190px}
    .nickname-preview{display:inline-flex;align-items:center;gap:8px;padding:8px 11px;border:1px solid var(--line);border-radius:12px;background:#0b0d10;color:#edf1f4;font-size:13px;font-weight:650}
    .password-box{width:min(100%,610px);margin:0 auto;display:grid;gap:10px}
    .password-field{position:relative}
    .password-field .field{padding-right:50px}
    .password-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:36px;height:36px;border:0;border-radius:10px;background:transparent;color:#78828d;cursor:pointer;font-size:12px;font-weight:700}
    .password-toggle:hover{background:#11151a;color:#e9edf1}
    .password-meter{height:5px;border-radius:999px;background:#11151a;overflow:hidden;border:1px solid rgba(255,255,255,.04)}
    .password-meter__bar{height:100%;width:0;background:#929ba6;border-radius:inherit;transition:width .22s ease,background .22s ease}
    .password-status{min-height:36px;color:#838d98;font-size:12px;line-height:1.45}
    .password-status strong{color:#e8edf1}
    .password-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:2px}
    .password-actions .secondary{min-width:150px}.password-actions .primary{min-width:190px}
    .password-preview{display:grid;gap:4px;margin-top:8px;color:#818a95;font-size:12px}
    .password-preview strong{color:#e7ecf0;font-size:13px}
    .summary-box{width:min(100%,610px);margin:0 auto;display:grid;gap:10px}
    .summary-list{display:grid;gap:8px}
    .summary-item{display:grid;grid-template-columns:118px minmax(0,1fr);gap:14px;align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:#0b0d10}
    .summary-label{color:#747e89;font-size:11px;font-weight:700;letter-spacing:.02em;text-transform:uppercase}
    .summary-value{min-width:0;color:#eef2f5;font-size:14px;font-weight:650;line-height:1.35;overflow-wrap:anywhere;user-select:all}
    .summary-note{margin:2px 0 0;color:#87919c;font-size:12px;line-height:1.5}
    .summary-wait{min-height:18px;color:#69737e;font-size:11px;line-height:1.35}
    .summary-actions{display:flex;gap:10px;margin-top:2px}
    .summary-actions[hidden]{display:none!important}
    @media(max-width:680px){.summary-item{grid-template-columns:1fr;gap:5px}.summary-actions{display:grid;grid-template-columns:1fr}.summary-actions .primary{width:100%}}
    .backup-box{width:min(100%,610px);margin:0 auto;display:grid;gap:12px}
    .backup-warning{padding:13px 14px;border:1px solid rgba(255,255,255,.11);border-radius:14px;background:#0b0d10;color:#a7b0ba;font-size:12px;line-height:1.5}
    .backup-warning strong{color:#f0f3f5}
    .backup-codes{display:grid;grid-template-columns:1fr 1fr;gap:8px}
    .backup-code{padding:12px 13px;border:1px solid var(--line);border-radius:13px;background:#0b0d10;color:#eef2f5;font-size:13px;font-weight:700;letter-spacing:.075em;text-align:center;user-select:all}
    .backup-actions{display:grid;gap:8px;margin-top:2px}
    .backup-actions .primary,.backup-actions .secondary{width:100%}
    .backup-finish[hidden]{display:none!important}
    .download-note{min-height:18px;color:#707a85;font-size:11px;line-height:1.4;text-align:center}
    @media(max-width:520px){.backup-codes{grid-template-columns:1fr}.backup-code{font-size:12px}}

    @media(max-width:760px){
      .shell{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);gap:10px;padding:54px 16px 20px;overflow:auto;align-content:center}
      .close{right:14px;top:10px}
      .registration-companion{width:min(88vw,360px);margin:0 auto -8px}
      .registration-companion img{width:min(80%,270px);max-height:210px;height:auto;max-width:100%}
      .registration-companion__glow{inset:15% 8% 8%;filter:blur(24px)}
      .stage{min-height:330px;padding:0}
      .ksan-row{gap:14px}
      .message{width:100%}.title{font-size:22px}.copy{font-size:14px}.aside{font-size:12px}
      .primary,.secondary{height:44px;padding:0 16px}.id-actions,.nick-actions,.password-actions{display:grid;grid-template-columns:1fr}.id-actions .primary,.id-actions .secondary,.nick-actions .primary,.nick-actions .secondary,.password-actions .primary,.password-actions .secondary{width:100%;min-width:0}
    }
  
    .password-generate{
      width:100%;
      min-height:44px;
      margin-top:10px;
      border:1px solid rgba(255,255,255,.10);
      border-radius:14px;
      background:rgba(255,255,255,.045);
      color:#eef2f6;
      font:inherit;
      font-size:14px;
      font-weight:650;
      cursor:pointer;
      transition:background .16s ease,border-color .16s ease,transform .12s ease;
    }
    .password-generate:hover{background:rgba(255,255,255,.075);border-color:rgba(255,255,255,.16)}
    .password-generate:active{transform:scale(.99)}

@media (prefers-reduced-motion: reduce){.registration-companion img,.registration-companion__glow{animation:none!important}}

/* v579 — consolidated auth layout (replaces v561–v578 override stack) */
html,body{background:transparent!important}
body{overflow:auto!important}
.shell{
  width:100%!important;min-height:100dvh!important;height:auto!important;margin:0!important;
  padding:46px 20px!important;display:flex!important;flex-direction:column!important;
  align-items:center!important;justify-content:center!important;gap:0!important;overflow:auto!important;
}
.registration-companion{display:none!important}
.close{
  position:static!important;align-self:flex-start!important;
  margin:0 0 18px max(0px,calc(50% - 290px))!important;
  width:42px!important;height:42px!important;border-radius:50%!important;
  border:1px solid rgba(255,255,255,.07)!important;background:rgba(16,16,19,.78)!important;
  color:#d9d9de!important;box-shadow:0 10px 26px rgba(0,0,0,.22)!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
.close:hover{background:rgba(255,255,255,.08)!important;border-color:rgba(255,255,255,.11)!important;color:#fff!important}
.stage{
  width:min(100%,580px)!important;min-height:0!important;padding:0!important;
  display:grid!important;align-items:center!important;justify-items:center!important;background:transparent!important;
}
.stage::before{
  content:attr(data-step-label);position:static!important;margin:0 auto 26px!important;
  min-height:34px;height:34px;display:inline-flex;align-items:center;padding:0 14px;
  border-radius:999px;border:1px solid rgba(255,255,255,.08);background:rgba(14,14,17,.72);
  color:#7b7d86;font-size:12px;font-weight:720;line-height:1;
}
.scene{width:100%!important;max-width:580px!important;display:grid!important;justify-items:center!important;gap:18px!important;padding:0!important}
.scene.is-leaving{animation:authLeave .2s ease forwards}.scene.is-entering{animation:authEnter .24s cubic-bezier(.2,.72,.2,1) both}
@keyframes authLeave{to{opacity:0;transform:translateY(-8px)}}
@keyframes authEnter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.ksan-row,.message{width:100%!important;max-width:560px!important;text-align:center!important;justify-items:center!important;margin:0 auto!important}
.name{display:none!important}
.title{max-width:540px!important;margin:0 auto!important;font-size:clamp(30px,3vw,40px)!important;line-height:1.04!important;letter-spacing:-.045em!important;min-height:0!important}
.copy{max-width:520px!important;margin:14px auto 0!important;color:#aaaab2!important;font-size:16px!important;line-height:1.48!important;min-height:0!important}
.aside{max-width:500px!important;margin:10px auto 0!important;color:#666871!important;font-size:12.5px!important;line-height:1.45!important;min-height:0!important}
.controls{width:min(100%,420px)!important;margin:16px auto 0!important;display:flex!important;justify-content:center!important;gap:10px!important}
.controls .primary,.controls .secondary{width:auto!important;min-width:210px!important;min-height:52px!important;height:52px!important;padding:0 28px!important;border-radius:16px!important;font-size:15px!important}
.id-box,.nick-box,.password-box,.summary-box,.backup-box{width:min(100%,540px)!important;margin-left:auto!important;margin-right:auto!important}
.id-actions,.nick-actions,.password-actions,.summary-actions{width:100%!important}

/* One input system: transparent field + underline only. */
.field{min-height:56px!important;height:auto!important;padding:0 0 7px!important;border:0!important;border-bottom:1px solid rgba(255,255,255,.14)!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;display:flex!important;align-items:center!important;transition:border-color .18s ease!important}
.field:hover{border-bottom-color:rgba(255,255,255,.23)!important;background:transparent!important}
.field:focus-within{border-bottom-color:rgba(255,255,255,.58)!important;background:transparent!important}
.field input{width:100%!important;min-width:0!important;min-height:46px!important;height:46px!important;padding:0!important;border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;color:#f3f4f6!important;font-size:17px!important;font-weight:590!important;letter-spacing:.005em!important}
.field input::placeholder{color:#666a73!important;font-size:16px!important;font-weight:470!important;letter-spacing:0!important}
.field-label{margin-bottom:8px!important;color:#858791!important;font-size:12px!important;font-weight:720!important}
.field-note{margin:1px 0 0!important;color:#64666e!important;font-size:12px!important;line-height:1.45!important}
.field--password{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:center!important;gap:12px!important;padding-right:0!important;padding-bottom:7px!important}
.field-toggle,.password-toggle{position:static!important;transform:none!important;width:auto!important;min-width:0!important;height:auto!important;padding:7px 0 7px 10px!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:#7d818b!important}
.field-toggle:hover,.password-toggle:hover{background:transparent!important;color:#c2c5cb!important}

/* Keep controls light: no backdrop-filter on auth UI. */
.primary,.secondary,.password-generate,.summary-reveal{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.password-generate{background:rgba(255,255,255,.045)!important}

/* Whole-message reveal kept from v577, but without blur to reduce paint cost. */
.text-reveal{animation:ksanTextReveal .22s cubic-bezier(.2,.8,.2,1) both!important}
@keyframes ksanTextReveal{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}

@media(max-width:620px){
  .shell{padding:68px 16px 26px!important;justify-content:flex-start!important}
  .close{margin:0 0 14px 0!important;width:38px!important;height:38px!important}
  .stage,.scene{width:100%!important;max-width:100%!important}
  .stage::before{margin-bottom:20px!important}
  .scene{gap:16px!important}.title{font-size:30px!important}.copy{font-size:14.5px!important}.aside{font-size:12px!important}
  .controls{width:100%!important;margin-top:12px!important;display:grid!important;grid-template-columns:1fr!important}
  .controls .primary,.controls .secondary{width:100%!important;min-width:0!important}
  .field{min-height:54px!important;padding-bottom:8px!important}.field input{min-height:44px!important;height:44px!important;font-size:17px!important}.field input::placeholder{font-size:16px!important}
}


/* v582 — lift auth content higher in the viewport */
.stage{transform:translateY(-48px)!important}
@media(max-width:620px){.stage{transform:translateY(-26px)!important}}

/* v584 — back icon on the right */
.close{
  position:fixed!important;
  top:24px!important;
  right:24px!important;
  left:auto!important;
  margin:0!important;
  align-self:auto!important;
}
@media(max-width:620px){
  .close{top:14px!important;right:14px!important;left:auto!important;margin:0!important}
}

/* v589 — back control raised ~40% higher again */
.close{
  position:fixed!important;
  top:calc(50% - 241px)!important;
  right:max(18px, calc(50vw - 340px))!important;
  left:auto!important;
  margin:0!important;
  transform:translateY(-50%)!important;
}
.close:active{transform:translateY(-50%) scale(.94)!important}
@media(max-width:620px){
  .close{
    top:calc(50% - 168px)!important;
    right:12px!important;
    left:auto!important;
    transform:translateY(-50%)!important;
  }
  .close:active{transform:translateY(-50%) scale(.94)!important}
}

/* v590 — registration: keep only title + main copy above controls; move the third line below the interactive block */
.scene > *{order:2}
.scene > .ksan-row{order:1}
.scene > .aside{order:3;width:min(100%,610px);justify-self:center;margin:2px auto 0;text-align:left}
@media(max-width:760px){.scene > .aside{width:100%;margin-top:0}}


/* v598 — registration follows the login layout */
html,body{background:#000!important}
body{position:relative!important;min-height:100dvh!important;overflow:auto!important;background:#000!important}
.shell--auth{
  width:min(100%,620px)!important;
  min-height:100dvh!important;
  margin:0 auto!important;
  padding:22px 20px 34px!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-rows:auto auto 1fr!important;
  justify-items:center!important;
  align-content:start!important;
  gap:14px!important;
  overflow:auto!important;
}
.registration-companion,.close{display:none!important}
.auth-head{
  width:100%!important;
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  margin:0 auto 2px!important;
}
.auth-step{
  min-height:34px!important;
  height:34px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 16px!important;
  border-radius:999px!important;
  border:1px solid rgba(255,255,255,.08)!important;
  background:rgba(14,14,17,.72)!important;
  color:#7b7d86!important;
  font-size:12px!important;
  font-weight:720!important;
  line-height:1!important;
  letter-spacing:.01em!important;
  text-align:center!important;
}
.reg-pass-art{
  display:block!important;
  width:min(78vw,430px)!important;
  max-height:300px!important;
  height:auto!important;
  object-fit:contain!important;
  margin:0 auto -44px!important;
  transform:translateY(-18px)!important;
  transform-origin:center center!important;
  filter:drop-shadow(0 24px 42px rgba(0,0,0,.28))!important;
  pointer-events:none!important;
  user-select:none!important;
}
.stage{
  width:min(100%,520px)!important;
  min-height:0!important;
  margin:0 auto!important;
  padding:0!important;
  transform:none!important;
  display:grid!important;
  justify-items:center!important;
  align-items:start!important;
}
.stage::before{display:none!important;content:none!important}
.scene{
  width:100%!important;
  max-width:500px!important;
  gap:18px!important;
  padding:0!important;
}
.ksan-row,.message{width:100%!important;max-width:500px!important;text-align:center!important}
.title{max-width:500px!important}
.copy{max-width:500px!important;margin-left:auto!important;margin-right:auto!important}
.aside{max-width:500px!important;margin-left:auto!important;margin-right:auto!important;text-align:center!important}
.controls,
.id-box,.nick-box,.password-box,.summary-box,.backup-box{width:min(100%,500px)!important}
.controls{margin-top:12px!important}
.controls .primary,.controls .secondary,
.id-actions .primary,.id-actions .secondary,
.nick-actions .primary,.nick-actions .secondary,
.password-actions .primary,.password-actions .secondary,
.summary-actions .primary,.summary-actions .secondary,
.backup-actions .primary,.backup-actions .secondary{
  min-height:56px!important;
  height:56px!important;
  border-radius:18px!important;
  font-size:15.5px!important;
  font-weight:690!important;
  letter-spacing:-.018em!important;
}
.controls .primary,.id-actions .primary,.nick-actions .primary,.password-actions .primary,.summary-actions .primary,.backup-actions .primary{
  background:#f5f5f6!important;
  color:#0a0a0b!important;
  border:0!important;
}
.controls .secondary,.id-actions .secondary,.nick-actions .secondary,.password-actions .secondary,.summary-actions .secondary,.backup-actions .secondary{
  background:#303033!important;
  color:#f3f3f5!important;
  border:0!important;
}
.controls .secondary:hover,.id-actions .secondary:hover,.nick-actions .secondary:hover,.password-actions .secondary:hover,.summary-actions .secondary:hover,.backup-actions .secondary:hover{background:#38383c!important}
.id-actions,.nick-actions,.password-actions,.summary-actions,.backup-actions{gap:10px!important}
.field{min-height:56px!important}
.field input{min-height:46px!important;height:46px!important}
@media(max-width:620px){
  .shell--auth{padding:16px 16px 24px!important;gap:12px!important}
  .auth-head{margin-bottom:0!important}
  .reg-pass-art{width:min(82vw,320px)!important;max-height:220px!important;margin-bottom:-28px!important;transform:translateY(-10px)!important}
  .stage{width:min(100%,460px)!important}
  .scene,.controls,.id-box,.nick-box,.password-box,.summary-box,.backup-box{max-width:100%!important;width:100%!important}
  .controls{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
  .controls .primary,.controls .secondary,
  .id-actions .primary,.id-actions .secondary,
  .nick-actions .primary,.nick-actions .secondary,
  .password-actions .primary,.password-actions .secondary,
  .summary-actions .primary,.summary-actions .secondary,
  .backup-actions .primary,.backup-actions .secondary{
    width:100%!important;
    min-height:54px!important;
    height:54px!important;
    border-radius:17px!important;
  }
}


/* v599 — explicit auth page header */
.auth-head{
  width:min(100%,560px)!important;
  min-height:50px!important;
  margin:0 auto 4px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
  padding:0 4px 12px!important;
  border-bottom:1px solid rgba(255,255,255,.07)!important;
}
.auth-head__title{
  color:#f4f4f6!important;
  font-size:18px!important;
  line-height:1!important;
  font-weight:720!important;
  letter-spacing:-.025em!important;
  white-space:nowrap!important;
}
.auth-step{
  margin-left:auto!important;
  flex:0 0 auto!important;
}
@media(max-width:620px){
  .auth-head{width:100%!important;min-height:44px!important;padding:0 2px 10px!important;margin-bottom:2px!important;gap:10px!important}
  .auth-head__title{font-size:16.5px!important}
  .auth-step{height:32px!important;min-height:32px!important;padding:0 12px!important;font-size:11px!important}
}

/* v600 — cleaner auth hierarchy: header first, artwork second */
.shell--auth{padding-top:16px!important}
.auth-head{
  width:min(100%,500px)!important;
  min-height:48px!important;
  margin:0 auto 18px!important;
  padding:0 0 14px!important;
  border-bottom:1px solid rgba(255,255,255,.075)!important;
}
.auth-head__title{
  font-size:20px!important;
  font-weight:700!important;
  letter-spacing:-.03em!important;
}
.auth-step{
  min-height:0!important;
  height:auto!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#686a72!important;
  font-size:12px!important;
  font-weight:650!important;
  white-space:nowrap!important;
}
.reg-pass-art{
  width:min(76vw,390px)!important;
  max-height:270px!important;
  margin:0 auto -30px!important;
  transform:none!important;
}
@media(max-width:620px){
  .shell--auth{padding-top:12px!important}
  .auth-head{min-height:44px!important;margin-bottom:14px!important;padding-bottom:12px!important;gap:12px!important}
  .auth-head__title{font-size:18px!important}
  .auth-step{font-size:11px!important}
  .reg-pass-art{width:min(82vw,300px)!important;max-height:205px!important;margin-bottom:-22px!important;transform:none!important}
}


/* v603 — registration back to desktop two-column layout: image left, content right */
@media (min-width: 900px){
  .shell--auth{
    width:min(100%,1120px)!important;
    min-height:100dvh!important;
    margin:0 auto!important;
    padding:32px 34px 36px!important;
    display:grid!important;
    grid-template-columns:minmax(300px,390px) minmax(380px,540px)!important;
    grid-template-areas:
      "art head"
      "art stage"!important;
    justify-content:center!important;
    align-content:center!important;
    align-items:start!important;
    column-gap:58px!important;
    row-gap:20px!important;
    overflow:auto!important;
  }
  .auth-head{
    grid-area:head!important;
    width:100%!important;
    min-height:48px!important;
    margin:0!important;
    padding:0 0 14px!important;
    align-self:end!important;
    justify-content:space-between!important;
    gap:16px!important;
    border-bottom:1px solid rgba(255,255,255,.07)!important;
  }
  .auth-head__title{font-size:20px!important}
  .auth-step{
    flex:0 0 auto!important;
    min-height:0!important;
    height:auto!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    color:#6f7580!important;
    font-size:12.5px!important;
    font-weight:650!important;
  }
  .reg-pass-art{
    grid-area:art!important;
    width:min(100%,380px)!important;
    max-height:370px!important;
    margin:0!important;
    transform:none!important;
    align-self:center!important;
    justify-self:center!important;
  }
  .stage{
    grid-area:stage!important;
    width:100%!important;
    max-width:540px!important;
    min-height:0!important;
    margin:0!important;
    justify-self:stretch!important;
    align-items:start!important;
  }
  .scene{width:100%!important;max-width:540px!important;gap:18px!important}
  .ksan-row,.message{
    width:100%!important;
    max-width:540px!important;
    text-align:left!important;
    justify-items:start!important;
    margin:0!important;
  }
  .title,
  .copy,
  .scene > .aside{
    text-align:left!important;
    margin-left:0!important;
    margin-right:0!important;
  }
  .copy{max-width:520px!important}
  .scene > .aside{max-width:520px!important;margin-top:4px!important}
  .controls,
  .id-box,.nick-box,.password-box,.summary-box,.backup-box{
    width:min(100%,520px)!important;
    margin:0!important;
  }
  .controls{justify-content:flex-start!important}
}


/* v604 — centered two-column auth, larger art, no header */
.auth-head{display:none!important}
@media (min-width:900px){
  .shell--auth{
    width:min(100%,1160px)!important;
    min-height:100dvh!important;
    padding:28px 34px!important;
    display:grid!important;
    grid-template-columns:minmax(370px,480px) minmax(400px,540px)!important;
    grid-template-areas:"art stage"!important;
    justify-content:center!important;
    align-content:center!important;
    align-items:center!important;
    column-gap:74px!important;
    row-gap:0!important;
  }
  .reg-pass-art{
    grid-area:art!important;
    width:min(100%,465px)!important;
    max-height:440px!important;
    margin:0!important;
    transform:none!important;
    justify-self:center!important;
    align-self:center!important;
    filter:drop-shadow(0 26px 44px rgba(0,0,0,.34))!important;
  }
  .stage{
    grid-area:stage!important;
    width:100%!important;
    max-width:540px!important;
    margin:0!important;
    align-self:center!important;
    justify-self:center!important;
  }
}


/* v605 — true vertical centering of the whole auth composition on desktop */
@media (min-width: 900px){
  .shell--auth{
    min-height:100dvh!important;
    align-content:center!important;
    justify-content:center!important;
    padding-top:34px!important;
    padding-bottom:34px!important;
  }
}


/* v606 — real viewport centering via body on desktop */
@media (min-width: 900px){
  html,body{
    width:100%!important;
    min-height:100dvh!important;
    height:auto!important;
  }
  body{
    display:grid!important;
    place-items:center!important;
    overflow:auto!important;
  }
  .shell--auth{
    min-height:auto!important;
    height:auto!important;
    margin:auto!important;
    align-content:center!important;
    justify-content:center!important;
  }
  .stage{
    align-self:center!important;
  }
}


/* v607 — centered top logo in the auth header area */
.auth-top-logo{
  position:fixed!important;
  top:18px!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  z-index:12!important;
  width:auto!important;
  line-height:0!important;
  pointer-events:none!important;
  user-select:none!important;
}
.auth-top-logo img{
  display:block!important;
  width:132px!important;
  height:auto!important;
  opacity:.98!important;
  filter:drop-shadow(0 8px 18px rgba(0,0,0,.28))!important;
}
@media (max-width: 620px){
  .auth-top-logo{top:14px!important}
  .auth-top-logo img{width:118px!important}
}
@media (min-width: 900px){
  .shell--auth{padding-top:78px!important}
}


/* v610 — registration buttons match login sizing */
.controls,
.id-actions,
.nick-actions,
.password-actions,
.summary-actions,
.backup-actions{
  width:min(100%,500px)!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:10px!important;
  justify-content:start!important;
}
.controls .primary,.controls .secondary,
.id-actions .primary,.id-actions .secondary,
.nick-actions .primary,.nick-actions .secondary,
.password-actions .primary,.password-actions .secondary,
.summary-actions .primary,.summary-actions .secondary,
.backup-actions .primary,.backup-actions .secondary{
  width:100%!important;
  min-width:0!important;
  min-height:56px!important;
  height:56px!important;
  padding:0 22px!important;
  border-radius:18px!important;
  font-size:15.5px!important;
  font-weight:690!important;
  letter-spacing:-.018em!important;
}
@media(max-width:620px){
  .controls,
  .id-actions,
  .nick-actions,
  .password-actions,
  .summary-actions,
  .backup-actions{
    width:100%!important;
  }
  .controls .primary,.controls .secondary,
  .id-actions .primary,.id-actions .secondary,
  .nick-actions .primary,.nick-actions .secondary,
  .password-actions .primary,.password-actions .secondary,
  .summary-actions .primary,.summary-actions .secondary,
  .backup-actions .primary,.backup-actions .secondary{
    min-height:54px!important;
    height:54px!important;
    border-radius:17px!important;
  }
}


/* v616 — registration gets its own modern editorial card visual */
.reg-visual{
  position:relative!important;
  overflow:hidden!important;
  border-radius:36px!important;
  border:1px solid rgba(255,255,255,.065)!important;
  background:
    radial-gradient(circle at 62% 18%,rgba(255,0,153,.14),transparent 28%),
    radial-gradient(circle at 34% 26%,rgba(0,153,255,.16),transparent 30%),
    linear-gradient(155deg,#111320 0%,#090a12 52%,#050506 100%)!important;
  box-shadow:
    0 34px 76px rgba(0,0,0,.48),
    0 0 0 1px rgba(255,255,255,.025) inset!important;
  transform:rotate(2.2deg)!important;
  transform-origin:center center!important;
}
.reg-visual::before{
  content:"KSAN / NEW ID"!important;
  position:absolute!important;
  left:24px!important;
  bottom:22px!important;
  z-index:6!important;
  color:rgba(255,255,255,.34)!important;
  font-size:10px!important;
  line-height:1!important;
  font-weight:720!important;
  letter-spacing:.16em!important;
  text-transform:uppercase!important;
  pointer-events:none!important;
}
.reg-visual::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:4!important;
  pointer-events:none!important;
  background:
    linear-gradient(118deg,transparent 0 36%,rgba(255,255,255,.04) 48%,transparent 60%),
    linear-gradient(180deg,rgba(255,255,255,.02),transparent 36%,rgba(0,0,0,.08) 70%,rgba(0,0,0,.26) 100%)!important;
}
.reg-visual__glow{
  position:absolute!important;
  inset:auto!important;
  left:50%!important;
  top:44%!important;
  z-index:0!important;
  width:92%!important;
  height:58%!important;
  transform:translate(-50%,-50%)!important;
  background:radial-gradient(ellipse at center,rgba(0,138,255,.22) 0%,rgba(247,0,255,.18) 34%,transparent 72%)!important;
  filter:blur(34px)!important;
  pointer-events:none!important;
}
.reg-visual__floor{
  position:absolute!important;
  left:50%!important;
  bottom:5%!important;
  z-index:1!important;
  width:70%!important;
  height:46px!important;
  transform:translateX(-50%)!important;
  border-radius:999px!important;
  background:radial-gradient(ellipse at center,rgba(0,0,0,.42) 0%,rgba(0,0,0,.18) 52%,transparent 76%)!important;
  filter:blur(16px)!important;
  opacity:.92!important;
  pointer-events:none!important;
}
.reg-visual .reg-pass-art{
  position:absolute!important;
  z-index:2!important;
  left:50%!important;
  top:0!important;
  transform:translateX(-50%)!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center top!important;
  margin:0!important;
  filter:saturate(1.04) contrast(1.03)!important;
}
@media (min-width:900px){
  .shell--auth{
    grid-template-columns:minmax(420px,500px) minmax(390px,540px)!important;
    column-gap:68px!important;
  }
  .reg-visual{
    grid-area:art!important;
    width:470px!important;
    height:620px!important;
    min-height:620px!important;
    max-height:72dvh!important;
    align-self:center!important;
    justify-self:center!important;
  }
  .reg-visual .reg-pass-art{object-position:center top!important}
}
@media (max-width:899px){
  .reg-visual{
    width:min(88vw,410px)!important;
    height:min(66vh,520px)!important;
    min-height:440px!important;
    margin:0 auto!important;
    border-radius:30px!important;
    transform:rotate(1.6deg)!important;
  }
  .reg-visual::before{left:18px!important;bottom:17px!important;font-size:9px!important}
  .reg-visual__glow{width:86%!important;height:52%!important;filter:blur(26px)!important}
  .reg-visual__floor{width:58%!important;height:36px!important}
}

/* v618 — tighter, cleaner registration text hierarchy */
@media (min-width:900px){
  .stage,
  .scene,
  .ksan-row,
  .message,
  .id-box,
  .nick-box,
  .password-box,
  .summary-box,
  .backup-box,
  .scene > .aside{
    width:100%!important;
    max-width:500px!important;
    margin-left:0!important;
    margin-right:0!important;
    justify-self:start!important;
  }
  .scene{
    gap:14px!important;
    justify-items:start!important;
  }
  .ksan-row{
    justify-items:start!important;
    text-align:left!important;
  }
  .message{text-align:left!important}
  .title{
    max-width:470px!important;
    margin:0!important;
    font-size:36px!important;
    line-height:1.06!important;
    letter-spacing:-.045em!important;
  }
  .copy{
    max-width:455px!important;
    margin:10px 0 0!important;
    font-size:15px!important;
    line-height:1.48!important;
    color:#a5a6ad!important;
  }
  .id-box,.nick-box,.password-box{
    gap:7px!important;
    margin-top:4px!important;
  }
  .field-label{
    margin:0 0 2px!important;
    font-size:11px!important;
    line-height:1.2!important;
    color:#7f8189!important;
  }
  .field-note{
    margin:2px 0 4px!important;
    max-width:470px!important;
    font-size:11.5px!important;
    line-height:1.42!important;
    color:#62646c!important;
  }
  .id-actions,.nick-actions,.password-actions{
    margin-top:4px!important;
  }
  .scene > .aside{
    max-width:465px!important;
    margin-top:8px!important;
    font-size:11.5px!important;
    line-height:1.5!important;
    color:#5f6169!important;
    text-align:left!important;
  }
}

@media (max-width:899px){
  .title{font-size:30px!important;line-height:1.08!important}
  .copy{max-width:440px!important;margin-top:10px!important}
  .scene{gap:14px!important}
  .id-box,.nick-box,.password-box{gap:7px!important}
  .field-label{margin-bottom:2px!important}
  .field-note{font-size:11.5px!important;margin-top:2px!important}
  .scene > .aside{margin-top:8px!important;font-size:11.5px!important}
}


/* v619 — selected Ksan ID is content, not a pill */
.selected-pill{display:none!important}
.selected-id{
  width:min(100%,500px)!important;
  display:grid!important;
  gap:6px!important;
  margin:2px 0 0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  text-align:left!important;
}
.selected-id__label{
  color:#676a73!important;
  font-size:11px!important;
  line-height:1.2!important;
  font-weight:680!important;
  letter-spacing:.015em!important;
}
.selected-id__value{
  display:block!important;
  color:#f1f2f4!important;
  font-size:19px!important;
  line-height:1.25!important;
  font-weight:650!important;
  letter-spacing:.035em!important;
  overflow-wrap:anywhere!important;
  user-select:all!important;
}
.selected-id + .controls{margin-top:8px!important}
@media(max-width:620px){
  .selected-id{width:100%!important}
  .selected-id__value{font-size:17px!important}
}


/* v620 — remove all remaining selected-data capsules from registration */
.nickname-preview{display:none!important}
.selected-data{
  width:min(100%,500px)!important;
  display:grid!important;
  gap:6px!important;
  margin:2px 0 0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  text-align:left!important;
}
.selected-data__label{
  color:#676a73!important;
  font-size:11px!important;
  line-height:1.2!important;
  font-weight:680!important;
  letter-spacing:.015em!important;
}
.selected-data__value{
  display:block!important;
  color:#f1f2f4!important;
  font-size:19px!important;
  line-height:1.25!important;
  font-weight:650!important;
  letter-spacing:.025em!important;
  overflow-wrap:anywhere!important;
  user-select:all!important;
}
.selected-data + .controls{margin-top:8px!important}

/* Final review is now typography, not cards. */
.summary-list{
  width:100%!important;
  display:grid!important;
  gap:0!important;
  border-top:1px solid rgba(255,255,255,.08)!important;
}
.summary-item{
  display:grid!important;
  grid-template-columns:120px minmax(0,1fr)!important;
  gap:18px!important;
  align-items:center!important;
  padding:14px 0!important;
  border:0!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.summary-label{
  color:#666a73!important;
  font-size:10.5px!important;
  line-height:1.2!important;
  font-weight:680!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
.summary-value{
  color:#f0f1f3!important;
  font-size:15px!important;
  line-height:1.35!important;
  font-weight:620!important;
  letter-spacing:.015em!important;
}
.summary-secret{
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
}
.summary-reveal{
  flex:0 0 auto!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#858992!important;
  font-size:11.5px!important;
  font-weight:650!important;
  cursor:pointer!important;
}
.summary-reveal:hover{color:#d6d8dd!important;background:transparent!important}
@media(max-width:620px){
  .selected-data{width:100%!important}
  .selected-data__value{font-size:17px!important}
  .summary-item{grid-template-columns:1fr!important;gap:5px!important;padding:12px 0!important}
  .summary-secret{align-items:flex-start!important}
}


/* v651 — registration gets the same header as login */
.login-topbar{
  position:fixed!important;
  top:12px!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  z-index:30!important;
  display:grid!important;
  grid-template-columns:auto 188px auto!important;
  align-items:center!important;
  justify-content:center!important;
  gap:148px!important;
  width:auto!important;
  min-height:62px!important;
  pointer-events:auto!important;
}
.login-topbar__logo{
  display:block!important;
  width:188px!important;
  height:auto!important;
  max-height:62px!important;
  object-fit:contain!important;
  justify-self:center!important;
  user-select:none!important;
  pointer-events:none!important;
}
.login-topbar__nav{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  padding:4px 0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#c9cbd0!important;
  text-decoration:none!important;
  font-family:"OpenAI Sans","Inter","SF Pro Text",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif!important;
  font-size:14px!important;
  line-height:1.2!important;
  font-weight:560!important;
  letter-spacing:-.012em!important;
  white-space:nowrap!important;
  transition:color .16s ease,opacity .16s ease,transform .16s ease!important;
}
.login-topbar__nav:first-child{justify-self:end!important}
.login-topbar__nav--home{justify-self:start!important}
.login-topbar__nav:hover{
  color:#fff!important;
  transform:translateY(-1px)!important;
}
.login-topbar__nav:active{transform:scale(.985)!important}
.login-topbar__arrow{
  display:inline-block!important;
  font-size:15px!important;
  line-height:1!important;
  font-weight:500!important;
  transform:translateY(-1px)!important;
  opacity:.92!important;
  transition:transform .16s ease,opacity .16s ease!important;
}
.login-topbar__nav--home:hover .login-topbar__arrow{
  transform:translate(2px,-3px)!important;
  opacity:1!important;
}
@media(max-width:900px){
  .login-topbar{
    grid-template-columns:auto 166px auto!important;
    gap:96px!important;
  }
  .login-topbar__logo{
    width:166px!important;
    max-height:54px!important;
  }
}
@media(max-width:720px){
  .login-topbar{
    top:8px!important;
    width:calc(100% - 16px)!important;
    grid-template-columns:auto 132px auto!important;
    gap:34px!important;
    min-height:44px!important;
  }
  .login-topbar__logo{
    width:132px!important;
    max-height:44px!important;
  }
  .login-topbar__nav{
    font-size:11.5px!important;
    padding:3px 0!important;
  }
  .login-topbar__arrow{font-size:13px!important}
}

/* v654 — новый горизонтальный логотип */
.login-topbar__logo{width:210px!important;max-height:58px!important;object-fit:contain!important}
@media(max-width:720px){.login-topbar__logo{width:166px!important;max-height:48px!important}}