*{box-sizing:border-box;padding:0;margin:0;font-family:sans-serif}html,body{height:100%}body{padding:16px 32px}body,#container,#upload-button{display:flex;flex-direction:column;justify-content:center;align-items:center}h1{text-align:center}#container{position:relative;width:640px;height:420px;max-width:100%;max-height:100%;border:2px dashed #D1D5DB;border-radius:.75rem;overflow:hidden;margin-top:1rem;background-size:100% 100%;background-position:center;background-repeat:no-repeat}#mask-output{position:absolute;width:100%;height:100%;pointer-events:none}#upload-button{gap:.4rem;font-size:18px;cursor:pointer}#upload{display:none}svg{pointer-events:none}#example{font-size:14px;text-decoration:underline;cursor:pointer}#example:hover{color:#2563eb}canvas{position:absolute;width:100%;height:100%}#status{min-height:16px;margin:8px 0}input[type=range]{position:absolute;top:10px;right:10px;z-index:1}