@import url(https://fonts.googleapis.com/css2?family=Poppins&display=swap);@import url(https://fonts.googleapis.com/css2?family=Julius+Sans+One&display=swap);@import url(https://fonts.googleapis.com/css2?family=Satisfy&display=swap);@import url(https://fonts.googleapis.com/css2?family=Cinzel&display=swap);@import url(https://fonts.googleapis.com/css2?family=Indie+Flower&display=swap);@import url(https://fonts.googleapis.com/css2?family=Zilla+Slab&display=swap);body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace}.replayer-wrapper{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%) scale(.8);transform:translate(-50%,-50%) scale(.8);z-index:999}.replayer-wrapper:before{content:"";width:150%;height:150%;top:-12.5%;left:-12.5%;z-index:-1;background-color:#fff;position:fixed}.App{text-align:center}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{-webkit-animation:App-logo-spin 20s linear infinite;animation:App-logo-spin 20s linear infinite}}.hide-on-mobile.hide-on-mobile.hide-on-mobile{display:none}.show-on-mobile.show-on-mobile.show-on-mobile{display:block}.show-on-mobile-inline-block.show-on-mobile-inline-block.show-on-mobile-inline-block{display:inline-block}.hide-on-mobile-inline-block.hide-on-mobile-inline-block.hide-on-mobile-inline-block{display:none}.show-on-mobile-flex.show-on-mobile-flex.show-on-mobile-flex{display:flex}.hide-on-mobile-flex.hide-on-mobile-flex.hide-on-mobile-flex{display:none}.show-on-mobile-inline-flex.show-on-mobile-inline-flex.show-on-mobile-inline-flex{display:inline-flex}.hide-on-mobile-inline-flex.hide-on-mobile-inline-flex.hide-on-mobile-inline-flex{display:none}@media screen and (min-width:768px){.hide-on-mobile.hide-on-mobile.hide-on-mobile{display:block}.show-on-mobile-inline-block.show-on-mobile-inline-block.show-on-mobile-inline-block,.show-on-mobile.show-on-mobile.show-on-mobile{display:none}.hide-on-mobile-inline-block.hide-on-mobile-inline-block.hide-on-mobile-inline-block{display:inline-block}.show-on-mobile-flex.show-on-mobile-flex.show-on-mobile-flex{display:none}.hide-on-mobile-flex.hide-on-mobile-flex.hide-on-mobile-flex{display:flex}.show-on-mobile-inline-flex.show-on-mobile-inline-flex.show-on-mobile-inline-flex{display:none}.hide-on-mobile-inline-flex.hide-on-mobile-inline-flex.hide-on-mobile-inline-flex{display:inline-flex}}.App-header{background-color:#282c34;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:calc(10px + 2vmin);color:#fff}.App-link{color:#61dafb}@-webkit-keyframes App-logo-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes App-logo-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}#root,.App,body,canvas,html{height:100%;width:100%;left:0;overflow:hidden}.CodeMirror.CodeMirror{height:100%;font-size:18px;line-height:2;text-align:left}.CodeMirror-hints.CodeMirror-hints.CodeMirror-hints.CodeMirror-hints{font-size:16px;border-radius:0;background:#3b4d56;border:none;outline:none;box-shadow:2px 2px 6px hsla(0,0%,74.5%,.05),-2px -2px 6px hsla(0,0%,100%,.05);border-radius:8px!important;overflow:auto;padding:0}@media screen and (min-width:768px){.CodeMirror-hints.CodeMirror-hints.CodeMirror-hints.CodeMirror-hints{max-width:calc(50% - 80px)}}@media (min-width:992px){.CodeMirror-hints.CodeMirror-hints.CodeMirror-hints.CodeMirror-hints{max-width:calc(35% - 80px)}}.CodeMirror-hints.CodeMirror-hints.CodeMirror-hints.CodeMirror-hints .CodeMirror-hint{white-space:normal;padding:8px;font-size:16px;border-radius:0;border-radius:8px!important;background:none;outline:none;color:#eff;box-sizing:border-box;transition:all .15s;border:1px solid transparent}.CodeMirror-hints.CodeMirror-hints.CodeMirror-hints.CodeMirror-hints .CodeMirror-hint-active{background:hsla(0,0%,100%,.1)}.CodeMirror-hints.CodeMirror-hints.CodeMirror-hints.CodeMirror-hints .CodeMirror-hint.docs.docs{background:rgba(0,0,0,.2);border:1px solid #61dafb;border-radius:8px!important}.CodeMirror-hints.CodeMirror-hints.CodeMirror-hints.CodeMirror-hints .CodeMirror-hint_description{margin-top:.2em;opacity:.7}.App{display:flex;justify-content:stretch;flex-direction:column;width:100%;height:100%}.App,.button{box-sizing:border-box}.button{width:auto;line-height:1.5;display:inline-block;border-radius:8px;border-radius:6px;background-color:#ff5370;background-color:#e6e6e6;background-color:#455b66;background-color:#0288d1;padding:8px 16px;color:#fff;text-align:center;font-weight:700;font-size:.8rem;transition:all .15s;cursor:pointer;opacity:1}.button:hover{background-color:#5a7684;background-color:#0278b8}.button--clear{color:#455b66;color:#e6e6e6;color:#fff;background:none}.button--clear:hover{opacity:.7;background:none}.button--clear--dark{color:#0288d1}.toolbar{flex-direction:row;width:100%;height:70px;background-color:#304047;color:#eff;flex:0 0 auto;display:flex;justify-content:space-between;align-content:center;padding:3px 20px}.toolbar,.toolbar>*{box-sizing:border-box}.toolbar>*{margin-top:auto;margin-bottom:auto}.toolbar .brand{font-size:22px;display:inline-block;color:#fff}.toolbar .button.button.button{margin-left:30px;font-size:18px}.toolbar .docs-view-options{display:flex;flex-direction:row;align-items:center}.toolbar .docs-view-options span{font-weight:700}.toolbar .docs-view-options>div .button.button,.toolbar .docs-view-options>span .button.button{line-height:1;display:flex;flex-direction:row;align-items:center;padding:8px 12px;margin:0 6px}.toolbar .docs-view-options .button-group{display:flex;flex-direction:row;align-items:center;margin-left:10px;overflow:hidden}.toolbar .docs-view-options .button-group .button.active{background:#1c2429;border-radius:10px}.panels{min-height:0;width:100%;display:flex;flex:1 1 auto;justify-content:stretch;flex-direction:column}@media screen and (min-width:768px){.panels{flex-direction:row}}.editor-pane,.render-pane{flex:1 0 auto;height:50%;width:100%;position:relative}@media screen and (min-width:768px){.editor-pane,.render-pane{height:100%;width:50%}}@media (min-width:992px){.editor-pane,.render-pane{height:100%;width:35%}}.render-pane{flex:1.5 0 auto;height:50%;width:100%;order:-1;display:flex;flex-direction:column}@media screen and (min-width:768px){.render-pane{height:100%;width:50%;order:0}}@media (min-width:992px){.render-pane{height:100%;width:65%}}.graph-editor,.graph-render,.react-codemirror2{width:100%;height:100%;position:relative}.graph-render{flex:1 1 auto;height:10px;position:relative}.graph-render>div{position:absolute!important;top:0;left:0;height:100%!important}.editor-pane{display:flex;flex-direction:column}.editor-pane .docs{flex:1 0 auto;width:100%;height:40%}.editor-pane .graph-editor{flex:1 0 auto;height:60%}.status-notice{width:auto;max-width:calc(100% - 60px);line-height:1.5;max-height:20%;box-sizing:border-box;overflow:auto;display:inline-block;position:absolute;bottom:20px;right:25px;border-radius:10px;background-color:#28a745;padding:10px;color:#fff;z-index:99;text-align:left;font-weight:700}.status-notice.error{background-color:#dc3545}.snapshots{flex:0 0 auto;width:100%;display:flex;justify-content:space-between;flex-direction:row;height:70px;overflow:auto}@media screen and (min-width:768px){.snapshots{height:150px}}.snapshots_frame{min-width:70px;width:70px;height:70px;display:flex;justify-content:center;align-items:center;padding:10px;box-sizing:border-box}@media screen and (min-width:768px){.snapshots_frame{width:150px;height:150px;min-width:100px}}.snapshots_frame_image{flex:1 1 auto;margin:auto;width:100%}#hidden-headless-graph{position:absolute;visibility:hidden;top:120%;right:120%;width:150px;height:150px}#hidden-headless-video-graph{position:absolute;top:120%;right:120%;width:1500px;height:1500px}.playback-controls{padding:10px 5px;display:flex;align-items:center}@media screen and (min-width:768px){.playback-controls{padding:20px}}.playback-controls_playpause{flex:0 0 auto;padding:0 20px}.playback-controls_playpause .player{width:20px;height:20px}.playback-controls_track{flex:1 1 auto;display:flex;justify-content:space-between;position:relative}.playback-controls_track:before{content:"";position:absolute;top:50%;left:0;width:100%;height:3px;margin-top:-1px;background:#000}.playback-controls_track_tick{height:20px;flex:1 1 auto;position:relative}.playback-controls_track_tick:after{content:"";position:absolute;left:50%;top:0;height:20px;width:3px;background:#000;margin-left:-1px}.playback-controls_track_tick:first-child{flex:0.5 2 auto}.playback-controls_track_tick:first-child:after{margin-left:0;left:0}.playback-controls_track_tick--last{flex:0.5 2 auto}.playback-controls_track_tick--last:after{left:auto;right:0;margin-left:0}.playback-controls_track_tick--status{position:absolute;top:100%;margin-top:5px;width:25px;height:25px;-webkit-transform:translate3d(-50%,0,0);transform:translate3d(-50%,0,0);margin-left:1px}.playback-controls_track_tick--status svg{width:100%;height:100%;fill:#000}.playback-controls_position{flex:0 0 auto;padding:0 20px;font-weight:700;font-size:18px;letter-spacing:2px}button{outline:none;border:none;box-shadow:none;text-shadow:none}.fullscreen-menu{position:absolute;bottom:100%;left:0;width:100%;height:100%;transition:all .25s;opacity:1;z-index:999;box-sizing:border-box;background:#263238;overflow-x:hidden}.fullscreen-menu.open{bottom:0}.fullscreen-menu .close-button{position:absolute;right:.5rem;top:1rem;color:#fff;font-size:36px;box-sizing:border-box}.fullscreen-menu .background-text{color:#fff;font-size:180px;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);font-weight:700;opacity:.07;z-index:-1;box-sizing:border-box}.fullscreen-menu ul{display:flex;flex-direction:column;list-style:none;justify-content:space-around;align-items:center;width:100%;height:100%;flex-wrap:nowrap;margin:0;padding:10px;box-sizing:border-box}.fullscreen-menu ul li{flex:0 0 auto;text-align:center;margin:0;padding:.5rem 0;position:relative;box-sizing:border-box}.fullscreen-menu ul li div{font-size:21px;line-height:1.5;color:#d6d6d6}.modal{top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);border-radius:12px;max-width:80%;max-height:80%;background:#fff;border:1px solid rgba(0,0,0,.3);box-shadow:0 3px 7px rgba(0,0,0,.3);-webkit-background-clip:padding-box;-moz-background-clip:padding-box;background-clip:padding-box;overflow:auto}.modal,.modal-backdrop{position:absolute;z-index:9999}.modal-backdrop{top:0;left:0;width:100%;height:100%;background:#000;opacity:.4}.welcome-modal{display:flex;flex-direction:column;width:80%}.welcome-modal.small{width:600px;max-width:90%;padding:0 2rem}.welcome-modal .close{position:absolute;right:40px;top:40px;z-index:9999;cursor:pointer}.welcome-modal .header{flex:0 0 auto;margin-top:50px}.welcome-modal .header:last-child{margin-bottom:50px}.welcome-modal .header .title{margin:0}.welcome-modal .header p{opacity:.8;max-width:600px;margin:15px auto 0;line-height:1.5}.welcome-modal .template-gallery{flex:1 0 auto;display:flex;flex-wrap:wrap;padding:40px;flex-direction:row;align-content:flex-start}.welcome-modal .template-gallery .template{box-sizing:border-box;position:relative;padding:20px;cursor:pointer;flex:0 0 auto;width:100%;margin-bottom:20px}.welcome-modal .template-gallery .template:before{content:"";position:absolute;top:10px;left:10px;right:10px;bottom:10px;border:2px solid #f5f5f5;border-radius:12px;box-sizing:border-box}@media screen and (min-width:768px){.welcome-modal .template-gallery .template{width:50%}}@media screen and (min-width:1100px){.welcome-modal .template-gallery .template{width:25%}}.welcome-modal .template-gallery .template_image{display:block;width:100%;height:auto}.welcome-modal .template-gallery .template_name{margin:10px 0;display:block;font-size:18px;font-size:16px;font-weight:700;opacity:.7}.share-modal{display:flex;flex-direction:column;width:80%}.share-modal .embed.url_wrapper{margin-top:10px}.share-modal .embed-options{margin-top:10px;display:flex;flex-direction:row;flex-wrap:wrap}.share-modal .embed-options .container{width:50%;display:block;position:relative;margin-bottom:12px;cursor:pointer;text-align:left;-webkit-user-select:none;-ms-user-select:none;user-select:none;display:flex;flex-direction:row;align-items:center}.share-modal .embed-options .label_inner{flex:1 1;padding-left:10px;display:block;box-sizing:border-box;opacity:.6}.share-modal .embed-options .checkmark{order:-1}.share-modal .embed-options .container input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.share-modal .embed-options .checkmark{height:16px;width:16px;background-color:#eee;border-radius:3px;position:relative}.share-modal .embed-options .container:hover input~.checkmark{background-color:#ccc}.share-modal .embed-options .container input:checked~.checkmark{background-color:#2196f3}.share-modal .embed-options .checkmark:after{content:"";position:absolute;display:none}.share-modal .embed-options .container input:checked~.checkmark:after{display:block}.share-modal .embed-options .container input:checked~.label_inner{opacity:1}.share-modal .embed-options .container .checkmark:after{top:50%;left:50%;width:4px;height:8px;border:solid #fff;border-width:0 2px 2px 0;-webkit-transform:translate(-50%,-50%) rotate(45deg);transform:translate(-50%,-50%) rotate(45deg);margin-top:-1.5px}.share-modal .url_wrapper{flex:1 1 auto;max-width:500px;border-radius:8px;padding:8px;display:flex;align-items:center;min-width:0;background-color:#f1f1f1}.share-modal .url_wrapper.embed .url_inner{background:none}.share-modal .url_inner{flex:1 1 auto;min-width:0;padding:4px;font-weight:700;opacity:.5;line-height:1;margin:0;outline:none;border:none}.share-modal .url_copy{box-sizing:border-box;margin-left:5px;flex:0 0 auto;background:#0288d1;color:#fff;height:27px;padding:0 16px;vertical-align:middle}.share-modal .close{position:absolute;right:40px;top:40px;z-index:9999;cursor:pointer}.share-modal .header{flex:0 0 auto;margin-top:30px;padding:0 30px;justify-content:space-between;align-items:center}@media screen and (min-width:768px){.share-modal .header{display:flex}}.share-modal .header .title{margin:0;flex:0 0 auto;padding-right:20px}.share-modal .share-options{margin-top:30px;border-top:2px solid #f0f0f0;box-sizing:border-box;display:flex;flex-direction:column}@media screen and (min-width:768px){.share-modal .share-options{flex-direction:row}}.share-modal .share-options .share{padding:40px 20px;box-sizing:border-box;cursor:pointer;width:0;width:100%;flex:0 1;border-top:1px solid #f0f0f0;border-bottom:1px solid #f0f0f0}@media screen and (min-width:768px){.share-modal .share-options .share{flex:1 1 auto;border:1px solid #f0f0f0;border-top:none;border-bottom:none}}.share-modal .share-options .share:first-child{border-left:none;border-top:none}.share-modal .share-options .share:right-child{border-right:none;border-bottom:none}.share-modal .share-options .share_image{width:60%;height:auto;opacity:.15;transition:all .15s;max-width:200px}.share-modal .share-options .share:hover .share_image{opacity:.3}.share-modal .share-options .share_name{font-weight:700;opacity:.8;line-height:1.5;white-space:normal;margin:20px 0 0}.sketch-window{flex:0 1 auto;border-bottom:3px solid #263238}.sketch-window img{max-width:100%;max-height:40vh;height:auto;width:auto}.draw-window{flex:1 1 auto;height:10px;border-bottom:3px solid #263238}.sketch-to-code .graph-render,.sketch-to-code .sketch-window{position:relative}.sketch-to-code .graph-render:before,.sketch-to-code .sketch-window:before{position:absolute;top:1rem;left:1rem;z-index:99;color:#263238;font-size:1.4rem;font-weight:700}.sketch-to-code .sketch-window:before{content:"Goal:"}.sketch-to-code .graph-render:before{content:"Your Visualization:"}.editor-title{color:#263238;font-size:1.4rem;font-weight:700;background-color:#263238;color:#c4d0d6;margin:0;padding:1rem;text-align:left}.instructions-panel{text-align:left;padding:1rem;line-height:1.5;background-color:coral;background-color:#e9967a}.player-wrapper{position:relative;padding-top:56.25%}.react-player{position:absolute;top:0;left:0}.trial-instructions{text-align:left}.trial-instructions ul{list-style:none;padding-left:20px}.trial-instructions ul input{margin-right:10px}.trial-instructions ul li{margin-top:5px}.trial-instructions h4{margin-bottom:1rem;padding:0 20px}.comprehension-questions{text-align:left;overflow:auto;height:100%;position:absolute;top:0;left:0;width:100%}.comprehension-questions .question{padding:1rem;margin:1rem 0 2rem;font-size:1.4rem;line-height:1.5}.comprehension-questions .question input{display:block;margin-top:.5rem;font-size:1.4rem;width:100%;max-width:700px;border:1px solid #d3d3d3;padding:.4rem;border-radius:4px}.likert{flex-direction:row}.likert,.likert .inputs{display:flex;align-items:flex-end;justify-content:space-between}.likert .inputs{flex-direction:row;flex:1 0 auto;padding:0 2rem}.likert .bound{width:130px;display:block}.likert .bound.left{text-align:left}.likert .bound.right{text-align:right}.likert label{display:flex;flex-direction:column;flex:0 0 auto;align-items:center;font-weight:700}.likert-group{margin:1rem 0 5rem}.likert-group .explain-prompt,.likert-group_prompt{text-align:left;margin:2rem 0 .5rem;font-weight:700}.likert-group_prompt{font-size:1.3rem;margin-bottom:2rem}.likert-group textarea{display:block;margin-top:.5rem;font-size:1.1rem;line-height:1.5;border:1px solid #d3d3d3;padding:.4rem;border-radius:4px;width:100%;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif}.instructions-panel input[type=checkbox]{display:none}.instructions-panel .lbl-toggle{cursor:pointer}.instructions-panel .lbl-toggle:before{content:" ";display:inline-block;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:5px solid;vertical-align:middle;margin-right:.7rem;-webkit-transform:translateY(-2px);transform:translateY(-2px);transition:-webkit-transform .2s ease-out;transition:transform .2s ease-out;transition:transform .2s ease-out,-webkit-transform .2s ease-out}.instructions-panel .toggle:checked+.lbl-toggle:before{-webkit-transform:rotate(90deg) translateX(-3px);transform:rotate(90deg) translateX(-3px)}.instructions-panel .collapsible-content{max-height:0;overflow:hidden;transition:max-height .25s ease-in-out}.instructions-panel .toggle:checked+.lbl-toggle+.collapsible-content{max-height:350px}.instructions-panel .toggle:checked+.lbl-toggle{border-bottom-right-radius:0;border-bottom-left-radius:0}.instructions-panel .collapsible-content .content-inner{background:rgba(0,105,255,.2);border-bottom:1px solid rgba(0,105,255,.45);border-bottom-left-radius:7px;border-bottom-right-radius:7px;padding:.5rem 1rem}.instructions-panel .collapsible-content p{margin-bottom:0}.consent-info{text-align:left;padding-top:2rem}.consent-row{display:flex}.consent-row .consent-button{margin:0 10px;flex:1 1;background:#f1f1f1;background-color:rgba(0,0,0,.05);color:#000;font-size:1.1rem;padding:1rem}.consent-row .consent-button:first-child{margin-left:0}.consent-row .consent-button:last-child{margin-right:0}.consent-row .consent-button:hover{background-color:rgba(0,0,0,.15)}@media print{.docs *,.docs :after,.docs :before{background:transparent!important;color:#000!important;box-shadow:none!important;text-shadow:none!important}.docs a,.docs a:visited{text-decoration:underline}.docs a[href]:after{content:" (" attr(href) ")"}.docs abbr[title]:after{content:" (" attr(title) ")"}.docs a[href^="#"]:after,.docs a[href^="javascript:"]:after{content:""}.docs blockquote,.docs pre{border:1px solid #999;page-break-inside:avoid}.docs thead{display:table-header-group}.docs img,.docs tr{page-break-inside:avoid}.docs img{max-width:100%!important}.docs h2,.docs h3,.docs p{orphans:3;widows:3}.docs h2,.docs h3{page-break-after:avoid}}.docs html{font-size:12px}@media screen and (min-width:32rem) and (max-width:48rem){.docs html{font-size:15px}}@media screen and (min-width:48rem){.docs html{font-size:16px}}.docs body{line-height:1.85}.docs .air-p,.docs p{font-size:1rem;margin-bottom:1.3rem}.docs .air-h1,.docs .air-h2,.docs .air-h3,.docs .air-h4,.docs h1,.docs h2,.docs h3,.docs h4{margin:1.414rem 0 .5rem;font-weight:inherit;line-height:1.42}.docs .air-h1,.docs h1{margin-top:0;font-size:1.49967rem}.docs .air-h2,.docs h2{font-size:1.3045rem}.docs .air-h3,.docs h3{font-size:1.1665rem}.docs .air-h4,.docs h4{font-size:1.069rem}.docs .air-h5,.docs h5{font-size:1.02017rem}.docs .air-h6,.docs h6{font-size:.88rem}.docs .air-small,.docs small{font-size:.707em}.docs canvas,.docs iframe,.docs img,.docs select,.docs svg,.docs textarea,.docs video{max-width:100%}.docs img{height:200px;margin:0 auto;width:200px;width:100%;height:auto}.docs a,.docs a:visited{color:#3498db}.docs a:active,.docs a:focus,.docs a:hover{color:#2980b9}.docs pre{background-color:#fafafa;text-align:left}.docs pre .pre-inner{padding:1rem}.docs blockquote{margin:0;border-left:5px solid #7a7a7a;font-style:italic;padding:1.33em;text-align:left}.docs li,.docs ol,.docs ul{text-align:left}.docs p{color:#777}.docs{box-sizing:border-box;border:10px solid #263238;border-top:none;position:relative}.docs h1,.docs h2,.docs h3,.docs h4,.docs h5,.docs h6,.docs p{text-align:left}.docs p{line-height:1.5}.docs-container{position:absolute;top:0;left:0;background:#fff;overflow:hidden;z-index:5;padding-top:calc(2.5rem + 10px)}.docs-container,.docs-wrapper{box-sizing:border-box;width:100%;height:100%}.docs-wrapper{padding:1.5rem;overflow:auto}.docs-wrapper:after{content:"";position:relative;width:100%;height:1rem;display:block}.docs.floating-right{border:none;position:absolute;border-radius:8px;top:calc(1.5rem + 70px);margin:0;bottom:1.5rem;right:1.5rem;background:#fff;z-index:99;width:calc(100% - 3rem);max-width:400px;box-shadow:3px 3px 5px 6px hsla(0,0%,80%,.3)}.docs .docs-code-copy{text-align:right;margin-top:4px;margin-bottom:20px;padding-right:10px;transition:all .15s;opacity:.85;font-size:1em;color:#0288d1;font-weight:700}.docs .docs-code-copy:hover{opacity:1;cursor:pointer}.docs .breadcrumbs{position:absolute;top:1.5rem;top:0;left:0;right:0;padding:1rem 0 1rem 1.5rem;z-index:9;overflow:auto;z-index:5}.docs .breadcrumbs,.docs .breadcrumbs-wrapper{list-style:none;margin:0;box-sizing:border-box}.docs .breadcrumbs-wrapper{z-index:9;padding:0;width:100%;height:100%;white-space:nowrap}.docs .breadcrumbs-wrapper:after{content:" ";position:relative;width:1.5rem;display:inline-block}.docs .breadcrumbs li{display:inline-block;margin:0 0 0 20px;cursor:pointer;font-style:.9em;font-weight:700;opacity:.4;transition:all .15s;padding-left:20px;position:relative}.docs .breadcrumbs li:first-child{margin-left:0}.docs .breadcrumbs li:last-child{color:#0288d1;opacity:1}.docs .breadcrumbs li:last-child:hover{opacity:1}.docs .breadcrumbs li:last-child:before{color:#0288d1;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="%230288d1" stroke="%230288d1" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-play"><polygon points="5 3 19 12 5 21 5 3"></polygon></svg>');background-size:contain}.docs .breadcrumbs li:hover{opacity:.6}.docs .breadcrumbs li:before{content:"";width:10px;height:10px;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-play"><polygon points="5 3 19 12 5 21 5 3"></polygon></svg>');background-size:contain;position:absolute;left:0;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.docs-page{width:100%;min-height:100%;padding-bottom:1rem}.docs-page img{width:100%;width:70%;height:auto}.docs-page .subtitle{text-transform:uppercase;opacity:.5;font-weight:700;font-size:.8rem;margin:0 0 20px}.docs-page .title{font-size:2rem}.docs-home h2{margin-top:40px;padding-bottom:10px;margin-bottom:20px;position:relative}.docs-home h2:first-of-type{margin-top:20px}.docs-home h2:after{content:"";background:#000;position:absolute;bottom:0;left:0;right:0;opacity:.1;height:1px}.docs-home ul{list-style:none;padding:0;margin:0 0 40px}.docs-home li{cursor:pointer;margin:10px 0;padding:0 0 0 20px;position:relative;opacity:.8;transition:all .15s}.docs-home li:before{content:"";width:10px;height:10px;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-play"><polygon points="5 3 19 12 5 21 5 3"></polygon></svg>');background-size:contain;position:absolute;left:0;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);transition:all .15s}.docs-home li:hover{opacity:1}.docs-home li:hover:before{-webkit-transform:translate(3px,-50%);transform:translate(3px,-50%)}.highlighted-code{border-radius:4px;overflow:hidden}.highlighted-code .CodeMirror-lines{padding:4px 20px 4px 15px}code{font-family:monospace;color:#000;direction:ltr;font-size:1.2em;background-color:#263238;color:#eff;font-weight:700;padding:0 6px;border-radius:2px}.reactour{line-height:1.4;padding:36px}.reactour span[data-tour-elem=badge]{font-size:1.2rem}.reactour__mask--disable-interaction{stroke:red;stroke-width:4px;rx:6px;ry:6px;display:block;fill:none}.draw-panel{position:absolute;top:0;bottom:0;left:0;padding-left:20px;padding-right:20px;right:auto;display:flex}.draw-panel .brush-row,.draw-panel .button-row,.draw-panel .color-row{flex:1 1 auto;padding:30px 0}.draw-panel,.draw-panel .brush-colors,.draw-panel .brush-row,.draw-panel .brush-sizes,.draw-panel .button-row,.draw-panel .color-row{flex-direction:column}.Draw .edit-wrapper .text-tools-input-wrapper.text-tools-input-wrapper,.text-tools-input-wrapper.text-tools-input-wrapper.text-tools-input-wrapper{left:80px;right:80px;width:auto;background-color:none;background:none}.Draw{width:100%;height:100%;--side-padding:30px}.Draw .button-row.button-row{margin-bottom:0}.Draw .Card.Card.Card{padding-top:20px;padding-bottom:20px;max-width:600px;margin:0 auto}.Draw .video-wrapper{width:100%;height:100%;background-size:cover}.Draw .video-overlay{background-color:#000;opacity:0;transition:all .15s}.Draw .edit-wrapper,.Draw .video-overlay{width:100%;height:100%;position:absolute;left:0;top:0;overflow:hidden}.Draw .edit-wrapper:after,.Draw .edit-wrapper:before{content:"";position:absolute;left:0;width:100%;z-index:1}.Draw .edit-wrapper:before{top:0;background:transparent linear-gradient(0deg,hsla(0,0%,50.2%,0),var(--unnamed-color-000000)) 0 0 no-repeat padding-box;opacity:.5;height:calc(130px + var(--ion-safe-area-top))}.Draw .edit-wrapper:after{bottom:0;background:transparent linear-gradient(180deg,hsla(0,0%,50.2%,0),var(--unnamed-color-000000)) 0 0 no-repeat padding-box;opacity:.5;height:calc(130px + var(--ion-safe-area-bottom))}.Draw .edit-wrapper .canvas,.Draw .edit-wrapper .element-container{width:100%;height:100%;position:relative;z-index:5}.Draw .edit-wrapper .drawing-tools,.Draw .edit-wrapper .edit-tools,.Draw .edit-wrapper .text-tools{position:absolute;bottom:0;left:20px;right:20px;z-index:10;padding:0 var(--side-padding) calc(var(--ion-safe-area-bottom) + 20px);-webkit-transform:translateY(100%);transform:translateY(100%);transition:all .1s ease-in-out;transition-delay:0s}.Draw .edit-wrapper .drawing-tools.visible,.Draw .edit-wrapper .edit-tools.visible,.Draw .edit-wrapper .text-tools.visible{-webkit-transform:translate(0);transform:translate(0);transition-delay:.15s}.Draw .edit-wrapper .drawing-tools ion-icon,.Draw .edit-wrapper .edit-tools ion-icon,.Draw .edit-wrapper .text-tools ion-icon{flex:0 0 auto;font-size:24px}.Draw .edit-wrapper .brush-row,.Draw .edit-wrapper .color-row,.Draw .edit-wrapper .font-row{display:flex;align-items:center}.Draw .edit-wrapper .brush-row ion-icon,.Draw .edit-wrapper .color-row ion-icon,.Draw .edit-wrapper .font-row ion-icon{margin-right:25px}.Draw .edit-wrapper .color-row{margin-top:20px}.Draw .edit-wrapper .brush-colors{flex:1 1 auto;display:flex;justify-content:space-between}.Draw .edit-wrapper .brush-colors .color{width:20px;height:20px;border-radius:50%;border:2px solid #000;border:2px solid var(--brush-color,#000);box-sizing:border-box;transition:all .1s ease-in-out;position:relative}.Draw .edit-wrapper .brush-colors .color:after{content:"";transition:all .1s ease-in-out;position:absolute;top:0;left:0;width:100%;height:100%;background:#000;background:var(--brush-color,#000);-webkit-transform:scale(1);transform:scale(1);border-radius:50%}.Draw .edit-wrapper .brush-colors .color.selected:after{-webkit-transform:scale(.7);transform:scale(.7)}.Draw .edit-wrapper .brush-sizes{flex:1 1 auto;display:flex;justify-content:space-between;align-items:center}.Draw .edit-wrapper .brush-sizes .size{width:calc(var(--size)*1px);height:calc(var(--size)*1px);border-radius:50%;border:2px solid #000;border:2px solid var(--brush-color,#000);box-sizing:border-box;transition:all .1s ease-in-out;position:relative}.Draw .edit-wrapper .brush-sizes .size:after{content:"";transition:all .1s ease-in-out;position:absolute;top:0;left:0;width:100%;height:100%;background:#000;background:var(--brush-color,#000);-webkit-transform:scale(1);transform:scale(1);border-radius:50%}.Draw .edit-wrapper .brush-sizes .size.selected:after{-webkit-transform:scale(.7);transform:scale(.7)}.Draw .edit-wrapper .button-row{display:flex;justify-content:space-between}.Draw .edit-wrapper .text-tools-input{caret-color:#3acce1;caret-color:var(--brush-color,#3acce1);width:100%;display:block;font-size:20px;line-height:1;color:#000;color:var(--brush-color,#000);font-family:"Poppins";font-family:var(--font,"Poppins")}.Draw .edit-wrapper .text-tools-input-wrapper{background-color:rgba(0,0,0,.1);padding:10px 0;text-align:center;position:absolute;top:50%;left:0;width:100%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.Draw .edit-wrapper .text-fonts{display:flex;align-items:center;margin-right:calc(var(--side-padding)*-1);white-space:nowrap;overflow:visible;overflow-x:scroll;height:40px;-ms-overflow-style:none;scrollbar-width:none;-webkit-overflow-scrolling:touch}.Draw .edit-wrapper .text-fonts::-webkit-scrollbar{display:none}.Draw .edit-wrapper .text-fonts .font{flex:0 0 auto;margin-right:25px;font-size:20px;line-height:1;color:#000;color:var(--brush-color,#000);font-family:"Poppins";font-family:var(--font,"Poppins")}.Draw .edit-wrapper .text-fonts .font:last-child{padding-right:var(--side-padding)}.Draw .edit-wrapper .text-fonts .font:not(.selected){opacity:.5}.Draw .edit-wrapper .text-element{position:absolute;top:0;left:0;color:#000;color:var(--brush-color,#000);font-family:"Poppins";font-family:var(--font,"Poppins");-webkit-transform:scale(var(--el-scale),var(--el-scale));transform:scale(var(--el-scale),var(--el-scale))}.DrawCanvas{width:100%;height:100%}.DrawCanvas .canvas-container,.DrawCanvas .upper-canvase,.DrawCanvas>div{width:100%!important;height:100%!important}
/*# sourceMappingURL=main.0cbd41d3.chunk.css.map */