.authpage { min-height: 100vh; display: grid; place-items: center; padding: 16px; }
.authcard { width: min(380px, 100%); text-align: center; background: var(--surface); border: 1px solid var(--border);
  border-radius: 16px; padding: 2rem 1.6rem 1.4rem; }
.authcard h1 { margin: .6rem 0 .2rem; }
.authlogo { width: 52px; height: 52px; margin: 0 auto; border-radius: 14px; display: grid; place-items: center;
  background: var(--accent); color: #fff; font-weight: 800; font-size: 1.6rem; letter-spacing: -.02em; }
.gbtn { margin: 1.2rem 0 .4rem; width: 100%; display: inline-flex; gap: .6rem; align-items: center; justify-content: center;
  padding: .65rem 1rem; border-radius: 10px; border: 1px solid var(--border); background: var(--bg); color: var(--text);
  font: inherit; font-weight: 600; cursor: pointer; }
.gbtn:hover { border-color: var(--accent); }
.spinner { width: 34px; height: 34px; margin: 0 auto 10px; border: 3px solid var(--border); border-top-color: var(--accent);
  border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }