/* Kuwait Trust — auth (navbar + split workspace) */
body.kt-auth-body.vipro-portal.sea-trade-ui{
  color:#eef4fc;
  background:#050b16!important;
  background-image:none!important;
  overflow-x:hidden;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
body.kt-auth-body main{min-height:100dvh;display:block}

.gate{
  --g1:#FBE7A6;--g2:#E9BE5C;--g3:#C0881F;--teal:#3EE9C4;
  --kw-green:#007A3D;--kw-red:#CE1126;
  position:relative;min-height:100dvh;overflow:hidden;
  display:flex;flex-direction:column;
  padding:14px 16px 28px;
}

.gate-bg{
  position:absolute;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(900px 480px at 8% -10%, rgba(233,190,92,.18), transparent 55%),
    linear-gradient(90deg,rgba(3,10,21,.25),rgba(3,10,21,.56)),
    var(--reg-night) center/cover fixed no-repeat;
}
.gate-rays{
  position:absolute;left:8%;top:18%;width:min(70vw,640px);height:min(70vw,640px);
  background:conic-gradient(from 0deg, transparent 0 14deg, rgba(255,232,163,.12) 0 16deg);
  -webkit-mask-image:radial-gradient(circle,#000 20%,transparent 70%);
  mask-image:radial-gradient(circle,#000 20%,transparent 70%);
  animation:gateSpin 50s linear infinite;
}
.gate-bg-badge{
  position:absolute;left:7%;top:25%;width:min(42vw,390px);
  opacity:.08;animation:gatePrismDrift 10s ease-in-out infinite;
  filter:drop-shadow(0 24px 40px rgba(0,0,0,.45));
}
.gate-aurora{
  position:absolute;width:430px;height:430px;border-radius:50%;
  filter:blur(74px);opacity:.25;animation:gateAurora 13s ease-in-out infinite;
}
.gate-aurora.a{left:-120px;bottom:-100px;background:#E9BE5C}
.gate-aurora.b{right:-110px;top:12%;background:#3EE9C4;animation-delay:-6s}
.gate-particle{
  position:absolute;width:8px;height:8px;border-radius:2px;
  background:#FBE7A6;box-shadow:0 0 18px rgba(251,231,166,.85);
  transform:rotate(45deg);animation:gateParticle 7s ease-in-out infinite;
}
.gate-particle.p1{left:14%;top:22%}
.gate-particle.p2{right:16%;top:34%;width:5px;height:5px;animation-delay:-2.5s}
.gate-particle.p3{left:46%;bottom:14%;width:6px;height:6px;animation-delay:-5s}
.gate-flag{
  position:absolute;left:0;right:0;bottom:0;height:8px;z-index:3;
  display:grid;grid-template-columns:16% 1fr 1fr 1fr;
}
.gate-flag i:nth-child(1){background:#111}
.gate-flag i:nth-child(2){background:var(--kw-green)}
.gate-flag i:nth-child(3){background:#fff}
.gate-flag i:nth-child(4){background:var(--kw-red)}

.gate-shell{
  position:relative;z-index:2;
  width:min(1180px,100%);margin:0 auto;
  display:flex;flex-direction:column;gap:22px;flex:1;
}

/* home-matching navbar */
.gate-nav{
  position:sticky;top:10px;z-index:20;
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:9px 10px 9px 12px;border-radius:22px;
  border:1px solid rgba(233,190,92,.22);
  background:rgba(7,14,27,.78);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  box-shadow:0 16px 40px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.08);
}
.gate-nav-brand{display:flex;align-items:center;gap:11px;color:#fff;text-decoration:none;min-width:0}
.gate-nav-brand img{width:40px;height:40px;border-radius:12px;display:block}
.gate-nav-brand div{display:flex;flex-direction:column;line-height:1.05}
.gate-nav-brand strong{font-size:1.02rem;font-weight:800;letter-spacing:-.02em}
.gate-nav-brand small{color:var(--g2);font-size:.64rem;font-weight:800;letter-spacing:.22em;text-transform:uppercase}
.gate-nav-links{
  display:flex;align-items:center;gap:4px;padding:4px;
  border-radius:999px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);
}
.gate-nav-links a{
  padding:8px 16px;border-radius:999px;
  color:#c8d5e6;font-size:.86rem;font-weight:700;text-decoration:none;
  transition:color .2s ease, background .2s ease;
}
.gate-nav-links a:hover{color:#fff;background:rgba(255,255,255,.06)}
.gate-nav-links a.is-on{
  color:#1b1202;background:linear-gradient(135deg,var(--g1),var(--g3));
  box-shadow:0 8px 16px rgba(233,190,92,.28);
}
.gate-nav-cta{display:flex;align-items:center;gap:8px}
.gate-nav-cta a{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:40px;padding:0 16px;border-radius:999px;
  font-size:.84rem;font-weight:800;text-decoration:none;
  transition:transform .18s ease, background .18s ease, color .18s ease;
}
.gate-nav-cta .ghost{color:#dce6f4}
.gate-nav-cta .ghost:hover{color:#fff;background:rgba(255,255,255,.06)}
.gate-nav-cta .gold{
  color:#1b1202;background:linear-gradient(135deg,var(--g1),var(--g3));
  box-shadow:0 8px 18px rgba(233,190,92,.28);
}
.gate-nav-cta .gold:hover{transform:translateY(-1px)}
.gate-nav-cta a.is-on.ghost{
  color:#1b1202;background:rgba(233,190,92,.92);
}

/* split workspace */
.gate-work{
  flex:1;display:grid;grid-template-columns:1.05fr .95fr;
  align-items:stretch;gap:28px;min-height:0;
  animation:gateIn .7s cubic-bezier(.22,1,.36,1) both;
}
.gate-brand{
  display:flex;flex-direction:column;justify-content:center;
  padding:12px 8px 24px;
}
.gate-emblem{
  position:relative;width:240px;height:240px;margin:0 0 16px;
  display:grid;place-items:center;
}
.gate-brand-mark{
  position:relative;z-index:2;width:174px;height:174px;margin:0;
  filter:drop-shadow(0 20px 34px rgba(0,0,0,.5)) drop-shadow(0 0 20px rgba(233,190,92,.3));
  animation:gateFloat 7s ease-in-out infinite;
}
.gate-emblem .orbit{
  position:absolute;left:50%;top:50%;border-radius:50%;
  border:1px solid rgba(233,190,92,.32);pointer-events:none;
}
.gate-emblem .orbit:before{
  content:"";position:absolute;left:50%;top:-4px;width:8px;height:8px;
  margin-left:-4px;border-radius:50%;background:#FBE7A6;
  box-shadow:0 0 14px rgba(251,231,166,.8);
}
.gate-emblem .orbit.o1{
  width:220px;height:220px;margin:-110px 0 0 -110px;
  animation:gateSpin 18s linear infinite;
}
.gate-emblem .orbit.o2{
  width:194px;height:112px;margin:-56px 0 0 -97px;
  border-color:rgba(62,233,196,.32);
  transform:rotate(-22deg);animation:gateOrbit 12s linear infinite reverse;
}
.gate-emblem .orbit.o2:before{background:#3EE9C4;box-shadow:0 0 14px rgba(62,233,196,.8)}
.emblem-glow{
  position:absolute;width:150px;height:150px;border-radius:50%;
  background:radial-gradient(circle,rgba(233,190,92,.28),transparent 68%);
  filter:blur(14px);animation:gateGlow 4s ease-in-out infinite;
}
.gate-brand h1{
  margin:0;max-width:14ch;
  font-family:Fraunces,Georgia,serif;
  font-size:clamp(2.2rem, 4vw, 3.5rem);
  font-weight:560;letter-spacing:-.04em;line-height:1.02;
}
.gate-brand h1 em{
  font-style:italic;
  background:linear-gradient(120deg,var(--g1),var(--g2) 50%,var(--teal));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.gate-brand p{margin:14px 0 0;max-width:42ch;color:#b8c7dc;font-size:1.02rem;line-height:1.65}
.gate-points{display:grid;gap:10px;margin:22px 0 0;padding:0;list-style:none}
.gate-points li{
  display:flex;align-items:center;gap:10px;color:#e7eef8;font-weight:650;font-size:.92rem;
}
.gate-points span{
  width:34px;height:34px;border-radius:11px;display:grid;place-items:center;flex:0 0 auto;
  background:linear-gradient(135deg,var(--g1),var(--g3));color:#1b1202;
}
.gate-points svg{width:16px;height:16px}

.gate-card{
  position:relative;overflow:hidden;align-self:center;width:100%;
  padding:28px 26px 24px;border-radius:28px;
  border:1px solid rgba(233,190,92,.22);
  background:linear-gradient(180deg, rgba(12,22,40,.86), rgba(7,14,26,.92));
  box-shadow:0 30px 70px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(16px);
  animation:gateCardIn .8s .12s cubic-bezier(.22,1,.36,1) both;
}
.gate-card:before{
  content:"";position:absolute;top:-50%;left:-75%;width:44%;height:210%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.07),transparent);
  transform:rotate(18deg);animation:gateSweep 6s 1.2s ease-in-out infinite;
  pointer-events:none;
}
.gate-card h2{
  margin:0;font-family:Fraunces,Georgia,serif;
  font-size:1.85rem;font-weight:560;letter-spacing:-.03em;
}
.gate-card .gate-hint{margin:6px 0 18px;color:#9db0c6;font-size:.92rem}

.gate-alert{
  margin:0 0 12px;padding:10px 12px;border-radius:12px;font-size:.84rem;line-height:1.45;
}
.gate-alert.err{background:rgba(140,28,36,.45);border:1px solid rgba(255,140,140,.35);color:#ffe4e4}
.gate-alert.ok{background:rgba(0,122,61,.22);border:1px solid rgba(62,233,196,.3);color:#d4fff6}

.gate-field{
  position:relative;display:grid;grid-template-columns:48px 1fr;align-items:center;
  min-height:54px;margin-bottom:12px;padding-right:8px;
  border-radius:16px;
  border:1px solid rgba(233,190,92,.18);
  background:rgba(4,10,20,.7);
  transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.gate-card form > .gate-field,
.gate-card form > .quick-login,
.gate-card form > .gate-meta,
.gate-card form > .gate-go{
  animation:gateFieldIn .55s cubic-bezier(.22,1,.36,1) both;
}
.gate-card form > :nth-child(5){animation-delay:.16s}
.gate-card form > :nth-child(6){animation-delay:.22s}
.gate-card form > :nth-child(7){animation-delay:.28s}
.gate-card form > :nth-child(8){animation-delay:.34s}
.gate-field:focus-within{
  border-color:rgba(233,190,92,.7);
  box-shadow:0 0 0 4px rgba(233,190,92,.12);
  transform:translateY(-1px);
}
.gate-ico{
  display:grid;place-items:center;color:var(--g2);
}
.gate-ico svg{width:18px;height:18px}
.gate-field input,.gate-field select{
  width:100%;height:52px;border:0;outline:0;background:transparent;
  color:#fff;font:inherit;font-size:.95rem;padding:0 40px 0 0;
}
.gate-field input::placeholder{color:rgba(255,255,255,.38)}
.gate-field select{appearance:none;cursor:pointer}
.gate-eye{
  position:absolute;right:6px;width:38px;height:38px;border:0;border-radius:10px;
  background:transparent;color:var(--g2);cursor:pointer;display:grid;place-items:center;
}
.gate-eye svg{width:18px;height:18px}

.gate-meta{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin:2px 2px 16px;font-size:.82rem;
}
.gate-meta label{display:inline-flex;align-items:center;gap:8px;color:#d5deea;cursor:pointer}
.gate-meta input{accent-color:#E9BE5C}
.gate-meta button{
  border:0;background:transparent;color:var(--g1);font:inherit;font-size:.82rem;font-weight:800;cursor:pointer;
}
.gate-note{margin:-6px 0 12px;color:#d8c48a;font-size:.8rem}

.gate-go{
  width:100%;min-height:52px;border:0;border-radius:999px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:10px;
  font:inherit;font-weight:800;color:#1a1203;
  background:linear-gradient(135deg,var(--g1),var(--g2) 52%,var(--g3));
  box-shadow:0 14px 30px rgba(233,190,92,.3);
  transition:transform .2s ease, box-shadow .2s ease;
}
.gate-go:hover{transform:translateY(-2px);box-shadow:0 18px 36px rgba(233,190,92,.42)}
.gate-go svg{width:18px;height:18px}

.gate-foot{margin:16px 0 0;text-align:center;color:#8fa0b5;font-size:.86rem}
.gate-foot a{color:var(--g1);font-weight:800;text-decoration:none}

@keyframes gateIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes gateSpin{to{transform:rotate(360deg)}}
@keyframes gateFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes gatePrismDrift{0%,100%{transform:translate3d(0,0,0) rotate(-6deg)}50%{transform:translate3d(22px,-16px,0) rotate(2deg)}}
@keyframes gateAurora{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(24px,-18px,0) scale(1.08)}}
@keyframes gateParticle{0%,100%{opacity:.25;transform:translateY(12px) rotate(45deg) scale(.7)}50%{opacity:1;transform:translateY(-14px) rotate(135deg) scale(1)}}
@keyframes gateOrbit{to{transform:rotate(338deg)}}
@keyframes gateGlow{0%,100%{opacity:.45;transform:scale(.9)}50%{opacity:1;transform:scale(1.12)}}
@keyframes gateCardIn{from{opacity:0;transform:translateX(28px) scale(.98)}to{opacity:1;transform:none}}
@keyframes gateFieldIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes gateSweep{0%,62%{left:-75%}82%,100%{left:145%}}

@media (max-width:980px){
  .gate-nav-links{display:none}
  .gate-work{grid-template-columns:1fr;gap:10px}
  .gate-brand{padding:8px 4px 8px;text-align:center;align-items:center}
  .gate-brand h1{max-width:none}
  .gate-brand p{margin-left:auto;margin-right:auto}
  .gate-points{justify-items:center}
  .gate-emblem{width:170px;height:170px;margin-left:auto;margin-right:auto}
  .gate-brand-mark{width:122px;height:122px}
  .gate-emblem .orbit.o1{width:162px;height:162px;margin:-81px 0 0 -81px}
  .gate-emblem .orbit.o2{width:146px;height:84px;margin:-42px 0 0 -73px}
  .gate-bg-badge{opacity:.08;left:50%;top:18%;margin-left:-195px}
}
@media (max-width:520px){
  .gate{padding:10px 10px 22px}
  .gate-nav{padding:8px}
  .gate-nav-brand small{display:none}
  .gate-card{padding:22px 16px 18px}
}
@media (prefers-reduced-motion:reduce){
  .gate-work,.gate-rays,.gate-bg-badge,.gate-brand-mark,.gate-aurora,.gate-particle,
  .gate-emblem .orbit,.emblem-glow,.gate-card,.gate-card:before,.gate-card form > *{animation:none}
}

/* Register — Kuwait skyline experience */
.reg-scene{
  --gold:#F5C85C;--gold-lite:#FFF0AD;--blue:#07162A;
  position:relative;isolation:isolate;overflow:hidden;
  min-height:100dvh;padding:28px 18px 46px;
  display:flex;flex-direction:column;align-items:center;
  background:
    linear-gradient(180deg,rgba(3,10,22,.12),rgba(3,10,22,.42)),
    var(--reg-night) center/cover fixed no-repeat;
}
.reg-scene:before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(620px 300px at 50% 40%,rgba(50,139,230,.2),transparent 70%),
    linear-gradient(90deg,rgba(2,8,18,.38),transparent 32% 68%,rgba(2,8,18,.38));
}
.reg-lights{position:absolute;inset:0;pointer-events:none;z-index:-1}
.reg-lights span{
  position:absolute;width:7px;height:7px;border-radius:50%;
  background:#FFF3B8;box-shadow:0 0 10px #FFF3B8,0 0 24px #E9BE5C;
  animation:regStar 4.8s ease-in-out infinite;
}
.reg-lights span:nth-child(1){left:16%;top:25%}
.reg-lights span:nth-child(2){right:17%;top:18%;animation-delay:-1.8s}
.reg-lights span:nth-child(3){left:76%;top:54%;animation-delay:-3.1s}

.reg-brand{
  position:relative;z-index:2;width:min(940px,100%);
  display:flex;flex-direction:column;align-items:center;text-align:center;
  animation:regDrop .8s cubic-bezier(.22,1,.36,1) both;
}
.reg-brand>a{display:flex;align-items:center;gap:12px;color:#fff;text-decoration:none}
.reg-brand>a img{
  width:58px;height:58px;filter:drop-shadow(0 5px 14px rgba(233,190,92,.45));
}
.reg-brand>a span{display:flex;flex-direction:column;align-items:flex-start;line-height:1}
.reg-brand strong{font-size:clamp(1.8rem,4vw,2.65rem);font-weight:800;letter-spacing:-.04em}
.reg-brand strong em{font-style:normal;color:var(--gold-lite)}
.reg-brand small{margin-top:7px;color:#F7D77E;font-size:1rem;font-weight:700;letter-spacing:.13em}
.reg-brand>p{
  display:inline-flex;align-items:center;gap:9px;margin:14px 0 0;
  padding:8px 18px;border-radius:999px;
  border:1px solid rgba(255,226,142,.55);
  background:rgba(7,20,42,.56);backdrop-filter:blur(12px);
  box-shadow:0 8px 26px rgba(0,0,0,.28),inset 0 0 18px rgba(233,190,92,.07);
  color:#f4f7fc;font-size:.84rem;font-weight:700;
}
.reg-brand>p i{color:var(--gold)}

.reg-panel{
  position:relative;z-index:2;width:min(570px,100%);margin-top:68px;
  padding:68px 48px 34px;border-radius:64px;
  color:#10233B;
  border:1px solid rgba(255,255,255,.9);
  background:
    linear-gradient(145deg,rgba(255,255,255,.96),rgba(239,247,255,.91) 58%,rgba(224,238,249,.9));
  box-shadow:
    0 38px 90px rgba(0,0,0,.52),
    0 0 0 1px rgba(255,210,101,.42),
    inset 0 1px 0 #fff,
    inset 0 0 52px rgba(64,145,219,.08);
  backdrop-filter:blur(25px) saturate(1.15);
  animation:regPanel .85s .12s cubic-bezier(.22,1,.36,1) both;
}
.reg-panel:before,.reg-panel:after{
  content:"";position:absolute;pointer-events:none;
}
.reg-panel:before{
  inset:-2px;border-radius:66px;padding:2px;
  background:linear-gradient(140deg,rgba(255,242,185,.9),rgba(100,188,255,.18) 35%,rgba(255,255,255,.52) 60%,rgba(233,190,92,.9));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  filter:drop-shadow(0 0 12px rgba(233,190,92,.32));
}
.reg-panel:after{
  top:0;left:12%;width:76%;height:1px;
  background:linear-gradient(90deg,transparent,#FFF1B0,transparent);
  box-shadow:0 0 18px #E9BE5C;
  animation:regEdge 4s ease-in-out infinite;
}

.reg-avatar{
  position:absolute;left:50%;top:-53px;transform:translateX(-50%);
  width:106px;height:106px;border-radius:34px;
  display:grid;place-items:center;color:#FFF1B0;
  border:2px solid rgba(255,218,118,.9);
  background:linear-gradient(145deg,#17365F,#07152B);
  box-shadow:0 14px 35px rgba(0,0,0,.5),0 0 25px rgba(233,190,92,.45),inset 0 0 25px rgba(67,154,241,.15);
}
.reg-avatar svg{width:55px;height:55px;position:relative;z-index:2}
.reg-avatar img{
  position:relative;z-index:2;width:76px;height:76px;display:block;
  filter:drop-shadow(0 8px 14px rgba(0,0,0,.45)) drop-shadow(0 0 10px rgba(233,190,92,.35));
  animation:regLogoFloat 4.5s ease-in-out infinite;
}
.reg-avatar-ring{
  position:absolute;inset:-12px;border-radius:42px;
  border:1px dashed rgba(255,229,146,.62);
  animation:regSpin 18s linear infinite;
}

.reg-title{display:flex;align-items:center;justify-content:center;gap:14px}
.reg-title span{height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--gold))}
.reg-title span:last-child{background:linear-gradient(90deg,var(--gold),transparent)}
.reg-title h1{margin:0;white-space:nowrap;font-size:clamp(1.65rem,5vw,2.2rem);font-weight:800}
.reg-title h1 em{font-style:normal;color:#B57912}
.reg-sub{margin:8px auto 23px;max-width:34ch;text-align:center;color:#50647D;font-size:.9rem;line-height:1.5}

.reg-alert{margin:0 0 12px;padding:10px 13px;border-radius:14px;font-size:.84rem;line-height:1.4}
.reg-alert.err{background:rgba(128,18,31,.6);border:1px solid rgba(255,135,148,.42);color:#ffe8eb}
.reg-alert.ok{background:rgba(0,122,61,.35);border:1px solid rgba(77,238,166,.38);color:#d7ffec}

.reg-field{
  position:relative;display:grid;grid-template-columns:76px 1fr;align-items:center;
  height:58px;margin-bottom:13px;border-radius:999px;
  border:1px solid #B8CDE1;
  background:linear-gradient(90deg,#EDF5FC,#FFFFFF);
  box-shadow:inset 0 0 18px rgba(65,135,199,.06),0 7px 18px rgba(25,66,105,.1);
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
  animation:regField .55s cubic-bezier(.22,1,.36,1) both;
}
.reg-field:nth-of-type(1){animation-delay:.28s}
.reg-field:nth-of-type(2){animation-delay:.36s}
.reg-field:nth-of-type(3){animation-delay:.44s}
.reg-field:focus-within{
  transform:translateY(-2px);border-color:#D4A233;
  box-shadow:0 0 0 4px rgba(233,190,92,.17),0 12px 28px rgba(26,64,100,.16);
}
.reg-field-icon{
  height:100%;display:grid;place-items:center;border-radius:999px 0 0 999px;
  color:#A86F0D;border-right:1px solid #D2DEEA;
  background:linear-gradient(90deg,#FFF5D3,#EAF3FA);
  box-shadow:inset 8px 0 18px rgba(233,190,92,.1);
}
.reg-field-icon svg{width:25px;height:25px}
.reg-field input,.reg-field select{
  width:100%;height:56px;border:0;outline:0;background:transparent;
  padding:0 54px 0 22px;color:#152A43;font:inherit;font-size:16px;font-weight:600;
}
.reg-field input::placeholder{color:#74879D;opacity:1;font-weight:500}
.reg-field select{appearance:none;cursor:pointer;color:#52677F}
.reg-field select option{background:#0A1B31;color:#fff}
.reg-eye{
  position:absolute;right:9px;width:42px;height:42px;border:0;border-radius:50%;
  background:#E7F0F8;color:#536B84;display:grid;place-items:center;cursor:pointer;
}
.reg-eye svg{width:22px;height:22px}

.login-options{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin:2px 5px 15px;color:#4D6178;font-size:.82rem;
}
.login-options label{display:inline-flex;align-items:center;gap:8px;cursor:pointer}
.login-options input{accent-color:#E9BE5C}
.login-options button{
  border:0;background:transparent;color:#9B650C;
  font:inherit;font-size:.82rem;font-weight:800;cursor:pointer;
}
.reg-forgot-note{margin:-7px 6px 13px;color:#8B641B;font-size:.8rem}
.login-panel{max-width:560px}

.reg-submit{
  position:relative;overflow:hidden;width:100%;height:62px;margin-top:7px;
  display:flex;align-items:center;justify-content:center;
  padding:0 82px 0 70px;border:0;cursor:pointer;
  clip-path:polygon(20px 0,calc(100% - 18px) 0,100% 50%,calc(100% - 18px) 100%,20px 100%,0 50%);
  color:#12100a;font:inherit;font-size:1.03rem;font-weight:900;
  background:linear-gradient(105deg,#FFF1B0 0%,#F7C849 48%,#B87810 100%);
  filter:drop-shadow(0 8px 12px rgba(233,190,92,.4));
  box-shadow:inset 0 2px 0 rgba(255,255,255,.72),inset 0 -2px 0 rgba(126,77,4,.32);
  transition:transform .2s ease,filter .2s ease;
  animation:regField .6s .52s cubic-bezier(.22,1,.36,1) both;
}
.reg-submit:after{
  content:"";position:absolute;inset:2px;pointer-events:none;
  clip-path:polygon(19px 0,calc(100% - 17px) 0,100% 50%,calc(100% - 17px) 100%,19px 100%,0 50%);
  border:1px solid rgba(255,246,200,.72);
}
.reg-submit:before{
  content:"";position:absolute;top:0;left:-80%;width:42%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent);
  transform:skewX(-18deg);animation:regShine 3.8s 1.2s ease-in-out infinite;
}
.reg-submit:hover{transform:translateY(-3px);filter:drop-shadow(0 12px 16px rgba(233,190,92,.55)) brightness(1.04)}
.reg-submit span{position:relative;z-index:1}
.reg-submit>span:not(.reg-btn-icon):not(.reg-btn-arrow){
  display:block;width:100%;text-align:center;white-space:nowrap;
}
.login-submit{
  height:62px;padding:0;border:0;
  background:linear-gradient(110deg,#FFE89B,#F4BF43 52%,#B57310);
}
.reg-btn-icon{
  position:absolute!important;z-index:2!important;left:22px;top:0;
  width:52px;height:100%;display:grid;place-items:center;
  padding:0;color:#17130A;font-size:1.35rem;
}
.reg-btn-arrow{
  position:absolute!important;z-index:2!important;right:0;top:0;
  width:74px;height:100%;display:grid;place-items:center;
  background:linear-gradient(135deg,rgba(66,39,3,.55),rgba(91,56,6,.82));
  color:#FFF0A8;
  clip-path:polygon(28% 0,100% 0,100% 100%,0 100%);
  box-shadow:inset 1px 0 0 rgba(255,244,191,.35);
  transition:transform .2s ease;
}
.reg-btn-arrow i{font-size:1.15rem;margin-left:8px;filter:drop-shadow(0 0 5px rgba(255,236,145,.45))}
.reg-submit:hover .reg-btn-arrow{transform:translateX(2px)}
.login-submit.is-loading{pointer-events:none;filter:saturate(.8)}
.login-submit.is-loading .reg-btn-arrow i{
  font-size:0;width:17px;height:17px;border-radius:50%;
  border:2px solid rgba(255,232,154,.35);border-top-color:#FFE89A;
  animation:regSpin .8s linear infinite;
}
.login-submit.is-loading .reg-btn-arrow i:before{content:""}

.reg-login{margin-top:19px;text-align:center}
.reg-login>div{display:flex}
.reg-login>span{display:inline-block;width:70px;height:1px;vertical-align:middle;background:linear-gradient(90deg,transparent,var(--gold))}
.reg-login>span:nth-of-type(2){background:linear-gradient(90deg,var(--gold),transparent)}
.reg-login p{display:inline-block;margin:0 9px;color:#52677F;font-size:.82rem}
.reg-login a{
  margin-top:12px;width:100%;height:48px;border-radius:999px;
  display:flex;align-items:center;justify-content:center;gap:10px;
  border:1px solid #C99729;color:#17304B;text-decoration:none;font-weight:800;
  background:linear-gradient(180deg,#FFFFFF,#EAF3FA);box-shadow:0 7px 18px rgba(25,66,105,.1);
  transition:background .2s ease,transform .2s ease;
}
.reg-login a:hover{background:#FFF6D8;transform:translateY(-2px)}

.reg-submit,.reg-login a,.reg-eye,.login-options button,.reg-brand a{
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}

.reg-trust{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;
  margin-top:22px;padding-top:18px;
  border-top:1px solid rgba(201,151,41,.28);
}
.reg-trust > div{
  display:flex;flex-direction:column;align-items:center;gap:5px;
  padding:12px 6px 10px;border-radius:18px;text-align:center;
  background:linear-gradient(180deg,#FFFFFF,#F3F8FD);
  border:1px solid #D7E4F0;
  box-shadow:0 8px 16px rgba(22,58,92,.08);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.reg-trust > div:hover{
  transform:translateY(-3px);
  border-color:#E3B64A;
  box-shadow:0 12px 22px rgba(201,151,41,.18);
}
.reg-trust-ico{
  width:46px;height:46px;border-radius:14px;display:grid;place-items:center;
  background:linear-gradient(145deg,#FFF4C4,#E8B64A 58%,#B57A16);
  color:#1A1406;box-shadow:0 8px 16px rgba(201,151,41,.32),inset 0 1px 0 rgba(255,255,255,.7);
}
.reg-trust-ico i{font-size:1.15rem;filter:drop-shadow(0 1px 0 rgba(255,255,255,.35))}
.reg-trust b{color:#17304B;font-size:.78rem;font-weight:800;letter-spacing:.01em;line-height:1.1}
.reg-trust small{color:#6A7E94;font-size:.68rem;font-weight:700}

@keyframes regDrop{from{opacity:0;transform:translateY(-18px)}to{opacity:1;transform:none}}
@keyframes regPanel{from{opacity:0;transform:translateY(34px) scale(.97)}to{opacity:1;transform:none}}
@keyframes regField{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:none}}
@keyframes regStar{0%,100%{opacity:.25;transform:scale(.7)}50%{opacity:1;transform:scale(1.25)}}
@keyframes regSpin{to{transform:rotate(360deg)}}
@keyframes regEdge{0%,100%{opacity:.25;transform:scaleX(.7)}50%{opacity:1;transform:scaleX(1)}}
@keyframes regShine{0%,60%{left:-80%}85%,100%{left:140%}}
@keyframes regLogoFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-5px) scale(1.035)}}

@media(max-width:640px){
  .reg-scene{padding:20px 10px 32px;background-position:64% center}
  .reg-brand>a img{width:46px;height:46px}
  .reg-brand strong{font-size:1.65rem}
  .reg-brand>p{font-size:.72rem;padding:7px 12px}
  .reg-panel{margin-top:60px;padding:62px 18px 25px;border-radius:38px}
  .reg-panel:before{border-radius:40px}
  .reg-avatar{width:92px;height:92px;top:-46px;border-radius:29px}
  .reg-avatar svg{width:48px;height:48px}
  .reg-avatar img{width:65px;height:65px}
  .reg-title{gap:9px}
  .reg-field{grid-template-columns:62px 1fr}
  .reg-field input{padding-left:16px}
  .reg-submit{padding:0 68px 0 58px;font-size:.96rem}
  .reg-btn-icon{left:17px;width:44px;font-size:1.2rem}
  .reg-btn-arrow{width:64px}
}
@media(prefers-reduced-motion:reduce){
  .reg-brand,.reg-panel,.reg-field,.reg-submit,.reg-avatar-ring,.reg-avatar img,.reg-lights span,.reg-panel:after,.reg-submit:before{animation:none}
}