div#smiley-wrapper{box-sizing:border-box;width:200px;padding:50px;margin:0 auto}.smiley{height:100px;width:100px;position:relative;border-radius:50px}.smiley .eye{height:12px;width:12px;border-radius:6px;position:absolute;overflow:hidden}.smiley .left-eye{top:20px;left:30px}.smiley .right-eye{top:20px;right:30px}.smiley .mouth{border-bottom-right-radius:25px;border-bottom-left-radius:25px;height:25px;position:absolute;width:50px;left:25px;top:60px}.smiley .mouth-cover{border-bottom-right-radius:25px;border-bottom-left-radius:25px;height:25px;position:absolute;width:40px;left:30px;top:50px}div#controls{text-align:center;display:flex;flex-wrap:wrap;width:100%;justify-content:center;align-items:center;gap:1rem}div#controls>*{padding:1rem}div#controls>* a{display:inline-block}div#controls h2{margin:0}div#controls .segment{display:flex;flex-wrap:wrap;gap:1rem;width:20rem}div#controls .segment>*{width:100%}div#controls label{background-color:#666;color:#fff;padding:5px 10px;cursor:pointer}div#controls label input[type=radio]{display:none}div#controls label:has(input[type=radio]:checked){background-color:lime;color:#fff}.figure{background-color:#000}.ground{background-color:#fff}#wrapper,#controls,#credits{width:300px;margin:0 auto}
