.color-picker-checkerboard{background-color:#fff;background-image:linear-gradient(45deg,#e5e5e5 25%,transparent 25%),linear-gradient(-45deg,#e5e5e5 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e5e5e5 75%),linear-gradient(-45deg,transparent 75%,#e5e5e5 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px}.color-palette-preview{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem}.color-palette-swatch{width:100%;min-height:2.75rem;aspect-ratio:1;border:1px solid rgb(var(--portfolio-rgb-ink) / .25);border-radius:.375rem;transition:transform .15s ease}.color-palette-swatch:hover{transform:translateY(-2px)}.color-palette-swatch:focus-visible{outline:3px solid rgb(var(--portfolio-rgb-primary));outline-offset:3px}.color-palette-grid{display:grid;width:100%;aspect-ratio:3 / 4;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:clamp(7px,2vw,15px);scroll-margin-top:6rem}.color-palette-grid[data-count="1"]{grid-template-rows:1fr}.color-palette-grid[data-count="2"],.color-palette-grid[data-count="3"]{grid-template-rows:repeat(2,minmax(0,1fr))}.color-palette-card{display:flex;min-width:0;flex-direction:column;align-items:flex-start;justify-content:space-between;border:0;border-radius:clamp(10px,3vw,20px);padding:clamp(14px,4vw,32px);text-align:left;transition:transform .15s ease}.color-palette-card:hover{transform:scale(.985)}.color-palette-card:focus-visible{outline:3px solid rgb(var(--portfolio-rgb-primary));outline-offset:-7px}.color-palette-card:first-child,.color-palette-grid[data-count="4"] .color-palette-card:last-child,.color-palette-grid[data-count="2"] .color-palette-card{grid-column:span 2}.color-palette-name{font-size:clamp(16px,3vw,25px);font-weight:600;line-height:1.15}.color-palette-hex{font-family:var(--portfolio-font-mono);font-size:clamp(10px,1.8vw,16px);font-weight:500}