.df[data-v-e6f23cb2]{flex-direction:column;display:flex}.df-toolbar[data-v-e6f23cb2]{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:.75rem;min-height:3.5rem;padding:.7rem 1.25rem;display:flex}.df-summary[data-v-e6f23cb2]{min-width:0;color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:.8125rem;font-weight:600;overflow:hidden}.df-actions[data-v-e6f23cb2]{flex:none;gap:.5rem;display:flex}.df-btn[data-v-e6f23cb2],.df-copy[data-v-e6f23cb2],.df-choose[data-v-e6f23cb2]{border:1px solid var(--border-strong);border-radius:var(--radius-button);background:var(--elevated);min-height:2.75rem;color:var(--muted);cursor:pointer;touch-action:manipulation;white-space:nowrap;justify-content:center;align-items:center;padding:.4rem .75rem;font-size:.9375rem;font-weight:600;line-height:1.25rem;display:inline-flex}.df-btn[data-v-e6f23cb2]:hover:not(:disabled),.df-copy[data-v-e6f23cb2]:hover,.df-change[data-v-e6f23cb2]:hover{color:var(--text)}.df-btn[data-v-e6f23cb2]:disabled{cursor:default;opacity:.45}.df-content[data-v-e6f23cb2]{padding:1.25rem}.df-content--drag .df-drop[data-v-e6f23cb2],.df-content--drag .df-grid[data-v-e6f23cb2]{outline:2px solid var(--accent);outline-offset:3px}.df-error[data-v-e6f23cb2]{border:1px solid var(--warn-border);border-radius:var(--radius-input);background:var(--tint-warn);color:var(--warn);margin:0 0 .75rem;padding:.65rem .8rem;font-size:.8125rem}.df-drop[data-v-e6f23cb2]{cursor:pointer;border:2px dashed var(--border-strong);border-radius:var(--radius-card);background:var(--input);text-align:center;touch-action:manipulation;flex-direction:column;justify-content:center;align-items:center;gap:.4rem;min-height:19rem;padding:2rem;display:flex}.df-drop[data-v-e6f23cb2]:hover,.df-drop[data-v-e6f23cb2]:focus-within{border-color:var(--accent);background:var(--tint-accent)}.df-drop-icon[data-v-e6f23cb2]{border-radius:var(--radius-input);background:var(--tint-accent);width:3.25rem;height:3.25rem;color:var(--accent-ink);place-items:center;margin-bottom:.35rem;display:grid}.df-drop strong[data-v-e6f23cb2]{color:var(--text);font-size:1rem}.df-drop>span[data-v-e6f23cb2]:not(.df-drop-icon):not(.df-choose){color:var(--muted);font-size:.8125rem}.df-choose[data-v-e6f23cb2]{border-color:var(--accent);background:var(--accent);min-height:2.75rem;color:var(--accent-fg);margin-top:.75rem;padding-inline:1rem}.df-drop:hover .df-choose[data-v-e6f23cb2]{border-color:var(--accent-hover);background:var(--accent-hover);color:var(--accent-fg)}.df-grid[data-v-e6f23cb2]{border-radius:var(--radius-card);grid-template-columns:minmax(0,1.08fr) minmax(18rem,.92fr);gap:1rem;display:grid}.df-preview-card[data-v-e6f23cb2]{border:1px solid var(--border);border-radius:var(--radius-card);background:var(--input);min-width:0;margin:0;overflow:hidden}.df-preview-wrap[data-v-e6f23cb2]{background-image:repeating-conic-gradient(var(--border) 0% 25%, var(--surface) 0% 50%);background-size:18px 18px;place-items:center;min-height:22rem;padding:1rem;display:grid}.df-preview[data-v-e6f23cb2]{border-radius:var(--radius-input);object-fit:contain;max-width:100%;max-height:24rem;box-shadow:var(--shadow-card);display:block}.df-preview-meta[data-v-e6f23cb2]{border-top:1px solid var(--border);justify-content:space-between;align-items:center;gap:.75rem;min-height:3.5rem;padding:.65rem .75rem;display:flex}.df-filename[data-v-e6f23cb2]{min-width:0;color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:.8125rem;overflow:hidden}.df-change[data-v-e6f23cb2]{touch-action:manipulation;flex:none}.df-result[data-v-e6f23cb2],.df-loading[data-v-e6f23cb2]{border:1px solid var(--border);border-radius:var(--radius-card);background:var(--elevated);min-width:0}.df-result[data-v-e6f23cb2]{flex-direction:column;gap:.9rem;padding:.9rem;display:flex}.df-swatch[data-v-e6f23cb2]{border-radius:calc(var(--radius-card) - 2px);min-height:12rem;box-shadow:inset 0 0 0 1px color-mix(in srgb, currentColor 18%, transparent);flex-direction:column;justify-content:space-between;padding:1rem;display:flex}.df-swatch span[data-v-e6f23cb2]{background:color-mix(in srgb, currentColor 12%, transparent);border-radius:999px;width:fit-content;padding:.3rem .55rem;font-size:.75rem;font-weight:700}.df-swatch strong[data-v-e6f23cb2]{font-variant-numeric:tabular-nums;letter-spacing:-.04em;font-size:clamp(2rem,5vw,3.25rem)}.df-coverage[data-v-e6f23cb2]{border:1px solid var(--border);border-radius:var(--radius-input);background:var(--surface);padding:.7rem}.df-coverage-head[data-v-e6f23cb2]{color:var(--muted);justify-content:space-between;gap:.75rem;font-size:.8125rem;display:flex}.df-coverage-head strong[data-v-e6f23cb2]{color:var(--text);font-variant-numeric:tabular-nums}.df-meter[data-v-e6f23cb2]{background:var(--border);border-radius:999px;height:.4rem;margin-top:.55rem;overflow:hidden}.df-meter span[data-v-e6f23cb2]{border-radius:inherit;background:var(--accent);height:100%;display:block}.df-coverage p[data-v-e6f23cb2]{color:var(--faint);margin:.45rem 0 0;font-size:.75rem}.df-formats[data-v-e6f23cb2]{flex-direction:column;gap:.5rem;display:flex}.df-format[data-v-e6f23cb2]{border:1px solid var(--border);border-radius:var(--radius-input);background:var(--surface);grid-template-columns:2.5rem minmax(0,1fr) auto;align-items:center;gap:.6rem;padding:.5rem .55rem;display:grid}.df-format>span[data-v-e6f23cb2]{color:var(--muted);text-transform:uppercase;font-size:.7rem;font-weight:800}.df-format code[data-v-e6f23cb2]{min-width:0;color:var(--text);text-overflow:ellipsis;white-space:nowrap;font-size:.8125rem;overflow:hidden}.df-copy[data-v-e6f23cb2]{min-height:2rem;padding:.3rem .6rem}.df-loading[data-v-e6f23cb2]{min-height:24rem;color:var(--muted);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:.5rem;display:flex}.df-loading strong[data-v-e6f23cb2]{color:var(--text)}.df-loading span[data-v-e6f23cb2]:last-child{max-width:16rem;font-size:.8125rem}.df-spinner[data-v-e6f23cb2]{border:3px solid var(--border-strong);border-top-color:var(--accent);border-radius:999px;width:2rem;height:2rem;margin-bottom:.4rem;animation:.75s linear infinite df-spin-e6f23cb2}.df-btn[data-v-e6f23cb2]:focus-visible,.df-copy[data-v-e6f23cb2]:focus-visible,.df-drop[data-v-e6f23cb2]:focus-within,.df-change[data-v-e6f23cb2]:focus-within{outline:2px solid var(--accent);outline-offset:2px}@keyframes df-spin-e6f23cb2{to{transform:rotate(360deg)}}@media (width<=760px){.df-toolbar[data-v-e6f23cb2]{flex-wrap:wrap;align-items:center;padding-inline:1rem}.df-summary[data-v-e6f23cb2]{flex-basis:100%;padding-top:0;font-size:.875rem;line-height:1.25rem}.df-actions[data-v-e6f23cb2]{justify-content:flex-end;width:100%}.df-content[data-v-e6f23cb2]{padding:1rem}.df-drop[data-v-e6f23cb2]{min-height:16rem}.df-grid[data-v-e6f23cb2]{grid-template-columns:1fr}.df-preview-wrap[data-v-e6f23cb2]{min-height:15rem}.df-format[data-v-e6f23cb2]{grid-template-columns:2.5rem minmax(0,1fr) auto}}@media (prefers-reduced-motion:reduce){.df-spinner[data-v-e6f23cb2]{animation:none}}