.parameter-control-color-picker{z-index:48;border:1px solid var(--app-border-soft);background:var(--app-surface-panel);border-radius:10px;gap:9px;width:240px;padding:10px;display:grid;position:absolute;top:0;left:auto;right:calc(100% + 10px);box-shadow:0 9px 20px #1c19171f}.parameter-control-color-picker.is-floating{visibility:hidden;z-index:100;max-height:calc(100vh - 24px);position:fixed;top:0;left:0;right:auto;overflow:hidden auto}.parameter-control-color-picker.is-floating.is-positioned{visibility:visible}.parameter-control-color-picker>header{cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;gap:8px;min-height:20px;display:flex}.parameter-control-color-picker>header[data-dragging=true]{cursor:grabbing}.parameter-control-color-picker>header>span{color:var(--app-text-primary);font-size:11px;font-weight:600}.parameter-control-color-picker>header button{cursor:pointer;width:20px;height:20px;color:var(--app-text-muted);background:0 0;border:0;border-radius:4px;place-items:center;padding:0;display:grid}.parameter-control-color-picker>header button:hover{background:var(--app-surface-input-hover);color:var(--app-text-primary)}.parameter-control-color-picker>header button svg{width:14px;height:14px}.parameter-control-color-modes{border-bottom:1px solid var(--app-border-soft);grid-template-columns:repeat(4,24px);gap:3px;padding-bottom:8px;display:grid}.parameter-control-color-modes>span{display:inline-grid}.parameter-control-color-picker .parameter-control-color-modes button{width:24px;height:24px;color:var(--app-text-muted);background:0 0;border:1px solid #0000;border-radius:4px;place-items:center;padding:0;display:grid}.parameter-control-color-picker .parameter-control-color-modes button[aria-pressed=true]{border-color:var(--app-border-neutral);background:var(--app-surface-input-hover);color:var(--app-text-primary)}.parameter-control-color-picker .parameter-control-color-modes button:disabled{opacity:.52}.parameter-control-color-modes svg{width:14px;height:14px}.parameter-control-color-spectrum{background:linear-gradient(to top, #000, transparent), linear-gradient(to right, #fff, hsl(var(--canvas-parameter-color-hue) 100% 50%));cursor:crosshair;touch-action:none;border-radius:5px;height:142px;position:relative}.parameter-control-color-spectrum>span{pointer-events:none;border:2px solid #fff;border-radius:50%;width:13px;height:13px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #0000002e}.parameter-control-color-spectrum:focus-visible{outline:1px solid var(--accent-strong);outline-offset:2px}.parameter-control-color-picker-adjustments{grid-template:"eyedropper hue"12px"eyedropper opacity"12px/24px minmax(0,1fr);align-items:center;gap:7px 6px;min-height:31px;display:grid}.parameter-control-color-picker .parameter-control-color-eyedropper{width:24px;height:22px;color:var(--app-text-secondary);background:0 0;border:0;border-radius:4px;grid-area:eyedropper;align-self:center;place-items:center;padding:0;display:grid}.parameter-control-color-picker .parameter-control-color-eyedropper:hover:not(:disabled){background:var(--app-surface-input-hover);color:var(--app-text-primary)}.parameter-control-color-picker .parameter-control-color-eyedropper:disabled{opacity:.36}.parameter-control-color-eyedropper svg{width:14px;height:14px}.parameter-control-color-picker .parameter-control-color-picker-adjustments>input{appearance:none;box-sizing:border-box;border:0;border-radius:999px;width:100%;height:12px;min-height:0;max-height:12px;margin:0;padding:0;line-height:0;display:block}.parameter-control-color-picker .parameter-control-color-hue{background:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red);grid-area:hue}.parameter-control-color-picker .parameter-control-color-opacity-range{background:linear-gradient(to right, transparent, var(--canvas-parameter-color-swatch)), repeating-conic-gradient(#d8d8d8 0 25%, #fff 0 50%) 0 / 8px 8px;grid-area:opacity}.parameter-control-color-picker .parameter-control-color-picker-adjustments>input::-webkit-slider-thumb{appearance:none;box-sizing:border-box;background:0 0;border:2px solid #fff;border-radius:50%;width:12px;height:12px;box-shadow:0 0 0 1px #0000002e}.parameter-control-color-picker .parameter-control-color-picker-adjustments>input::-moz-range-thumb{box-sizing:border-box;background:0 0;border:2px solid #fff;border-radius:50%;width:12px;height:12px;box-shadow:0 0 0 1px #0000002e}.parameter-control-color-palette{grid-template-columns:repeat(8,20px);gap:6px;display:grid}.parameter-control-color-picker .parameter-control-color-palette button{background:0 0;border:1px solid #0000;border-radius:4px;place-items:center;width:20px;height:20px;padding:2px;display:grid}.parameter-control-color-palette button>span{border:1px solid color-mix(in srgb, var(--app-text-primary) 16%, transparent);background:var(--canvas-parameter-color-swatch);border-radius:3px;width:14px;height:14px}.parameter-control-color-picker .parameter-control-color-palette button:hover{background:var(--app-surface-input-hover)}.parameter-control-color-picker .parameter-control-color-palette button.is-selected{border-color:var(--accent-strong)}.parameter-control-color-hex{align-items:center;gap:8px;padding:0 10px 10px;display:flex}.parameter-control-color-hex>input{border:1px solid var(--app-border-soft);background:var(--app-surface-input);min-width:0;height:30px;color:var(--app-text-primary);letter-spacing:.02em;text-transform:uppercase;border-radius:6px;outline:none;flex:auto;padding:0 8px;font-size:13px}.parameter-control-color-hex>input:focus{border-color:var(--accent-strong)}