:root{
  --navy:#0B1340; --navy2:#1A2260; --navy3:#26316d;
  --gold:#B8891A; --gold2:#D3B06D;
  --bg:#F4F7FD; --card:#FFFFFF; --line:#D9E1F2; --line2:#C8D2EA;
  --text:#101B3D; --muted:#5F6E93; --muted2:#7F8AA8;
  --soft:#EFF3FB; --soft2:#F9FBFF;
  --shadow:0 18px 40px rgba(11,19,64,.10);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:'DM Sans',Arial,Helvetica,sans-serif;
  color:var(--text);
  background:
    radial-gradient(1100px 500px at 0% 0%, rgba(25,44,130,.06), transparent 50%),
    radial-gradient(900px 420px at 100% 100%, rgba(184,137,26,.05), transparent 50%),
    linear-gradient(180deg,#F8FAFE 0%, #F1F5FC 100%);
}
a{color:var(--navy2);text-decoration:none}
a:hover{text-decoration:underline}
.auth-shell{min-height:100vh;display:grid;grid-template-columns:minmax(360px,460px) minmax(420px,1fr)}
.auth-side{
  background:
    radial-gradient(900px 400px at 0% 0%, rgba(255,255,255,.08), transparent 45%),
    linear-gradient(160deg,var(--navy) 0%,var(--navy2) 55%,var(--navy3) 100%);
  color:#fff;padding:52px 40px;display:flex;flex-direction:column;justify-content:space-between
}
.auth-side .logo{max-width:185px;height:auto}
.side-chip{
  display:inline-flex;align-items:center;gap:8px;
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.14);
  border-radius:999px;padding:10px 14px;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase
}
.side-title{
  margin:22px 0 14px;font-size:38px;line-height:1.05;font-weight:800;
  font-family:'Fraunces','DM Sans',serif
}
.side-copy{font-size:15px;line-height:1.8;color:rgba(255,255,255,.88);max-width:420px}
.side-list{display:grid;gap:14px;margin-top:28px}
.side-item{
  display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:start;
  padding:16px;border-radius:18px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.13)
}
.side-ico{
  width:44px;height:44px;border-radius:14px;background:rgba(255,255,255,.16);
  display:flex;align-items:center;justify-content:center;font-size:20px
}
.side-item strong{display:block;margin-bottom:4px;font-size:15px}
.side-item span{display:block;font-size:13px;line-height:1.6;color:rgba(255,255,255,.82)}
.side-links{display:flex;gap:12px;flex-wrap:wrap;font-size:13px}
.side-links a{color:rgba(255,255,255,.90)}
.auth-main{display:flex;align-items:center;justify-content:center;padding:38px 22px}
.auth-card{
  width:min(100%,760px);background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);
  border-radius:30px;padding:30px;position:relative
}
.auth-top{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:12px}
.brand-mini{display:flex;align-items:center;gap:10px}
.brand-mini img{width:36px;height:36px;border-radius:11px}
.brand-mini span{font-size:14px;font-weight:800;color:var(--text)}
.auth-badge{
  display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;
  background:#F9F2E2;border:1px solid #E8CE8E;color:#6f5619;font-size:12px;font-weight:800
}
.auth-head{margin-bottom:18px}
.auth-kicker{
  display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;
  background:var(--soft);border:1px solid var(--line);color:var(--muted);font-size:12px;font-weight:800
}
.auth-title{font-size:32px;line-height:1.08;margin:14px 0 10px;font-weight:800;color:var(--text)}
.auth-sub{font-size:15px;line-height:1.75;color:var(--muted);max-width:620px}
.tabs{
  display:flex;gap:8px;background:var(--soft);border:1px solid var(--line);padding:6px;border-radius:15px;margin:18px 0
}
.tab{
  flex:1;min-height:48px;padding:0 16px;border:0;background:transparent;border-radius:11px;
  font-size:14px;font-weight:800;color:var(--muted);cursor:pointer
}
.tab.active{background:#fff;color:var(--navy);box-shadow:0 4px 10px rgba(11,19,64,.06)}
.social-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:10px 0 18px}
.social-btn{
  min-height:52px;border-radius:16px;border:1px solid var(--line2);background:#fff;padding:0 16px;
  display:flex;align-items:center;justify-content:center;gap:10px;font-size:14px;font-weight:800;color:var(--text)
}
.social-btn .i{font-size:18px}
.social-btn.phone{grid-column:1 / -1}
.divider{display:flex;align-items:center;gap:12px;margin:18px 0;color:var(--muted2);font-size:13px;font-weight:700}
.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--line)}
.form-grid{display:grid;gap:16px}
.form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.field{display:grid;gap:8px}
.field label{font-size:13px;font-weight:800;color:var(--muted);padding-left:2px}
.input,.textarea{
  width:100%;border:1px solid var(--line2);background:#fff;color:var(--text);
  border-radius:16px;min-height:54px;padding:0 17px;font-size:15px;outline:none;
}
.textarea{min-height:116px;padding:15px 17px;resize:vertical}
.input::placeholder,.textarea::placeholder{color:#9AA6C3}
.input:focus,.textarea:focus{border-color:#93a8de;box-shadow:0 0 0 4px rgba(70,108,201,.10)}
.field-append{position:relative}
.field-append .input{padding-right:56px}
.eye{
  position:absolute;right:10px;top:50%;transform:translateY(-50%);
  border:0;background:transparent;font-size:18px;cursor:pointer;color:var(--muted)
}
.check-row{display:flex;align-items:flex-start;gap:10px;font-size:13px;color:var(--muted);line-height:1.7}
.check-row input{margin-top:3px}
.row-between{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.btn{
  min-height:56px;border-radius:17px;border:1px solid transparent;padding:0 18px;
  display:inline-flex;align-items:center;justify-content:center;gap:10px;font-size:15px;font-weight:800;cursor:pointer
}
.btn-primary{background:linear-gradient(135deg,var(--navy) 0%,var(--navy2) 100%);color:#fff}
.btn-gold{background:linear-gradient(135deg,var(--gold) 0%,var(--gold2) 100%);color:#2c2205}
.btn-secondary{background:#fff;border-color:var(--line2);color:var(--text)}
.actions{display:grid;gap:12px}
.auth-foot{margin-top:18px;font-size:13px;color:var(--muted);line-height:1.75}
.auth-links{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px;font-size:13px}
.alert{padding:13px 14px;border-radius:15px;border:1px solid var(--line);font-size:14px;line-height:1.6;margin-bottom:16px}
.alert.error{background:#FFF5F5;border-color:#E9B9B9;color:#8E2E2E}
.alert.success{background:#F4FFF8;border-color:#BDE3C9;color:#1E6A3A}
.hidden{display:none !important}
.help{font-size:12px;color:var(--muted2);line-height:1.6}
@media (max-width:1024px){
  .auth-shell{grid-template-columns:1fr}
  .auth-side{display:none}
  .auth-main{padding:18px}
}
@media (max-width:640px){
  .auth-main{padding:10px}
  .auth-card{padding:22px 16px;border-radius:22px}
  .social-grid{grid-template-columns:1fr}
  .form-grid.two{grid-template-columns:1fr}
  .auth-title{font-size:27px}
  .tabs{gap:6px}
  .tab{min-height:46px;padding:0 12px}
}

/* Multi-step registration and explicit portal identity */
.account-type-banner{display:flex;align-items:center;gap:12px;padding:14px 16px;margin:0 0 18px;border:2px solid #d7b56d;border-radius:16px;background:#fffaf0;color:#17223b}.account-type-banner .type-icon{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;background:#17223b;color:#fff;font-size:22px;flex:0 0 auto}.account-type-banner strong{display:block;font-size:18px;line-height:1.2}.account-type-banner em{display:block;margin-top:3px;font-size:13px;color:#5d6470}.stepper{display:grid;grid-template-columns:repeat(var(--step-count,4),minmax(0,1fr));gap:7px;margin:0 0 20px}.step-indicator{border:0;background:#edf0f4;color:#69717d;border-radius:12px;padding:9px 6px;font:700 11px/1.2 'DM Sans',sans-serif;cursor:default}.step-indicator.active{background:#17223b;color:#fff}.step-indicator.done{background:#f1dfb8;color:#17223b}.form-step{display:none}.form-step.active{display:block;animation:ssStepIn .18s ease}.step-title{margin:0 0 4px;font-size:20px;font-weight:800;color:#17223b}.step-copy{margin:0 0 17px;color:#626b77;font-size:13px;font-style:italic}.wizard-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:20px}.wizard-actions .btn{width:auto;min-width:130px}.phone-control{display:grid;grid-template-columns:minmax(138px,158px) minmax(0,1fr);gap:9px}.country-code-box{display:grid;grid-template-columns:30px minmax(0,1fr);align-items:center;min-width:0;border:1px solid #d9dee5;border-radius:12px;background:#fff;overflow:hidden;transition:border-color .18s ease,box-shadow .18s ease}.country-code-box:focus-within{border-color:#b58a36;box-shadow:0 0 0 3px rgba(181,138,54,.12)}.country-flag{display:grid;place-items:center;width:30px;height:100%;font-size:15px;line-height:1;background:#f6f7f9;border-right:1px solid #e4e7eb}.country-code-box .country-select{appearance:auto;width:100%;min-width:0;border:0!important;border-radius:0!important;box-shadow:none!important;background:#fff;padding:11px 7px;font-weight:800;color:#17223b}.country-code-box .country-select:focus{outline:0;box-shadow:none!important}.field-error{display:none;margin-top:6px;color:#b42318;font-size:12px;font-weight:700}.field.invalid .input,.field.invalid .textarea,.field.invalid select{border-color:#d92d20;box-shadow:0 0 0 3px rgba(217,45,32,.09)}.field.invalid .field-error{display:block}.phone-status{margin-top:6px;font-size:12px;font-weight:700}.phone-status.ok{color:#067647}.phone-status.bad{color:#b42318}.registration-summary{display:grid;gap:9px;padding:14px;border:1px solid #e1e5ea;border-radius:14px;background:#fafbfc}.summary-row{display:flex;justify-content:space-between;gap:15px;font-size:13px}.summary-row span:first-child{font-weight:700;color:#596170}.summary-row span:last-child{text-align:right;color:#17223b;overflow-wrap:anywhere}.portal-switch{display:flex;gap:8px;margin:0 0 18px}.portal-switch a{flex:1;text-align:center;text-decoration:none;border:1px solid #dfe3e8;border-radius:12px;padding:10px;font-size:13px;font-weight:800;color:#4a5260}.portal-switch a.active{border-color:#17223b;background:#17223b;color:#fff}@keyframes ssStepIn{from{opacity:.3;transform:translateY(4px)}to{opacity:1;transform:none}}@media(max-width:640px){.stepper{grid-template-columns:repeat(2,minmax(0,1fr))}.phone-control{grid-template-columns:minmax(132px,145px) minmax(0,1fr)}.wizard-actions{flex-wrap:wrap}.wizard-actions .btn{flex:1}.account-type-banner strong{font-size:16px}}

@media(max-width:420px){.phone-control{grid-template-columns:1fr}.country-code-box{width:100%}.country-code-box .country-select{padding-top:10px;padding-bottom:10px}}