@import "https://fonts.googleapis.com/css2?family=Roboto:wght@100..900&display=swap";.roboto-regular{font-optical-sizing:auto;font-variation-settings:"wdth" 100;font-family:Roboto,sans-serif;font-style:normal;font-weight:400}body{margin:0}#app{overflow:hidden;display:flex;color:#f5f5f5;justify-content:center;align-items: center;width:100%;height:100vh}#container{display:flex;background:#111;justify-content:center;align-items: center;width:100%;height:100%}#loading{position:absolute;display:flex;color:#d3d3d3;background:#111;flex-direction:column;justify-content:center;align-items: center;width:100%;height:100%;transition:opacity .3s ease-out;font-size:2rem}#loading p{margin:0}#loading svg{width:5rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.empty{font-size:2rem}.controls{position:absolute;padding:.5rem}.left{top:0;left:0}.right{top:0;right:0}puzzle-progress{position:fixed;text-shadow:0 0 5px #000c;text-align:center;font-size:1.2rem;top:.5rem}puzzle-progress p{margin:0}player-list{position:fixed;top:.5rem;left:.5rem}player-list p{margin:0 0 .25rem}player-list ul{list-style:none;margin:0;padding-left:.25rem}player-list li{display:flex;align-items: center;gap:.5rem}player-list span.color{display:block;border-radius:100px;width:.9rem;height:.9rem}dialog::backdrop{background-color:#00000080}dialog form{display:flex;flex-direction:column}dialog .actions{display:flex;flex-direction:column;gap:.5rem;margin-top:.5rem}#upload-dialog{width:35rem}#upload-dialog progress{opacity:0;width:100%}#upload-preview{display:flex;position:relative;margin:0}#upload-preview img{object-fit:contain;text-align:center;display:block;position:relative;background-color:#d3d3d3;width:100%;height:auto;max-height:30rem;font-family:Helvetica;font-weight:300;line-height:2}#upload-preview img:after{content:attr(alt);color:#646464;display:block;position:absolute;z-index:2;background-color:#fff;width:100%;height:100%;top:0;left:0}#upload-preview canvas{position:absolute;top:0;left:0}.upload-source{margin-bottom:.75rem}.field{display:flex;flex-direction:column}.buttons{display:flex;flex-direction:column;gap:.5rem}.buttons button{color:#fff;background-color:#ffffff1a;border:none;border-radius:999px;height:40px;padding:8px}.buttons button:hover{cursor:pointer;background-color:#ffffff80}.input-color{display:flex;gap:.25rem;width:100%}.input-color input[type=color]{width:100%;height:1.75rem}.input-color button{height:1.75rem;padding:0}
