.colour-scale{margin:var(--space-xl) 0;padding:var(--space-lg);background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-md), var(--clay-inset);border:1.5px solid #ffffffb3;border:1.5px solid lab(100% 0 0/.7)}.colour-scale svg{width:100%;max-width:520px;height:auto;margin-inline:auto}.colour-scale figcaption{margin-top:var(--space-sm);text-align:center;font-size:var(--text-sm);color:var(--text-faint)}.colour-cards{gap:var(--space-lg);margin:var(--space-xl) 0 var(--space-md);grid-template-columns:repeat(auto-fit,minmax(12.5rem,1fr));display:grid}.colour-card{padding:var(--space-md);flex-direction:column;gap:.55rem;display:flex}.colour-card__swatch{border-radius:var(--radius-md);border:1.5px solid #ffffff8c;border:1.5px solid lab(100% 0 0/.55);height:3.4rem;box-shadow:inset 0 2px 3px #ffffff73,inset 0 -9px 16px #2a234438;box-shadow:inset 0 2px 3px lab(100% 0 0/.45),inset 0 -9px 16px lab(15.688% 10.4956 -20.0103/.22)}.colour-card__name{font-size:var(--text-lg);color:var(--text-strong);font-weight:700;line-height:1.15}.colour-card__source{font-size:var(--text-sm);color:var(--text)}.colour-card__facts{flex-wrap:wrap;gap:.4rem;margin-top:auto;padding-top:.5rem;display:flex}.colour-card__fact{border-radius:var(--radius-pill);font-size:var(--text-xs);color:var(--text-muted);background:var(--color-surface-2);border:1px solid var(--glass-border);padding:.22rem .6rem;font-weight:700}.colour-note{margin:0 0 var(--space-md);max-width:70ch;font-size:var(--text-sm);color:var(--text-muted);line-height:var(--leading-normal)}