/* Critical styles: only what the sign-in screen needs.
   Keeps first paint fast on slow mobile connections. */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body, h1, h2, h3, p { margin: 0; }
button, textarea, select, input { font: inherit; }
button { border: 0; }
a { color: inherit; text-decoration: none; }
html, body { max-width: 100%; overflow-x: hidden; }

body {
  min-height: 100svh;
  background:
    radial-gradient(circle at 12% 8%, rgba(255,196,119,.26), transparent 24rem),
    radial-gradient(circle at 88% 4%, rgba(137,120,244,.2), transparent 26rem),
    linear-gradient(145deg,#f8f4ee,#f2f0ed 52%,#f4f1f7);
  color: #24212a;
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", sans-serif;
  letter-spacing: -0.012em;
}

.app-shell[hidden], [hidden] { display: none !important; }

.auth-gate {
  display: grid;
  min-height: 100svh;
  place-items: center;
  padding: 24px 18px;
}
.auth-card {
  width: min(430px, 100%);
  border: 1px solid rgba(255,255,255,.66);
  border-radius: 26px;
  background: rgba(255,255,255,.8);
  padding: 30px 24px;
  box-shadow: 0 26px 70px rgba(96,68,116,.13);
}
.auth-logo {
  display: block;
  width: 62px;
  height: 62px;
  margin-bottom: 22px;
  border-radius: 18px;
}
.eyebrow {
  color: #8b8490;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.auth-card h1 {
  margin-top: 10px;
  font-size: clamp(28px, 4.4vw, 36px);
  font-weight: 540;
  letter-spacing: -.045em;
}
.auth-copy { margin-top: 14px; color: #7c7581; font-size: 13px; line-height: 1.7; }
#auth-form { display: grid; gap: 14px; margin-top: 24px; }
#auth-form label { display: grid; gap: 8px; color: #6d6674; font-size: 11px; }
#auth-form input {
  width: 100%;
  min-height: 48px;
  border: 1px solid rgba(53,43,60,.11);
  border-radius: 14px;
  background: rgba(255,255,255,.85);
  padding: 0 14px;
  color: #2c2732;
  font-size: 15px;
}
.auth-error {
  border: 1px solid rgba(200,80,80,.18);
  border-radius: 12px;
  background: rgba(238,150,140,.12);
  padding: 11px 13px;
  color: #a4514c;
  font-size: 12px;
  line-height: 1.6;
}
.primary-button {
  display: inline-flex;
  min-height: 50px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 13px;
  background: #28242e;
  color: #fff;
  font-size: 13px;
  font-weight: 650;
}
.text-button {
  min-height: 42px;
  background: transparent;
  color: #7a6fd0;
  font-size: 13px;
}
.full-width { width: 100%; }
.auth-footnote { margin-top: 20px; color: #918a95; font-size: 11px; line-height: 1.65; text-align: center; }