.auth-page {
  min-height: 100vh;
  margin: 0;
  display: grid;
  grid-template-columns: 1fr;
  place-items: center;
  padding: 24px;
  background: radial-gradient(circle at 10% 10%, #ffe7d9, transparent 34%), radial-gradient(circle at 90% 80%, #dff4ec, transparent 30%), #fff8f3;
}

.auth-shell { width: min(920px, 100%); display: grid; grid-template-columns: 1.05fr .95fr; overflow: hidden; border: 1px solid rgba(73,50,39,.1); border-radius: 30px; background: rgba(255,255,255,.92); box-shadow: 0 30px 90px rgba(92,52,36,.16); }
.auth-visual { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; min-height: 560px; padding: 48px; background: linear-gradient(145deg,#fff0e7,#fffaf4 55%,#e9f7ef); }
.auth-logo { width: min(280px,82%); aspect-ratio: 1; object-fit: contain; align-self: center; filter: drop-shadow(0 18px 24px rgba(164,78,61,.13)); animation: gentle-float 5s ease-in-out infinite; }
.auth-visual h1 { margin: 4px 0; color: #493227; font-size: clamp(38px,6vw,58px); }
.auth-visual > p:last-child { max-width: 360px; color: #725f55; line-height: 1.8; }

.auth-card {
  width: 100%; padding: 64px 48px; align-self: center;
}

.auth-card h2 { margin: 8px 0; font-size: 30px; }
.auth-form { display: grid; gap: 18px; margin-top: 26px; }
.auth-form label { display: grid; gap: 8px; font-weight: 650; }
.auth-form input {
  box-sizing: border-box;
  width: 100%;
  padding: 12px 14px;
  border: 1px solid #d9d1c5;
  border-radius: 12px;
  font: inherit;
}
.auth-form input:focus { outline: 3px solid #9f3344; outline-offset: 2px; border-color: #c54857; }
.password-field { position: relative; display: block; }
.password-field input { padding-right: 68px; }
.password-field button { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); border: 0; background: transparent; color: #a23e49; cursor: pointer; padding: 7px; font: inherit; }
.auth-form .button { width: 100%; margin-top: 4px; }
.auth-secondary { margin-top: 22px; text-align: center; }
.auth-help { margin: 24px 0 0; color: #7b6a60; text-align: center; font-size: 13px; }
@keyframes gentle-float { 50% { transform: translateY(-7px); } }
@media(max-width:720px){.auth-page{padding:14px}.auth-shell{grid-template-columns:1fr;border-radius:22px}.auth-visual{min-height:auto;padding:26px 28px 20px}.auth-logo{width:130px}.auth-visual>p:last-child{display:none}.auth-visual h1{font-size:34px}.auth-card{padding:30px 28px 34px}}
@media(prefers-reduced-motion:reduce){.auth-logo{animation:none}}