:root{
  --ok-bg:#FAFAF8;
  --ok-ink:#17171A;
  --ok-black:#0B0B0C;
  --ok-orange-1:#7C2D12;
  --ok-orange-2:#C2410C;
  --ok-orange-3:#FF7A00;
  --ok-orange-light:#FFB347;
  --ok-orange-text:#9A3412;
}
.ok-auth *{box-sizing:border-box}
.ok-auth{font-family:'Poppins',sans-serif;min-height:100vh;display:grid;grid-template-columns:1fr 1fr}
.ok-auth a{text-decoration:none}

.ok-auth-form-col{padding:64px 8vw;display:flex;flex-direction:column;justify-content:center;background:var(--ok-bg)}
.ok-auth-logo{display:flex;align-items:center;gap:10px;margin-bottom:40px}
.ok-auth-logo-mark{width:34px;height:34px;transform:rotate(45deg);background:linear-gradient(135deg,var(--ok-orange-1) 0%,var(--ok-orange-2) 50%,var(--ok-orange-3) 100%);border-radius:8px;position:relative}
.ok-auth-logo-mark span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;transform:rotate(-45deg);font-weight:800;font-size:14px;color:#fff}
.ok-auth-logo-word{font-weight:800;font-size:19px;letter-spacing:-.02em;color:var(--ok-black)}
.ok-auth-logo-word .ok-ko{background:linear-gradient(120deg,var(--ok-orange-2),var(--ok-orange-3));-webkit-background-clip:text;background-clip:text;color:transparent}

.ok-auth-tabs{display:flex;gap:6px;background:rgba(11,11,12,.05);border-radius:999px;padding:5px;margin-bottom:32px;width:fit-content}
.ok-auth-tab{padding:10px 22px;border-radius:999px;font-size:14px;font-weight:600;color:#5c5b57}
.ok-auth-tab.is-active{background:#0B0B0C;color:#fff}

.ok-auth-h2{font-size:clamp(26px,3vw,32px);font-weight:800;letter-spacing:-.02em;margin:0 0 8px;color:var(--ok-black)}
.ok-auth-lede{font-size:15px;color:#5c5b57;margin:0 0 28px;line-height:1.6}

.ok-field{margin-bottom:18px}
.ok-field label{display:block;font-size:13px;font-weight:600;color:var(--ok-black);margin-bottom:8px}
.ok-field input{width:100%;padding:13px 15px;border-radius:12px;border:1.5px solid rgba(11,11,12,.15);font-size:15px;background:#fff;font-family:'Poppins',sans-serif}
.ok-field input.ok-has-error{border-color:#DC2626}
.ok-field-error{font-size:12.5px;color:#DC2626;margin:6px 0 0}

.ok-btn-primary{display:block;width:100%;text-align:center;padding:15px;border-radius:999px;background:linear-gradient(120deg,var(--ok-orange-text),var(--ok-orange-2));color:#fff;font-weight:700;font-size:15px;border:none;cursor:pointer}

.ok-auth-foot{font-size:13.5px;color:#5c5b57;margin:24px 0 0;text-align:center}
.ok-auth-back{color:var(--ok-orange-text);font-weight:600}

.ok-auth-poster{background:var(--ok-black);color:#fff;padding:64px 6vw;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.ok-auth-poster::before{content:'';position:absolute;top:-20%;right:-20%;width:60%;height:60%;background:radial-gradient(circle,rgba(255,122,0,.35),transparent 70%);filter:blur(40px)}
.ok-auth-poster::after{content:'';position:absolute;bottom:-25%;left:-15%;width:55%;height:55%;background:radial-gradient(circle,rgba(194,65,12,.3),transparent 70%);filter:blur(40px)}
.ok-auth-poster h2{position:relative;font-size:clamp(24px,2.6vw,32px);font-weight:800;letter-spacing:-.02em;line-height:1.25;margin:0 0 40px;max-width:420px}
.ok-auth-perks{position:relative;display:flex;flex-direction:column;gap:24px}
.ok-auth-perk strong{display:block;font-size:15.5px;font-weight:700;margin-bottom:4px}
.ok-auth-perk span{font-size:13.5px;color:rgba(255,255,255,.6);line-height:1.5}

@media (max-width: 880px){
  .ok-auth{grid-template-columns:1fr}
  .ok-auth-poster{display:none}
  .ok-auth-form-col{padding:48px 7vw}
}