const LearningPanel = ({ lesson }) => (
  <div className="card">
    <div className="section-header">
      <div>
        <h2>{lesson.title}</h2>
        <p className="lesson-meta">Review the words before the quiz.</p>
      </div>
      <div className="badge">Learning</div>
    </div>
    <div className="word-list">
      {lesson.words.map((word) => (
        <div key={word.newari} className="word-item">
          <div>
            <div className="word-main">{word.newari}</div>
            <div className="word-sub">{word.translit}</div>
          </div>
          <div className="word-meaning">{word.english} / {word.nepali}</div>
        </div>
      ))}
    </div>
  </div>
);