*{margin:0;padding:0}body{background:#eee;font-family:sans-serif}button{-webkit-user-select:none;user-select:none;text-align:center;cursor:pointer;background-color:#eee;border:none;border-radius:.25em;justify-content:center;align-items:center;block-size:2em;padding-inline:1rem;display:inline-flex}#app{padding:2rem}.vertical-spacer{flex-direction:column;display:flex}.vertical-spacer.gap-s{gap:.5rem}.vertical-spacer.gap-m{gap:1rem}.vertical-spacer.gap-l{gap:2rem}.app{flex-direction:column;gap:2rem;max-inline-size:min(40rem,90%);margin-inline:auto;display:flex}.app-section{background:#fff;border-radius:1rem;flex-direction:column;gap:1rem;padding:2rem;display:flex}.app-section>header{justify-content:space-between;align-items:center;gap:1rem;display:flex}@scope(.counter){:scope{font-variant-numeric:tabular-nums;align-items:center;gap:.5em;font-size:1.5em;display:inline-flex}button{block-size:2em;inline-size:2em;padding:0}}