.copied{background-color:var(--color-gray-800);border-radius:4px;color:var(--color-white);font-size:var(--fontSize-sm);padding:.25rem .5rem}.color{background-color:var(--color-white);border:2px solid var(--color-base-transparent);border-radius:8px;box-shadow:0 12px 16px -4px #10182814,0 4px 6px -2px #10182808}.color:hover{border-color:var(--color-gray-800)}.color-preview{border-bottom:1px solid var(--color-gray-100);border-top-left-radius:8px;border-top-right-radius:8px;cursor:pointer;display:grid;height:60px;place-items:center}.color-info{padding:.5rem 1rem}.color-info-name{color:var(--color-gray-800);font-size:var(--fontSize-sm);font-weight:500}.color-info-code{color:var(--color-gray-600);font-size:var(--fontSize-xs);margin-top:.25rem;text-transform:uppercase}