body { font-family: system-ui, sans-serif; max-width: 760px; margin: 0 auto; padding: 1rem; color: #111; }
header { display: flex; flex-wrap: wrap; gap: 1rem; align-items: baseline; justify-content: space-between; }
nav button { margin-right: .5rem; }
form label { display: block; margin: .75rem 0; }
input, select { display: block; width: 100%; padding: .5rem; margin-top: .25rem; box-sizing: border-box; }
button { padding: .55rem 1rem; cursor: pointer; }
.msg { color: #7a1f1f; } .msg.ok { color: #1f5c2e; }
.note { color: #444; font-size: .95rem; }
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .75rem; }
.cards div { border: 1px solid #ccc; border-radius: 8px; padding: .75rem; }
.cards strong { display: block; font-size: 1.25rem; }
.donut { border: 1px solid #ccc; border-radius: 8px; padding: .75rem; }
ul { padding-left: 1.25rem; }