:root{--authMax:440px}

.auth-wrap{
  min-height:100dvh;
  display:grid;
  place-items:center;
  background:var(--bg);
  padding:max(28px,env(safe-area-inset-top)) 16px max(28px,env(safe-area-inset-bottom));
}

.auth-card{
  width:min(var(--authMax), calc(100vw - 32px));
  margin:0 auto;
  border:1px solid var(--border);
  border-radius:18px;
  background:linear-gradient(180deg,var(--surface-2),var(--surface-1));
  box-shadow:0 20px 60px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.02);
  padding:22px;
}

.auth-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.auth-title{font-size:clamp(20px,2.2vw,24px);font-weight:800;margin:0}
.auth-muted{color:#b4bdd6}

.auth-actions{display:grid;gap:10px;margin:12px 0}
.btn.block{justify-content:center;width:100%}

.auth-sep{display:flex;align-items:center;gap:10px;margin:8px 0}
.auth-sep span{color:#90a0d6;font-size:12px;white-space:nowrap}
.auth-sep i{height:1px;background:var(--border);flex:1}

.form{display:grid;gap:12px;margin-top:6px}
.form-row{display:grid;gap:6px}
.form-row label{font-weight:700;color:#dfe5ff}
.form-row input{
  all:unset;
  border:1px solid var(--border);
  border-radius:12px;
  background:linear-gradient(180deg,#101010,#0b0b0b);
  padding:12px 14px;
  color:#eaf0ff;
}
.form-row input::placeholder{color:#8c96b8}
.form-row input:focus{outline:2px solid color-mix(in oklab,var(--accent) 45%,#3a56ff);outline-offset:2px}

.form-actions{display:grid;gap:10px;margin-top:6px}
.form-mini{display:flex;justify-content:space-between;align-items:center;color:#9aa4c8;font-size:14px;gap:8px;flex-wrap:wrap}
a.link{color:#cfe0ff;text-decoration:underline}

.notice{
  border:1px solid color-mix(in oklab,var(--accent) 35%,var(--border));
  background:linear-gradient(180deg,#0f1225,#0b0f1f);
  border-radius:12px;
  padding:10px;
  color:#cfe0ff;
}
.notice.ok{border-color:#1d7b34;background:linear-gradient(180deg,#0f1a12,#0c140e)}
.notice.error{border-color:#7b1d1d;background:linear-gradient(180deg,#1a0f0f,#140c0c)}

.reveal-blur{opacity:0;filter:blur(14px);transform:translateY(14px)}
.reveal-blur.in{opacity:1;filter:none;transform:none;transition:opacity .6s var(--ease),filter .6s var(--ease),transform .6s var(--ease)}
@media (prefers-reduced-motion:reduce){.reveal-blur,.reveal-blur.in{transition:none}}

.auth-footer{margin-top:12px;color:#90a0d6;text-align:center;font-size:13px}
.auth-footer a{color:#cfe0ff;text-decoration:underline}

@media (min-width:1200px){:root{--authMax:480px}}
@media (max-width:420px){
  .auth-card{padding:18px;border-radius:16px}
  .auth-title{font-size:20px}
  .form-mini{font-size:13px}
}