/* ================================================================
   マイエッセイ添削 — サミットと同じ機能優先レイアウトを使う

   本体は summit.css。ここにはマイエッセイにしか出てこない
   ブロック（設問の和訳・受講条件・スコア内訳・カテゴリタグ）だけを書く。
   ================================================================ */

@import url("summit.css");

/* ================================================================
   設問カード：和訳
   ================================================================ */
.a-task-card__ja {
  margin: .5rem 0 0;
  padding-top: .5rem;
  border-top: 1px dashed var(--sm-line);
  font-size: .78rem;
  line-height: 1.7;
  color: var(--gray2);
}

/* ================================================================
   受講条件（目標スコア・選択されたフィードバック）
   ================================================================ */
.me-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem 1.4rem;
  max-width: 900px;
  padding: .6rem .1rem 0;
}
.me-meta__item {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
}
.me-meta__label {
  font-size: var(--sm-fs-label);
  font-weight: 700;
  letter-spacing: .08em;
  color: var(--lb);
  font-family: 'Raleway', sans-serif;
}
.me-meta__value {
  font-size: .82rem;
  font-weight: 700;
  color: var(--blue);
}
.me-meta__opt {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  padding: .1rem .55rem;
  border: 1px solid var(--sm-line);
  border-radius: 99px;
  font-size: .72rem;
  line-height: 1.6;
  color: var(--black);
  background: #fff;
}
.me-meta__opt i {
  font-size: .66rem;
  color: var(--sm-good);
}

/* ================================================================
   スコア内訳（TR / CC / LR / GR）
   バンドスコアは .sm-score（ツールバーへ移動される）が担当する
   ================================================================ */
.me-scores {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .5rem;
  max-width: 900px;
  margin: .6rem 0 1.1rem;
}
.me-scores__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .25rem;
  padding: .55rem .4rem;
  border: 1px solid var(--sm-line);
  border-radius: 8px;
  background: rgba(4, 63, 109, .02);
  text-align: center;
}
.me-scores__label {
  font-size: .66rem;
  line-height: 1.35;
  font-weight: 600;
  color: var(--gray2);
  overflow-wrap: break-word;
}
.me-scores__num {
  font-family: 'Raleway', sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1;
  color: var(--blue);
}

/* スコア本体は JS がツールバーへ移す。移る前／移せなかったときの見え方 */
.sm-score {
  display: flex;
  align-items: baseline;
  gap: .45rem;
  margin: 0 0 .2rem;
}
.sm-score__band {
  font-family: 'Raleway', sans-serif;
  font-size: 1.5rem;
  font-weight: 800;
  line-height: 1;
  color: var(--blue);
}
.sm-score__detail {
  font-family: 'Raleway', sans-serif;
  font-size: .72rem;
  letter-spacing: .08em;
  color: var(--gray3);
}

/* ================================================================
   添削リストのカテゴリタグ（TR / CC / LR / TR&CC など）
   ================================================================ */
.me-tag {
  display: inline-block;
  margin-right: .4em;
  padding: 0 .4em;
  border-radius: 3px;
  font-family: 'Raleway', sans-serif;
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .02em;
  line-height: 1.6;
  color: #fff;
  vertical-align: .08em;
  white-space: nowrap;
}
.me-tag--t { background: var(--sm-trcc); }
.me-tag--l { background: var(--sm-lrgr); }

/* 誤 → 正 に添えられたコメント。
   .sm-fix__note と違い「解説」トグルでは消さない（本体がこちらのため） */
.me-note {
  display: block;
  margin-top: .05rem;
  line-height: var(--sm-lh-fb);
}

/* ================================================================
   レスポンシブ
   ================================================================ */
@media (max-width: 560px) {
  .me-scores { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}