.color-item{cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);border-radius:.375rem}.color-item:hover{transform:scale(1.15) translateY(-2px);box-shadow:0 8px 25px rgba(0,0,0,.15),0 0 0 2px hsla(0,0%,100%,.3);z-index:20}.card{background:hsl(var(--card));border:1px solid hsl(var(--border));border-radius:.5rem;padding:.5rem;transition:all .25s cubic-bezier(.16,1,.3,1);box-shadow:0 1px 2px -1px rgba(0,0,0,.03),0 1px 1px -1px rgba(0,0,0,.01);display:flex;flex-direction:column;height:100%;position:relative;overflow:hidden;cursor:pointer}.card:before{display:none}.card:hover{box-shadow:0 4px 12px rgba(0,0,0,.08),0 2px 4px rgba(0,0,0,.04)}.color-spectrum{display:flex;height:20px;margin:.25rem 0;border-radius:.25rem;overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,.06)}.color-spectrum-item{height:100%;flex:1;min-width:2px;transition:all .2s ease}.color-spectrum-item:hover{transform:scaleY(1.15);z-index:10;box-shadow:0 2px 8px rgba(0,0,0,.25);transform-origin:bottom}.card-header{padding-bottom:.25rem;border-bottom:1px solid hsl(var(--border));margin-bottom:.25rem}.card-footer{padding-top:.5rem;border-top:1px solid hsl(var(--border));margin-top:.25rem;font-size:.75rem;color:hsl(var(--muted-foreground))}@keyframes shimmer{0%{transform:translateX(-100%)}to{transform:translateX(100%)}}.animate-shimmer{animation:shimmer 2s infinite}