.color-picker-tool[data-v-e0b2fb34]{position:relative}.copy-toast[data-v-e0b2fb34]{background-color:#141b24eb;border-radius:8px;box-shadow:0 8px 24px #141b2426;color:#fff;font-size:14px;left:50%;opacity:0;padding:10px 20px;pointer-events:none;position:fixed;top:70px;transform:translate(-50%) translateY(-100px);transition:all .3s ease;z-index:1000}.copy-toast.show[data-v-e0b2fb34]{opacity:1;transform:translate(-50%) translateY(0)}.color-picker[data-v-e0b2fb34]{background-color:#fff;border:1px solid #e2e8f0;border-radius:12px;box-shadow:0 2px 8px #141b240a;overflow:hidden}.color-info-bar[data-v-e0b2fb34]{background-color:#f8fafc;border-bottom:1px solid #f1f5f8;flex-wrap:wrap;height:60px;justify-content:space-between;padding:0 20px}.color-info-bar[data-v-e0b2fb34],.color-preview[data-v-e0b2fb34]{align-items:center;display:flex}.color-preview[data-v-e0b2fb34]{gap:10px}.color-swatch[data-v-e0b2fb34]{border:1px solid #e2e8f0;border-radius:50%;box-shadow:inset 0 0 0 1px #ffffff80;height:26px;transition:background-color .2s ease;width:26px}.color-hex[data-v-e0b2fb34]{color:#141b24;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:14px;font-weight:700;letter-spacing:.5px}.color-values[data-v-e0b2fb34]{color:#454e58;display:flex;font-size:13px;gap:20px}.color-hsl[data-v-e0b2fb34],.color-rgb[data-v-e0b2fb34]{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap}.color-picker-content[data-v-e0b2fb34]{display:flex;flex-wrap:wrap;gap:20px;padding:20px}.color-selection-area[data-v-e0b2fb34]{flex:1;min-width:300px}.color-panel[data-v-e0b2fb34]{display:flex;flex-direction:column;gap:16px}.color-gradient[data-v-e0b2fb34]{border:1px solid #e2e8f0;border-radius:8px;cursor:crosshair;height:240px;overflow:hidden;position:relative;width:100%}.white-overlay[data-v-e0b2fb34]{background:linear-gradient(90deg,#fff,#fff0)}.black-overlay[data-v-e0b2fb34],.white-overlay[data-v-e0b2fb34]{inset:0;position:absolute}.black-overlay[data-v-e0b2fb34]{background:linear-gradient(0deg,#000,transparent)}.color-picker-marker[data-v-e0b2fb34]{border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px #141b244d,0 2px 6px #141b2426;height:20px;pointer-events:none;position:absolute;transform:translate(-50%,-50%);width:20px}.hue-slider[data-v-e0b2fb34]{border:1px solid #e2e8f0;border-radius:14px;cursor:pointer;height:28px;position:relative;width:100%}.hue-gradient[data-v-e0b2fb34]{background:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red);border-radius:14px;height:100%;width:100%}.hue-marker[data-v-e0b2fb34]{background-color:#fff;border:2px solid #141b24;border-radius:3px;bottom:-2px;box-shadow:0 2px 6px #141b2433;pointer-events:none;position:absolute;top:-2px;transform:translate(-50%);width:5px}.color-input-group[data-v-e0b2fb34]{align-items:center;display:flex;gap:10px}.color-input-wrapper[data-v-e0b2fb34]{align-items:center;background-color:#f8fafc;border:1px solid #e2e8f0;border-radius:6px;display:flex;flex:1;overflow:hidden;transition:all .2s ease}.color-input-wrapper[data-v-e0b2fb34]:focus-within{background-color:#fff;border-color:#00828f;box-shadow:0 0 0 2px #00828f26}.input-prefix[data-v-e0b2fb34]{align-items:center;background-color:#f1f5f8;border-right:1px solid #e2e8f0;color:#5b646f;display:flex;font-weight:600}.color-input[data-v-e0b2fb34],.input-prefix[data-v-e0b2fb34]{font-size:14px;height:38px;padding:0 12px}.color-input[data-v-e0b2fb34]{background-color:transparent;border:none;color:#141b24;flex:1;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.5px;outline:none}.copy-btn[data-v-e0b2fb34]{align-items:center;background-color:#dbf2f5;border:none;border-radius:6px;color:#00828f;cursor:pointer;display:flex;flex-shrink:0;font-size:.95rem;height:38px;justify-content:center;padding:0;transition:all .2s ease;width:38px}.copy-btn[data-v-e0b2fb34]:hover{background-color:#00828f;color:#fff;transform:scale(1.05)}.copy-btn[data-v-e0b2fb34]:active{transform:scale(.98)}.action-buttons[data-v-e0b2fb34]{display:flex;gap:10px}.btn[data-v-e0b2fb34]{border:none;border-radius:6px;cursor:pointer;flex:1;font-size:.9rem;font-weight:500;height:40px;padding:0 16px;transition:all .2s ease}.random-palette-btn[data-v-e0b2fb34]{background-color:#f1f5f8;border:1px solid #e2e8f0;color:#454e58}.random-palette-btn[data-v-e0b2fb34]:hover{background-color:#dbf2f5;border-color:#00828f40;color:#00535c;transform:translateY(-1px)}.random-palette-btn[data-v-e0b2fb34]:active{transform:translateY(0)}.color-palette-area[data-v-e0b2fb34]{display:flex;flex:1;flex-direction:column;gap:16px;min-width:300px}.palette-controls[data-v-e0b2fb34]{width:100%}.palette-select[data-v-e0b2fb34]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#f8fafc;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%235b646f' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;border:1px solid #e2e8f0;border-radius:8px;color:#141b24;cursor:pointer;font-size:14px;height:42px;outline:none;padding:0 12px;transition:all .2s ease;width:100%}.palette-select[data-v-e0b2fb34]:focus{background-color:#fff;border-color:#00828f;box-shadow:0 0 0 2px #00828f26}.palette-colors[data-v-e0b2fb34]{display:flex;flex:1;flex-direction:column;gap:10px;min-height:240px}.palette-color[data-v-e0b2fb34]{align-items:center;border:1px solid #e2e8f0;border-radius:8px;cursor:pointer;display:flex;flex:1;justify-content:center;overflow:hidden;padding:0 10px;position:relative;transition:transform .2s ease,box-shadow .2s ease}.palette-color[data-v-e0b2fb34]:hover{box-shadow:0 4px 12px #141b241f;transform:scale(1.02);z-index:2}.color-codes[data-v-e0b2fb34]{text-align:center;text-shadow:0 0 3px rgba(0,0,0,.3);width:100%}.color-hex-code[data-v-e0b2fb34],.color-rgb-code[data-v-e0b2fb34]{border-radius:4px;cursor:pointer;display:block;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:700;padding:4px 8px;transition:background-color .2s ease}.color-hex-code[data-v-e0b2fb34]:hover,.color-rgb-code[data-v-e0b2fb34]:hover{background-color:#ffffff40}.color-hex-code[data-v-e0b2fb34]{font-size:14px;letter-spacing:.5px;margin-bottom:4px}.color-rgb-code[data-v-e0b2fb34]{font-size:12px;letter-spacing:.3px}@media (max-width:767px){.color-info-bar[data-v-e0b2fb34]{flex-wrap:wrap;gap:10px;height:auto;padding:12px 16px}.color-values[data-v-e0b2fb34]{flex-wrap:wrap;gap:15px;order:3;width:100%}.color-picker-content[data-v-e0b2fb34]{gap:14px;padding:14px}.action-buttons[data-v-e0b2fb34]{flex-direction:column}.color-gradient[data-v-e0b2fb34]{height:200px}.color-hex-code[data-v-e0b2fb34]{font-size:12px}.color-rgb-code[data-v-e0b2fb34]{font-size:10px}.palette-colors[data-v-e0b2fb34]{min-height:200px}.palette-color[data-v-e0b2fb34]{min-height:48px}}