:root {
  --brand: #1976D2;
  --bg: #FAF7F2;
  --text: #1A1A1A;
  --muted: #666;
  --success: #4CAF50;
  --warning: #FFC107;
  --danger: #C0392B;
  --border: #E5E7EB;
  --radius: 10px;
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin: 0; height: 100%; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background: var(--bg); color: var(--text); font-size: 16px;
  display: flex; flex-direction: column; align-items: center;
}
.container { max-width: 428px; width: 100%; padding: 16px; }
.header {
  background: var(--brand); color: #fff; padding: 12px 16px; text-align: center;
  font-weight: 600; border-radius: var(--radius); margin: 8px 0 16px;
}
.btn {
  display: block; width: 100%; padding: 14px 16px; border: none;
  border-radius: var(--radius); background: var(--brand); color: #fff;
  font-size: 15px; font-weight: 600; text-decoration: none; text-align: center;
  cursor: pointer; margin: 8px 0;
}
.btn-outline { background: #fff; color: var(--brand); border: 1px solid var(--brand); }
.btn-success { background: var(--success); }
.muted { color: var(--muted); font-size: 13px; }
.center { text-align: center; }