body[data-page-type=tool]{--tool-page-bg:#121212;--tool-page-text:#ffffffe6;--tool-page-text-muted:#ffffff9e;--tool-page-text-soft:#ffffff75;--tool-page-divider:var(--site-divider);--color-text:var(--tool-page-text);--color-text-muted:var(--tool-page-text-muted);--color-bg-dark:var(--tool-page-bg);--site-divider-strong:var(--tool-page-divider);background:var(--tool-page-bg);color:var(--tool-page-text)}html[data-theme=light] body[data-page-type=tool],body[data-page-type=tool][data-theme=light]{--tool-page-bg:#fdfdfc;--tool-page-text:#121212eb;--tool-page-text-muted:#1212129e;--tool-page-text-soft:#12121275;--tool-page-divider:var(--site-divider-light);--color-text:var(--tool-page-text);--color-text-muted:var(--tool-page-text-muted);--color-bg-dark:var(--tool-page-bg);background:var(--tool-page-bg);color:var(--tool-page-text)}body[data-page-type=tool] main,body[data-page-type=tool] main>section,body[data-page-type=tool] .tool-hero,body[data-page-type=tool] .tool-spacer,body[data-page-type=tool] .tool-app,body[data-page-type=tool] .tool-content,body[data-page-type=tool] .page-faq,body[data-page-type=tool] .page-cta{background:var(--tool-page-bg)}.tool-hero{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:65vh;padding:0;display:flex}body[data-page-type=tool] .tool-hero:before{display:none}body[data-page-type=tool] .tool-hero>.container{min-height:65vh;padding-top:120px;padding-bottom:calc(var(--space-2xl) + 2.15rem);border-left:0;border-right:0;flex-direction:column;flex:1;justify-content:center;align-items:center;padding-top:calc(120px + clamp(2.5rem,5vh,4rem));display:flex}body[data-page-type=tool] .tool-hero>.container>*{transform:translateY(clamp(3.5rem,7vh,5.5rem))}@media (width<=768px){body[data-page-type=tool] .tool-hero>.container{padding-top:calc(100px + 2rem)}body[data-page-type=tool] .tool-hero>.container>*{transform:translateY(2.5rem)}}.tool-hero__title{max-width:34rem;color:var(--tool-page-text);letter-spacing:-.04em;margin:0 auto .9rem;font-family:Neue Montreal,Helvetica Neue,Arial,sans-serif;font-size:clamp(1.85rem,2.65vw,2.65rem);font-weight:700;line-height:1.04}.tool-hero__subtitle{font-family:var(--font-primary);color:var(--tool-page-text-muted);max-width:36rem;margin:0 auto var(--space-lg);letter-spacing:-.03em;text-wrap:balance;font-size:.9375rem;line-height:1.6}.tool-hero__button{margin-top:0}.tool-spacer{background:var(--tool-page-bg);position:relative}.tool-spacer__row{align-items:center;min-height:5.75rem;padding:0 1rem;display:flex}.tool-spacer__heading{color:var(--tool-page-text);letter-spacing:-.04em;margin:0;font-family:Neue Montreal,Helvetica Neue,Arial,sans-serif;font-size:clamp(1.4rem,2vw,2rem);font-weight:500;line-height:1.02}.tool-app{background:var(--tool-page-bg)}body[data-page-type=tool] .tool-app>.container,body[data-page-type=tool] .tool-content>.container,body[data-page-type=tool] .page-faq>.container,body[data-page-type=tool] .page-cta>.container{padding:clamp(1.25rem,2.5vw,2rem)}body[data-page-type=tool] .tool-spacer>.container{padding:0}body[data-page-type=tool] .tool-app>.container{justify-content:center;align-items:center;min-height:clamp(24rem,42vw,38rem);display:flex}body[data-page-type=tool] .tool-app>.container>*{width:min(100%, var(--tool-app-max-width,960px));margin-left:auto;margin-right:auto}body[data-page-type=tool] .tool-content>.container{grid-template-columns:minmax(0,1fr);gap:0;padding:0;display:grid}body[data-page-type=tool] .tool-content__body{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none;min-height:clamp(24rem,36vw,34rem);padding:0;display:grid}body[data-page-type=tool] .tool-content__body:has(.tool-related--stacked){min-height:clamp(41rem,58vw,52rem)}body[data-page-type=tool] .tool-content__main,body[data-page-type=tool] .tool-content__related{min-width:0;padding:clamp(1.5rem,3vw,2.75rem)}body[data-page-type=tool] .tool-content__main{align-self:start}body[data-page-type=tool] .tool-content__related{border-left:1px solid var(--tool-page-divider);flex-direction:column;padding:0;display:flex}body[data-page-type=tool] .page-faq>.container{padding:0}body[data-page-type=tool] .page-faq .faq__layout{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:0;display:grid}body[data-page-type=tool] .page-faq .faq__intro{min-height:100%;padding:clamp(1.5rem,3vw,2.75rem)}body[data-page-type=tool] .page-faq .faq__list{border-left:1px solid var(--tool-page-divider)}body[data-page-type=tool] .faq-duplicate--tool .page-faq .faq__layout,body[data-page-type=tool] .faq-duplicate--tool .page-faq .faq__list{border-top:0;border-left:0;grid-template-columns:minmax(0,1fr);width:100%;display:block}body[data-page-type=tool] .faq-duplicate--tool .page-faq>.container,body[data-page-type=tool] .faq-duplicate--tool .page-faq .faq__layout,body[data-page-type=tool] .faq-duplicate--tool .page-faq .faq__list,body[data-page-type=tool] .faq-duplicate--tool .page-faq .faq__item{border-right:0}body[data-page-type=tool] .faq-duplicate--tool .faq-duplicate__title-cell{min-height:var(--faq-row-height,4.15rem);padding:0 1rem}body[data-page-type=tool][data-theme=light] .footer__statement,body[data-page-type=tool][data-theme=light] .footer__section-title,body[data-page-type=tool][data-theme=light] .footer__brand{color:#121212eb!important}body[data-page-type=tool][data-theme=light] .footer__description,body[data-page-type=tool][data-theme=light] .footer__copyright,body[data-page-type=tool][data-theme=light] .footer__location{color:#1212129e!important}body[data-page-type=tool][data-theme=light] .footer__nav-link,body[data-page-type=tool][data-theme=light] .footer__contact-link{color:#121212c7!important}body[data-page-type=tool][data-theme=light] .footer__nav-link:hover,body[data-page-type=tool][data-theme=light] .footer__contact-link:hover{color:#121212fa!important}body[data-page-type=tool][data-theme=light] .footer__sections,body[data-page-type=tool][data-theme=light] .footer__section,body[data-page-type=tool][data-theme=light] .footer__bottom{border-color:var(--site-divider-light)!important}.tool-label{font-family:var(--font-alfabet);text-transform:uppercase;letter-spacing:.02em;color:var(--color-text-muted);margin-bottom:.5rem;font-size:.625rem;font-weight:900;display:block}.tool-text-input{width:100%;color:var(--color-text);transition:border-color var(--transition-fast);background:#ffffff0f;border:1px solid #ffffff24;border-radius:8px;padding:.625rem .75rem;font-family:Neue Montreal,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9375rem}.tool-text-input:focus{border-color:var(--color-accent);outline:none}.tool-text-input--small{text-align:center;width:100%;padding:.625rem .25rem}.tool-text-input[type=number]::-webkit-inner-spin-button,.tool-text-input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.tool-text-input[type=number]{-moz-appearance:textfield}.tool-copy-btn{color:var(--color-text-muted);font-family:var(--font-alfabet);text-transform:uppercase;letter-spacing:.02em;cursor:pointer;transition:background-color var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast);white-space:nowrap;background:#ffffff0f;border:1px solid #ffffff24;border-radius:8px;flex-shrink:0;padding:.5rem 1rem;font-size:.625rem;font-weight:900}.tool-copy-btn:hover{color:var(--color-text);background:#ffffff1a;border-color:#ffffff40}.tool-copy-btn.is-copied{color:#4ade80;background:#4ade8026;border-color:#4ade8066}.contrast-checker{max-width:720px}.tool-content{background:var(--tool-page-bg);padding:0}.tool-content__body{max-width:min(100%,52rem)}.tool-content__body h2{letter-spacing:-.04em;margin-top:var(--space-xl);margin-bottom:var(--space-sm);color:var(--tool-page-text);font-family:Neue Montreal,Helvetica Neue,Arial,sans-serif;font-size:clamp(1.4rem,2vw,2rem);font-weight:500;line-height:1.04}.tool-content__body h2:first-child{margin-top:0}.tool-content__related h2{margin:0;padding:clamp(1.5rem,3vw,2.75rem) clamp(1.5rem,3vw,2.75rem) 0}.tool-content__body p{font-family:var(--font-primary);color:var(--tool-page-text-muted);margin-bottom:var(--space-md);font-size:.9375rem;line-height:1.7}.tool-related{border-top:1px solid var(--tool-page-divider);grid-template-columns:repeat(2,minmax(0,1fr));gap:0;width:100%;margin-top:auto;display:grid}.tool-related--stacked{margin-top:clamp(2rem,4vw,4rem)}.tool-related__link{border-right:0;border-bottom:1px solid var(--tool-page-divider);min-height:clamp(18rem,25vw,23rem);color:inherit;background:0 0;border-radius:0;flex-direction:column;justify-content:flex-end;gap:0;padding:1rem;text-decoration:none;transition:background-color .18s,border-color .18s,color .18s;display:flex}.tool-related__link:nth-child(odd){border-right:1px solid var(--tool-page-divider)}.tool-related__link:nth-last-child(-n+2){border-bottom:0}.tool-related__link:nth-child(2):nth-last-child(2){border-bottom:1px solid var(--tool-page-divider)}.tool-related__link:hover{background:#fdfdfc}body[data-page-type=tool][data-theme=light] .tool-related__link{background:#12121206}body[data-page-type=tool][data-theme=light] .tool-related__link:hover{background:#121212}.tool-related__name{letter-spacing:-.045em;text-wrap:balance;max-width:10ch;color:var(--tool-page-text);margin:0 0 .85rem;font-family:Neue Montreal,Helvetica Neue,Arial,sans-serif;font-size:clamp(1.25rem,1.75vw,1.85rem);font-weight:500;line-height:.98;transition:color .18s,transform .18s;display:block}.tool-related__desc{letter-spacing:-.015em;text-wrap:balance;max-width:18rem;color:var(--tool-page-text-muted);margin:0;font-family:Neue Montreal,Helvetica Neue,Arial,sans-serif;font-size:.88rem;font-weight:400;line-height:1.3;transition:color .18s,transform .18s}.tool-related__link:hover .tool-related__name,.tool-related__link:hover .tool-related__desc{transform:translate(.18rem)}.tool-related__link:hover .tool-related__name{color:#121212eb}.tool-related__link:hover .tool-related__desc{color:#1212129e}body[data-page-type=tool][data-theme=light] .tool-related__link:hover .tool-related__name{color:#ffffffeb}body[data-page-type=tool][data-theme=light] .tool-related__link:hover .tool-related__desc{color:#ffffff9e}.brand-extractor__dropzone{padding:var(--space-3xl) var(--space-xl);text-align:center;transition:border-color var(--transition-fast), background-color var(--transition-fast);cursor:pointer;border:2px dashed #ffffff24;border-radius:16px}.brand-extractor__dropzone:hover,.brand-extractor__dropzone.is-dragover{border-color:var(--color-accent);background:#f370210a}.brand-extractor__dropzone[hidden]{display:none}.brand-extractor__dropzone-icon{color:var(--color-text-muted);margin-bottom:var(--space-md)}.brand-extractor__dropzone-text{font-family:var(--font-primary);color:var(--color-text);margin-bottom:.25rem;font-size:.9375rem}.brand-extractor__dropzone-subtext{color:var(--color-text-muted);margin-bottom:var(--space-md);font-size:.8125rem}.brand-extractor__browse{color:#000;height:32px;font-family:var(--font-alfabet);text-transform:uppercase;letter-spacing:.02em;transition:background-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast);background-color:#fff;border-radius:2rem;justify-content:center;align-items:center;padding:0 1.25rem;font-size:.625rem;font-weight:900;display:inline-flex}.brand-extractor__browse:hover{color:#fff;background-color:#000;transform:scale(1.05)}.brand-extractor__preview{margin-bottom:var(--space-xl);position:relative}.brand-extractor__preview[hidden]{display:none}.brand-extractor__preview img{object-fit:contain;background:#ffffff0a;border:1px solid #ffffff24;border-radius:12px;max-width:100%;max-height:300px}.brand-extractor__reset{margin-top:var(--space-sm);color:var(--color-text-muted);font-family:var(--font-alfabet);text-transform:uppercase;letter-spacing:.02em;cursor:pointer;transition:background-color var(--transition-fast), color var(--transition-fast);background:#ffffff0f;border:1px solid #ffffff24;border-radius:8px;align-items:center;gap:.375rem;padding:.375rem .75rem;font-size:.625rem;font-weight:900;display:inline-flex}.brand-extractor__reset:hover{color:var(--color-text);background:#ffffff1a}.brand-extractor__export-header{justify-content:space-between;align-items:center;margin-bottom:.5rem;display:flex}.brand-extractor__export-code{color:var(--color-text-muted);white-space:pre;background:#ffffff0a;border:1px solid #ffffff1a;border-radius:8px;margin:0;padding:.75rem 1rem;font-family:Neue Montreal,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.8125rem;overflow-x:auto}.cp-popover{user-select:none;touch-action:none;background:#1a1a1a;border:1px solid #ffffff24;border-radius:12px;width:224px;padding:.75rem;box-shadow:0 16px 48px #00000080}.cp-area{cursor:crosshair;border-radius:8px;width:100%;height:150px;margin-bottom:.625rem;position:relative;overflow:hidden}.cp-area__gradient{background-color:red;position:absolute;inset:0}.cp-area__gradient:before{content:"";background:linear-gradient(90deg,#fff,#0000);position:absolute;inset:0}.cp-area__gradient:after{content:"";background:linear-gradient(#0000,#000);position:absolute;inset:0}.cp-area__cursor{pointer-events:none;z-index:1;border:2px solid #fff;border-radius:50%;width:14px;height:14px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #0000004d,inset 0 0 0 1px #0003}.cp-hue{cursor:pointer;border-radius:7px;width:100%;height:14px;margin-bottom:.625rem;position:relative}.cp-hue__track{background:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red);border-radius:7px;position:absolute;inset:0}.cp-hue__cursor{pointer-events:none;border:2px solid #fff;border-radius:3px;width:8px;height:18px;position:absolute;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #0000004d}.cp-footer{align-items:center;gap:.5rem;display:flex}.cp-footer__swatch{border:1px solid #ffffff24;border-radius:6px;flex-shrink:0;width:28px;height:28px}.cp-footer__input{min-width:0;color:var(--color-text);box-sizing:border-box;background:#ffffff0f;border:1px solid #ffffff24;border-radius:6px;flex:1;padding:.375rem .5rem;font-family:Neue Montreal,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.75rem}.cp-footer__input:focus{border-color:#ffffff59;outline:none}.color-palette-tool__select{width:100%;color:var(--color-text);font-family:var(--font-primary);cursor:pointer;appearance:none;background:#ffffff0f url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23a0a0a0' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right .75rem center no-repeat;border:1px solid #ffffff24;border-radius:8px;padding:.625rem 2rem .625rem .75rem;font-size:.9375rem}.color-palette-tool__select:focus{border-color:var(--color-accent);outline:none}.color-palette-tool__btn{color:#000;height:40px;font-family:var(--font-alfabet);text-transform:uppercase;letter-spacing:.02em;cursor:pointer;transition:background-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast);background-color:#fff;border-radius:8px;align-items:center;gap:.375rem;padding:0 1rem;font-size:.625rem;font-weight:900;display:inline-flex}.color-palette-tool__btn:hover{transform:scale(1.03)}.color-palette-tool__btn--secondary{color:var(--color-text-muted);background:#ffffff0f;border:1px solid #ffffff24}.color-palette-tool__btn--secondary:hover{color:var(--color-text);background:#ffffff1a}@media (width<=768px){body[data-page-type=tool] .tool-content>.container,body[data-page-type=tool] .tool-content__body,body[data-page-type=tool] .page-faq .faq__layout{grid-template-columns:1fr}body[data-page-type=tool] .tool-content__related,body[data-page-type=tool] .page-faq .faq__list{border-left:0;border-top:1px solid var(--tool-page-divider)}.tool-content__related h2{align-items:center;min-height:5.75rem;padding:0 1rem;display:flex}.tool-related{border-top:1px solid var(--tool-page-divider);grid-template-columns:1fr}.tool-related__link:nth-child(odd){border-right:0}.tool-related__link:nth-last-child(-n+2){border-bottom:1px solid var(--tool-page-divider)}.tool-related__link:last-child{border-bottom:0}}#favicon-results[hidden]{display:none}.tool-glyph-status{color:currentColor;width:4rem;height:4rem;margin:0 auto 1.25rem}.tool-glyph-status__mark{fill:currentColor;width:100%;height:100%;display:block;overflow:visible}.tool-glyph-status__mark rect{transform-box:view-box;transform-origin:0 0;will-change:transform, opacity}.tool-glyph-status[data-state=loading] .tool-glyph-status__mark{animation:1.2s steps(8,end) infinite triptychGlyphLoading}.tool-glyph-status[data-state=sparkle].is-activated .tool-glyph-status__mark{animation:.42s cubic-bezier(.22,1,.36,1) toolGlyphSparkle}.tool-glyph-status__label{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.tool-glyph-status-row{align-items:center;min-height:2.5rem;display:flex}.tool-glyph-status-row .tool-glyph-status{flex:none;width:2.25rem;height:2.25rem;margin:0}.tool-glyph-processing{padding:var(--space-xl);text-align:center;color:var(--color-text-muted);font-size:.9375rem}.tool-glyph-processing[hidden]{display:none}.tool-glyph-processing .tool-glyph-status{margin-bottom:.75rem}@media (prefers-reduced-motion:reduce){.tool-glyph-status__mark,.tool-glyph-status__mark rect{will-change:auto;transition:none;animation:none!important}}.contrast-checker__status{min-height:2.5rem;margin-bottom:var(--space-md);align-items:center;display:flex}.contrast-checker__status .tool-glyph-status{grid-template-columns:2.25rem minmax(0,1fr);gap:.75rem}.contrast-checker__status .tool-glyph-status__mark{width:2.25rem;height:2.25rem}.color-converter__status{margin-top:var(--space-sm);justify-content:center}.brand-extractor__loading .tool-glyph-status{margin-bottom:.75rem}.brand-extractor__results-heading{margin-bottom:var(--space-lg);align-items:center;gap:.75rem;display:flex}.brand-extractor__results-heading .tool-glyph-status{flex:none;width:2.25rem;height:2.25rem;margin:0}.gradient-tool__status{margin:calc(var(--space-lg) * -1) 0 var(--space-lg)}.color-palette-tool__status .tool-glyph-status,.palette-preview-tool__status .tool-glyph-status{width:2.25rem;height:2.25rem;color:var(--color-text);flex:none;margin:0}.favicon-generator__heading{margin:var(--space-xl) 0 var(--space-lg);align-items:center;gap:.75rem;display:flex}.favicon-generator__heading .tool-glyph-status{flex:none;width:2.25rem;height:2.25rem;margin:0}.svg-converter__status{min-height:3.5rem;color:var(--color-text-muted);align-items:center;gap:.75rem;padding:.65rem 0;font-size:.875rem;display:flex}.svg-converter__status .tool-glyph-status{width:2.25rem;height:2.25rem;color:var(--color-text);flex:none;margin:0}.svg-converter__status p{margin:0}.fp-glyph-status{margin:calc(var(--space-lg) * -1) 0 var(--space-md)}@keyframes triptychGlyphLoading{to{transform:rotate(360deg)}}@keyframes toolGlyphSparkle{0%,to{transform:scale(1)}45%{transform:scale(1.12)}}
