.lesson-learning { margin-top: 26px; display: grid; gap: 24px; }
.learning-header, .learning-section { background: #fff; border: 1px solid #d9e5ea; border-radius: 18px; padding: clamp(18px, 3vw, 30px); box-shadow: 0 8px 24px rgba(31, 75, 91, .07); }
.learning-header h3, .learning-section h3 { margin: 4px 0 10px; color: #183f4f; }
.section-guide { color: #56717c; margin: 0 0 18px; }
.download-script, .prompt-actions a, .prompt-heading a { display: inline-flex; align-items: center; min-height: 42px; padding: 8px 14px; border: 1px solid #1f6f8b; border-radius: 10px; color: #155b73; text-decoration: none; font-weight: 700; }
.learning-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; }
.learning-card { position: relative; border: 1px solid #d9e5ea; border-radius: 14px; padding: 18px; background: #fafdfe; }
.learning-card h4 { margin: 0 32px 6px 0; color: #174f65; font-size: 1.08rem; }
.card-number { position: absolute; top: 13px; right: 13px; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #dff2f8; color: #155b73; font-weight: 800; }
.meaning, .script-ja, .example-ja { color: #4c626b; }
.example-en { margin-bottom: 4px; font-weight: 650; }
.example-ja { margin-top: 0; font-size: .94rem; }
.script-list { display: grid; gap: 12px; }
.script-en { margin: 0 34px 8px 0; font-size: 1.06rem; font-weight: 750; line-height: 1.65; }
.script-ja { margin: 0; line-height: 1.65; }
.reverse-trainer { max-width: 780px; margin: 0 auto; }
.trainer-toolbar, .trainer-nav, .prompt-actions, .prompt-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.trainer-toolbar { margin-bottom: 12px; color: #49636d; }
.trainer-progress { font-weight: 800; color: #174f65; }
.reverse-card { min-height: 280px; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; border: 2px solid #c9e0e8; border-radius: 18px; padding: 24px; background: linear-gradient(145deg, #f8fdff, #edf7fa); }
.reverse-label { color: #66808a; font-size: .9rem; }
.reverse-prompt { font-size: clamp(1.2rem, 3vw, 1.7rem); font-weight: 800; line-height: 1.6; }
.reverse-answer { width: 100%; border-top: 1px solid #cbdde4; margin-top: 10px; padding-top: 16px; white-space: pre-line; }
.answer-en { color: #164e63; font-size: 1.24rem; font-weight: 800; }
.answer-support { color: #526b74; white-space: pre-line; }
.judgement-buttons { display: flex; gap: 12px; margin-top: 14px; }
.review-button { background: #b85a3d; }
.mastered-button { background: #26815d; }
.trainer-nav { margin-top: 12px; }
.prompt-heading h3 { margin-right: auto; }
.prompt-text { box-sizing: border-box; width: 100%; min-height: 260px; resize: vertical; padding: 16px; border: 1px solid #c9dce3; border-radius: 12px; background: #f8fbfc; color: #243b44; line-height: 1.6; font: 14px/1.6 ui-monospace, Consolas, monospace; }
.listening-prompt { min-height: 210px; }
.ai-roleplay-section h4 { margin: 28px 0 10px; color: #183f4f; font-size: 1.08rem; }
@media (max-width: 640px) {
  .learning-header, .learning-section { padding: 17px; border-radius: 14px; }
  .learning-grid { grid-template-columns: 1fr; }
  .reverse-card { min-height: 250px; padding: 18px; }
  .trainer-nav > *, .prompt-actions > * { flex: 1 1 145px; justify-content: center; text-align: center; }
  .prompt-heading { align-items: flex-start; }
  .prompt-heading a { max-width: 100%; }
}
