:root { font-family: system-ui, sans-serif; color: #18352e; background: #f3f7f5; }
body { margin: 0; }
.container { max-width: 38rem; margin: 0 auto; padding: 1.5rem; }
h1 { font-size: 1.5rem; }
fieldset { border: 0; padding: 0; margin: 0 0 1.25rem; }
legend, label { font-weight: 600; }
.actions { display: flex; gap: .75rem; flex-wrap: wrap; }
.actions legend { margin-bottom: .5rem; }
.action { flex: 1; min-width: 8rem; padding: 1rem; border: 1px solid #78968c; border-radius: .5rem; background: white; }
.action:has(input:checked) { outline: 2px solid #175c49; }
input[type="number"], textarea { display: block; box-sizing: border-box; width: 100%; padding: .65rem; margin: .4rem 0 1rem; border: 1px solid #78968c; border-radius: .3rem; font: inherit; }
.allowance { display: block; margin: 1rem 0; }
button { padding: .8rem 1.1rem; border: 0; border-radius: .4rem; background: #175c49; color: white; font: inherit; font-weight: 700; cursor: pointer; }
button:disabled { opacity: .5; cursor: default; }
#status { white-space: pre-line; min-height: 1.5em; }
[hidden] { display: none !important; }