:root {
  --color-ull-primary: #51247A;
  --color-trapezoid-fill: rgba(81, 36, 122, 0.2);
  --color-trapezoid-border: #51247A;
  --color-curve1: #D93B48; /* Rojo para f(x) */
  --color-curve2: #4CAF50; /* Verde para g(x) */
  --color-axes: #333333;
  --color-grid: #f0f0f0; /* Color mucho más claro para que resalte menos */
}

.has-background-ull {
  background-color: var(--color-ull-primary) !important;
}

.canvas-container {
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  background-color: #fafafa;
  border: 1px solid #ddd;
}

canvas {
  max-width: 100%;
  height: auto;
}