:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:#ffffffde;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#242424;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}a{color:#646cff;-webkit-text-decoration:inherit;text-decoration:inherit;font-weight:500}a:hover{color:#535bf2}body{place-items:center;min-width:320px;min-height:100vh;margin:0;display:flex}h1{font-size:3.2em;line-height:1.1}.card{padding:2em}#app{text-align:center;max-width:1280px;margin:0 auto;padding:2rem}button{cursor:pointer;background-color:#1a1a1a;border:1px solid #0000;border-radius:8px;padding:.6em 1.2em;font-family:inherit;font-size:1em;font-weight:500;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.slider.svelte-1b87bab{width:var(--width);margin:auto;position:relative}.title.svelte-1b87bab{box-sizing:border-box;letter-spacing:.05em;text-transform:none;color:#000000bf;grid-template-columns:1fr auto 1fr;align-items:center;column-gap:6px;width:100%;margin-bottom:4px;font-size:.7rem;line-height:1.2;display:grid}.title-label.svelte-1b87bab{grid-column:2}.title-action.svelte-1b87bab{grid-column:3;justify-self:start;align-items:center;height:0;line-height:0;display:flex}button.title.svelte-1b87bab{cursor:pointer;background:0 0;border:none;padding:0;font-family:inherit}button.title.svelte-1b87bab:focus-visible{outline-offset:2px;border-radius:3px;outline:2px solid #00000080}input.svelte-1b87bab{appearance:none;cursor:pointer;background:0 0;width:100%;margin:0;display:block}input.svelte-1b87bab::-webkit-slider-runnable-track{background:var(--trackBackground);border-radius:8px;height:22px}input.svelte-1b87bab::-webkit-slider-thumb{appearance:none;background:var(--thumbColor);box-sizing:content-box;border-radius:4px;width:2px;height:10px;margin-top:6px}input.svelte-1b87bab::-moz-range-track{background:var(--trackBackground);border-radius:8px;height:22px}input.svelte-1b87bab::-moz-range-thumb{background:var(--thumbColor);border:none;border-radius:4px;width:2px;height:10px}input.svelte-1b87bab:focus{outline:none}input.svelte-1b87bab:focus-visible{outline:2px solid var(--thumbColor);outline-offset:2px}.marker.svelte-1b87bab{bottom:-17px;left:clamp(.5rem, var(--at), calc(100% - .5rem));z-index:1;line-height:0;position:absolute;transform:translate(-50%)}span.marker.svelte-1b87bab:not(.iconed){background:var(--dot-color,#0000008c);border-radius:50%;width:8px;height:8px}button.marker.svelte-1b87bab{cursor:pointer;color:#000000b3;background:0 0;border:none;padding:0}button.marker.svelte-1b87bab:not(.iconed){width:16px;height:16px}button.marker.svelte-1b87bab:not(.iconed):before{content:"";background:var(--dot-color,#0009);border-radius:50%;width:8px;height:8px;margin:auto;position:absolute;inset:0}.marker.iconed.svelte-1b87bab{display:flex}button.marker.svelte-1b87bab:focus-visible{outline-offset:2px;border-radius:3px;outline:2px solid #0009}.palettes.svelte-267gk6{align-content:start;gap:1.25rem;width:15rem;margin:0 auto;display:grid}.palettes.svelte-267gk6 h2:where(.svelte-267gk6){letter-spacing:.05em;text-transform:none;color:#000000bf;text-align:center;margin:0 0 4px;font-size:.7rem;font-weight:400;line-height:1.2;transition:opacity .2s linear}.palettes.svelte-267gk6 h2:where(.svelte-267gk6):has(+.swatches:where(.svelte-267gk6):hover){opacity:0}.swatches.svelte-267gk6{height:22px;display:flex}.swatch.svelte-267gk6{background-color:var(--swatch);cursor:pointer;border:none;border-radius:0;flex:1;height:100%;margin:0;padding:0;position:relative}.swatch.svelte-267gk6:first-child{border-radius:8px 0 0 8px}.swatch.svelte-267gk6:last-child{border-radius:0 8px 8px 0}.marker.svelte-267gk6{background:var(--current);opacity:0;pointer-events:none;border-radius:50%;width:8px;height:8px;transition:transform .12s linear,opacity .12s linear;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.swatches.svelte-267gk6:hover .marker:where(.svelte-267gk6){opacity:1}.swatch.svelte-267gk6:hover .marker:where(.svelte-267gk6){transform:translate(-50%,calc(-50% - 19px))}.swatch.selected.svelte-267gk6 .marker:where(.svelte-267gk6){transform:translate(-50%,calc(-50% - 14px))}.named.svelte-267gk6 .marker:where(.svelte-267gk6){border-radius:1px;width:22%;height:2px}.named.svelte-267gk6 .swatch:where(.svelte-267gk6):hover .marker:where(.svelte-267gk6){transform:translate(-50%,calc(17px - 50%))}.named.svelte-267gk6 .swatch.selected:where(.svelte-267gk6) .marker:where(.svelte-267gk6){transform:translate(-50%,calc(14px - 50%))}.swatch.svelte-267gk6:focus-visible{outline-offset:-2px;z-index:1;outline:2px solid #1a73e8;position:relative}.named.svelte-267gk6{position:relative}.named-toggle.svelte-267gk6{letter-spacing:.05em;text-transform:none;color:#000000bf;cursor:pointer;background:0 0;border:none;align-items:center;gap:.25rem;margin:0;padding:0;font-size:.7rem;font-weight:400;line-height:1.2;display:inline-flex}.named-toggle.svelte-267gk6:focus-visible{outline-offset:2px;border-radius:3px;outline:2px solid #1a73e8}.chev.svelte-267gk6{color:#888;align-items:center;height:0;line-height:0;transition:transform .15s;display:inline-flex}.chev.open.svelte-267gk6{transform:rotate(180deg)}.named-list.svelte-267gk6{z-index:5;background:#fff;border:1px solid #0000001f;border-radius:8px;min-width:9rem;margin:0;padding:.25rem;list-style:none;position:absolute;top:1.1rem;left:0;box-shadow:0 6px 18px #0000002e}.named-list.svelte-267gk6 button:where(.svelte-267gk6){text-align:left;color:#333;cursor:pointer;background:0 0;border:none;border-radius:5px;width:100%;padding:.3rem .5rem;font-size:.7rem;display:block}.named-list.svelte-267gk6 button:where(.svelte-267gk6):hover{background:#0000000f}.named-list.svelte-267gk6 button.current:where(.svelte-267gk6){color:#1a73e8;font-weight:700}.named-list.svelte-267gk6 button:where(.svelte-267gk6):focus-visible{outline-offset:-2px;outline:2px solid #1a73e8}.named-rows.svelte-267gk6{gap:.75rem;display:grid}section[aria-label=color\ inputs].svelte-1idhjpd{color:var(--textColor);text-transform:uppercase;grid-template-rows:min-content 1fr min-content;align-content:start;row-gap:1.75rem;padding:1rem 0 1.25rem;display:grid}.content.svelte-1idhjpd{height:195px}.content.scroll.svelte-1idhjpd{overflow:hidden auto}.sliders.svelte-1idhjpd{align-content:start;gap:1.25rem;display:grid}.sliders-view.svelte-1idhjpd{flex-direction:column;height:100%;display:flex}section[aria-label=color\ inputs].svelte-1idhjpd .mode-toggle:where(.svelte-1idhjpd){cursor:pointer;letter-spacing:.05em;text-transform:none;color:#0009;background:0 0;border:none;border-radius:6px;align-self:center;align-items:center;gap:.35rem;width:auto;height:auto;margin-top:auto;padding:.25rem .6rem;font-size:.7rem;display:inline-flex}section[aria-label=color\ inputs].svelte-1idhjpd .mode-toggle:where(.svelte-1idhjpd):hover{background:#0000000d}section[aria-label=color\ inputs].svelte-1idhjpd .mode-toggle:where(.svelte-1idhjpd):focus-visible{outline-offset:2px;outline:2px solid #00000080}.values.svelte-1idhjpd{text-transform:none;--textColor:#1a73e8;align-content:start;gap:.75rem;width:15rem;margin:0 auto;display:grid}.values.svelte-1idhjpd h2:where(.svelte-1idhjpd){letter-spacing:.05em;text-transform:none;color:#000000bf;text-align:left;margin:0 0 4px;font-size:.7rem;font-weight:400;line-height:1.2}.values.svelte-1idhjpd .value:where(.svelte-1idhjpd){grid-template-columns:1fr 1.75rem;align-items:center;column-gap:.25rem;display:grid}.values.svelte-1idhjpd code:where(.svelte-1idhjpd){color:#000000d9;-webkit-user-select:all;user-select:all;text-align:left;font-size:.8rem}section[aria-label=color\ inputs].svelte-1idhjpd menu:where(.svelte-1idhjpd){box-sizing:border-box;background-color:var(--color);border-radius:10px;grid-template-columns:1fr repeat(2,1.75rem);align-items:center;column-gap:.25rem;width:15rem;height:2.25rem;margin:0 auto;padding:0 .5rem 0 .75rem;display:grid}section[aria-label=color\ inputs].svelte-1idhjpd nav:where(.svelte-1idhjpd){justify-content:space-around;align-items:center;width:15rem;margin:0 auto;display:flex}section[aria-label=color\ inputs].svelte-1idhjpd nav:where(.svelte-1idhjpd) button:where(.svelte-1idhjpd):focus-visible{outline-offset:-2px;outline:2px solid #00000080}section[aria-label=color\ inputs].svelte-1idhjpd button:where(.svelte-1idhjpd){cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;width:1.75rem;height:1.75rem;padding:0;display:flex}section[aria-label=color\ inputs].svelte-1idhjpd button:where(.svelte-1idhjpd):focus-visible{outline:2px solid var(--textColor);outline-offset:-2px}input.hex.svelte-1idhjpd{font:inherit;color:inherit;text-transform:inherit;background:0 0;border:none;width:100%;min-width:0;height:100%;margin:0;padding:0 4px 0 0;line-height:normal}input.hex.svelte-1idhjpd:focus-visible{outline:2px solid var(--textColor);outline-offset:-2px;border-radius:6px}.visually-hidden.svelte-1idhjpd{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}section[aria-label=color\ picker].svelte-1o0v9x0{background-color:#fff;grid-template-rows:1fr 2fr;width:330px;height:600px;display:grid}