/* Scientific RGB channel data colors; chrome continues to use instrument tokens. */
#dk-grade-panel { --pt-grade-r: #dc4646; --pt-grade-g: #28a564; --pt-grade-b: #3c7df0; }
.dk-grade-wheels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.dk-grade-wheel { min-width: 0; border: 1px solid var(--pt-border); padding: 8px; }
.dk-grade-puck { position: relative; width: 96px; height: 96px; margin: 8px auto; border: 1px solid var(--pt-border-strong); border-radius: 50%; background: var(--pt-surface); touch-action: none; cursor: crosshair; }
.dk-grade-puck:focus-visible { outline: 2px solid var(--pt-accent); }
.dk-grade-dot { position: absolute; width: 10px; height: 10px; border-radius: 50%; background: var(--pt-accent); transform: translate(-50%, -50%); pointer-events: none; }
#dk-grade-panel canvas { width: 100%; max-width: 256px; display: block; border: 1px solid var(--pt-border-strong); touch-action: none; }
#dk-grade-panel output { float: right; font-variant-numeric: tabular-nums; }