.auth{min-height:100vh;display:grid;grid-template-columns:minmax(320px,.85fr) minmax(0,1.15fr)}
.auth-side{position:relative;background:var(--night);color:var(--paper);padding:36px 44px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.auth-side::before{content:"";position:absolute;inset:0;background-image:linear-gradient(to left,rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(160deg,#000,transparent 75%);-webkit-mask-image:linear-gradient(160deg,#000,transparent 75%)}
.auth-side>*{position:relative}
.auth-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit}
.auth-brand .mark{width:32px;height:32px}
.auth-brand .mark rect{fill:var(--paper)}
.auth-brand .mark path{fill:none;stroke:var(--ink);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.auth-brand .mark circle{fill:var(--accent)}
.auth-brand strong{font-family:var(--display);font-size:20px;font-weight:800}
.auth-quote p{font-family:var(--display);font-size:clamp(26px,2.6vw,36px);font-weight:700;line-height:1.55;letter-spacing:-.02em}
.auth-quote ul{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:10px;color:#cfc9bb}
.auth-quote li{display:flex;align-items:center;gap:12px}
.auth-quote li::before{content:"";width:18px;height:1.5px;background:var(--accent)}
.auth-side small{color:#77736a;font-size:11.5px;direction:ltr;text-align:right}

.auth-main{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 24px;position:relative}
.auth-back{position:absolute;top:24px;inset-inline-end:28px;font-size:13px;color:var(--muted);text-decoration:none}
.auth-back:hover{color:var(--ink)}
.auth-card{width:min(400px,100%)}
.auth-card h1{font-size:28px;font-weight:800;letter-spacing:-.02em}
.auth-sub{color:var(--muted);margin:8px 0 26px}
.auth-card form{display:grid;gap:16px}
.auth-card label small{color:var(--faint);font-size:11.5px}
.auth-submit{width:100%;margin-top:6px}
.seg{display:grid;grid-template-columns:1fr 1fr;padding:4px;background:var(--paper-2);border-radius:var(--r);margin-bottom:22px}
.seg a{text-align:center;padding:8px;border-radius:var(--r-sm);text-decoration:none;color:var(--muted);font-weight:600;font-size:13.5px;transition:background .2s var(--ease),color .2s,box-shadow .2s}
.seg a.on{background:var(--white);color:var(--ink);box-shadow:var(--shadow-1)}
.or{display:flex;align-items:center;gap:12px;color:var(--faint);font-size:12px;margin:22px 0 14px}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line)}
#sms-box{display:grid;gap:12px}
.sms-row{display:flex;gap:8px}
.sms-row input{flex:1}
.auth-msg{min-height:24px;margin-top:16px;color:var(--bad);font-size:13px}
.auth-msg:empty{min-height:0;margin:0}
.auth-foot{margin-top:40px;color:var(--faint);font-size:12px;text-align:center;max-width:380px}
@media (max-width:860px){
  .auth{grid-template-columns:1fr}
  .auth-side{padding:22px 24px;flex-direction:row;align-items:center}
  .auth-quote,.auth-side small{display:none}
  .auth-back{position:static;align-self:flex-start;margin-bottom:28px}
  .auth-main{justify-content:flex-start;padding-top:24px}
}