:root {
  --bg: #0a0f1a; --bg2: #0f1520; --bg3: #141820;
  --border: #1e2a3a; --blue: #2563eb; --blue-light: #4a9eff;
  --red: #ef4444; --green: #22c55e; --text: #e2e8f0; --text-muted: #64748b;
}
* { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }
body { background: var(--bg); color: var(--text); font-family: system-ui, sans-serif; min-height: 100vh; }
.screen { display: none; min-height: 100vh; flex-direction: column; align-items: center; justify-content: center; padding: 24px; }
.screen.active { display: flex; }
.btn { border: none; border-radius: 10px; padding: 16px; cursor: pointer; font-size: 15px; font-weight: 700; width: 100%; font-family: inherit; }
.btn-primary { background: var(--blue); color: #fff; }
.btn-danger { background: #3a0e0e; color: var(--red); border: 1px solid #6a1e1e; }
.btn-secondary { background: var(--bg3); color: var(--text-muted); border: 1px solid var(--border); font-size: 13px; }
.form-input { background: var(--bg3); border: 1px solid var(--border); color: var(--text); border-radius: 8px; padding: 14px; width: 100%; font-size: 16px; font-family: inherit; }
.form-input:focus { outline: none; border-color: var(--blue); }
.error { color: var(--red); font-size: 13px; margin-top: 8px; text-align: center; }