.auth-visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.auth-shell{--auth-panel-surface:var(--gradient-brand-panel);--auth-panel-fg:#fff;--auth-panel-body-fg:var(--blue-100);--auth-panel-icon-fg:var(--blue-200);--auth-panel-notice-fg:var(--blue-200);--auth-panel-geometry-glow:var(--blue-400);--auth-panel-geometry-ring:var(--blue-300);grid-template-columns:minmax(0,5fr) minmax(0,7fr);min-height:100dvh;display:grid}.auth-panel{background:var(--auth-panel-surface);flex-direction:column;justify-content:space-between;padding:48px;display:flex;position:relative;overflow:hidden}.auth-panel__geometry{width:100%;height:100%;position:absolute;top:0;left:0}.auth-panel__body{max-width:420px;position:relative}.auth-panel__logo{width:148px;height:auto;position:relative}.auth-panel__heading{color:var(--auth-panel-fg);font-family:var(--font-display);letter-spacing:-.02em;margin:0 0 32px;font-size:clamp(24px,2.4vw,30px);font-weight:500;line-height:1.3}.auth-panel__points{gap:16px;margin:0;padding:0;list-style:none;display:grid}.auth-panel__points li{color:var(--auth-panel-body-fg);align-items:flex-start;gap:12px;font-size:15px;line-height:1.5;display:flex}.auth-panel__notice{color:var(--auth-panel-notice-fg);margin:24px 0 0;font-size:12px;font-style:italic}.auth-panel__icon{color:var(--auth-panel-icon-fg);flex:none;width:20px;height:20px;margin-top:2px}.auth-main{background:var(--surface);justify-content:center;align-items:center;padding:32px 20px;display:flex;position:relative}.auth-progress{background:var(--neutral-100);border-radius:var(--radius-pill);width:100%;height:3px;margin-bottom:32px;overflow:hidden}.auth-progress__bar{background:var(--primary);border-radius:var(--radius-pill);height:100%;transition:width .24s;display:block}.auth-progress__bar--half{width:50%}.auth-progress__bar--full{width:100%}.auth-card{background:var(--surface);width:100%;max-width:400px}.auth-card h1{font-family:var(--font-display);letter-spacing:-.02em;margin:0 0 24px;font-size:clamp(26px,5vw,32px);font-weight:600;line-height:1.2}.auth-card form{gap:16px;display:grid}.auth-card label{color:var(--neutral-700);font-size:13px;font-weight:500}.auth-card p{color:var(--muted);margin:0;line-height:1.6}.auth-card [role=alert]{color:var(--danger-text);font-size:13px}.auth-meta{color:var(--muted);font-size:13px}.auth-meta__value{color:var(--neutral-700);font-variant-numeric:tabular-nums;font-weight:500}.auth-state{gap:16px;display:grid}.auth-state--error{border-left:4px solid var(--danger);padding-left:16px}.auth-card input{border:1px solid var(--border);border-radius:var(--radius-sm);min-height:48px;padding:0 14px}.auth-card input:focus-visible{border-color:var(--focus);box-shadow:var(--focus-ring);outline:none}.auth-card button{background:var(--primary);border-radius:var(--radius-md);color:#fff;cursor:pointer;border:0;min-height:48px;padding:0 18px;font-weight:500;transition:background .15s,transform .15s}.auth-card button:not([type=button]):hover:not(:disabled){background:var(--primary-hover)}.auth-card button:active:not(:disabled){transform:scale(.98)}.auth-card button:focus-visible{box-shadow:var(--focus-ring);outline:none}.auth-card button:disabled{cursor:not-allowed;opacity:.5}.auth-card button[type=button]{color:var(--primary);background:0 0}.auth-card button[type=button]:hover:not(:disabled){background:var(--blue-50);color:var(--primary-hover)}.auth-card button[type=button]:disabled{color:var(--muted);opacity:1}.otp-inputs{grid-template-columns:repeat(6,minmax(44px,1fr));gap:clamp(4px,1.5vw,8px);display:grid}.auth-card .otp-inputs input{font-family:var(--font-body);font-variant-numeric:tabular-nums;text-align:center;min-height:56px;padding:0;font-size:24px;font-weight:600;transition:border-color .15s,border-width .15s}.auth-card .otp-inputs input.otp-inputs__slot--filled{border-color:var(--primary);border-width:2px}.otp-inputs--invalid{animation:.2s ease-in-out otp-shake}@keyframes otp-shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}@media (prefers-reduced-motion:reduce){.auth-progress__bar,.auth-card button,.auth-card .otp-inputs input{transition:none}.auth-card button:active:not(:disabled){transform:none}.otp-inputs--invalid{animation:none}}@media (max-width:520px){.auth-shell{grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1fr)}.auth-panel{display:none}.auth-main{padding:calc(32px + env(safe-area-inset-top)) 16px calc(32px + env(safe-area-inset-bottom));align-items:flex-start}.auth-card{max-width:none}}
