/* Colour picker (ylux-colorpicker.js) — light palette pinned, like the date picker */
.ylux-cp-pop{--text:#0A0A0A;--text-m:#6E5F52;--border:rgba(10,10,10,.08);--cap:#C4B5A8;--cap-d:#A89880;
  position:absolute;z-index:9300;width:248px;box-sizing:border-box;padding:14px;background:#FFFFFF;color:var(--text);
  border:1px solid var(--border);border-radius:14px;box-shadow:0 12px 32px rgba(10,10,10,.14),0 2px 8px rgba(10,10,10,.06);
  font-family:var(--ylux-font-ui,'Sofia Sans Semi Condensed'),system-ui,sans-serif;display:flex;flex-direction:column;gap:10px;animation:yluxSelIn .12s ease}
.ylux-cp-sv{position:relative;height:150px;border-radius:10px;cursor:crosshair;touch-action:none;outline:none;
  background-image:linear-gradient(to top,#000,rgba(0,0,0,0)),linear-gradient(to right,#fff,rgba(255,255,255,0))}
.ylux-cp-sv:focus-visible{box-shadow:0 0 0 2px var(--cap)}
.ylux-cp-knob{position:absolute;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;border:2px solid #FFFFFF;box-shadow:0 0 0 1px rgba(10,10,10,.35);pointer-events:none}
.ylux-cp-hue{-webkit-appearance:none;appearance:none;width:100%;height:12px;margin:0;border-radius:999px;cursor:pointer;
  background:linear-gradient(to right,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00)}
.ylux-cp-hue::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:#FFFFFF;border:1px solid rgba(10,10,10,.3);box-shadow:0 1px 3px rgba(10,10,10,.2)}
.ylux-cp-hue::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#FFFFFF;border:1px solid rgba(10,10,10,.3)}
.ylux-cp-row{display:flex;align-items:center;gap:10px}
.ylux-cp-now{width:34px;height:34px;flex:none;border-radius:10px;border:1px solid var(--border)}
.ylux-cp-hexl{flex:1;display:flex;align-items:center;gap:8px;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-m)}
.ylux-cp-hex{flex:1;min-width:0;border:1px solid var(--border);border-radius:10px;padding:8px 10px;font:inherit;font-size:13px;letter-spacing:0;text-transform:none;color:var(--text);font-variant-numeric:tabular-nums}
.ylux-cp-hex:focus{outline:none;border-color:var(--cap-d);box-shadow:0 0 0 3px rgba(196,181,168,.25)}
.ylux-cp-lbl{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-m)}
.ylux-cp-sws{display:grid;grid-template-columns:repeat(8,1fr);gap:6px}
.ylux-cp-sw{aspect-ratio:1/1;border-radius:50%;border:1px solid rgba(10,10,10,.12);cursor:pointer;padding:0}
.ylux-cp-sw:focus-visible{outline:2px solid var(--cap);outline-offset:2px}
.ylux-cp-ft{display:flex;justify-content:flex-end;border-top:.5px solid var(--border);padding-top:10px}
.ylux-cp-done{border:0;border-radius:999px;background:var(--cap);color:#0A0A0A;padding:8px 16px;font:inherit;font-size:11px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
.ylux-cp-done:hover{background:var(--cap-d)}
/* the closed colour field: a round swatch, no system chrome */
input[type=color]{-webkit-appearance:none;appearance:none;width:36px;height:36px;padding:3px;border:1px solid rgba(10,10,10,.14);border-radius:999px;background:#FFFFFF;cursor:pointer}
input[type=color]::-webkit-color-swatch-wrapper{padding:0}
input[type=color]::-webkit-color-swatch{border:0;border-radius:999px}
input[type=color]::-moz-color-swatch{border:0;border-radius:999px}
@keyframes yluxSelIn{from{opacity:0;transform:translateY(-4px)}}
