/* Sign-in page in the home.poparda.dev style: one frosted card on the warm wallpaper (see app/app.css). */
:root {
  --wall: #0e1514; --g1: #1f5a52; --g2: #4a2f63; --g3: #c2611f;
  --ink: #f6f2ec; --muted: rgba(246, 242, 236, .64);
  --glass: rgba(255, 255, 255, .085); --hair: rgba(255, 255, 255, .14); --danger: #ff8a7a; --shadow: 0 18px 50px rgba(0, 0, 0, .35);
  color-scheme: dark;
}
@media (prefers-color-scheme: light) {
  :root {
    --wall: #efe5d8; --g1: #9cc2a8; --g2: #cdb6e0; --g3: #f4a46d;
    --ink: #1d1a16; --muted: rgba(29, 26, 22, .62);
    --glass: rgba(255, 255, 255, .52); --hair: rgba(255, 255, 255, .7); --danger: #b8402c; --shadow: 0 18px 50px rgba(80, 50, 20, .16);
    color-scheme: light;
  }
}
* { box-sizing: border-box; }
html { background: var(--wall); }
body {
  margin: 0; min-height: 100vh; min-height: 100dvh; display: grid; place-items: center; color: var(--ink); background: transparent;
  padding: max(20px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left));
  font: 17px/1.45 -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased;
}
.wall { position: fixed; inset: 0; z-index: -1; overflow: hidden; background: var(--wall); }
.glow { position: absolute; border-radius: 50%; filter: blur(40px); }
.g1 { width: 130vw; height: 60vh; left: -45vw; top: -18vh; background: radial-gradient(closest-side, var(--g1), transparent); opacity: .95; animation: drift1 38s ease-in-out infinite alternate; }
.g2 { width: 100vw; height: 48vh; right: -45vw; top: 26vh; background: radial-gradient(closest-side, var(--g2), transparent); opacity: .8; animation: drift2 46s ease-in-out infinite alternate; }
.g3 { width: 160vw; height: 62vh; left: -30vw; bottom: -26vh; background: radial-gradient(closest-side, var(--g3), transparent); opacity: .85; animation: drift3 30s ease-in-out infinite alternate; }
@keyframes drift1 { to { transform: translate(10vw, 4vh) scale(1.08); } }
@keyframes drift2 { to { transform: translate(-12vw, 6vh) scale(.92); } }
@keyframes drift3 { to { transform: translate(8vw, -4vh) scale(1.1); } }
@media (prefers-reduced-motion: reduce) { .glow { animation: none; } }
.logincard {
  width: 100%; max-width: 420px; border-radius: 28px; padding: 32px 24px 24px; display: grid; gap: 14px; justify-items: center; text-align: center;
  background: var(--glass); border: .5px solid var(--hair); box-shadow: var(--shadow);
  -webkit-backdrop-filter: blur(28px) saturate(170%); backdrop-filter: blur(28px) saturate(170%);
}
.mark { width: 72px; height: 72px; border-radius: 18px; display: grid; place-items: center; background: linear-gradient(45deg, #f7a23a, #e3366f 55%, #8a3ab9); box-shadow: 0 12px 30px rgba(227, 54, 111, .4); }
.mark svg { width: 40px; height: 40px; fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
h1 { margin: 0; font-size: 34px; line-height: 1.12; font-weight: 700; letter-spacing: -.025em; }
.sub { color: var(--muted); margin: 0; }
#gbtn { display: flex; justify-content: center; min-height: 44px; }
#msg { margin: 0; font-size: 15px; }
#msg.bad { color: var(--danger); }