* { box-sizing: border-box; font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial; }
body { margin: 0; padding: 2rem; background: #f6f8fb; color: #111; }
main { max-width: 640px; margin: 0 auto; }
h1 { margin-bottom: 1rem; }
.reading { display: flex; gap: 1rem; }
.card { background: white; padding: 1rem; border-radius: 8px; box-shadow: 0 2px 6px rgba(15,15,15,0.06); flex: 1; text-align:center }
.card h2 { margin: 0; font-size: 1rem; color: #666 }
.card p { font-size: 2rem; margin: 0.5rem 0 0; }
.meta { margin-top: 1rem; color: #444 }
.controls { margin-top: 1.25rem; display:flex; gap:0.5rem; align-items:center }
.controls label { font-size: 0.9rem }
.controls input { margin-left: 0.5rem; padding:0.3rem 0.5rem }
.controls button { padding: 0.4rem 0.75rem }
.note { margin-top: 1rem; font-size: 0.9rem; color: #666 }