/* auth.css */
.auth-wrapper {
  min-height: calc(100vh - 64px);
  display: flex; align-items:center; justify-content:center;
  padding: 40px 20px;
  background: var(--bg);
}
.auth-container {
  width: 100%; max-width: 440px;
  background: var(--bg-card);
  padding: 44px 40px;
  border-radius: 20px;
  box-shadow: 0 8px 40px var(--shadow);
  border: 1px solid var(--border);
  position: relative;
  overflow: hidden;
}
.auth-container::before {
  content: '';
  position: absolute; top:0; left:0; right:0; height:4px;
  background: linear-gradient(90deg, var(--primary), var(--primary-light), var(--accent));
}
.auth-logo { text-align:center; margin-bottom:28px; }
.auth-logo img { width:72px; height:72px; border-radius:50%; object-fit:cover; border:3px solid var(--accent); margin-bottom:12px; }
.auth-logo .icon { font-size:2.5rem; display:block; margin-bottom:10px; }
.auth-logo h1 { font-size:1.4rem; color:var(--primary); font-family:'Fraunces',serif; margin-top:4px; }
.auth-logo p  { font-size:.85rem; color:var(--teks-muted); margin-top:5px; }
.auth-footer { text-align:center; margin-top:22px; font-size:.88rem; color:var(--teks-soft); }
.auth-footer a { color:var(--primary-light); font-weight:600; text-decoration:none; }
.auth-footer a:hover { color:var(--accent); }

@media(max-width:480px) {
  .auth-container { padding:30px 22px; }
  .auth-wrapper { padding:20px 16px; }
}