/* cg-bars.css (26 Oct 2026, Hugues: "as on dialed.gg"): the three bars on the left edge of a game card, a white handle on each */
.cgb{position:absolute;left:0;top:0;bottom:0;z-index:3;display:flex;width:var(--cgb-w,96px)}
.cgb-bar{position:relative;flex:1;cursor:ns-resize;touch-action:none;outline:none}
.cgb-h{background:linear-gradient(#f00 0%,#ff0 16.66%,#0f0 33.33%,#0ff 50%,#00f 66.66%,#f0f 83.33%,#f00 100%)}
.cgb-s{background:linear-gradient(var(--cgb-sat-top,#c33),var(--cgb-sat-bot,#888))}
.cgb-v{background:linear-gradient(var(--cgb-val-top,#f66),#000)}
.cgb-knob{position:absolute;left:50%;top:0;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;background:#fff;
  box-shadow:0 2px 8px rgba(0,0,0,.35),0 0 0 1px rgba(0,0,0,.06);pointer-events:none;transition:transform .15s cubic-bezier(.23,1,.32,1)}
.cgb-bar.is-grabbed .cgb-knob{transform:scale(1.25)}
.cgb-bar:focus-visible .cgb-knob{box-shadow:0 0 0 3px #141416,0 0 0 5px #fff}
.cgb.is-locked .cgb-bar{cursor:default}
@media (max-width:560px){.cgb{width:var(--cgb-w-m,78px)}.cgb-knob{width:20px;height:20px;margin:-10px 0 0 -10px}}
@media (prefers-reduced-motion:reduce){.cgb-knob{transition:none}}