.color-panel[data-v-e482d7ba]{gap:var(--spacing-2);flex:1;min-height:0}.color-panel[data-v-e482d7ba],.color-panel__filter[data-v-e482d7ba]{flex-direction:column;display:flex}.color-panel__filter[data-v-e482d7ba]{gap:var(--spacing-3)}@media (width>=600px){.color-panel__filter[data-v-e482d7ba]{flex-direction:row;align-items:center}.color-panel__select[data-v-e482d7ba]{flex:0 280px;min-width:110px}.color-panel__search-wrap[data-v-e482d7ba]{flex:auto;min-width:0}}.color-panel__search-wrap[data-v-e482d7ba]{position:relative}.color-panel__search[data-v-e482d7ba]{width:100%;padding-right:var(--spacing-6)}.color-panel__search-clear[data-v-e482d7ba]{width:24px;height:24px;color:var(--color-text-muted);cursor:pointer;transition:color var(--transition-fast);background:0 0;border:0;place-items:center;padding:0;display:grid;position:absolute;top:50%;right:0;transform:translateY(-50%)}.color-panel__search-clear[data-v-e482d7ba]:hover{color:var(--color-text)}.color-panel__search-clear[data-v-e482d7ba] svg{width:14px;height:14px}.color-panel__grid-wrap[data-v-e482d7ba]{padding:var(--spacing-2);position:relative;overflow:hidden auto}.color-panel__grid-wrap--flex[data-v-e482d7ba]{height:50vh}@media (width>=1024px){.color-panel__grid-wrap--flex[data-v-e482d7ba]{flex:1;height:auto;min-height:0}}.color-panel__grid[data-v-e482d7ba],.color-panel__skeleton[data-v-e482d7ba]{gap:var(--spacing-2);grid-template-columns:repeat(auto-fill,minmax(56px,1fr));display:grid}.color-panel__skeleton[data-v-e482d7ba]{inset:var(--spacing-2);grid-auto-rows:min-content;position:absolute;overflow:hidden}.color-panel__skeleton[data-v-e482d7ba]:after{content:"";pointer-events:none;background:linear-gradient(100deg,transparent 20%,color-mix(in srgb,var(--color-bg-page) 75%,transparent) 50%,transparent 80%);background-size:220% 100%;animation:1.6s linear infinite color-panel-shimmer-e482d7ba;position:absolute;inset:0}@keyframes color-panel-shimmer-e482d7ba{0%{background-position:120% 0}to{background-position:-20% 0}}@media (prefers-reduced-motion:reduce){.color-panel__skeleton[data-v-e482d7ba]:after{animation:none}}.color-panel__skeleton-cell[data-v-e482d7ba]{aspect-ratio:1;background:var(--color-bg-soft);border-radius:var(--radius-lg)}.color-panel__hint[data-v-e482d7ba]{padding:var(--spacing-4) 0}.color-panel__hint[data-v-e482d7ba],.color-panel__note[data-v-e482d7ba]{color:var(--color-text-muted);font-size:var(--font-size-sm)}.color-panel__note[data-v-e482d7ba]{white-space:nowrap;text-overflow:ellipsis;min-height:1lh;margin:0;overflow:hidden}.color-swatch[data-v-e482d7ba]{--_press:var(--transition-spring);aspect-ratio:1;border-radius:var(--radius-lg);cursor:pointer;transition:transform var(--_press),box-shadow var(--transition-fast);border:none}.color-swatch[data-v-e482d7ba]:hover{transform:scale(1.06)}.color-swatch[data-v-e482d7ba]:active{--_press:80ms var(--ease-out);transform:scale(.94)}.color-swatch--active[data-v-e482d7ba]{box-shadow:0 0 0 2px var(--color-bg-page),0 0 0 4px var(--color-text);z-index:1;position:relative;transform:scale(1.12)}.color-swatch--active[data-v-e482d7ba]:hover{transform:scale(1.12)}