.cwp-grid[data-v-eb8225e9]{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}.compact .cwp-grid[data-v-eb8225e9]{grid-template-columns:160px 1fr;gap:20px}.color-wheel[data-v-eb8225e9]{width:100%;aspect-ratio:1;border-radius:50%;position:relative;cursor:crosshair;background:conic-gradient(from 90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red);box-shadow:inset 0 0 100px #0003}.wheel-gradient[data-v-eb8225e9]{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle,white 0%,transparent 80%);pointer-events:none}.wheel-lines[data-v-eb8225e9]{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.wheel-point[data-v-eb8225e9]{position:absolute;width:16px;height:16px;border-radius:50%;border:2px solid #fff;box-shadow:0 4px 10px #0000004d;cursor:grab;transition:transform .1s ease,border-color .3s ease;pointer-events:auto;z-index:2}.compact .wheel-point[data-v-eb8225e9]{width:12px;height:12px}.mode-grid[data-v-eb8225e9]{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;margin-top:20px}.compact .mode-grid[data-v-eb8225e9]{gap:4px;margin-top:12px}.mode-pill[data-v-eb8225e9]{padding:8px 4px;background:transparent;border:1px solid var(--border);color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.05em;cursor:pointer;transition:all .3s ease}.mode-pill.active[data-v-eb8225e9]{background:var(--accent);border-color:var(--accent);color:var(--bg)}.cwp-header[data-v-eb8225e9]{display:flex;justify-content:flex-end;margin-bottom:12px}.add-btn[data-v-eb8225e9]{width:44px;height:44px;border-radius:50%;border:1px solid var(--accent);background:transparent;color:var(--accent);font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.add-btn[data-v-eb8225e9]:hover{background:var(--accent);color:var(--bg)}.add-btn[data-v-eb8225e9]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.cwp-controls[data-v-eb8225e9]{background:var(--bg);padding:16px;border:1px solid var(--border);margin-bottom:16px}.manual-inputs[data-v-eb8225e9]{display:flex;gap:8px;margin-bottom:16px}.input-group[data-v-eb8225e9]{display:flex;flex-direction:column;gap:4px;flex:1}.input-group label[data-v-eb8225e9]{font-size:9px;color:var(--muted);font-weight:600}.input-group input[data-v-eb8225e9]{background:var(--surface);border:1px solid var(--border);color:var(--txt);padding:6px;font-size:11px;width:100%;outline:none}.input-group input[data-v-eb8225e9]:focus-visible{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.lightness-group[data-v-eb8225e9]{display:flex;flex-direction:column;gap:8px}.label-row[data-v-eb8225e9]{display:flex;justify-content:space-between;font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}.l-slider[data-v-eb8225e9]{width:100%;appearance:none;height:6px;border-radius:3px;outline:none}.l-slider[data-v-eb8225e9]:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:3px}.l-slider[data-v-eb8225e9]::-webkit-slider-thumb{appearance:none;width:14px;height:14px;background:#fff;border:2px solid var(--accent);border-radius:50%;cursor:pointer}.color-strips[data-v-eb8225e9]{display:flex;height:120px;gap:3px;border-radius:4px;overflow:hidden;background:var(--border)}.strips-compact[data-v-eb8225e9]{height:64px}.color-strip[data-v-eb8225e9]{flex:1;cursor:pointer;display:flex;align-items:flex-end;padding:8px;transition:all .5s cubic-bezier(.2,1,.3,1);position:relative}.color-strip.active[data-v-eb8225e9]{flex:1.5;box-shadow:inset 0 0 0 3px #fff}.remove-color[data-v-eb8225e9]{position:absolute;top:6px;right:6px;background:#0003;color:#fff;border:none;width:28px;height:28px;border-radius:50%;font-size:9px;cursor:pointer;opacity:0;transition:opacity .3s ease;display:flex;align-items:center;justify-content:center;padding:0}.remove-color[data-v-eb8225e9]:focus-visible{opacity:1;outline:2px solid #fff;outline-offset:1px}.color-strip:hover .remove-color[data-v-eb8225e9]{opacity:1}.hex-code[data-v-eb8225e9]{font-family:var(--font-sans);font-size:10px;font-weight:600}@media (max-width: 768px){.cwp-grid[data-v-eb8225e9]{grid-template-columns:1fr;gap:20px}.cwp-wheel-col[data-v-eb8225e9]{max-width:240px;margin:0 auto}.compact .cwp-grid[data-v-eb8225e9]{grid-template-columns:1fr}.compact .cwp-wheel-col[data-v-eb8225e9]{max-width:180px}}