.cm[data-v-7af6a545]{flex-direction:column;display:flex}.cm-toolbar[data-v-7af6a545],.cm-ratio[data-v-7af6a545],.cm-result[data-v-7af6a545]{padding:1.25rem}.cm-toolbar[data-v-7af6a545]{border-bottom:1px solid var(--border);background:var(--elevated);justify-content:space-between;align-items:center;gap:1rem;display:flex}.cm-intro[data-v-7af6a545]{max-width:38rem;color:var(--muted);margin:0;font-size:14px;line-height:22px}.cm-actions[data-v-7af6a545]{flex:none;gap:.5rem;display:flex}.cm-btn[data-v-7af6a545],.cm-swap[data-v-7af6a545],.cm-copy[data-v-7af6a545]{border:1px solid var(--border-strong);background:var(--surface);min-height:2.75rem;color:var(--text);font:inherit;cursor:pointer;touch-action:manipulation;border-radius:.625rem;font-size:15px;font-weight:600;line-height:20px}.cm-btn[data-v-7af6a545]{padding:.55rem .85rem}.cm-btn[data-v-7af6a545]:hover:not(:disabled),.cm-swap[data-v-7af6a545]:hover:not(:disabled),.cm-copy[data-v-7af6a545]:hover:not(:disabled){border-color:var(--accent);color:var(--accent-ink)}.cm-btn[data-v-7af6a545]:focus-visible,.cm-swap[data-v-7af6a545]:focus-visible,.cm-copy[data-v-7af6a545]:focus-visible,.cm-color-well[data-v-7af6a545]:focus-visible,.cm-hex-input[data-v-7af6a545]:focus-visible,.cm-range[data-v-7af6a545]:focus-visible{box-shadow:0 0 0 3px var(--tint-accent), 0 0 0 2px var(--accent);outline:none}.cm-btn[data-v-7af6a545]:disabled,.cm-swap[data-v-7af6a545]:disabled{opacity:.45;cursor:default}.cm-inputs[data-v-7af6a545]{border-bottom:1px solid var(--border);grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:.75rem;padding:1.25rem;display:grid}.cm-color-card[data-v-7af6a545]{border:1px solid var(--border);background:var(--elevated);border-radius:.75rem;min-width:0;padding:1rem}.cm-label[data-v-7af6a545]{color:var(--text);font-size:14px;font-weight:500;line-height:20px;display:block}.cm-color-row[data-v-7af6a545]{grid-template-columns:3rem minmax(0,1fr);gap:.65rem;margin-top:.55rem;display:grid}.cm-color-well[data-v-7af6a545]{border:1px solid var(--border-strong);cursor:pointer;touch-action:manipulation;background:0 0;border-radius:.625rem;width:3rem;height:2.75rem;padding:.125rem}.cm-hex-input[data-v-7af6a545]{box-sizing:border-box;border:1px solid var(--border-strong);background:var(--input);width:100%;min-height:2.75rem;color:var(--text);font:14px/20px var(--font-mono,monospace);text-transform:lowercase;border-radius:.625rem;padding:.6rem .75rem}.cm-hex-input.is-invalid[data-v-7af6a545]{border-color:var(--badge-fail)}.cm-error[data-v-7af6a545]{color:var(--badge-fail);margin:.5rem 0 0;font-size:13px;line-height:18px}.cm-swap[data-v-7af6a545]{width:2.75rem;padding:0;font-size:1.25rem}.cm-ratio[data-v-7af6a545]{border-bottom:1px solid var(--border);background:var(--surface)}.cm-ratio-head[data-v-7af6a545],.cm-result-head[data-v-7af6a545]{justify-content:space-between;align-items:center;gap:.75rem;display:flex}.cm-ratio-value[data-v-7af6a545],.cm-method[data-v-7af6a545]{color:var(--muted);font-size:13px;line-height:18px}.cm-range[data-v-7af6a545]{--mix-percent:50%;appearance:none;cursor:pointer;touch-action:manipulation;background:0 0;width:100%;min-height:2.75rem;margin:.35rem 0 0}.cm-range[data-v-7af6a545]::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--accent) 0 var(--mix-percent), var(--border-strong) var(--mix-percent) 100%);border-radius:999px;height:6px}.cm-range[data-v-7af6a545]::-webkit-slider-thumb{appearance:none;border:3px solid var(--surface);background:var(--accent);width:18px;height:18px;box-shadow:var(--shadow-card);border-radius:999px;margin-top:-6px}.cm-range[data-v-7af6a545]::-moz-range-track{background:var(--border-strong);border-radius:999px;height:6px}.cm-range[data-v-7af6a545]::-moz-range-progress{background:var(--accent);border-radius:999px;height:6px}.cm-range[data-v-7af6a545]::-moz-range-thumb{border:3px solid var(--surface);background:var(--accent);width:12px;height:12px;box-shadow:var(--shadow-card);border-radius:999px}.cm-range-labels[data-v-7af6a545]{color:var(--faint);justify-content:space-between;margin-top:-.35rem;font-size:13px;line-height:18px;display:flex}.cm-result[data-v-7af6a545]{background:var(--elevated)}.cm-result-grid[data-v-7af6a545]{grid-template-columns:minmax(12rem,.8fr) minmax(0,1.45fr);gap:1rem;margin-top:.75rem;display:grid}.cm-swatch[data-v-7af6a545]{border:1px solid var(--border-strong);min-height:13rem;box-shadow:var(--shadow-card);border-radius:.875rem;flex-direction:column;justify-content:center;align-items:center;gap:.4rem;display:flex}.cm-swatch-code[data-v-7af6a545]{font:700 24px/30px var(--font-mono,monospace);text-transform:uppercase}.cm-swatch-ratio[data-v-7af6a545]{opacity:.8;font-size:13px;line-height:18px}.cm-outputs[data-v-7af6a545]{flex-direction:column;gap:.5rem;display:flex}.cm-output-row[data-v-7af6a545]{border:1px solid var(--border);background:var(--surface);border-radius:.625rem;grid-template-columns:2.5rem minmax(0,1fr) auto;align-items:center;gap:.65rem;min-height:2.85rem;padding:.35rem .4rem .35rem .75rem;display:grid}.cm-output-label[data-v-7af6a545]{color:var(--faint);letter-spacing:.04em;text-transform:uppercase;font-size:13px;font-weight:700;line-height:16px}.cm-output-row code[data-v-7af6a545]{overflow-wrap:anywhere;min-width:0;color:var(--text);font-size:14px;line-height:22px}.cm-copy[data-v-7af6a545]{min-width:4.75rem;padding:.45rem .65rem}.cm-empty[data-v-7af6a545]{border:1px dashed var(--border-strong);min-height:10rem;color:var(--muted);text-align:center;border-radius:.75rem;place-items:center;margin-top:.75rem;padding:1rem;display:grid}@media (width<=640px){.cm-toolbar[data-v-7af6a545]{flex-direction:column;align-items:flex-start}.cm-actions[data-v-7af6a545]{width:100%}.cm-btn[data-v-7af6a545]{flex:1}.cm-inputs[data-v-7af6a545]{grid-template-columns:1fr}.cm-swap[data-v-7af6a545]{justify-self:center;transform:rotate(90deg)}.cm-ratio-head[data-v-7af6a545],.cm-result-head[data-v-7af6a545]{flex-direction:column;align-items:flex-start;gap:.25rem}.cm-result-grid[data-v-7af6a545]{grid-template-columns:1fr}.cm-swatch[data-v-7af6a545]{min-height:10rem}.cm-output-row[data-v-7af6a545]{grid-template-columns:2.35rem minmax(0,1fr) auto}.cm-copy[data-v-7af6a545]{grid-column:auto;width:auto;min-width:4.75rem}}