:root{color-scheme:light;--surface:#fff;--g50:#fafafa;--g100:#f2f2f2;--g150:#e6e6e6;--g200:#d9d9d9;--g300:#bfbfbf;--g400:#a6a6a6;--g500:#8c8c8c;--g600:#737373;--g700:#595959;--g800:#404040;--g900:#262626;--g999:#0d0d0d;--harmonyCover:#ffffff00;--super600:#ffba1f;--super500:#ffda1f;--super500-alt:#fbac23;--super100:#f8e6fe;--warning-bg:#ff971f1c;--warning-text:#e27a03;--contrastFail:#f3f3f3;--contrastA:#d03e3e;--contrastAA:#408321;--contrastAAA:#408321;--red:#d03e3e;--red16:#d03e3e16;--red24:#d03e3e24;--green500:#408321;--dmred500:#ff4754;--surface25:#ffffff40;--surface50:#ffffff80;--surface75:#ffffffec;--surface90:#ffffffe6;--laminate-blur:blur(4px) brightness(110%);--laminate-border:2px solid hsla(0,0%,100%,.12);--br4:4px;--br8:8px;--br16:16px;--br24:24px;--br48:48px;--sidenav-width:200px;--sidenav-width-collapsed:64px;--sidenav-mobile-height:64px;--saved-palette-height:298px;--animate-normal:300ms cubic-bezier(0,0,0,1) all;--animate-slow:400ms cubic-bezier(0,0,0,1) all;--animate-super-slow:1000ms cubic-bezier(0,0,0,1) all;--animate-fast:200ms cubic-bezier(0,0,0,1) all;--animate-super-fast:100ms cubic-bezier(0,0,0,1) all;--animate-sliderThumb:300ms cubic-bezier(0,0,0,1) outline;--animate-bounce:300ms cubic-bezier(0.2,0,0.13,2) all;--box-shaddow:2px 4px 12px rgba(0,0,0,.08);--box-shaddow-s:0px 8px 16px 0px #00000016;--box-shaddow-xs:0px 8px 24px 0px #00000008;--box-shaddow-color-card:0px 24px 24px 8px #00000012;--box-shaddow-palette-feature:0px 48px 48px 8px #00000012;--box-shaddow-botom-sheet:24px -8px 48px 0px #00000012;--feed-width:1200px;--update-width:800px;--explore-controls-width:288px;--breakpoint-mobile:478px;--breakpoint-tablet:768px;--breakpoint-desktop:1200px;--hue-slider-bg:linear-gradient(90deg,#ff1f1f,#ffb41f,#b4ff1f,#1fff1f,#1fffb4,#1fb4ff,#1f1fff,#b41fff,#ff1fb4,#ff1f1f)}body{overflow-x:hidden}button{background-color:unset;border:unset;padding:unset;margin:unset}:focus-visible{outline-width:1px}*{box-sizing:border-box;padding:0;margin:0;scrollbar-width:thin}a{color:inherit;text-decoration:none}li{margin-left:16px}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}@keyframes super-duper-smooth-in-animation{0%{transform:scale(.98);opacity:50%}to{transform:scale(1);opacity:100%}}.super-duper-smooth-in{animation:super-duper-smooth-in-animation .6s;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes supersmooth-in-animation{0%{transform:scale(.98);opacity:0}to{transform:scale(1);opacity:100%}}.super-smooth-in{animation:supersmooth-in-animation .3s;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes smooth-in-animation{0%{transform:scale(.94);opacity:0}to{transform:scale(1);opacity:100%}}.smooth-in{animation:smooth-in-animation .3s;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes slide-up{0%{transform:translateY(16px);opacity:0}to{transform:translateY(0);opacity:100%}}.slide-up{animation:slide-up .3s forwards;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes slide-up-bounce{0%{transform:translateY(16px);scale:.98;opacity:0}to{transform:translateY(0);scale:1;opacity:100%}}.slide-up-bounce{animation:slide-up-bounce .3s forwards;animation-timing-function:cubic-bezier(.2,0,.13,2)}@keyframes slide-up-minimal{0%{transform:translateY(8px);opacity:0}to{transform:translateY(0);opacity:100%}}.slide-up-minimal{animation:slide-up-minimal .3s forwards;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes slide-up-super-minimal{0%{transform:translateY(4px);opacity:0}to{transform:translateY(0);opacity:100%}}.slide-up-super-minimal{animation:slide-up-super-minimal .3s forwards;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes slide-down{0%{transform:translateY(0);opacity:100%}to{transform:translateY(16px);opacity:0}}.slide-down{animation:slide-down .3s forwards;animation-timing-function:cubic-bezier(0,0,.5,1)}@keyframes slide-down-in{0%{transform:translateY(-8px);opacity:0}to{transform:translateY(0);opacity:100%}}.slide-down-in{animation:slide-down-in .4s forwards;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes slide-in-from-right{0%{transform:translateX(16px);opacity:0}to{transform:translateX(0);opacity:100%}}.slide-in-from-right{animation:slide-in-from-right .3s forwards;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes slide-in-from-left{0%{transform:translateX(-16px);opacity:0}to{transform:translateX(0);opacity:100%}}.slide-in-from-left{animation:slide-in-from-left .3s forwards;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes split-color-in{0%{opacity:1;width:20%}to{opacity:1;width:24%}}.split-color-in{animation:split-color-in .3s forwards;animation-timing-function:cubic-bezier(0,0,0,1);transform-origin:center;animation-delay:50ms}@keyframes split-color-out{0%{width:24%;opacity:1}to{width:0;opacity:0}}.split-color-out{animation:split-color-out .3s forwards;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes pulse{0%{opacity:100%;transform:translateX(-8px)}to{transform:translateX(8px);opacity:0}}.pulse{animation:pulse 1.4s cubic-bezier(0,0,0,1) infinite}.pulse.a{animation-delay:.2s}.pulse.b{animation-delay:.4s}.pulse.c{animation-delay:.6s}@keyframes pulsedown{0%{opacity:100%;transform:translateY(-8px)}to{transform:translateY(8px);opacity:0}}.pulsedown{animation:pulsedown 1.2s cubic-bezier(0,0,0,1) infinite}.pulsedown.a{animation-delay:50ms}.pulsedown.b{animation-delay:.1s}.pulsedown.c{animation-delay:.15s}.pulsedown.d{animation-delay:.2s}@keyframes fast-in{0%{opacity:0}to{opacity:100%}}.fast-in{animation:fast-in .2s;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes slide-left{0%{transform:translateX(-16px);opacity:0}to{transform:translateX(0);opacity:100%}}.slide-left{animation:slide-left .3s;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes slide-right{0%{transform:translateX(-16px);opacity:0}to{transform:translateX(0);opacity:100%}}.slide-right{animation:slide-right .3s;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes slide-out-left{0%{transform:translateX(0);opacity:100%}to{transform:translateX(-16px);opacity:0}}.slide-out-left{animation:slide-out-left .3s;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes slide-out-right{0%{transform:translateX(0);opacity:100%}to{transform:translateX(16px);opacity:0}}.slide-out-right{animation:slide-out-right .3s;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes harmony-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.harmony-spin{animation:harmony-spin 16s linear infinite}@keyframes fade-in{0%{opacity:0}to{opacity:100%}}.fade-in{animation:fade-in .5s;animation-timing-function:cubic-bezier(0,0,0,1)}.fade-in-slow{animation:fade-in 1s;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes scale-in{0%{scale:80%}to{scale:100%}}.scale-in{animation:scale-in .3s;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes scale-normal{0%{scale:80%}to{scale:100%}}.scale-normal{animation:scale-normal .3s;animation-timing-function:cubic-bezier(.2,0,.13,2);animation-fill-mode:forwards}@keyframes scale-out{0%{scale:100%}to{scale:80%;opacity:0}}.scale-out{animation:scale-out .3s;animation-timing-function:cubic-bezier(0,0,0,1);animation-fill-mode:forwards}@keyframes scale-down{0%{scale:100%}to{scale:80%}}.scale-down{animation:scale-down .3s;animation-timing-function:cubic-bezier(0,0,0,1);animation-fill-mode:forwards}@keyframes scale-down-dim{0%{scale:100%;opacity:100%}to{scale:90%;opacity:8%}}.scale-down-dim{animation:scale-down-dim .3s;animation-timing-function:var(--animate-bounce);animation-fill-mode:forwards}.bounce{animation-timing-function:cubic-bezier(.2,0,.13,2)}@keyframes scale-in-minimal{0%{scale:99%}to{scale:100%;opacity:100%}}.scale-in-minimal{animation:scale-in-minimal .3s;animation-timing-function:cubic-bezier(0,0,0,1);animation-fill-mode:forwards}@keyframes scale-out-minimal{0%{scale:100%}to{scale:99%;opacity:0}}.scale-out-minimal{animation:scale-out-minimal .3s;animation-timing-function:cubic-bezier(0,0,0,1);animation-fill-mode:forwards}@keyframes color-picker-in{0%{scale:96%}to{scale:100%;opacity:100%}}.color-picker-in{animation:color-picker-in .3s;animation-timing-function:cubic-bezier(0,0,0,1);animation-fill-mode:forwards}@keyframes color-picker-out{0%{scale:100%}to{scale:90%;opacity:0;display:none}}.color-picker-out{animation:color-picker-out .3s;animation-timing-function:cubic-bezier(0,0,0,1);animation-fill-mode:forwards}@keyframes loading-icon-in{0%{scale:95%;opacity:0}to{scale:100%;opacity:100%}}.loading-icon-in{animation:loading-icon-in .3s;animation-timing-function:cubic-bezier(0,0,0,1);animation-fill-mode:forwards}@keyframes press-in{0%{scale:100%}to{scale:80%}}.press-in{animation:press-in .3s;animation-timing-function:cubic-bezier(0,0,0,1);animation-fill-mode:forwards}.press-in-bounce{animation:press-in .3s;animation-timing-function:var(--animate-bounce);animation-fill-mode:forwards}@keyframes newTag{0%{scale:80%;opacity:0}to{scale:100%;opacity:100%}}.newTagAnimation{animation:newTag .4s;animation-timing-function:var(--animate-bounce)}@keyframes shrink-height{0%{height:100%}to{height:50%}}.shrink-height{animation:shrink-height .5s;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes grow-height{0%{height:50%}to{height:100%}}.grow-height{animation:grow-height .4s;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes nav-slide{0%{left:-8%;opacity:0}to{left:0;opacity:1}}.nav-slide{animation:nav-slide .2s;animation-timing-function:cubic-bezier(0,0,0,1)}@keyframes skeleton-loading{0%{background-color:var(--surface)}to{background-color:var(--g100)}}.skeleton{animation:skeleton-loading 1s linear infinite alternate}@keyframes harmony-mover{0%{transform:translateX(0)}to{transform:translateX(-100%)}}.harmonyMover{animation:harmony-mover 30s linear infinite}@keyframes rotating{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.rotating{animation:rotating 3s linear infinite}@keyframes rotate{0%{transform:rotate(0deg)}to{transform:rotate(180deg)}}.rotate{animation:rotate .2s cubic-bezier(.5,0,0,.5);transform:rotate(180deg)}@keyframes unrotate{0%{transform:rotate(0deg)}to{transform:rotate(-180deg)}}.unrotate{animation:unrotate .2s cubic-bezier(.5,0,0,.5);transform:rotate(-180deg)}@keyframes flip180{0%{transform:rotate(0deg)}to{transform:rotate(-180deg)}}.flip{animation:flip180 .3s cubic-bezier(.5,0,0,.5);animation-fill-mode:forwards}@keyframes unflip180{0%{transform:rotate(-180deg)}to{transform:rotate(0deg)}}@keyframes supportAnimation{0%{transform:scale(1);rotate:0deg}50%{transform:scale(1.2);rotate:36deg}to{transform:scale(1);rotate:72deg}}.supportAnimation{animation:supportAnimation 1.2s cubic-bezier(.5,0,0,.5) infinite;animation-fill-mode:forwards}.unflip{animation:unflip180 .3s cubic-bezier(0,0,0,1);animation-fill-mode:forwards}@font-face{font-family:FA;font-display:swap;src:url("/_next/static/media/Font Awesome 6 Pro-Regular-400.18277267.otf")}@font-face{font-family:FAL;font-display:swap;src:url("/_next/static/media/Font Awesome 6 Pro-Light-300.d2a96e12.otf")}@font-face{font-family:FAS;font-display:swap;src:url("/_next/static/media/Font Awesome 6 Pro-Solid-900.01dfaf35.otf")}@font-face{font-family:FAB;font-display:swap;src:url("/_next/static/media/Font Awesome 6 Brands-Regular-400.53f7cd40.otf")}@import url("https://fonts.googleapis.com/css2?family=Exo:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,500;1,600;1,700;1,800;1,900&family=Nunito:wght@400;500;600;700;800;900&display=swap");.h1{font-size:3rem;line-height:58px}.h1,.h2{font-family:Nunito,Arial,Helvetica,sans-serif;font-weight:500;font-display:swap;color:var(--g999)}.h2{font-size:2rem;line-height:40px}.h3{font-size:1.375rem;line-height:30px}.h3,.h4{font-family:Nunito,Arial,Helvetica,sans-serif;font-weight:500;font-display:swap;color:var(--g999)}.h4{font-size:1.125rem;line-height:24px}.p{font-size:.875rem;line-height:18px;color:var(--g999)}.p,.tiny{font-family:Nunito,Arial,Helvetica,sans-serif;font-weight:500;font-display:swap}.tiny{font-size:.6875rem;line-height:14px}.thin{font-weight:300}.regular{font-weight:500}.semi{font-weight:600}.bold{font-weight:700}.itallics{font-style:italic}.underline{text-decoration:underline}.uppercase{text-transform:uppercase}.thick{font-weight:800}.black{font-weight:900}.wide{letter-spacing:.4px}.overflowHidden,.truncate{text-overflow:ellipsis}.maxFillWidth,.overflowHidden{overflow:hidden}.maxFillWidth{max-width:100%}.tooltipContainer{position:relative;display:inline-block}.tooltip{position:absolute;background-color:var(--surface);color:var(--g999);padding:8px 12px;border-radius:8px;border:2px solid var(--g200);z-index:1000;pointer-events:none;transform:scale(1);box-shadow:var(--box-shaddow)}.tooltip.top{bottom:100%;left:50%;transform-origin:bottom center;transform:translateX(-50%) scale(1);margin-bottom:4px}.tooltip.bottom{top:100%;left:50%;transform-origin:top center;transform:translateX(-50%) scale(1);margin-top:4px}.tooltip.left{right:100%;top:50%;transform-origin:right center;transform:translateY(-50%) scale(1);margin-right:4px}.tooltip.right{left:100%;top:50%;transform-origin:left center;transform:translateY(-50%) scale(1);margin-left:4px}.tooltip.scale-in{opacity:1;transform:translateX(-50%) scale(1)}.tooltip.scale-in.left,.tooltip.scale-in.right{transform:translateY(-50%) scale(1)}.far{font-family:FA}.fal{font-family:FAL}.fas{font-family:FAS}.fab{font-family:FAB}.width16{width:16px}.br8{border-radius:8px}.br16,.br8{overflow:hidden}.br16{border-radius:16px}.top4{margin-top:4px}.bot4{margin-bottom:4px}.left4{margin-left:4px}.right4{margin-right:4px}.top8{margin-top:8px}.bot8{margin-bottom:8px}.left8{margin-left:8px}.right{right:0}.right8{margin-right:8px}.top16{margin-top:16px}.bot16{margin-bottom:16px}.left16{margin-left:16px}.right16{margin-right:16px}.top24{margin-top:24px}.bot24{margin-bottom:24px}.left24{margin-left:24px}.right24{margin-right:24px}.top48{margin-top:48px}.bot48{margin-bottom:48px}.left48{margin-left:48px}.right48{margin-right:48px}.top96{margin-top:96px}.bot96{margin-bottom:96px}.left96{margin-left:96px}.right96{margin-right:96px}.top192{margin-top:192px}.bot192{margin-bottom:192px}.left192{margin-left:192px}.right192{margin-right:192px}.gap2{gap:2px}.gap4{gap:4px}.gap8{gap:8px}.gap16{gap:16px}.gap24{gap:24px}.gap48{gap:48px}.gap96{gap:96px}.gap192{gap:192px}.grid{display:grid}.nowrap{white-space:nowrap}.spaceBetween{justify-content:space-between}.container{width:var(--feed-width);display:flex;transition:width .3s cubic-bezier(0,0,0,1)}.container.discord{margin:192px 0}.container.contact{margin:192px 0;align-items:center;min-height:60vh}.container.designSystem{margin:96px 0}.updateHeader{display:flex;flex-direction:row;align-items:flex-start;gap:8px;padding:48px 48px 0;width:100%}.updateContainer{display:grid;grid-template-columns:repeat(auto-fit,minmax(600px,1fr));grid-gap:192px;padding:48px}.hide{display:none!important}.reverse{flex-direction:row-reverse}.flex{display:flex}.start{justify-content:start}.stretch{align-self:stretch}.wordwrap{word-wrap:break-word}.wrap{flex-wrap:wrap}.noshrink{flex-shrink:0}.shrink{flex-shrink:1}.alignstretch{align-self:stretch}.align{align-items:center}.fit{width:-moz-fit-content;width:fit-content}.alignEnd{align-items:flex-end}.column{flex-direction:column}.justify{justify-content:center}.row{flex-direction:row}.grow{flex-grow:1}.half{width:50%}.golden{width:61.8%}.fillWidth{width:100%}.fillHeight{height:100%}.height48{height:48px}.end{justify-content:flex-end}.generatorContainer{height:100vh;display:flex;flex-direction:column}.relative{position:relative}.center{text-align:center}.mainSliderContainer{display:flex;flex-direction:column;gap:4px;height:42px}.multirangeslider{display:flex;position:relative;width:100%;height:10px}.multirangeslider .slider{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.multirangeslider .slider::-webkit-slider-thumb{pointer-events:auto}.multirangeslider .slider::-moz-range-thumb{pointer-events:auto}.multirangeslider .slider::-ms-thumb{pointer-events:auto}input[type=range]::-webkit-slider-runnable-track{width:calc(100% + 16px);margin:0 -8px}.customThumbContainer{position:absolute;top:0;left:0;width:32px;height:32px;display:flex;justify-content:center;align-items:center;z-index:5;border:var(--laminate-border);-webkit-backdrop-filter:var(--laminate-blur) blur(4px);backdrop-filter:var(--laminate-blur) blur(4px);border-radius:16px;cursor:pointer;mask-image:radial-gradient(circle at center,transparent 4px,var(--surface) 4px);-webkit-mask-image:radial-gradient(circle at center,transparent 4px,var(--surface) 4px)}.customThumbContainer,.customThumbOutline{-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:none}.customThumbOutline{width:24px;height:24px;border-radius:50%;background-color:var(--surface)}.slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;position:relative;width:100%;height:10px;cursor:pointer;border-radius:16px;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:1;background-color:var(--g200);border:1px solid var(--g300)}.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;height:24px;width:24px;border:8px solid var(--surface);outline:2px solid var(--g200);border-radius:24px;position:relative;z-index:1000;-webkit-transition:var(--animate-fast);transition:var(--animate-fast)}.slider::-webkit-slider-thumb:hover{outline:2px solid var(--g500)}.slider::-webkit-slider-thumb:active{outline:2px solid var(--g900)}.slider::-moz-range-thumb{-moz-appearance:none;appearance:none;height:8px;width:8px;border:8px solid var(--surface);outline:2px solid var(--g200);border-radius:24px;position:relative;z-index:1000;background-color:transparent}.slider.filled::-webkit-slider-thumb{background-color:var(--g999)}.slider.contrast{height:8px;border:2px solid var(--g100);transition:all var(--animate-normal)}.slider.contrast::-webkit-slider-thumb{height:12px;width:12px;border:12px solid var(--surface)}.sliderHueBG{background:var(--hue-slider-bg)}.sliderAlphaBG{background-size:100% 100%,8px 8px;background-repeat:no-repeat,repeat}.sliderAdjustBG{background:linear-gradient(90deg,#000,#fff,#000)}.sliderLightnessBG{background:linear-gradient(90deg,#000,#fff)}.white{color:var(--surface)}.g100{color:var(--g100)}.g200{color:var(--g200)}.g300{color:var(--g300)}.g400{color:var(--g400)}.g500{color:var(--g500)}.g600{color:var(--g600)}.g700{color:var(--g700)}.g800{color:var(--g800)}.g900{color:var(--g900)}.g999{color:var(--g999)}.super500{color:var(--super500)}.super500alt{color:var(--super500-alt)}.red{color:var(--red)}.danger:hover,.redHover:hover{color:var(--red)!important}.danger:hover{background-color:#faece6!important;border:2px solid var(--red)!important}.green500{color:var(--green500)!important}.dmgreen500{color:var(--dmgreen500)!important}.dmred500{color:var(--dmred500)}.likes500{color:var(--red)}.listItem{list-style:none}.toggleComboContainer{display:grid;grid-template-columns:36px auto;grid-column-gap:16px;column-gap:16px;align-items:center;cursor:pointer;padding:16px;border:2px solid var(--g100);border-radius:16px;transition:var(--animate-normal)}.toggleComboContainer:hover{border:2px solid var(--g300)}.toggleComboContainer:active{border:2px solid var(--g999)}.toggleContainer{position:relative;display:flex;border-radius:12px;padding:2px;background-color:var(--g200);width:32px;cursor:pointer}.toggleContainer.small{width:24px}.toggleKnob{position:relative;left:0;width:16px;height:16px;border-radius:8px;background-color:var(--surface);transition:var(--animate-fast)}.toggleKnob.small{width:12px;height:12px;border-radius:6px}.activeToggleContainer{background-color:var(--g999)}.activeToggleKnob{left:12px;transition:var(--animate-fast)}.activeToggleKnob.small{left:8px;transition:var(--animate-normal)}.aboutHarmonyContainer{width:100%;height:100%;display:flex;justify-content:center;align-items:center;padding:24px}.aboutHarmonyCircle{width:200px;height:200px;border-radius:1000px;position:relative;border:2px solid var(--g200)}.aboutHarmonyPointContainer{width:100%;height:100%;position:absolute;display:flex;justify-content:center;transition:all 1s linear}.aboutHarmonyPoint{width:16px;height:16px;background-color:var(--g700);border-radius:24px;position:relative;top:8px;transition:all 1s linear}.aboutHarmonyPoint.base{width:24px;height:24px}.tag{display:flex;align-items:center;color:var(--g800);padding:4px 8px;background-color:var(--g200);border-radius:8px;transition:var(--animate-normal);height:-moz-fit-content;height:fit-content}.tag.green{color:#3e7000;background-color:#f4ffeb}.tag.yellow{color:#946a00;background-color:#fffbeb}.tag.red{color:#d62000;background-color:#ffefeb}.tag.super{color:#000;background-color:var(--super500-alt)}.accessibilityRatingTag{display:flex;gap:8px;padding:2px 8px;border-radius:8px;width:-moz-fit-content;width:fit-content;border:2px solid var(--g200);color:var(--g700);transition:var(--animate-normal)}.accessibilityRatingTag.aa{background-color:transparent;color:var(--surface);border-color:var(--contrastAA)}.accessibilityRatingTag.aaa{background-color:var(--contrastAAA);color:var(--surface);border-color:var(--contrastAA)}.newTag{height:18px;display:flex;align-items:center;margin-right:-8px;color:var(--surface);padding:4px 8px;border-radius:100px;transition:var(--animate-normal)}.newTag,.superTag{background-color:var(--super500-alt)}.superTag{border:4px solid var(--g900);color:var(--g900)}.colorTag{align-items:center;color:var(--g700);padding:4px 4px 4px 8px;background-color:var(--g100);border-radius:8px;transition:var(--animate-normal);max-width:100%}.colorTag,.colorTagContent{display:flex;overflow:hidden}.colorTagContent{gap:8px}.colorTag>.p,.colorTagContent{width:100%;text-overflow:ellipsis}.colorTagColor{width:16px;height:16px;background-color:var(--g999);border-radius:4px}.button{padding:8px 16px;min-width:24px;min-height:24px;border:2px solid transparent;color:var(--g600);border-radius:var(--br8);cursor:pointer;transition:var(--animate-fast)}.button:hover{color:var(--g999);background-color:var(--g100)}.large{padding:8px 16px;min-height:48px;min-width:48px}.button.filled{background-color:var(--g100);color:var(--g700)}.button.filled:hover{background-color:var(--g200);color:var(--g999)}.button.filled:active{background-color:var(--g300)}.button.discord{background-color:#5865f2}.button.discord:hover{background-color:#434fcf}.button.small{padding:4px}.button.explore{background-color:transparent}.button.explore:hover{background-color:var(--g200)}.button.super,.button.super:hover{background-color:var(--super500-alt);color:var(--g999)}.button.red{background-color:var(--red16);border:2px solid var(--red);color:var(--red)}.button.red:hover{background-color:var(--red24)}.button.groupNavButton{height:100%!important;flex-grow:1;padding:0 8px;min-height:unset!important;max-height:unset}.button.support{border:4px solid transparent;border-radius:12px}.button.support,.button.support:hover{padding:16px 24px 16px 16px;color:var(--g999)}.button.support:hover{border:4px solid var(--g900);background-color:var(--super500-alt)}.button.support.gold{background-color:var(--super500)}.button.support.gold:hover{background-color:var(--super600)}.button.patreon.outline:hover{border-color:var(--super500-alt)}.button.patreon.patreonRed,.button.patreon:hover{background-color:var(--patreon)}.invert{filter:invert(0)}.radioContainer{cursor:pointer;gap:8px}.radioCircle,.radioContainer{display:flex;align-items:center}.radioCircle{width:16px;height:16px;border-radius:100px;border:2px solid var(--g600);justify-content:center;transition:var(--animate-normal)}.radioContainer:hover .radioCircle{border-color:var(--g999);background-color:var(--g100)}.radioContainer .radioContainerSelected{border-width:6px!important;border-color:var(--g999)}.checkboxContainer{cursor:pointer;gap:8px}.check,.checkboxContainer{display:flex;align-items:center;transition:var(--animate-normal)}.check{width:16px;height:16px;border-radius:4px;border:2px solid var(--g600);justify-content:center}.checkboxContainer:hover .check{border-color:var(--g999);background-color:var(--g200)}.check.selected,.checkboxContainer:hover .check.selected{color:var(--surface);background-color:var(--g999);border-color:var(--g999)}.primary{background:var(--g900);color:var(--surface)}.primary:hover{color:var(--surface);background:var(--g999)}.button.primary.disabled{color:var(--g200)!important;background-color:var(--g100)!important;cursor:not-allowed}.outline{border:2px solid var(--g200)}.outline:hover{border:2px solid var(--g700);background-color:var(--g100)}.outline.disabled,.outline.disabled:hover{border:2px solid var(--g100)}.icon{width:48px;min-height:48px;padding:0}.iconCircle{color:var(--super500-alt);transition:var(--animate-bounce);width:-moz-fit-content;width:fit-content}.iconCircle:hover{transform:scale(1.1)}.smallIcon{width:36px;height:36px}.disabled{cursor:not-allowed}.disabled,.disabled:hover{color:var(--g200)!important}.disabled:hover{background-color:unset!important;transform:unset}.disabled:active{transform:unset}.disabledOutline{cursor:not-allowed}.disabledOutline,.disabledOutline:hover{border:2px solid var(--g100);color:var(--g200)}.disabledOutline:hover{background-color:unset;transform:unset}.outlineOn{border:2px solid var(--g999);color:var(--g999)}.redButton{background-color:var(--red)}.redButton:hover{background-color:#901e1e}.transparent{background-color:unset}.transparent:hover{background-color:unset!important}.actionContainer{position:absolute;flex-direction:column;border-radius:8px;border:2px solid var(--g100);box-shadow:var(--box-shaddow)}.actionButton,.actionContainer{display:flex;background-color:var(--surface)}.actionButton{position:relative;align-items:center;justify-content:center;width:48px;height:48px;border-radius:8px;z-index:100}.textLink{color:var(--g700);cursor:pointer;transition:var(--animate-normal)}.textLink:hover{color:var(--g900);text-decoration:underline}.textLink:active{color:var(--g999)}.palettePreviewWindow{flex-direction:column;gap:8px}.dragDropContainer,.palettePreviewWindow{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.dragDropContainer{border:2px dashed var(--g300);border-radius:16px;cursor:pointer;transition:var(--animate-normal)}.dragDropContainer p{color:var(--g700)}.dragDropContainer.dragging,.dragDropContainer:hover{border:2px dashed var(--g900)}.dragDropContainer.dragging{color:var(--super500-alt);background-color:var(--g50)}.imageImportHeader{display:flex;align-items:center;gap:8px;padding-right:2px}.findingColorsCover{position:absolute;width:100%;height:100%;background-color:var(--surface75);border-radius:24px}.findingColorsCover,.findingColorsCoverLoader{display:flex;justify-content:center;align-items:center}.findingColorsCoverLoader{flex-direction:column;gap:16px}.canvas-wrapper{position:relative;display:flex;width:-moz-fit-content;width:fit-content;height:-moz-fit-content;height:fit-content;align-items:center;justify-content:center;border-radius:24px;box-shadow:var(--box-shaddow-color-card)}.imageImportControlsCard{padding:16px;border-radius:24px;background-color:var(--surface);border:2px solid var(--g100);width:100%;position:relative}.imageImportControlsCard,.preferencesPopup{display:flex;flex-direction:column;gap:16px;box-shadow:var(--box-shaddow)}.preferencesPopup{width:248px;position:absolute;top:0;left:0;transform:translateY(-100%);padding:8px;border:var(--laminate-border);-webkit-backdrop-filter:var(--laminate-blur);backdrop-filter:var(--laminate-blur);border-radius:16px}.extractorPickerThumb{position:absolute;width:32px;height:32px;border:4px solid var(--surface);border-radius:50%;transform:translate(-50%,-50%);display:flex;justify-content:center;align-items:center;overflow:hidden;transition:width .2s cubic-bezier(0,0,0,1),height .2s cubic-bezier(0,0,0,1);pointer-events:none;box-shadow:var(--box-shaddow-s);outline:2px solid var(--g999)}.extractorPickerThumb>#selector{pointer-events:auto}.extractorPickerThumb.hover{width:48px;height:48px}.extractorPickerThumb.pressed{width:96px;height:96px;border-width:4px}.extractorPickerThumb.shrink{width:16px;height:16px;border-width:2px}.extractorPickerPreviewSelectedDot{position:absolute;width:12px;height:12px;border-radius:50%;background-color:var(--surface);z-index:1;border:2px solid var(--g999);pointer-events:none}.extractorPicker{position:fixed;top:0;left:var(--sidenav-width);width:calc(100% - var(--sidenav-width));z-index:2000;background-color:var(--g50);padding:16px;display:flex;flex-direction:column;align-items:center;gap:16px}.pickerColorCardContainer{height:96px;width:100%;justify-self:center;border-radius:16px;overflow:hidden;display:flex;border:2px solid var(--g100);transition:var(--animate-normal)}.pickerColorCardContainer.skeleton{background-color:var(--g200);justify-content:center;align-items:center}.pickerColorCard{width:100%;height:100%;display:flex;justify-content:center;align-items:center;cursor:pointer}.pickerColorCard p{transition:var(--animate-normal)}.pickerColorCard:hover p{transform:scale(1.1)}.extractorPickerContainerBorder{width:calc(100% - 96px);height:100%;max-height:100%;justify-self:center;display:flex;border-radius:24px;margin-top:16px;justify-content:center}.extractorPickerContainer{width:100%;display:flex;align-items:center;justify-content:center}.extractorPickerImage{width:100%;height:100%;object-fit:cover;z-index:100}.extractorPickerZoomCanvas{position:absolute;width:80px;height:80px;border-radius:50%;overflow:hidden;z-index:2;border:2px solid var(--surface);pointer-events:none}.extractorPickerPreviewRing{display:flex;width:96px;height:96px;border-radius:50%;position:absolute;z-index:1;pointer-events:none}.extractImageContainer{width:100%;position:relative;overflow:hidden;border-radius:8px;align-items:center;justify-content:center;border:1px solid var(--g300)}.extractImage{width:100%;height:100%;object-fit:cover}.extractedColor{width:48px;height:48px;border-radius:8px}.extractorSettings{min-width:256px;width:256px;display:flex;flex-direction:column;gap:16px;position:relative}.extractedColorsList{display:flex;flex-wrap:wrap;gap:8px;width:100%;height:-moz-fit-content;height:fit-content}.tabsContainer{display:flex;height:48px}.tabsContainer.pill{width:-moz-fit-content;width:fit-content;padding:4px;border-radius:12px;background-color:var(--g100);gap:4px;overflow:hidden}.tabItem{min-width:40px;min-height:40px;color:var(--g600);cursor:pointer;border:none;border-bottom:2px solid transparent;padding:8px 12px;background-color:transparent;flex-shrink:0;transition:var(--animate-fast)}.tabItem:hover{color:var(--g900);border-bottom:2px solid var(--g500)}.tabItem:active{color:var(--g999);border-bottom:2px solid var(--g400)}.selectedTabItem{color:var(--g999)!important;border-bottom:2px solid var(--g999)!important}.tabItem.pill{border-radius:8px;padding:4px 8px;background-color:transparent;color:var(--g600);border:none}.tabItem.pill.selected,.tabItem.pill:hover{background-color:var(--surface)}.tabItem.pill.selected{box-shadow:var(--box-shaddow)}.laminatecontainer{display:flex;flex-direction:column;background-color:var(--surface);padding:4px;border-radius:8px;height:100%}.dropdownContainer{display:flex;position:relative;justify-content:center;align-items:center;border-radius:8px;padding:8px 16px;min-height:48px;cursor:pointer;color:var(--g700);transition:var(--animate-normal);background-color:var(--g100)}.dropdownContainer:hover{color:var(--g999);background-color:var(--g100)}.dropdownMenu{position:absolute;min-width:calc(100% + 12px);min-height:-moz-fit-content;min-height:fit-content;display:flex;bottom:48px;flex-direction:column;overflow:auto;z-index:2000;padding:4px;border:var(--laminate-border);-webkit-backdrop-filter:var(--laminate-blur);backdrop-filter:var(--laminate-blur);border-radius:12px;box-shadow:var(--box-shaddow);left:-6px}.dropdownMenu.down{bottom:unset;top:48px}.dropdownItem{cursor:pointer;white-space:nowrap;text-align:start;color:var(--g999);border:none;padding:8px 16px;transition:var(--animate-normal);margin-left:unset;border-radius:4px}.dropdownItem:hover{color:var(--g999);background-color:var(--g150)}.dropdownItem:active{color:var(--g999);background-color:var(--g200)}.dropdownIndicator{width:16px}.dropdownItem div,.dropdownItem span{color:var(--g600)}.shortcutTag{color:var(--g700);background-color:var(--g150);padding:4px 8px;font-weight:600}.dropdownItem .shortcut,.shortcutTag{width:-moz-fit-content;width:fit-content;border-radius:4px;font-family:monospace}.dropdownItem .shortcut{display:flex;align-items:center;justify-content:flex-end;text-align:end;color:var(--g500);background-color:var(--g50);padding:0 8px;margin-left:40px}.dropdownItem.selected{background-color:var(--g100)}.selectedDropdownItem{background-color:var(--g200)!important}.selectedDropdownItem,.selectedDropdownItem span{color:var(--g999)!important}.textbox.darkmode{background-color:var(--darkg100);border:2px solid var(--darkg100);color:var(--darkg999)}.textbox:hover.darkmode{border:2px solid var(--darkg500)}.textbox:active.darkmode{border:2px solid var(--darkg999)}.textbox{display:flex;border-radius:8px;background-color:var(--g100);border:2px solid var(--g100);padding:8px 12px;height:48px;cursor:text;transition:var(--animate-fast);width:100%}.textbox:hover{border:2px solid var(--g200)}.textbox:active{border:2px solid var(--g400)}.textbox.tall{min-height:96px}.textbox.descriptionBox{min-width:100%;max-width:100%;max-height:400px;min-height:128px;transition:unset}.textbox.hexbox{width:108px;padding-left:24px}.textbox.hexpreview{padding-left:52px}.textbox.small{height:32px;padding:8px}.textbox.error{border-color:var(--dmred500)}.textbox.error:focus-visible{border-color:var(--dmred500);outline-color:var(--dmred500)}.textbox.sliderShiftValue,.textbox.sliderValue{width:48px;padding:4px;height:24px;border-radius:4px}.textbox.disabled{background-color:var(--g100);border:2px solid var(--g100);color:var(--g700)!important}.textbox.disabled:hover{background-color:var(--g100)!important}.button.wide{width:96px}.table{border-radius:8px;border:2px solid var(--g100)}.tableRow{display:flex;width:100%}.tableCell{padding:8px}.tableCell,.tableHeaderGroup{display:flex;align-items:center;width:100%}.tableHeaderGroup{background-color:var(--g50)}.tableCell.heading{font-weight:400;color:var(--g600)}.headingButtonSpacer{display:flex;width:48px;flex-shrink:0}.historyscroll{display:flex;flex-direction:column;max-height:600px;border-radius:8px;overflow:auto;padding:16px;gap:16px;background-color:var(--g100)}.historycard{width:100%;padding:8px;border-radius:16px;border:2px solid transparent;transition:var(--animate-normal);background-color:var(--surface)}.historycard.highlight{border:2px solid var(--g999)}.historycolorcontainer{display:flex;width:100%;flex-direction:column;gap:8px}.historycolorgroup{display:flex;width:100%;border-radius:8px;overflow:hidden}.historycolor{width:100%;height:24px}.pointer{cursor:pointer}.disableHighlight{user-drag:none;user-select:none;-moz-user-select:none;-webkit-user-drag:none;-webkit-user-select:none;-ms-user-select:none}.divider{height:2px!important;display:flex;flex-grow:1;width:100%;background:var(--g200)}.dividerV{width:2px!important;display:flex;height:100%;background:var(--g100);flex-shrink:0}.dividerH{width:100%;height:2px;background-color:var(--g100)}.divider.g100{background:var(--g100)}.card{height:-moz-fit-content;height:fit-content;border-radius:16px;background-color:var(--surface);padding:48px}.lockedcontainer{position:absolute;z-index:100;width:calc(100% + 8px);height:100%;background:var(--surface);opacity:.9;display:flex;justify-content:center;align-items:center;gap:8px}.aboutCard{transition:var(--animate-normal);padding:36px;border-radius:24px;background-color:var(--surface);position:relative;align-items:center;overflow:hidden}.aboutCard.mini{width:100%;flex-grow:1}.coreFeature{width:100%}.aboutCard.coreFeature{width:100%;min-height:400px;align-items:center;margin:96px 0;background-color:var(--surface)}.aboutHeroMascot{width:40%;display:flex;justify-content:center;position:relative;align-items:center}.cardUpdate{padding:0;overflow:hidden;height:100%;border-radius:24px;min-height:-moz-fit-content;min-height:fit-content}.superCard{border-radius:24px;box-shadow:var(--box-shaddow-color-card)}.contrastStrengthMeter{width:100%;border-radius:4px;overflow:hidden;display:flex;gap:2px}.contrastStrengthMeterBox{width:100%;height:8px;border-radius:0;background-color:var(--g100)}.guideNav{min-width:180px;border-right:2px solid var(--g100);padding-right:16px;height:100%}.guideSection{gap:36px;overflow-y:auto;padding-right:24px}.guideGroup,.guideSection{display:flex;flex-direction:column}.featureItemIcon{height:96px;width:48px;display:flex;justify-content:center;align-items:center;flex:0 0 auto}.colorCardExampleContainer{background-color:var(--surface);padding-bottom:32px}.colorCardExampleContainer,.colorCardExampleContainerDark{display:flex;border-radius:16px;width:100%;min-height:48px;height:192px;box-shadow:var(--box-shaddow-s)}.colorCardExampleContainerDark{background-color:var(--g800);padding-bottom:24px}.colorCardExample,.colorCardExampleDark{border-radius:16px;height:100%;width:100%;display:flex}.colorCardExampleDark{border:4px solid var(--g800)}.baseColorPreviewContainer{position:relative}.baseColorPreviewColor{height:36px;width:8px;border-radius:4px;position:absolute;align-self:stretch;left:8px;top:6px}.react-colorful{height:100%!important;min-height:84px;width:100%!important}.react-colorful__pointer{border-radius:24px!important;border:8px solid var(--surface)!important;outline:2px solid var(--g100);height:24px!important;width:24px!important;box-shadow:var(--box-shaddow-s)!important;transition:var(--animate-sliderThumb);cursor:pointer}.react-colorful__pointer:active,.react-colorful__pointer:hover{outline:2px solid var(--g999)}.react-colorful__saturation{border-radius:8px!important;border:1px solid var(--g200)!important;cursor:pointer;width:100%;height:100%}.react-colorful__hue{display:none}.react-colorful__interactive{cursor:pointer}.contentContainer{position:relative;margin-left:var(--sidenav-width);background-color:var(--g100);min-height:100vh;width:100%}.contentContainer.minHeight{min-height:100vh}.scrollbarPlaceholder{padding-right:calc(100vw - 100%)}.contentContainer.explore{background-color:var(--surface)}.contentContainer.noNav{margin-left:unset}.navItem{display:flex;width:100%;align-items:center;padding:8px 16px;background-color:var(--surface);border-radius:var(--br8);color:var(--g600);transition:var(--animate-normal);border:2px solid var(--surface);overflow:hidden}.navItem:hover{color:var(--g900);background-color:var(--g150)}.navItem:active{background:var(--g100);color:var(--g900)}.selectedNavItem{color:var(--g999)!important;background-color:var(--g200)!important}.mainContainer{display:flex}.modalContainer{width:100%;height:100%;display:flex;position:fixed;left:0;top:0;right:0;bottom:0;z-index:1000000;align-items:center;justify-content:center}.modalCard{z-index:10001;display:flex;flex-direction:column;box-shadow:var(--box-shaddow-color-card);padding:8px;border:var(--laminate-border);-webkit-backdrop-filter:var(--laminate-blur);backdrop-filter:var(--laminate-blur);border-radius:24px}.modalCard-xs{width:300px}.modalCard-s{width:400px}.modalCard-m{width:480px}.modalCard-mg{width:600px;height:600px}.modalCard-L{width:800px}.modalBackground{position:absolute;width:100%;height:100%;background-color:rgba(0,0,0,.48);z-index:10000;cursor:pointer}.modalBackground.clear{background-color:transparent}.modalBackground.noPointer{cursor:default}.popupBackground{position:fixed;width:100vw;height:100vh;top:0;bottom:0;left:0;right:0;z-index:10;cursor:pointer}.popupPosition{position:absolute;top:48px;align-items:center;box-shadow:var(--box-shaddow)}.popupCard,.popupPosition{display:flex;flex-direction:column;width:100%}.popupCard{border-radius:8px;padding:8px;background:var(--surface);border:2px solid var(--g100);gap:16px}.popupCard,.triange{z-index:10000}.loadIconContainer,.spinner{display:flex;justify-content:center;align-items:center}.spinner{position:absolute;width:48px;height:48px}.paletteSkeletonContainer{height:180px;background-color:var(--g100);border-radius:16px}.infinite-scroll-component__outerdiv{width:100%}.toast{display:flex;position:fixed;z-index:100000000;left:50%;bottom:96px;padding:16px;border-radius:8px;background-color:var(--g999);color:var(--surface);box-shadow:var(--box-shaddow)}.toast.error{background-color:var(--dmred500)}.rightDivider{border-right:2px solid var(--g100);padding-right:24px}.errorCard{color:var(--surface);background-color:var(--red)}.errorCard,.warningCard{display:flex;padding:16px;border-radius:8px;gap:16px;align-items:center}.warningCard{color:var(--warning-text)!important;background-color:var(--warning-bg);border:1px solid var(--warning-text)}.warningCard.small{padding:8px 12px;gap:8px}.infoCard{display:flex;gap:16px;color:var(--g999);padding:16px;align-items:center;border-radius:8px;background-color:var(--g100)}.superLink:hover{background-color:var(--super100);color:var(--super500);border-color:var(--super500)}.superLink:active{background-color:var(--super100);color:var(--super60);border-color:var(--super600)}.shortGroup{height:50%!important;transition:var(--animate-slow)}.emptyStateContainer{display:flex;flex-direction:column;padding:48px;align-items:center;justify-content:center}.emptyStateTitle{width:400px;text-align:center;display:flex;justify-content:center}.emptyStateIconContainer{width:300px;height:auto}.fixedIcon{width:16px}.alertBanner{position:fixed;height:-moz-fit-content;height:fit-content;justify-content:center;inset:0;padding:8px 24px;background-color:var(--surface);border-top:2px solid var(--g100);display:flex;align-items:center;z-index:10;top:96px;left:var(--sidenav-width)}.botpad24{padding-bottom:24px}.contactColorPaletteContainer{display:flex;border-radius:8px;overflow:hidden;width:100%;height:2px}.contactColorCard{width:100%;height:100%;background-color:var(--surface)}.maintenancePage{justify-content:center;width:100%;gap:96px;height:100%;min-height:100vh}.maintenanceContent,.maintenancePage{display:flex;align-items:center;flex-direction:column}.maintenanceContent{width:400px;text-align:center;gap:16px}.supportImage{overflow:hidden;width:100%;border-radius:16px;margin-bottom:16px}.pageNotFoundContainer{display:flex;flex-direction:column;width:100vw;height:100vh;justify-content:center;align-items:center;background-color:var(--surface)}.discordWidget{box-shadow:var(--box-shaddow-color-card)}.colorPickerCard{min-width:300px;width:300px;background-color:var(--surface);border:1px solid var(--g100);padding:16px;border-radius:8px;box-shadow:var(--box-shaddow)}.previewCard{width:-moz-fit-content;width:fit-content;border-radius:16px;border:2px solid var(--g100);padding:16px;min-height:106px}.colorPickerCardPreview{display:flex;width:100%;height:48px;border-radius:8px;justify-content:center;align-items:center}.colorPickerHex{width:-moz-fit-content;width:fit-content;height:-moz-fit-content;height:fit-content;border-radius:8px;background-color:var(--surface);padding:4px;cursor:text;transition:var(--animate-fast)}.colorPickerSliderValue{width:32px}.exportModalButtonGrid{display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:auto;grid-gap:8px;gap:8px}.codeBlockContainer{display:flex;border:2px solid var(--g200);border-radius:12px;width:100%;flex-direction:column;overflow:hidden}.codeBlockHeader{width:100%;padding:8px 8px 8px 16px;align-items:center;display:flex}.codeBlockCodeArea{background-color:var(--g50);min-height:48px;max-height:400px;padding:16px;gap:16px;overflow-y:scroll;white-space:pre-wrap}.codeBlockCodeArea,.codeBlockColorGroup{display:flex;flex-direction:column}.pixel{width:16px;height:16px}#pixelPalette{width:-moz-fit-content;width:fit-content}.pixelPaletteContainer{display:flex;justify-content:center;align-items:center;background-color:var(--g100);border-radius:8px;padding:16px;min-height:192px;width:100%;overflow:hidden}.savePaletteContentContainer{height:300px;display:flex;width:100%;flex-direction:column;gap:24px;overflow-y:scroll;padding-right:24px}.existingCollectionsContainer{max-height:200px;overflow-y:auto;box-shadow:var(--box-shaddow)}.supportBullet li::marker{color:var(--super500-alt)}.easingContainer{border-radius:16px;border:2px solid var(--g200);padding:8px}.dropdownColorWheel{display:flex;width:48px;height:48px;aspect-ratio:1;border:2px solid var(--g200);border-radius:50%;position:relative;align-items:center;justify-content:center;flex-shrink:0}.dropdownColorWheelColorContainer{width:100%;height:100%;position:absolute;display:flex;justify-content:center}.animate-normal{transition:var(--animate-normal)}.dropdownColorWheelColor{width:6px;height:6px;border-radius:50%;position:relative;border:1px solid var(--surface)}.dropdownColorWheelLine{height:50%;width:1px;background-color:var(--g200);border-radius:8px;position:relative;z-index:1}.harmonyExample{border-radius:24px;padding:8px;gap:16px;display:flex;flex-direction:column}.harmonyExampleWindow:before{background:linear-gradient(90deg,var(--surface),var(--harmonyCover),var(--harmonyCover),var(--harmonyCover),var(--surface));content:"";position:absolute;top:0;left:0;right:0;bottom:0;z-index:1}.harmonyExampleWindow{display:flex;position:relative;overflow:hidden;width:100%}.harmonyExampleGrid{display:flex;gap:48px}.shadeWheel{display:flex;flex-direction:column}.splitColorButton{display:flex;justify-content:center;align-items:center;top:0;height:calc(100% - 96px);position:absolute;z-index:100;border-radius:0 0 8px 8px;opacity:0}.shadeWheel .shades{display:flex;flex-direction:column;border-radius:8px;overflow:hidden;border:2px solid var(--g100);min-width:48px}.shadeWheel .shades.og{width:36px;height:36px;min-width:unset;align-self:center;border-radius:48px}.shadeWheel .container{position:relative;display:flex;width:-moz-fit-content;width:fit-content;align-items:center;justify-content:center;width:100%}.shadeWheel .shade{display:flex;width:100%;height:100%;min-height:24px;cursor:pointer}.shadeWheel .selected{position:absolute}.colorPickerManualValuesContainer{display:flex;gap:8px}.grayscale{filter:grayscale(1)}.exploreHero{width:100%;border-radius:24px}.categoryContent{border:2px solid var(--g200);background-color:var(--surface);border-radius:36px;box-shadow:var(--box-shaddow);overflow:hidden}.categoryContainer{display:flex;flex-direction:column;width:100%;gap:24px;padding-bottom:192px}.categoryHeader{display:flex;flex-direction:column;position:relative;padding:48px 8px;gap:48px;border-radius:24px}.categoryContentBox{padding:48px;display:flex;flex-direction:column;gap:24px;background-color:var(--surface);border-bottom:2px solid var(--g200)}.categoryHeaderContent{display:flex;align-items:flex-end;padding:0}.categoryLink{display:flex;flex-direction:column;padding:16px;gap:8px;height:-moz-fit-content;height:fit-content;border-radius:24px;transition:var(--animate-normal);background-color:var(--surface);cursor:pointer;width:100%;border:2px solid var(--g200);box-shadow:var(--box-shaddow);height:352px}.categoryLink:hover{border:2px solid var(--g999)}.categoryLink .chevron{transition:var(--animate-normal);transform:translateX(0)}.categoryLink:hover .chevron{color:var(--g999);transform:translateX(4px);scale:1.2}.categoryLinkHeader{display:flex;flex-direction:column;padding:8px}.categoryLinkPreview{width:100%}.categoryThumbnail{position:relative;gap:2px;border-radius:16px;overflow:hidden;justify-content:center;align-items:center}.categoryThumbnail,.categoryThumbnailRotate{display:flex;flex-direction:column;transition:var(--animate-slow);height:100%}.categoryThumbnailRotate{width:100%;scale:1}.categoryLink:hover .categoryThumbnailRotate{scale:1.1}.categoryGrid{display:grid;grid-template-columns:1fr 1fr 1fr;grid-gap:24px;gap:24px;width:100%}.exploreList{display:flex;flex-direction:column;gap:48px;padding:48px}.exploreGrid{display:grid;grid-template-columns:1fr 1fr 1fr;grid-gap:48px;gap:48px;width:100%;border-radius:36px;padding:48px}.exploreContainer{display:flex;flex-direction:column;align-items:center;width:100%;position:relative;min-height:100vh}.exploreControls{display:flex;flex-direction:column;padding:24px;width:var(--explore-controls-width);height:100vh;position:fixed;left:var(--sidenav-width);background-color:var(--surface);gap:16px}.explorePalettesWrapper{display:flex;width:100%;padding-left:var(--explore-controls-width);align-items:center;justify-content:center;flex-direction:column}.explorePalettesContainer{width:100%;display:grid;grid-template-columns:repeat(auto-fill,minmax(400px,1fr));grid-template-rows:repeat(auto-fill,minmax(294px,1fr));flex-direction:column;grid-gap:24px;gap:24px;padding:24px}.exploreCard{background-color:var(--surface);border-radius:24px;height:-moz-fit-content;height:fit-content}.loadingcontainer{position:absolute;width:100%;height:100%;background-color:var(--surface);z-index:10000000}.loadingcontainer,.spinnercontainer{display:flex;justify-content:center;align-items:center}.spinnercontainer{width:48px;height:48px}.exploreCardActions{width:100%;display:flex;justify-content:space-between;align-items:center}.bookContainer{border-radius:12px;background-color:var(--surface);border:2px solid var(--g200);box-shadow:var(--box-shaddow);overflow:hidden;height:-moz-fit-content;height:fit-content;width:196px}.bookContainer,.bookContainerTabs{display:flex;flex-direction:column;gap:2px;padding:4px}.bookContainerTabs{border-radius:8px;height:100%}.bookContainerTabs .tabItem{text-align:start;padding:8px 16px}.bookContainerTabs .tabItem span{color:var(--g500)}.bookContainerTabs .tabItem:hover{background-color:var(--g100);color:var(--g999)}.bookContainerTabs .tabItem.selected{background-color:var(--g200);color:var(--g999)}.bookContainerTabs .tabItem.selected span{color:var(--g999)}.medal{width:28px;height:28px;aspect-ratio:1;flex-shrink:0;border-radius:8px;display:flex;justify-content:center;align-items:center;background-color:var(--super500-alt);border:2px solid var(--g999)}.uiactionbar{position:fixed;padding:8px;border:1px solid var(--g200);border-radius:16px;width:var(--feed-width);display:flex;bottom:48px;box-shadow:var(--box-shaddow);background-color:var(--surface);gap:16px}.uicolorpreview{width:24px;height:24px;flex-shrink:0;border-radius:8px;border:1px solid var(--g200)}.setlabel{height:100%;display:flex;flex-direction:column}.setlabel p{height:48px;padding-top:16px}.setgroupcontainer{gap:8px}.setgroup,.setgroupcontainer{display:flex;flex-direction:column;width:100%}.setgroup{border-radius:12px;overflow:hidden;border:2px solid var(--g100);cursor:pointer;transition:var(--animate-normal)}.setgroup:hover{border-color:var(--g200)}.setgroup.selected{border-color:var(--g999);width:100%}.setcolor{display:flex;align-items:center;justify-content:center;min-width:48px;min-height:48px;width:100%}.contrastPreview{display:flex;flex-direction:column;min-width:200px;width:200px;height:100%;border:2px solid var(--g100);border-radius:12px;overflow:hidden;gap:2px}.uipalettedetails{width:100%;display:flex;flex-direction:column;gap:24px}.colorCube{width:100%;height:100%;border-radius:0;transition:var(--animate-normal);display:flex;padding:0 16px;align-items:center}.code{width:-moz-fit-content;width:fit-content;padding:4px 8px;border-radius:4px;background-color:var(--g200);display:flex;font-family:monospace}.contrastSlider{display:flex;align-items:center;width:100%;gap:16px;height:48px}.contrastSliderContainer{display:flex;flex-direction:column;justify-content:space-between;width:100%;height:100%;gap:8px;padding:8px 0}.surfaceIndicators{width:40px;height:40px;border:2px solid var(--g200);border-radius:8px;display:flex;align-items:center;justify-content:center;position:absolute;left:4px;bottom:4px;overflow:hidden}.previewSection{display:flex;width:100%;gap:16px;padding-top:48px}.colorMatrixContainer{display:flex;width:100%;padding:24px}.colorMatrix{display:flex;flex-direction:column;gap:4px;width:100%}.matrixCube{display:flex;justify-content:center;align-items:center;width:100%;height:100%;min-height:48px;transition:var(--animate-slow)}.matrixCube.dim{opacity:.16}.previewTabs{display:flex;flex-direction:column;gap:2px;min-width:256px;border:none;padding:8px}.previewTab,.previewTabs{transition:var(--animate-normal)}.previewTab{padding:8px 16px;border-radius:8px;cursor:pointer;text-align:start;color:var(--g500);background-color:var(--surface)}.previewTab:hover{background-color:var(--g50);border:none}.previewTab.selected{background:var(--g100);color:var(--g999)}.textboxHexStyle{position:relative}.pickerPopup{position:absolute;display:flex;flex-direction:column;gap:8px;padding:16px;border-radius:16px;background-color:var(--surface);border:2px solid var(--g100);box-shadow:var(--box-shaddow-color-card);z-index:1000000;min-width:256px}.popoverBG{position:fixed;top:0;left:0;width:100%;height:100%;z-index:100;cursor:pointer}.popoverBG.clear{background-color:transparent}.iconPreview{width:100%;flex-direction:column;height:auto;overflow:auto;border-radius:16px;padding:24px}.iconCubeRow,.iconPreview{display:flex;gap:8px}.iconCube{width:100%;min-height:64px;display:flex;justify-content:center;align-items:center;border-radius:8px;aspect-ratio:1}@media screen and (max-width:1720px){:root{--feed-width:1000px}.categoryLink{height:256px}}@media screen and (max-width:1350px){:root{--feed-width:800px}}@media screen and (max-width:1200px){:root{--feed-width:95%;--update-width:95%}body{margin-top:var(--sidenav-mobile-height)}.container{width:90%}.contentContainer{margin-left:unset}.navItem{padding:16px 24px}.generatorContainer{height:calc(100vh - 68px)}.modalCard-m,.modalCard-s{width:90%;max-width:400px}.modalCard-L{width:90%}.toast{left:calc(50% - 80px)}.tabsContainer{width:100%;overflow:auto}.container.discord{margin:24px 0}.mobileExportButtonContainer{position:absolute;right:8px}.updateContainer{display:flex;flex-direction:column;padding:0;margin-top:48px}.colorPickerManualValuesContainer{overflow-x:scroll}.harmonyExampleGrid{grid-template-columns:1fr}.updateHeader{padding:0 24px}.categoryGrid,.exploreGrid{grid-template-columns:1fr 1fr}.uipalettedetails{grid-template-columns:1fr}.aboutHeroMascot{width:80%}}[data-theme=dark]{color-scheme:dark;--surface:#000;--g50:#0e0e0e;--g100:#161616;--g150:#202020;--g200:#2a2a2a;--g300:#3c3c3c;--g400:#4e4e4e;--g500:#636363;--g600:#7b7b7b;--g700:#999;--g800:#bababa;--g900:#e0e0e0;--g999:#fff;--harmonyCover:#00000000;--super500:#403600;--super500-alt:#fbac23;--super600:#5b3f00;--contrastFail:#272727;--contrastA:#d03e3e;--contrastAA:#408321;--contrastAAA:#408321;--red:#d03e3e;--red16:#d03e3e16;--red24:#d03e3e24;--green500:#66ec27;--dmgreen500:#408321;--surface25:#00000040;--surface50:#00000080;--surface75:#000000b3;--surface90:#000000e6;--box-shaddow:0px 16px 24px 0px #00000036;.button.discord{color:var(--g999)}.button.discord:hover{background-color:#434fcf}.invert{filter:invert(1)}.button.super,.button.super:hover{color:var(--surface)}.button.support:hover{border-color:var(--super500-alt);color:var(--surface)}.medal{background-color:var(--super500-alt);color:var(--surface);border:2px solid var(--super500-alt)}}@font-face{font-family:__Nunito_ff4b98;font-style:normal;font-weight:200 1000;font-display:optional;src:url(/_next/static/media/bde16c1724335d95.woff2) format("woff2");unicode-range:U+0460-052f,U+1c80-1c8a,U+20b4,U+2de0-2dff,U+a640-a69f,U+fe2e-fe2f}@font-face{font-family:__Nunito_ff4b98;font-style:normal;font-weight:200 1000;font-display:optional;src:url(/_next/static/media/8a9e72331fecd08b.woff2) format("woff2");unicode-range:U+0301,U+0400-045f,U+0490-0491,U+04b0-04b1,U+2116}@font-face{font-family:__Nunito_ff4b98;font-style:normal;font-weight:200 1000;font-display:optional;src:url(/_next/static/media/0610ebff456d6cfc.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01a0-01a1,U+01af-01b0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1ea0-1ef9,U+20ab}@font-face{font-family:__Nunito_ff4b98;font-style:normal;font-weight:200 1000;font-display:optional;src:url(/_next/static/media/e3b8d441242e07fb.woff2) format("woff2");unicode-range:U+0100-02ba,U+02bd-02c5,U+02c7-02cc,U+02ce-02d7,U+02dd-02ff,U+0304,U+0308,U+0329,U+1d00-1dbf,U+1e00-1e9f,U+1ef2-1eff,U+2020,U+20a0-20ab,U+20ad-20c0,U+2113,U+2c60-2c7f,U+a720-a7ff}@font-face{font-family:__Nunito_ff4b98;font-style:normal;font-weight:200 1000;font-display:optional;src:url(/_next/static/media/21ed5661b47f7f6d.p.woff2) format("woff2");unicode-range:U+00??,U+0131,U+0152-0153,U+02bb-02bc,U+02c6,U+02da,U+02dc,U+0304,U+0308,U+0329,U+2000-206f,U+20ac,U+2122,U+2191,U+2193,U+2212,U+2215,U+feff,U+fffd}@font-face{font-family:__Nunito_Fallback_ff4b98;src:local("Arial");ascent-override:99.46%;descent-override:34.73%;line-gap-override:0.00%;size-adjust:101.65%}.__className_ff4b98{font-family:__Nunito_ff4b98,__Nunito_Fallback_ff4b98;font-style:normal}