body {
      background: #f5f7fa;
      font-family: 'Segoe UI', sans-serif;
      padding: 1em;
      max-width: 700px;
      margin: auto;
    }
    .accordion {
      margin: 0.5em 0;
      border-radius: 10px;
      overflow: hidden;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
      background: white;
    }
    .accordion summary {
      cursor: pointer;
      background-color: #007bff;
      color: white;
      padding: 1em;
      font-size: 1em;
      font-weight: bold;
    }
    .accordion summary::-webkit-details-marker {
      display: none;
    }
    .accordion[open] summary {
      border-bottom: 1px solid #ccc;
    }
    .accordion .content {
      padding: 1em;
      background: #fefefe;
      font-size: 0.95em;
      color: #333;
    }
    .accordion .content ul {
      margin: 0.5em 0;
      padding-left: 1.2em;
    }
    h1 {
      font-size: 1.2em;
      margin-bottom: 0.5em;
    }
    .back {
      display: inline-block;
      margin-bottom: 1em;
      background: #6c757d;
      color: white;
      padding: 0.5em 1em;
      border-radius: 8px;
      text-decoration: none;
    }


/* 3D Button Base Style for Help Page */
.button, .back {
  background: linear-gradient(to bottom, #0074d9, #005fa3) !important;
  color: white !important;
  border: none !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 0 #003d73 !important;
  transition: all 0.15s ease-in-out !important;
  cursor: pointer !important;
  font-weight: 600 !important;
  display: inline-block !important;
  text-align: center;
  text-decoration: none !important;
}

/* Hover effect */
.button:hover, .back:hover {
  background: linear-gradient(to bottom, #339cff, #0074d9) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 5px 0 #003d73 !important;
}

/* Click effect */
.button:active, .back:active {
  transform: translateY(2px) !important;
  box-shadow: 0 2px 0 #002f5a !important;
}

/* 3D Accordion Summary Styling */
.accordion summary {
  background: linear-gradient(to bottom, #0074d9, #005fa3) !important;
  color: white !important;
  border: none !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 0 #003d73 !important;
  transition: all 0.15s ease-in-out !important;
  font-weight: 600 !important;
  padding: 0.75em 1em !important;
  margin: 0.5em !important;
}

/* Hover effect for summary */
.accordion summary:hover {
  background: linear-gradient(to bottom, #339cff, #0074d9) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 5px 0 #003d73 !important;
}

/* Click effect */
.accordion[open] summary {
  transform: translateY(2px) !important;
  box-shadow: 0 2px 0 #002f5a !important;
}
.accordion {
  margin-bottom: 1em;
}