:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#fff}canvas.webgl{display:block;width:100%;height:100%}.panel{position:absolute;top:10px;left:10px;display:flex;flex-direction:column;gap:8px;z-index:10}.control{padding:5px 10px;background:#ffffffd9;border-radius:6px;font-family:sans-serif;width:300px;display:flex;align-items:center;gap:8px;box-sizing:border-box}.control label{width:70px;flex:0 0 70px}.control input[type=range]{flex:1 1 auto}.control span{width:40px;text-align:right;flex:0 0 40px}.previews{position:absolute;bottom:10px;left:10px;display:flex;gap:10px;z-index:10}.preview{width:220px;height:160px;background:#ffffffd9;border-radius:8px;overflow:hidden;box-shadow:0 6px 18px #00000026}.preview canvas{width:100%;height:100%;display:block}