:root {
  --bg: #0e1116; --panel: #161b22; --line: #2a313c;
  --text: #e6edf3; --muted: #8b949e; --accent: #58a6ff;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; background: var(--bg); color: var(--text); font: 14px/1.5 ui-sans-serif, -apple-system, "SF Pro Text", system-ui, sans-serif; }
body { display: grid; place-items: center; }
.login-card {
  background: var(--panel); border: 1px solid var(--line); border-radius: 12px;
  padding: 36px 32px; width: 360px; text-align: center;
  box-shadow: 0 12px 60px rgba(0,0,0,0.4);
}
.brand { display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: 4px; }
.brand .logo { color: var(--accent); font-size: 20px; }
.brand h1 { margin: 0; font-size: 20px; font-weight: 600; letter-spacing: 0.02em; }
.tagline { color: var(--muted); margin: 4px 0 24px; font-size: 13.5px; }
.btn-google {
  display: inline-flex; align-items: center; gap: 12px; justify-content: center;
  width: 100%; padding: 11px 16px; border-radius: 8px;
  background: #fff; color: #3c4043; text-decoration: none;
  font-weight: 500; font-size: 14px; border: 1px solid transparent;
}
.btn-google:hover { background: #f7f8fa; border-color: #dadce0; }
.hint { color: var(--muted); font-size: 12px; margin: 18px 0 0; }