:root { --bg:#f7f7fb; --card:#fff; --line:#e5e7eb; --fg:#111; }
* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial;
  background: var(--bg); color: var(--fg);
}
.wrap {
  max-width: 900px; margin: 2rem auto; padding: 2rem;
  background: var(--card); border: 1px solid var(--line); border-radius: 12px;
  box-shadow: 0 3px 10px rgba(0,0,0,.05); text-align: center;
}
h1 { margin-top: 0; }
#question { font-size: 2rem; margin: 1rem 0; }
.row { display: flex; gap: .5rem; justify-content: center; align-items: center; margin: .5rem 0; }
input { padding: .6rem .8rem; font-size: 1rem; width: 120px; text-align: center; }
button { padding: .6rem 1rem; border: 1px solid var(--line); background: #fff; border-radius: 8px; cursor: pointer; }
button:hover { background: #f3f4f6; }
