:where([data-page=tools__color-picker]) .text-gradient{background-image:linear-gradient(to right, var(--tw-gradient-stops));--tw-gradient-from:var(--primary-600) var(--tw-gradient-from-position);--tw-gradient-to:var(--primary-600) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to);color:#0000;-webkit-background-clip:text;background-clip:text}:where([data-page=tools__color-picker]) .format-btn{border-radius:var(--radius);--tw-border-opacity:1;border-width:1px;border-color:rgb(209 213 219/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity,1));padding:.5rem 1rem;font-size:.875rem;font-weight:500;line-height:1.25rem;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}:where([data-page=tools__color-picker]) .format-btn:hover{--tw-bg-opacity:1;background-color:rgb(249 250 251/var(--tw-bg-opacity,1))}@media (prefers-color-scheme:dark){:where([data-page=tools__color-picker]) .format-btn{--tw-border-opacity:1;border-color:rgb(75 85 99/var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(31 41 55/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(209 213 219/var(--tw-text-opacity,1))}:where([data-page=tools__color-picker]) .format-btn:hover{--tw-bg-opacity:1;background-color:rgb(55 65 81/var(--tw-bg-opacity,1))}}:where([data-page=tools__color-picker]) .format-btn.active{border-color:var(--primary-600);background-color:var(--primary-600);--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}:where([data-page=tools__color-picker]) .compliance-badge{border-radius:9999px;padding:.25rem .5rem;font-size:.75rem;font-weight:600;line-height:1rem}:where([data-page=tools__color-picker]) .compliance-badge.pass{--tw-bg-opacity:1;background-color:rgb(220 252 231/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(22 101 52/var(--tw-text-opacity,1))}@media (prefers-color-scheme:dark){:where([data-page=tools__color-picker]) .compliance-badge.pass{--tw-text-opacity:1;color:rgb(74 222 128/var(--tw-text-opacity,1));background-color:#14532d33}}:where([data-page=tools__color-picker]) .compliance-badge.fail{--tw-bg-opacity:1;background-color:rgb(254 226 226/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(153 27 27/var(--tw-text-opacity,1))}@media (prefers-color-scheme:dark){:where([data-page=tools__color-picker]) .compliance-badge.fail{--tw-text-opacity:1;color:rgb(248 113 113/var(--tw-text-opacity,1));background-color:#7f1d1d33}}:where([data-page=tools__color-picker]) .faq-button[aria-expanded=true] .faq-icon{transform:rotate(180deg)}:where([data-page=tools__color-picker]) .faq-content{opacity:0;max-height:0;transition:max-height .3s ease-out,opacity .3s ease-out;overflow:hidden}:where([data-page=tools__color-picker]) .faq-content:not(.hidden){opacity:1;max-height:500px}:where([data-page=tools__color-picker]) .color-swatch{cursor:pointer;border-radius:var(--radius);--tw-border-opacity:1;border-width:2px;border-color:rgb(229 231 235/var(--tw-border-opacity,1));width:3rem;height:3rem;transition-property:transform;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}:where([data-page=tools__color-picker]) .color-swatch:hover{--tw-scale-x:1.1;--tw-scale-y:1.1;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));--tw-shadow:var(--shadow-lg);--tw-shadow-colored:var(--shadow-lg);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000), var(--tw-ring-shadow,0 0 #0000), var(--tw-shadow)}@media (prefers-color-scheme:dark){:where([data-page=tools__color-picker]) .color-swatch{--tw-border-opacity:1;border-color:rgb(75 85 99/var(--tw-border-opacity,1))}}:where([data-page=tools__color-picker]) .copy-btn:hover:after{content:"Click to copy";pointer-events:none;--tw-bg-opacity:1;background-color:rgb(17 24 39/var(--tw-bg-opacity,1));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1));border-radius:.25rem;margin-top:-2rem;margin-left:-2rem;padding:.25rem .5rem;font-size:.75rem;line-height:1rem;position:absolute}
