.hslWheel.svelte-1fl0125{aspect-ratio:1;--outerInset:.04;width:100%;margin-top:2em;margin-bottom:2em;margin-right:2em;position:relative;container-type:inline-size}.hslWheel.svelte-1fl0125:after,.hslWheel.svelte-1fl0125:before{content:"";pointer-events:none;border-radius:50%;position:absolute;inset:0}.hslWheel.svelte-1fl0125:after{background:var(--cc,var(--bg));background-image:radial-gradient(circle, transparent 10%, var(--bg) 10%);width:20%;height:20%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.hslWheel.svelte-1fl0125:before{inset:calc(100% * var(--outerInset));box-shadow:0 0 0 var(--lineWidth) var(--line)}.hslWheel__rim.svelte-1fl0125{transform:scale(calc(1 - calc(.2 + var(--i) * .6)));background:conic-gradient(var(--gradStep));cursor:none;border-radius:50%;outline:none;position:absolute;inset:0}.hslWheel__rim--inner.svelte-1fl0125{pointer-events:none}.hslWheel__label.svelte-1fl0125{width:calc(100% - 100% * var(--outerInset) * 2);transform:translate(-50%, -50%) rotate(calc(var(--i) * 360deg - 90deg));z-index:2;pointer-events:none;font-size:.6em;line-height:1;position:absolute;top:50%;left:50%}.hslWheel__label.svelte-1fl0125 b:where(.svelte-1fl0125){font-style:normal;font-weight:100;position:absolute;top:50%;left:100%;transform:translateY(-50%)translate(1.5em)}.hslWheel__label.svelte-1fl0125 b:where(.svelte-1fl0125):after{content:"";height:var(--lineWidth);background:var(--onBg);z-index:-1;width:.5em;transition:transform .2s .2s;position:absolute;top:50%;right:100%;transform:translate(-.5em)translateY(-50%)scaleX(0)}.hslWheel__label--active.svelte-1fl0125 b:where(.svelte-1fl0125):after{transition-delay:0s;transform:translate(-.2em)translateY(-50%)scaleX(1)}.hslWheel__label.svelte-1fl0125 b:where(.svelte-1fl0125):before{content:"";background:var(--c);width:.8em;height:.8em;box-shadow:0 0 0 .05em var(--c), 0 0 0 .2em var(--white), inset 0 0 0 .1em var(--white);border-radius:50%;position:absolute;top:50%;right:100%;transform:translate(-1em)translateY(-50%)}.hslWheel__pointer.svelte-1fl0125{width:46%;height:var(--lineWidth);background:linear-gradient(90deg, var(--black) 0% calc(var(--l) * 100%), var(--white) calc(var(--l) * 100%) 100%);transform:rotate(calc(-90deg + var(--h) * 1deg));transform-origin:0 0;z-index:2;pointer-events:none;position:absolute;top:50%;left:50%}.hslWheel__pointer.svelte-1fl0125:after{content:"";background:var(--cc);width:.2em;height:.2em;top:50%;left:calc(100% * var(--l));box-shadow:0 0 0 var(--lineWidth) var(--line), 0 0 0 calc(var(--lineWidth) * 2) var(--bg);border-radius:50%;position:absolute;transform:translate(-50%)translateY(-50%)}.hslWheel__pointerbase.svelte-1fl0125{background:var(--cc);width:1em;height:1em;box-shadow:0 0 0 var(--lineWidth) var(--line), inset 0 0 0 .1em var(--white);border-radius:50%;position:absolute;top:50%;left:0;transform:translate(-50%,-50%)}.hslWheel__lring.svelte-1fl0125{width:calc(91.5% * var(--l));aspect-ratio:1;border:var(--lineWidth) solid var(--line);z-index:1;box-shadow:0 0 0 var(--lineWidth) var(--bg);pointer-events:none;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.hslWheel__value.svelte-1fl0125{transform:translate(-50%, -50%) rotate(calc(-90deg + var(--h) * 1deg)) translateX(-70cqi) rotate(calc(90deg + var(--h) * -1deg));color:var(--onBg);text-align:center;pointer-events:none;text-transform:uppercase;z-index:3;letter-spacing:.5ex;font-size:.6em;position:absolute;top:50%;left:50%}.swatch.svelte-11rnfon{--inset:.4em;box-shadow:0 0 0 var(--lineWidth) var(--line);padding:var(--inset);background-color:var(--bg);box-sizing:border-box;width:10em;color:var(--onBg);transition:box-shadow .4s cubic-bezier(.3,.7,0,1) .1s,padding .4s cubic-bezier(.3,.7,0,1) .1s,color .1s linear,background-color .1s linear;position:relative;overflow:hidden}.swatch__color.svelte-11rnfon{aspect-ratio:1;background-color:var(--c,black);transition:aspect-ratio .4s cubic-bezier(.3,.7,0,1) .1s}.swatch__label.svelte-11rnfon{height:2rem;font-size:1.5em;line-height:1;transition:transform .2s ease-out .5s,height .3s cubic-bezier(.3,.7,0,1) .5s}.namedSwatches__tight .swatch__label.svelte-11rnfon{height:1.1rem}.swatch__value.svelte-11rnfon{gap:.7em;margin-top:.3ex;font-family:IBM Plex Mono,monospace;font-size:.4em;font-weight:200;display:flex}.swatch__valuepart.svelte-11rnfon{opacity:1;transition:opacity .2s linear .6s,transform .3s cubic-bezier(.3,.7,0,1) .6s;transition-delay:calc(.65s + var(--i) * .1s);transform:translateY(0%)}.swatch__name.svelte-11rnfon{opacity:1;white-space:nowrap;text-overflow:ellipsis;width:100%;margin-top:.2em;padding-bottom:.2ex;font-size:.85em;transition:opacity .2s linear .6s,margin-top .2s cubic-bezier(.3,.7,0,1) .5s;display:block;overflow:hidden}.swatch--collapsed.svelte-11rnfon{box-shadow:0 0 0 0 var(--borderColor,var(--c));color:var(--c);background:var(--c);padding:0}.swatch--collapsed.svelte-11rnfon .swatch__color:where(.svelte-11rnfon){aspect-ratio:var(--swatchHeight,1)}.swatch--collapsed.svelte-11rnfon .swatch__label:where(.svelte-11rnfon){height:0;overflow:hidden;transform:translateY(calc(100% - 1px))}.swatch--collapsed.svelte-11rnfon .swatch__valuepart:where(.svelte-11rnfon){opacity:0;transform:translateY(100%)}.swatch--collapsed.svelte-11rnfon .swatch__name:where(.svelte-11rnfon){opacity:0;margin-top:0}.swatch.svelte-11rnfon:after{content:"";box-shadow:inset 0 0 0 0 var(--bg), inset 0 0 0 0 var(--bg);transition:box-shadow .5s cubic-bezier(.3,.7,0,1);position:absolute;inset:0}.swatch--collapsed.svelte-11rnfon:after{box-shadow:inset 0 0 0 0 var(--bg), inset 0 0 0 0 var(--bg)}.swatch--collapsed.svelte-11rnfon:hover:after{box-shadow:inset 0 0 0 var(--lineWidth) var(--line), inset 0 0 0 calc(var(--inset) * .5) var(--bg)}.swatches.svelte-aw1adb{aspect-ratio:1;width:100%}.swatches__swatch.svelte-aw1adb{margin-top:-2.75rem;margin-left:-2.75rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.swatches__swatch.svelte-aw1adb+.swatches__swatch:where(.svelte-aw1adb){margin-top:2.75rem;margin-left:2.75rem}.ramp.svelte-pvx36z{height:calc(var(--length) * 3.9rem)}.namedSwatches__tight .ramp.svelte-pvx36z{height:calc(var(--length) * 2.2rem)}.ramp__title.svelte-pvx36z{text-align:center;margin:0 0 1.5em;font-size:2em}.ramp__step.svelte-pvx36z{margin:0;padding:0;display:block;position:relative}.ramp__step.svelte-pvx36z+.ramp__step:where(.svelte-pvx36z){margin-top:-.25em}.ramp__swatch.svelte-pvx36z{transform:rotate(calc(var(--rnd)* 5deg)) translateX(calc(var(--rnd) * .5em));--swatchHeight:calc(4 + var(--rnd2) * 3);padding:0;transition:transform .4s cubic-bezier(.3,.7,0,1),padding .5s cubic-bezier(.3,.7,0,1) .45s;position:relative}.ramp__step.svelte-pvx36z:not(:has(.swatch--collapsed)) .ramp__swatch:where(.svelte-pvx36z){z-index:1;padding:1.75em 0;transform:rotate(0)translate(0)}.ramp__step.svelte-pvx36z:has(.swatch--collapsed):hover{z-index:2;--borderColor:var(--bg)}.namedSwatches__list.svelte-1pb3sxg{flex-wrap:wrap;justify-content:center;gap:3rem;padding:5%;display:flex}.namedSwatches__tight.svelte-1pb3sxg{font-size:.5rem}.namedSwatches__tight.svelte-1pb3sxg .namedSwatches__list:where(.svelte-1pb3sxg){gap:1.5rem}.shpere_wrap.svelte-1iqk7sy{container-type:inline-size}.sphere.svelte-1iqk7sy{aspect-ratio:1;perspective:10000px;width:100%;transform-style:preserve-3d;animation:60s linear infinite paused svelte-1iqk7sy-spin;position:relative}.shpere_wrap.svelte-1iqk7sy:before{content:"";box-shadow:0 0 0 1px var(--onBg);border-radius:50%;display:none;position:absolute;inset:14vmin}.sphere.svelte-1iqk7sy:hover{animation-play-state:running}.sphere__segments.svelte-1iqk7sy{width:100%;height:3.7%;transform-style:preserve-3d;position:absolute;top:50%;transform:translateY(-50%)rotateY(-20deg)rotateX(-20deg)}.sphere__segments--vertical.svelte-1iqk7sy{transform:translateY(-50%)rotateY(-20deg)rotateX(-20deg)rotate(-90deg)}.sphere__segments--vertical.svelte-1iqk7sy:before,.sphere__segments--vertical.svelte-1iqk7sy:after{content:"";background:linear-gradient(to left, var(--stops-12));background-position:100% 100%;background-size:200%;width:100%;height:100%;position:absolute;transform:rotateY(-90deg)translateZ(-1.8cqi)scaleX(.58)}.sphere__segments--vertical.svelte-1iqk7sy:before{transform:rotateY(-90deg)rotateX(-90deg)translateZ(1.8cqi)scaleX(.58)}.sphere__segment.svelte-1iqk7sy{background:linear-gradient(to left, var(--stops-48));width:4.16667%;height:100%;transform:translateX(-50%) rotateY(calc(360deg * var(--i))) translateZ(29cqi);backface-visibility:visible;background-size:4800% 100%;background-position:calc(100% * var(--i)) 0;position:absolute;left:50%}.sphere__segments--vertical.svelte-1iqk7sy .sphere__segment:where(.svelte-1iqk7sy){background-image:linear-gradient(to left, var(--stops-vert))}.sphere__segments--horizontal.svelte-1iqk7sy .sphere__segment:where(.svelte-1iqk7sy):first-child{display:none}.sphere__segments--vertical.svelte-1iqk7sy .sphere__segment:where(.svelte-1iqk7sy):first-child{border:none}@keyframes svelte-1iqk7sy-spin{0%{transform:rotateX(0)rotateY(0)}to{transform:rotateX(360deg)rotateY(360deg)}}.panelSettings.svelte-1ockos2{flex-direction:column;gap:.9rem;display:flex}.square__wrap.svelte-1ockos2{container-type:inline-size}.square.svelte-1ockos2{aspect-ratio:1;width:100%;position:relative}.tl.svelte-1ockos2,.tr.svelte-1ockos2,.bl.svelte-1ockos2,.br.svelte-1ockos2{width:calc(100% / var(--w));height:calc(100% / var(--h));appearance:none;cursor:pointer;z-index:5;opacity:0;background:0 0;border:none;margin:0;padding:0;position:absolute}.tl.svelte-1ockos2{top:0;left:0}.tr.svelte-1ockos2{top:0;right:0}.bl.svelte-1ockos2{bottom:0;left:0}.br.svelte-1ockos2{bottom:0;right:0}.square__segment.svelte-1ockos2{cursor:none}.square__segment.svelte-1ockos2,.square__label.svelte-1ockos2{width:calc(100% / var(--w));height:calc(100% / var(--h));top:calc(var(--y) * 100%);left:calc(var(--x) * 100%);position:absolute}.square__label.svelte-1ockos2{color:var(--onBg);opacity:1;transition:transform .35s cubic-bezier(.3,.7,0,1.5),opacity .2s linear;transition-delay:calc((1 - var(--i)) * .1s + .2s), calc((1 - var(--i)) * .1s + .2s);justify-content:center;align-items:center;font-size:calc(1rem - .2vw);display:flex}.square__label--alpha.svelte-1ockos2{top:calc(var(--i) * 100%);text-transform:uppercase;left:0;transform:translate(-100%)scale(.85)}.square__label--roman.svelte-1ockos2{top:0;left:calc(var(--i) * 100%);transform:translateY(-100%)scale(.85)}.square.svelte-1ockos2:hover .square__label--alpha:where(.svelte-1ockos2){transform:translate(0)}.square.svelte-1ockos2:hover .square__label--roman:where(.svelte-1ockos2){transform:translateY(0)}.square.svelte-1ockos2:hover .square__label:where(.svelte-1ockos2){opacity:0}.square__segment.svelte-1ockos2:after{content:"";background:var(--color);transition:transform .3s cubic-bezier(.3,.7,.5,1.3) .2s,background .1s linear;transition-delay:calc(var(--x) * .1s + var(--y) * .1s + .1s), calc(var(--x) * .1s + var(--y) * .1s + .1s);position:absolute;inset:-1px;transform:scale(1)rotate(0)}.square__wrap--spectral.svelte-1ockos2 .square__segment:where(.svelte-1ockos2):after{background:var(--colorSpectral)}.square__segment.svelte-1ockos2:before{content:"";box-shadow:0 0 0 var(--lineWidth) var(--line);opacity:1;transition:opacity .3s linear,transform .2s ease-in;transition-delay:calc(var(--x) * 50ms + var(--y) * 50ms);position:absolute;inset:2px;transform:scale(.5)}.square.svelte-1ockos2:hover .square__segment:where(.svelte-1ockos2):before{opacity:.9;transform:scale(1)}.square.svelte-1ockos2:hover .square__segment:where(.svelte-1ockos2):after{transform:scale(.5) rotate(calc(var(--rnd) * 10deg)) translateX(calc(var(--rnd) * 20%)) translateY(calc(var(--rnd) * 10%))}.square.svelte-1ockos2:hover .square__segment:where(.svelte-1ockos2):hover:after{z-index:1;transition:transform .3s cubic-bezier(.3,.7,0,1.5);transform:scale(.91)rotate(0)translate(0)translateY(0)}.pigment-controls.svelte-1ockos2{align-items:center;gap:.75em;display:flex;position:absolute;top:100%;left:2.4rem;right:3rem}.pigment-controls.svelte-1ockos2 button:where(.svelte-1ockos2){font-size:.8em}.shape-toggle.svelte-1ockos2{color:var(--onBg);justify-content:center;align-items:center;margin-left:auto;line-height:1;display:inline-flex}.shape-glyph.svelte-1ockos2{width:1em;height:1em;display:inline-block;overflow:visible;transform:scale(.8)}.shape-glyph.svelte-1ockos2 path:where(.svelte-1ockos2){fill:none;stroke:currentColor;stroke-width:1px;stroke-linejoin:round;stroke-linecap:round;d:path("M1,1 L15,1 L15,15 L1,15 Z");transition:d .35s cubic-bezier(.3,.7,0,1.5)}.shape-glyph--triangle.svelte-1ockos2 path:where(.svelte-1ockos2){d:path("M8,1 L15,15 L8,15 L1,15 Z")}.square__caption.svelte-1ockos2{z-index:2;background:var(--bg);text-align:center;opacity:0;border-radius:50%;flex-direction:column;justify-content:center;width:1.5rem;height:1.5rem;font-size:.5em;display:flex;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)scale(.3)}.square__caption.svelte-1ockos2 em:where(.svelte-1ockos2){text-transform:uppercase;font-style:normal;line-height:.9;transition:transform .2s cubic-bezier(.3,.7,0,1) .35s;display:block}.square__caption.svelte-1ockos2 em:where(.svelte-1ockos2):first-child{letter-spacing:.1em;font-size:.8em;transform:translateY(-1rem)}.square__caption.svelte-1ockos2 em:where(.svelte-1ockos2):last-child{font-size:1.4em;transition-duration:.3s;transform:translateY(1rem)}.square__segment.svelte-1ockos2:hover .square__caption:where(.svelte-1ockos2){opacity:1;transition:transform .3s cubic-bezier(.3,.7,0,1) .2s,opacity .2s linear .2s;transform:translate(-50%,-50%)scale(1.15)}.square__segment.svelte-1ockos2:hover .square__caption:where(.svelte-1ockos2) em:where(.svelte-1ockos2){transform:translateY(0)}.triangle.svelte-1ockos2{width:100%;margin:0 auto;position:relative}.triangle__hex.svelte-1ockos2{left:var(--left);top:var(--top);width:var(--wpct);height:var(--hpct);cursor:none;position:absolute;transform:translate(-50%,-50%)scale(1.01)}.triangle__hex.svelte-1ockos2:after{content:"";background:var(--color);clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);transition:transform .3s cubic-bezier(.3,.7,.5,1.3),background .1s linear;position:absolute;inset:0;transform:scale(1)rotate(0)}.triangle__hex.svelte-1ockos2:before{content:"";clip-path:polygon(evenodd,50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%,50% 0%,50% 1.155px,calc(100% - 1px) calc(25% + .577px),calc(100% - 1px) calc(75% - .577px),50% calc(100% - 1.155px),1px calc(75% - .577px),1px calc(25% + .577px),50% 1.155px);background:var(--line);opacity:0;transition:opacity .1s linear .15s,transform .2s cubic-bezier(.3,.7,.5,1) .1s;position:absolute;inset:0;transform:scale(.5)}.triangle.svelte-1ockos2{transform:translateY(1rem)}.triangle--spectral.svelte-1ockos2 .triangle__hex:where(.svelte-1ockos2):after{background:var(--colorSpectral)}.triangle.svelte-1ockos2:hover .triangle__hex:where(.svelte-1ockos2):after,.triangle__hex--active.svelte-1ockos2:after{transform:scale(.6) rotate(calc(var(--rnd) * 8deg)) translateX(calc(var(--rnd) * 10%)) translateY(calc(var(--rnd2) * 7%))}.triangle.svelte-1ockos2:hover .triangle__hex:where(.svelte-1ockos2):before,.triangle__hex--active.svelte-1ockos2:before{opacity:1;transform:scale(.96)}.triangle__hex.svelte-1ockos2:hover:after,.triangle__hex--active.svelte-1ockos2:after{z-index:1;transition:transform .3s cubic-bezier(.3,.7,0,1.5);transform:scale(.92)rotate(0)translate(0)translateY(0)}.triangle__caption.svelte-1ockos2{z-index:2;background:var(--bg);text-align:center;opacity:0;pointer-events:none;border-radius:50%;flex-direction:column;justify-content:center;width:1.4rem;height:1.4rem;font-size:calc(.5rem + .2vw);display:flex;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)scale(.3)}.triangle__caption.svelte-1ockos2 em:where(.svelte-1ockos2){text-transform:uppercase;font-style:normal;line-height:.9;transition:transform .2s cubic-bezier(.3,.7,0,1) .35s;display:block}.triangle__caption.svelte-1ockos2 em:where(.svelte-1ockos2):first-child{letter-spacing:.1em;font-size:.8em;transform:translateY(-1rem)}.triangle__caption.svelte-1ockos2 em:where(.svelte-1ockos2):last-child{font-size:1.4em;transition-duration:.3s;transform:translateY(1rem)}.triangle__hex.svelte-1ockos2:hover .triangle__caption:where(.svelte-1ockos2),.triangle__hex--active.svelte-1ockos2 .triangle__caption:where(.svelte-1ockos2){opacity:1;transition:transform .3s cubic-bezier(.3,.7,0,1) .1s,opacity .2s linear .1s;transform:translate(-50%,-50%)scale(1.2)}.triangle__hex.svelte-1ockos2:hover .triangle__caption:where(.svelte-1ockos2) em:where(.svelte-1ockos2),.triangle__hex--active.svelte-1ockos2 .triangle__caption:where(.svelte-1ockos2) em:where(.svelte-1ockos2){transform:translateY(0)}.triangle__label.svelte-1ockos2{left:calc(var(--edge) - 1.5rem);top:var(--top);color:var(--onBg);text-align:right;cursor:pointer;opacity:.75;background:0 0;border:none;margin:0;padding:0;font-size:calc(1rem - .4vw);line-height:1;transition:opacity .15s linear,color .15s linear;position:absolute;transform:translate(calc(1px - 100%),-50%)}.triangle__label.svelte-1ockos2:hover,.triangle__label--active.svelte-1ockos2{opacity:1;font-weight:700}.triangle__corner.svelte-1ockos2{left:var(--left);top:var(--top);width:var(--wpct);height:var(--hpct);appearance:none;cursor:pointer;z-index:5;opacity:0;background:0 0;border:none;margin:0;padding:0;position:absolute;transform:translate(-50%,-50%)}.circle-picker.svelte-2fybmc{--c-r:red;--c-g:#0f0;--c-b:#00f;--c-y:#ff0;--c-m:#f0f;--c-c:#0ff;--c-black:#000;-webkit-user-select:none;user-select:none;aspect-ratio:1;touch-action:none;width:100%;height:100%;position:relative;overflow:visible}.circle-picker.svelte-2fybmc use{pointer-events:none}.circle-picker.svelte-2fybmc use.draggable{pointer-events:all;cursor:grab;touch-action:none;outline:none}.circle-picker.svelte-2fybmc use.draggable:focus,.circle-picker.svelte-2fybmc use.draggable:focus-visible{outline:none}.circle-picker--dragging.svelte-2fybmc,.circle-picker--dragging.svelte-2fybmc use.draggable{cursor:grabbing}.rgb-circles .r,.rgb-circles .g,.rgb-circles .b{fill:var(--c-fill)}.outline.svelte-2fybmc{fill:none;stroke:var(--c-line);stroke-width:0}.text.svelte-2fybmc{opacity:1;fill:var(--onBg);pointer-events:none;transition:opacity .2s linear 2s}.circle-picker--dragging.svelte-2fybmc .text:where(.svelte-2fybmc){opacity:0}.edges.svelte-s95pjt{--w:calc(var(--size-illu) - 4em);--unit:calc(var(--w) / 100);--padding-top:3%;--padding-left:33%;--padding-right:7%;--height:60%;--width:60%;width:var(--w);height:var(--w);flex:0 0 var(--w);margin:2em;position:relative}.edges--icon.svelte-s95pjt{margin:0}.cube.svelte-s95pjt{width:100%;height:100%;display:block}.cube.svelte-s95pjt g:where(.svelte-s95pjt){stroke:var(--line,currentColor);stroke-width:var(--lineWidth);fill:none}.axis-line.svelte-s95pjt{stroke:var(--line);stroke-dasharray:1 1}.overlay.svelte-s95pjt{pointer-events:none;position:absolute;inset:0}.polar.svelte-s95pjt{transform-origin:bottom;transform:translate(-50%, -100%) rotate(calc(var(--angle) + 90deg));width:1rem;height:42.5%;position:absolute;top:50%;left:50%}.dot.svelte-s95pjt{border:.5px solid var(--line);width:.5rem;height:.5rem;box-shadow:inset 0 0 0 1px var(--bg), 0 0 0 1.5px var(--cc), 0 0 0 3px var(--bg);background:var(--cc);transform:translate(-50%, -50%) translateY(calc(-.185rem * var(--dist)));border-radius:100%;position:absolute;top:100%;left:50%}.metric.svelte-s95pjt{color:var(--onBg);transform:translate(-50%, -50%) rotate(calc(var(--angle) + 90deg)) translateY(-1.2rem) rotate(calc(-1 * (var(--angle) + 90deg)));text-align:center;transform-origin:50%;background:var(--bg);border-radius:50%;padding:.2rem;font-size:.6em;font-weight:200;position:absolute;top:50%;left:50%}.name.svelte-s95pjt{color:var(--onBg);transform:translate(-50%, -50%) rotate(calc(var(--angle) + 90deg)) translateY(-3rem);text-align:center;transform-origin:50%;background:var(--bg);padding:0 .2em .1em;font-size:.6em;font-weight:200;position:absolute;top:50%;left:50%}.name.svelte-s95pjt:after,.name.svelte-s95pjt:before{content:"";background:var(--line);width:1ex;height:.5px;position:absolute;left:50%;transform:translate(-50%)}.name.svelte-s95pjt:before{top:1px}.name.svelte-s95pjt:after{bottom:0}.center-circle.svelte-s95pjt{fill:var(--bg);stroke:var(--line)}.outer-circle.svelte-s95pjt{fill:var(--bg);stroke:var(--line);stroke-width:var(--lineWidth)}.mid-circle.svelte-s95pjt{fill:var(--bg);stroke:var(--line);stroke-width:var(--lineWidth);stroke-dasharray:1 3}.connection-line.svelte-s95pjt{stroke:var(--line);stroke-dasharray:1 1}.sphere-container.svelte-117jc89{--w:var(--size-illu,100%);--sphere-line:transparent;width:var(--w);height:var(--w);flex:0 0 var(--w);touch-action:none;-webkit-user-select:none;user-select:none;position:relative}.sphere-container.svelte-117jc89:hover,.sphere-container--outline.svelte-117jc89{--sphere-line:var(--line)}.sphere-container--icon.svelte-117jc89{margin:0}.sphere-container.dragging.svelte-117jc89{cursor:grabbing}.sphere-container.svelte-117jc89:not(.dragging){cursor:grab}.sphere-svg.svelte-117jc89{width:100%;height:100%;display:block}.sphere-svg path{transition:stroke .3s linear}.bezier-editor.svelte-9gxkrk{--bgLineColor:oklch(from var(--line) l c h / 20%);--bg-size:calc(100% / var(--griditems));--dot:var(--line);box-sizing:border-box;outline:none;flex-direction:column;align-items:center;gap:1rem;width:100%;padding:.5rem;display:flex;container-type:inline-size}.inner-container.svelte-9gxkrk{aspect-ratio:1;background-image:repeating-linear-gradient(0deg, var(--bgLineColor) 0% var(--lineWidth), transparent var(--lineWidth) 100%), repeating-linear-gradient(90deg, var(--bgLineColor) 0% var(--lineWidth), transparent var(--lineWidth) 100%);background-position:0 0,0 0;background-size:var(--bg-size) var(--bg-size);cursor:grab;outline:none;width:100%}.bezier-editor--snapToGrid.svelte-9gxkrk .inner-container:where(.svelte-9gxkrk){background:0 0}.dot.svelte-9gxkrk{r:var(--lineWidth);transition:r .2s cubic-bezier(.3,.7,0,1),stroke .1s linear;transition-delay:calc(var(--i) * 4s);stroke:#0000;stroke-width:var(--lineWidth);fill:none}.bezier-editor--snapToGrid.svelte-9gxkrk .dot:where(.svelte-9gxkrk){r:7;stroke:var(--line)}.bezier-curve.svelte-9gxkrk{stroke:var(--line);stroke-width:1px;stroke-dasharray:1 2}.bezier-line.svelte-9gxkrk{stroke:var(--line);stroke-width:.5px}.bezier-point.svelte-9gxkrk,.bezier-handle.svelte-9gxkrk{stroke:var(--line);cursor:grab;fill:var(--bg);stroke-width:1px}.sample-point.svelte-9gxkrk{stroke:var(--bg);stroke-width:1px}.sample-point--bg.svelte-9gxkrk{stroke-width:2px;stroke:var(--line)}svg.svelte-9gxkrk{-webkit-user-select:none;user-select:none;width:100%;box-shadow:inset 0 0 0 var(--lineWidth) var(--bgLineColor);background:0 0;display:block;overflow:visible}.output.svelte-9gxkrk{padding:.5rem;font-size:8cqi}svg.svelte-f0fhuw circle:where(.svelte-f0fhuw){fill:none;stroke-width:calc(var(--lineWidth) * 2)}button .colors.svelte-f0fhuw use:where(.svelte-f0fhuw){opacity:0;transition-delay:calc(.3s - var(--i) * .2s)}button:hover .colors.svelte-f0fhuw>use:where(.svelte-f0fhuw),.item--active .colors.svelte-f0fhuw>use:where(.svelte-f0fhuw){opacity:1;transition:opacity .3s,transform .3s cubic-bezier(.3,.7,0,1);transition-delay:calc(var(--j) * .3s + var(--i) * .1s)}.export.svelte-1h8xysy{color:var(--onBg);min-height:calc(100svh - 2 * var(--size));width:calc(100vw - 1 * var(--size));--toolsWidth:max(20%, 20rem);will-change:transform;transition:transform .6s cubic-bezier(.3,.7,0,1);display:flex}.export--embedded.svelte-1h8xysy{width:100%;min-height:min(100svh,72rem)}.export--embedded.svelte-1h8xysy .export__settings:where(.svelte-1h8xysy) form:where(.svelte-1h8xysy){top:var(--bezel-x)}.layout--showSidebar .export{transform:translateX(calc(var(--toolsWidth) * -1));transition-delay:.2s!important}.export__settings.svelte-1h8xysy{width:var(--toolsWidth);padding:var(--bezel-x)}.export__settings.svelte-1h8xysy form:where(.svelte-1h8xysy){top:calc(var(--size) * 2);position:sticky}.export__settings.svelte-1h8xysy strong:where(.svelte-1h8xysy){font-weight:300;display:block}.export__viewport.svelte-1h8xysy{flex:0 0 calc(100% - var(--toolsWidth));border-left:var(--lineWidth) solid var(--line);padding:var(--bezel-x);box-sizing:border-box;flex-flow:column wrap;align-items:stretch;display:flex}.export__inner.svelte-1h8xysy{top:calc(var(--bezel-x) * 1.5);position:sticky}.export__ramps.svelte-1h8xysy{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.export__paletteheader.svelte-1h8xysy{position:relative;overflow:hidden}.export__remove-palette.svelte-1h8xysy{color:var(--onBg);background:0 0;border:none;align-items:center;gap:.25em;margin-top:-.5em;padding:.5em;font-size:1.25em;transition:transform .4s cubic-bezier(.3,.7,0,1) .35s;display:flex;position:absolute;top:0;right:0;transform:translate(100%)}.export__remove-palette.svelte-1h8xysy span:where(.svelte-1h8xysy){opacity:0;font-size:.6em;transition:opacity .2s cubic-bezier(.3,.7,0,1) 50ms,transform .3s cubic-bezier(.3,.7,0,1);transform:translate(-20%)}.export__remove-palette.svelte-1h8xysy:hover span:where(.svelte-1h8xysy){opacity:1;transform:translate(0)}.export__rampitem--active.svelte-1h8xysy .export__remove-palette:where(.svelte-1h8xysy){transform:translate(0)}.export__palettetitle.svelte-1h8xysy{height:0;transition:height .4s cubic-bezier(.3,.7,0,1) .2s;position:relative;overflow:hidden}.export__rampitem--active.svelte-1h8xysy .export__palettetitle:where(.svelte-1h8xysy){height:1lh}.export__palettetitle.svelte-1h8xysy span:where(.svelte-1h8xysy){transition:transform .5s cubic-bezier(.3,.7,0,1) .25s;position:absolute;inset:0 .6rem;transform:translateY(100%)}.export__rampitem--active.svelte-1h8xysy .export__palettetitle:where(.svelte-1h8xysy) span:where(.svelte-1h8xysy){transform:translateY(0)}.export__colors.svelte-1h8xysy{margin:0;padding:0;list-style:none;display:flex}.export__colors.svelte-1h8xysy li:where(.svelte-1h8xysy){text-align:center;flex:auto;padding:1em}.export__color.svelte-1h8xysy{height:15dvh;display:block;position:relative}.export--compact.svelte-1h8xysy .export__color:where(.svelte-1h8xysy){height:3em}.export__colorinner.svelte-1h8xysy{box-shadow:0 0 0 var(--lineWidth) var(--onBg);background:var(--bg);z-index:2;position:absolute;inset:0;transform:scale(.8)}.export__colorinner.svelte-1h8xysy:after{content:"";background:var(--currentColor);transform:scaleY(1.25) scaleX(1.26) rotate(0deg) rotate(calc(2deg + var(--rnd) * -2deg)) translateY(calc(-5% + var(--rnd) * 5%));transition:transform .75s cubic-bezier(.3,.7,0,1.2);transition-delay:calc(.2s * var(--ic));z-index:1;position:absolute;inset:0}.export--serious.svelte-1h8xysy .export__colorinner:where(.svelte-1h8xysy):after{transform:scaleY(1.25)scaleX(1.26)}.export__name.svelte-1h8xysy{z-index:2;color:var(--contrast);transition:transform .4s cubic-bezier(.3, .7, 0, 1) calc(.2s * var(--ic) + .1s), opacity .3s cubic-bezier(.3, .7, 0, 1) calc(.3s * var(--ic) + .1s);opacity:0;position:absolute;bottom:1rem;left:50%;transform:translate(-50%)translateY(4rem)}.export__rampitem--active.svelte-1h8xysy .export__name:where(.svelte-1h8xysy){opacity:1;transform:translate(-50%)translateY(0)rotate(-90deg)}.export__rampitem--active.svelte-1h8xysy .export__colorinner:where(.svelte-1h8xysy):after{transform:scaleY(.97) scaleX(.95) rotate(calc(-2deg + var(--rnd) * 2deg)) translateY(calc(-2% + var(--rnd) * 2%))}.export--serious.svelte-1h8xysy .export__rampitem--active:where(.svelte-1h8xysy) .export__colorinner:where(.svelte-1h8xysy):after{inset:.1em;transform:none}.export__actions.svelte-1h8xysy{border-top:var(--lineWidth) solid var(--line);margin:calc(var(--bezel-x) * .75) calc(var(--bezel-x) * -1) 0;justify-content:space-between;align-items:center;display:flex}.export__action.svelte-1h8xysy{padding:var(--bezel-x);align-items:center;gap:1em;display:flex}.export__action--downloads.svelte-1h8xysy{gap:.4em}.export__action--downloads.svelte-1h8xysy>span:where(.svelte-1h8xysy):first-child{margin-right:.3em}.panelSettings.svelte-1h8xysy{flex-direction:column;gap:.9rem;display:flex}.panelSettings__row.svelte-1h8xysy{flex-direction:column;gap:.35rem;display:flex}.panelSettings__row.svelte-1h8xysy strong{font-size:.8em;font-weight:300}.export__rampitem.svelte-1h8xysy{top:var(--bezel-x);color:var(--onBg);background:var(--bg);box-shadow:0 0 0 1rem var(--bg);padding-bottom:0;text-decoration:none;transition:padding-bottom .5s cubic-bezier(.3,.7,0,1) .2s;display:block;position:sticky}.export__rampitem--active.svelte-1h8xysy{padding-bottom:2rem}.export__rampitem.svelte-1h8xysy+.export__rampitem:where(.svelte-1h8xysy){margin-top:calc(.5 * var(--bezel-x))}.export__bezier.svelte-1h8xysy{margin:1em 0}.export__contrast.svelte-1h8xysy{background:conic-gradient(var(--gradientStops));width:1.2rem;height:1.2rem;box-shadow:0 0 0 1px var(--onBg), 0 0 0 2px var(--bg);opacity:0;transition:opacity .4s cubic-bezier(.3,.7,0,1),transform .4s cubic-bezier(.3,.7,0,1);transition-delay:calc(.2s + var(--ic) * .15s), calc(.25s + var(--ic) * .15s);z-index:1;border-radius:50%;position:absolute;bottom:0%;left:50%;transform:translate(-50%,-35%)scale(.5)}.export__contrast.svelte-1h8xysy:before,.export__contrast.svelte-1h8xysy:after{content:"";aspect-ratio:1;background:var(--currentColor);border-radius:50%;height:30%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.export__contrast.svelte-1h8xysy:after{background:var(--contrast);z-index:1;height:20%}.export__rampitem--active.svelte-1h8xysy .export__contrast:where(.svelte-1h8xysy){opacity:1;transform:translate(-50%,50%)scale(.6)}.export--compact.svelte-1h8xysy .export__rampitem--active:where(.svelte-1h8xysy) .export__contrast:where(.svelte-1h8xysy){transform:translate(-50%,100%)scale(.6)}.hueBarrel.svelte-1h8xysy{--d:60cqi;--r:calc(var(--d) / 2);aspect-ratio:1;perspective:1000px;perspective-origin:50%;--viewAngle:34deg;-webkit-user-select:none;user-select:none;width:80%;margin:2rem auto;position:relative;container-type:inline-size}.hueBarrel__controls.svelte-1h8xysy{cursor:grab;touch-action:none;background:0 0;border:0;padding:0;position:absolute;inset:0}.hueBarrel--active.svelte-1h8xysy .hueBarrel__controls:where(.svelte-1h8xysy){cursor:grabbing}.hueBarrel__controls.svelte-1h8xysy:after{content:"";width:calc(var(--d) * 1.4);aspect-ratio:1;background:var(--bg);border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)translateY(1.25%)scaleX(.9)}.hueBarrel__arrow-y.svelte-1h8xysy,.hueBarrel__arrow-x.svelte-1h8xysy{--scale:.8;transform:translate(-50%, -50%) scale(var(--scale));background:var(--onBg);width:var(--lineWidth);opacity:0;--angle:45deg;height:100%;transition:opacity 50ms linear,transform .275s cubic-bezier(.3,.7,0,1);position:absolute;top:50%;left:50%}.hueBarrel__arrow-x.svelte-1h8xysy{transition-delay:75ms,75ms}.hueBarrel__controls.svelte-1h8xysy:hover .hueBarrel__arrow-y:where(.svelte-1h8xysy),.hueBarrel__controls.svelte-1h8xysy:hover .hueBarrel__arrow-x:where(.svelte-1h8xysy),.hueBarrel--active.svelte-1h8xysy .hueBarrel__arrow-y:where(.svelte-1h8xysy),.hueBarrel--active.svelte-1h8xysy .hueBarrel__arrow-x:where(.svelte-1h8xysy){opacity:1;--scale:1;--angle:90deg}.hueBarrel__arrow-y.svelte-1h8xysy .after:where(.svelte-1h8xysy),.hueBarrel__arrow-y.svelte-1h8xysy .before:where(.svelte-1h8xysy),.hueBarrel__arrow-x.svelte-1h8xysy .after:where(.svelte-1h8xysy),.hueBarrel__arrow-x.svelte-1h8xysy .before:where(.svelte-1h8xysy){aspect-ratio:1;transform-origin:0 0;width:3cqi;position:absolute;top:0;left:50%;transform:rotate(45deg)}.hueBarrel__arrow-y.svelte-1h8xysy .after:where(.svelte-1h8xysy):before,.hueBarrel__arrow-y.svelte-1h8xysy .after:where(.svelte-1h8xysy):after,.hueBarrel__arrow-y.svelte-1h8xysy .before:where(.svelte-1h8xysy):before,.hueBarrel__arrow-y.svelte-1h8xysy .before:where(.svelte-1h8xysy):after,.hueBarrel__arrow-x.svelte-1h8xysy .after:where(.svelte-1h8xysy):before,.hueBarrel__arrow-x.svelte-1h8xysy .after:where(.svelte-1h8xysy):after,.hueBarrel__arrow-x.svelte-1h8xysy .before:where(.svelte-1h8xysy):before,.hueBarrel__arrow-x.svelte-1h8xysy .before:where(.svelte-1h8xysy):after{content:"";width:var(--lineWidth);background:var(--onBg);transform-origin:50% 0;height:100%;transform:rotate(calc(-1 * var(--angle)));border-radius:50%;transition:transform .25s ease-out .25s;position:absolute;top:0;left:0}.hueBarrel__controls.svelte-1h8xysy:hover .hueBarrel__arrow-y:where(.svelte-1h8xysy) .before:where(.svelte-1h8xysy):after,.hueBarrel__controls.svelte-1h8xysy:hover .hueBarrel__arrow-x:where(.svelte-1h8xysy) .before:where(.svelte-1h8xysy):after,.hueBarrel--active.svelte-1h8xysy .hueBarrel__arrow-y:where(.svelte-1h8xysy) .before:where(.svelte-1h8xysy):after,.hueBarrel--active.svelte-1h8xysy .hueBarrel__arrow-x:where(.svelte-1h8xysy) .before:where(.svelte-1h8xysy):after,.hueBarrel__controls.svelte-1h8xysy:hover .hueBarrel__arrow-y:where(.svelte-1h8xysy) .after:where(.svelte-1h8xysy):after,.hueBarrel__controls.svelte-1h8xysy:hover .hueBarrel__arrow-x:where(.svelte-1h8xysy) .after:where(.svelte-1h8xysy):after,.hueBarrel--active.svelte-1h8xysy .hueBarrel__arrow-y:where(.svelte-1h8xysy) .after:where(.svelte-1h8xysy):after,.hueBarrel--active.svelte-1h8xysy .hueBarrel__arrow-x:where(.svelte-1h8xysy) .after:where(.svelte-1h8xysy):after{transform:rotate(calc(var(--angle) - var(--angle)))}.hueBarrel__arrow-y.svelte-1h8xysy .after:where(.svelte-1h8xysy),.hueBarrel__arrow-x.svelte-1h8xysy .after:where(.svelte-1h8xysy){top:100%;transform:rotate(-135deg)}.hueBarrel__arrow-x.svelte-1h8xysy{transform:translate(-50%, -50%) rotate(90deg) scale(var(--scale))}.hueBarrel__ring.svelte-1h8xysy{width:var(--d);height:var(--d);transform:translate(-50%, 0) translateY(calc(-100% * var(--i))) rotateX(var(--viewAngle));--size:calc(sin(var(--i2) * PI) * var(--d));pointer-events:none;border-radius:50%;position:absolute;top:50%;left:50%}.hueBarrel__ring.svelte-1h8xysy:before{content:"";width:var(--size);aspect-ratio:1;box-shadow:0 0 0 var(--lineWidth) var(--onBg), 0 calc(var(--lineWidth) * -2) 0 calc(var(--lineWidth) * 2) var(--bg), inset 0 calc(var(--lineWidth) * -1) 0 calc(var(--lineWidth) * 2) var(--bg);border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.hueBarrel__point.svelte-1h8xysy{aspect-ratio:1;background:var(--c);width:5cqi;transform:translate(-50%, -50%) rotate(calc(var(--h) * 1deg)) translateY(calc(var(--size) / 2));box-shadow:0 0 0 .5px var(--bg), 0 0 0 1px var(--onBg), inset 0 0 0 .5px var(--bg);border-radius:50%;transition:transform .4s cubic-bezier(.3,.7,0,1);position:absolute;top:50%;left:50%}.hueBarrel--active.svelte-1h8xysy .hueBarrel__point:where(.svelte-1h8xysy){transition:none}.hueBarrel__ring--ghost.svelte-1h8xysy:before{display:none}.hueBarrel__point--ghost.svelte-1h8xysy{width:2.5cqi}.export__toggle.svelte-1h8xysy{margin-top:1em}.hue-marker.svelte-1h8xysy,.huerange-marker.svelte-1h8xysy{background:conic-gradient(var(--stops-48));transform:rotate(calc(var(--rel-value) * 360deg));box-shadow:inset 0 0 0 1px var(--bg);pointer-events:none;border-radius:50%;position:absolute;inset:-2px}.hue-marker.svelte-1h8xysy:before,.huerange-marker.svelte-1h8xysy:before{content:"";background:var(--bg);border-radius:50%;position:absolute;inset:4px}.hue-marker.svelte-1h8xysy:after{content:"";background:var(--bg);box-shadow:inset 0 0 0 1px var(--onBg);border-radius:50%;position:absolute;inset:5px}.huerange-marker.svelte-1h8xysy:before{inset:2px}.huerange-marker.svelte-1h8xysy{background:conic-gradient(var(--onBg) calc(var(--rel-value-abs) * 100%), var(--bg) 0);transform:scaleX(var(--rel-value-sign));inset:0}.rybitten-txt.svelte-13gojt4{text-wrap:nowrap}button .logo-itten-svg .colors use{opacity:0;transition-delay:calc(.3s - var(--i) * .2s)}button:hover .logo-itten-svg .colors>use,.item--active .logo-itten-svg .colors>use{opacity:1;transition:opacity .2s linear,transform .3s cubic-bezier(.3,.7,0,1);transition-delay:calc(var(--i) * .25s)}button .colors.svelte-bc8439>path:where(.svelte-bc8439){opacity:0;transition-delay:calc(.3s - var(--i) * .2s);transform:translateY(-10%)}button:hover .colors.svelte-bc8439>path:where(.svelte-bc8439),.item--active .colors.svelte-bc8439>path:where(.svelte-bc8439){opacity:1;transition:opacity .3s,transform .3s cubic-bezier(.3,.7,0,1);transition-delay:calc(var(--i) * .2s);transform:translateY(0)}button .colors.svelte-w5nezs rect:where(.svelte-w5nezs){opacity:0;transition:opacity .1s linear,transform .3s cubic-bezier(.3,.7,0,1);transition-delay:calc(.35s - var(--i) * .2s);transform-box:fill-box;transform-origin:0 100%;transform:scaleY(0)}button:hover .colors.svelte-w5nezs>rect:where(.svelte-w5nezs),.item--active .colors.svelte-w5nezs>rect:where(.svelte-w5nezs){opacity:1;transition:opacity .3s linear,transform .3s cubic-bezier(.3,.7,0,1);transition-delay:calc(.2s - var(--i) * .2s);transform:scale(1)}button .colors.svelte-x3wqau use:where(.svelte-x3wqau){opacity:0;transition:opacity 80ms linear,transform .35s cubic-bezier(.3,.7,0,1);transition-delay:calc(.3s - var(--i) * .2s);transform-origin:50%;transform:translateY(40px)scale(.8)}button:hover .colors.svelte-x3wqau>use:where(.svelte-x3wqau),.item--active .colors.svelte-x3wqau>use:where(.svelte-x3wqau){opacity:1;transition:opacity .2s linear,transform .6s cubic-bezier(.3,.7,0,1);transition-delay:calc(var(--i) * .25s);transform:translateY(0)}button .colors.svelte-z73yt6 use:where(.svelte-z73yt6){opacity:0;transition:opacity .2s linear,transform .3s cubic-bezier(.3,.7,0,1);transition-delay:calc(var(--i) * .2s), calc(var(--i) * .3s);--d:1}button:hover .colors.svelte-z73yt6>use:where(.svelte-z73yt6),.item--active .colors.svelte-z73yt6>use:where(.svelte-z73yt6){opacity:1;--d:0;transition:opacity .2s linear,transform .4s cubic-bezier(.3,.7,0,1);transition-delay:calc(var(--i) * .1s), calc(var(--i) * .15s)}a.svelte-629kra{color:var(--onBg);text-underline-offset:.2em;text-decoration-thickness:.025em;transition:text-underline-offset 50ms}a.svelte-629kra:hover{text-underline-offset:.1em}.section.svelte-629kra{min-height:calc(100svh - var(--size));border-bottom:var(--lineWidth) solid var(--line);scroll-margin-top:calc(var(--size) + 1.5rem)}.section--split.svelte-629kra{grid-template-columns:1fr 1fr;display:grid}@media (width<=800px){.section--split.svelte-629kra{grid-template-columns:1fr}}.section__left.svelte-629kra,.section__right.svelte-629kra{box-sizing:border-box;padding:var(--size);flex-direction:column;justify-content:center;display:flex;position:relative}.section--split.svelte-629kra p:where(.svelte-629kra){max-width:50ch}.section--split.svelte-629kra p:where(.svelte-629kra)+p:where(.svelte-629kra){margin-top:1em}.section__top.svelte-629kra{text-align:center;max-width:70ch;margin:0 auto;padding-top:10vmin}.section__top--cta.svelte-629kra{padding-top:6vmin;padding-bottom:10vmin}.section__bottom--editor.svelte-629kra{border-top:var(--lineWidth) solid var(--line);margin-top:clamp(2rem,6vmin,4rem);overflow:clip}.intro.svelte-629kra,.outro.svelte-629kra{place-items:center;display:grid}.intro__inner.svelte-629kra,.outro__inner.svelte-629kra{grid-area:1/1}.outro__inner.svelte-629kra{gap:5dvh}.intro.svelte-629kra blockquote:where(.svelte-629kra),.outro.svelte-629kra blockquote:where(.svelte-629kra){text-align:center;z-index:2;font-size:1.25rem;font-style:normal;position:relative}.intro.svelte-629kra blockquote:where(.svelte-629kra) p:where(.svelte-629kra),.outro.svelte-629kra blockquote:where(.svelte-629kra) p:where(.svelte-629kra){max-width:30ch;font-size:3rem;font-weight:100;line-height:.95}.outro.svelte-629kra blockquote:where(.svelte-629kra) footer:where(.svelte-629kra){margin-top:9dvh;font-size:.8rem}.intro__visual.svelte-629kra,.outro__visual.svelte-629kra{width:30dvh;margin:0 auto 10dvh}.outro__visual.svelte-629kra{width:10dvh;margin:10dvh auto 0}.illustration.svelte-629kra{aspect-ratio:1;position:relative}.illustration__cube.svelte-629kra,.illustration__profile.svelte-629kra,.illustration__wheel.svelte-629kra,.illustration__slices.svelte-629kra,.illustration__circlemixer.svelte-629kra,.illustration__sphere3d.svelte-629kra{aspect-ratio:1;width:50vmin;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.illustration__wheel.svelte-629kra,.illustration__slices.svelte-629kra{box-sizing:border-box;padding:7%}.illustration__circlemixer.svelte-629kra{width:55vmin}@media (width<=800px){.illustration__profile.svelte-629kra{width:90vmin}.illustration__cube.svelte-629kra,.illustration__wheel.svelte-629kra,.illustration__slices.svelte-629kra,.illustration__circlemixer.svelte-629kra,.illustration__sphere3d.svelte-629kra{width:80vmin}}.section.svelte-629kra{width:100%;transition:width .3s cubic-bezier(.3,.7,0,1) .1s,transform .3s cubic-bezier(.3,.7,0,1) .1s;transform:translate(0)}.section--shrink.svelte-629kra{transform-origin:0;width:100%;transition:transform .25s cubic-bezier(.3,.7,0,1) .15s;transform:scale(1)}.section__right.svelte-629kra{transition:transform .25s cubic-bezier(.3,.7,0,1) .15s;transform:translate(0)}.layout--showSidebar .section.svelte-629kra{width:calc(100% - calc(var(--sidebarWidth) - var(--size-x) * 2))}.layout--showSidebar .section--shrink.svelte-629kra{width:100%;transition:transform .25s cubic-bezier(.3,.7,0,1) .15s;transform:scale(.7)}.layout--showSidebar .section__right.svelte-629kra{transform:translate(-2rem)}@media (width<=800px){.section--editor.svelte-629kra{display:none}.layout--showSidebar .section.svelte-629kra,.layout--showSidebar .section--shrink.svelte-629kra{width:100%;transform:translateX(calc(-1 * (var(--sidebarWidth) - var(--size-x) * 2)))}.layout--showSidebar .section__right.svelte-629kra{transform:translate(0)}}.sample.svelte-629kra{white-space:nowrap}.sample.svelte-629kra:before{content:"";background:var(--onBg);border-radius:50%;width:1cap;height:1cap;margin-right:.25em;display:inline-block}.sample--y.svelte-629kra:before{background:var(--yellow)}.sample--b.svelte-629kra:before{background:var(--blue)}.sample--r.svelte-629kra:before{background:var(--red)}.sample--o.svelte-629kra:before{background:var(--orange)}.sample--v.svelte-629kra:before{background:var(--pink)}.sample--g.svelte-629kra:before{background:var(--green)}.sample--w.svelte-629kra:before{background:var(--white);box-shadow:inset 0 0 0 var(--lineWidth) var(--onBg)}.sample--bl.svelte-629kra:before{background:var(--black);box-shadow:inset 0 0 0 var(--lineWidth) var(--white)}.content-toggle.svelte-629kra,.section__right.svelte-629kra .content-toggle:where(.svelte-629kra),.section__top.svelte-629kra .content-toggle:where(.svelte-629kra){position:relative}.section__right.svelte-629kra h2:where(.svelte-629kra)+.content-toggle:where(.svelte-629kra),.section__top.svelte-629kra h2:where(.svelte-629kra)+.content-toggle:where(.svelte-629kra){margin-top:1.25rem}.section__right.svelte-629kra .content-toggle__learn:where(.svelte-629kra),.section__right.svelte-629kra .content-toggle__dev:where(.svelte-629kra),.section__top.svelte-629kra .content-toggle__learn:where(.svelte-629kra),.section__top.svelte-629kra .content-toggle__dev:where(.svelte-629kra){transition:transform .3s cubic-bezier(.3,.7,0,1) 50ms,opacity .1s linear}.section__right.svelte-629kra .content-toggle__dev:where(.svelte-629kra),.section__top.svelte-629kra .content-toggle__dev:where(.svelte-629kra){opacity:0;pointer-events:none;width:100%;position:absolute;top:0;left:0;transform:translateY(1rem)}.layout--dev .section__right.svelte-629kra .content-toggle__dev:where(.svelte-629kra),.layout--dev .section__top.svelte-629kra .content-toggle__dev:where(.svelte-629kra){opacity:1;pointer-events:auto;width:auto;transition:transform .3s cubic-bezier(.3,.7,0,1) 50ms,opacity .1s linear .2s;position:relative;transform:translateY(0)}.layout--dev .section__right.svelte-629kra .content-toggle__learn:where(.svelte-629kra),.layout--dev .section__top.svelte-629kra .content-toggle__learn:where(.svelte-629kra){opacity:0;pointer-events:none;width:100%;position:absolute;top:0;left:0;transform:translateY(-1rem)}.content-toggle__dev.svelte-629kra>:where(.svelte-629kra):first-child,.content-toggle__learn.svelte-629kra>:where(.svelte-629kra):first-child{margin-top:0}.intro.svelte-629kra .content-toggle__dev:where(.svelte-629kra),.outro.svelte-629kra .content-toggle__dev:where(.svelte-629kra){opacity:0;width:100%;transition:transform .3s cubic-bezier(.3,.7,0,1) 50ms,opacity .1s linear;position:absolute;top:0;left:50%;transform:translate(-50%)translateY(100%)}.content-toggle__learn.svelte-629kra{transition:transform .3s cubic-bezier(.3,.7,0,1) 50ms,opacity .1s linear}.layout--dev .intro.svelte-629kra .content-toggle__dev:where(.svelte-629kra){opacity:1;transition:transform .3s cubic-bezier(.3,.7,0,1) 50ms,opacity .1s linear .2s;transform:translate(-50%)translateY(0)}.layout--dev .intro.svelte-629kra .content-toggle__learn:where(.svelte-629kra){opacity:0;transform:translateY(-100%)}code.svelte-629kra{font-family:IBM Plex Mono,monospace;font-size:.6em}.preset-cards.svelte-629kra{flex-wrap:wrap;max-width:120ch;margin:10vmin auto;display:flex;position:relative}.preset-cards.svelte-629kra .item{background:var(--bg);flex:0 0 50%;width:50%}.preset-cards.svelte-629kra .presettitle{white-space:nowrap;text-overflow:ellipsis;max-width:100%;padding-bottom:.5ex;overflow:hidden}.preset-cards.svelte-629kra .item--more:where(.svelte-629kra){border:var(--lineWidth) solid var(--line);border-width:var(--lineWidth) 0 0;padding:calc(var(--size-x) * 4) calc(var(--size-x) * 4.25) var(--size-x);box-sizing:border-box;flex:none;justify-content:space-between;align-items:center;width:100%;max-width:100%;display:flex;position:relative}.item--more.svelte-629kra:before{content:"";height:var(--lineWidth);background:var(--line);left:calc(var(--size-x) * 4.25);right:calc(var(--size-x) * 4.5 + 2rem);top:calc(50% + calc(var(--size-x) * 1.5));display:block;position:absolute}.item--more__icon.svelte-629kra{width:1.5rem;height:1.5rem;animation:20s linear infinite svelte-629kra-spin;display:block}@keyframes svelte-629kra-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.item--more.svelte-629kra h3:where(.svelte-629kra){background:var(--bg);z-index:1;padding-right:.75rem;position:relative}.preset-cards.svelte-629kra .item:hover{z-index:1}@media (width<=800px){.preset-cards.svelte-629kra{display:block}.preset-cards.svelte-629kra .item{flex:0 0 100%;width:100%}}.preset-cards__caption.svelte-629kra{max-width:70ch;padding:0 var(--size);text-align:center;color:var(--line);box-sizing:border-box;margin:2rem auto 0}.cc-link.svelte-629kra .ittenWheel{vertical-align:middle;width:1em;height:1em;margin-left:.15em;display:inline-block}.sectionSettings__label{text-transform:uppercase;letter-spacing:.08em;color:var(--line);font-size:.9em}.sectionSettings__choices{display:inline-flex}.sectionSettings__choices button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none;padding:.1em .5em;transition:color .3s cubic-bezier(.3,.7,0,1);position:relative;overflow:hidden}.sectionSettings__choices button:before{content:"";background:var(--onBg);z-index:1;transition:transform .3s cubic-bezier(.3,.7,0,1);position:absolute;inset:0;transform:scaleX(0)}.sectionSettings__choices button:first-child:before{transform-origin:100%}.sectionSettings__choices button:last-child:before{transform-origin:0}.sectionSettings__choices button>span{z-index:2;position:relative}.sectionSettings__choices button:hover:before,.sectionSettings__choices button.active:before{transform:scaleX(1)}.sectionSettings__choices button:hover,.sectionSettings__choices button.active{color:var(--bg)}.sphereSettings.svelte-629kra,.panelSettings.svelte-629kra{flex-direction:column;gap:.9rem;display:flex}.hsl.svelte-629kra,.rgb.svelte-629kra,.ryb.svelte-629kra{white-space:nowrap;text-align:center}:is(.hsl.svelte-629kra,.rgb.svelte-629kra,.ryb.svelte-629kra):before{content:"";width:1cap;height:1cap;margin-right:.25em;display:inline-block}.hsl.svelte-629kra:before{background:radial-gradient(circle at 50% 50%, var(--white) 30%, transparent 30%), conic-gradient(from calc(360deg / var(--r,0) / -2) at 50% 50%, var(--stops-12));border-radius:50%}.rgb.svelte-629kra:before{background:radial-gradient(circle at 50% 27.5%, var(--red) 25%, transparent 25%), radial-gradient(circle at 20% 80%, var(--green) 20%, transparent 20%), radial-gradient(circle at 80% 80%, var(--blue) 20%, transparent 20%)}.ryb.svelte-629kra:before{background:radial-gradient(circle at 50% 27.5%, var(--red) 25%, transparent 25%), radial-gradient(circle at 20% 80%, var(--yellow) 20%, transparent 20%), radial-gradient(circle at 80% 80%, var(--blue) 20%, transparent 20%)}