.color-converter-card[data-v-4da4c9d1]{border:none;background:transparent}.color-converter-form[data-v-4da4c9d1]{max-width:800px;margin:0 auto;padding:16px 0}.picker-section[data-v-4da4c9d1]{margin-bottom:16px}.picker-item[data-v-4da4c9d1]{margin-bottom:0}.picker-container[data-v-4da4c9d1]{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.color-picker[data-v-4da4c9d1]{flex-shrink:0;width:320px!important;height:30px!important}[data-v-4da4c9d1] .el-color-picker__trigger{width:320px!important;height:30px!important;border-radius:6px!important;min-width:320px!important;max-width:320px!important}[data-v-4da4c9d1] .el-color-picker{width:320px!important;height:30px!important;min-width:320px!important;max-width:320px!important}[data-v-4da4c9d1] .el-color-picker__color{width:320px!important;height:30px!important;border-radius:6px!important;min-width:320px!important;max-width:320px!important}[data-v-4da4c9d1] .el-color-picker__color-inner{width:320px!important;height:30px!important;border-radius:6px!important}.el-color-picker__trigger[data-v-4da4c9d1]{width:320px!important;height:30px!important;border-radius:6px!important;min-width:320px!important;max-width:320px!important}.el-color-picker[data-v-4da4c9d1]{width:320px!important;height:30px!important;min-width:320px!important;max-width:320px!important}.el-color-picker__color[data-v-4da4c9d1]{width:320px!important;height:30px!important;border-radius:6px!important;min-width:320px!important;max-width:320px!important}.el-color-picker__color-inner[data-v-4da4c9d1]{width:320px!important;height:30px!important;border-radius:6px!important}.picker-input[data-v-4da4c9d1]{flex:0 0 320px;width:320px;min-width:320px;max-width:320px}.section-divider[data-v-4da4c9d1]{margin:20px 0;color:var(--el-text-color-secondary)}.section-divider .el-icon[data-v-4da4c9d1]{font-size:16px}.output-section[data-v-4da4c9d1]{margin-top:16px}.format-grid[data-v-4da4c9d1]{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}.format-item[data-v-4da4c9d1]{border:1px solid var(--el-border-color-light);border-radius:6px;padding:12px;background:var(--el-bg-color-page);transition:all .3s ease}.format-item[data-v-4da4c9d1]:hover{border-color:var(--el-color-primary);box-shadow:0 2px 8px #0000001a;transform:translateY(-1px)}.format-item--copied[data-v-4da4c9d1]{border-color:var(--el-color-success);background:var(--el-color-success-light-9)}.format-header[data-v-4da4c9d1]{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.format-label[data-v-4da4c9d1]{font-weight:500;color:var(--el-text-color-primary);font-size:13px}.copy-btn[data-v-4da4c9d1]{width:24px;height:24px;padding:0;transition:all .3s ease}.copy-btn[data-v-4da4c9d1]:hover{transform:scale(1.1)}.format-output[data-v-4da4c9d1]{font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:13px}.format-output--empty[data-v-4da4c9d1]{opacity:.5}.format-output[data-v-4da4c9d1] .el-input__inner{background:var(--el-fill-color-lighter);border:1px solid var(--el-border-color-lighter);color:var(--el-text-color-primary);font-family:inherit}.format-output[data-v-4da4c9d1]:hover .el-input__inner{border-color:var(--el-border-color)}@media (max-width: 768px){.picker-container[data-v-4da4c9d1]{flex-direction:column;align-items:stretch}.picker-input[data-v-4da4c9d1]{flex:1;width:100%;min-width:auto;max-width:none}.color-picker[data-v-4da4c9d1]{width:100%!important}[data-v-4da4c9d1] .el-color-picker__trigger,[data-v-4da4c9d1] .el-color-picker,[data-v-4da4c9d1] .el-color-picker__color,.el-color-picker__trigger[data-v-4da4c9d1],.el-color-picker[data-v-4da4c9d1],.el-color-picker__color[data-v-4da4c9d1]{width:100%!important;min-width:auto!important;max-width:none!important}.format-grid[data-v-4da4c9d1]{grid-template-columns:1fr}.section-divider[data-v-4da4c9d1]{margin:24px 0}}@media (max-width: 1024px) and (min-width: 769px){.picker-input[data-v-4da4c9d1]{flex:0 0 280px;width:280px;min-width:280px;max-width:280px}.color-picker[data-v-4da4c9d1]{width:280px!important}[data-v-4da4c9d1] .el-color-picker__trigger,[data-v-4da4c9d1] .el-color-picker,[data-v-4da4c9d1] .el-color-picker__color,.el-color-picker__trigger[data-v-4da4c9d1],.el-color-picker[data-v-4da4c9d1],.el-color-picker__color[data-v-4da4c9d1]{width:280px!important;min-width:280px!important;max-width:280px!important}.format-grid[data-v-4da4c9d1]{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}}@media (max-width: 480px){.color-converter-form[data-v-4da4c9d1]{padding:12px 8px}.picker-container[data-v-4da4c9d1],.format-grid[data-v-4da4c9d1]{gap:8px}.format-item[data-v-4da4c9d1]{padding:10px}.section-divider[data-v-4da4c9d1]{margin:16px 0}.picker-section[data-v-4da4c9d1]{margin-bottom:12px}}@media (prefers-color-scheme: dark){.format-item[data-v-4da4c9d1]{background:var(--el-bg-color);border-color:var(--el-border-color)}.format-item[data-v-4da4c9d1]:hover{box-shadow:0 2px 8px #ffffff1a}}@keyframes pulse-4da4c9d1{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.format-item--copied[data-v-4da4c9d1]{animation:pulse-4da4c9d1 .6s ease-in-out}.copy-btn.is-loading[data-v-4da4c9d1]{pointer-events:none}.format-item[data-v-4da4c9d1]:focus-within{outline:2px solid var(--el-color-primary);outline-offset:2px}.copy-btn[data-v-4da4c9d1]:focus{outline:2px solid var(--el-color-primary);outline-offset:2px}