.color-compare{display:grid;gap:var(--space-2xl)}.color-compare__intro{max-width:60ch;margin-bottom:var(--space-xl)}.color-compare__intro>:last-child{margin-bottom:0}.color-compare__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:var(--space-sm)}.color-compare__title{margin:0}.color-compare__count{margin-inline-start:var(--space-xs);font-size:var(--text-sm);font-weight:400;color:var(--color-text-muted);font-variant-numeric:tabular-nums}.color-compare__actions{display:flex;flex-wrap:wrap;gap:var(--space-xs)}.color-compare__status{min-height:1.5em;margin:var(--space-xs) 0 var(--space-md);font-size:var(--text-sm);color:var(--color-text-muted)}.color-compare__cards{display:grid;grid-auto-flow:column;grid-auto-columns:min(78vw,20rem);gap:var(--space-md);margin-inline:calc(var(--gutter) * -1);padding:var(--space-2xs) var(--gutter);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter)}@media(min-width:768px){.color-compare__cards{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));margin-inline:0;padding-inline:0;overflow-x:visible}}.color-compare__card{position:relative;display:grid;gap:var(--space-sm);align-content:start;padding:var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:var(--shadow-sm);scroll-snap-align:start}@keyframes color-compare-enter{0%{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}.color-compare__card[data-enter]{animation:color-compare-enter var(--duration-base) var(--ease-out) both}@media(prefers-reduced-motion:reduce){.color-compare__card[data-enter]{animation:none}}.color-compare__chip{aspect-ratio:4 / 3;border-radius:var(--radius);background-color:var(--swatch-color, var(--color-surface-alt));border:1px solid var(--color-border)}.color-compare__identity{display:grid;gap:var(--space-2xs)}.color-compare__name{margin:0;font-size:var(--text-md)}.color-compare__family{margin:0;font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--color-text-subtle)}.color-compare__specs{display:flex;flex-wrap:wrap;gap:var(--space-md);margin:0;padding-bottom:var(--space-sm);border-bottom:1px solid var(--color-border-subtle)}.color-compare__specs dt{font-size:var(--text-xs);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--color-text-muted)}.color-compare__specs dd{margin:var(--space-2xs) 0 0;font-size:var(--text-sm);font-variant-numeric:tabular-nums}.color-compare__hex{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.color-compare__link{font-size:var(--text-sm);justify-self:start}.color-compare__remove{position:absolute;inset-block-start:var(--space-xs);inset-inline-end:var(--space-xs);z-index:1;display:grid;place-items:center;inline-size:2rem;block-size:2rem;padding:0;border:1px solid var(--color-border);border-radius:50%;background:var(--color-surface);color:var(--color-text);font-size:var(--text-md);line-height:1;cursor:pointer;transition:border-color var(--duration-fast) var(--ease-default)}.color-compare__remove:hover{border-color:var(--color-text)}@media(pointer:coarse){.color-compare__remove{inline-size:2.75rem;block-size:2.75rem}}.color-compare__browse{padding-top:var(--space-xl);border-top:1px solid var(--color-border)}.color-compare__browse-title{margin:0 0 var(--space-md);font-size:var(--text-md)}.color-compare__field{display:grid;gap:var(--space-2xs);margin-bottom:var(--space-lg)}.color-compare__field label{font-size:var(--text-sm);font-weight:600}.color-compare__field input{max-width:20rem;min-block-size:2.75rem;padding:var(--space-xs) var(--space-sm);border:1px solid var(--sx-control-border, var(--color-border));border-radius:var(--radius);background:var(--sx-panel, var(--color-surface));color:var(--color-text);font:inherit}.color-compare__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(5.5rem,1fr));gap:var(--space-sm)}.color-compare__add{display:grid;gap:var(--space-2xs);width:100%;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:center;cursor:pointer}.color-compare__add .swatch-tile__chip{width:100%;aspect-ratio:1;border-radius:var(--radius)}.color-compare__add-name{font-size:var(--text-sm)}.color-compare__add[aria-pressed=true] .swatch-tile__chip{box-shadow:inset 0 0 0 3px var(--color-surface),inset 0 0 0 5px var(--color-primary)}.color-compare__no-results{margin-top:var(--space-md);color:var(--color-text-muted)}.color-compare__disclaimer{margin-top:var(--space-2xl);font-size:var(--text-sm);color:var(--color-text-muted)}
/*# sourceMappingURL=/cdn/shop/t/2/assets/color-compare.css.map */