:root{--alwan-pattern: url("data:image/svg+xml,<svg xmlns=%27http://www.w3.org/2000/svg%27 width=%2710%27 height=%2710%27 viewBox=%270 0 20 20%27><path fill=%27%23d1d3d4%27 d=%27M0 0h10v10H0Z%27/><path fill=%27%23fff%27 d=%27M0 10h10v10H0Z%27/><path fill=%27%23d1d3d4%27 d=%27M10 10h10v10H10Z%27/><path fill=%27%23fff%27 d=%27M10 0h10v10H10Z%27/></svg>")}.alwan{width:100%;max-width:260px;background:var(--alwan-bg, var(--color-content));border:1px solid var(--alwan-outer-bc, #ccc)}.alwan *{box-sizing:border-box}.alwan[data-theme=dark]{--alwan-bg:#111;--alwan-fg:#ccc;--alwan-outer-bc:#aaa;--alwan-button-hover:#444;--alwan-bc:#34373a;--alwan-thumb-bg:#151515;--alwan-thumb-bc:#3c4146;--alwan-label:#d8d8d8;--alwan-input-bg:#181818;--alwan-input-hover-bc:#484b4d;--alwan-swatches-bg:#0a0a0a}.alwan:not(.alwan--open){visibility:hidden}.alwan:not(.alwan--popup,.alwan--open){overflow:hidden;height:0;border:0}.alwan--popup{position:fixed;top:0;left:0;z-index:999999;border:0;box-shadow:0px 5px 5px -3px rgba(0,0,0,.2),0px 8px 10px 1px rgba(0,0,0,.14),0px 3px 14px 2px rgba(0,0,0,.12)}.alwan__container{position:relative;display:flex;align-items:center;padding:10px 15px;border-top:1px solid var(--alwan-bc, #ccc)}.alwan__palette{overflow:hidden;height:136px;outline:0;touch-action:none;user-select:none;cursor:crosshair;background:linear-gradient(to bottom, transparent, #000),linear-gradient(to right, var(--color-content), hsl(var(--alwan-h, 0), 100%, 50%))}.alwan__palette:focus .alwan__marker{box-shadow:0 0 1px 2px #117ce0}.alwan__marker{position:relative;top:-7px;left:-7px;width:14px;height:14px;border-radius:100%;background:rgba(0,0,0,0);border:2px solid var(--color-content);box-shadow:0 0 2px rgba(0,0,0,.7);cursor:move}.alwan__preview{width:42px;height:42px;margin-right:15px;border:1px solid var(--alwan-bc, #ccc);flex-shrink:0}.alwan__preview .alwan__copy-button{position:relative;display:flex;justify-content:center;align-items:center;width:100%;height:100%;color:var(--color-content);opacity:0;border-radius:0;margin:0}.alwan__preview .alwan__copy-button:focus,.alwan__preview .alwan__copy-button:hover{opacity:1;z-index:100;background-color:rgba(0,0,0,.6)}.alwan__sliders{width:100%}.alwan__slider{display:block;width:100%;background:linear-gradient(to left, red 0%, #ff0 17%, lime 33%, cyan 50%, blue 66%, #f0f 83%, red 100%);margin:0;padding:0;cursor:pointer;outline:0;-webkit-appearance:none;appearance:none;--alwan-alpha: linear-gradient(90deg, transparent, var(--alwan-rgb)), var(--alwan-pattern);--alwan-hue: linear-gradient( -90deg, #ff0000, var(--color-content)f00, #00ff00, #00ffff, #0000ff, #ff00ff, #ff0000 )}.alwan__slider:active{cursor:ew-resize}.alwan__slider--alpha{margin-top:14px}.alwan__slider::-webkit-slider-runnable-track{-webkit-appearance:none;appearance:none;height:15px;border:0}.alwan__slider::-webkit-slider-runnable-track:active{cursor:ew-resize}.alwan__slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;height:21px;width:14px;margin-top:-3px;background-color:var(--alwan-thumb-bg, var(--color-content));border:1px solid var(--alwan-thumb-bc, #8f8f8f);border-radius:3px;box-shadow:0 0 2px rgba(0,0,0,.7);cursor:ew-resize}.alwan__slider:focus::-webkit-slider-thumb{border-color:#117ce0}.alwan__slider--hue::-webkit-slider-runnable-track{background:var(--alwan-hue)}.alwan__slider--alpha::-webkit-slider-runnable-track{background:var(--alwan-alpha)}.alwan__slider::-moz-range-track{height:15px;border:0}.alwan__slider--hue::-moz-range-track{background:var(--alwan-hue)}.alwan__slider--alpha::-moz-range-track{background:var(--alwan-alpha)}.alwan__slider::-moz-range-thumb{box-sizing:border-box;width:14px;height:21px;padding:0;background-color:var(--alwan-thumb-bg, var(--color-content));border:1px solid var(--alwan-thumb-bc, #8f8f8f);border-radius:3px;box-shadow:0 0 2px rgba(0,0,0,.7);cursor:ew-resize}.alwan__slider:focus::-moz-range-thumb{border-color:#117ce0}.alwan__inputs{display:flex;width:100%}.alwan__inputs label{width:100%;text-align:center;margin-right:4px;text-transform:uppercase;color:var(--alwan-label, #555);cursor:pointer;font-family:system-ui;font-size:13px;-webkit-user-select:none;-moz-user-select:none;user-select:none}.alwan__input{display:block;width:100%;padding:8px 5px;text-align:center;color:var(--alwan-fg, var(--color-text));font-size:14px;font-family:monospace;border:1px solid var(--alwan-bc, #ccc);margin-bottom:3px;background-color:var(--alwan-input-bg, var(--color-content));line-height:1}.alwan__input::-webkit-outer-spin-button,.alwan__input::-webkit-inner-spin-button{-webkit-appearance:none}.alwan__input:focus{outline:0;border-color:#117ce0}.alwan__input:focus+span{color:#117ce0}.alwan__input:hover{border-color:var(--alwan-input-hover-bc, #a8a8a8)}.alwan__swatches{display:flex;justify-content:center;flex-wrap:wrap;background-color:var(--alwan-swatches-bg, #f5f5f5);padding:10px 15px 0 15px;max-height:100px;overflow-y:auto;border-top:1px solid var(--alwan-bc, #ccc)}.alwan__swatch{width:22px;height:22px;margin:0 5px 10px 5px;border-radius:2px}.alwan__swatch:hover{transform:scale(1.1)}.alwan__button{display:inline-block;background:rgba(0,0,0,0);color:var(--alwan-fg, var(--color-text));border:1px solid rgba(0,0,0,0);cursor:pointer;padding:8px 4px;transition:background-color .2s ease-in-out;outline:0}.alwan__button:disabled{opacity:.5;cursor:not-allowed}.alwan__button:hover{background-color:var(--alwan-button-hover, #f0f0f0)}.alwan__button:focus-visible{border-color:#117ce0}.alwan__button svg{fill:currentColor;pointer-events:none;vertical-align:middle}.alwan__preset-button{width:24px;height:24px;border-radius:4px}.alwan__swatch:focus,.alwan__preset-button:focus{outline:1px dashed var(--alwan-color);outline-offset:1px}.alwan__copy-button{margin-right:15px}.alwan__backdrop{position:fixed;top:0;left:0;right:0;bottom:0;z-index:9999999999;cursor:move}.alwan__swatch,.alwan__preview,.alwan__preset-button{position:relative;background:var(--alwan-pattern);background-clip:padding-box;overflow:hidden;padding:0}.alwan__swatch::before,.alwan__preview::before,.alwan__preset-button::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:var(--alwan-color)}.alwan__toggle-button{display:flex;align-items:center;justify-content:center;width:100%;padding:0;height:10px;border-top:1px solid var(--alwan-bc, #ccc);overflow:hidden}.alwan--collapse.alwan__swatches{display:none}.alwan--collapse+.alwan__toggle-button svg{transform:rotate(180deg)}

/*# sourceMappingURL=alwan.min.css.map*/