body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}body{overflow-y:scroll}input,select,button{box-sizing:border-box;max-width:100%;padding:.2em .5em}fieldset{border:none;margin:0;padding:0;display:contents}.App{background-color:#282c34;flex-direction:column;align-items:stretch;min-height:100vh;display:flex}.App>header,.App>article,.App>footer{color:#fff;text-align:center;margin:0 1em}.App>header a,.App>article a,.App>footer a{color:#fff}.App>main{flex:1;margin:1em}.App>article{align-self:center;max-width:720px;transition:all .5s}@media screen and (width>=700px){.App>article{opacity:.7}.App>article:hover{opacity:1}}.App>article h2>span{text-decoration:underline}.App>footer p{margin:2em 0}.Main{flex-wrap:wrap-reverse;justify-content:center;align-items:flex-end;gap:1em;display:flex}.Main>div{background-color:#fff;border-radius:5px}.Main>div:first-child{flex:0 504px;min-width:0;padding:1em;position:sticky;top:2em}.Main>div:nth-child(2){flex:350px;min-width:0;max-width:450px;padding:.2em 1em}.Canvas>div:first-child{border:2px solid #aaa;max-width:500px;min-height:150px;max-height:707px;margin-bottom:1em;overflow:auto}.Canvas input[type=number]{max-width:65px}.Canvas canvas{cursor:pointer;display:block}.Canvas canvas.scaled{max-height:inherit;max-width:100%}.DeviceSelector select{width:100%}.DeviceSelector small{color:#191970}.OptionsSelector h3{margin:.7em 0}.OptionsSelector p{margin:.5em 0}.OptionsSelector label>*{vertical-align:middle}.OptionsSelector input[type=checkbox]{margin:0}.OptionsSelector-Basic{table-layout:fixed;width:100%}.OptionsSelector-Basic label input[type=text],.OptionsSelector-Basic label input[type=number],.OptionsSelector-Basic label select,.OptionsSelector-Basic label button{width:100%}.OptionsSelector-All .react-tabs ul{text-align:center;flex-wrap:wrap;gap:3px 0;margin:0;padding:0;font-size:.9em;display:flex}.OptionsSelector-All .react-tabs ul:after{content:"";flex:9 0 auto}.OptionsSelector-All .react-tabs ul li{display:initial;cursor:pointer;flex:1 0 auto;padding:.4em .5em}.OptionsSelector-All .react-tabs ul li[aria-selected=true]{border:1px solid #333;border-bottom:none;border-top-left-radius:5px;border-top-right-radius:5px;text-decoration:underline}.OptionsSelector-All .react-tabs ul:after,.OptionsSelector-All .react-tabs ul li[aria-selected=false]{border:1px solid #0000;border-bottom-color:#333}.OptionsSelector-All label input[type=text],.OptionsSelector-All label input[type=number],.OptionsSelector-All label select,.OptionsSelector-All label button{min-width:70%;max-width:100%}.ImageList>div{margin-bottom:1em}.ImageList>div:first-child{margin-bottom:.2em}.ImageList-List{gap:5px;padding-bottom:.8em;display:flex;overflow-x:auto}.ImageList-List>div{text-align:center}.ImageList-List canvas{cursor:pointer;border:2px solid #aaa;display:block}
