@import url(https://fonts.googleapis.com/css2?family=Lato:wght@400;700;900&display=swap);@import url(https://fonts.googleapis.com/css2?family=Gabarito:wght@400;700;900&display=swap);body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--color-neutral-750);color:var(--color-neutral-00);font-family:Lato,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*{box-sizing:border-box}*,button{font-family:Lato,sans-serif}.color-grid{position:relative}.sticky-header{align-items:center;background-color:var(--color-neutral-700);border-bottom:1px solid var(--color-neutral-800);display:flex;height:72px;justify-content:space-between;left:0;padding:0 16px;position:fixed;right:0;top:0;z-index:999}.filters-dropdown .dropdown-menu{z-index:1000}.dot-grid-wrapper{background:none;margin:0;max-height:none;max-width:none;min-height:0;min-width:0;padding:0;position:relative;width:100%}.guide-overlay{height:1110px;left:0;pointer-events:none;position:absolute;top:0;width:1110px;z-index:0}.guide-overlay svg{height:100%;opacity:.4;width:100%}.color-swatch{background-color:var(--color-neutral-700);overflow:hidden;transition:transform .2s}.color-swatch-header{align-items:center;border-bottom:1px solid var(--color-neutral-800);display:flex;justify-content:space-between;padding:8px}.color-swatch-container{margin-bottom:8px;width:100%}.lightness-controls{width:100%}.color-swatch{align-items:center;background-color:var(--color-overlay-background);border-radius:4px;cursor:pointer;display:flex;flex:1 1;grid-column:span 3;height:48px;justify-content:space-between;outline:none;padding:0 12px 0 8px;position:relative}.color-swatch:focus{outline:none}.color-swatch:focus-visible{outline:none}.color-swatch.active{animation:pulses 2s infinite;outline:1px solid var(--color-primary-450);z-index:999}.hex-label{background-color:var(--color-overlay-background);border-radius:4px;color:var(--color-neutral-00);font-family:Lato,sans-serif;font-size:14px;opacity:1;padding:4px 6px}.reference-dot,.reference-dots{display:flex;gap:8px}.reference-dot{align-items:center;font-family:Lato,sans-serif;font-size:14px}.white-dot{color:#fff;opacity:.9}.black-dot{color:#000;opacity:.9}.contrast-ratio{font-weight:500}@keyframes pulses{0%{box-shadow:0 0 0 0 #237ff700}50%{box-shadow:0 0 8px 4px #237ff7cc}to{box-shadow:0 0 0 0 #237ff700}}.btn-icon-only{align-items:center;background:var(--color-neutral-700);border:1px solid var(--color-neutral-600);border-radius:4px;cursor:pointer;display:flex;height:32px;justify-content:center;min-width:32px;padding:4px;transition:all .2s ease}.btn-icon-only:hover{background:var(--color-neutral-600);border-color:var(--color-neutral-500)}.btn-icon-only svg{fill:var(--color-neutral-400);height:16px;width:16px}.btn-icon-only:hover svg{fill:var(--color-neutral-200)}.mobile-container{align-items:center;background-color:var(--color-neutral-750);display:none;flex-direction:column;height:100vh;justify-content:center;padding:24px;text-align:center}.mobile-headline{color:#fff;font-family:Lato,sans-serif;font-size:24px;font-weight:400;margin-bottom:16px}.mobile-body{font-family:Lato,sans-serif;font-size:16px;line-height:1.5;margin-bottom:32px;max-width:320px}.mobile-body,.mobile-header{color:var(--color-neutral-400)}.mobile-header{padding:16px;text-align:center}@media (max-width:768px){.mobile-container{display:flex}.fab-help,.left-drawer,.main-container{display:none!important}.app{overflow:hidden}.main-content{margin-left:0!important}.filters-dropdown,.header-actions{display:none!important}.app-header{justify-content:center!important}.app-header h1{margin:0}}.left-drawer{background:var(--color-neutral-750);box-sizing:border-box;height:calc(100vh - 81px);left:0;overflow-x:hidden;overflow-y:auto;position:fixed;scrollbar-color:var(--color-neutral-700) #0000;scrollbar-width:thin;width:400px;z-index:100}.left-drawer::-webkit-scrollbar{margin-right:4px;width:4px}.left-drawer::-webkit-scrollbar-track{background:#0000;margin:12px 4px 12px 0}.left-drawer::-webkit-scrollbar-thumb{background:var(--color-neutral-700);border-radius:2px;margin-right:4px}.left-drawer::-webkit-scrollbar-thumb:hover{background:var(--color-neutral-600)}.left-drawer-section{padding:20px 20px 0;width:auto}.left-drawer-section:last-child{border-bottom:none}.left-drawer-section h3{color:var(--color-neutral-00);font-family:Lato,sans-serif;font-size:14px;font-weight:500;margin:0 0 16px}.left-drawer-section p{color:var(--color-neutral-400);font-family:Lato,sans-serif;font-size:13px;font-weight:400;line-height:1.5;margin:0 0 16px}.ramp-actions{display:flex;flex-direction:row;gap:8px;margin-bottom:8px}.ramp-actions.save-actions{margin-bottom:0}.section{border-bottom:1px solid var(--color-neutral-650);padding:16px}.section-header{color:var(--color-neutral-400);font-size:12px;margin-bottom:8px}.drawer-content{min-height:100%;padding-right:4px}.color-ramps,.drawer-content{display:flex;flex-direction:column}.color-ramps{margin-bottom:16px}.custom-ramps{display:flex;flex-direction:column;margin-top:32px}.custom-ramps .dashed-rectangle{margin-top:8px}.dashed-rectangle{align-items:center;background:#0000;border:2px dashed var(--color-neutral-400);border-radius:6px;cursor:pointer;display:flex;height:40px;justify-content:center;transition:border-color .2s;width:40px}.dashed-rectangle:focus,.dashed-rectangle:hover{border-color:var(--color-primary-450)}.dashed-rectangle .dashed-rectangle-add-icon{display:block;height:24px;width:24px}.custom-ramps .color-swatch{cursor:default}.hidden-section{display:none!important}.hex-control{margin:32px 0}.left-drawer-ctas{backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:var(--color-overlay-background);border-top:1px solid var(--color-neutral-650);bottom:0;display:flex;flex-direction:row;gap:8px;left:0;margin-left:-20px;padding:20px;position:-webkit-sticky;position:sticky;width:400px;z-index:100000}.left-drawer-ctas .btn,.left-drawer-ctas .btn-full{flex:1 1;margin:0}.left-drawer-content{box-sizing:border-box;min-width:0;overflow-x:hidden;padding:16px}.app{background:var(--color-neutral-800);color:var(--color-neutral-00);display:flex;flex-direction:column;min-height:100vh}.main-container{height:calc(100vh - 81px);margin-top:81px}.main-container,.main-content{display:flex;flex:1 1;overflow:hidden}.main-content{background:linear-gradient(var(--color-neutral-850),var(--color-neutral-800));height:auto;margin-left:400px;padding:24px}.grid-container,.main-content{align-items:flex-start;justify-content:flex-start;position:relative}.grid-container{display:flex;margin:0;z-index:1}.color-grid{grid-gap:1px;background-color:none;display:grid;gap:1px;grid-template-columns:repeat(101,10px);grid-template-rows:repeat(101,10px);margin:0;padding:1px}.grid-container:has(.modern-contrast-grid){height:auto;min-height:1110px;width:100%}:root{--color-primary-00-light:#fff;--color-primary-50-light:#f5f9ff;--color-primary-100-light:#ebf3ff;--color-primary-150-light:#deecff;--color-primary-200-light:#cfe4ff;--color-primary-250-light:#a8ceff;--color-primary-300-light:#7eb5fc;--color-primary-350-light:#589ffc;--color-primary-400-light:#237ff7;--color-primary-450-light:#0965de;--color-primary-500-light:#044eb0;--color-primary-550-light:#013c8a;--color-primary-600-light:#002b63;--color-primary-650-light:#001b3d;--color-primary-700-light:#001633;--color-primary-750-light:#000f24;--color-primary-800-light:#000914;--color-primary-850-light:#000205;--color-neutral-00-light:#fff;--color-neutral-50-light:#fafafa;--color-neutral-100-light:#f2f3f5;--color-neutral-150-light:#ebebeb;--color-neutral-200-light:#e3e3e3;--color-neutral-250-light:#ccc;--color-neutral-300-light:#b3b4b5;--color-neutral-350-light:#9d9d9e;--color-neutral-400-light:#7f8182;--color-neutral-450-light:#696a6b;--color-neutral-500-light:#515254;--color-neutral-550-light:#3e4042;--color-neutral-600-light:#2a2c2e;--color-neutral-650-light:#1b1c1f;--color-neutral-700-light:#131517;--color-neutral-750-light:#0e0f12;--color-neutral-800-light:#07080a;--color-neutral-850-light:#010103;--color-error-00-light:#fff;--color-error-50-light:#fff7f9;--color-error-100-light:#fff0f4;--color-error-150-light:#ffe6ec;--color-error-200-light:#ffd9e2;--color-error-250-light:#ffbacb;--color-error-300-light:#fc95af;--color-error-350-light:#f77293;--color-error-400-light:#ed3764;--color-error-450-light:#d41343;--color-error-500-light:#a80830;--color-error-550-light:#850424;--color-error-600-light:#5e0118;--color-error-650-light:#400110;--color-error-700-light:#36000d;--color-error-750-light:#29000a;--color-error-800-light:#1c0007;--color-error-850-light:#050001;--color-overlay-background-light:#0e0f12a3;--color-overlay-shadow-light:#0e0f12cc;--color-primary-00-dark:#000205;--color-primary-50-dark:#000914;--color-primary-100-dark:#000f24;--color-primary-150-dark:#001633;--color-primary-200-dark:#001b3d;--color-primary-250-dark:#002b63;--color-primary-300-dark:#013c8a;--color-primary-350-dark:#044eb0;--color-primary-400-dark:#0965de;--color-primary-450-dark:#237ff7;--color-primary-500-dark:#589ffc;--color-primary-550-dark:#7eb5fc;--color-primary-600-dark:#a8ceff;--color-primary-650-dark:#cfe4ff;--color-primary-700-dark:#deecff;--color-primary-750-dark:#ebf3ff;--color-primary-800-dark:#f5f9ff;--color-primary-850-dark:#fff;--color-neutral-00-dark:#010103;--color-neutral-50-dark:#07080a;--color-neutral-100-dark:#0e0f12;--color-neutral-150-dark:#131517;--color-neutral-200-dark:#1b1c1f;--color-neutral-250-dark:#2a2c2e;--color-neutral-300-dark:#3e4042;--color-neutral-350-dark:#515254;--color-neutral-400-dark:#696a6b;--color-neutral-450-dark:#7f8182;--color-neutral-500-dark:#9d9d9e;--color-neutral-550-dark:#b3b4b5;--color-neutral-600-dark:#ccc;--color-neutral-650-dark:#e3e3e3;--color-neutral-700-dark:#ebebeb;--color-neutral-750-dark:#f2f3f5;--color-neutral-800-dark:#fafafa;--color-neutral-850-dark:#fff;--color-error-00-dark:#050001;--color-error-50-dark:#1c0007;--color-error-100-dark:#29000a;--color-error-150-dark:#36000d;--color-error-200-dark:#400110;--color-error-250-dark:#5e0118;--color-error-300-dark:#850424;--color-error-350-dark:#a80830;--color-error-400-dark:#d41343;--color-error-450-dark:#ed3764;--color-error-500-dark:#f77293;--color-error-550-dark:#fc95af;--color-error-600-dark:#ffbacb;--color-error-650-dark:#ffd9e2;--color-error-700-dark:#ffe6ec;--color-error-750-dark:#fff0f4;--color-error-800-dark:#fff7f9;--color-error-850-dark:#fff;--color-overlay-background-dark:#fffc;--color-overlay-shadow-dark:#0e0f121a;--color-primary-00:var(--color-primary-00-light);--color-primary-50:var(--color-primary-50-light);--color-primary-100:var(--color-primary-100-light);--color-primary-150:var(--color-primary-150-light);--color-primary-200:var(--color-primary-200-light);--color-primary-250:var(--color-primary-250-light);--color-primary-300:var(--color-primary-300-light);--color-primary-350:var(--color-primary-350-light);--color-primary-400:var(--color-primary-400-light);--color-primary-450:var(--color-primary-450-light);--color-primary-500:var(--color-primary-500-light);--color-primary-550:var(--color-primary-550-light);--color-primary-600:var(--color-primary-600-light);--color-primary-650:var(--color-primary-650-light);--color-primary-700:var(--color-primary-700-light);--color-primary-750:var(--color-primary-750-light);--color-primary-800:var(--color-primary-800-light);--color-primary-850:var(--color-primary-850-light);--color-neutral-00:var(--color-neutral-00-light);--color-neutral-50:var(--color-neutral-50-light);--color-neutral-100:var(--color-neutral-100-light);--color-neutral-150:var(--color-neutral-150-light);--color-neutral-200:var(--color-neutral-200-light);--color-neutral-250:var(--color-neutral-250-light);--color-neutral-300:var(--color-neutral-300-light);--color-neutral-350:var(--color-neutral-350-light);--color-neutral-400:var(--color-neutral-400-light);--color-neutral-450:var(--color-neutral-450-light);--color-neutral-500:var(--color-neutral-500-light);--color-neutral-550:var(--color-neutral-550-light);--color-neutral-600:var(--color-neutral-600-light);--color-neutral-650:var(--color-neutral-650-light);--color-neutral-700:var(--color-neutral-700-light);--color-neutral-750:var(--color-neutral-750-light);--color-neutral-800:var(--color-neutral-800-light);--color-neutral-850:var(--color-neutral-850-light);--color-error-00:var(--color-error-00-light);--color-error-50:var(--color-error-50-light);--color-error-100:var(--color-error-100-light);--color-error-150:var(--color-error-150-light);--color-error-200:var(--color-error-200-light);--color-error-250:var(--color-error-250-light);--color-error-300:var(--color-error-300-light);--color-error-350:var(--color-error-350-light);--color-error-400:var(--color-error-400-light);--color-error-450:var(--color-error-450-light);--color-error-500:var(--color-error-500-light);--color-error-550:var(--color-error-550-light);--color-error-600:var(--color-error-600-light);--color-error-650:var(--color-error-650-light);--color-error-700:var(--color-error-700-light);--color-error-750:var(--color-error-750-light);--color-error-800:var(--color-error-800-light);--color-error-850:var(--color-error-850-light);--color-overlay-background:var(--color-overlay-background-light);--color-overlay-shadow:var(--color-overlay-shadow-light)}[data-theme=dark]{--color-primary-00:var(--color-primary-00-dark);--color-primary-50:var(--color-primary-50-dark);--color-primary-100:var(--color-primary-100-dark);--color-primary-150:var(--color-primary-150-dark);--color-primary-200:var(--color-primary-200-dark);--color-primary-250:var(--color-primary-250-dark);--color-primary-300:var(--color-primary-300-dark);--color-primary-350:var(--color-primary-350-dark);--color-primary-400:var(--color-primary-400-dark);--color-primary-450:var(--color-primary-450-dark);--color-primary-500:var(--color-primary-500-dark);--color-primary-550:var(--color-primary-550-dark);--color-primary-600:var(--color-primary-600-dark);--color-primary-650:var(--color-primary-650-dark);--color-primary-700:var(--color-primary-700-dark);--color-primary-750:var(--color-primary-750-dark);--color-primary-800:var(--color-primary-800-dark);--color-primary-850:var(--color-primary-850-dark);--color-neutral-00:var(--color-neutral-00-dark);--color-neutral-50:var(--color-neutral-50-dark);--color-neutral-100:var(--color-neutral-100-dark);--color-neutral-150:var(--color-neutral-150-dark);--color-neutral-200:var(--color-neutral-200-dark);--color-neutral-250:var(--color-neutral-250-dark);--color-neutral-300:var(--color-neutral-300-dark);--color-neutral-350:var(--color-neutral-350-dark);--color-neutral-400:var(--color-neutral-400-dark);--color-neutral-450:var(--color-neutral-450-dark);--color-neutral-500:var(--color-neutral-500-dark);--color-neutral-550:var(--color-neutral-550-dark);--color-neutral-600:var(--color-neutral-600-dark);--color-neutral-650:var(--color-neutral-650-dark);--color-neutral-700:var(--color-neutral-700-dark);--color-neutral-750:var(--color-neutral-750-dark);--color-neutral-800:var(--color-neutral-800-dark);--color-neutral-850:var(--color-neutral-850-dark);--color-error-00:var(--color-error-00-dark);--color-error-50:var(--color-error-50-dark);--color-error-100:var(--color-error-100-dark);--color-error-150:var(--color-error-150-dark);--color-error-200:var(--color-error-200-dark);--color-error-250:var(--color-error-250-dark);--color-error-300:var(--color-error-300-dark);--color-error-350:var(--color-error-350-dark);--color-error-400:var(--color-error-400-dark);--color-error-450:var(--color-error-450-dark);--color-error-500:var(--color-error-500-dark);--color-error-550:var(--color-error-550-dark);--color-error-600:var(--color-error-600-dark);--color-error-650:var(--color-error-650-dark);--color-error-700:var(--color-error-700-dark);--color-error-750:var(--color-error-750-dark);--color-error-800:var(--color-error-800-dark);--color-error-850:var(--color-error-850-dark);--color-overlay-background:var(--color-overlay-background-dark);--color-overlay-shadow:var(--color-overlay-shadow-dark)}.theme-changing *,:root,[data-theme=dark],[data-theme=light]{transition:none!important}.dot{border-radius:50%;box-sizing:border-box;cursor:pointer;height:10px;opacity:1;position:relative;transition:transform .24s ease-in-out;width:10px;z-index:1}.dot:hover{outline:1px solid #7d7d7d;transform:scale(1.25);z-index:2}.dot.active{outline:2px solid #7d7d7d;z-index:1000}.dot.active,.dot.key{animation:activePulse 1.5s ease-out .5s infinite}.dot.key{outline:2px solid #fe0;z-index:1001}.dot.filtered{opacity:.25;pointer-events:none}@keyframes activePulse{0%{box-shadow:0 0 0 2px var(--color-neutral-00)}90%{box-shadow:0 0 2px 12px #fff0}}.hex-tooltip{border-radius:4px;box-shadow:0 2px 8px var(--color-overlay-shadow);font-size:12px;min-width:120px;padding:8px 12px;pointer-events:none;white-space:nowrap;z-index:9999}.hex-tooltip.light-text .hex-value,.hex-tooltip.light-text .hsb-value,.hex-tooltip.light-text .lab-value{color:var(--color-neutral-00-light)}.hex-tooltip.dark-text .hex-value,.hex-tooltip.dark-text .hsb-value,.hex-tooltip.dark-text .lab-value{color:var(--color-neutral-00-dark)}.hex-value{font-weight:600}.hex-value,.hsb-value,.lab-value{color:var(--color-neutral-00);display:block;font-family:Lato,sans-serif;font-size:14px;line-height:1.5;z-index:1001}.hsb-value,.lab-value{font-weight:400}.export-svg{width:400px}.export-svg .text{font-family:Lato,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:16px}.export-svg .color-name{font-size:16px;font-weight:700}.export-svg .contrast-text,.export-svg .hex-code,.export-svg .l-value{font-size:16px;font-weight:400}.export-svg .contrast-text{text-align:right}.export-svg .dot{rx:4px;ry:4px;height:8px;width:8px}.export-svg .footer-text{fill:#757575;font-family:Lato,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:14px}.export-svg .footer-link{fill:#06f;cursor:pointer;text-decoration:underline}.app-header{align-items:center;background-color:var(--color-neutral-750);border-bottom:1px solid var(--color-neutral-650);display:flex;gap:8px;justify-content:space-between;left:0;padding:16px;position:fixed;right:0;top:0;width:100vw;z-index:100}.app-title{align-items:flex-start;display:flex;flex-direction:column;margin-right:auto}.app-title h1{align-items:center;display:flex;gap:8px}.version-number{color:var(--color-neutral-400);font-weight:400;margin-top:3px}.header-actions{align-items:center;display:flex;gap:8px}.section-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:16px}.section-header h3{margin:0}.made-by{color:var(--color-neutral-400);font-size:12px;font-weight:400;margin-top:3px}.wcag-filters{gap:8px}.right-drawer{backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:var(--color-overlay-background);border-left:1px solid var(--color-neutral-700);box-shadow:-2px 0 8px var(--color-overlay-shadow);display:flex;flex-direction:column;height:100vh;overflow-y:auto;position:fixed;right:-640px;top:0;transition:right .24s ease-out;width:640px;z-index:2200}.right-drawer.open{right:0}.drawer-backdrop{-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);background:var(--color-overlay-background);height:100vh;left:0;opacity:0;pointer-events:none;position:fixed;top:0;transition:opacity .3s ease-in-out;width:100vw;z-index:2199}.drawer-backdrop.open{opacity:1;pointer-events:auto}body.drawer-open{overflow:hidden}.drawer-header{align-items:center;border-bottom:1px solid var(--color-neutral-700);display:flex;gap:16px;justify-content:space-between;padding:20px}.drawer-title{color:var(--color-neutral-00);font-family:Lato,sans-serif;font-size:22px;font-weight:600}.drawer-sections{display:flex;flex:1 1;flex-direction:column;gap:32px;overflow-y:auto;padding:24px 20px 80px}.right-drawer-section{background:none;border-radius:4px;margin-bottom:0;padding:0}.section-title{color:var(--color-neutral-00);font-family:Lato,sans-serif;font-size:18px;font-weight:500;margin-bottom:4px}.section-desc{color:var(--color-neutral-400);font-family:Lato,sans-serif;font-size:14px;margin-bottom:8px}.section-row{align-items:center;display:flex;flex-direction:row;gap:8px}.empty-state{background:none;border:1px dashed var(--color-neutral-600);border-radius:4px;cursor:default;display:flex;flex:1 1;height:48px;min-width:0;overflow:hidden;transition:all .3s ease}.empty-state.pulsing{animation:pulsing 2s 1s infinite}.empty-state.pulsing,.empty-state.saving-mode{border-color:var(--color-neutral-500);cursor:pointer}.empty-state.saving-mode:hover{background-color:var(--color-neutral-700);border-color:var(--color-neutral-400)}.filled-state{background:none;border:none;border-radius:4px;display:flex;flex:1 1;height:48px;min-width:0;overflow:hidden;padding:0;position:relative;transition:all .3s ease}.filled-state:hover{background-color:var(--color-neutral-700)}.filled-state:hover:after{border-radius:4px;bottom:0;content:"";cursor:vertical-text;left:0;pointer-events:none;position:absolute;right:0;top:0}.filled-state .color-swatch{border:none!important;border-radius:0!important;transition:opacity .2s ease}.filled-state:hover .color-swatch{cursor:default;opacity:1}.filled-state.pulsing{animation:pulsing 2s 1s infinite;border:1px dashed var(--color-neutral-500);cursor:help}.filled-state.saving-mode{background-color:var(--color-neutral-700);border:1px dashed var(--color-neutral-500);cursor:crosshair}.filled-state.saving-mode:hover{background-color:var(--color-neutral-600);border-color:var(--color-neutral-400);cursor:e-resize}.filled-state.saving-mode .color-swatch{cursor:pointer}@keyframes pulsing{0%{box-shadow:0 0 0 0 var(--color-primary-500)}50%{box-shadow:0 0 24px 1px #0965de4d}to{box-shadow:0 0 24px 1px #0965de00}}.drawer-actions{align-items:center;display:flex;gap:8px}.score-pill-row{display:flex;gap:4px;margin-top:12px}.modal-backdrop{align-items:center;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);background:var(--color-overlay-background);display:flex;height:100vh;justify-content:center;left:0;opacity:0;position:fixed;top:0;transition:opacity .2s ease-in-out;width:100vw;z-index:3333}.modal-backdrop.open{opacity:1}.modal-content{background:var(--color-neutral-750);border-radius:8px;box-shadow:0 4px 32px var(--color-overlay-shadow);padding:16px;position:relative;width:auto}.modal-header{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:8px}.modal-content-message{margin-bottom:24px}.modal-actions{display:flex;gap:8px;justify-content:flex-end}body.modal-open{overflow:hidden}.btn,.btn-destructive,.btn-fab,.btn-icon-only,.btn-secondary,.btn-tertiary{align-items:center;border-radius:4px;cursor:pointer;display:inline-flex;font-family:Lato,sans-serif;font-size:14px;font-weight:400;gap:8px;justify-content:center;min-height:48px;min-width:40px;padding:8px 16px;text-decoration:none;transition:all .2s}.btn{background:var(--color-primary-500);border:none;color:var(--color-neutral-00)}.btn:hover{background:var(--color-primary-550)}.btn.active{background:var(--color-primary-600)}.btn-secondary{background:var(--color-neutral-650);border:none;color:var(--color-neutral-00)}.btn-secondary:hover{background:var(--color-neutral-600)}.btn-secondary.active{background:var(--color-neutral-550)}.btn-icon-only{border:none;height:48px;padding:12px;width:48px}.btn-icon-only.small{align-items:center;border-radius:50%;display:inline-flex;height:24px;justify-content:center;min-height:0;min-width:0;padding:0;width:24px}.btn-icon-only.small svg{height:16px;width:16px}.btn-destructive{background:var(--color-error-500);border:none;color:var(--color-neutral-00)}.btn-destructive:hover{background:var(--color-error-550)}.btn-destructive.active{background:var(--color-error-600)}.btn-tertiary{background:#0000;border:1px solid var(--color-neutral-500);color:var(--color-neutral-00)}.btn-tertiary:hover{background:var(--color-neutral-750)}.btn-tertiary.active{background:var(--color-neutral-800)}.btn-tertiary.disabled,.btn-tertiary:disabled{fill:var(--color-neutral-650);background:var(--color-neutral-800);border-color:var(--color-neutral-800);color:var(--color-neutral-650);cursor:not-allowed;pointer-events:none}.btn-fab{align-items:center;background:var(--color-primary-500);border:none;border-radius:999px;bottom:24px;box-shadow:0 4px 16px var(--color-overlay-shadow);color:var(--color-neutral-00);cursor:pointer;display:flex;font-family:Lato,sans-serif;font-size:14px;font-weight:400;gap:8px;height:48px;min-width:0;min-width:auto;padding:8px 16px;position:fixed;right:24px;transition:all .2s;width:auto;z-index:2100}.btn-fab:hover{background:var(--color-primary-550);box-shadow:0 6px 24px var(--color-overlay-shadow)}.btn-fab:active{background:var(--color-primary-600)}.btn svg,.btn-destructive svg,.btn-fab svg,.btn-secondary svg,.btn-tertiary svg{fill:currentColor;height:16px;width:16px}.btn-full{width:100%}.btn.disabled,.btn:disabled{fill:var(--color-primary-650);background:var(--color-primary-800);color:var(--color-primary-650);cursor:not-allowed;pointer-events:none}.btn-secondary.disabled,.btn-secondary:disabled{fill:var(--color-neutral-650);background:var(--color-neutral-800);color:var(--color-neutral-650);cursor:not-allowed;pointer-events:none}.btn-destructive.disabled,.btn-destructive:disabled{fill:var(--color-error-650);background:var(--color-error-800);color:var(--color-error-650);cursor:not-allowed;pointer-events:none}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.input-group,.input-row{align-items:center;display:flex;flex-direction:row;gap:8px;width:100%}.input-container{align-items:center;display:flex;position:relative;width:auto}.hex-input-group{display:flex;flex-direction:row;gap:8px;position:relative;width:100%}.hex-input-group input[type=text]{flex:1 1}.hue-control,.hue-input-group{display:flex;flex-direction:column;gap:8px}.hue-control input{width:100%}.hsv-inputs{display:flex;gap:8px;margin-top:8px}.hsv-inputs input[type=number]{box-sizing:border-box;width:33%}.filter-toggle{display:inline-block;height:20px;position:relative;width:40px}.filter-toggle input{height:0;opacity:0;width:0}.toggle-slider{background-color:var(--color-neutral-600);border-radius:999px;bottom:0;cursor:pointer;left:0;position:absolute;right:0;top:0;transition:transform .4s ease-in}.toggle-slider:before{background-color:#fff;border-radius:50%;bottom:2px;content:"";height:16px;left:2px;position:absolute;transform:translateX(0);transition:transform .2s ease-out;width:16px}input:checked+.toggle-slider{background-color:var(--color-primary-500)}input:checked+.toggle-slider:before{transform:translateX(20px)}.input-flex-center{align-items:center;display:flex;gap:8px}.color-picker{background:none;border:1px solid var(--color-neutral-800);border-radius:4px;cursor:pointer;flex-shrink:0;height:48px;padding:0;transition:border-color .2s ease;width:48px}.color-picker:hover{border-color:var(--color-primary-600)}.color-picker:focus{border-color:var(--color-primary-700);outline:none}.color-picker::-webkit-color-swatch-wrapper{padding:0}.color-picker::-webkit-color-swatch{border:none}.color-picker::-moz-color-swatch{border:none}.standard-input{-webkit-appearance:textfield;appearance:textfield;background:var(--color-neutral-700);border:1px solid var(--color-neutral-650);border-radius:4px;box-sizing:border-box;color:var(--color-neutral-00);font-family:Lato,sans-serif;font-size:14px;height:48px;padding:0 14px;transition:border-color .2s;width:100%}.standard-input:focus{border-color:var(--color-primary-500);outline:none}.standard-input::placeholder{color:var(--color-neutral-400);opacity:1}.standard-input:hover{border-color:var(--color-primary-450)}.standard-input:disabled:hover{border-color:var(--color-neutral-700)}.l-value-input{box-sizing:border-box}.input-prefix-hex{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' height='20' width='20'%3E%3Ctext x='4' y='16' font-size='18' fill='%237e8187' font-family='Lato'%3E%23%3C/text%3E%3C/svg%3E");background-position:4px 55%;background-repeat:no-repeat;background-size:14px;padding-left:20px!important}.input-prefix-h{background-image:url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 height=%2720%27 width=%2720%27><text x=%274%27 y=%2716%27 font-size=%2718%27 fill=%27%237e8187%27 font-family=%27Lato%27>H</text></svg>")}.input-prefix-h,.input-prefix-s{background-position:4px 55%;background-repeat:no-repeat;background-size:14px;padding-left:24px!important}.input-prefix-s{background-image:url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 height=%2720%27 width=%2720%27><text x=%274%27 y=%2716%27 font-size=%2718%27 fill=%27%237e8187%27 font-family=%27Lato%27>S</text></svg>")}.input-prefix-b{background-image:url("data:image/svg+xml;utf8,<svg xmlns=%27http://www.w3.org/2000/svg%27 height=%2720%27 width=%2720%27><text x=%274%27 y=%2716%27 font-size=%2718%27 fill=%27%237e8187%27 font-family=%27Lato%27>B</text></svg>");background-position:4px 55%;background-repeat:no-repeat;background-size:14px;padding-left:24px!important}.filters-dropdown{cursor:pointer;position:relative}.dropdown-menu{background-color:var(--color-neutral-700);border-radius:4px;box-shadow:0 2px 8px var(--color-overlay-shadow);cursor:pointer;margin-top:4px;min-width:180px;padding:8px;position:absolute;right:0;top:100%;z-index:1000}.wcag-filters{display:flex;flex-direction:column;gap:4px}.dropdown-menu label{align-items:center;border-radius:4px;color:var(--color-neutral-00);cursor:pointer;display:flex;font-family:Lato,sans-serif;font-size:14px;font-weight:400;gap:8px;padding:8px;transition:all .2s}.dropdown-menu label:hover{background-color:var(--color-neutral-600);cursor:pointer}.dropdown-menu input[type=checkbox],.dropdown-menu input[type=radio]{accent-color:var(--color-primary-500);cursor:pointer;height:16px;margin:0;width:16px}h1{font-family:Gabarito,sans-serif;font-size:28px;font-weight:700;line-height:1;margin:0;text-transform:uppercase}.main-title{-webkit-text-fill-color:#0000;align-items:center;background:-webkit-linear-gradient(0deg,#ff0a85 5%,#9830ff 50%,#3b3bff 95%);-webkit-background-clip:text;display:flex;gap:8px}h2{font-family:Lato,sans-serif;font-size:1.5rem;font-weight:700;margin:0}h3{font-size:1.25rem}h3,h4{font-family:Lato,sans-serif;font-weight:400;margin:0}h4{font-size:1.1rem}h5{font-size:1rem}h5,h6{font-family:Lato,sans-serif;font-weight:400;margin:0}h6{font-size:.95rem}p{font-family:Lato,sans-serif;font-size:1rem;font-weight:400;line-height:1.525;margin:0}.heading-lg{color:var(--color-neutral-00);font-size:20px;font-weight:700;margin:0;text-align:left}.body-lg{line-height:1.35;max-width:320px;text-align:left}strong{color:var(--color-neutral-00);font-weight:700}a{color:var(--color-primary-400)}a,a:hover{font-weight:400}a:hover{color:var(--color-primary-500)}.tabs{display:flex;gap:0;margin-bottom:0;padding:0 4px}.tab{background:#0000;border:none;color:var(--color-neutral-350);cursor:pointer;font-family:Lato,sans-serif;font-size:14px;font-weight:400;min-width:64px;padding:16px 8px;position:relative;text-align:center;width:100%}.tab,.tab:after{transition:all .2s ease}.tab:after{background:var(--color-neutral-650);bottom:-1px;content:"";height:1px;left:0;position:absolute;right:0}.tab:hover{color:var(--color-neutral-00)}.tab:hover:after{background:var(--color-neutral-500)}.tab.active{color:var(--color-neutral-00)}.tab.active:after{background:var(--color-primary-500);border-radius:2px 2px 0 0;height:2px}.tab-info-icon{align-items:center;cursor:pointer;display:inline-flex;height:16px;justify-content:center;margin-left:0;transition:color .15s;width:16px}.tab-info-icon svg{display:block;height:16px;width:16px}.contrast-grid__wrapper{background:#0000;padding:40px;width:-webkit-fit-content;width:fit-content}.contrast-grid{grid-gap:1px;background:#0000;display:grid;gap:1px}.contrast-grid__tile{align-items:center;box-sizing:border-box;color:var(--color-neutral-00);display:flex;font-family:Lato,sans-serif;font-size:12px;font-weight:700;height:80px;justify-content:center;letter-spacing:.5px;padding:0;width:80px}.contrast-grid__tile,.contrast-grid__tile--empty{background:var(--color-neutral-800)}.contrast-grid__tile--header{align-items:center;display:flex;font-size:12px;font-weight:700;justify-content:center}.contrast-grid__tile--contrast{align-items:flex-start;flex-direction:column;font-size:12px;font-weight:500;justify-content:flex-start;overflow:hidden;padding:8px;position:relative}.contrast-grid__ratio{font-size:12px;font-weight:700;margin-bottom:20px}.contrast-grid__row{align-items:center;display:flex;gap:4px}.contrast-grid__label{color:var(--color-primary-500);font-size:12px;font-weight:700;margin-left:2px}.dashed-rectangle{background:none;border:1px dashed var(--color-neutral-600);border-radius:4px;box-sizing:border-box;height:48px;margin:8px 0;transition:.24s ease-out;width:100%}.dashed-rectangle:focus,.dashed-rectangle:hover{background:none;border-color:var(--color-primary-500);outline:none}.dashed-rectangle:active{background:var(--color-neutral-850);border-color:var(--color-primary-500)}.dashed-rectangle svg{fill:var(--color-neutral-450);display:block;height:16px;transition:.24s ease-out;width:16px}.dashed-rectangle:hover svg{fill:var(--color-primary-500)}.score-card{align-items:center;border-radius:999px;display:flex;gap:4px;padding:4px 10px 4px 4px;position:relative;width:-webkit-fit-content;width:fit-content}.score-card__content{align-items:center;display:flex;flex-direction:row;gap:1px}.score-card__icon{fill:currentColor;color:inherit;display:block;height:16px;width:16px}.score-card__icon-wrapper{border-radius:999px;padding:4px}.score-card__label,.score-card__score{font-size:12px;font-weight:400;margin-right:2px}.score-card--positive{background:var(--color-primary-700);outline:1px solid var(--color-primary-500);outline-offset:-1px}.score-card--positive .score-card__icon-wrapper{align-items:center;background:var(--color-primary-500)}.score-card--positive .score-card__icon{color:var(--color-primary-250)}.score-card--positive .score-card__label,.score-card--positive .score-card__score{color:var(--color-primary-200)}.score-card--warning{background:var(--color-neutral-700);outline:1px solid var(--color-neutral-500);outline-offset:-1px}.score-card--warning .score-card__icon-wrapper{background:var(--color-neutral-500)}.score-card--warning .score-card__icon{color:var(--color-neutral-250)}.score-card--warning .score-card__label,.score-card--warning .score-card__score{color:var(--color-neutral-200)}.score-card--negative{background:var(--color-error-700);background:var(--color-error-bg,var(--color-error-700));outline:1px solid var(--color-error-500);outline:1px solid var(--color-error-border,var(--color-error-500));outline-offset:-1px}.score-card--negative .score-card__icon-wrapper{background:var(--color-error-500)}.score-card--negative .score-card__icon{color:var(--color-error-250)}.score-card--negative .score-card__label,.score-card--negative .score-card__score{color:var(--color-error-200)}.score-card--empty{background:var(--color-neutral-800);outline:1px solid var(--color-neutral-600);outline-offset:-1px}.score-card--empty .score-card__icon-wrapper{background:var(--color-neutral-600)}.score-card--empty .score-card__icon{fill:currentColor;color:var(--color-neutral-800)}.score-card--empty .score-card__label,.score-card--empty .score-card__score{color:var(--color-neutral-600)}.score-pill-tooltip{background-color:var(--color-neutral-600);border-radius:4px;box-shadow:0 2px 8px var(--color-overlay-shadow);font-size:12px;gap:8px;padding:4px 12px;pointer-events:none;position:absolute;width:auto;z-index:1000}.tooltip-content{color:var(--color-neutral-100);font-size:12px;white-space:nowrap}.tooltip-content p{font-weight:400;margin:0 0 8px;white-space:nowrap}.tooltip-score-item{align-items:center;display:flex;gap:8px;justify-content:space-between;margin:4px 0;width:auto}.tooltip-score-item span:first-child{color:var(--color-neutral-00)}.tooltip-score-item span:last-child{color:var(--color-neutral-00);font-weight:400}.tooltip-suggestion{color:var(--color-neutral-00);font-size:12px;line-height:1.4;margin:4px 0;width:auto}.tooltip-suggestion:first-child{margin-top:0}.tooltip-suggestion:last-child{margin-bottom:0}.hex-input-row{align-items:center;display:flex;gap:8px;margin-bottom:8px}.hex-input-row .hex-input-group{width:90px!important}.hex-input-row .color-swatch{align-items:center;display:flex;gap:8px;min-width:120px}.hex-input-row .swatch-color{border:1px solid var(--color-neutral-650);border-radius:4px;height:32px;width:32px}.hex-input-row .swatch-info{display:flex;flex-direction:column;gap:2px}.hex-input-row .l-value{color:var(--color-neutral-00);font-family:Lato,sans-serif;font-size:12px}.hex-input-row .contrast-ratios{color:var(--color-neutral-400);display:flex;font-family:Lato,sans-serif;font-size:11px;gap:8px}.hex-input-row .standard-input.error{border-color:var(--color-error-450)}.hex-input-row .standard-input.error:focus{border-color:var(--color-error-500)}.dismissible-message{background:var(--color-primary-500);border-radius:8px;box-sizing:border-box;color:var(--color-neutral-00);display:block;font-family:Lato,sans-serif;height:auto;margin:16px 0 0;max-width:100%;overflow-x:hidden;padding:16px;position:relative;width:100%}.dismissible-message-header{align-items:center;display:flex;gap:8px;margin-bottom:8px}.icon-wrapper{align-items:center;background:var(--color-primary-550);border-radius:50%;display:flex;height:24px;justify-content:center;width:24px}.icon-wrapper svg{display:block;height:16px;width:16px}.dismissible-message-title{color:var(--color-primary-00);font-family:Lato,sans-serif;font-size:16px;font-weight:500}.dismissible-message-body{line-height:1.525;margin-bottom:12px}.dismissible-message-body,.dismissible-message-dismiss{color:var(--color-primary-00);font-family:Lato,sans-serif;font-size:14px}.dismissible-message-dismiss{background:none;border:none;cursor:pointer;display:flex;margin-left:auto;padding:0}.dismissible-message-dismiss:hover{color:var(--color-primary-100);text-decoration:underline}.scores-modal-content{margin:0 auto;max-width:560px;width:560px}.scores-modal-list{list-style-type:disc;padding-left:1.25rem;width:100%}.scores-modal-list li{margin-bottom:16px}.scores-modal-score{margin-bottom:16px}.body-lg,.scores-modal-score{color:var(--color-neutral-400)}.body-lg{font-size:16px;line-height:1.525}.mb-4{color:var(--color-neutral-300);margin-bottom:16px;margin-top:8px}.toast{animation:toastAnimation 2.5s ease-out forwards;border-radius:4px;bottom:16px;box-shadow:0 2px 8px #0000002e;font-size:14px;left:416px;opacity:1;padding:12px 16px;position:fixed;z-index:1000}@keyframes toastAnimation{0%{opacity:0;transform:translateY(30%)}15%{opacity:1;transform:translateY(0)}85%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(30%)}}
/*# sourceMappingURL=main.ec8b4f45.css.map*/