// Orange Tabby Cat and Golden Doodle Dog
// A friendly feline and canine duo hanging out together!

// Drawing the background
ctx.fillStyle = "#F5F5F5"; // Setting the background color to light gray
ctx.fillRect(0, 0, 512, 512); // Filling the canvas with the background color

// Drawing the cat
ctx.fillStyle = "#FFA500"; // Setting the cat's color to orange
ctx.fillRect(200, 200, 200, 200); // Drawing the cat's body

// Drawing the cat's head
ctx.beginPath(); // Starting the path for the cat's head
ctx.arc(300, 150, 100, 0, Math.PI * 2); // Drawing a circle for the cat's head
ctx.fill(); // Filling the cat's head with orange color

// Drawing the cat's ears
ctx.beginPath(); // Starting the path for the cat's ears
ctx.moveTo(250, 100); // Moving to the left ear starting point
ctx.lineTo(300, 50); // Drawing the left ear
ctx.lineTo(350, 100); // Drawing the right ear
ctx.closePath(); // Closing the path for the cat's ears
ctx.fill(); // Filling the cat's ears with orange color

// Drawing the cat's eyes
ctx.fillStyle = "#FFFFFF"; // Setting the eye color to white
ctx.beginPath(); // Starting the path for the cat's eyes
ctx.arc(280, 140, 20, 0, Math.PI * 2); // Drawing the left eye
ctx.arc(320, 140, 20, 0, Math.PI * 2); // Drawing the right eye
ctx.fill(); // Filling the cat's eyes with white color

// Drawing the cat's nose
ctx.fillStyle = "#FFFFFF"; // Setting the nose color to white
ctx.beginPath(); // Starting the path for the cat's nose
ctx.arc(300, 170, 10, 0, Math.PI * 2); // Drawing the cat's nose
ctx.fill(); // Filling the cat's nose with white color

// Drawing the cat's mouth
ctx.strokeStyle = "#000000"; // Setting the mouth color to black
ctx.lineWidth = 2; // Setting the line width for the mouth
ctx.beginPath(); // Starting the path for the cat's mouth
ctx.moveTo(280, 190); // Moving to the left corner of the mouth
ctx.lineTo(320, 190); // Drawing the line for the mouth
ctx.stroke(); // Drawing the cat's mouth

// Drawing the cat's whiskers
ctx.strokeStyle = "#000000"; // Setting the whiskers color to black
ctx.lineWidth = 1; // Setting the line width for the whiskers
ctx.beginPath(); // Starting the path for the cat's whiskers
ctx.moveTo(260, 160); // Moving to the left whisker starting point
ctx.lineTo(220, 160); // Drawing the left whisker
ctx.moveTo(340, 160); // Moving to the right whisker starting point
ctx.lineTo(380, 160); // Drawing the right whisker
ctx.moveTo(260, 180); // Moving to the bottom left whisker starting point
ctx.lineTo(220, 200); // Drawing the bottom left whisker
ctx.moveTo(340, 180); // Moving to the bottom right whisker starting point
ctx.lineTo(380, 200); // Drawing the bottom right whisker
ctx.stroke(); // Drawing the cat's whiskers

// Drawing the white spot on the cat's nose
ctx.fillStyle = "#FFFFFF"; // Setting the spot color to white
ctx.beginPath(); // Starting the path for the spot
ctx.arc(300, 170, 5, 0, Math.PI * 2); // Drawing the spot on the cat's nose
ctx.fill(); // Filling the spot with white color

// Drawing the dog
ctx.fillStyle = "#FFD700"; // Setting the dog's color to golden
ctx.beginPath(); // Starting the path for the dog's body
ctx.moveTo(450, 400); // Moving to the starting point for the dog's body
ctx.lineTo(400, 350); // Drawing the dog's body
ctx.lineTo(350, 400); // Drawing the dog's body
ctx.lineTo(400, 450); // Drawing the dog's body
ctx.closePath(); // Closing the path for the dog's body
ctx.fill(); // Filling the dog's body with golden color

// Drawing the dog's head
ctx.beginPath(); // Starting the path for the dog's head
ctx.arc(450, 300, 50, 0, Math.PI * 2); // Drawing a circle for the dog's head
ctx.fill(); // Filling the dog's head with golden color

// Drawing the dog's ears
ctx.beginPath(); // Starting the path for the dog's ears
ctx.moveTo(410, 280); // Moving to the left ear starting point
ctx.lineTo(380, 250); // Drawing the left ear
ctx.lineTo(430, 250); // Drawing the right ear
ctx.closePath(); // Closing the path for the dog's ears
ctx.fill(); // Filling the dog's ears with golden color

// Drawing the dog's eyes
ctx.fillStyle = "#FFFFFF"; // Setting the eye color to white
ctx.beginPath(); // Starting the path for the dog's eyes
ctx.arc(440, 290, 10, 0, Math.PI * 2); // Drawing the left eye
ctx.arc(460, 290, 10, 0, Math.PI * 2); // Drawing the right eye
ctx.fill(); // Filling the dog's eyes with white color

// Drawing the dog's nose
ctx.fillStyle = "#000000"; // Setting the nose color to black
ctx.beginPath(); // Starting the path for the dog's nose
ctx.arc(450, 310, 5, 0, Math.PI * 2); // Drawing the dog's nose
ctx.fill(); // Filling the dog's nose with black color

// Drawing the dog's mouth
ctx.strokeStyle = "#000000"; // Setting the mouth color to black
ctx.lineWidth = 2; // Setting the line width for the mouth
ctx.beginPath(); // Starting the path for the dog's mouth
ctx.moveTo(440, 320); // Moving to the left corner of the mouth
ctx.lineTo(460, 320); // Drawing the line for the mouth
ctx.stroke(); // Drawing the dog's mouth

// Drawing the dog's tail
ctx.strokeStyle = "#000000"; // Setting the tail color to black
ctx.lineWidth = 3; // Setting the line width for the tail
ctx.beginPath(); // Starting the path for the dog's tail
ctx.moveTo(350, 430); // Moving to the starting point of the tail
ctx.lineTo(320, 400); // Drawing the tail
ctx.lineTo(350, 370); // Drawing the tail
ctx.stroke(); // Drawing the dog's tail

// Drawing the dog's paws
ctx.fillStyle = "#000000"; // Setting the paw color to black
ctx.beginPath(); // Starting the path for the dog's paws
ctx.arc(400, 400, 10, 0, Math.PI * 2); // Drawing the left paw
ctx.arc(400, 450, 10, 0, Math.PI * 2); // Drawing the right paw
ctx.fill(); // Filling the dog's paws with black color

// Drawing the cat and dog together, enjoying each other's company
ctx.font = "24px Arial"; // Setting the font for the text
ctx.fillStyle = "#000000"; // Setting the text color to black
ctx.fillText("Best Friends Forever!", 200, 50); // Drawing the text

// A purr-fect pair of companions!
// Meow and woof in harmony!