:root {
  /* STYLE GUIDE REQUIREMENTS FOR MINI PROJECTS (from isosceles-triangle-explorer):
    - Main background color: #f9f9f9
    - Input boxes: background #fff, border-radius: 8px, box-shadow: 0 2px 8px rgba(0,0,0,0.07), border: 1px solid #ccc, font-size: 1.1rem, padding: 0.5em
    - Figure areas (SVG, Canvas, etc.): background #fff, border-radius: 8px, box-shadow: 0 2px 8px rgba(0,0,0,0.07), border: 2px solid #ccc, padding: 1rem
    - Use 'Segoe UI', 'Arial', sans-serif for all text
    - Use the color palette below for fills and accents
  */
}
:root {
  --primary-blue: #2a6edb;
  --primary-green: #3bb273;
  --primary-yellow: #ffe066;
  --primary-red: #e94f37;
  --background-light: #f9f9f9;
  --background-dark: #222;
  --text-main: #222;
  --text-light: #fff;
  --accent: #ffb700;
}

body {
  background: var(--background-light);
  color: var(--text-main);
}

a {
  color: var(--primary-blue);
}

.project-table th {
  background: var(--primary-blue);
  color: var(--text-light);
}

.project-table td {
  background: var(--background-light);
    - All generated figures must use a line thickness of 3px for outlines (SVG stroke-width or Canvas lineWidth).
    - All displayed angle values in generated figures must use normal font weight (not bold).
}

button, .btn {
  background: var(--primary-green);
  color: var(--text-light);
}