styles.css

body {
  font-family: Arial, sans-serif;
  margin: 0;
  padding: 10px;
  background-color: #f9f9f9; /* Светлый фон для более комфортного восприятия текста */
}

h2 {
  color: #333; /* Темный цвет для улучшенной читабельности */
  font-size: 1.5em;
  margin-bottom: 0.5em;
}

ul {
  list-style-type: none; /* Убираем стандартные стили списка */
  padding: 0;
}

li {
  background-color: #fff;
  margin-bottom: 10px;
  padding: 10px;
  border-radius: 4px;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); /* Лёгкая тень для визуального разделения элементов */
}

a {
  text-decoration: none; /* Убираем подчеркивание текста в ссылках */
  color: #007bff;
}

a:hover {
  text-decoration: underline; /* Подчеркивание при наведении для визуальной индикации */
}

@media (max-width: 430px) {
  body {
    padding: 5px;
  }

  h2 {
    font-size: 1.2em;
  }

  li {
    padding: 8px;
  }

  a {
    font-size: 0.9em; /* Уменьшаем размер шрифта ссылок на небольших экранах */
  }
}