.skeleton-box{overflow:hidden;position:relative}.skeleton-box:after{animation:shimmer 2s infinite;background-image:linear-gradient(90deg,#fff0,#fff3 20%,#ffffff80 60%,#fff0);content:"";inset:0;position:absolute;transform:translate(-100%)}@keyframes shimmer{to{transform:translate(100%)}}.skeleton-circle,.skeleton-text{background-color:#e5e7eb}.skeleton-text{border-radius:.25rem}.color-picker-container[data-v-caaa0ac3]{cursor:none;display:block;position:relative;touch-action:none;width:100%}.preview-image[data-v-caaa0ac3]{display:block;height:auto;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%;-webkit-user-drag:none}.hidden-canvas[data-v-caaa0ac3]{display:none}.magnifier-glass[data-v-caaa0ac3]{background:#f0f0f0;border:4px solid #fff;border-radius:50%;box-shadow:0 8px 24px #00000040,0 0 0 1px #0000001a;overflow:hidden;pointer-events:none;position:absolute;transition:opacity .15s ease,transform .15s ease;will-change:width,height,top,left;z-index:100}.magnifier-glass canvas[data-v-caaa0ac3]{display:block;height:100%;width:100%}.pixel-grid[data-v-caaa0ac3]{background-image:linear-gradient(90deg,rgba(0,0,0,.1) 1px,transparent 0),linear-gradient(180deg,rgba(0,0,0,.1) 1px,transparent 0);height:100%;left:0;opacity:.5;pointer-events:none;position:absolute;top:0;width:100%}.pixel-indicator[data-v-caaa0ac3]{background:#ffffff1a;box-shadow:0 0 0 1px #00000080;height:12px;left:50%;top:50%;transform:translate(-50%,-50%);width:12px;z-index:2}.cursor-crosshair[data-v-caaa0ac3],.pixel-indicator[data-v-caaa0ac3]{border:2px solid hsla(0,0%,100%,.9);pointer-events:none;position:absolute}.cursor-crosshair[data-v-caaa0ac3]{border-radius:50%;box-shadow:0 0 2px #00000080;height:20px;transition:transform .2s ease,opacity .2s ease;width:20px;z-index:101}.cursor-crosshair[data-v-caaa0ac3]:before{background:#fff;border-radius:50%;box-shadow:0 0 2px #000c;content:"";height:4px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:4px}.cursor-crosshair.is-active[data-v-caaa0ac3]{opacity:.5;transform:scale(.5)}.current-color-ring[data-v-caaa0ac3]{border:4px solid;border-radius:50%;inset:0;pointer-events:none;position:absolute;transition:border-color .1s ease;z-index:3}.color-box[data-v-caaa0ac3]{background:#fff;border:1px solid rgba(0,0,0,.2);border-radius:.25rem;bottom:10px;box-shadow:0 1px 3px #0003;font-size:.75rem;font-weight:600;left:10px;padding:.25rem .5rem;position:absolute;z-index:102}.slide-fade-enter-active[data-v-a0f5b0c5],.slide-fade-leave-active[data-v-a0f5b0c5]{transition:opacity .2s ease,transform .2s ease}.slide-fade-enter-from[data-v-a0f5b0c5],.slide-fade-leave-to[data-v-a0f5b0c5]{opacity:0;transform:translateY(-8px)}.single-color-card[data-v-a0f5b0c5]{background-color:#fff;border-radius:.75rem;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f;display:flex;flex-direction:column;gap:.75rem;padding:1rem}.single-color-card .card-header[data-v-a0f5b0c5]{align-items:center;background:transparent;border-bottom:1px solid #e5e7eb;color:inherit;display:flex;gap:.75rem;justify-content:space-between;padding-bottom:.75rem}.single-color-card .header-left[data-v-a0f5b0c5]{align-items:center;display:flex;gap:.5rem}.single-color-card .color-swatch-pair[data-v-a0f5b0c5]{align-items:center;display:flex;gap:1rem}.single-color-card .color-swatch-pair.has-achievable[data-v-a0f5b0c5]{border-right:1px solid #e5e7eb;margin-right:.75rem;padding-right:1rem}.single-color-card .swatch-item[data-v-a0f5b0c5]{align-items:center;display:flex;flex-direction:column;gap:.375rem}.single-color-card .swatch-label[data-v-a0f5b0c5]{align-items:center;color:#6b7280;display:inline-flex;font-size:.7rem;font-weight:700;letter-spacing:.06em;line-height:1;text-transform:uppercase}.single-color-card .color-circle[data-v-a0f5b0c5]{border:2px solid #e5e7eb;border-radius:50%;box-shadow:0 2px 4px #00000014;height:60px;transition:none;width:60px}.single-color-card .swatch-arrow[data-v-a0f5b0c5]{color:#9ca3af;flex-shrink:0;height:1.5rem;width:1.5rem}.single-color-card .hex-code[data-v-a0f5b0c5]{color:#111827;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.875rem;font-weight:600}.single-color-card .copy-btn[data-v-a0f5b0c5]{align-items:center;background-color:transparent;border:none;border-radius:.375rem;color:#6b7280;cursor:pointer;display:flex;justify-content:center;padding:.375rem;transition:all .2s}.single-color-card .copy-btn[data-v-a0f5b0c5]:hover{background-color:#f3f4f6;color:#374151}.single-color-card .copy-btn.copied[data-v-a0f5b0c5]{background-color:#d1fae5;color:#10b981}.single-color-card .card-content[data-v-a0f5b0c5]{display:flex;flex-direction:column;gap:.75rem}.single-color-card .content-section[data-v-a0f5b0c5]{display:flex;flex-direction:column;gap:.5rem}.single-color-card .section-title[data-v-a0f5b0c5]{color:#6b7280;font-size:.75rem;font-weight:600;letter-spacing:.05em;line-height:1.2;margin:0;text-transform:uppercase}.single-color-card .oil-colors-list[data-v-a0f5b0c5]{display:flex;flex-wrap:wrap;gap:.375rem}.single-color-card .oil-color-tag[data-v-a0f5b0c5]{background-color:#fdf8f4;border:1px solid #f3ceb3;border-radius:.375rem;color:#8a4f2c;display:inline-table;font-size:.8125rem;font-weight:500;height:28px;padding:0}.single-color-card .oil-color-tag span[data-v-a0f5b0c5]{display:table-cell;line-height:1;padding:0 10px;vertical-align:middle;white-space:nowrap}.single-color-card .recipe-text[data-v-a0f5b0c5]{color:#4b5563;font-size:.875rem;line-height:1.5;margin:0}.single-color-card .delta-e-badge[data-v-a0f5b0c5]{background-color:#dbeafe;border-radius:.25rem;color:#1e40af;display:inline-block;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.75rem;font-weight:600;margin-top:.5rem;padding:.25rem .5rem}.single-color-card .delta-e-badge.high[data-v-a0f5b0c5]{background-color:#fee2e2;color:#991b1b}.skeleton-box[data-v-a0f5b0c5]{overflow:hidden;position:relative}.skeleton-box[data-v-a0f5b0c5]:after{animation:shimmer-a0f5b0c5 2s infinite;background-image:linear-gradient(90deg,#fff0,#fff3 20%,#ffffff80 60%,#fff0);content:"";inset:0;position:absolute;transform:translate(-100%)}@keyframes shimmer-a0f5b0c5{to{transform:translate(100%)}}.skeleton-circle[data-v-a0f5b0c5],.skeleton-text[data-v-a0f5b0c5]{background-color:#e5e7eb}.skeleton-text[data-v-a0f5b0c5]{border-radius:.25rem}.error-message[data-v-a0f5b0c5]{background-color:#fee2e2;border:1px solid #f87171;border-radius:.375rem;margin-bottom:1rem;padding:1rem}.image-container[data-v-a0f5b0c5]{align-items:center;display:flex;justify-content:center;max-width:100%;overflow:hidden;width:100%}.image-container[data-v-a0f5b0c5] .color-magnifier{max-width:100%;width:100%}.image-container[data-v-a0f5b0c5] .color-magnifier img{display:block;height:auto;margin:0 auto;width:100%}img:not(.preview-image){animation-duration:.3s;animation-timing-function:cubic-bezier(.4,0,.2,1);border-radius:1rem;transition-duration:.3s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}img:not(.preview-image):hover{--tw-scale-x:1.05;--tw-scale-y:1.05;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.btn-primary{background-color:#d07c4a;border-radius:.375rem;color:#fff;font-weight:600;transition:background-color .3s}.btn-primary:hover{background-color:#ba6d3f}.btn-primary:active{background-color:#a85f35}
