/* ── LOGIN PAGE SPECIFIC ────────────────────────────────────────────── */
html, body { height: 100%; }
body {
  display: flex; align-items: center; justify-content: center;
  min-height: 100vh; overflow: hidden;
}

/* Background glow — blue top, red hint bottom */
body::before {
  content: '';
  position: fixed; inset: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 70% 50% at 50% -10%, rgba(25,0,255,0.15) 0%, transparent 65%),
    radial-gradient(ellipse 40% 30% at 80% 110%, rgba(253,16,35,0.08) 0%, transparent 60%);
}

.wrap {
  position: relative; z-index: 1;
  width: 100%; max-width: 420px; padding: 24px;
  display: flex; flex-direction: column; align-items: center; gap: 36px;
}

/* Logo area */
.logo-area { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.logo { height: 48px; object-fit: contain; }
.logo-fallback {
  font-family: 'Barlow Condensed', sans-serif; font-weight: 900;
  font-size: 34px; letter-spacing: 4px; color: var(--accent); display: none;
}
.divider { width: 32px; height: 1px; background: var(--border2); }
.welcome {
  font-family: 'Barlow Condensed', sans-serif; font-size: 13px;
  font-weight: 400; letter-spacing: 4px; text-transform: uppercase; color: var(--muted);
}
.title {
  font-family: 'Barlow Condensed', sans-serif; font-size: 30px; font-weight: 900;
  letter-spacing: 2px; text-transform: uppercase; text-align: center; line-height: 1.1;
  color: #fff;
}
.title em { color: var(--accent); font-style: normal; }

.login-btn {
  width: 100%; padding: 16px;
  background: var(--gold); border: none; border-radius: 10px;
  color: #fff; font-family: 'Barlow Condensed', sans-serif;
  font-size: 20px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase;
  cursor: pointer; transition: all 0.2s;
}
.login-btn:hover { background: #2d1aff; transform: translateY(-1px); }

.footer { font-size: 11px; color: var(--muted); letter-spacing: 1px; font-family: 'Barlow Condensed', sans-serif; }