html,body{margin:0;padding:0;font-family:Ubuntu,sans-serif;font-weight:300;overflow:hidden}html *,body *{box-sizing:border-box;text-decoration:none}html * a:visited,body * a:visited{color:#000}:root{--grid-size:20px;--grid-color:#0003}@font-face{font-display:swap;font-family:Ubuntu;src:url(/assets/Ubuntu-Regular-D14tH6yt.ttf)format("truetype");font-weight:400;font-style:normal}@font-face{font-display:swap;font-family:Ubuntu;src:url(/assets/Ubuntu-Italic-BxSEJX07.ttf)format("truetype");font-weight:400;font-style:italic}@font-face{font-display:swap;font-family:Ubuntu;src:url(/assets/Ubuntu-Bold-BGoo8i9Y.ttf)format("truetype");font-weight:700;font-style:normal}@font-face{font-display:swap;font-family:Ubuntu;src:url(/assets/Ubuntu-BoldItalic-DiND6kz9.ttf)format("truetype");font-weight:700;font-style:italic}@font-face{font-display:swap;font-family:Ubuntu;src:url(/assets/Ubuntu-Light-DlXMI-yU.ttf)format("truetype");font-weight:300;font-style:normal}@font-face{font-display:swap;font-family:Ubuntu;src:url(/assets/Ubuntu-LightItalic-BBGxubWq.ttf)format("truetype");font-weight:300;font-style:italic}@font-face{font-display:swap;font-family:Ubuntu;src:url(/assets/Ubuntu-Medium-C-1-7KOl.ttf)format("truetype");font-weight:500;font-style:normal}@font-face{font-display:swap;font-family:Ubuntu;src:url(/assets/Ubuntu-MediumItalic-Cp5nc9PY.ttf)format("truetype");font-weight:500;font-style:italic}body{width:100vw;height:100vh}.nodes text{pointer-events:none}.container{background-image:linear-gradient(to right, var(--grid-color) 1px, transparent 1px), linear-gradient(to bottom, var(--grid-color) 1px, transparent 1px);background-color:#fff;background-size:var(--grid-size) var(--grid-size);background-repeat:repeat;flex-direction:column;width:100%;height:100%;display:flex}.container *{-webkit-user-select:none;user-select:none}.container .main{flex-direction:column;flex:1;display:flex}.container .main .settings{flex-direction:column;gap:10px;padding:10px;display:flex}#canvas{z-index:10;width:100%;height:100%;position:relative}#canvas canvas{-webkit-user-select:none;user-select:none;width:100%;height:100%;position:fixed;top:0;left:0}#canvas #face-canvas{z-index:11}#canvas #edge-canvas{z-index:12}#canvas #node-canvas{z-index:13}#canvas #main-canvas{z-index:14}footer{justify-content:space-between;align-items:center;width:100%;padding:5px;display:flex;position:absolute;bottom:0}footer div:first-child{pointer-events:none;color:#cf8c00}footer div:first-child span{color:#009e9e}footer .color{z-index:12}.header{z-index:20;background-color:#f4f4f4;justify-content:space-between;align-items:center;display:flex}.header a{padding:2px 5px 2px 2px}.header a img{width:25px;transition:transform .2s ease-in-out}.header a:hover img{transform:scale(1.1)}.header a:active img{transform:scale(.9)}#menu-bar{border-bottom:1px solid #ddd;margin:0;padding:0}#menu-bar>ul{margin:0;padding:0;list-style-type:none;display:flex}#menu-bar>ul hr{opacity:.5;width:90%}#menu-bar>ul li *{cursor:pointer}#menu-bar>ul>li{padding:5px 10px;position:relative}#menu-bar>ul>li:hover{background-color:#e0e0e0}#menu-bar>ul>li:hover>ul{display:block}#menu-bar>ul>li>ul{z-index:20;background-color:#fff;border:1px solid #ddd;min-width:250px;margin:0;padding:5px;list-style-type:none;display:none;position:absolute;top:100%;left:0}#menu-bar>ul>li>ul li{justify-content:space-between;align-items:center;padding:5px;display:flex;position:relative}#menu-bar>ul>li>ul li span:nth-child(2){color:#646464}#menu-bar>ul>li>ul li>ul{z-index:20;background-color:#fff;border:1px solid #ddd;min-width:200px;margin:0;padding:5px;list-style-type:none;display:none;position:absolute;top:40%;left:70%}#menu-bar>ul>li>ul li>ul li{justify-content:space-between;align-items:center;gap:20px;display:flex}#menu-bar>ul>li>ul li>ul li div{justify-content:end;gap:5px;min-width:135px;display:flex}#menu-bar>ul>li>ul li>ul li div input[type=number]{width:45px}#menu-bar>ul>li>ul li>ul li label{white-space:nowrap;justify-content:space-between;align-items:center;gap:5px;display:flex}#menu-bar>ul>li>ul li>ul li label a{color:gray;border-radius:50%;justify-content:center;align-items:center;height:16px;padding:4px;font-size:12px;font-weight:700;display:flex}#menu-bar>ul>li>ul li>ul li label a:hover{cursor:help}#menu-bar>ul>li>ul li:hover{background-color:#f4f4f4}#menu-bar>ul>li>ul li:hover ul{display:block}#menu-bar>ul>li>ul #panel-btn{justify-content:space-between;align-items:center;display:flex}.border{border:1px solid gray}#floating-panel{z-index:16;background-color:#ffffff80;border:1px solid #ddd;border-radius:5px;flex-direction:column;width:200px;min-height:400px;max-height:90%;font-family:Arial,sans-serif;font-size:14px;transition:width .5s ease-in-out,height .5s ease-in-out,left .5s ease-in-out,top .5s ease-in-out,background-color .5s ease-in-out;display:flex;position:fixed;top:35px;left:calc(100vw - 220px);box-shadow:0 4px 6px #0000001a}#floating-panel.MAX{background-color:#ffffffe6;width:90vw;height:90vh;top:35px;left:20px}#floating-panel #info{-webkit-user-select:none;user-select:none;touch-action:none;background-color:#ffff9680;justify-content:space-between;align-items:center;width:100%;margin:0;padding:10px;display:flex;top:0}#floating-panel #info .cm{justify-content:center;align-items:center;gap:5px;display:flex}#floating-panel #info .cm .max:hover{color:green;cursor:pointer}#floating-panel #info .cm .close:hover{color:red;cursor:pointer}#floating-panel .body-info{scrollbar-width:thin;cursor:text;padding:10px;overflow:auto}#floating-panel .body-info h4{margin:0 0 10px}#floating-panel .body-info div{padding:1px}#floating-panel .body-info hr{opacity:.5;margin:10px}#graphs-panel,#face-panel{z-index:16;background-color:#ffffff80;border:1px solid #ddd;border-radius:5px;flex-direction:column;width:200px;min-height:400px;max-height:50%;font-family:Arial,sans-serif;font-size:14px;transition:width .5s ease-in-out,height .5s ease-in-out,left .5s ease-in-out,top .5s ease-in-out,background-color .5s ease-in-out;display:flex;position:fixed;left:calc(100vw - 220px);box-shadow:0 4px 6px #0000001a}#graphs-panel.MAX,#face-panel.MAX{background-color:#ffffffe6;width:90vw;height:90vh;top:35px;left:20px}#graphs-panel #graphs,#graphs-panel #faces,#face-panel #graphs,#face-panel #faces{-webkit-user-select:none;user-select:none;touch-action:none;background-color:#ffff9680;justify-content:space-between;align-items:center;width:100%;margin:0;padding:10px;display:flex;top:0}#graphs-panel #graphs .cm,#graphs-panel #faces .cm,#face-panel #graphs .cm,#face-panel #faces .cm{justify-content:center;align-items:center;gap:5px;display:flex}#graphs-panel #graphs .cm .max:hover,#graphs-panel #faces .cm .max:hover,#face-panel #graphs .cm .max:hover,#face-panel #faces .cm .max:hover{color:green;cursor:pointer}#graphs-panel #graphs .cm .close:hover,#graphs-panel #faces .cm .close:hover,#face-panel #graphs .cm .close:hover,#face-panel #faces .cm .close:hover{color:red;cursor:pointer}#graphs-panel .body-graphs,#face-panel .body-graphs{scrollbar-width:thin;cursor:pointer;-webkit-user-select:none;user-select:none;overflow:auto}#graphs-panel .body-graphs ul,#face-panel .body-graphs ul{padding-left:20px;list-style-type:none}#graphs-panel .body-graphs ul li,#face-panel .body-graphs ul li{border-radius:0 5px 5px 0;width:90%;margin:3px 3px 3px 10px;padding:5px 0 5px 5px;font-size:16px;font-weight:700;display:block;position:relative}#graphs-panel .body-graphs ul li:hover,#face-panel .body-graphs ul li:hover{background-color:#4682b480;color:#f2f2f2!important}#graphs-panel .body-graphs ul li.select,#face-panel .body-graphs ul li.select{background-color:#4682b4bf;color:#fff!important}#graphs-panel .body-graphs ul li:not(:first-child):before,#face-panel .body-graphs ul li:not(:first-child):before{content:"";border:0 solid #bebebe;border-width:0 0 2px 2px;width:10px;height:28px;display:block;position:absolute;top:-13px;left:-15px}#graphs-panel .body-graphs ul li:nth-of-type(2):before,#face-panel .body-graphs ul li:nth-of-type(2):before{height:18px;top:-5px}#graphs-panel .body-graphs ul li:first-of-type,#face-panel .body-graphs ul li:first-of-type{color:#005000;margin:3px 3px 5px -20px}#graphs-panel{top:300px}#face-panel{top:600px}#face-panel .body-faces{scrollbar-width:thin;cursor:pointer;-webkit-user-select:none;user-select:none;overflow:auto}#face-panel .body-faces ul{padding-left:10px;list-style-type:none}#face-panel .body-faces ul li{border-radius:5px;width:90%;margin:5px;padding:5px;font-size:18px;font-weight:700;display:block;position:relative}#face-panel .body-faces ul li:hover{background-color:#46b45580;color:#f2f2f2!important}#face-panel .body-faces ul li.select{background-color:#46b455bf;color:#fff!important}#custom-context-menu{z-index:20;background:#fff;border:1px solid gray;padding:5px;position:fixed}#custom-context-menu *{-webkit-user-select:none;user-select:none}#custom-context-menu ul{z-index:20;background-color:#fff;border:1px solid #ddd;min-width:200px;margin:0;padding:0;list-style-type:none}#custom-context-menu ul hr{opacity:.5;width:90%}#custom-context-menu ul li{cursor:pointer;border-radius:50px;justify-content:space-between;align-items:center;padding:5px;display:flex}#custom-context-menu ul li span:nth-child(2){color:#646464}#custom-context-menu ul li:hover{background-color:#f4f4f4}.modal{z-index:20;justify-content:center;align-items:center;width:100vw;height:100vh;display:none;position:fixed;top:0;left:0}.modal *{-webkit-user-select:none;user-select:none;font-size:18px}.help-panel{background-color:#ffffffb3;width:350px;padding:15px;display:none;box-shadow:0 0 10px #00000080}.help-panel .help-title{text-align:center;padding:5px;font-weight:700}.help-panel hr{width:50%}.help-panel .help-content{width:100%;padding:5px}.help-panel .help-content .help-table{width:100%}.help-panel .help-content .help-table tr{justify-content:space-between;align-items:center;width:100%;padding:3px;display:flex}.help-panel .help-content .help-table tr .key{font-weight:700}#tools-panel{z-index:15;background-color:#ffffff80;border:1px solid #ddd;border-radius:5px;flex-direction:column;width:70px;font-family:Arial,sans-serif;font-size:14px;display:flex;position:fixed;top:35px;left:5px;box-shadow:0 4px 6px #0000001a}#tools-panel #tools{-webkit-user-select:none;user-select:none;touch-action:none;background-color:#ffff9680;justify-content:space-between;align-items:center;width:100%;margin:0;padding:5px;display:flex;top:0}#tools-panel #tools .close:hover{color:red;cursor:pointer}#tools-panel .body-tools{flex-direction:column;justify-content:center;align-items:center;padding:10px;display:flex}#tools-panel .body-tools *{-webkit-user-select:none;user-select:none}#tools-panel .body-tools hr{opacity:.7;width:100%}#tools-panel .body-tools div{padding:5px}#tools-panel .body-tools .scale,#tools-panel .body-tools .tree,#tools-panel .body-tools .force,#tools-panel .body-tools .panning,#tools-panel .body-tools .select,#tools-panel .body-tools .component,#tools-panel .body-tools .color-picker,#tools-panel .body-tools .color-0{cursor:pointer}#tools-panel .body-tools .scale img,#tools-panel .body-tools .tree img,#tools-panel .body-tools .force img,#tools-panel .body-tools .panning img,#tools-panel .body-tools .select img,#tools-panel .body-tools .component img,#tools-panel .body-tools .color-picker img,#tools-panel .body-tools .color-0 img{width:50px;height:50px;transition:transform .2s ease-in-out}#tools-panel .body-tools .scale:hover img,#tools-panel .body-tools .tree:hover img,#tools-panel .body-tools .force:hover img,#tools-panel .body-tools .panning:hover img,#tools-panel .body-tools .select:hover img,#tools-panel .body-tools .component:hover img,#tools-panel .body-tools .color-picker:hover img,#tools-panel .body-tools .color-0:hover img{transform:scale(1.1)}#tools-panel .body-tools .scale:active img,#tools-panel .body-tools .tree:active img,#tools-panel .body-tools .force:active img,#tools-panel .body-tools .panning:active img,#tools-panel .body-tools .select:active img,#tools-panel .body-tools .component:active img,#tools-panel .body-tools .color-picker:active img,#tools-panel .body-tools .color-0:active img{transform:scale(.9)}#tools-panel .body-tools #color{justify-content:center;align-items:center;width:50px;height:50px;margin:0;padding:0;display:flex}#tools-panel .body-tools #color:hover>div{transform:translateX(var(--hover-x));opacity:1}#tools-panel .body-tools #color:hover>div label{display:block}#tools-panel .body-tools #color>div{background-color:#ffffffb3;flex-direction:column;justify-content:center;align-items:center;padding:3px;transition:transform .3s;display:flex;position:absolute}#tools-panel .body-tools #color>div label{display:none}#tools-panel .body-tools #color>div div{border:none;justify-content:center;align-items:center;width:45px;height:45px;display:flex;cursor:pointer!important}#tools-panel .body-tools #color>div div button{width:30px;height:30px;border:1px solid #0002!important}#tools-panel .body-tools #color .color-0{z-index:10;--hover-x:0px;cursor:pointer;background-color:#fff0}#tools-panel .body-tools #color .color-0 img{width:50px;height:50px}#tools-panel .body-tools #color .color-1{opacity:0;z-index:1;--hover-x:50px}#tools-panel .body-tools #color .color-2{opacity:0;z-index:2;--hover-x:100px}#tools-panel .body-tools #color .color-3{opacity:0;z-index:3;--hover-x:150px}#tools-panel .body-tools #color .color-4{opacity:0;z-index:4;--hover-x:200px}#tools-panel .body-tools #color .color-5{opacity:0;z-index:5;--hover-x:250px}#tools-panel .body-tools #color .color-6{opacity:0;z-index:6;--hover-x:300px}#tools-panel .body-tools #color .color-7{opacity:0;z-index:7;--hover-x:350px}.modal-chord{z-index:17;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.modal-chord *{-webkit-user-select:none;user-select:none;font-size:18px}.shortcut-chord,.shortcut-chord-fake{color:#fff;border-radius:5px;min-width:250px;max-height:90%;margin:10px;padding:10px;position:absolute;bottom:0;right:0}.shortcut-chord .header,.shortcut-chord-fake .header{justify-content:center;min-width:40px;height:20px;padding-bottom:5px;display:flex;position:absolute;top:0;left:20px}.shortcut-chord ul,.shortcut-chord-fake ul{border-radius:5px;flex-direction:column;justify-content:start;align-items:start;gap:10px;margin:0;padding:10px;font-weight:400;list-style-type:none;display:flex}.shortcut-chord ul li,.shortcut-chord-fake ul li{display:flex}.shortcut-chord ul li .title,.shortcut-chord-fake ul li .title{color:#fff;width:15px}.shortcut-chord ul li .arrow,.shortcut-chord-fake ul li .arrow{width:30px;font-size:20px}.shortcut-chord ul li .desc,.shortcut-chord-fake ul li .desc{color:#d3b37b}.shortcut-chord-fake{z-index:19}.shortcut-chord-fake .header{background-color:#1f1f2800}.shortcut-chord-fake ul{border:1px solid #0000}.shortcut-chord{z-index:18;opacity:.85;background-color:#1f1f28}.shortcut-chord .header{background-color:#1f1f28}.shortcut-chord ul{border:1px solid gray}.shortcut-chord ul li{opacity:0}.modal-input{z-index:20;justify-content:center;align-items:center;width:100vw;height:100vh;display:none;position:fixed;top:0;left:0}.modal-input *{-webkit-user-select:none;user-select:none;font-size:18px}.input-chord{color:#fff;opacity:.85;background-color:#1f1f28;border-radius:5px;min-width:250px;max-height:90%;margin:10px;padding:12px;display:flex;position:relative}.input-chord .header{background-color:#1f1f28;justify-content:center;min-width:40px;height:20px;padding:5px;font-size:16px;display:flex;position:absolute;top:2px;left:20px}.input-chord input{color:#fff;background-color:#1f1f2800;border:1px solid #fff;padding:15px;font-size:20px}.grid-hidden{background-image:none!important}.hidden{opacity:0!important}.gray-background{opacity:.5}.rect{fill:#add8e6;stroke:#000;stroke-dasharray:2;opacity:.2}.handle{fill:#fff;stroke:#000;stroke-width:1.5px;cursor:pointer;opacity:.7}.pickr{position:relative;overflow:visible;transform:translateY(0)}.pickr *{box-sizing:border-box;-webkit-appearance:none;border:none;outline:none}.pickr .pcr-button{cursor:pointer;background:url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\" stroke=\"%2342445A\" stroke-width=\"5px\" stroke-linecap=\"round\"><path d=\"M45,45L5,5\"></path><path d=\"M45,5L5,45\"></path></svg>") 50%/0 no-repeat;border-radius:.15em;width:2em;height:2em;padding:.5em;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;transition:all .3s;position:relative}.pickr .pcr-button:before{content:"";z-index:-1;width:100%;height:100%;z-index:initial;background:url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>") 0 0/.5em;border-radius:.15em;position:absolute;top:0;left:0}.pickr .pcr-button:after{content:"";background:var(--pcr-color);border-radius:.15em;width:100%;height:100%;transition:background .3s;position:absolute;top:0;left:0}.pickr .pcr-button.clear{background-size:70%}.pickr .pcr-button.clear:before{opacity:0}.pickr .pcr-button.clear:focus{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px var(--pcr-color)}.pickr .pcr-button.disabled{cursor:not-allowed}.pickr *,.pcr-app *{box-sizing:border-box;-webkit-appearance:none;border:none;outline:none}.pickr input:focus,.pickr input.pcr-active,.pickr button:focus,.pickr button.pcr-active,.pcr-app input:focus,.pcr-app input.pcr-active,.pcr-app button:focus,.pcr-app button.pcr-active{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px var(--pcr-color)}.pickr .pcr-palette,.pickr .pcr-slider,.pcr-app .pcr-palette,.pcr-app .pcr-slider{transition:box-shadow .3s}.pickr .pcr-palette:focus,.pickr .pcr-slider:focus,.pcr-app .pcr-palette:focus,.pcr-app .pcr-slider:focus{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px #00000040}.pcr-app{z-index:10000;opacity:0;visibility:hidden;background:#fff;border-radius:.1em;flex-direction:column;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;transition:opacity .3s,visibility 0s .3s;display:flex;position:fixed;top:0;left:0;box-shadow:0 .15em 1.5em #0000001a,0 0 1em #00000008}.pcr-app.visible{visibility:visible;opacity:1;transition:opacity .3s}.pcr-app .pcr-swatches{flex-wrap:wrap;margin-top:.75em;display:flex}.pcr-app .pcr-swatches.pcr-last{margin:0}@supports (display:grid){.pcr-app .pcr-swatches{grid-template-columns:repeat(auto-fit,1.75em);align-items:center;display:grid}}.pcr-app .pcr-swatches>button{cursor:pointer;z-index:1;background:0 0;border-radius:.15em;flex-shrink:0;justify-self:center;width:calc(1.75em - 5px);height:calc(1.75em - 5px);margin:2.5px;font-size:1em;transition:all .15s;position:relative;overflow:hidden}.pcr-app .pcr-swatches>button:before{content:"";z-index:-1;background:url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>") 0 0/6px;border-radius:.15em;width:100%;height:100%;position:absolute;top:0;left:0}.pcr-app .pcr-swatches>button:after{content:"";background:var(--pcr-color);box-sizing:border-box;border:1px solid #0000000d;border-radius:.15em;width:100%;height:100%;position:absolute;top:0;left:0}.pcr-app .pcr-swatches>button:hover{filter:brightness(1.05)}.pcr-app .pcr-swatches>button:not(.pcr-active){box-shadow:none}.pcr-app .pcr-interaction{flex-wrap:wrap;align-items:center;margin:0 -.2em;display:flex}.pcr-app .pcr-interaction>*{margin:0 .2em}.pcr-app .pcr-interaction input{letter-spacing:.07em;text-align:center;cursor:pointer;color:#75797e;background:#f1f3f4;border-radius:.15em;margin-top:.75em;padding:.45em .5em;font-size:.75em;transition:all .15s}.pcr-app .pcr-interaction input:hover{filter:brightness(.975)}.pcr-app .pcr-interaction input:focus{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px #4285f4bf}.pcr-app .pcr-interaction .pcr-result{color:#75797e;text-align:left;cursor:text;background:#f1f3f4;border-radius:.15em;flex:8em;min-width:8em;transition:all .2s}.pcr-app .pcr-interaction .pcr-result::selection{color:#fff;background:#4285f4}.pcr-app .pcr-interaction .pcr-type.active{color:#fff;background:#4285f4}.pcr-app .pcr-interaction .pcr-save,.pcr-app .pcr-interaction .pcr-cancel,.pcr-app .pcr-interaction .pcr-clear{color:#fff;width:auto}.pcr-app .pcr-interaction .pcr-save:hover,.pcr-app .pcr-interaction .pcr-cancel:hover,.pcr-app .pcr-interaction .pcr-clear:hover{filter:brightness(.925)}.pcr-app .pcr-interaction .pcr-save{background:#4285f4}.pcr-app .pcr-interaction .pcr-clear,.pcr-app .pcr-interaction .pcr-cancel{background:#f44250}.pcr-app .pcr-interaction .pcr-clear:focus,.pcr-app .pcr-interaction .pcr-cancel:focus{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px #f44250bf}.pcr-app .pcr-selection .pcr-picker{-webkit-user-select:none;user-select:none;border:2px solid #fff;border-radius:100%;width:18px;height:18px;position:absolute}.pcr-app .pcr-selection .pcr-color-palette,.pcr-app .pcr-selection .pcr-color-chooser,.pcr-app .pcr-selection .pcr-color-opacity{-webkit-user-select:none;user-select:none;cursor:grab;cursor:-webkit-grab;flex-direction:column;display:flex;position:relative}.pcr-app .pcr-selection .pcr-color-palette:active,.pcr-app .pcr-selection .pcr-color-chooser:active,.pcr-app .pcr-selection .pcr-color-opacity:active{cursor:grabbing;cursor:-webkit-grabbing}.pcr-app[data-theme=nano]{width:14.25em;max-width:95vw}.pcr-app[data-theme=nano] .pcr-swatches{margin-top:.6em;padding:0 .6em}.pcr-app[data-theme=nano] .pcr-interaction{padding:0 .6em .6em}.pcr-app[data-theme=nano] .pcr-selection{grid-gap:.6em;grid-template-rows:5fr auto auto;grid-template-columns:1fr 4fr;align-self:flex-start;align-items:center;width:100%;height:10.5em;display:grid}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-preview{flex-direction:row;grid-area:2/1/4/1;justify-content:center;width:100%;height:100%;margin-left:.6em;display:flex}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-preview .pcr-last-color{display:none}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-preview .pcr-current-color{background:var(--pcr-color);border-radius:50em;width:2em;height:2em;position:relative;overflow:hidden}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-preview .pcr-current-color:before{content:"";z-index:-1;background:url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>") 0 0/.5em;border-radius:.15em;width:100%;height:100%;position:absolute;top:0;left:0}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-palette{z-index:1;grid-area:1/1/2/3;width:100%;height:100%}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-palette .pcr-palette{border-radius:.15em;width:100%;height:100%}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-palette .pcr-palette:before{content:"";z-index:-1;background:url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>") 0 0/.5em;border-radius:.15em;width:100%;height:100%;position:absolute;top:0;left:0}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-chooser{grid-area:2/2/2/2}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-opacity{grid-area:3/2/3/2}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-chooser,.pcr-app[data-theme=nano] .pcr-selection .pcr-color-opacity{height:.5em;margin:0 .6em}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-chooser .pcr-picker,.pcr-app[data-theme=nano] .pcr-selection .pcr-color-opacity .pcr-picker{top:50%;transform:translateY(-50%)}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-chooser .pcr-slider,.pcr-app[data-theme=nano] .pcr-selection .pcr-color-opacity .pcr-slider{border-radius:50em;flex-grow:1}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-chooser .pcr-slider{background:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.pcr-app[data-theme=nano] .pcr-selection .pcr-color-opacity .pcr-slider{background:linear-gradient(90deg,#0000,#000) 0 0/100%,url("data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>") 0 0/.25em}
