@import url("https://fonts.googleapis.com/css?family=Lexend+Deca|Share+Tech+Mono&display=swap");@import url("https://fonts.googleapis.com/css?family=Lexend+Deca|Share+Tech+Mono&display=swap");@import url("https://fonts.googleapis.com/css?family=Lexend+Deca|Share+Tech+Mono&display=swap");@import url("https://fonts.googleapis.com/css?family=Lexend+Deca|Share+Tech+Mono&display=swap");@import url("https://fonts.googleapis.com/css?family=Lexend+Deca|Share+Tech+Mono&display=swap");@import url("https://fonts.googleapis.com/css?family=Lexend+Deca|Share+Tech+Mono&display=swap");@import url("https://fonts.googleapis.com/css?family=Lexend+Deca|Share+Tech+Mono&display=swap");@import url("https://fonts.googleapis.com/css?family=Lexend+Deca|Share+Tech+Mono&display=swap");@import url("https://fonts.googleapis.com/css?family=Lexend+Deca|Share+Tech+Mono&display=swap");@keyframes colorchange{from{background:red}15%{background:orange}30%{background:yellow}45%{background:green}60%{background:blue}75%{background:indigo}90%{background:violet}to{background:red}}@keyframes loadingSpinner{from{transform:rotateZ(0deg)}90%{transform:rotateZ(360deg)}to{transform:rotateZ(360deg)}}input[type="range"]{-webkit-appearance:none;color:#50c878;margin:4.45px 0;cursor:pointer;opacity:1;transition:opacity 0.2s;width:100%;background-color:transparent}input[type="range"].colortxtInput{color:#1b0758}input[type="range"]:focus{outline:none}input[type="range"]::-webkit-slider-runnable-track{width:100%;height:0.5rem;box-shadow:0px 0px 0px rgba(0,0,0,0),0px 0px 0px rgba(13,13,13,0);background:rgba(0,0,0,0.18);border-radius:1rem;border:0px solid rgba(0,1,1,0)}input[type="range"]::-webkit-slider-thumb{box-shadow:0px 0px 0px rgba(0,0,0,0),0px 0px 0px rgba(13,13,13,0);border:0px solid rgba(0,0,0,0);height:1rem;width:1rem;border-radius:2.5rem;background:currentColor;-webkit-appearance:none;margin-top:-4.45px}input[type="range"]:focus::-webkit-slider-runnable-track{background:rgba(13,13,13,0.18)}input[type="range"]::-moz-range-track{width:100%;height:0.5rem;box-shadow:0px 0px 0px rgba(0,0,0,0),0px 0px 0px rgba(13,13,13,0);background:rgba(0,0,0,0.18);border-radius:1rem;border:0px solid rgba(0,1,1,0)}input[type="range"]::-moz-range-thumb{box-shadow:0px 0px 0px rgba(0,0,0,0),0px 0px 0px rgba(13,13,13,0);border:0px solid rgba(0,0,0,0);height:1rem;width:1rem;border-radius:2.5rem;background:currentColor}input[type="range"]::-ms-track{width:100%;height:0.5rem;background:transparent;border-color:transparent;color:transparent}input[type="range"]::-ms-fill-lower{background:rgba(0,0,0,0.18);border:0px solid rgba(0,1,1,0);border-radius:3rem;box-shadow:0px 0px 0px rgba(0,0,0,0),0px 0px 0px rgba(13,13,13,0)}input[type="range"]::-ms-fill-upper{background:rgba(0,0,0,0.18);border:0px solid rgba(0,1,1,0);border-radius:3rem;box-shadow:0px 0px 0px rgba(0,0,0,0),0px 0px 0px rgba(13,13,13,0)}input[type="range"]::-ms-thumb{box-shadow:0px 0px 0px rgba(0,0,0,0),0px 0px 0px rgba(13,13,13,0);border:0px solid rgba(0,0,0,0);height:1rem;width:1rem;border-radius:2.5rem;background:currentColor;height:0.5rem}input[type="range"]:focus::-ms-fill-lower{background:rgba(0,0,0,0)}input[type="range"]:focus::-ms-fill-upper{background:rgba(13,13,13,0)}input[type="range"]:disabled{opacity:0.5;transition:opacity 0.2s;cursor:not-allowed !important}*{box-sizing:border-box;margin:0}:root{font-size:16px;width:100vw}@media (max-width: 1300px){font-size:12px}body::-webkit-scrollbar{display:none}#preloader{user-select:none;height:100vh;width:100vw;min-width:100vw;opacity:1;transition:opacity 0.5s;background-color:#030303;position:fixed;z-index:9999999;overflow:hidden;display:flex;justify-content:center;align-items:center;flex-direction:column}#preloader.hidden{opacity:0;transition:opacity 0.5s;pointer-events:none}#preloader .preloader-title{color:#eaeaea;font-family:"Lexend Deca",sans-serif;font-size:7rem}#preloader .colorbox-spinner{will-change:transform;height:6rem;width:6rem;border-radius:4pt;overflow:hidden;animation:loadingSpinner 1.5s infinite ease}#preloader .colorbox-spinner .colorbox{height:100%;width:100%;animation:colorchange 10s infinite ease}@media (max-width: 1300px){#preloader .preloader-title{font-size:4rem}#preloader .colorbox-spinner{height:4rem;width:4rem}}header{filter:invert(0);transition:filter 0.3s;width:100vw;display:flex;justify-content:center;position:fixed;top:0;right:0;font-family:"Lexend Deca",sans-serif;pointer-events:none;user-select:none;font-size:2rem;padding:2rem 5rem;z-index:9}header.invert{filter:invert(1);transition:filter 0.3s}body.dark header.invert{filter:invert(1)}@media (max-width: 1300px){header{padding:1rem 2rem;font-size:1.5rem}header span#randomizeReminder{display:none}}@media (max-width: 900px){header{padding:1rem;font-size:1.5rem}}header span#randomizeReminder{font-size:0.65em;color:#eaeaea}header span#randomizeReminder.hidden{opacity:0;transition:opacity 0.3s color 0.2s}header.black span#randomizeReminder{color:#030303;transition:opacity 0.3s color 0.2s}header b{height:100%;width:auto;flex-grow:1}header span{text-align:right;font-size:1em;display:flex;flex-direction:column;color:#eaeaea;transition:color 0.2s}header span span{font-size:0.5em;pointer-events:auto;cursor:pointer}@media (display-mode: standalone){header span span{display:none}}header.black span{color:#030303;transition:color 0.2s}body.dark header.invert.black,body.dark header.invert{filter:invert(0);transition:color 0.2s}body.dark header.invert.black span,body.dark header.invert span{color:#eaeaea}body header.invert.black,body header.invert{filter:invert(0);transition:color 0.2s}body header.invert.black span,body header.invert span{color:#030303}.update-container{width:100%;height:auto;position:fixed;display:flex;justify-content:flex-end;align-items:flex-end;bottom:0;left:0;z-index:5;pointer-events:none;user-select:none;padding:2rem 4rem}.update-container #updateMessage{font-size:1rem;opacity:0;transition:opacity 0.3s;background-color:#eaeaea;color:#030303;font-family:"Lexend Deca",sans-serif;border:1px solid rgba(80,200,120,0.7);border-radius:0.2rem;padding:0.5rem 1rem;cursor:pointer}@media (max-width: 1300px){.update-container #updateMessage{font-size:0.6em}}.update-container #updateMessage.visible{opacity:1;transition:opacity 0.3s;pointer-events:auto}@media (max-width: 1300px){.update-container #updateMessage{padding:0.25rem 0.5rem}}.update-container #updateMessage span#closeUpdateMessage{text-decoration:underline;margin-left:1rem;padding-left:1rem;border-left:1px solid rgba(77,80,87,0.4)}@media (max-width: 1300px){.update-container #updateMessage span#closeUpdateMessage{margin-left:0.25rem;padding-left:0.25rem}}@media (max-width: 1300px){.update-container{padding:1rem 0.2rem;font-size:1.5rem}}main #color-field{display:flex;flex-direction:row;background-color:#50c878;width:100%;height:auto;flex-grow:1;position:relative;padding:5rem}@media (max-width: 1300px){main #color-field{padding:5rem 2rem 2rem 2rem}}@media (max-width: 400px){main #color-field{padding:5rem 0.75rem 2rem 0.75rem}}main #color-field .color-info{width:auto;height:100%}main #color-field .color-info div{width:auto}main #color-field .color-previews{opacity:0;pointer-events:none;transition:opacity 0.3s;height:auto;flex-grow:1;width:100%;display:flex;flex-direction:row;justify-content:flex-end;align-items:flex-end}main #color-field .color-previews.visible{opacity:1;transition:opacity 0.3s;pointer-events:auto}main #color-field .color-previews .alt-shades-container{height:100%;flex-grow:1;display:flex;justify-content:center;align-items:center;padding:0 4rem}main #color-field .color-previews .alt-shades-container div{height:100%;flex-grow:1;display:flex;flex-direction:column;border:1px solid #eaeaea}main #color-field .color-previews .alt-shades-container div div{width:100%;flex-grow:1;display:flex;justify-content:center;align-items:center;border:none;font-family:"Share Tech Mono",monospace;cursor:pointer}main #color-field .color-previews .alt-shades-container div div.shade-pigment{background-color:#030303;transition:background-color 0.2s, color 0.3s;color:#eaeaea}main #color-field .color-previews .alt-shades-container div div.shade-pigment.blackText{color:#030303;transition:background-color 0.2s, color 0.3s}main #color-field .color-previews .alt-shades-container div div.shade-pigment+div{border-top:1px solid #eaeaea}main #color-field .color-previews .alt-shades-container .bg-shades-container{border-right:none}main #color-field .color-previews .alt-shades-container .bg-shades-container+.text-shades-container{border-left:1px solid #eaeaea}main #color-field .color-previews .small-box-container{display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-end}main #color-field .color-previews .small-box-container div{border-right:1px solid #eaeaea;border-left:1px solid #eaeaea;border-top:1px solid #eaeaea;height:8rem;width:8rem;display:flex;justify-content:center;align-items:center;font-family:"Share Tech Mono",monospace}main #color-field .color-previews .small-box-container div span{color:#eaeaea;mix-blend-mode:difference}main #color-field .color-previews .small-box-container div:nth-child(1){background-color:#1b0758}main #color-field .color-previews .small-box-container div:nth-child(2){background-color:#50c878}main #color-field .color-previews .small-box-container *+*{border-bottom:1px solid #eaeaea;border-right:1px solid #eaeaea}@media (max-width: 1300px){main #color-field .color-previews,main #color-field #showColorPreviews,main #color-field #showFancyColorNames{display:none}}main #color-field input{background:transparent;width:7ch;border:none;color:currentColor;font-family:"Share Tech Mono",monospace;outline:none}main #color-field .color-name{color:#1b0758;font-family:"Share Tech Mono",monospace;font-size:1rem}@media (max-width: 1300px){main #color-field .color-name{font-size:0.8rem}}@media (max-width: 900px){main #color-field .color-name{font-size:0.4rem}}main #color-field .color-name span+span{margin-left:2rem}main #color-field .color-name .color-picker{color:#1b0758}main #color-field .color-name span{font-size:1.25em;cursor:pointer;user-select:none}@media (max-width: 1300px){main #color-field .color-name span{font-size:1.4rem}}main #color-field .color-name span.active{text-decoration:underline}main #color-field .color-name span.inactive{opacity:0.5}main #color-field .color-name #hex-code{font-size:12em}main #color-field .color-name #rgb-code,main #color-field .color-name #hsl-code{font-size:1.5em;line-height:1.5}main #color-field .color-name #css-name{font-size:1.25em}@media (max-width: 1300px){main #color-field .color-name #css-name{font-size:1.5em}}@media (max-width: 900px){main #color-field .color-name #rgb-code,main #color-field .color-name #hsl-code,main #color-field .color-name #css-name{font-size:2.4em}}main #color-field #contrast-ratio{position:relative;font-family:"Share Tech Mono",monospace;font-size:1.25rem;line-height:1.56;margin-top:2rem;color:#1b0758}main #color-field .add-to-palette,main #color-field .open-settings{position:relative;font-size:1.25rem;line-height:1.56;margin-top:1rem;user-select:none}main #color-field .add-to-palette span,main #color-field .open-settings span{cursor:pointer}main #color-field #add-to-palette,main #color-field #open-settings{color:#1b0758;font-family:"Share Tech Mono",monospace;text-decoration:underline}main #color-field .open-settings{margin-top:auto}.palette-container .palette-bar{width:100%;min-height:4rem;height:4rem;transition:opacity 0.3s, height 0.3s;background-color:rgba(77,80,87,0);display:flex;position:relative}.palette-container .palette-bar.hide{height:0;opacity:0;transition:opacity 0.3s, height 0.3s}.palette-container .palette-bar.empty{background-color:rgba(77,80,87,0.2)}.palette-container .palette-bar .palette-controls{position:absolute;display:flex;font-size:1rem;top:-2rem;right:0}@media (max-width: 1300px){.palette-container .palette-bar .palette-controls{top:-4rem}}.palette-container .palette-bar .palette-controls *+*{margin-left:1rem}.palette-container .palette-bar .palette-controls span{font-family:"Share Tech Mono",monospace;color:#fff;mix-blend-mode:exclusion;cursor:pointer;text-decoration:underline;font-size:1.2rem;padding:0.5rem 0.25rem 0 0.25rem}.palette-container .palette-bar .palette-controls .palette-number{cursor:auto;text-decoration:none}@media (max-width: 1300px){.palette-container .palette-bar .palette-controls{font-size:1rem}.palette-container .palette-bar .palette-controls input,.palette-container .palette-bar .palette-controls span{font-size:1em}.palette-container .palette-bar .palette-controls *+*{margin-left:0}}@media (max-width: 1300px){.palette-container .palette-bar{flex-direction:column;height:auto}}.palette-container .palette-bar+.palette-bar{margin-top:3rem}@media (max-width: 1300px){.palette-container .palette-bar+.palette-bar{margin-top:5rem}}.palette-container .palette-pigment{cursor:pointer;display:flex;flex-grow:1;height:4rem;width:auto}.palette-container .palette-pigment div{color:#eaeaea;display:flex;justify-content:center;align-items:center;font-family:"Share Tech Mono",monospace;height:100%;flex-grow:1}.palette-container .palette-pigment div.blackText{color:#030303}.palette-container .palette-pigment div:nth-child(1){border-right:1px solid #eaeaea;border-radius:0.15rem 0 0 0.15rem}.palette-container .palette-pigment div:nth-child(2){border-radius:0 0.15rem 0.15rem 0}.palette-container .palette-pigment+.palette-pigment{margin-left:1rem}@media (max-width: 1300px){.palette-container .palette-pigment+.palette-pigment{margin-top:1rem;margin-left:0}}#paletteBarTemplate,#palettePigmentTemplate{display:none}footer{width:100%;height:auto;padding:2rem 5rem 5rem 5rem;position:relative;background-color:#eaeaea;color:#030303;transition:color 0.3s, background-color 0.3s}@media (max-width: 900px){footer{padding:2rem 2rem 5rem 2rem}}@media (max-width: 400px){footer{padding:2rem 1rem 5rem 1rem}}body.dark footer{background-color:#2a2a2a;color:#eaeaea;transition:color 0.3s, background-color 0.3s}footer #addNewPalette{cursor:pointer;font-size:1.25rem;margin-left:1rem;text-decoration:underline}footer h1,footer h2{font-family:"Lexend Deca",sans-serif;user-select:none;font-size:1.5em}footer h1{margin-bottom:0.5rem}footer h2{font-size:1.15em;margin-bottom:2rem}@media (max-width: 1300px){footer h2{margin-bottom:5rem}}footer #copiedNotification{opacity:0;transition:opacity 0.5s}footer #copiedNotification.copied{opacity:1;transition:opacity 0.1s}.alt-color-display{bottom:0;display:none;height:4rem;left:0;min-width:100vw;opacity:1;padding:1rem;pointer-events:none;position:fixed;transition:opacity 0.3s;z-index:3}.alt-color-display.hidden{opacity:0;transition:opacity 0.3s}.alt-color-display div{flex-grow:1;height:100%;width:auto}.alt-color-display #bg-color-alt-preview{background-color:#50c878;border-radius:1rem 0 0 1rem}.alt-color-display #text-color-alt-preview{background-color:#1b0758;border-radius:0 1rem 1rem 0}.alt-color-display div+div{border-left:1px solid #eaeaea}@media (max-width: 1300px){.alt-color-display{display:flex}}#modal-container{align-items:center;background-color:rgba(234,234,234,0);display:flex;justify-content:center;min-height:100vh;min-width:100vw;opacity:0;pointer-events:none;position:fixed;transition:opacity 0.3s, background-color 0.3s;z-index:50}#modal-container.fadeBg{transition:background-color 0.3s;background-color:rgba(234,234,234,0.5)}#modal-container.active{opacity:1;transition:opacity 0.3s;pointer-events:auto}#modal-container .settings-box{background-color:#eaeaea;border-radius:0.5rem;border:1px solid #030303;color:#030303;display:flex;flex-direction:column;font-family:"Lexend Deca",sans-serif;height:auto;justify-content:center;opacity:0;padding:1rem;pointer-events:none;position:absolute;transition:color 0.3s, background-color 0.3s opacity 0.3s;width:auto}#modal-container .settings-box.active{opacity:1;pointer-events:auto;transition:color 0.3s, background-color 0.3s opacity 0.3s}body.dark #modal-container .settings-box{color:#eaeaea;background-color:#2a2a2a;transition:color 0.3s, background-color 0.3s opacity 0.3s}#modal-container .settings-box .setting-bar+.setting-bar{margin-top:1.5rem}#modal-container .settings-box select{font-family:"Share Tech Mono",monospace;display:inline-block;width:auto;cursor:pointer;padding:0.25rem 0.5rem;outline:0;border:1px solid #50c878;border-radius:0.25rem;background-color:#d4d7d6;color:#4d5057;transition:color 0.3s, background-color 0.3s;appearance:none;-webkit-appearance:none;-moz-appearance:none}body.dark #modal-container .settings-box select{background-color:#4d5057;color:#eaeaea;transition:color 0.3s, background-color 0.3s}#modal-container .settings-box select::-ms-expand{display:none}#modal-container .settings-box select:hover,#modal-container .settings-box select:focus{color:#eaeaea;background:#4d5057}#modal-container .settings-box select:disabled{opacity:0.5;pointer-events:none}@media (max-width: 900px){#modal-container .settings-box select{font-size:0.8em;padding:0.15rem 0.25rem}}#modal-container .settings-box label+input{margin-top:1rem}#modal-container .settings-box span+span,#modal-container .settings-box span+select,#modal-container .settings-box select+span{margin-left:1rem}@media (max-width: 900px){#modal-container .settings-box{padding:2rem;font-size:0.9em}#modal-container .settings-box:nth-child(1) span:nth-of-type(1)::after{content:"\A";white-space:pre}#modal-container .settings-box span+span,#modal-container .settings-box span+select,#modal-container .settings-box select+span{margin-left:0}#modal-container .settings-box .setting-bar+.setting-bar{margin-top:1rem}}#modal-container .settings-box .setting-button{align-items:center;background-color:#50c878;border-radius:0.5rem;color:#030303;cursor:pointer;display:flex;font-family:"Lexend Deca",sans-serif;justify-content:center;margin-top:2rem;padding:0.5rem 1rem;transition:background-color 0.3s;width:100%;margin-top:0.5rem}#modal-container .settings-box .setting-button:hover{background-color:#37ae5f;transition:background-color 0.3s}#modal-container .settings-box .setting-button:nth-last-child(3){margin-top:4rem}#modal-container .message-box{bottom:0;left:0;position:fixed;width:100vw;display:flex;justify-content:flex-end;align-items:center;padding:1rem 2rem;opacity:0;transition:opacity 0.3s;pointer-events:none}#modal-container .message-box.active{transition:opacity 0.3s;pointer-events:auto;opacity:1}#modal-container .message-box.error .message-bar{border-left:0.25rem solid #ca1811}#modal-container .message-box .message-bar{background-color:#eaeaea;color:#030303;transition:background-color 0.3s, color 0.3s;display:flex;justify-content:center;align-items:center;padding:0.25rem 0.25rem 0.25rem 1rem;border-radius:0.25rem}body.dark #modal-container .message-box .message-bar{background-color:#030303;color:#eaeaea;transition:background-color 0.3s, color 0.3s}#modal-container .message-box .message-bar .message-inner{font-family:"Lexend Deca",sans-serif}#modal-container .message-box .message-bar #close-message{background-color:#50c878;color:#eaeaea;font-family:"Lexend Deca",sans-serif;padding:0.25rem 1rem;border-radius:0.25rem;cursor:pointer}#modal-container .message-box .message-bar #close-message:hover{background-color:#37ae5f;transition:background-color 0.3s}#modal-container .message-box .message-bar div+div{margin-left:1rem}#modal-container .export-box{background-color:#eaeaea;border-radius:0.5rem;border:1px solid #030303;color:#030303;display:flex;flex-direction:column;font-family:"Lexend Deca",sans-serif;height:auto;justify-content:center;opacity:0;padding:1rem;pointer-events:none;position:absolute;transition:color 0.3s, background-color 0.3s opacity 0.3s;width:auto;isolation:isolate;position:relative;pointer-events:none}#modal-container .export-box.active{opacity:1;pointer-events:auto;transition:color 0.3s, background-color 0.3s opacity 0.3s}body.dark #modal-container .export-box{color:#eaeaea;background-color:#2a2a2a;transition:color 0.3s, background-color 0.3s opacity 0.3s}#modal-container .export-box .select-export-type select{margin-left:0.5rem;font-family:"Share Tech Mono",monospace;display:inline-block;width:auto;cursor:pointer;padding:0.25rem 0.5rem;outline:0;border:1px solid #50c878;border-radius:0.25rem;background-color:#d4d7d6;color:#4d5057;transition:color 0.3s, background-color 0.3s;appearance:none;-webkit-appearance:none;-moz-appearance:none}body.dark #modal-container .export-box .select-export-type select{background-color:#4d5057;color:#eaeaea;transition:color 0.3s, background-color 0.3s}#modal-container .export-box .select-export-type select::-ms-expand{display:none}#modal-container .export-box .select-export-type select:hover,#modal-container .export-box .select-export-type select:focus{color:#eaeaea;background:#4d5057}#modal-container .export-box .select-export-type select:disabled{opacity:0.5;pointer-events:none}@media (max-width: 900px){#modal-container .export-box .select-export-type select{font-size:0.8em;padding:0.15rem 0.25rem}}#modal-container .export-box .export-item-container{border:1px solid #eaeaea;border-radius:0.15rem;margin-top:0.5rem}#modal-container .export-box.active{pointer-events:auto}#modal-container .export-box pre{align-items:center;background-color:#eaeaea;color:#030303;display:flex;justify-content:center;position:relative;transition:background-color 0.3s, color 0.3s}#modal-container .export-box pre:nth-child(1){z-index:3}#modal-container .export-box pre:nth-child(2){z-index:2}body.dark #modal-container .export-box pre{background-color:#4d5057;color:#eaeaea;transition:background-color 0.3s, color 0.3s}#modal-container .export-box pre.active{padding:2rem 4rem}@media (max-width: 1300px){#modal-container .export-box pre.active{padding:1rem 2rem;font-size:0.9em}}@media (max-width: 900px){#modal-container .export-box pre.active{padding:0.5rem 2rem;font-size:0.7em}}#modal-container .export-box figure{margin:0}#modal-container .export-box figure canvas{padding:0;position:relative;z-index:1;margin:0;height:32rem;width:60rem}@media (max-width: 900px){#modal-container .export-box figure canvas{height:70vh;width:270px}}#modal-container .export-box pre,#modal-container .export-box figure{opacity:0;height:0;width:0;padding:0;pointer-events:none}#modal-container .export-box pre.active,#modal-container .export-box figure.active{opacity:1;transition:background-color 0.3s, color 0.3s;pointer-events:auto;height:auto;width:auto}#modal-container .export-box:not(.active) pre,#modal-container .export-box:not(.active) figure{pointer-events:none}#modal-container .export-box #do-export,#modal-container .export-box #close-export{align-items:center;background-color:#50c878;border-radius:0.5rem;color:#030303;cursor:pointer;display:flex;font-family:"Lexend Deca",sans-serif;justify-content:center;margin-top:2rem;padding:0.5rem 1rem;transition:background-color 0.3s;width:100%}#modal-container .export-box #do-export:hover,#modal-container .export-box #close-export:hover{background-color:#37ae5f;transition:background-color 0.3s}#modal-container .export-box #close-export{margin-top:0.5rem}#color-controls{user-select:none;position:relative;padding:2rem 5rem 2rem 5rem;width:100%;height:auto;display:flex;flex-direction:column;background-color:#eaeaea;color:#030303;transition:color 0.3s, background-color 0.3s}@media (max-width: 1300px){#color-controls{padding:2rem 2rem 2rem 2rem}}@media (max-width: 900px){#color-controls{padding:1rem 2rem 2rem 2rem}}@media (max-width: 400px){#color-controls{padding:1rem 1rem 2rem 1rem}}#color-controls .control-button{align-items:center;background-color:#eaeaea;border-radius:0.15rem;border:1px solid rgba(77,80,87,0.3);color:#030303;cursor:pointer;display:flex;font-family:"Share Tech Mono",monospace;font-size:0.8em;justify-content:center;padding:0.5rem 1rem;pointer-events:auto}#color-controls .control-button:hover{background-color:#d4d7d6;transition:0.3s}body.dark #color-controls{background-color:#2a2a2a;color:#eaeaea;transition:color 0.3s, background-color 0.3s}#color-controls .background-picker+.text-picker{margin-left:4rem}#color-controls .lockColor{cursor:pointer}#color-controls>div.color-sliders{display:flex;flex-direction:row}@media (max-width: 1300px){#color-controls>div.color-sliders{flex-direction:column}}#color-controls .color-buttons{display:flex;margin-bottom:2rem}@media (max-width: 900px){#color-controls .color-buttons{flex-direction:column}}#color-controls .color-buttons div+div{margin-left:1rem}@media (max-width: 900px){#color-controls .color-buttons div+div{margin-left:0}}#color-controls .color-buttons div{height:2rem}#color-controls .color-buttons .swap-color-container{pointer-events:none}#color-controls .color-buttons .swap-color-container #swapColors:hover{background-color:#d4d7d6;transition:0.3s}#color-controls .color-buttons .randomize-controls{display:flex}@media (max-width: 900px){#color-controls .color-buttons .randomize-controls{margin:1rem 0;width:100%}}#color-controls .color-buttons .randomize-controls #undo{align-items:center;background-color:#eaeaea;border-radius:0.15rem 0 0 0.15rem;border:1px solid rgba(77,80,87,0.3);margin-right:0.15rem;padding:0.5rem;color:#030303;cursor:pointer;display:flex;font-family:"Share Tech Mono",monospace;font-size:0.8em;justify-content:center;pointer-events:auto}#color-controls .color-buttons .randomize-controls #redo{align-items:center;background-color:#eaeaea;border-radius:0 0.15rem 0.15rem 0;border:1px solid rgba(77,80,87,0.3);color:#030303;cursor:pointer;display:flex;font-family:"Share Tech Mono",monospace;font-size:0.8em;justify-content:center;margin-left:0.15rem;padding:0.5rem;pointer-events:auto;transition:0.3s}#color-controls .color-buttons .randomize-controls #undo.disabled,#color-controls .color-buttons .randomize-controls #redo.disabled{color:#959595;pointer-events:none}#color-controls .color-buttons .randomize-controls #randomize-mobile{align-items:center;background-color:#eaeaea;border-radius:0;border:1px solid rgba(77,80,87,0.3);color:#030303;cursor:pointer;display:flex;font-family:"Share Tech Mono",monospace;font-size:0.8em;justify-content:center;margin-left:0;padding:0.5rem 1rem;pointer-events:auto;flex-grow:1}#color-controls .color-buttons .randomize-controls div+div{margin-left:1rem}@media (max-width: 900px){#color-controls .color-buttons .randomize-controls div+div{margin-left:0.25rem}}#color-controls .share-buttons{position:absolute;width:100%;height:4rem;top:0;right:0;margin-top:-4rem;pointer-events:none;display:flex;justify-content:flex-end;align-items:center;padding:0 4rem 0 0}#color-controls .share-buttons div+div{margin-left:1rem}#color-controls .share-buttons div{pointer-events:auto}@media (max-width: 1300px){#color-controls .share-buttons{flex-direction:column;align-items:flex-end;padding:0 2rem 0.25rem 0;font-size:0.8em}#color-controls .share-buttons div+div{margin-top:0.15rem}}@media (max-width: 900px){#color-controls .share-buttons{flex-direction:column;align-items:flex-end;padding:0 0.25rem 0.25rem 0;font-size:0.8em}#color-controls .share-buttons div+div{margin-top:0.15rem}}#color-controls .background-picker,#color-controls .text-picker{width:auto;flex-grow:1}#color-controls .background-picker span,#color-controls .text-picker span{font-weight:bold;margin-bottom:0.5rem}#color-controls .background-picker h1,#color-controls .text-picker h1{font-family:"Lexend Deca",sans-serif;margin-bottom:1rem}@media (max-width: 900px){#color-controls .background-picker h1,#color-controls .text-picker h1{font-size:1.5em}}@media (max-width: 1300px){#color-controls{flex-direction:column}#color-controls .background-picker+.text-picker{margin-top:2rem;margin-left:0}}#color-controls .picker-group{align-items:center;display:flex;flex-direction:row;font-family:"Share Tech Mono",monospace;justify-content:center;padding:0.75rem 0}#color-controls .picker-group p{font-weight:bold}#color-controls .picker-group p span{font-weight:lighter}#color-controls .picker-group input{flex-grow:1;height:100%;margin-left:1rem;width:auto}body{color:#50c878;min-width:100vw;background-color:#eaeaea;overflow:hidden;height:auto;width:100vw;display:flex;flex-direction:column}body.scroll{overflow:auto;overflow-x:hidden}body main{position:relative;left:0;top:0;height:auto;width:100%;display:flex;justify-content:center;align-items:center;flex-direction:column;will-change:background-color}body #hiddenElements{height:0;width:0}body #hiddenElements *{height:0;width:0}