:root {
  color-scheme: only light;
  forced-color-adjust: none;
  color-adjust: exact;
  -webkit-color-adjust: exact;
}
* { box-sizing: border-box; }
html, body { min-width: 320px; min-height: 100%; }
body {
  min-height: 100vh;
  margin: 0;
  color: #4d5c98;
  forced-color-adjust: none;
  color-adjust: exact;
  -webkit-color-adjust: exact;
  background:
    radial-gradient(circle at 12% 18%, rgba(244, 174, 204, .3), transparent 33%),
    radial-gradient(circle at 86% 14%, rgba(157, 204, 244, .34), transparent 36%),
    radial-gradient(circle at 50% 88%, rgba(191, 182, 240, .28), transparent 42%),
    linear-gradient(135deg, #fbf6fa, #f0effb 52%, #e7f5fb);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}
.module-page {
  display: flex;
  min-height: 100svh;
  max-width: 88rem;
  flex-direction: column;
  margin: 0 auto;
  padding: 0 clamp(1rem, 5vw, 5rem) clamp(2rem, 7vh, 5rem);
}
.auth-main {
  width: min(100%, 35rem); margin: auto; padding: clamp(3rem, 9vh, 7rem) 0 clamp(2rem, 6vh, 4rem);
}
.eyebrow {
  margin: 0 0 1rem; color: #ee91b9; font-size: .78rem; font-weight: 700;
  letter-spacing: .16em;
}
h1 { margin: 0; color: #4d5c98; font-size: clamp(2.25rem, 5vw, 4.5rem); font-weight: 400; letter-spacing: .02em; line-height: 1.2; }
.lead { margin: 1.4rem 0 0; color: #6979ad; font-size: 1.05rem; line-height: 1.9; }
.auth-message {
  margin: 1.5rem 0 0; padding: .8rem 1rem; border-left: 3px solid #ee91b9;
  color: #5a568e; background: rgba(255, 255, 255, .38); line-height: 1.7;
}
.google-button {
  display: inline-flex; width: 100%; min-height: 3.4rem; align-items: center; justify-content: center; gap: .75rem;
  margin-top: 2rem; padding: .8rem 1.1rem; border: 1px solid rgba(126, 158, 238, .58); border-radius: .9rem;
  color: #4d5c98; background: rgba(255, 255, 255, .64); font: inherit; font-weight: 600;
  text-decoration: none; box-shadow: 0 .65rem 1.8rem rgba(101, 115, 178, .1);
  cursor: pointer; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.google-button svg { width: 1.3rem; height: 1.3rem; }
.google-button:hover:not(:disabled) { transform: translateY(-1px); border-color: #ee91b9; box-shadow: 0 .9rem 2.2rem rgba(101, 115, 178, .16); }
.google-button:disabled { opacity: .62; cursor: not-allowed; }
.google-mark { font-weight: 700; color: #4285f4; }
.setup-note { margin: .8rem 0 0; color: #6979ad; font-size: .9rem; line-height: 1.7; }
.account-card {
  margin-top: 2rem; padding: clamp(1.25rem, 4vw, 2rem); border: 1px solid rgba(126, 158, 238, .45);
  border-radius: 1.2rem; background: linear-gradient(120deg, rgba(255,255,255,.62), rgba(230,241,250,.5));
  box-shadow: 0 .8rem 2.2rem rgba(101, 115, 178, .11);
}
.auth-status { margin: 0; color: #ee91b9; font-size: .72rem; font-weight: 700; letter-spacing: .14em; }
.account-card h2 { margin: .65rem 0 .35rem; color: #4d5c98; font-size: 1.4rem; font-weight: 550; }
.account-card > p:not(.auth-status) { margin: 0; color: #6979ad; line-height: 1.6; overflow-wrap: anywhere; }
.account-card form { margin-top: 1.4rem; }
.account-card button {
  border: 1px solid rgba(126, 158, 238, .55); border-radius: .7rem; padding: .7rem 1rem;
  color: #4d5c98; background: rgba(255, 255, 255, .65); font: inherit; cursor: pointer;
}
.account-card button:hover { border-color: #ee91b9; color: #ee91b9; }
.back-link { display: inline-block; margin-top: 1.5rem; color: #708ee0; text-decoration: none; }
.back-link:hover { color: #ee91b9; }
@media (max-width: 700px) {
  .auth-main { padding-top: clamp(2.5rem, 8vh, 5rem); }
}