.scatter-canvas{background:var(--paper);margin-top:12px;overflow-x:auto}.scatter-canvas svg{width:100%;min-width:680px;height:auto;display:block}#achievement-chart{cursor:grab;touch-action:pan-y;-webkit-user-select:none;user-select:none}#achievement-chart:active{cursor:grabbing}#achievement-chart:focus{outline:none}#achievement-chart:focus-visible{outline:1px solid var(--faint)}.scatter-stem{stroke:var(--chart-grid);stroke-width:1px;opacity:var(--stem-opacity,1)}.scatter-grid line{stroke:var(--chart-grid);stroke-width:1px;stroke-dasharray:3 4}.scatter-axis{stroke:var(--chart-axis);stroke-width:1.4px}.scatter-ticks text,.scatter-axis-title{fill:var(--muted);font-family:var(--mono);font-size:var(--chart-label-size)}.scatter-points circle{fill:color-mix(in srgb, var(--chart-highlight) var(--level,0%), var(--chart-primary));stroke:var(--paper);stroke-width:1.5px;cursor:pointer;transition:r .12s,fill .12s}.scatter-points circle.is-active{stroke:var(--chart-primary);stroke-width:3px}.scatter-points circle:focus{outline:none}.scatter-points circle:focus-visible{stroke:var(--chart-primary);stroke-width:3px}.scatter-plot{position:relative}.scatter-tooltip{z-index:1;border:1px solid var(--line);background:var(--paper);width:max-content;max-width:min(300px,100% - 16px);color:var(--ink);font-size:var(--meta-size);pointer-events:none;border-radius:4px;gap:4px;padding:12px 14px;line-height:1.5;display:grid;position:absolute}.scatter-tooltip[hidden]{display:none}.scatter-tooltip>:first-child,.scatter-tooltip__measures{color:var(--muted);font-family:var(--mono)}.scatter-tooltip__note{color:var(--muted);line-height:1.6}.scatter-tooltip strong{font-size:var(--text-size)}