*{box-sizing:border-box}@media (width<=639px){.common-colors-topbar{gap:.375rem;width:100%;min-width:0}.common-colors-topbar__title{max-width:calc(100% - 8.5rem);line-height:1.25;font-size:1rem!important}.common-colors-toolbar{flex:none;gap:.125rem;margin-right:0}.common-colors-toolbar .app-icon-btn,.common-colors-toolbar a.app-icon-btn,.common-colors-toolbar button.app-icon-btn{box-sizing:border-box!important;flex:0 0 30px!important;width:30px!important;min-width:30px!important;max-width:30px!important;height:30px!important;min-height:30px!important;max-height:30px!important;margin:0!important;padding:0!important}.common-colors-toolbar .app-icon-btn svg,.common-colors-toolbar a.app-icon-btn svg,.common-colors-toolbar button.app-icon-btn svg{display:block;width:15px!important;min-width:15px!important;max-width:none!important;height:15px!important;min-height:15px!important;max-height:none!important}}.common-colors-main{padding-top:7.25rem!important}.common-colors-main.common-colors-main--mobile-open{padding-top:12.25rem!important}@media (width>=640px){.common-colors-main{padding-top:10.75rem!important}.common-colors-main.common-colors-main--desktop-collapsed{padding-top:7.5rem!important}.common-colors-main.common-colors-main--mobile-open{padding-top:10.75rem!important}}.common-colors-filter-panel{display:none}.common-colors-filter-panel--mobile-open{display:flex}@media (width>=640px){.common-colors-filter-panel{display:flex}.common-colors-filter-panel--desktop-collapsed{display:none}}.filter-section-toggle{cursor:pointer;text-align:left;background:0 0;border:none;justify-content:space-between;align-items:center;gap:.75rem;width:100%;padding:.35rem 0;display:flex}.filter-section-toggle-main{flex-direction:column;flex:1;gap:.15rem;min-width:0;display:flex}.filter-summary{color:#6b7280;font-size:.75rem;font-weight:500}.dark .filter-summary{color:#9ca3af}.filter-section-toggle-arrow{color:#6b7280;font-size:.65rem;line-height:1;transition:transform .2s}.filter-section-toggle-arrow.active{transform:rotate(180deg)}.dark .filter-section-toggle-arrow{color:#9ca3af}.common-colors-search .el-input__prefix-inner{align-items:center;display:inline-flex}.common-colors-filter-shell .common-colors-search .el-input__wrapper{background-color:#fff;border-radius:.75rem;min-height:2.75rem;padding-left:.75rem;padding-right:.75rem;transition:box-shadow .15s,background-color .15s;box-shadow:inset 0 0 0 1px #e5e7eb}.common-colors-filter-shell .common-colors-search .el-input__wrapper:hover{box-shadow:inset 0 0 0 1px #d1d5db}.common-colors-filter-shell .common-colors-search .el-input__wrapper.is-focus{box-shadow:inset 0 0 0 1px #3b82f68c,0 0 0 3px #3b82f633}.common-colors-filter-shell .common-colors-search .el-input__inner{font-size:.875rem}.common-colors-filter-shell .common-colors-search .el-input__inner::placeholder{color:#9ca3af}.common-colors-filter-shell .common-colors-search .el-input__clear,.common-colors-filter-shell .common-colors-search .el-input__clear svg{color:#6b7280}.common-colors-filter-shell .common-colors-search .el-input__clear:hover{color:#374151}.dark .common-colors-filter-shell .common-colors-search .el-input__wrapper{background-color:#374151;box-shadow:inset 0 0 0 1px #4b5563}.dark .common-colors-filter-shell .common-colors-search .el-input__wrapper:hover{box-shadow:inset 0 0 0 1px #6b7280}.dark .common-colors-filter-shell .common-colors-search .el-input__wrapper.is-focus{box-shadow:inset 0 0 0 1px #60a5fa8c,0 0 0 3px #3b82f638}.dark .common-colors-filter-shell .common-colors-search .el-input__inner{color:#f3f4f6;caret-color:#93c5fd}.dark .common-colors-filter-shell .common-colors-search .el-input__inner::placeholder,.dark .common-colors-filter-shell .common-colors-search .el-input__clear,.dark .common-colors-filter-shell .common-colors-search .el-input__clear svg{color:#9ca3af}.dark .common-colors-filter-shell .common-colors-search .el-input__clear:hover{color:#e5e7eb}.common-colors-filter-shell .common-colors-category-select.el-select{width:100%!important}@media (width>=640px){.common-colors-filter-shell .common-colors-category-select.el-select{width:min(100%,13.5rem)!important}}.common-colors-filter-shell .common-colors-category-select .el-select__wrapper,.common-colors-filter-shell .common-colors-category-select .el-input__wrapper{background-color:#fff;border-radius:.75rem;width:100%;min-height:2.75rem;padding-left:.5rem;padding-right:.5rem;transition:box-shadow .15s,background-color .15s;box-shadow:inset 0 0 0 1px #e5e7eb}.common-colors-filter-shell .common-colors-category-select .el-select__wrapper:hover,.common-colors-filter-shell .common-colors-category-select .el-input__wrapper:hover{box-shadow:inset 0 0 0 1px #d1d5db}.common-colors-filter-shell .common-colors-category-select .el-select__wrapper.is-focused,.common-colors-filter-shell .common-colors-category-select .el-input__wrapper.is-focus{box-shadow:inset 0 0 0 1px #8b5cf673,0 0 0 3px #8b5cf62e}.common-colors-filter-shell .common-colors-category-select .el-select__placeholder,.common-colors-filter-shell .common-colors-category-select .el-select__selected-item{font-size:.875rem}.common-colors-filter-shell .common-colors-category-select .el-select__caret,.common-colors-filter-shell .common-colors-category-select .el-icon{color:#6b7280}.dark .common-colors-filter-shell .common-colors-category-select .el-select__wrapper,.dark .common-colors-filter-shell .common-colors-category-select .el-input__wrapper{background-color:#1f2937;box-shadow:inset 0 0 0 1px #374151}.dark .common-colors-filter-shell .common-colors-category-select .el-select__wrapper:hover,.dark .common-colors-filter-shell .common-colors-category-select .el-input__wrapper:hover{box-shadow:inset 0 0 0 1px #4b5563}.dark .common-colors-filter-shell .common-colors-category-select .el-select__wrapper.is-focused,.dark .common-colors-filter-shell .common-colors-category-select .el-input__wrapper.is-focus{box-shadow:inset 0 0 0 1px #a78bfa73,0 0 0 3px #8b5cf633}.dark .common-colors-filter-shell .common-colors-category-select .el-select__placeholder{color:#9ca3af}.dark .common-colors-filter-shell .common-colors-category-select .el-select__selected-item{color:#f3f4f6}.dark .common-colors-filter-shell .common-colors-category-select .el-select__caret,.dark .common-colors-filter-shell .common-colors-category-select .el-icon{color:#9ca3af}.color-card{content-visibility:auto;contain-intrinsic-size:180px;transition:transform .3s,box-shadow .3s}.color-card:hover{transform:translateY(-2px)}.color-preview{transition:all .3s;position:relative}.color-card-icon-btn{cursor:pointer;box-sizing:border-box;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:10;border:1px solid #d1d5db;justify-content:center;align-items:center;margin:0;padding:5px;display:inline-flex}.color-card-icon-btn__svg{flex-shrink:0}.color-card-icon-btn svg,.color-card-icon-btn__svg{width:14px;height:14px;display:block}html.dark .color-card-icon-btn{border-color:#6b7280}.animate-spin{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}button:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.transition-all{will-change:transform, opacity, color, background-color}@media (width<=768px){.colors-bg{min-height:auto;padding-bottom:16px}.container{padding-left:8px!important;padding-right:8px!important}.load-more-trigger{width:100%;max-width:300px;padding:12px 24px;font-size:16px}.color-card{min-height:140px}.color-card-icon-btn{min-width:28px;min-height:28px;padding:6px}.color-card-icon-btn svg,.color-card-icon-btn__svg{width:13px;height:13px}}@media (width<=480px){.colors-bg{padding-bottom:12px}.color-card{min-height:130px}.color-preview{min-height:70px}.color-card-icon-btn{min-width:26px;min-height:26px;padding:5px}.color-card-icon-btn svg,.color-card-icon-btn__svg{width:12px;height:12px}}.dark .color-card{background:#1f2937;border:1px solid #374151}.dark .color-card:hover{border-color:#4b5563}.dark .load-more-trigger{background:linear-gradient(135deg,#4a5568 0%,#2d3748 100%)}.dark .load-more-trigger:hover{background:linear-gradient(135deg,#2d3748 0%,#1a202c 100%)}.fullscreen-overlay{cursor:pointer;animation:.3s ease-out fullscreen-appear}.fullscreen-info{cursor:default;width:clamp(240px,48vw,380px);padding:1.5rem;animation:.4s ease-out info-slide-up}.fullscreen-fade-enter-active,.fullscreen-fade-leave-active{transition:opacity .3s}.fullscreen-fade-enter-from,.fullscreen-fade-leave-to{opacity:0}@keyframes fullscreen-appear{0%{opacity:0}to{opacity:1}}@keyframes info-slide-up{0%{opacity:0;transform:translateY(30px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}@media (width<=640px){.fullscreen-info{width:clamp(200px,85vw,320px);padding:1rem}}html.dark .el-select-dropdown.common-colors-select-dropdown{box-shadow:0 10px 25px -5px #00000059,0 8px 10px -6px #00000047;background-color:#1f2937!important;border:1px solid #374151!important}html.dark .el-select-dropdown.common-colors-select-dropdown .el-select-dropdown__item{color:#e5e7eb}html.dark .el-select-dropdown.common-colors-select-dropdown .el-select-dropdown__item.is-hovering,html.dark .el-select-dropdown.common-colors-select-dropdown .el-select-dropdown__item:hover{background-color:#374151!important}html.dark .el-select-dropdown.common-colors-select-dropdown .el-select-dropdown__item.is-selected{color:#93c5fd;font-weight:600;background-color:#3b82f61f!important}html.dark .el-select-dropdown.common-colors-select-dropdown .el-select-dropdown__item.is-disabled{color:#6b7280}html.dark .el-select-dropdown.common-colors-select-dropdown .el-scrollbar__bar{--el-scrollbar-bg-color:#4b5563}html.dark .el-popper.is-dark .el-popper__arrow:before,html.dark .el-select__popper.common-colors-select-dropdown .el-popper__arrow:before{background:#1f2937!important;border-color:#374151!important}.el-input,.el-select{vertical-align:middle;align-items:center;width:100%;display:inline-flex;position:relative}.el-input__wrapper,.el-select__wrapper{cursor:text;box-sizing:border-box;flex:1;justify-content:flex-start;align-items:center;gap:.5rem;width:100%;display:inline-flex;position:relative}.el-input__inner-wrap{flex:1;min-width:0;display:inline-flex}.el-input__prefix,.el-input__suffix,.el-select__prefix,.el-select__suffix{color:inherit;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.el-input__clear{cursor:pointer;align-items:center;display:inline-flex}.el-select__wrapper{cursor:pointer}.el-select__selection{flex:1;align-items:center;min-width:0;display:inline-flex;position:relative}.el-select__selected-item{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.elx-native-select{opacity:0;appearance:none;cursor:pointer;background:0 0;border:none;width:100%;height:100%;font-size:16px;position:absolute;inset:0}
