.spl{--fill-slab:var(--muted);--fill-on:var(--foreground);--ink:var(--foreground);--ink-2:var(--foreground);flex-direction:column;align-items:center;gap:16px;font-family:inherit;display:flex;position:relative}.spl-row{align-items:center;gap:8px;display:flex}.spl-slab{background:var(--fill-slab,var(--card));justify-content:center;align-items:center;display:flex}[data-stroke=on] .spl-slab{box-shadow:0 0 0 1px var(--pane-edge)}.spl-track{flex:none;position:relative}.spl-dot{background:color-mix(in srgb, var(--fill-on,var(--ink)) 16%, var(--fill-slab,var(--card)));cursor:pointer;border:0;border-radius:999px;height:100%;padding:0;position:absolute;top:0;left:0}.spl-dot:after{content:"";position:absolute;inset:-12px -4px}.spl-dot:focus-visible{box-shadow:0 0 0 2px var(--fill-slab,var(--card)), 0 0 0 4px rgba(var(--fill-on-rgb,var(--ink-rgb)), .45);outline:none}.spl-ink{background:var(--fill-on,var(--ink));border-radius:999px;height:100%;position:absolute;top:0;left:0}.spl-tool{flex:none;transition:scale .16s cubic-bezier(.22,1,.36,1)}.spl-tool:has(.spl-go:active){scale:.96}.spl-go{border-radius:inherit;width:100%;height:100%;color:var(--fill-on,var(--ink-2));cursor:pointer;background:0 0;border:0;place-items:center;padding:0;transition:color .16s;display:grid}.spl-go:hover{color:color-mix(in srgb, var(--fill-on,var(--ink-2)) 55%, var(--fill-slab,var(--card)))}.spl-go:focus-visible{box-shadow:0 0 0 2px var(--fill-slab,var(--card)), 0 0 0 4px rgba(var(--fill-on-rgb,var(--ink-rgb)), .45);outline:none}