.chsv{display:flex;flex-direction:column;gap:10px;border:2px solid var(--border-strong);border-radius:var(--r-md);background:var(--white);padding:10px}.chsv-sv{position:relative;width:100%;height:150px;border-radius:var(--r-sm);border:1.5px solid var(--border);cursor:crosshair;touch-action:none;overflow:hidden}.chsv-svthumb{position:absolute;width:18px;height:18px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1.5px rgba(0,0,0,.45),0 1px 4px rgba(0,0,0,.4);transform:translate(-50%,-50%);pointer-events:none}.chsv-row{display:flex;align-items:center;gap:9px}.chsv-chip{width:30px;height:30px;flex:none;border-radius:var(--r-sm);border:2px solid var(--border-strong)}.chsv-hue{flex:1;height:22px;margin:0;appearance:none;-webkit-appearance:none;border-radius:var(--r-pill);background:linear-gradient(90deg,#ff0000 0,#ffff00 17%,#00ff00 33%,#00ffff 50%,#0000ff 67%,#ff00ff 83%,#ff0000);border:1.5px solid var(--border);cursor:pointer}.chsv-hue::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:#fff;border:2px solid var(--ink);box-shadow:0 1px 4px rgba(0,0,0,.35);cursor:pointer}.chsv-hue::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#fff;border:2px solid var(--ink);box-shadow:0 1px 4px rgba(0,0,0,.35);cursor:pointer}.chsv-hash{font-family:var(--font-head);font-weight:700;color:var(--gray-500);font-size:15px}.chsv-hex{flex:1;min-width:0;height:40px;border:2px solid var(--border-strong);border-radius:var(--r-sm);padding:0 12px;font-family:var(--font-mono,ui-monospace,monospace);font-size:15px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink);background:var(--off-white)}.chsv-hex:focus{outline:none;border-color:var(--orange)}.chsv-eye{width:40px;height:40px;flex:none;border:2px solid var(--border-strong);border-radius:var(--r-sm);background:var(--white);color:var(--ink);font-size:18px;cursor:pointer;display:grid;place-items:center}.chsv-eye:active{background:var(--chip-neutro);border-color:var(--orange-deep)}