*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,Helvetica,sans-serif}html,body{width:100%;height:100%;overflow-y:scroll;overflow-x:hidden;scrollbar-width:none;-ms-overflow-style:none}body::-webkit-scrollbar{display:none}#app{width:100%;min-height:100dvh;display:flex;flex-direction:column;background-color:gray}.loading-screen{width:100%;height:100%;position:absolute;background-color:#999;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center}.loading-screen-content{width:max-content;max-width:320px;height:80dvh;max-height:600px;display:flex;flex-direction:column}.title-row{display:flex;align-items:center;gap:1rem;height:fit-content;padding-bottom:1.5rem}.loading-logo{width:6rem;height:6rem;border:none;outline:none;display:block}.title-column{display:flex;flex-direction:column;margin-left:auto}.title-span{display:flex;align-items:baseline;gap:.25rem}.title-column h1{padding-bottom:0;font-family:Times New Roman,Times,serif;font-size:1.3125rem;letter-spacing:1px;color:#171717}.title-column p{padding-bottom:.25rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:.875rem}.title-column .title-span p{padding-bottom:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;color:#353535;font-size:.75rem}.title-column .title-span{padding-bottom:.1rem}.title-column a{font-size:.875rem;color:#353535;text-decoration:solid underline rgb(53,53,53) 1px;text-underline-offset:.125rem}.notice-row{display:flex;align-items:baseline;gap:1rem;padding-bottom:1rem;width:100%;height:fit-content}.notice-decorator{font-size:.75rem;font-weight:400;font-variant:small-caps;letter-spacing:.0625rem;color:#171717;align-self:first baseline}.notice-text{padding-bottom:0;font-size:1rem}.viewport-canvas{display:block;width:100%;height:calc(100dvh - 8.8rem)}.scratch-container{width:100%;height:3.5rem;position:relative;display:flex;align-items:center;flex-direction:column}.scratch-row-0,.scratch-row-1{width:100%;height:100%;display:grid;grid-template-rows:1}.menu-container{width:100%;height:8.8rem;display:flex;flex-direction:column;position:relative}.visual-buffer{width:100vw;height:.8rem;background-color:gray}.picker-and-constraint-row{width:100%;height:3.5rem;display:flex;gap:.5rem;padding-top:.5rem;padding-left:.5rem;padding-right:.5rem}.color-picker-container{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;gap:.5rem}.timer-container{height:100%;width:1rem}.timer-track{position:relative;width:100%;height:100%;background-color:#4d4d4d;border-bottom:1px solid rgb(77,77,77);border-top:1px solid rgb(77,77,77);clip-path:url(#hourglass-clip)}.timer-progress{position:absolute;bottom:0;width:100%;background-color:#bbb}.button-container{width:100%;height:1.5rem;display:flex;align-items:center;gap:.25rem;padding-left:.5rem;padding-right:.5rem}.button-container button{height:1rem;flex-shrink:0;font-size:.75rem;font-weight:400;color:#171717;background-color:#bbb;border:0;padding-left:.25rem;padding-right:.25rem;display:flex;align-items:center;justify-content:center}.button-container button svg{width:100%;height:100%;max-width:.75rem;max-height:.75rem;pointer-events:none}.button-container .menu-button{width:3.5rem}.button-container .nav-button{width:2rem}.button-container .tool-button,.button-container .tool-attr-button{width:3rem}.menu-panel{width:100%;max-height:calc(100dvh - 1.5rem);overflow-y:auto;background:gray;padding:0rem .5rem .25rem;box-sizing:border-box;display:flex;flex-direction:column;font-size:.833rem}.menu-panel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.menu-panel-close{width:3.5rem;height:1rem;font-size:.833rem;background-color:#bbb;border:0;padding-left:.5rem;padding-right:.5rem;cursor:pointer}.menu-panel-body{flex:1;display:flex;flex-direction:column;gap:.5rem;overflow:auto;padding:.25rem .5rem .5rem}.start-session-button{padding:.25rem .5rem;border:none;background:#dcdcdc;border-radius:999px;cursor:pointer;flex-shrink:0;font-size:.75rem;font-weight:400;color:#171717}.save-file-button,.share-button,.end-session-button{height:1rem;flex-shrink:0;font-size:.75rem;font-weight:400;color:#171717;background-color:#bbb;border:0;padding-left:.5rem;padding-right:.5rem;cursor:pointer}.button-row{display:flex;gap:.25rem}.session-settings-section{padding:.5rem;background:#bbb}.session-settings-section h3{margin-bottom:.5rem;flex-shrink:0;font-size:.855rem;font-weight:400;color:#171717}.session-settings-form{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.5rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{font-weight:400;font-size:.75rem;padding-left:.5rem}.form-group label.radio-label{font-weight:400}.form-group select,.form-group input{padding:.5rem;border:1px solid black;font-size:.833rem}.constraint-inputs{flex-direction:row;align-items:center;padding-left:.5rem;gap:.75rem;height:1.5rem}.constraint-inputs label{font-weight:400;margin-right:.25rem}.constraint-inputs input{height:1.25rem;width:4rem;background-color:#dcdcdc;border:none}.radio-group{display:flex;gap:1rem;flex-wrap:wrap;padding-left:.5rem}.radio-label{display:flex;align-items:center;gap:.5rem;cursor:pointer}.radio-label input[type=radio]{cursor:pointer}.about-section{border:none;background:#bbb}.about-section summary{cursor:pointer;padding:.5rem;user-select:none}.about-content{padding:.25rem 1rem .5rem;line-height:1.6}.about-content p{margin-bottom:.5rem}.slider-label{font-size:.5rem;font-weight:700;max-height:.5rem;padding-right:.5rem}