@charset "UTF-8";:root{--color-bg:#212121;--color-inverted:#fff;--size-gutter:1rem;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0}body,html{height:-webkit-fill-available;min-height:100vh;min-height:-webkit-fill-available}@media (max-width:850px){body,html{overflow-x:hidden;width:100vw}}html{font-size:calc(.75rem + 1.15vh);font-family:Inter UI,sans-serif}body{background:var(--color-bg);overflow:hidden}body.lightmode{--color-bg:#fff;--color-inverted:#000}a{color:inherit}.icons{display:none}.icons svg path{stroke-width:2px}button{border:none;width:auto;overflow:visible;touch-action:manipulation;background:transparent;color:inherit;font:inherit;line-height:normal;-webkit-font-smoothing:inherit;-moz-osx-font-smoothing:inherit;-webkit-appearance:none}.wrap__hasGradients .color:after{opacity:.5;content:"";position:absolute;inset:0;box-shadow:0 0 10rem var(--color-text)}.wrap__hasBleed .color:before{position:absolute;inset:0;content:"";background-image:linear-gradient(0deg,var(--color-next) -50%,var(--color) 80%)}.wrap__highContrast .color{color:var(--color-best-contrast)}@media (prefers-contrast:more){.color{color:var(--color-best-contrast)}.panel__setting--contrast{display:none}}.wrap__hasDithering .color:before{mask:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEEAAABBCAMAAAC5KTl3AAAAgVBMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABtFS1lAAAAK3RSTlMWi3QSa1uQOKBWCTwcb6V4gWInTWYOqQSGfa6XLyszmyABlFFJXySxQ0BGn2PQBgAAC4NJREFUWMMV1kWO5UAQRdFk5kwzs/33v8Cunr7ZUehKAdaRUAse99ozDjF5BqswrPKm7btzJ2tRziN3rMYXC236humIV5Our7nHWnVdFOBojW2XVnkeu1IZHNJH5OPHj9TjgVxBGBwAAmp60WoA1gBBvg3XMFhxUQ4KuLqx0CritYZPPXinsOqB7I76+OHaZlPzLEcftrqOlOwjeXvuEuH6t6emkaofgVUDIb4fEZB6CmRAeFCTq11lxbAgUyx4rXkqlH9I4bTUDRRVD1xjbqb9HyUBn7rhtr1x+x9Y0e3BdX31/loYvZaLxqnjbRuokz+pPG7WebnSNKE3yE6Tka4aDEDMVYr6Neq126c+ZR2nzzm3yyiC7PGWG/1uueqZudrVGYNdsgOMDvt1cI8CXu63QIcPvYNY8z870WwYazTS7DqpDEknZqS0AFXObWUxTaw0q5pnHlq4oQImakpLfJkmErdvAfhsc7lod0DVT4tuob25C0tQjzdiFObCz7U7eaKGP3s6yQVgQ/y+q+nY6K5dfV75iXzcNlGIP38aj22sVwtWWKMRb7B5HoHPaBvI1Ve5TSXATi66vV6utxsV+aZNFu+93VvlrG/oj8Wp67YT8l+Oq6PjwdGatFm7SEAP13kE0y9CEcf9qhtEWCMIq5AGq71moEAI9vrmFcmO8+7ZyDnmRN/VUaFkM2ce8KuBGFzDMmY6myLfQGra2ofgHhbJRXuRDZ4H+HmliWBHXQ0ysLGfv6FetbxtxzRgIZWjIsGVFl5imPXeyvVyayNek+dSWzjXd4t310YBdaF8sXeKs481PjsXbAtIru2+wHbv3GVh3sQY6Dnu6pF3pZ714VYdDi9A5GkXR/6xgaZN/tpQ8wVV3zeBuB+njoBNE4wjc+uA523ysXGd/P2sntmOb3OdHNWP5OVrxD3eJHdtH8QVkEIAqCor3hReR96yqt6PkTQfenllooQ447h6tOrnnuzwA8fMpq+jqg1oW8fTYYIncAYpVeTvkEFr/khQSbjoE8ykx9049OkE5MQEO9lC24tT7DwThQgf4Fhf8nGgAo3GYaON3crODpOr2pu5dBABz69t7F5yJBBo+r6QJdeLDWEoO7r1tceR3haA7gc7eZrCvpxSXXeKpo4P+hRixo9DeOFbqQVjKyWfBg9pnrEZKzK7R437YTTwhfoySG/YOCt3fs4aXlU3FjKortqQ6XyXaD0+Y/8VoqpyU9TRW45eN4oBxAH8Y/jLnNXfELJW+/p/MgO9Z+mBli2qqAP7dV/Arc2+YZRZwtBW8/p32y5ZsEuCS4O5AAgfR7Dde7zhiGfgvurQkfAXIrUG61rmxc2EZo18ph4vaWZI+QM0JdsbNlBJlPlwf9uguujQJy0j7TgTHdtRnjybTg55Hkk9S6l2rpYahumSewKHVosa1bh2Y6r9JGkdKvIDN/eeAwScrfjoLkCxWJuFZQ53FNP5w9XbQd1HhgHcVB/0fATG3sUUid1RTfc2+7pZVKldFSsaEK0v4k90tapQOk2HIbMhaJQtrUEL5+3sDanh8sOpbYRoQoqXWu6SQcUTQL9jzOrXNPWCJwXge4U7tlU1hkF012cAmvp8llQxf1IEMcw14pURxVOWATz4ITnYQjuF+vDXg5hgoiqXzO6mS91FQUBheURHIJxUeU1i3P0WOMpsm7vFYk0JJi/Ev+X3FwYD69cARPuP5GIc0PxoAFjcLRbNur0iMTrQmBBNYJ2ngU4x7SWfdTRl52Bqv7LmYW3C1CyTCPTHeWWIAM/Whm32COHsaj+2UQ739XB9t6NV0o9E9b7CW3XNiXzi9e0KiE+3rntukdIDBWrU2jsfQWuyFJRANxq8StHVv1JPy2C3Byco7qdNbASrnNXZ8G0L/Wp/pif4Ai9aEZ9Bb+TRx+REBdGlkF/s0dUdMSMr+6YCbuGxqPWdzcdqutvqkBzCksFcwAtjf55TeuH79M6AQa7r5PLeXxMFIlQKrXP9VJ275WGX+ptpf+tvTDBsecPnYQAlAWrVbRVJ7K2pRHwIjtSpbX96Y/lbKk6ZWXlBmh15r8yAWQsYxXgBOXYMAfHnUXF+rDqnB8bXDRtAn7bCziIqetSboK3NexMePvsCRLvmsoREA+kH8j4HWFpnNEaWgOmR7xyXHfTaz3slHc/YA6H6tl/L8d5tPcIwwD0tjvRaq3Y5BmYBSDClpv0VIX4s8D0XK3sPdpAb94HjPLkgboEz9EdZATW6ZdcmQvtKUwoWw+nAVKA7IcdY1UHnvNnIBplKci+knzewLz5/GGnzkGuuGky+0LTjtGBGR85EQICDqKChnm5pH3Z44nnWAk1YRdyu3g7QoFZ0h8jkr2ffjKmi+Qvsp+9GvNGZHmgW+YQAGUw7PPt8IPKbdy432vhKtRJjKWcSqq7helj81o3nfmaxVZ7Sqie8OOBk9WsyTD/ab7fQ5aWwQeJvnH6+ayo4IdIkOSBJjzXkgr+1TPhAx1AXDsxtCCj3TzQTLA1p782f7a8vdgPfwwrXmZxxbqo2h+6Zlo6mcMY4V7cFBOLm17VCvx9Qa2tAnkxEB+KYyQgbgAAnmNDOdOO6y2Cb+lke1MWQc9o+EMdQf7ubIG3Ek8GZ4k1PtGjbhwgOMPp5Em59JMVk/jU8/aF73Xcrd3UBNZyueQu0/xz2aGtZT8CRziOax2BWFXaeDzgZNV7oRtUzFoijoETf3xkAFFk3OMb7SgPh5wxU1+MygDIp9gZChH2qEcpgLh8pBIK90PXT1ZSU+ZExFK4Vm4GL/J7+K13lS5dQkW4HQwl6GX4yLqu8GhGWS2k75yel5IZIfFNdAL0NpKr2N5dQesBnxa42DLgJd6agS1jJsp1mO1dip7PU4P6diLLoTsZ4m3Q0QweiqeFfIGPLgF6v6mSVv6xe85VBD/1Mpe3AurRbcJ9SEo8NszNVy8rOCEexyIFcJRvYAlI/wk2I7r3p60FFLQXoH2q9xri/m41svRPbW0/EnPn2DWsmk0IiPpB60aa3+hiFfWuC8ZvWKEd9LxAk3HcOof6d77RewPaPsGw5lQAHcZN2vx1448u9pLfMLGQ3BSRRjBzRhKt7HcCw/7aqjtCDs5q76b4ZGphxN2th1WeXYlfnozX3ebKtX4Te11hf1tZP1diiGjIDAB1cR4Sb9rcFPC/nBARjlgDxd+tCBb1t91j71xJcgGjT3g/dUFnXXNiDrxkyoHANPk58ACPUa42hj8tgGrhiXOCmygxFZBiT2wyAJTDJ4wJEPmp6JIrDaSWYNqv4xH2wwdSTGYb3E0pXnS39nmLUsqoVZxzSoegqzd0o06wdbTXsaHGL+IF4JtIcXddTcD/dCd8hVf+fWPSV553kjMmMEULLS8HcgmptDO955dLGX78PjiDA6IsTHPm5IA6bc5ha0gaGkoEttXuxU11B2dOJ65/Q08tEF1+Y9cr2Nh/VECfQ33GyvR/gsdN1LuIeLpKMCAF2yRr769g9/4aJLZNRI71m2S91+Kp+Q0zubTcxoG2/6gm1Q79wkMj2XNO2ui7nWw8ULtu27CCvqTGX2PffD+xcwgh/TrOKvGZMM5jRFGDTn4NO/lwnDR/GY/waDZtkWDUPI0O8ztcFVqp6r2ZW+2bvkJ3raptYagFqu95VdIaml2CIp6CKets34x+fH2C+zH4cVFO7vj+6k2FU39PtRhWluYeZ3gDz1TLB9K2v7SD9gJU1qDxoRDrAWcrFGLyndhdtd0505+gEP79adK8fmFCWNYC+ahzVNcRH79E8dA1iqX/N0qq22xcOc20ALxLDspEj4QCFBQMgaIwoKbxr0Bd7Sbws6GiRK6tqoPfpiCle23axejRLyO1I+ahsEpWrzT5ZsCyS5RcY9jMfENFxSnhKsrfW8JHH6/rdQUMfmQPT3Uz9gY0C/pu1yuCnrPUvio0a1qMEosA/EwIzzid7cqsAAAAASUVORK5CYII="),linear-gradient(#000 -100%,transparent);-webkit-mask:url("data:image/png;base64,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"),linear-gradient(#000 -100%,transparent)}.wrap__hasOutlines .panel,.wrap__hasOutlines .panel-share{border:2px solid var(--color-bg)}@media (max-width:850px){.wrap__hasOutlines .panel,.wrap__hasOutlines .panel-share{z-index:11;border-width:2px 4px}}.wrap__hasOutlines .refresh,.wrap__hasOutlines .settings,.wrap__hasOutlines .share{box-shadow:0 0 0 4px var(--color-gb)}.wrap__hasOutlines .colors .color:before{z-index:10;content:"";position:absolute;top:-2px;left:0;bottom:-2px;right:0;border:4px solid var(--color-bg)}.bg,.bg-wrap,.panel,.panel-share,.wrap{position:absolute;inset:0}.wrap{overflow:hidden}.bg{opacity:0;transform:scale(.7);transition:opacity .3s linear,transform .22s ease-out 50ms}.bg-wrap{overflow:hidden;height:-webkit-fill-available;min-height:100vh;min-height:-webkit-fill-available}.wrap__hasBackground .bg{opacity:1;transform:scale(1.3)}.colors,.panel,.panel-share{position:absolute;left:50%;bottom:10vmin;top:10vmin;display:flex;flex-direction:column;transform:translateX(-50%);width:52%}@media (max-width:850px){.colors,.panel,.panel-share{width:auto;left:10vmin;right:10vmin;bottom:12vmin;transform:none}}.colors__title{display:none}.color{position:relative;display:flex;background-color:var(--color);color:var(--color-text);align-items:center;padding:0 max(var(--size-gutter),calc((10 - var(--colors))*1vmin));flex-grow:1;transition:color 0ms linear,background-color 0ms linear,padding-bottom .25s cubic-bezier(.7,.3,.3,1) .1s;min-height:.1vmax}@media (max-width:850px){.color{flex-direction:column;align-items:flex-start;justify-content:center;min-height:0}}.color:hover,.color:last-child{padding-bottom:6.47212rem}.wrap__sameHeightColors .color:last-child{padding-bottom:0}.color ::selection{color:var(--color);background-color:var(--color-text)}.colors:hover .color:last-child{padding-bottom:.7rem}.colors:hover .color:hover{padding-bottom:6.47212rem}.color__info{display:none;opacity:1;position:absolute;top:5.5rem;font-size:.75em}.color__info ol,.color__info ul{list-style:none;font-size:.7em}.color__info li{margin-top:.5em}.color:hover .color__info{opacity:1;transition:opacity .3s}.color__values{flex-grow:1;padding-right:var(--size-gutter);font-size:.75em;font-family:Space Mono,monospace;display:flex}@media (max-width:850px){.color__values{font-size:.6em;flex-grow:0}}.color__contrasts{opacity:0;transition:opacity .2s;position:absolute;left:0;top:50%;transform:translateY(-50%);height:10px;transform:.2s opacity linear}.wrap__showcontrast .color__contrasts{opacity:1;transition-delay:.3s}@media (max-width:850px){.color__contrasts{left:auto;right:var(--size-gutter)}.wrap__hidetext .color__contrasts{top:1.1rem}}.wrap__showcontrast .color:hover .color__contrasts{opacity:0}@media (max-width:850px){.wrap__showcontrast .color:hover .color__contrasts{opacity:1}}.color__contrasts ol{display:flex;height:100%;list-style-type:none}.color__contrasts ol li{position:relative;height:8px;width:8px;border-radius:5px;background:var(--paircolor)}.wrap__hasBleed .color__contrasts ol li{box-shadow:0 0 5px var(--paircolor)}.color__contrasts ol li+li{margin-left:5px}.color__contrasts var{position:absolute;display:none}.color__value{font-style:normal;font-family:Inter UI,sans-serif}.color__value span,.color__value sup{font-family:Space Mono,monospace}.color__name{font-size:1em;text-align:right;font-weight:300;letter-spacing:-.02em}@media (max-width:850px){.color__name{text-align:left;font-weight:400;overflow:hidden}}.color__name,.color__values{position:relative;z-index:1;opacity:1;transition:opacity .1s linear}@media (max-width:850px){.color__name,.color__values{display:block;width:100%;text-overflow:ellipsis;white-space:nowrap}}.color:first-child .color__name,.color:first-child .color__value{transition-delay:50ms}.color:nth-child(2) .color__name,.color:nth-child(2) .color__value{transition-delay:.1s}.color:nth-child(3) .color__name,.color:nth-child(3) .color__value{transition-delay:.15s}.color:nth-child(4) .color__name,.color:nth-child(4) .color__value{transition-delay:.2s}.color:nth-child(5) .color__name,.color:nth-child(5) .color__value{transition-delay:.25s}.color:nth-child(6) .color__name,.color:nth-child(6) .color__value{transition-delay:.3s}.color:nth-child(7) .color__name,.color:nth-child(7) .color__value{transition-delay:.35s}.color:nth-child(8) .color__name,.color:nth-child(8) .color__value{transition-delay:.4s}.color:nth-child(9) .color__name,.color:nth-child(9) .color__value{transition-delay:.45s}.color:nth-child(10) .color__name,.color:nth-child(10) .color__value{transition-delay:.5s}.color:nth-child(11) .color__name,.color:nth-child(11) .color__value{transition-delay:.55s}.wrap__hidetext .color__name,.wrap__hidetext .color__value,.wrap__showcontrast .color__value{opacity:0}@media (max-width:850px){.wrap__showcontrast .color__value{opacity:1}}@media (max-width:850px){.wrap__showcontrast.wrap__hidetext .color__value{opacity:0}}.wrap__showcontrast .color:hover .color__value{opacity:1;transition-delay:.35s}.wrap__showcontrast.wrap__hidetext .color:hover .color__value{opacity:0;transition-delay:.35s}.buttons{position:absolute;right:24%;bottom:10vmin;display:flex;z-index:20;transform:translate(1.1em,1.1em);transition:transform .5s ease-in 0ms,right .5s cubic-bezier(.3,.7,0,1) 50ms,bottom .5s cubic-bezier(.3,.7,0,1) 50ms}@media (max-width:850px){.buttons{right:10vmin;bottom:12vmin}}.wrap__sameHeightColors .buttons{right:50%;transform:translate(50%,1.1em)}@media (max-width:850px){.wrap__sameHeightColors .buttons{right:10vmin;transform:translate(1.1em,1.1em)}}.button{transform:translateX(0);transition:transform .5s cubic-bezier(.3,.7,0,1) .1s,opacity .2s .2s}.button:first-child{transition-delay:.1s}.button:nth-child(2){transition-delay:.15s}.button:nth-child(3){transition-delay:.2s}.button:nth-child(4){transition-delay:.25s}.button:nth-child(5){transition-delay:.3s}.wrap__hideUI .button{opacity:0;transform:translateY(10vh);transition:transform .3s cubic-bezier(.3,.7,0,1),opacity .2s}.wrap__hideUI .button:first-child{transition-delay:.25s}.wrap__hideUI .button:nth-child(2){transition-delay:.2s}.wrap__hideUI .button:nth-child(3){transition-delay:.15s}.wrap__hideUI .button:nth-child(4){transition-delay:.1s}.wrap__hideUI .button:nth-child(5){transition-delay:50ms}.wrap__showSettings .button{transform:translateX(13vw)}.wrap__showSettings .button:nth-child(4){transition-delay:.1s}.wrap__showSettings .button:nth-child(3){transition-delay:.15s}.wrap__showSettings .button:nth-child(2){transition-delay:.2s}.wrap__showSettings .button:first-child{transition-delay:.25s}.wrap__showSettings .button:nth-child(0){transition-delay:.3s}@media (max-width:850px){.wrap__showSettings .button{transform:translateX(0)}}.wrap__showShare .button{transform:translateX(-13vw)}.wrap__showShare .button:first-child{transition-delay:.1s}.wrap__showShare .button:nth-child(2){transition-delay:.15s}.wrap__showShare .button:nth-child(3){transition-delay:.2s}.wrap__showShare .button:nth-child(4){transition-delay:.25s}.wrap__showShare .button:nth-child(5){transition-delay:.3s}@media (max-width:850px){.wrap__showShare .button{transform:translateX(0)}}.button{position:relative;margin:0;padding:0;font-size:2em;width:1.2em;height:1.2em;background:var(--color-last,#212121);color:var(--color-last-contrast,var(--color-inverted));border-radius:50%;outline:0;box-shadow:0 0 0 1px hsla(0,0%,100%,0)}.button+.button{margin-left:calc(var(--size-gutter)*0.6)}.button svg{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);opacity:.8;width:.6em;height:.6em;animation-name:rotate;animation-duration:3s;animation-iteration-count:infinite;animation-timing-function:linear;animation-play-state:paused;line-height:1;stroke:var(--color-last-contrast,var(--color-inverted));color:var(--color-last-contrast,var(--color-inverted))}.button.refresh svg{width:.55em;height:.55em}.button:hover svg{animation-play-state:running}.settings:after,.share:after{content:"×";position:absolute;top:50%;left:50%;margin-top:-.05em;transform:translate(-50%,-50%) scale(.2);opacity:0;font-weight:300}.wrap__showSettings .settings:after,.wrap__showShare .share:after{opacity:1;transition:opacity .1s linear 50ms,transform .3s cubic-bezier(.3,0,.7,1.8);transform:translate(-50%,-50%) scale(.75)}.wrap__showSettings .settings svg,.wrap__showShare .share svg{transition:opacity .1s linear;opacity:0}.share svg{animation:none;stroke-dasharray:20 20;stroke-dashoffset:0;width:.55em;height:.55em;stroke:var(--color-last-contrast,var(--color-inverted));stroke-width:1px;margin-top:.01em;margin-left:-.03em}.share:hover svg{animation:outline 1s cubic-bezier(.7,.3,0,1)}.panel,.panel-share{opacity:0;pointer-events:none;box-sizing:border-box;padding:calc(var(--size-gutter)*2);padding-right:calc(25% + var(--size-gutter)*2);background:var(--color-bg);display:block;cursor:default;color:var(--color-inverted);transform:translateX(-50%) scale(.95)}.panel-share ::selection,.panel ::selection{color:var(--color-first-contrast);background:var(--color-first)}@media (max-width:850px){.panel,.panel-share{padding:var(--size-gutter);background:rgba(33,33,33,.8)}.lightmode .panel,.lightmode .panel-share{background:hsla(0,0%,100%,.8)}@supports (-webkit-backdrop-filter:blur(10px)) or (backdrop-filter:blur(10px)){.panel,.panel-share{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background:rgba(33,33,33,.1)}.lightmode .panel,.lightmode .panel-share{background:hsla(0,0%,100%,.8)}}}.panel-share input[type=checkbox],.panel input[type=checkbox]{display:none}input[type=checkbox]:checked+.panel-share__checkbox svg,input[type=checkbox]:checked+.panel__checkbox svg{opacity:1;transform:translate(-50%,-50%) scale(1)}.panel-share__checkbox,.panel__checkbox{position:relative;display:inline-block;width:.8em;height:.8em;border:1px solid var(--color-inverted);margin-top:-.3em;flex:0 0 0.8rem}.panel-share__checkbox svg,.panel__checkbox svg{opacity:0;transform:translate(-50%,-50%) scale(.1);transition:opacity 60ms linear,transform .12s cubic-bezier(.7,.3,.8,2);position:absolute;top:50%;left:50%;width:100%;height:100%}.panel-share__section,.panel-share__setting,.panel__section,.panel__setting{display:block;touch-action:manipulation}.panel-share__section+.panel-share__section,.panel-share__section+.panel-share__setting,.panel-share__section+.panel__section,.panel-share__section+.panel__setting,.panel-share__setting+.panel-share__section,.panel-share__setting+.panel-share__setting,.panel-share__setting+.panel__section,.panel-share__setting+.panel__setting,.panel__section+.panel-share__section,.panel__section+.panel-share__setting,.panel__section+.panel__section,.panel__section+.panel__setting,.panel__setting+.panel-share__section,.panel__setting+.panel-share__setting,.panel__setting+.panel__section,.panel__setting+.panel__setting{margin-top:calc(var(--size-gutter)*2)}.panel-share__section--checkbox+.panel-share__section--checkbox,.panel-share__section--checkbox+.panel-share__setting--checkbox,.panel-share__section--checkbox+.panel__section--checkbox,.panel-share__section--checkbox+.panel__setting--checkbox,.panel-share__setting--checkbox+.panel-share__section--checkbox,.panel-share__setting--checkbox+.panel-share__setting--checkbox,.panel-share__setting--checkbox+.panel__section--checkbox,.panel-share__setting--checkbox+.panel__setting--checkbox,.panel__section--checkbox+.panel-share__section--checkbox,.panel__section--checkbox+.panel-share__setting--checkbox,.panel__section--checkbox+.panel__section--checkbox,.panel__section--checkbox+.panel__setting--checkbox,.panel__setting--checkbox+.panel-share__section--checkbox,.panel__setting--checkbox+.panel-share__setting--checkbox,.panel__setting--checkbox+.panel__section--checkbox,.panel__setting--checkbox+.panel__setting--checkbox{margin-top:var(--size-gutter)}.panel-share__section--inline,.panel-share__setting--inline,.panel__section--inline,.panel__setting--inline{display:flex;align-items:center}.panel-share__section--inline .panel__settingtitle,.panel-share__setting--inline .panel__settingtitle,.panel__section--inline .panel__settingtitle,.panel__setting--inline .panel__settingtitle{margin-left:calc(var(--size-gutter)*0.5)}.panel-share__desc,.panel__desc{margin:1em 0 3em;font-size:.6em}.panel-share select,.panel select{font-size:.8em;border-radius:2rem;padding:.2rem}.panel-share input,.panel-share select,.panel input,.panel select{display:block;box-sizing:border-box;touch-action:manipulation;font-family:Space Mono,monospace;border:none;width:auto}.panel-share input[type=number],.panel-share input[type=text],.panel-share select[type=number],.panel-share select[type=text],.panel input[type=number],.panel input[type=text],.panel select[type=number],.panel select[type=text]{color:var(--color-inverted);background:none;border:none;text-align:right;font-size:.8em}.panel-share input[type=number],.panel-share select[type=number],.panel input[type=number],.panel select[type=number]{flex:0 0 3rem;width:3rem}.panel-share input[type=url],.panel input[type=url]{text-decoration:underline}.panel-share input,.panel input{background-color:transparent}.panel-share input::-webkit-inner-spin-button,.panel-share input::-webkit-outer-spin-button,.panel input::-webkit-inner-spin-button,.panel input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.panel-share input[type=number],.panel input[type=number]{-moz-appearance:textfield}.panel-share input[type=color],.panel-share input[type=range],.panel input[type=color],.panel input[type=range]{-webkit-appearance:none;width:45%;height:2rem;padding:0;margin:0 10% 0 0}.panel-share input[type=color]:last-child,.panel-share input[type=range]:last-child,.panel input[type=color]:last-child,.panel input[type=range]:last-child{margin-right:0}.panel-share input[type=range],.panel input[type=range]{z-index:1;padding-top:.7em;margin:-.7em 0 0}.panel-share input[type=range]:focus,.panel input[type=range]:focus{outline:none}.panel-share input[type=range]:focus::-webkit-slider-thumb,.panel input[type=range]:focus::-webkit-slider-thumb{background-color:var(--color-inverted);clip-path:polygon(100% 0,0 0,50% 100%,50% 100%)}.panel-share input[type=range]::-webkit-slider-runnable-track,.panel input[type=range]::-webkit-slider-runnable-track{width:100%;height:1rem;animate:.2s;background:transparent;color:var(--c-black);border-radius:0;border:solid var(--color-inverted);border-width:0 0 1px}.panel-share input[type=range]::-webkit-slider-thumb,.panel input[type=range]::-webkit-slider-thumb{position:relative;border:2px solid transparent;height:.75rem;width:.5rem;border-radius:0;background:var(--color-inverted);-webkit-appearance:none;margin-top:.25rem;transition:background-color .15s,clip-path .2s,-webkit-clip-path .2s;clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}.panel-share input[type=range]::-moz-range-track,.panel input[type=range]::-moz-range-track{width:100%;height:1rem;animate:.2s;background:transparent;color:var(--c-black);border-radius:0;border:solid var(--color-inverted);border-width:0 0 1px}.panel-share input[type=range]::-moz-range-thumb,.panel input[type=range]::-moz-range-thumb{position:relative;border:2px solid transparent;height:.75rem;width:.5rem;border-radius:0;background:var(--color-inverted);-webkit-appearance:none;margin-top:.25rem;transition:background-color .15s,clip-path .2s,-webkit-clip-path .2s;clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}.panel-share input[type=range]::-ms-track,.panel input[type=range]::-ms-track{width:100%;height:1rem;animate:.2s;background:transparent;color:var(--c-black);border-radius:0;border:solid var(--color-inverted);border-width:0 0 1px}.panel-share input[type=range]::-ms-fill-lower,.panel input[type=range]::-ms-fill-lower{background:var(--color-inverted);border:none;border-radius:100%}.panel-share input[type=range]::-ms-fill-upper,.panel input[type=range]::-ms-fill-upper{background:var(--color-inverted);border-radius:100%;box-shadow:none}.panel-share input[type=range]::-ms-thumb,.panel input[type=range]::-ms-thumb{position:relative;border:2px solid transparent;height:.75rem;width:.5rem;border-radius:0;background:var(--color-inverted);-webkit-appearance:none;margin-top:.25rem;transition:background-color .15s,clip-path .2s,-webkit-clip-path .2s;clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}.panel-share select,.panel select{color:var(--color-inverted);width:100%;box-sizing:border-box;-webkit-appearance:none;border:0;box-shadow:0 1px 0 0 var(--color-inverted);border-radius:0;padding:.25rem 1rem .25rem 0;background-color:transparent}.panel-share select option,.panel select option{color:var(--color-inverted)}.panel-share select:focus,.panel select:focus{outline:none;background-color:transparent}.panel__section{font-size:.7em}.panel__url{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.panel__share{font-size:.6em}.panel__share h4{margin-bottom:1em}.panel__share a{display:inline-block;margin-right:.3em;text-transform:capitalize}.panel__share a:hover{text-decoration:none}.panel-share{padding:calc(var(--size-gutter)*2);padding-left:calc(25% + var(--size-gutter)*2)}@media (max-width:850px){.panel-share{padding:var(--size-gutter)}}.panel__setting--bnw{max-height:0;overflow:hidden;transition:max-height .4s cubic-bezier(.3,.7,0,1),margin-bottom .4s cubic-bezier(.3,.7,0,1),margin-top .4s cubic-bezier(.3,.7,0,1),opacity .2s;opacity:0;margin-bottom:calc(var(--size-gutter)*-1);transition-delay:.1s,0,0,0;margin-top:.5em}.panel__img{position:relative;border:1px solid var(--color-inverted);padding:4px;min-height:2rem}.panel__img:before{position:absolute;content:"";top:0;right:0;background:var(--color-bg);width:3.5rem;height:1.9rem}.panel__img--export{margin-top:1rem}.panel__img--export:before{display:none}@media (max-width:850px){.panel__img{width:fit-content}}.panel__img .icon{width:1rem;height:1rem;content:"▲";position:absolute;top:.5rem;right:.5rem}.panel__img input{position:absolute;inset:0;opacity:0}.panel__img .icon--up{stroke-dasharray:100 30;stroke-dashoffset:0;transition:stroke-dashoffset 3s linear}.panel__img .icon--re:hover{animation-play-state:running}.panel__img .icon--re{right:1.5rem;top:1rem;animation-name:rotate;animation-duration:3s;animation-iteration-count:infinite;animation-timing-function:linear;animation-play-state:paused}.panel__img:hover .icon--up{stroke-dashoffset:-260}.panel__img img{display:block;width:100%}@media (max-width:850px){.panel__img img{width:auto;max-width:100%}}.panel__code{margin-top:1rem;font-size:.6em;font-family:Space Mono,monospace;background:var(--color-inverted);color:var(--color-bg);padding:1rem;overflow-x:hidden;text-overflow:ellipsis}.panel__export{position:relative;margin-bottom:1rem}.panel__export .minibutton+.minibutton{margin-left:.5em}.panel__export .minibutton{z-index:2;display:inline-block;background:var(--color-bg);color:var(--color-inverted);line-height:1;font-size:.6rem;padding:.4em .6em .5em .8em;margin-bottom:.5em;cursor:pointer;transition:opacity .2s ease}.panel__export .minibutton:hover{opacity:.8}.panel__export .minibutton .minibutton__icon--check{display:none}.panel__export .minibutton--download{background:var(--color-inverted);color:var(--color-bg)}.panel__export .minibutton--download svg{stroke:var(--color-bg)}.panel__export .minibutton--copy .minibutton__label{display:none}.panel__export .minibutton--copy:before{content:"jeah!"}.panel__export .minibutton--copy .minibutton__icon{display:none}.panel__export .minibutton--copy .minibutton__icon--check{display:inline-block}.panel__export .minibutton svg{width:1em;height:1em;margin-left:.5em;position:relative;top:.12em}.wrap__showcontrast .panel__setting--bnw{opacity:1;max-height:2em;padding-top:.1em;margin-bottom:0;transition-delay:0,0,0,.1s;margin-top:.5em}.colors,.panel,.panel-share{transition:transform .4s cubic-bezier(.3,.7,0,1)}@media (min-width:850px){.colors,.panel,.panel-share{transition:transform .4s cubic-bezier(.3,.7,0,1),opacity 1ms linear .4s}}@media (min-width:850px){.wrap__showSettings .panel,.wrap__showShare .panel,.wrap__showShare .panel-share{transition-delay:0ms,0ms}.wrap__hasBackground .panel,.wrap__hasBackground .panel-share{box-shadow:none}}.panel,.panel-share{perspective:400px;box-shadow:inset 0 0 0 1px var(--color-inverted);overflow:auto;margin-top:1px;margin-bottom:1px}@media (max-width:850px){.panel,.panel-share{opacity:0;z-index:5;transform:translateX(0) scale(.8);margin-top:0;margin-bottom:0}}.panel{z-index:2}@media (max-width:850px){.panel{z-index:5}}.panel-share{direction:rtl;z-index:1}.panel-share>*{direction:ltr}@media (max-width:850px){.panel-share{z-index:4;direction:ltr}}.colors{z-index:3}.panel__setting{opacity:0;transform:translateX(2rem) scale(1) rotateY(-5deg);transform-origin:150% 50%;user-select:none}@media (max-width:850px){.panel__setting{transform:translateY(120%) scaleY(.5) rotateX(30deg)}}.panel-share .panel__setting{transform:translateX(-2rem) scale(1) rotateY(-5deg);transform-origin:-50% 50%}@media (max-width:850px){.panel-share .panel__setting{transform:translateY(120%) scaleY(.5) rotateX(30deg)}}.wrap__showSettings .panel .panel__setting,.wrap__showShare .panel-share .panel__setting{opacity:1;transform:translateX(0) scale(1) rotateY(0deg);transition:transform .55s cubic-bezier(.3,.7,0,1) 50ms,opacity 475ms linear 50ms}.wrap__showSettings .panel .panel__setting:first-child,.wrap__showShare .panel-share .panel__setting:first-child{transition-delay:30ms,35ms}.wrap__showSettings .panel .panel__setting:nth-child(2),.wrap__showShare .panel-share .panel__setting:nth-child(2){transition-delay:60ms,70ms}.wrap__showSettings .panel .panel__setting:nth-child(3),.wrap__showShare .panel-share .panel__setting:nth-child(3){transition-delay:90ms,105ms}.wrap__showSettings .panel .panel__setting:nth-child(4),.wrap__showShare .panel-share .panel__setting:nth-child(4){transition-delay:.12s,.14s}.wrap__showSettings .panel .panel__setting:nth-child(5),.wrap__showShare .panel-share .panel__setting:nth-child(5){transition-delay:.15s,175ms}.wrap__showSettings .panel .panel__setting:nth-child(6),.wrap__showShare .panel-share .panel__setting:nth-child(6){transition-delay:.18s,.21s}.wrap__showSettings .panel .panel__setting:nth-child(7),.wrap__showShare .panel-share .panel__setting:nth-child(7){transition-delay:.21s,245ms}.wrap__showSettings .panel .panel__setting:nth-child(8),.wrap__showShare .panel-share .panel__setting:nth-child(8){transition-delay:.24s,.28s}.wrap__showSettings .panel .panel__setting:nth-child(9),.wrap__showShare .panel-share .panel__setting:nth-child(9){transition-delay:.27s,315ms}.wrap__showSettings .panel .panel__setting:nth-child(10),.wrap__showShare .panel-share .panel__setting:nth-child(10){transition-delay:.3s,.35s}.wrap__showSettings .panel .panel__setting:nth-child(11),.wrap__showShare .panel-share .panel__setting:nth-child(11){transition-delay:.33s,385ms}.wrap__showSettings .panel .panel__setting:nth-child(12),.wrap__showShare .panel-share .panel__setting:nth-child(12){transition-delay:.36s,.42s}.wrap__showSettings .panel .panel__setting:nth-child(13),.wrap__showShare .panel-share .panel__setting:nth-child(13){transition-delay:.39s,455ms}.wrap__showSettings .panel .panel__setting:nth-child(14),.wrap__showShare .panel-share .panel__setting:nth-child(14){transition-delay:.42s,.49s}.wrap__showSettings .panel .panel__setting:nth-child(15),.wrap__showShare .panel-share .panel__setting:nth-child(15){transition-delay:.45s,525ms}.wrap__showSettings .panel .panel__setting:nth-child(16),.wrap__showShare .panel-share .panel__setting:nth-child(16){transition-delay:.48s,.56s}.wrap__showSettings .panel .panel__setting:nth-child(17),.wrap__showShare .panel-share .panel__setting:nth-child(17){transition-delay:.51s,595ms}.wrap__showSettings .panel .panel__setting:nth-child(18),.wrap__showShare .panel-share .panel__setting:nth-child(18){transition-delay:.54s,.63s}.wrap__showSettings .panel .panel__setting:nth-child(19),.wrap__showShare .panel-share .panel__setting:nth-child(19){transition-delay:.57s,665ms}.wrap__showSettings .panel .panel__setting:nth-child(20),.wrap__showShare .panel-share .panel__setting:nth-child(20){transition-delay:.6s,.7s}.wrap__showSettings .panel .panel__setting:nth-child(21),.wrap__showShare .panel-share .panel__setting:nth-child(21){transition-delay:.63s,735ms}.wrap__showSettings .panel .panel__setting:nth-child(22),.wrap__showShare .panel-share .panel__setting:nth-child(22){transition-delay:.66s,.77s}.wrap__showSettings .panel .panel__setting:nth-child(23),.wrap__showShare .panel-share .panel__setting:nth-child(23){transition-delay:.69s,805ms}.wrap__showSettings .panel .panel__setting:nth-child(24),.wrap__showShare .panel-share .panel__setting:nth-child(24){transition-delay:.72s,.84s}.wrap__showSettings .panel .panel__setting:nth-child(25),.wrap__showShare .panel-share .panel__setting:nth-child(25){transition-delay:.75s,875ms}.wrap__showSettings .panel .panel__setting:nth-child(26),.wrap__showShare .panel-share .panel__setting:nth-child(26){transition-delay:.78s,.91s}.wrap__showSettings .panel .panel__setting:nth-child(27),.wrap__showShare .panel-share .panel__setting:nth-child(27){transition-delay:.81s,945ms}.wrap__showSettings .panel .panel__setting:nth-child(28),.wrap__showShare .panel-share .panel__setting:nth-child(28){transition-delay:.84s,.98s}.wrap__showSettings .panel .panel__setting:nth-child(29),.wrap__showShare .panel-share .panel__setting:nth-child(29){transition-delay:.87s,1015ms}.wrap__showSettings .panel .panel__setting:nth-child(30),.wrap__showShare .panel-share .panel__setting:nth-child(30){transition-delay:.9s,1.05s}.share-url{font-size:.7em}.wrap__showSettings .panel{opacity:1;pointer-events:all;transform:translateX(-75%)}@media (max-width:850px){.wrap__showSettings .panel{transform:none;opacity:1}}.wrap__showSettings .panel-share{opacity:0}.wrap__showShare .panel-share{opacity:1;pointer-events:all;transform:translateX(-25%)}@media (max-width:850px){.wrap__showShare .panel-share{transform:none;opacity:1}}.wrap__showShare .panel{opacity:0}.wrap__showSettings .colors{transform:translateX(-25%)}@media (max-width:850px){.wrap__showSettings .colors{transform:none}}.wrap__showShare .colors{transform:translateX(-75%)}@media (max-width:850px){.wrap__showShare .colors{transform:none}}.panel__settingtitle{font-size:.7rem;font-weight:400;line-height:1;margin-bottom:.4em}.panel__settingtitle i{display:inline-block;font-size:.7em;margin-left:1em}.panel__inputs,.panel__settingtitle{display:flex}.panel__inputs>:first-child,.panel__settingtitle>:first-child{flex:1 0 auto}.panel__inputs{z-index:1}.panel__inputs,.panel__inputs--select{position:relative}.panel__inputs--select svg{width:.8em;height:.8em;position:absolute;right:-.25em;bottom:.35em}.wrap__expandUI .colors,.wrap__expandUI .panel,.wrap__expandUI .panel-share{inset:0}.wrap__expandUI .panel,.wrap__expandUI .panel-share{background:rgba(33,33,33,.25);box-shadow:none}.lightmode .wrap__expandUI .panel,.lightmode .wrap__expandUI .panel-share{background:hsla(0,0%,100%,.5)}.wrap__expandUI .colors{width:100%;transform:translateX(0)}.wrap__expandUI .buttons{bottom:calc(var(--size-gutter)*2.5);right:calc(var(--size-gutter)*2);transform:translate(1.1em,1.1em)}.wrap__expandUI.wrap__sameHeightColors .buttons{right:50%;transform:translate(50%,75%)}@media (max-width:850px){.wrap__expandUI.wrap__sameHeightColors .buttons{bottom:calc(var(--size-gutter)*2.5);right:calc(var(--size-gutter)*2);transform:translate(1.1em,1.9em)}}.wrap__expandUI.wrap__showSettings .colors{transform:translateX(calc(25% + var(--size-gutter)))}@media (max-width:850px){.wrap__expandUI.wrap__showSettings .colors{transform:translateX(0)}}.wrap__expandUI.wrap__showSettings .panel{transform:translateX(0);transition-delay:50ms}.wrap__expandUI.wrap__showSettings .button{transform:translateX(0)}@media (max-width:850px){.wrap__expandUI.wrap__showSettings .button{transform:translateX(5rem)}}@media (max-width:850px){.wrap__expandUI.wrap__showSettings .button.share{transform:translateX(7rem)}}@media (max-width:850px){.wrap__expandUI.wrap__showSettings .button.refresh{transform:translateX(9rem)}}.wrap__expandUI .panel-share{left:auto;right:0;transform:translateX(100%)}.wrap__expandUI.wrap__showShare .colors{transform:translateX(calc(-25% - var(--size-gutter)))}@media (max-width:850px){.wrap__expandUI.wrap__showShare .colors{transform:translateX(0)}}.wrap__expandUI.wrap__showShare .panel-share{transform:translateX(0);transition-delay:50ms}.wrap__expandUI.wrap__showShare .button{transform:translateX(0)}@media (max-width:850px){.wrap__expandUI.wrap__showShare .button,.wrap__expandUI.wrap__showShare .button.share{transform:translateX(2rem)}}@media (max-width:850px){.wrap__expandUI.wrap__showShare .button.refresh{transform:translateX(9rem)}}@keyframes rotate{0%{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(1turn)}}.ellogo{margin:calc(var(--size-gutter)*2) auto var(--size-gutter);display:block;position:relative;width:40%;box-sizing:border-box}.ellogo svg{display:block;height:100%;width:100%;overflow:visible}.ellogo svg path:nth-child(2){fill:none}.ellogo:hover path:nth-child(2){stroke:var(--color-inverted)}.footer{font-size:.7em;margin-top:calc(var(--size-gutter)*2);padding-top:var(--size-gutter);line-height:1.4}.footer h2{font-weight:900}.footer p{margin-top:1em;margin-bottom:2em}.footer aside{margin:2em 0}.footer li,.footer ol,.footer ul{list-style:none}.footer li+li,.footer ol,.footer ul{margin-top:1em}.footer a,.title{color:var(--color-inverted)}.title{font-weight:900;font-size:1rem;margin-bottom:1.75em}.is-imagefetching .button.refresh{animation:pulsate 1s infinite alternate;cursor:wait}.is-imagefetching .colors .color .color__name,.is-imagefetching .colors .color .color__values{animation:pulsate .5s infinite alternate}.is-imagefetching .colors .color:first-child .color__name,.is-imagefetching .colors .color:first-child .color__values{animation-delay:.1s}.is-imagefetching .colors .color:nth-child(2) .color__name,.is-imagefetching .colors .color:nth-child(2) .color__values{animation-delay:.2s}.is-imagefetching .colors .color:nth-child(3) .color__name,.is-imagefetching .colors .color:nth-child(3) .color__values{animation-delay:.3s}.is-imagefetching .colors .color:nth-child(4) .color__name,.is-imagefetching .colors .color:nth-child(4) .color__values{animation-delay:.4s}.is-imagefetching .colors .color:nth-child(5) .color__name,.is-imagefetching .colors .color:nth-child(5) .color__values{animation-delay:.5s}.is-imagefetching .colors .color:nth-child(6) .color__name,.is-imagefetching .colors .color:nth-child(6) .color__values{animation-delay:.6s}.is-imagefetching .colors .color:nth-child(7) .color__name,.is-imagefetching .colors .color:nth-child(7) .color__values{animation-delay:.7s}.is-imagefetching .colors .color:nth-child(8) .color__name,.is-imagefetching .colors .color:nth-child(8) .color__values{animation-delay:.8s}.is-imagefetching .colors .color:nth-child(9) .color__name,.is-imagefetching .colors .color:nth-child(9) .color__values{animation-delay:.9s}.is-imagefetching .colors .color:nth-child(10) .color__name,.is-imagefetching .colors .color:nth-child(10) .color__values{animation-delay:1s}.is-imagefetching .colors .color:nth-child(11) .color__name,.is-imagefetching .colors .color:nth-child(11) .color__values{animation-delay:1.1s}.is-loading .bg{opacity:0}.is-loading .panel,.is-loading .panel-share{opacity:0;display:none}.is-loading.is-animating{pointer-events:none}.is-loading.is-animating .bg{opacity:0}.is-loading.is-animating .colors{perspective:600px}.is-loading.is-animating .color{opacity:0;transform:translateY(0) scaleY(.5) rotate3d(.1,0,0,80deg);transform-origin:50% 150%}.is-loading.is-animating .color:after{opacity:0}.is-loading.is-animating .color .color__name,.is-loading.is-animating .color .color__value{opacity:0;visibility:hidden}.is-loading.is-animating .color:last-child{padding-bottom:0}.is-loading.is-animating .panel,.is-loading.is-animating .panel-share{display:none}.is-loading.is-animating .button{opacity:0}.is-animating{pointer-events:none}.is-animating .panel,.is-animating .panel-share{display:none}.is-animating .button{opacity:0}.is-animating .colors{perspective:600px}.is-animating .color{opacity:1;transform:translateY(0) scaleY(1);transform-origin:50% 0;transition:opacity .25s linear,transform .2s cubic-bezier(.445,.05,.55,.95)}.is-animating .color:after{visibility:hidden;opacity:0;animation:reveal .5s linear;animation-fill-mode:forwards}.is-animating .color .color__name,.is-animating .color .color__value{transition:opacity .1s linear}.is-animating .color:first-child{transition-delay:.19s,.11s;transition-duration:255ms,205ms}.is-animating .color:first-child:after{animation-delay:.85s}.is-animating .color:first-child .color__name,.is-animating .color:first-child .color__value{transition-delay:.52s,.52s}.is-animating .color:nth-child(2){transition-delay:.25s,.17s;transition-duration:.27s,.22s}.is-animating .color:nth-child(2):after{animation-delay:.9s}.is-animating .color:nth-child(2) .color__name,.is-animating .color:nth-child(2) .color__value{transition-delay:.59s,.59s}.is-animating .color:nth-child(3){transition-delay:.31s,.23s;transition-duration:295ms,245ms}.is-animating .color:nth-child(3):after{animation-delay:.95s}.is-animating .color:nth-child(3) .color__name,.is-animating .color:nth-child(3) .color__value{transition-delay:.66s,.66s}.is-animating .color:nth-child(4){transition-delay:.37s,.29s;transition-duration:.33s,.28s}.is-animating .color:nth-child(4):after{animation-delay:1s}.is-animating .color:nth-child(4) .color__name,.is-animating .color:nth-child(4) .color__value{transition-delay:.73s,.73s}.is-animating .color:nth-child(5){transition-delay:.43s,.35s;transition-duration:375ms,325ms}.is-animating .color:nth-child(5):after{animation-delay:1.05s}.is-animating .color:nth-child(5) .color__name,.is-animating .color:nth-child(5) .color__value{transition-delay:.8s,.8s}.is-animating .color:nth-child(6){transition-delay:.49s,.41s;transition-duration:.43s,.38s}.is-animating .color:nth-child(6):after{animation-delay:1.1s}.is-animating .color:nth-child(6) .color__name,.is-animating .color:nth-child(6) .color__value{transition-delay:.87s,.87s}.is-animating .color:nth-child(7){transition-delay:.55s,.47s;transition-duration:495ms,445ms}.is-animating .color:nth-child(7):after{animation-delay:1.15s}.is-animating .color:nth-child(7) .color__name,.is-animating .color:nth-child(7) .color__value{transition-delay:.94s,.94s}.is-animating .color:nth-child(8){transition-delay:.61s,.53s;transition-duration:.57s,.52s}.is-animating .color:nth-child(8):after{animation-delay:1.2s}.is-animating .color:nth-child(8) .color__name,.is-animating .color:nth-child(8) .color__value{transition-delay:1.01s,1.01s}.is-animating .color:nth-child(9){transition-delay:.67s,.59s;transition-duration:655ms,605ms}.is-animating .color:nth-child(9):after{animation-delay:1.25s}.is-animating .color:nth-child(9) .color__name,.is-animating .color:nth-child(9) .color__value{transition-delay:1.08s,1.08s}.is-animating .color:nth-child(10){transition-delay:.73s,.65s;transition-duration:.75s,.7s}.is-animating .color:nth-child(10):after{animation-delay:1.3s}.is-animating .color:nth-child(10) .color__name,.is-animating .color:nth-child(10) .color__value{transition-delay:1.15s,1.15s}.is-animating .color:nth-child(11){transition-delay:.79s,.71s;transition-duration:855ms,805ms}.is-animating .color:nth-child(11):after{animation-delay:1.35s}.is-animating .color:nth-child(11) .color__name,.is-animating .color:nth-child(11) .color__value{transition-delay:1.22s,1.22s}.is-animating .color:last-child{padding-bottom:0}.is-animating .bg{opacity:0}@keyframes reveal{0%{visibility:hidden;opacity:0}1%{visibility:visible;opacity:0}to{visibility:visible;opacity:.5}}@keyframes pulsate{to{opacity:.25}}@keyframes outline{to{stroke-dashoffset:40}}@media (prefers-reduced-motion){*{animation-duration:.001ms!important;animation-delay:0s!important;transition-delay:0s!important;transition-duration:.001ms!important}}