:root{--color-primary: #001E30}*,:before,:after{box-sizing:border-box}body{margin:0;height:100vh;display:grid;padding:1rem}#app{display:grid;align-content:center}#app>*{grid-area:1 /1;visibility:hidden}#app[data-state=start] #start,#app[data-state=requesting] #requesting,#app[data-state=updating] #updating,#app[data-state=updated] #updated,#app[data-state=unsupported] #unsupported{visibility:visible}#app[data-state=start] #start{display:grid;grid-auto-rows:max-content;gap:1rem}#app[data-state=updating]{background-color:#00f}#app[data-state=updated]{background-color:orange}#app[data-state=unsupported]{background-color:green}button{background-color:var(--color-primary);color:#fff;border-radius:.5rem;border:none;font-size:.875rem;line-height:1.25rem;font-weight:500;padding-inline:1.25rem;padding-block:.625rem}