.reasoning-question-visual {
  margin: 14px 0 18px;
  padding: 12px;
  border: 1px solid rgba(24, 59, 86, 0.16);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(255, 240, 232, 0.78));
}

.reasoning-question-visual figcaption {
  margin-top: 8px;
  color: #526779;
  font-size: 0.86rem;
  line-height: 1.5;
  text-align: center;
}

.reasoning-question-visual__fallback {
  margin: 12px 0;
  padding: 10px 12px;
  border-radius: 12px;
  background: #fff7ed;
  color: #8a3d13;
}

.geometry-svg {
  display: block;
  width: min(100%, 520px);
  height: auto;
  margin: 0 auto;
}

.geometry-svg__paper { fill: #fffdf9; stroke: #d8e1e8; }
.geometry-svg__shape { fill: rgba(233, 107, 60, 0.10); stroke: #183b56; stroke-width: 3; stroke-linejoin: round; }
.geometry-svg__shape.is-muted { fill: rgba(82, 103, 121, 0.05); stroke: #7c8c98; }
.geometry-svg__segment { stroke: #46708f; stroke-width: 2; }
.geometry-svg__segment.is-dashed { stroke-dasharray: 7 6; }
.geometry-svg__curve { fill: none; stroke: #183b56; stroke-width: 3; }
.geometry-svg__overlay { fill: rgba(70, 112, 143, 0.06); stroke: #46708f; stroke-width: 2.5; }
.geometry-svg__highlight { fill: rgba(233, 107, 60, 0.30); stroke: #c94d20; stroke-width: 3; }
.geometry-svg__vertex { fill: #183b56; }
.geometry-svg__label { fill: #183b56; font: 700 14px Georgia, serif; }
.geometry-svg__measure { fill: #b74118; font: 700 13px Georgia, serif; paint-order: stroke; stroke: #fffdf9; stroke-width: 4px; stroke-linejoin: round; }

@media (max-width: 560px) {
  .reasoning-question-visual { padding: 8px; border-radius: 14px; }
  .geometry-svg__label, .geometry-svg__measure { font-size: 15px; }
}

@media (prefers-reduced-motion: reduce) {
  .reasoning-question-visual, .geometry-svg { scroll-behavior: auto; }
}