/* ================================================================
   writing-task2/avoid-some — local.css
   ================================================================ */

/* ---- Pattern Block（Section 2 の典型例ブロック）---- */
.av-pattern {
  border-top: 1px solid rgba(70,162,218,.15);
  padding-top: 1.2rem;
  margin-top: 1.2rem;
}

.av-pattern__label {
  display: inline-block;
  font-family: 'Courier New', monospace;
  font-size: .9rem;
  font-weight: 700;
  color: var(--blue);
  background: rgba(4,63,109,.06);
  padding: .3rem .85rem;
  border-radius: 5px;
  margin: 0 0 .65rem;
}

/* ---- Correction Block（before / after の書き換えペア）---- */
.av-correction {
  margin: .8rem 0 1.2rem;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,.08);
}

.av-correction__before,
.av-correction__after {
  margin: 0;
  padding: .75rem 1.1rem .75rem 2.7rem;
  font-size: .92rem;
  line-height: 1.8;
  position: relative;
}

.av-correction__before {
  background: rgba(235,72,120,.06);
  border-bottom: 1px dashed rgba(235,72,120,.25);
}
.av-correction__before::before {
  content: '\2717';
  position: absolute;
  left: .95rem;
  top: .78rem;
  font-size: .82rem;
  color: var(--pink);
  font-weight: 700;
}

.av-correction__after {
  background: rgba(70,162,218,.07);
}
.av-correction__after::before {
  content: '\2713';
  position: absolute;
  left: .95rem;
  top: .78rem;
  font-size: .82rem;
  color: var(--lb);
  font-weight: 700;
}

@media (max-width: 640px) {
  .av-correction__before,
  .av-correction__after {
    padding-left: 2.3rem;
    font-size: .88rem;
  }
}