.areas-page .areas-question-bank {
  max-width: 980px;
}

.areas-page .areas-question-bank > .lead {
  max-width: 780px;
}

.areas-page .question-source {
  margin: 18px 0 30px;
  padding-left: 16px;
  border-left: 3px solid #78aef2;
  color: #52637c;
  font-size: 0.95rem;
  line-height: 1.65;
}

.areas-page .question-group-title {
  margin: 38px 0 8px;
  padding-bottom: 10px;
  border-bottom: 1px solid #d8e3f1;
  color: #075fcf;
  font-size: 1.35rem;
  scroll-margin-top: 110px;
}

.areas-page .question-group-title:first-of-type {
  margin-top: 22px;
}

.areas-page .question-figure {
  margin: 14px 0 12px;
  padding: 0;
}

.areas-page .question-figure svg {
  display: block;
  width: 100%;
  max-width: 620px;
  height: auto;
  max-height: 220px;
  overflow: visible;
}

.areas-page .question-figure figcaption {
  margin-top: 7px;
  color: #63748c;
  font-size: 0.84rem;
  line-height: 1.45;
}

.areas-page .question-figure .shape,
.areas-page .question-figure .measure,
.areas-page .question-figure .accent,
.areas-page .question-figure .helper,
.areas-page .question-figure .angle,
.areas-page .question-figure .circle-line {
  vector-effect: non-scaling-stroke;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.areas-page .question-figure .shape,
.areas-page .question-figure .circle-line {
  fill: none;
  stroke: #0868d6;
  stroke-width: 3;
}

.areas-page .question-figure .measure {
  fill: none;
  stroke: #009d91;
  stroke-width: 2.5;
}

.areas-page .question-figure .accent,
.areas-page .question-figure .angle {
  fill: none;
  stroke: #f39a34;
  stroke-width: 2.5;
}

.areas-page .question-figure .helper {
  fill: none;
  stroke: #71839c;
  stroke-width: 2;
  stroke-dasharray: 7 6;
}

.areas-page .question-figure .soft-fill {
  fill: rgba(8, 104, 214, 0.055);
  stroke: none;
}

.areas-page .question-figure .accent-fill {
  fill: rgba(243, 154, 52, 0.11);
  stroke: none;
}

.areas-page .question-figure text {
  fill: #15233b;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: 600;
}

.areas-page .question-figure .small-label {
  font-size: 14px;
  font-weight: 500;
}

.areas-page .question-figure .right-angle {
  fill: none;
  stroke: #f39a34;
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}

.areas-page .exercise-item .answer-explanation {
  line-height: 1.7;
}

.areas-page .exercise-item .answer-explanation strong {
  color: #075fcf;
}

.areas-page .exercise-options .math-frac {
  font-size: 0.98em;
}

body.dark-mode.areas-page .question-source {
  color: #a9b9d0;
}

body.dark-mode.areas-page .question-group-title {
  border-bottom-color: #31435e;
  color: #73adff;
}

body.dark-mode.areas-page .question-figure text {
  fill: #e7edf7;
}

body.dark-mode.areas-page .question-figure .soft-fill {
  fill: rgba(115, 173, 255, 0.07);
}

body.dark-mode.areas-page .question-figure .accent-fill {
  fill: rgba(243, 154, 52, 0.12);
}

@media (max-width: 700px) {
  .areas-page .question-group-title {
    margin-top: 30px;
    font-size: 1.2rem;
  }

  .areas-page .question-figure svg {
    max-height: 190px;
  }
}