*,:after,:before{box-sizing:border-box;margin:0;padding:0}body{width:100vw;height:100vh;position:relative}.container{width:100%;height:100%;margin:0 auto;display:flex;flex-direction:column;background-color:#d9d9d9}@media(min-width:768px){.container{max-width:500px}}.fill{flex-grow:1}.canvas{width:100%;max-width:500px}.tools{gap:20px;background-color:#fcf6d7;padding:40px}.tool,.tools{display:flex;align-items:center}.tool{width:40px;height:40px;justify-content:center}.tool.active{background-color:#fca311;border:2px solid #ffc800;border-radius:4px}