@import url(https://rsms.me/inter/inter.css);.backdrop{position:fixed;top:0;right:0;bottom:0;left:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:rgba(0,0,0,.5);z-index:1}.modal{padding:var(--content-padding);width:100%;max-width:90vw;max-height:90vh;padding:var(--block-padding) var(--block-padding) 32px var(--block-padding);width:90vw;max-width:720px;max-height:80vh;overflow-y:auto;background:#fff;border-radius:var(--radius);-webkit-box-shadow:0 0 12px 4px rgba(0,0,0,.1);box-shadow:0 0 12px 4px rgba(0,0,0,.1)}.export__controls[data-v-64272323]{margin-bottom:var(--block-padding)}.export__code[data-v-64272323]{height:100%;padding:8px;font-family:Menlo,monospace;line-height:1.4em;background:var(--bg-color-light);border-radius:var(--radius-sm)}@media (min-width:640px){.export__row[data-v-64272323]{display:grid;grid-template-columns:124px auto;grid-column-gap:var(--block-padding)}}.subtitle[data-v-c7e3b6d2]{font-size:var(--font-size-lg);margin-bottom:8px}.credits__author[data-v-c7e3b6d2]{display:block}.credits__author[data-v-c7e3b6d2],.credits__link[data-v-c7e3b6d2]{color:var(--color-muted);text-decoration:none}.credits__link[data-v-c7e3b6d2]:hover{color:var(--color-secondary);text-decoration:underline}.menu-bar[data-v-c7b0620c]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;background:var(--bg-color-menu-bar);padding:var(--block-padding)}.menu-bar__logo[data-v-c7b0620c]{height:64px}.menu-bar__title[data-v-c7b0620c]{margin-bottom:20px}.menu-bar__credits-desktop[data-v-c7b0620c],.menu-bar__toggles[data-v-c7b0620c]{display:none}.menu-bar__credits-mobile[data-v-c7b0620c]{margin-bottom:8px;font-size:var(--font-size-lg)}.menu-bar__actions[data-v-c7b0620c]{margin-bottom:8px}.menu-bar .button[data-v-c7b0620c]{margin-left:4px;text-align:left;padding:8px 12px}.menu-bar .button[data-v-c7b0620c]:first-of-type{margin-left:0}@media (max-width:639px){.menu-bar .button[data-v-c7b0620c]{padding:8px 16px}}@media (min-width:640px){.menu-bar[data-v-c7b0620c]{-webkit-box-align:center;-ms-flex-align:center;align-items:center}.menu-bar__logo[data-v-c7b0620c]{width:100%;height:auto}.menu-bar__subtitle[data-v-c7b0620c]{font-size:var(--font-size);margin-bottom:24px}.menu-bar__toggles[data-v-c7b0620c]{display:block}.menu-bar__credits-mobile[data-v-c7b0620c]{display:none}.menu-bar__credits-desktop[data-v-c7b0620c]{display:block}.menu-bar .button[data-v-c7b0620c]{width:100%;margin:0 0 8px 0}}.stack[data-v-43387668]{border-radius:var(--radius-sm);-webkit-transition:-webkit-transform var(--transition);transition:-webkit-transform var(--transition);transition:transform var(--transition);transition:transform var(--transition),-webkit-transform var(--transition)}.stack--highlight[data-v-43387668]{-webkit-transform:scale(.95);transform:scale(.95)}.stack-block[data-v-43387668]:first-of-type{border-radius:var(--radius-sm) var(--radius-sm) 0 0}.stack-block[data-v-43387668]:last-of-type{border-radius:0 0 var(--radius-sm) var(--radius-sm)}.stack-block[data-v-38967e8c]{position:relative;width:10.5em;min-height:2em;margin-bottom:var(--swatch-gap);padding:8px;font-size:var(--font-size-sm)}.stack-block__content[data-v-38967e8c]{opacity:.8}.bold[data-v-38967e8c]{font-weight:var(--weight-bold)}.muted[data-v-38967e8c]{opacity:.8}.stack-block__contrast-icon[data-v-38967e8c]{line-height:1}.not-compliant[data-v-38967e8c]:after{position:absolute;content:"Not AA";right:8px;bottom:8px;opacity:.85;padding:0 4px 1px 4px;font-size:10px;font-weight:var(--weight-bold);color:#fff;border:1px solid #fff;border-radius:var(--radius)}.color-stacks[data-v-4c6cacba]{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.color-stack[data-v-4c6cacba]{margin-right:var(--stack-gap)}.color-stack[data-v-4c6cacba]:last-of-type{padding-right:var(--block-padding)}.curve-toggle[data-v-595940f2]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:4px}.curve-toggle__label[data-v-595940f2]{text-transform:none}.curve-toggle__button[data-v-595940f2]{width:36px;height:21px;padding:0;stroke:var(--gray-25)}.curve-toggle__button:hover .curve-toggle__icon path[data-v-595940f2]{stroke:var(--gray-65)}.curve-toggle__button:hover .curve-toggle__icon circle[data-v-595940f2]{fill:var(--gray-5);stroke:var(--gray-65)}.curve-toggle__icon[data-v-595940f2]{position:relative;top:1px}.curve-toggle__icon path[data-v-595940f2]{stroke:var(--gray-20)}.curve-toggle__icon circle[data-v-595940f2]{fill:var(--gray-5);stroke:var(--gray-20)}.popover[data-v-29f706f8]{position:relative}.popover__bubble[data-v-29f706f8]{position:absolute;top:0;left:0;padding:12px;background:#fff;border:var(--border-light);border-radius:var(--radius);-webkit-box-shadow:var(--shadow);box-shadow:var(--shadow);z-index:1}.trigger[data-v-800a1586]{position:relative;top:6px;color:var(--color-muted);cursor:pointer}.trigger[data-v-800a1586]:hover{color:var(--selected-color)}.content[data-v-800a1586]{position:relative}.input[data-v-800a1586]{position:relative;width:6em;height:25px;border-radius:var(--radius-sm) 0 0 var(--radius-sm)}.button[data-v-800a1586]{border-left:none;border-radius:0 var(--radius-sm) var(--radius-sm) 0}.spectrum-handle[data-v-3b3e7b18]{--spectrum-handle-width:16px;--spectrum-handle-input-width:38px;position:absolute}.handle[data-v-3b3e7b18]{height:calc(var(--spectrum-height) + var(--spectrum-handle-overhang)*2);background:#fff;border:var(--control-border);border-radius:var(--radius-sm);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.handle-input[data-v-3b3e7b18]{position:absolute;top:calc(var(--control-height)*-1 + -4px);left:calc(var(--spectrum-handle-input-width)*-0.5 + var(--spectrum-handle-width)*0.5);width:var(--spectrum-handle-input-width);height:24px;padding:4px 6px;text-align:center;font-weight:var(--weight-bold)}.handle-remove[data-v-3b3e7b18]{position:relative;top:5px;left:-2px;width:20px;height:20px;padding:0;border:0;border-radius:50%;color:var(--gray-20)}.handle-remove[data-v-3b3e7b18]:hover{color:var(--gray-65)}.handle-remove[data-v-3b3e7b18]:focus{-webkit-box-shadow:none;box-shadow:none}.feather[data-v-3b3e7b18]{margin-top:-2px;width:var(--control-icon-size)}.spectrum[data-v-3de485f2]{position:relative;padding-bottom:28px}.spectrum-gradient[data-v-3de485f2]{height:var(--spectrum-height);background:-webkit-gradient(linear,left top,right top,from(red),color-stop(17%,#ff0),color-stop(33%,#0f0),color-stop(50%,#0ff),color-stop(66%,#00f),color-stop(83%,#f0f),to(red));background:linear-gradient(90deg,red 0,#ff0 17%,#0f0 33%,#0ff 50%,#00f 66%,#f0f 83%,red);border-radius:var(--radius-sm);cursor:copy}.hues[data-v-3de485f2]{position:absolute;top:calc(var(--spectrum-handle-overhang)*-1);left:0;width:100%}.title-row[data-v-58a18506]{display:-webkit-box;display:-ms-flexbox;display:flex}.hex-input[data-v-58a18506]{margin-left:8px}.section-color[data-v-58a18506]{padding:var(--block-padding)}.spectrum-row[data-v-58a18506]{margin-bottom:12px}.stack-row[data-v-58a18506]{display:-webkit-box;display:-ms-flexbox;display:flex}.section-stacks[data-v-58a18506]{width:100%;overflow-y:visible;overflow-x:auto;margin-left:var(--block-padding);margin-right:calc(var(--block-padding)*-1)}.section-grays[data-v-2bb32acb]{padding:var(--block-padding)}.stack-row[data-v-2bb32acb]{display:-webkit-box;display:-ms-flexbox;display:flex}.section-stacks[data-v-2bb32acb]{margin-left:var(--block-padding)}:root{--gray-0:#f8f9fc;--gray-5:#edeff2;--gray-10:#d4d5d8;--gray-25:#abacaf;--gray-45:#797a7d;--gray-65:#4a4c4e;--gray-80:#2a2b2d;--gray-90:#18191b;--gray-95:#101113;--powder-blue-20:#74d1ff;--powder-blue-35:#00a9f9;--powder-blue-55:#0082f1;--powder-blue-70:#005ee8;--powder-blue-90:#0041dd;--rose-20:#e4b2ac;--rose-35:#e07066;--rose-55:#cf0527;--rose-70:#b50000;--rose-90:#970000;--color:var(--gray-80);--color-secondary:var(--gray-65);--color-muted:var(--gray-45);--bg-color:var(--gray-0);--bg-color-menu-bar:#fff;--bg-color-light:var(--gray-5);--border-color:var(--gray-10);--border-color-light:var(--gray-5);--border:1px solid var(--border-color);--border-light:1px solid var(--border-color-light);--selected-color:var(--powder-blue-55);--focus-color:var(--powder-blue-35);--invalid-color:var(--rose-55);--font-size:12px;--font-size-lg:14px;--font-size-sm:11px;--font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;--font-family-heading:var(--font-family);--weight-regular:500;--weight-bold:700;--radius:12px;--radius-sm:6px;--shadow:0 12.5px 10px rgba(0,0,0,0.035),0 100px 80px rgba(0,0,0,0.07);--transition:0.3s;--control-font-size:var(--font-size);--control-color:var(--color);--control-bg-color:#fff;--control-border:var(--border);--control-border-color:var(--border-color);--control-box-shadow:0 1px 2px rgba(0,0,0,0.1);--control-height:24px;--control-icon-size:16px;--control-bg-hover:var(--gray-5);--block-padding:16px;--stack-gap:8px;--swatch-gap:0;--spectrum-height:24px;--spectrum-handle-overhang:4px}.dark-mode{--color:var(--gray-10);--color-secondary:var(--gray-25);--color-muted:var(--gray-45);--bg-color:var(--gray-90);--bg-color-light:var(--gray-80);--bg-color-menu-bar:var(--gray-80);--border-color:var(--gray-65);--border-color-light:var(--gray-80);--border:1px solid var(--border-color);--border-light:1px solid var(--border-color-light);--control-color:var(--color);--control-bg-color:var(--gray-65);--control-bg-hover:var(--gray-45);--control-border:var(--border)}*{-webkit-box-sizing:border-box;box-sizing:border-box;font-weight:500;font-weight:var(--weight-regular)}body{margin:0;padding:0;color:#2a2b2d;color:var(--color);background-color:#f8f9fc;background-color:var(--bg-color);font-size:12px;font-size:var(--font-size);overflow-x:hidden}body,button,input{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-family:var(--font-family)}::-webkit-input-placeholder{color:#abacaf;color:var(--gray-25)}::-moz-placeholder{color:#abacaf;color:var(--gray-25)}:-ms-input-placeholder{color:#abacaf;color:var(--gray-25)}::-ms-input-placeholder{color:#abacaf;color:var(--gray-25)}::placeholder{color:#abacaf;color:var(--gray-25)}h1,h2,h3,h4{margin-top:0;margin-bottom:16px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-family:var(--font-family-heading);font-weight:700;font-weight:var(--weight-bold);letter-spacing:-.01em}h1{text-transform:uppercase}h1,h2{font-size:20px}h2{margin-bottom:36px}h3{font-size:13px;letter-spacing:.03em;margin-bottom:4px}.help,h3{color:#797a7d;color:var(--color-muted)}.help{padding:8px 0}button,input{border-radius:6px;border-radius:var(--radius-sm);color:#2a2b2d;color:var(--control-color);background:#fff;background:var(--control-bg-color);font-size:12px;font-size:var(--control-font-size)}input[type=number],input[type=text]{height:24px;height:var(--control-height);border:1px solid #d4d5d8;border:var(--control-border);padding:4px 8px}input[type=number]:focus,input[type=text]:focus{outline:none;border-color:#00a9f9;border-color:var(--focus-color);-webkit-box-shadow:0 0 0 1px #00a9f9;-webkit-box-shadow:0 0 0 1px var(--focus-color);box-shadow:0 0 0 1px #00a9f9;box-shadow:0 0 0 1px var(--focus-color)}input[type=number].invalid,input[type=text].invalid{outline:none;border-color:#cf0527;border-color:var(--invalid-color);-webkit-box-shadow:0 0 0 1px #cf0527;-webkit-box-shadow:0 0 0 1px var(--invalid-color);box-shadow:0 0 0 1px #cf0527;box-shadow:0 0 0 1px var(--invalid-color)}input[type=number]{-webkit-appearance:none;-moz-appearance:none;appearance:none;-moz-appearance:textfield}input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{display:none}button{padding:6px 12px;cursor:pointer;border:1px solid #d4d5d8;border:var(--control-border);-webkit-box-shadow:0 1px 2px rgba(0,0,0,.1);-webkit-box-shadow:var(--control-box-shadow);box-shadow:0 1px 2px rgba(0,0,0,.1);box-shadow:var(--control-box-shadow);border-radius:6px;border-radius:var(--radius-sm)}.button--primary{color:#fff;background:#0082f1;background:var(--selected-color)}@media (min-width:640px){button{padding:4px 8px}}button:hover{background:#edeff2;background:var(--control-bg-hover)}button:focus{outline:none}button:active{position:relative;top:2px}.label{color:#4a4c4e;color:var(--color-secondary);font-size:11px;font-size:var(--font-size-sm);letter-spacing:.03em;font-weight:700;font-weight:var(--weight-bold);text-transform:uppercase}.control-group{margin-bottom:12px}.control-group:last-of-type{margin-bottom:0}.label--checkbox,.label--radio{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:8px;border-radius:6px;border-radius:var(--radius-sm)}.label--checkbox:hover,.label--radio:hover{background:#edeff2;background:var(--control-bg-hover);cursor:pointer}.toggle-button{margin-right:6px}pre{margin:0}pre[contenteditable=true]:focus{outline:none;-webkit-box-shadow:0 0 0 2px #00a9f9;-webkit-box-shadow:0 0 0 2px var(--focus-color);box-shadow:0 0 0 2px #00a9f9;box-shadow:0 0 0 2px var(--focus-color)}.control-col{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-flex:0;-ms-flex:0 0 112px;flex:0 0 112px}.control-col-section{margin-bottom:16px}.control-col-section:last-of-type{margin-bottom:0}.control-col__btn{width:100%;margin:4px 0 8px;text-align:left}.vue-slider{z-index:0}.vue-slider-disabled{opacity:.5;cursor:not-allowed}.vue-slider-rail{background-color:#ccc;border-radius:15px}.vue-slider-process{background-color:var(--selected-color);border-radius:15px}.vue-slider-mark{z-index:1}.vue-slider-mark:first-child .vue-slider-mark-step,.vue-slider-mark:last-child .vue-slider-mark-step{display:none}.vue-slider-dot{z-index:1}.vue-slider-dot-handle{cursor:pointer;width:100%;height:100%;border-radius:50%;background-color:#fff;-webkit-box-sizing:border-box;box-sizing:border-box;border:var(--border);-webkit-box-shadow:var(--control-box-shadow);box-shadow:var(--control-box-shadow)}.vue-slider-dot-handle-focus{border:2px solid var(--focus-color)}.vue-slider-dot-handle-disabled{cursor:not-allowed;background-color:#ccc}.vue-slider-dot-tooltip-inner{font-size:var(--font-size);font-weight:var(--weight-regular);white-space:nowrap;padding:2px 5px;min-width:20px;text-align:center;color:#fff;border-radius:5px;border-color:var(--selected-color);background-color:var(--selected-color);-webkit-box-sizing:content-box;box-sizing:content-box}.vue-slider-dot-tooltip-inner:after{content:"";position:absolute}.vue-slider-dot-tooltip-inner-top:after{top:100%;border-color:transparent;border-style:solid;border-width:5px;border-top-color:inherit}.vue-slider-dot-tooltip-inner-bottom:after,.vue-slider-dot-tooltip-inner-top:after{left:50%;-webkit-transform:translate(-50%);transform:translate(-50%);height:0;width:0}.vue-slider-dot-tooltip-inner-bottom:after{bottom:100%;border-color:transparent;border-style:solid;border-width:5px;border-bottom-color:inherit}.vue-slider-dot-tooltip-inner-left:after{left:100%;border-color:transparent;border-style:solid;border-width:5px;border-left-color:inherit}.vue-slider-dot-tooltip-inner-left:after,.vue-slider-dot-tooltip-inner-right:after{top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);height:0;width:0}.vue-slider-dot-tooltip-inner-right:after{right:100%;border-color:transparent;border-style:solid;border-width:5px;border-right-color:inherit}.vue-slider-dot-tooltip-wrapper{opacity:0;-webkit-transition:all .3s;transition:all .3s}.vue-slider-dot-tooltip-wrapper-show{opacity:1}.app[data-v-aa1a4706]{--app-menu-bar-width:150px;--app-grays-width:272px}.app__grays[data-v-aa1a4706],.app__menu-bar[data-v-aa1a4706]{border-bottom:var(--border-light)}.app__color[data-v-aa1a4706]{padding-bottom:48px}@media (min-width:640px){.app__menu-bar[data-v-aa1a4706]{position:fixed;width:var(--app-menu-bar-width);height:100vh;overflow-y:auto;border-right:var(--border-light)}.app__sections[data-v-aa1a4706]{margin-left:var(--app-menu-bar-width)}.app__color[data-v-aa1a4706]{padding-bottom:var(--block-padding)}}@media (min-width:1120px){.app__sections[data-v-aa1a4706]{display:-webkit-box;display:-ms-flexbox;display:flex;min-height:100vh}.app__grays[data-v-aa1a4706]{-webkit-box-flex:0;-ms-flex:0 0 var(--app-grays-width);flex:0 0 var(--app-grays-width);border-bottom:none;border-right:var(--border-light)}.app__color[data-v-aa1a4706]{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;overflow-x:hidden}}