body{max-width:40rem;margin:0 auto;padding:1rem;font-family:system-ui,sans-serif}input,select,button{max-width:100%;font:inherit}label{margin-bottom:.5rem;display:block}form{margin-bottom:1rem}button{margin-right:.5rem}.error{color:#b00020}#stage{border:1px solid;padding:0 1rem}#stage.blue{background:#dbe8f6}#stage.green{background:#dcefe1}#stage.amber{background:#f8ebcb}#stage.red{background:#f6dcda}#shape{background:currentColor;width:3rem;height:3rem;margin:1rem}#shape.pulse{animation:.5s ease-in-out 3 pulse}#shape.shake{animation:.25s linear 6 shake}#shape.flash{animation:.3s linear 5 flash}.received{animation:1.2s ease-out received}@keyframes pulse{50%{transform:scale(1.5)}}@keyframes shake{25%{transform:translate(-1rem)}75%{transform:translate(1rem)}}@keyframes flash{50%{opacity:.1}}@keyframes received{0%{background:#ffe58a}}