<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Flashcard System with Pagination and Review Tracking</title>
    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
    <style>
        /* General Styles */
        body {
            font-family: 'Roboto', sans-serif;
            background-color: #f5f5f5;
            margin: 0;
            padding: 0;
            overflow-x: hidden;
        }
        .container {
            display: flex;
            flex-direction: column;
            align-items: center;
            width: 100%;
            padding: 20px;
            box-sizing: border-box;
        }
        .app-header {
            width: auto;
            background-color: #6200ea;
            padding: 15px 20px;
            box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
            color: white;
            font-size: 24px;
            font-weight: 500;
            text-align: center;
        }
        .log-container {
            margin-top: 20px;
            width: 100%;
            max-width: 600px;
            background-color: #ffffff;
            border-radius: 8px;
            box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
            padding: 15px;
            overflow-y: auto;
            max-height: 200px;
        }
        .log {
            font-size: 14px;
            color: #333;
            line-height: 1.5;
        }
    </style>

    <style>
/* General Styles */
body {
    font-family: 'Roboto', sans-serif;
    background-color: #f5f5f5;
    margin: 0;
    padding: 0;
    overflow-x: hidden; /* Prevent horizontal scrolling */
}

.container {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
}



.date-changer {
    margin-bottom: 20px;
    font-size: 16px;
}

.topic-filter, #layout-select {
    width: 100%;
    font-size: 16px;
    padding: 12px;
    border-radius: 8px;
    border: 1px solid #ddd;
    background-color: #ffffff;
    color: #333;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
    margin-bottom: 10px;
    appearance: none;
    cursor: pointer;
    text-align: left;
}

.filter-container {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 15px;
    margin-bottom: 20px;
    width: 100%;
    max-width: 300px;
    background-color: #fff;
    border-radius: 12px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
}

.filter-btn, .show-all-btn, .apply-btn {
    background-color: #6200ea;
    color: #fff;
    padding: 12px 15px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-size: 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: background-color 0.3s, box-shadow 0.3s;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.15);
}

.filter-btn:hover, .apply-btn:hover {
    background-color: #3700b3;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
}

/* Show All Button Distinct Style */
.show-all-btn {
    background-color: #03dac6;
    color: #fff;
}

.show-all-btn:hover {
    background-color: #018786;
}

.badge {
    background-color: #fff;
    color: #6200ea;
    padding: 4px 10px;
    border-radius: 8px;
    font-weight: 500;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 5px;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
}

.modern-card {
    position: relative;
    background-color: white;
    border-radius: 15px;
    width: 100%; /* Use full width */
    max-width: 800px; /* Full width to avoid scrolling in vertical layout */
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.15);
    transition: box-shadow 0.3s;
    border: 2px solid #ddd;
    box-sizing: border-box; /* Ensure padding is contained within the card */
}

.question {
    font-size: 20px;
    font-weight: 500;
    color: #333;
    margin-bottom: 10px;
    padding-right: 30px; /* Space for the bookmark */
}

.answer {
    font-size: 18px;
    color: #333;
    margin-top: 10px;
    padding: 10px;
    border-radius: 8px;
    background-color: #f9f9f9;
    display: none;
}

.buttons {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
}

.dont-know-btn, .know-btn {
    padding: 10px 20px;
    width: auto;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    color: #fff;
}

.dont-know-btn {
    background-color: #e53935;
}

.know-btn {
    background-color: #388e3c;
}

/* Hover effect for dont-know-btn */
.dont-know-btn:hover {
    background-color: #d32f2f; /* Darker shade of red */
}

/* Hover effect for know-btn */
.know-btn:hover {
    background-color: #2e7d32; /* Darker shade of green */
}


.bookmark {
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 18px;
    color: #ddd;
    cursor: default;
    transition: color 0.3s;
}

.review-metric {
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    color: #555;
    margin-top: 15px;
}

.filter-info {
    background-color: #e3f2fd;
    color: #1e88e5;
    padding: 10px 15px;
    border-radius: 8px;
    font-weight: 500;
    font-size: 16px;
    margin-bottom: 20px;
    text-align: center;
    width: 95%;
    max-width: 600px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
}

.topic-header {
    font-size: 24px;
    font-weight: 700;
    color: #6200ea;
    margin: 20px 0 10px;
    text-align: center;
    width: 100%;
}






/* Hide extra elements in horizontal layout */
.horizontal-layout .modern-card {
    display: none; /* Only the current flashcard will be displayed in the horizontal layout */
}

.horizontal-layout .navigation-buttons {
    display: flex; /* Show navigation buttons in horizontal layout */
}

.horizontal-layout .flashcard-container {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 110%; /* Use full width */
    max-width: none; /* Adjust max-width if needed for screen fit */
    padding: 0 20px;
    box-sizing: border-box;
}

.horizontal-layout .modern-card {
    width: 110%; /* Stretch to fill container */
    max-width: 800px; /* Optional: adjust for full screen width */
}

/* Horizontal layout info box styling */
#horizontal-info {
    display: none; /* Only visible in horizontal layout */
    text-align: center;
    margin: 15px 0;
    padding: 10px;
    background-color: #f0f0f0;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    font-family: 'Roboto', sans-serif;
}

#horizontal-topic {
    font-size: 20px;
    font-weight: 700;
    color: #6200ea;
    margin-bottom: 5px;
}

#horizontal-position {
    font-size: 16px;
    font-weight: 500;
    color: #333;
}


 .navigation-buttons {
    display: flex;
    justify-content: center; /* Center buttons on smaller screens */
        gap: 30px;
    width: 100%;
    max-width: 800px; /* Adjust as needed */
    margin: 20px auto;
    padding: 10px 20px;
    box-sizing: border-box;
    margin-bottom: 40px;
}

.navigation-buttons button {
    background-color: #6200ea; /* Primary color */
    color: #ffffff;
    padding: 10px 20px;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.3s, box-shadow 0.3s;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.15);
}

.navigation-buttons button:disabled {
    background-color: #9e9e9e; /* Gray color when disabled */
    cursor: not-allowed;
    box-shadow: none;
}

.navigation-buttons button:hover:not(:disabled) {
    background-color: #3700b3; /* Darker color on hover */
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
}


/* Dropdown container styling */
.dropdown {
    display: none; /* Hidden by default */
    position: absolute;
    background-color: #ffffff;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);
    width: 600px;
    z-index: 1000;
}

.dropdown-content {
    color: #333;
    font-size: 16px;
}

.close {
    position: absolute;
    top: 5px;
    right: 10px;
    font-size: 20px;
    cursor: pointer;
}



  /* Ensure flashcards-container stretches fully in vertical layout */
.vertical-layout .flashcard-container {
    width: 100%; /* Use full width in vertical layout */
    max-width: none; /* Remove max-width constraint */
    padding: 0; /* Optional: remove padding if added */
    box-sizing: border-box;
    margin: 0 auto; /* Center align in the container */
}

/* Ensure container and flashcards align correctly in all layouts */
.flashcard-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

/* Add this class to body or main container when in vertical layout mode */
.vertical-layout .container {
    width: 100%; /* Ensure container width is full */
}



    #toggleButton {
        background-color: #4CAF50; /* Green background */
        border: none;
        color: white; /* White text color */
        padding: 12px 24px; /* Padding for better spacing */
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px; /* Font size */
        cursor: pointer; /* Pointer cursor on hover */
        border-radius: 8px; /* Rounded corners */
        transition: background-color 0.3s ease; /* Smooth transition on hover */
    }

    #toggleButton:hover {
        background-color: #45a049; /* Darker green on hover */
    }

    #toggleButton:focus {
        outline: none; /* Remove outline on focus */
    }

    #toggleButton:active {
        background-color: #388e3c; /* Even darker green when button is clicked */
    }


    .star-btn {
    color: lightgray;
    font-size: 20px;
    margin: 0 10px;
    cursor: pointer;
    transition: color 0.3s ease;
}

.star-btn.active {
    color: gold;
}

.bookmark {
    cursor: pointer;
    margin-left: auto;
}

/* Emoji styling */
        .emoji {
            font-size: 24px;  /* Larger font size */
            vertical-align: middle;
            display: inline-block;
            animation: slow-bounce 2s infinite;  /* Animation applied */
        }

        /* Slow bounce animation */
        @keyframes slow-bounce {
            0%, 100% {
                transform: translateY(0);
            }
            50% {
                transform: translateY(-5px); /* Small bounce */
            }
        }




    </style>

    <style>
      .header-image, .hr-image {
            width: 50px;
            height: 50px;
            cursor: pointer;
            vertical-align: middle;
            margin-right: 10px;
        }

         /* Modal Styles */
        .modal97 {
            display: none;
            position: fixed;
            z-index: 10;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            overflow: auto;
            background-color: rgba(0,0,0,0.9);
        }

        .modal-top-bar97 {
            width: 80%;
            max-width: 700px;
            margin: auto;
            padding: 10px;
            display: flex;
            justify-content: flex-end;
            border-bottom: 5px solid #007bff;
            background-color: rgba(255, 255, 255, 0.8);
            z-index: 20;
            position: relative;
        }

        .modal-controls97 {
            display: flex;
            flex-direction: column;
            align-items: flex-end;
        }

        .close97 {
            color: #333;
            font-size: 16px;
            font-weight: bold;
            cursor: pointer;
            margin-bottom: 5px;
        }

        .zoom-buttons97 {
            display: flex;
            gap: 5px;
        }

        .zoom-button97 {
            background-color: #007bff;
            color: white;
            border: none;
            padding: 5px 10px;
            border-radius: 5px;
            font-size: 16px;
            cursor: pointer;
        }

        .zoom-button97:hover {
            background-color: #0056b3;
        }

        .modal-content-wrapper97 {
            position: relative;
            width: 80%;
            max-width: 700px;
            margin: auto;
        }

        .modal-content97 {
            display: block;
            width: 100%;
            height: auto;
            margin: auto;
        }

         .header-image, .hr-image {
            width: 50px;
            height: 50px;
            cursor: pointer;
            vertical-align: middle;
            margin-right: 10px;
        }

        .popup {
            display: none;
            position: fixed;
            z-index: 999;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.8);
        }

        .popup-content {
            position: relative;
            margin: 10% auto;
            width: 80%;
            max-width: 600px;
            background-color: #fff;
            padding: 20px;
            border-radius: 10px;
            text-align: center;
        }

        .popup-image {
            width: 100%;
            height: auto;
        }

        .close {
            position: absolute;
            top: 1px;
            right: 8px;
            color: #333;
            font-size: 24px;
            font-weight: bold;
            cursor: pointer;
        }

</style>
</head>
<body>

<!-- App Header -->
<div class="app-header">
    <img src="https://firebasestorage.googleapis.com/v0/b/akrass-plus.appspot.com/o/ContentImage%2Fkmc_20240901_152317.png?alt=media&token=74a10ca6-8504-49c3-9580-d2122f1eeba5" alt="Header Image" class="header-image" onclick="openModal('header-popup-97')" />
    MBBS Flashcards Study
</div>

<hr>
<p style="margin-left: 20px;"><b>Subject</b>: ANATOMY</p>
<p style="margin-left: 20px;"><b>Chapter</b>: 4. THORAX</p>
<p style="margin-left: 20px;"><b>BOOK Reference</b>: All 3 coaching institute Notes , <img src="https://firebasestorage.googleapis.com/v0/b/akrass-plus.appspot.com/o/ContentImage%2FIMG_20241226_130132_759.jpg?alt=media&token=3a1239cf-8495-41d9-b2f5-e90c60f659ac" alt="HR Image" class="hr-image" onclick="openModal('hr-popup-97')" />👈                                                                                                              </p>
<p style="margin-left: 20px;"><b>Total Flashcards</b>: 405</p>
<hr>


    <!-- Modal Pop-Up for Header Image -->
    <div id="header-popup-97" class="modal97">
        <div class="modal-top-bar97">
            <div class="modal-controls97">
                <span class="close97" onclick="closeModal('header-popup-97')">Close</span>
                 <div class="zoom-buttons97">
                    <button class="zoom-button97" onclick="zoomImage('header-popup-97', 0.9)">zoom -</button>
                    <button class="zoom-button97" onclick="zoomImage('header-popup-97', 1.1)">+</button>
                </div>
             </div>
        </div>
      <div class="modal-content-wrapper97">
             <img class="modal-content97" src="https://firebasestorage.googleapis.com/v0/b/akrass-plus.appspot.com/o/ContentImage%2Fkmc_20240901_152317.png?alt=media&token=74a10ca6-8504-49c3-9580-d2122f1eeba5" alt="Header Image Full View" class="popup-image" />
         </div>
    </div>

    <!-- Modal Pop-Up for HR Image -->
    <div id="hr-popup-97" class="modal97">
         <div class="modal-top-bar97">
             <div class="modal-controls97">
               <span class="close97" onclick="closeModal('hr-popup-97')">Close</span>
                <div class="zoom-buttons97">
                 <button class="zoom-button97" onclick="zoomImage('hr-popup-97', 0.9)">zoom -</button>
                    <button class="zoom-button97" onclick="zoomImage('hr-popup-97', 1.1)">+</button>
                 </div>
            </div>
         </div>
      <div class="modal-content-wrapper97">
            <img class="modal-content97" src="
https://firebasestorage.googleapis.com/v0/b/akrass-plus.appspot.com/o/ContentImage%2FIMG_20241226_130132_759.jpg?alt=media&token=3a1239cf-8495-41d9-b2f5-e90c60f659ac" alt="HR Image Full View" class="popup-image" />
       </div>
   </div>


<!-- Main Container -->
<div class="container">

<button id="toggleButton" onclick="toggleDropdownContent(event)">How to Use the Flashcard System (Step-by-Step - Click Here👈)</button>

<div id="dropdownContent" class="dropdown" style="display: none;">
    <div class="dropdown-content">
        <button class="close" onclick="closeDropdown('dropdownContent')">Close</button>
        <br><h2>How to Use the Flashcard System</h2>

        <ol>
            <li><strong>Select Layout:</strong>
                <ul>
                    <li>Choose how you want to view flashcards:</li>
                    <li><strong>Horizontal Layout:</strong> One flashcard displayed at a time.</li>
                    <li><strong>Vertical Layout (Default):</strong> Flashcards shown one below another.</li>
                </ul>
            </li>
            <br>
            <hr style="border: 1px solid #007BFF;">

            <li><strong>Select Topics:</strong>
                <ul>
                    <li>Pick multiple topics you want to study.</li>
                    <li>At the end of each topic, you’ll see:
                        <ul>
                            <li>Total flashcards in that topic.</li>
                            <li>Flashcards you’ve reviewed at least once (e.g., <strong>(2/6)</strong> means 2 out of 6 reviewed).</li>
                        </ul>
                    </li>
                </ul>
            </li>
            <br>
            <hr style="border: 1px solid #28A745;">

            <li><strong>Apply Filter:</strong>
                <ul>
                    <li>Click <strong>Apply Filter</strong> to display selected topics.</li>
                    <li>All Flashcards of selected topics will appear in your chosen layout (horizontal or vertical).</li>
                </ul>
            </li>
            <br>
            <hr style="border: 1px solid #DC3545;">

            <li><strong>Review Flashcards:</strong>
                <ul>
                    <li>View the flashcard to read the question and try to recall the answer.</li>
        <li>After attempting to recall, use the buttons:</li>
                    <li>Use the buttons:
                        <ul>
                            <li><strong>Know:</strong> If you know the answer.</li>
                            <li><strong>Don’t Know:</strong> If unsure or don’t know the answer.</li>
                            <li>If you initially clicked "Know" but later feel unsure, click "Don’t Know" to adjust your response.</li>
                        </ul>
                    </li>
                </ul>
            </li>
            <br>
            <hr style="border: 1px solid #FFC107;">

            <li><strong>Review Stages:</strong>
                <ul>
                    <li>Each reviewed flashcard shows the next review date.</li>
                    <li>Review stages based on time intervals:
                        <ul>
                            <li><strong>First Review:</strong> 3 days after the first read.</li>
                            <li><strong>Second Review:</strong> 7 days after the first review.</li>
                            <li><strong>Third Review:</strong> 14 days after the second review.</li>
                            <li><strong>Final Review:</strong> 28 days after the third review.</li>
                            <li><strong>Completed:</strong> No further reviews needed.</li>
                        </ul>
                    </li>
                </ul>
            </li>
            <br>
            <hr style="border: 1px solid #17A2B8;">

            <li><strong>Pending Review Flashcards:</strong>
                <ul>
                    <li>Flashcards ready for review are shown in the <strong>Pending Review</strong> section.</li>
                    <li>Pending cards only show from selected topics.</li>
                    <li>To view all pending flashcards from all topics, select and apply <strong>"All Topics"</strong> in the topic section (by default, "All Topics" is applied).</li>
                    <li>When you are inside the Pending Flashcards Review section, to exit this section, click the <strong>"Show All Flashcards"</strong> button. It displays all flashcards (including pending flashcards) from the selected topics.</li>
                </ul>
            </li>
            <br>
            <hr style="border: 1px solid #6C757D;">

            <li><strong>Bookmark Colors:</strong>
                <ul>
                    <li>Flashcard review stages are visually represented:</li>
                    <li><strong>Red:</strong> First Review.</li>
                    <li><strong>Pink:</strong> Second Review.</li>
                    <li><strong>Blue:</strong> Third Review.</li>
                    <li><strong>Green:</strong> Final Review.</li>
                    <li><strong>Gold:</strong> Completed.</li>
                </ul>
            </li>
            <br>
            <hr style="border: 1px solid #343A40;">

             <li><strong>Star Mark Flashcards:</strong>
                <ul>
                    <li>Mark very important or difficult flashcards using the <strong>Star Mark</strong> button.</li>
                    <li>These star-marked flashcards are ideal for focused review before exams.</li>
                    <li>Click the <strong>Starred Flashcards</strong> button to filter and view only the star-marked flashcards from the selected topics.</li>
                    <li>When you click <strong>Starred Ready for Review</strong>, it displays all star-marked flashcards that are ready for review, including those in any review stage (First, Second, Third, or Final).</li>
                    <li>This feature ensures you spend your time efficiently by focusing on critical flashcards when time is limited.</li>
                </ul>
            </li>
            <br>
            <hr style="border: 1px solid #007BFF;">

            <li><strong>Efficient Learning:</strong>
                <ul>
                    <li>The system ensures:</li>
                    <li><strong>Easy Points Flashcards:</strong> Reviewed in fewer rounds.</li>
                    <li><strong>Moderate/Difficult Points:</strong> Reviewed more frequently in more number of rounds.</li>
                    <li>Saves your time by allocating appropriate focus on difficult flashcards.</li>
                    <li>You can utilize your time efficiently and complete your syllabus within your time schedule.</li>
                </ul>
            </li>


        </ol>
    </div>
</div>

 <br>




     <!-- Dropdown for Layout Selection -->
    <div class="custom-select-container">
        <label for="layout-select"><b>Select Layout:</b></label>
        <select id="layout-select" class="custom-select" onchange="selectLayout(this.value)">
            <option value="vertical">Vertical Layout</option>
            <option value="horizontal">Horizontal Layout</option>
        </select>
    </div>

    <!-- Topic Selection Multi-select -->
    <div class="custom-select-container">
        <label for="topic-filter"><b>Select Multiple Topics & Apply Filter:</b></label>
        <select id="topic-filter" class="topic-filter" multiple>
            <!-- Options will be dynamically populated -->
        </select>
    </div>

    <!-- Apply Filter and Show All Buttons -->
    <button class="apply-btn" onclick="applySelectedTopics()">Apply Selected Topics</button><br>
    <button class="show-all-btn" onclick="showAllFlashcards()">Show All Flashcards</button>

     <div class="filter-container">
        <button class="filter-btn" onclick="filterFlashcards(0)">First Review<br> (Red) <span id="count-stage-0" class="badge">0</span></button>
        <button class="filter-btn" onclick="filterFlashcards(1)">Second Review<br> (Pink) <span id="count-stage-1" class="badge">0</span></button>
        <button class="filter-btn" onclick="filterFlashcards(2)">Third Review<br> (Blue) <span id="count-stage-2" class="badge">0</span></button>
        <button class="filter-btn" onclick="filterFlashcards(3)">Final Review<br> (Green) <span id="count-stage-3" class="badge">0</span></button>
        <button class="filter-btn" id="completed-flashcards-btn" onclick="filterFlashcards(4)">Completed Flashcards<br> 🏆 <span id="count-completed" class="badge">0 completed</span></button>
     </div>
 <div class="filter-container">
    <button class="filter-btn" onclick="showStarredFlashcards()">⭐ Starred Flashcards: <span id="count-starred" class="badge">0 Marked</span>, <span id="count-pending" class="badge">0 Pending</span></button>
    <button class="filter-btn" onclick="showStarredReadyFlashcards()">🌟 Starred Ready Review: <span id="count-starred-ready" class="badge">0 Marked</span>, <span id="count-ready-pending" class="badge">0 Pending</span></button>
</div>


    <div id="filter-info-container"></div> <!-- Filter info container for separate line display -->

<div id="horizontal-info" style="display: none;">
    <div id="horizontal-topic"></div>
    <div id="horizontal-position"></div>
</div>



    <!-- Flashcard Display Area -->
    <div id="flashcards-container" class="flashcard-container">
        <!-- Flashcards will be rendered here dynamically -->
    </div>

    <!-- Navigation for Horizontal Layout -->
    <div class="navigation-buttons" style="display: none;">
        <button id="prev-btn" onclick="navigateFlashcards('prev')" disabled>Previous</button>
        <button id="next-btn" onclick="navigateFlashcards('next')">Next</button>
    </div>
</div>




<!-- Dropdown content that replaces the modal -->
<div id="bookmarkDropdown1" class="dropdown">
    <div class="dropdown-content">
        <!-- Close button -->
        <span class="close" onclick="closeDropdown('bookmarkDropdown1')">×</span>
        <h2>Review Stage Colors</h2>
        <ul>
            <li><span style="color: red;"><i class="fas fa-bookmark"></i></span> First Review</li>
            <li><span style="color: pink;"><i class="fas fa-bookmark"></i></span> Second Review</li>
            <li><span style="color: blue;"><i class="fas fa-bookmark"></i></span> Third Review</li>
            <li><span style="color: green;"><i class="fas fa-bookmark"></i></span> Final Review</li>
            <li><span style="color: gold;"><i class="fas fa-bookmark"></i></span> Completed</li>
        </ul>
    </div>
</div>



<!-- Dropdown for Inactive Know Button Click -->
<div id="inactiveKnowDropdown" class="dropdown">
    <div class="dropdown-content">
        <span class="close" onclick="closeDropdown('inactiveKnowDropdown')">&times;</span>
        <h2>Button Inactive</h2>
        <p>The "Know" button is inactive until the review is ready. Please wait until the next review date.</p>
    </div>
</div>


<script>

 document.addEventListener('DOMContentLoaded', () => {
    openDatabase();
    const layoutSelect = document.getElementById('layout-select');
    const initialLayout = layoutSelect.value || 'vertical';
    selectLayout(initialLayout);
});

const dbName = "FlashcardDB1NPG4";
const storeName = "flashcardProgress";

     const flashcards = [
    {
        "id": 1,
        "topic": "topic1",
        "question": "What are the shortest, broadest, and most curved ribs?",
        "answer": "<li>The floating ribs, which are ribs 11 and 12.</li>",
        "memoryTip": "Floating ribs are like the lazy friends who never show up to the party—always hanging out at the bottom!",
        "emoji": "🏖️"
    },
    {
        "id": 2,
        "topic": "topic1",
        "question": "Which ribs are classified as typical ribs?",
        "answer": "<li>Ribs 3 to 9 are classified as typical ribs.</li>",
        "memoryTip": "Typical ribs are like the average Joe—always in the middle of the pack!",
        "emoji": "👔"
    },
    {
        "id": 3,
        "topic": "topic1",
        "question": "What are the typical intercostal nerves?",
        "answer": "<li>The typical intercostal nerves are nerves 4 to 6.</li>",
        "memoryTip": "Typical intercostal nerves are like the middle children—always trying to fit in!",
        "emoji": "👶"
    },
    {
        "id": 4,
        "topic": "topic1",
        "question": "What are true ribs also known as?",
        "answer": "<li>True ribs are also known as vertebrosternal ribs.</li>",
        "memoryTip": "True ribs are the VIPs of the rib world—always getting the best seats!",
        "emoji": "🎟️"
    },
    {
        "id": 5,
        "topic": "topic1",
        "question": "How many true ribs are there?",
        "answer": "<li>There are 7 true ribs.</li>",
        "memoryTip": "Seven true ribs—just like the seven wonders of the rib world!",
        "emoji": "🌍"
    },
    {
        "id": 6,
        "topic": "topic1",
        "question": "What are false ribs also known as?",
        "answer": "<li>False ribs are also known as vertebrochondral ribs.</li>",
        "memoryTip": "False ribs are like the imposters at a costume party—trying to fit in but not quite making it!",
        "emoji": "🎭"
    },
    {
        "id": 7,
        "topic": "topic1",
        "question": "How many false ribs are there?",
        "answer": "<li>There are 5 false ribs, specifically ribs 8 to 12.</li>",
        "memoryTip": "Five false ribs—like a hand with a missing finger!",
        "emoji": "✋"
    },
    {
        "id": 8,
        "topic": "topic2",
        "question": "What is a cervical rib?",
        "answer": "<li>A cervical rib is a rib arising from the anterior tubercle of the transverse process of the seventh cervical vertebra.</li>",
        "memoryTip": "A cervical rib is like a surprise guest at a dinner party—unexpected and a bit awkward!",
        "emoji": "🎉"
    },
    {
        "id": 9,
        "topic": "topic2",
        "question": "How common is the occurrence of a cervical rib in humans?",
        "answer": "<li>A cervical rib occurs in about 0.5% of humans.</li>",
        "memoryTip": "A cervical rib is rarer than finding a unicorn in your backyard!",
        "emoji": "🦄"
    },
    {
        "id": 10,
        "topic": "topic2",
        "question": "What are the possible anatomical variations of a cervical rib?",
        "answer": "<li>A cervical rib may have a free anterior end, be connected to the first rib by a fibrous band, or articulate with the first rib.</li>",
        "memoryTip": "Cervical ribs are like a choose-your-own-adventure book—lots of different endings!",
        "emoji": "📚"
    },
    {
        "id": 11,
        "topic": "topic2",
        "question": "What symptoms can result from the presence of a cervical rib?",
        "answer": "<li>It can result in paresthesia or abnormal sensations along the ulnar border of the forearm and wasting of small muscles of the hand supplied by T-1.</li>",
        "memoryTip": "A cervical rib can make your arm feel like it's been to a bad massage—tingly and weak!",
        "emoji": "💆‍♂️"
    },
    {
        "id": 12,
        "topic": "topic3",
        "question": "What is the body of the thoracic vertebrae?",
        "answer": "<li>The body is the anterior portion of thoracic vertebrae.</li>",
        "memoryTip": "The body of the vertebrae is like the front of a car—where all the action happens!",
        "emoji": "🚗"
    },
    {
        "id": 13,
        "topic": "topic3",
        "question": "What does the spinous process of the thoracic vertebrae do?",
        "answer": "<li>The spinous process articulates posteriorly.</li>",
        "memoryTip": "The spinous process is like a tail—always sticking out behind!",
        "emoji": "🐒"
    },
    {
        "id": 14,
        "topic": "topic3",
        "question": "What is the function of the transverse process in thoracic vertebrae?",
        "answer": "<li>The transverse process articulates laterally and contains the facet for each rib at the costovertebral joint.</li>",
        "memoryTip": "The transverse process is like a sidekick—always there to support the ribs!",
        "emoji": "🦸‍♂️"
    },
    {
        "id": 15,
        "topic": "topic3",
        "question": "What is the pedicle in thoracic vertebrae?",
        "answer": "<li>The pedicle is the short, thicker section that connects the transverse process to the body.</li>",
        "memoryTip": "The pedicle is like a bridge—connecting two important parts!",
        "emoji": "🌉"
    },
    {
        "id": 16,
        "topic": "topic3",
        "question": "What is the lamina in thoracic vertebrae?",
        "answer": "<li>The lamina is the longer, thinner section that connects each transverse process to the spinous process.</li>",
        "memoryTip": "The lamina is like a tightrope walker—thin and balancing between two structures!",
        "emoji": "🎪"
    },
    {
        "id": 17,
        "topic": "topic3",
        "question": "What is unique about the seventh cervical vertebra?",
        "answer": "<li>The seventh cervical vertebra, known as the vertebra prominens, has a long spinous process that is visible at the lower end of the nuchal furrow.</li>",
        "memoryTip": "The vertebra prominens is like the tallest kid in class—always standing out!",
        "emoji": "📏"
    },
    {
        "id": 18,
        "topic": "topic3",
        "question": "What are the first and second cervical vertebrae specialized for?",
        "answer": "<li>The first and second cervical vertebrae, the atlas and axis, are specialized to accommodate movement of the head.</li>",
        "memoryTip": "The atlas and axis are like the dynamic duo of neck movement—always turning heads!",
        "emoji": "🔄"
    },
    {
        "id": 19,
        "topic": "topic3",
        "question": "Which vertebrae are considered typical vertebrae?",
        "answer": "<li>Typical vertebrae are T2 to T8.</li>",
        "memoryTip": "T2 to T8 are the typical teenagers of the vertebrae—just trying to fit in!",
        "emoji": "👩‍🎤"
    },
    {
        "id": 20,
        "topic": "topic3",
        "question": "How do the transverse processes of lumbar vertebrae differ?",
        "answer": "<li>The transverse processes of lumbar vertebrae are generally thin and long, except for those on vertebra LV, which are massive and somewhat cone-shaped for the attachment of iliolumbar ligaments.</li>",
        "memoryTip": "Lumbar vertebrae are like a mixed bag of chips—some are thin and crispy, while one is a big, hearty chip!",
        "emoji": "🍟"
    },
    {
        "id": 21,
        "topic": "topic4",
        "question": "What does the plane passing through T4-T5 mark?",
        "answer": "<li>It marks the position of the anterior articulation of the costal cartilage of rib II with the sternum.</li>",
        "memoryTip": "The T4-T5 plane is like a map—showing where the ribs meet the sternum!",
        "emoji": "🗺️"
    },
    {
        "id": 22,
        "topic": "topic4",
        "question": "What does the T4-T5 plane separate?",
        "answer": "<li>It separates the superior mediastinum from the inferior mediastinum.</li>",
        "memoryTip": "The T4-T5 plane is like a divider in a library—keeping the upper and lower sections separate!",
        "emoji": "📚"
    },
    {
        "id": 23,
        "topic": "topic4",
        "question": "What is the position of the superior limit of the pericardium?",
        "answer": "<li>The superior limit of the pericardium is at the T4-T5 plane.</li>",
        "memoryTip": "The pericardium's limit is like the ceiling of a room—defining the space above!",
        "emoji": "🏠"
    },
    {
        "id": 24,
        "topic": "topic4",
        "question": "Where does the arch of the aorta begin and end?",
        "answer": "<li>The arch of the aorta begins and ends at the T4-T5 plane.</li>",
        "memoryTip": "The arch of the aorta is like a roller coaster—starting and ending at the same thrilling point!",
        "emoji": "🎢"
    },
    {
        "id": 25,
        "topic": "topic4",
        "question": "What anatomical structure bifurcates at the T4-T5 plane?",
        "answer": "<li>The trachea bifurcates into right and left main bronchi at the T4-T5 plane.</li>",
        "memoryTip": "The trachea bifurcation is like a fork in the road—time to choose your path!",
        "emoji": "🍴"
    },
    {
        "id": 26,
        "topic": "topic4",
        "question": "What is the superior limit of the pulmonary trunk?",
        "answer": "<li>The superior limit of the pulmonary trunk is at the T4-T5 plane.</li>",
        "memoryTip": "The pulmonary trunk's limit is like the finish line of a race—marking the end of one journey!",
        "emoji": "🏁"
    },
    {
        "id": 27,
        "topic": "topic5",
        "question": "What forms the intercostal nerves?",
        "answer": "<li>The intercostal nerves are formed by the anterior rami of spinal nerves T1 to T11.</li>",
        "memoryTip": "Intercostal nerves are like a team of runners—each one playing a part in the race!",
        "emoji": "🏃‍♂️"
    },
    {
        "id": 28,
        "topic": "topic5",
        "question": "What is the subcostal nerve?",
        "answer": "<li>The anterior ramus of spinal nerve T12 is the subcostal nerve.</li>",
        "memoryTip": "The subcostal nerve is like the underdog of the group—often overlooked but still important!",
        "emoji": "🐶"
    },
    {
        "id": 29,
        "topic": "topic5",
        "question": "What do the upper two intercostal nerves supply?",
        "answer": "<li>The upper two intercostal nerves supply intercostal spaces and the upper limb.</li>",
        "memoryTip": "Upper intercostal nerves are like the helpful friends who carry your bags—always there to support!",
        "emoji": "👜"
    },
    {
        "id": 30,
        "topic": "topic5",
        "question": "What do the third to sixth intercostal nerves supply?",
        "answer": "<li>The third to sixth intercostal nerves supply only the thoracic wall.</li>",
        "memoryTip": "These nerves are like the wallflowers at a dance—staying close to the wall!",
        "emoji": "🕺"
    },
    {
        "id": 31,
        "topic": "topic5",
        "question": "What do the lower five intercostal nerves supply?",
        "answer": "<li>The lower five intercostal nerves, also known as thoracoabdominal nerves, supply intercostal spaces and the abdominal wall.</li>",
        "memoryTip": "Lower intercostal nerves are like the foundation of a house—supporting everything above!",
        "emoji": "🏠"
    },
    {
        "id": 32,
        "topic": "topic5",
        "question": "What is unique about the atypical intercostal nerve?",
        "answer": "<li>The atypical intercostal nerve passes laterally around the thoracic wall in an intercostal space.</li>",
        "memoryTip": "The atypical intercostal nerve is like the rebel of the group—always taking the road less traveled!",
        "emoji": "🚧"
    },
    {
        "id": 33,
        "topic": "topic5",
        "question": "What is the largest branch of the intercostal nerves?",
        "answer": "<li>The largest branch is the lateral cutaneous branch.</li>",
        "memoryTip": "The lateral cutaneous branch is like the big brother—always looking out for the little ones!",
        "emoji": "👨‍👦"
    },
    {
        "id": 34,
        "topic": "topic5",
        "question": "What is the intercostobrachial nerve?",
        "answer": "<li>The intercostobrachial nerve is the lateral cutaneous branch of the second intercostal nerve.</li>",
        "memoryTip": "The intercostobrachial nerve is like a bridge between friends—connecting the upper body!",
        "emoji": "🌉"
    },
    {
        "id": 35,
        "topic": "topic6",
        "question": "What structures are found in the superior mediastinum?",
        "answer": "<li>The superior mediastinum contains the trachea, esophagus, origins of sternohyoid and sternothyroid muscles, longus colli, arch of aorta, brachiocephalic artery, left common carotid artery, left subclavian artery, internal thoracic artery, right and left brachiocephalic veins, upper half of the superior vena cava, left superior intercostal vein, vagus nerve, phrenic nerve, cardiac nerves, left recurrent laryngeal nerve, thymus or its remnants, and thoracic duct.</li>",
        "memoryTip": "Think of the superior mediastinum as a \"super\" highway for all the important structures heading to the heart and lungs!",
        "emoji": "🛣️"
    },
    {
        "id": 36,
        "topic": "topic6",
        "question": "What are the components of the inferior mediastinum?",
        "answer": "<li>The inferior mediastinum is divided into anterior, middle, and posterior mediastinum.</li>",
        "memoryTip": "The inferior mediastinum is like a three-part play: the anterior is the opening act, the middle is the main event, and the posterior is the closing scene!",
        "emoji": "🎭"
    },
    {
        "id": 37,
        "topic": "topic6",
        "question": "What structures are found in the anterior mediastinum?",
        "answer": "<li>The anterior mediastinum contains sterno-pericardial ligaments, lymph nodes, small branches of the internal thoracic artery, the lowest part of the thymus, and areolar tissue.</li>",
        "memoryTip": "The anterior mediastinum is like a cozy front porch, holding small but important items before you enter the main house!",
        "emoji": "🏡"
    },
    {
        "id": 38,
        "topic": "topic6",
        "question": "What structures are located in the middle mediastinum?",
        "answer": "<li>The middle mediastinum contains the heart and pericardium, ascending aorta, pulmonary trunk, two pulmonary arteries, lower half of the superior vena cava, terminal part of the azygos vein, right and left pulmonary veins, phrenic nerve, deep cardiac plexus, tracheobronchial nodes, bifurcation of the trachea, and right and left principal bronchi.</li>",
        "memoryTip": "The middle mediastinum is like the heart of the party, where all the action happens!",
        "emoji": "❤️"
    },
    {
        "id": 39,
        "topic": "topic6",
        "question": "What structures are found in the posterior mediastinum?",
        "answer": "<li>The posterior mediastinum contains the esophagus, descending aorta and its branches, azygos vein, hemiazygos vein, accessory hemiazygos vein, vagus nerve, splanchnic nerve, thoracic duct, and posterior mediastinal lymph nodes.</li>",
        "memoryTip": "The posterior mediastinum is like the backstage area of a concert, where all the behind-the-scenes action takes place!",
        "emoji": "🎤"
    },
    {
        "id": 40,
        "topic": "topic7",
        "question": "How many lobes does the right lung have and how are they divided?",
        "answer": "<li>The right lung is divided into three lobes (upper, middle, and lower) by two fissures: the oblique and horizontal fissures.</li>",
        "memoryTip": "The right lung is like a three-tier cake, each layer separated by a delicious fissure!",
        "emoji": "🎂"
    },
    {
        "id": 41,
        "topic": "topic7",
        "question": "How many lobes does the left lung have and how are they divided?",
        "answer": "<li>The left lung is divided into two lobes by the oblique fissure.</li>",
        "memoryTip": "The left lung is like a two-layer pancake, simple but still satisfying!",
        "emoji": "🥞"
    },
    {
        "id": 42,
        "topic": "topic7",
        "question": "What is the pulmonary hilum?",
        "answer": "<li>The pulmonary hilum connects the lungs to the heart and trachea.</li>",
        "memoryTip": "Think of the pulmonary hilum as the \"welcome mat\" for the lungs, connecting them to the heart and trachea!",
        "emoji": "🚪"
    },
    {
        "id": 43,
        "topic": "topic7",
        "question": "What structures create impressions on the right lung?",
        "answer": "<li>The right lung has impressions from the right atrium and auricle, a small part of the right ventricle, superior vena cava, part of the right brachiocephalic vein, azygos vein, esophagus, and inferior vena cava.</li>",
        "memoryTip": "The right lung is like a canvas, with impressions from all the important heart structures painting a picture!",
        "emoji": "🎨"
    },
    {
        "id": 44,
        "topic": "topic7",
        "question": "What structures create impressions on the left lung?",
        "answer": "<li>The left lung has impressions from the left ventricle and auricle, infundibulum, a part of the right ventricle, pulmonary trunk, arch of aorta, descending thoracic aorta, left subclavian artery, left brachiocephalic vein, thoracic duct, and esophagus.</li>",
        "memoryTip": "The left lung is like a masterpiece, showcasing the heart's left side in all its glory!",
        "emoji": "🖼️"
    },
    {
        "id": 45,
        "topic": "topic7",
        "question": "Which nerves do not create impressions on the right lung?",
        "answer": "<li>The right lung does not have impressions from the right vagus nerve, right phrenic nerve, and trachea.</li>",
        "memoryTip": "The right lung is a bit shy, avoiding impressions from the right vagus and phrenic nerves!",
        "emoji": "🙈"
    },
    {
        "id": 46,
        "topic": "topic7",
        "question": "Which nerves do not create impressions on the left lung?",
        "answer": "<li>The left lung does not have impressions from the left vagus nerve, left phrenic nerve, and left recurrent laryngeal nerve.</li>",
        "memoryTip": "The left lung is also shy, keeping its distance from the left vagus and phrenic nerves!",
        "emoji": "🙉"
    },
    {
        "id": 47,
        "topic": "topic8",
        "question": "How many pairs of posterior intercostal arteries are there and where do they originate?",
        "answer": "<li>There are 11 pairs of posterior intercostal arteries; the upper two on each side are derived from the supreme intercostal artery, while the remaining nine pairs arise from the posterior surface of the thoracic aorta.</li>",
        "memoryTip": "Think of the posterior intercostal arteries as a team of 11, with the top two being the \"supreme\" leaders!",
        "emoji": "🏆"
    },
    {
        "id": 48,
        "topic": "topic8",
        "question": "What are anterior intercostal arteries and where do they come from?",
        "answer": "<li>Anterior intercostal arteries are lateral branches from the internal thoracic arteries.</li>",
        "memoryTip": "The anterior intercostal arteries are like the friendly neighbors, branching out from the internal thoracic arteries!",
        "emoji": "🏡"
    },
    {
        "id": 49,
        "topic": "topic8",
        "question": "What is the supreme intercostal artery and where does it originate?",
        "answer": "<li>The supreme intercostal artery is a branch of the costocervical trunk in the neck.</li>",
        "memoryTip": "The supreme intercostal artery is like the royal family of arteries, branching out from the neck!",
        "emoji": "👑"
    },
    {
        "id": 50,
        "topic": "topic8",
        "question": "What is the costocervical trunk and where does it branch from?",
        "answer": "<li>The costocervical trunk is a posterior branch of the subclavian artery.</li>",
        "memoryTip": "The costocervical trunk is like a tree trunk, branching out to supply the upper body!",
        "emoji": "🌳"
    },
    {
        "id": 51,
        "topic": "topic9",
        "question": "What are the components of the root of the lung on the left side?",
        "answer": "<li>The root of the lung on the left side includes the principal bronchus, one pulmonary artery, two pulmonary veins (superior and inferior), bronchial arteries (two), bronchial veins, anterior and posterior pulmonary plexus of nerves, lymphatics of the lungs, and broncho-pulmonary lymph nodes.</li>",
        "memoryTip": "The left lung's root is like a busy intersection, with all the important structures coming together!",
        "emoji": "🚦"
    },
    {
        "id": 52,
        "topic": "topic9",
        "question": "What are the components of the root of the lung on the right side?",
        "answer": "<li>The root of the lung on the right side includes the principal bronchus, eparterial and hyparterial bronchi, one pulmonary artery, two pulmonary veins (superior and inferior), bronchial arteries (one), bronchial veins, anterior and posterior pulmonary plexus of nerves, lymphatics of the lungs, and broncho-pulmonary lymph nodes.</li>",
        "memoryTip": "The right lung's root is like a complex puzzle, with pieces fitting together in a unique way!",
        "emoji": "🧩"
    },
    {
        "id": 53,
        "topic": "topic10",
        "question": "What is the order of structures in the root of the lungs from before backwards?",
        "answer": "<li>Superior pulmonary vein, Pulmonary artery, Bronchus and bronchial vessels.</li>",
        "memoryTip": "Think of a train station where the \"superior\" train arrives first, followed by the \"pulmonary\" express, and finally the \"bronchus\" local train!",
        "emoji": "🚂"
    },
    {
        "id": 54,
        "topic": "topic10",
        "question": "What is the order of structures in the root of the lungs from above downwards on the right side?",
        "answer": "<li>Eparterial bronchus, Pulmonary artery, Hyparterial bronchus, Inferior pulmonary vein.</li>",
        "memoryTip": "Imagine a roller coaster that starts high with the \"eparterial\" peak, drops to the \"pulmonary\" valley, twists through the \"hyparterial\" loop, and finally lands at the \"inferior\" station!",
        "emoji": "🎢"
    },
    {
        "id": 55,
        "topic": "topic10",
        "question": "What is the order of structures in the root of the lungs from above downwards on the left side?",
        "answer": "<li>Pulmonary artery, Bronchus, Inferior pulmonary vein.</li>",
        "memoryTip": "Picture a left-handed pitcher throwing a ball from the \"pulmonary\" mound to the \"bronchus\" catcher, and then to the \"inferior\" base!",
        "emoji": "⚾"
    },
    {
        "id": 56,
        "topic": "topic11",
        "question": "What structures are common on both sides in the anterior relation of the root?",
        "answer": "<li>Phrenic nerve, Pericardio phrenic vessels, Anterior pulmonary plexus.</li>",
        "memoryTip": "Remember the \"phrenic\" party where nerves and vessels mingle with the \"anterior\" crowd!",
        "emoji": "🎉"
    },
    {
        "id": 57,
        "topic": "topic11",
        "question": "What structures are common on both sides in the posterior relation of the root?",
        "answer": "<li>Vagus nerve, Posterior pulmonary plexus.</li>",
        "memoryTip": "Think of the \"vagus\" vagabonds wandering in the \"posterior\" alley!",
        "emoji": "🏙️"
    },
    {
        "id": 58,
        "topic": "topic11",
        "question": "What structure is found on the right side in the superior relation of the root?",
        "answer": "<li>Terminal part of the Azygos vein.</li>",
        "memoryTip": "Picture the \"Azygos\" vein as the last stop on the right side's tour!",
        "emoji": "🛑"
    },
    {
        "id": 59,
        "topic": "topic11",
        "question": "What structure is found on the left side in the superior relation of the root?",
        "answer": "<li>Arch of aorta.</li>",
        "memoryTip": "Imagine the \"arch\" as a grand entrance to the left side's royal court!",
        "emoji": "👑"
    },
    {
        "id": 60,
        "topic": "topic11",
        "question": "What structure is found in the inferior relation of the root?",
        "answer": "<li>Pulmonary ligament.</li>",
        "memoryTip": "Think of the \"pulmonary ligament\" as the supportive friend holding everything together!",
        "emoji": "🤝"
    },
    {
        "id": 61,
        "topic": "topic12",
        "question": "What are the broncho-pulmonary segments of the right lung's superior lobe?",
        "answer": "<li>1. Apical, 2. Posterior, 3. Anterior.</li>",
        "memoryTip": "Remember the \"superior\" lobe as the VIP section with the \"apical\" star, \"posterior\" backup singers, and \"anterior\" dancers!",
        "emoji": "🌟"
    },
    {
        "id": 62,
        "topic": "topic12",
        "question": "What are the broncho-pulmonary segments of the right lung's middle lobe?",
        "answer": "<li>4. Lateral, 5. Medial.</li>",
        "memoryTip": "Picture the \"middle\" lobe as a dance-off between the \"lateral\" and \"medial\" moves!",
        "emoji": "💃"
    },
    {
        "id": 63,
        "topic": "topic12",
        "question": "What are the broncho-pulmonary segments of the right lung's inferior lobe?",
        "answer": "<li>6. Superior (apical), 7. Medial basal, 8. Anterior basal, 9. Lateral basal, 10. Posterior basal.</li>",
        "memoryTip": "Think of the \"inferior\" lobe as a basement party with \"superior\" snacks, \"medial\" games, \"anterior\" decorations, \"lateral\" music, and \"posterior\" guests!",
        "emoji": "🎊"
    },
    {
        "id": 64,
        "topic": "topic13",
        "question": "What are the lobes of the inferior lobe of the lung?",
        "answer": "<li>The inferior lobe has 6 segments: 8 (anterior basal), 9 (lateral basal), and 10 (posterior basal).</li>",
        "memoryTip": "Remember the inferior lobe segments by thinking of a \"basal\" party with 6 guests, where 8 is the host, 9 brings snacks, and 10 is the DJ!",
        "emoji": "🎉"
    },
    {
        "id": 65,
        "topic": "topic13",
        "question": "How many fissures and lobes does the right lung have?",
        "answer": "<li>The right lung has 2 fissures and 3 lobes.</li>",
        "memoryTip": "The right lung is like a three-layer cake with two cuts (fissures) to make it easier to eat!",
        "emoji": "🍰"
    },
    {
        "id": 66,
        "topic": "topic13",
        "question": "How many fissures and lobes does the left lung have?",
        "answer": "<li>The left lung has only one fissure and 2 lobes.</li>",
        "memoryTip": "The left lung is a two-layer pancake with just one cut, making it a bit simpler to stack!",
        "emoji": "🥞"
    },
    {
        "id": 67,
        "topic": "topic13",
        "question": "What is the weight difference between the right and left lungs?",
        "answer": "<li>The right lung is larger and heavier (700g), while the left lung is smaller and lighter (600g).</li>",
        "memoryTip": "Think of the right lung as a heavyweight champion at 700g, while the left lung is a featherweight at 600g!",
        "emoji": "🥊"
    },
    {
        "id": 68,
        "topic": "topic13",
        "question": "How do the anterior borders of the right and left lungs differ?",
        "answer": "<li>The anterior border of the right lung is straight, while the left lung's anterior border is interrupted by the cardiac notch.</li>",
        "memoryTip": "The right lung is like a straight road, while the left lung has a \"heartfelt\" detour!",
        "emoji": "❤️"
    },
    {
        "id": 69,
        "topic": "topic13",
        "question": "What is the length of the right bronchus?",
        "answer": "<li>The right bronchus is 2.5 cm long.</li>",
        "memoryTip": "The right bronchus is short and sweet, just like a quick coffee break!",
        "emoji": "☕"
    },
    {
        "id": 70,
        "topic": "topic13",
        "question": "What is the length of the left bronchus?",
        "answer": "<li>The left bronchus is 5 cm long.</li>",
        "memoryTip": "The left bronchus is like a long story that takes twice as long to tell!",
        "emoji": "📖"
    },
    {
        "id": 71,
        "topic": "topic14",
        "question": "At which vertebral level does the right bronchus enter the lung hilum?",
        "answer": "<li>The right bronchus enters the lung hilum at T5.</li>",
        "memoryTip": "Think of T5 as the \"T\" for \"Tight fit\" since the right bronchus is entering the lung!",
        "emoji": "🚪"
    },
    {
        "id": 72,
        "topic": "topic14",
        "question": "At which vertebral level does the left bronchus enter the lung hilum?",
        "answer": "<li>The left bronchus enters the lung hilum at T6.</li>",
        "memoryTip": "T6 is like the \"T\" for \"Left Turn\" as it takes a slightly different route!",
        "emoji": "🔄"
    },
    {
        "id": 73,
        "topic": "topic14",
        "question": "What is the tracheobronchial angle for the right bronchus?",
        "answer": "<li>The tracheobronchial angle for the right bronchus is 25 degrees.</li>",
        "memoryTip": "The right bronchus takes a sharp 25-degree turn, like a car making a quick right!",
        "emoji": "🚗"
    },
    {
        "id": 74,
        "topic": "topic14",
        "question": "What is the tracheobronchial angle for the left bronchus?",
        "answer": "<li>The tracheobronchial angle for the left bronchus is 45 degrees.</li>",
        "memoryTip": "The left bronchus is more laid back with a 45-degree angle, like a gentle slope!",
        "emoji": "⛰️"
    },
    {
        "id": 75,
        "topic": "topic14",
        "question": "How do the cartilages of the right and left bronchi differ?",
        "answer": "<li>The right bronchus has 6-8 cartilages, while the left bronchus has 9-12 cartilages.</li>",
        "memoryTip": "The right bronchus has fewer \"friends\" (cartilages) at the party, while the left has a bigger crew!",
        "emoji": "🎉"
    },
    {
        "id": 76,
        "topic": "topic14",
        "question": "How do the lumen sizes of the right and left bronchi compare?",
        "answer": "<li>The right bronchus has a wide lumen, while the left bronchus has a narrow lumen.</li>",
        "memoryTip": "The right bronchus is like a wide-open highway, while the left is a narrow country road!",
        "emoji": "🛣️"
    },
    {
        "id": 77,
        "topic": "topic15",
        "question": "What are the two major types of pleura based on location?",
        "answer": "<li>The two major types of pleura are parietal pleura and visceral pleura.</li>",
        "memoryTip": "Think of parietal pleura as the \"party wall\" and visceral pleura as the \"inner circle\" of the lung party!",
        "emoji": "🎊"
    },
    {
        "id": 78,
        "topic": "topic15",
        "question": "What is the costal part of the parietal pleura?",
        "answer": "<li>The costal part of the parietal pleura is related to the ribs and intercostal spaces.</li>",
        "memoryTip": "The costal part is like the ribcage's \"party hat,\" keeping everything together!",
        "emoji": "🎩"
    },
    {
        "id": 79,
        "topic": "topic15",
        "question": "What does the diaphragmatic part of the parietal pleura cover?",
        "answer": "<li>The diaphragmatic part of the parietal pleura covers the diaphragm.</li>",
        "memoryTip": "The diaphragmatic part is like a cozy blanket for the diaphragm, keeping it warm!",
        "emoji": "🛏️"
    },
    {
        "id": 80,
        "topic": "topic15",
        "question": "What is the mediastinal part of the parietal pleura?",
        "answer": "<li>The mediastinal part of the parietal pleura covers the mediastinum.</li>",
        "memoryTip": "The mediastinal part is like the \"mediator\" at a lung conference, keeping everything organized!",
        "emoji": "🕊️"
    },
    {
        "id": 81,
        "topic": "topic15",
        "question": "What is the cervical pleura?",
        "answer": "<li>The cervical pleura is the dome-shaped layer of parietal pleura lining the cervical extension of the pleural cavity.</li>",
        "memoryTip": "The cervical pleura is like a \"cap\" on the lung's head, keeping it stylish!",
        "emoji": "🎩"
    },
    {
        "id": 82,
        "topic": "topic16",
        "question": "What are pleural recesses?",
        "answer": "<li>Pleural recesses are spaces where two layers of parietal pleura become opposed.</li>",
        "memoryTip": "Think of pleural recesses as \"hide-and-seek\" spots for the lungs during deep breaths!",
        "emoji": "🙈"
    },
    {
        "id": 83,
        "topic": "topic16",
        "question": "When does lung expansion into pleural recesses usually occur?",
        "answer": "<li>Lung expansion into pleural recesses usually occurs during forced inspiration.</li>",
        "memoryTip": "It's like the lungs are stretching out for a big yawn during forced inspiration!",
        "emoji": "😮"
    },
    {
        "id": 84,
        "topic": "topic16",
        "question": "What are costomediastinal recesses?",
        "answer": "<li>Costomediastinal recesses occur where costal pleura is opposed to mediastinal pleura, with the largest on the left side over the heart.</li>",
        "memoryTip": "Costomediastinal recesses are like cozy corners where the lungs and heart have a chat!",
        "emoji": "💬"
    },
    {
        "id": 85,
        "topic": "topic16",
        "question": "What are costodiaphragmatic recesses?",
        "answer": "<li>Costodiaphragmatic recesses occur between the costal pleura and diaphragmatic pleura, deepest after forced expiration and shallowest after forced inspiration.</li>",
        "memoryTip": "Costodiaphragmatic recesses are like the \"bottom of the pool\" where the lungs dive deep after a big breath!",
        "emoji": "🏊"
    },
    {
        "id": 86,
        "topic": "topic17",
        "question": "What innervates the costal and peripheral diaphragmatic parietal pleurae?",
        "answer": "<li>The costal and peripheral diaphragmatic parietal pleurae are innervated by intercostal nerves.</li>",
        "memoryTip": "Intercostal nerves are like the \"party planners\" for the pleura, making sure everything runs smoothly!",
        "emoji": "🎉"
    },
    {
        "id": 87,
        "topic": "topic17",
        "question": "What innervates the mediastinal and central diaphragmatic parietal pleurae?",
        "answer": "<li>The mediastinal and central diaphragmatic parietal pleurae are innervated by the phrenic nerve.</li>",
        "memoryTip": "The phrenic nerve is like the \"master of ceremonies\" for the mediastinal pleura, keeping the show going!",
        "emoji": "🎤"
    },
    {
        "id": 88,
        "topic": "topic17",
        "question": "How is the visceral pleura innervated?",
        "answer": "<li>The visceral pleura is innervated by visceral afferents that travel along the bronchial vessels.</li>",
        "memoryTip": "The visceral pleura gets its \"news\" from the bronchial vessels, like gossip traveling through a grapevine!",
        "emoji": "🍇"
    },
    {
        "id": 89,
        "topic": "topic18",
        "question": "What is the bronchial artery a direct branch of?",
        "answer": "<li>The bronchial artery is a direct branch of the descending aorta.</li>",
        "memoryTip": "The bronchial artery is like a \"branch\" of the aorta tree, supplying the lungs with oxygen!",
        "emoji": "🌳"
    },
    {
        "id": 90,
        "topic": "topic18",
        "question": "What does the bronchial artery supply?",
        "answer": "<li>The bronchial artery supplies the bronchial tree as far as the respiratory bronchioles and communicates with branches of the pulmonary artery.</li>",
        "memoryTip": "The bronchial artery is like a delivery service, bringing oxygen to the lung branches!",
        "emoji": "📦"
    },
    {
        "id": 91,
        "topic": "topic19",
        "question": "Where is the pericardium situated?",
        "answer": "<li>The pericardium is situated in the middle mediastinum.</li>",
        "memoryTip": "The pericardium is like the \"middle seat\" at a concert, right between the heart and the major vessels!",
        "emoji": "🎶"
    },
    {
        "id": 92,
        "topic": "topic19",
        "question": "What does the pericardium enclose?",
        "answer": "<li>The pericardium encloses the heart and the roots of the greater vessels.</li>",
        "memoryTip": "The pericardium is like a protective hug for the heart and its vessel friends!",
        "emoji": "🤗"
    },
    {
        "id": 93,
        "topic": "topic19",
        "question": "What are the two components of the pericardium?",
        "answer": "<li>The pericardium consists of serous and fibrous pericardium.</li>",
        "memoryTip": "The pericardium is like a sandwich, with a fibrous crust and a serous filling!",
        "emoji": "🥪"
    },
    {
        "id": 94,
        "topic": "topic20",
        "question": "What connects the fibrous pericardium to the sternum?",
        "answer": "<li>The fibrous pericardium is connected to the sternum by superior and inferior sternopericardial ligaments.</li>",
        "memoryTip": "Think of the sternopericardial ligaments as the \"sternum's suspenders\" holding up the heart!",
        "emoji": "🎩"
    },
    {
        "id": 95,
        "topic": "topic20",
        "question": "What are the two layers of the serous pericardium?",
        "answer": "<li>The serous pericardium is divided into visceral and parietal pericardium.</li>",
        "memoryTip": "Remember, the serous pericardium has a \"visceral\" side that hugs the heart and a \"parietal\" side that keeps it stylish!",
        "emoji": "🧥"
    },
    {
        "id": 96,
        "topic": "topic20",
        "question": "What is the pericardial space?",
        "answer": "<li>The pericardial space is a potential space between the visceral and parietal pericardium.</li>",
        "memoryTip": "Think of the pericardial space as the \"buffer zone\" where the heart can chill without getting too close!",
        "emoji": "🏖️"
    },
    {
        "id": 97,
        "topic": "topic20",
        "question": "How is the parietal layer of the serous pericardium related to the visceral layer?",
        "answer": "<li>The parietal layer is continuous with the visceral layer around the roots of the great vessels.</li>",
        "memoryTip": "Imagine a continuous loop of friends holding hands around the great vessels—no one gets left out!",
        "emoji": "🤝"
    },
    {
        "id": 98,
        "topic": "topic20",
        "question": "Where do the reflections of the serous pericardium occur?",
        "answer": "<li>Reflections of the serous pericardium occur in two locations: surrounding the arteries (aorta and pulmonary trunk) and surrounding the veins (SVC, IVC, and pulmonary veins).</li>",
        "memoryTip": "Picture the serous pericardium as a protective blanket that wraps around both the arteries and veins like a cozy hug!",
        "emoji": "🛌"
    },
    {
        "id": 99,
        "topic": "topic21",
        "question": "What are the contents of the pericardium?",
        "answer": "<li>The contents of the pericardium include the heart with cardiac muscles and nerves, ascending aorta, pulmonary trunk, lower half of SVC, terminal part of IVC, and terminal part of pulmonary veins.</li>",
        "memoryTip": "Think of the pericardium as a packed suitcase containing all the essentials for a heart trip!",
        "emoji": "🧳"
    },
    {
        "id": 100,
        "topic": "topic22",
        "question": "What is the arterial supply to the pericardium?",
        "answer": "<li>The arterial supply to the pericardium comes from the internal thoracic, musculophrenic arteries, and descending thoracic aorta.</li>",
        "memoryTip": "Remember, the pericardium gets its \"fuel\" from a trio of arteries—like a heart-shaped gas station!",
        "emoji": "⛽"
    },
    {
        "id": 101,
        "topic": "topic22",
        "question": "Which nerve supplies the fibrous and parietal pericardia?",
        "answer": "<li>The fibrous and parietal pericardia are supplied by the phrenic nerve, which is pain sensitive.</li>",
        "memoryTip": "Think of the phrenic nerve as the \"pain detective\" for the pericardium, always on the lookout for trouble!",
        "emoji": "🕵️‍♂️"
    },
    {
        "id": 102,
        "topic": "topic22",
        "question": "What supplies the visceral pericardium/epicardium?",
        "answer": "<li>The visceral pericardium/epicardium is supplied by autonomic nerves, which are pain insensitive.</li>",
        "memoryTip": "Picture the autonomic nerves as the \"chill friends\" of the heart, never bothered by pain!",
        "emoji": "😎"
    },
    {
        "id": 103,
        "topic": "topic23",
        "question": "In which position does the heart rest?",
        "answer": "<li>The heart in anatomic position rests on the diaphragmatic surface and consists of the left ventricle and a small portion of the right ventricle.</li>",
        "memoryTip": "Imagine the heart lounging on the diaphragm like it's on a beach chair, soaking up the sun!",
        "emoji": "🏖️"
    },
    {
        "id": 104,
        "topic": "topic23",
        "question": "What forms the right border of the heart?",
        "answer": "<li>The right border of the heart is formed by the right atrium, superior vena cava (SVC), and inferior vena cava (IVC).</li>",
        "memoryTip": "Think of the right border as the \"right side crew\" of the heart, always ready to welcome blood!",
        "emoji": "👥"
    },
    {
        "id": 105,
        "topic": "topic23",
        "question": "What forms the left border of the heart?",
        "answer": "<li>The left border of the heart is formed mostly by the left ventricle, left auricle, aortic knuckle, and pulmonary artery.</li>",
        "memoryTip": "Picture the left border as the \"left side party\" of the heart, where all the action happens!",
        "emoji": "🎉"
    },
    {
        "id": 106,
        "topic": "topic23",
        "question": "What forms the inferior border of the heart?",
        "answer": "<li>The inferior border of the heart is formed by the right ventricle and some part of the left ventricle.</li>",
        "memoryTip": "Think of the inferior border as the \"bottom line\" of the heart, keeping everything grounded!",
        "emoji": "📉"
    },
    {
        "id": 107,
        "topic": "topic23",
        "question": "Where is the apex of the heart located?",
        "answer": "<li>The apex of the heart is located 3.5 inches to the left of the 5th intercostal space.</li>",
        "memoryTip": "Remember, the apex is like the \"tip of the iceberg\" of the heart, peeking out to the left!",
        "emoji": "🧊"
    },
    {
        "id": 108,
        "topic": "topic23",
        "question": "What is the base of the heart?",
        "answer": "<li>The base (posterior surface) of the heart is formed by the left atrium, which receives four pulmonary veins.</li>",
        "memoryTip": "Think of the base as the \"backstage area\" of the heart, where all the pulmonary veins gather!",
        "emoji": "🎭"
    },
    {
        "id": 109,
        "topic": "topic23",
        "question": "What primarily makes up the anterior surface of the heart?",
        "answer": "<li>The anterior surface of the heart (sternocostal surface) is mainly formed by the right ventricle, partly by the left ventricle and left auricle.</li>",
        "memoryTip": "Picture the anterior surface as the \"face\" of the heart, showing off its right ventricle smile!",
        "emoji": "😁"
    },
    {
        "id": 110,
        "topic": "topic24",
        "question": "How is the interior of the right atrium divided?",
        "answer": "<li>The interior of the right atrium is divided into two continuous spaces.</li>",
        "memoryTip": "Think of the right atrium as a two-room apartment, cozy and connected!",
        "emoji": "🏠"
    },
    {
        "id": 111,
        "topic": "topic24",
        "question": "What indicates the external separation of the right atrium's spaces?",
        "answer": "<li>The external separation is indicated by the sulcus terminalis cordis.</li>",
        "memoryTip": "Picture the sulcus terminalis as the \"fence\" that keeps the two spaces in the right atrium separate!",
        "emoji": "🏡"
    },
    {
        "id": 112,
        "topic": "topic24",
        "question": "What indicates the internal division of the right atrium?",
        "answer": "<li>The internal division is indicated by the crista terminalis.</li>",
        "memoryTip": "Think of the crista terminalis as the \"internal wall\" that keeps things organized in the right atrium!",
        "emoji": "🧱"
    },
    {
        "id": 113,
        "topic": "topic24",
        "question": "What is located posterior to the crista terminalis?",
        "answer": "<li>The space posterior to the crista is the sinus of venae cavae, derived from the right horn of the sinus venosus.</li>",
        "memoryTip": "Imagine the sinus of venae cavae as the \"back room\" of the right atrium, where all the blood flows in!",
        "emoji": "🚪"
    },
    {
        "id": 114,
        "topic": "topic24",
        "question": "What is the fossa ovalis?",
        "answer": "<li>The fossa ovalis is a depression visible in the septum just above the orifice of the inferior vena cava (IVC).</li>",
        "memoryTip": "Think of the fossa ovalis as the \"oval-shaped pool\" in the heart's septum, perfect for a quick dip!",
        "emoji": "🏊"
    },
    {
        "id": 115,
        "topic": "topic24",
        "question": "What is the prominent margin of the fossa ovalis called?",
        "answer": "<li>The prominent margin of the fossa ovalis is called the limbus fossa.</li>",
        "memoryTip": "Picture the limbus fossa as the \"rim\" of the heart's pool, keeping everything contained!",
        "emoji": "🏖️"
    },
    {
        "id": 116,
        "topic": "topic24",
        "question": "What are the foramina of the venae cordis minimae?",
        "answer": "<li>The foramina of the venae cordis minimae are numerous openings of the smallest cardiac veins scattered along the walls of the right atrium.</li>",
        "memoryTip": "Think of the foramina as the \"tiny doors\" where little veins sneak in and out of the right atrium!",
        "emoji": "🚪"
    },
    {
        "id": 117,
        "topic": "topic24",
        "question": "What are musculi pectinati?",
        "answer": "<li>Musculi pectinati are rough areas on the superior inner wall of the right atrium, leftover from the embryonic heart.</li>",
        "memoryTip": "Picture musculi pectinati as the \"rough patches\" on the heart's wall, like a heart with a rugged past!",
        "emoji": "🏞️"
    },
    {
        "id": 118,
        "topic": "topic24",
        "question": "What is the sinus venarum?",
        "answer": "<li>The sinus venarum is a smooth area in the right ventricle, remaining from the right horn of the embryonic sinus venosus.</li>",
        "memoryTip": "Think of the sinus venarum as the \"smooth operator\" of the right ventricle, keeping things flowing smoothly!",
        "emoji": "🎶"
    },
    {
        "id": 119,
        "topic": "topic25",
        "question": "What is the aortic mound also known as?",
        "answer": "<li>The aortic mound is also known as the torus aorticus.</li>",
        "memoryTip": "Think of the aortic mound as a \"torus\" that’s always on the lookout for a good \"aorta\" party!",
        "emoji": "🎉"
    },
    {
        "id": 120,
        "topic": "topic25",
        "question": "Where is the aortic mound located?",
        "answer": "<li>The aortic mound is located above the membranous septum, marking the location of the non-coronary sinus of the aorta.</li>",
        "memoryTip": "The aortic mound is like a VIP section above the septum where the non-coronary sinus hangs out!",
        "emoji": "🥳"
    },
    {
        "id": 121,
        "topic": "topic26",
        "question": "What is the SANode?",
        "answer": "<li>The SANode is the junction between parts of the right atrium derived from the embryonic venous sinus and the atrium proper.</li>",
        "memoryTip": "The SANode is like a reunion of old friends from the embryonic days, catching up in the right atrium!",
        "emoji": "👥"
    },
    {
        "id": 122,
        "topic": "topic26",
        "question": "Where is the SANode located?",
        "answer": "<li>The SANode is located at the superior end of the crista terminalis at the junction of the superior vena cava (SVC) and the right atrium.</li>",
        "memoryTip": "The SANode is at the \"top\" of the atrium, like the cherry on a sundae!",
        "emoji": "🍒"
    },
    {
        "id": 123,
        "topic": "topic26",
        "question": "What often covers the SANode?",
        "answer": "<li>The SANode is often covered by a plaque of subepicardial fat.</li>",
        "memoryTip": "The SANode likes to stay cozy under a blanket of fat, just like a bear in hibernation!",
        "emoji": "🐻"
    },
    {
        "id": 124,
        "topic": "topic26",
        "question": "Where is the SANode located in relation to the terminal groove?",
        "answer": "<li>The SANode is located subepicardially within the terminal groove.</li>",
        "memoryTip": "The SANode is like a secret agent hiding in the terminal groove, ready to spring into action!",
        "emoji": "🕵️"
    },
    {
        "id": 125,
        "topic": "topic26",
        "question": "What marks the location of the SANode?",
        "answer": "<li>The location of the SANode is marked consistently by a large central artery, which is a branch of either the left circumflex or posterior descending branch of the right coronary artery.</li>",
        "memoryTip": "The SANode has a big buddy artery to help everyone find it, like a lighthouse guiding ships!",
        "emoji": "🗺️"
    },
    {
        "id": 126,
        "topic": "topic27",
        "question": "What anatomical landmarks define Koch's triangle?",
        "answer": "<li>Koch's triangle is defined by the base of the tricuspid valve, the tendon of Todaro, and the anteromedial margin of the coronary sinus orifice.</li>",
        "memoryTip": "Koch's triangle is like a treasure map with three landmarks leading to the AV node treasure!",
        "emoji": "🗺️"
    },
    {
        "id": 127,
        "topic": "topic28",
        "question": "What is the conus arteriosus?",
        "answer": "<li>The conus arteriosus (infundibulum) is the outflow tract leading to the pulmonary trunk.</li>",
        "memoryTip": "The conus arteriosus is like a water slide for blood, sending it straight to the pulmonary trunk!",
        "emoji": "💦"
    },
    {
        "id": 128,
        "topic": "topic28",
        "question": "What are trabeculae carneae?",
        "answer": "<li>Trabeculae carneae are numerous muscular, irregular structures in the walls of the inflow portion of the right ventricle.</li>",
        "memoryTip": "Trabeculae carneae are like the bumpy roads of the right ventricle, making sure blood has a wild ride!",
        "emoji": "🛣️"
    },
    {
        "id": 129,
        "topic": "topic28",
        "question": "How many papillary muscles are in the right ventricle?",
        "answer": "<li>There are three papillary muscles in the right ventricle.</li>",
        "memoryTip": "The right ventricle has three papillary muscles, like a trio of musicians playing in perfect harmony!",
        "emoji": "🎶"
    },
    {
        "id": 130,
        "topic": "topic28",
        "question": "Which papillary muscle is the largest and most constant in the right ventricle?",
        "answer": "<li>The anterior papillary muscle is the largest and most constant in the right ventricle.</li>",
        "memoryTip": "The anterior papillary muscle is the \"star\" of the right ventricle show, always ready to perform!",
        "emoji": "🌟"
    },
    {
        "id": 131,
        "topic": "topic28",
        "question": "Which papillary muscle is the most inconsistent in the right ventricle?",
        "answer": "<li>The septal papillary muscle is the most inconsistent in the right ventricle.</li>",
        "memoryTip": "The septal papillary muscle is like that friend who always cancels plans—never reliable!",
        "emoji": "📅"
    },
    {
        "id": 132,
        "topic": "topic28",
        "question": "What is the septomarginal trabecula?",
        "answer": "<li>The septomarginal trabecula (moderator band) forms a bridge between the lower portion of the interventricular septum and the base of the anterior papillary muscle.</li>",
        "memoryTip": "The septomarginal trabecula is like a bridge connecting two friends in the right ventricle!",
        "emoji": "🌉"
    },
    {
        "id": 133,
        "topic": "topic29",
        "question": "Why is the left atrium not seen anteriorly?",
        "answer": "<li>The left atrium is not seen anteriorly because it is covered by the aorta and pulmonary trunk.</li>",
        "memoryTip": "The left atrium is shy and hides behind the aorta and pulmonary trunk like a kid behind a parent!",
        "emoji": "🙈"
    },
    {
        "id": 134,
        "topic": "topic29",
        "question": "Does the left atrium extend to the diaphragmatic surface?",
        "answer": "<li>No, the left atrium does not extend to the diaphragmatic surface.</li>",
        "memoryTip": "The left atrium is like a cat that prefers to stay on the couch rather than venture to the floor!",
        "emoji": "🐱"
    },
    {
        "id": 135,
        "topic": "topic29",
        "question": "What does the left atrium form in relation to the heart?",
        "answer": "<li>The left atrium forms the posterior surface (base) of the heart and lies behind the right atrium.</li>",
        "memoryTip": "The left atrium is the \"backstage\" of the heart, always behind the scenes!",
        "emoji": "🎭"
    },
    {
        "id": 136,
        "topic": "topic29",
        "question": "What does the posterior surface of the left atrium form?",
        "answer": "<li>The posterior surface of the left atrium forms the anterior wall of the oblique sinus of the pericardium, which separates the left atrium from the esophagus posteriorly.</li>",
        "memoryTip": "The left atrium's posterior surface is like a wall separating a concert from the noisy crowd outside!",
        "emoji": "🎤"
    },
    {
        "id": 137,
        "topic": "topic30",
        "question": "How many papillary muscles are typically found in the left ventricle?",
        "answer": "<li>The left ventricle typically has two papillary muscles, anterior and posterior, which are usually larger than those of the right ventricle.</li>",
        "memoryTip": "The left ventricle has two big papillary muscles, like a duo of bodybuilders lifting the heart!",
        "emoji": "💪"
    },
    {
        "id": 138,
        "topic": "topic30",
        "question": "How many semilunar cusps are present in the left ventricle?",
        "answer": "<li>There are three semilunar cusps in the left ventricle: right, left, and posterior aortic sinuses.</li>",
        "memoryTip": "The left ventricle has three semilunar cusps, like a trio of umbrellas ready for a rainstorm!",
        "emoji": "☔"
    },
    {
        "id": 139,
        "topic": "topic30",
        "question": "From where do the right and left coronary arteries originate?",
        "answer": "<li>The right and left coronary arteries originate from the right and left aortic sinuses, respectively.</li>",
        "memoryTip": "The coronary arteries are like the heart's delivery service, coming straight from the aortic sinuses!",
        "emoji": "📦"
    },
    {
        "id": 140,
        "topic": "topic30",
        "question": "What is the posterior aortic sinus sometimes referred to as?",
        "answer": "<li>The posterior aortic sinus and cusp are sometimes referred to as the non-coronary sinus and cusp.</li>",
        "memoryTip": "The posterior aortic sinus is like the \"non-cool\" kid at school, often overlooked but still important!",
        "emoji": "😎"
    },
    {
        "id": 141,
        "topic": "topic30",
        "question": "Where is the membranous part of the atrioventricular part of the interventricular septum located?",
        "answer": "<li>The membranous part of the atrioventricular part of the interventricular septum is located between the right atrium and left ventricle.</li>",
        "memoryTip": "The membranous part is like a thin wall between two roommates, keeping the peace between the right atrium and left ventricle!",
        "emoji": "🏠"
    },
    {
        "id": 142,
        "topic": "topic31",
        "question": "What does the coronary sulcus separate?",
        "answer": "<li>The coronary sulcus separates the atria from the ventricles.</li>",
        "memoryTip": "The coronary sulcus is like a fence keeping the atria and ventricles from mixing at the party!",
        "emoji": "🚧"
    },
    {
        "id": 143,
        "topic": "topic31",
        "question": "What structures are contained within the coronary sulcus?",
        "answer": "<li>The coronary sulcus contains the right coronary artery, small cardiac vein, coronary sinus, and circumflex branch of the left coronary artery.</li>",
        "memoryTip": "The coronary sulcus is like a busy street with all the important arteries and veins driving by!",
        "emoji": "🚗"
    },
    {
        "id": 144,
        "topic": "topic31",
        "question": "What does the anterior interventricular sulcus separate?",
        "answer": "<li>The anterior interventricular sulcus separates the two ventricles.</li>",
        "memoryTip": "The anterior interventricular sulcus is like a line drawn in the sand between two rival teams!",
        "emoji": "🏁"
    },
    {
        "id": 145,
        "topic": "topic31",
        "question": "What does the anterior interventricular sulcus contain?",
        "answer": "<li>The anterior interventricular sulcus contains the anterior interventricular artery and the great cardiac vein.</li>",
        "memoryTip": "The anterior interventricular sulcus is like a highway with the artery and vein cruising along!",
        "emoji": "🛣️"
    },
    {
        "id": 146,
        "topic": "topic31",
        "question": "What does the posterior interventricular sulcus contain?",
        "answer": "<li>The posterior interventricular sulcus contains the posterior interventricular artery and the middle cardiac vein.</li>",
        "memoryTip": "The posterior interventricular sulcus is like a back road where the artery and vein take a scenic route!",
        "emoji": "🛤️"
    },
    {
        "id": 147,
        "topic": "topic32",
        "question": "What are some occasional bony prominences referred to as torus?",
        "answer": "<li>Occasional bony prominences termed the torus mandibularis, torus maxillaris, and torus palatinus may lie lingual to the lower premolars or molars, and the upper molars.</li>",
        "memoryTip": "These torus structures are like little bumps on a log, popping up in the mouth!",
        "emoji": "🌳"
    },
    {
        "id": 148,
        "topic": "topic32",
        "question": "What can happen to the bony margins of the median intermaxillary palatal suture?",
        "answer": "<li>The bony margins of the median intermaxillary palatal suture are sometimes raised into a prominent longitudinal palatine torus.</li>",
        "memoryTip": "The palatine torus is like a speed bump on the palate, reminding you to slow down!",
        "emoji": "🛑"
    },
    {
        "id": 149,
        "topic": "topic32",
        "question": "What is the Torus Tubarius?",
        "answer": "<li>The Torus Tubarius is the tissue surrounding the eustachian tube.</li>",
        "memoryTip": "The Torus Tubarius is like a cozy blanket around the eustachian tube, keeping it warm and snug!",
        "emoji": "🛏️"
    },
    {
        "id": 150,
        "topic": "topic33",
        "question": "What part of the interventricular septum is supplied by the ascending branch of the LAD artery?",
        "answer": "<li>The anterior two-thirds of the interventricular septum is supplied by the ascending branch of the LAD artery.</li>",
        "memoryTip": "Think of the LAD as the \"leading\" artery, always taking the front seat in the septum!",
        "emoji": "🚗"
    },
    {
        "id": 151,
        "topic": "topic33",
        "question": "Which artery supplies the posterior part of the interventricular septum?",
        "answer": "<li>The posterior part of the interventricular septum is supplied by the right coronary artery (RCA).</li>",
        "memoryTip": "The RCA is like the backseat driver, taking care of the posterior part!",
        "emoji": "🚙"
    },
    {
        "id": 152,
        "topic": "topic33",
        "question": "What is the terminal branch of the right coronary artery called?",
        "answer": "<li>The terminal branch of the right coronary artery is called the posterior descending artery (PDA).</li>",
        "memoryTip": "Think of the PDA as the \"final destination\" for the RCA's journey!",
        "emoji": "🏁"
    },
    {
        "id": 153,
        "topic": "topic33",
        "question": "What is the main stem vessel of the left coronary artery referred to as?",
        "answer": "<li>The main stem vessel of the left coronary artery is referred to as the short left coronary artery.</li>",
        "memoryTip": "The short left coronary artery is like a quick pit stop before the big race!",
        "emoji": "⛽"
    },
    {
        "id": 154,
        "topic": "topic33",
        "question": "What is the common name for the left anterior descending artery (LAD)?",
        "answer": "<li>The left anterior descending artery (LAD) is commonly known as the widow's artery or anterior interventricular artery.</li>",
        "memoryTip": "The LAD is so important, it could leave someone \"widowed\" if it gets blocked!",
        "emoji": "💔"
    },
    {
        "id": 155,
        "topic": "topic33",
        "question": "Which arteries are branches of the left coronary artery (LCA)?",
        "answer": "<li>Kugel's artery, diagonal artery, and obtuse marginal artery are branches of the left coronary artery (LCA).</li>",
        "memoryTip": "Think of these branches as the \"Kugel\" of fun at the left coronary party!",
        "emoji": "🎉"
    },
    {
        "id": 156,
        "topic": "topic33",
        "question": "What are the branches of the right coronary artery (RCA)?",
        "answer": "<li>The posterior interventricular artery and marginal artery are branches of the right coronary artery (RCA).</li>",
        "memoryTip": "The RCA has a \"marginal\" attitude, always branching out!",
        "emoji": "🌳"
    },
    {
        "id": 157,
        "topic": "topic33",
        "question": "What do the branches of the right coronary artery supply?",
        "answer": "<li>The branches of the right coronary artery supply the right atrium and ventricle, and variably parts of the left chambers and atrioventricular septum.</li>",
        "memoryTip": "The RCA is like a generous friend, sharing supplies with both the right and sometimes the left!",
        "emoji": "🤝"
    },
    {
        "id": 158,
        "topic": "topic33",
        "question": "What is the first branch that arises separately from the anterior aortic sinus in 36% of individuals?",
        "answer": "<li>The first branch is the arteria coni arteriosi or conus artery.</li>",
        "memoryTip": "The conus artery is like the \"first responder\" in the coronary world, always ready to branch out!",
        "emoji": "🚨"
    },
    {
        "id": 159,
        "topic": "topic33",
        "question": "What is another name for the conus artery?",
        "answer": "<li>The conus artery is sometimes termed a \"third coronary\" artery, but it is more correctly named the right conus artery.</li>",
        "memoryTip": "The conus artery is the \"third wheel\" in the coronary trio, but it knows its place!",
        "emoji": "🛞"
    },
    {
        "id": 160,
        "topic": "topic33",
        "question": "Where does the conus artery ramify?",
        "answer": "<li>The conus artery ramifies anteriorly on the lowest part of the pulmonary conus and the upper part of the right ventricle.</li>",
        "memoryTip": "The conus artery is like a gardener, spreading its branches in the right ventricle garden!",
        "emoji": "🌱"
    },
    {
        "id": 161,
        "topic": "topic33",
        "question": "What is the anastomosis formed by the conus artery and a similar left coronary branch called?",
        "answer": "<li>The anastomosis is called the \"anulus of Vieussens.\"</li>",
        "memoryTip": "The anulus of Vieussens is like a \"ring\" of friendship between the right and left coronary branches!",
        "emoji": "💍"
    },
    {
        "id": 162,
        "topic": "topic33",
        "question": "In what percentage of cases does the right coronary artery give rise to the posterior interventricular artery?",
        "answer": "<li>In 90% of cases, the right coronary artery gives rise to the posterior interventricular artery.</li>",
        "memoryTip": "The RCA is the \"90% club\" when it comes to supplying the posterior interventricular artery!",
        "emoji": "📊"
    },
    {
        "id": 163,
        "topic": "topic33",
        "question": "In what percentage of cases is the posterior interventricular artery a branch of the circumflex artery?",
        "answer": "<li>In 10% of cases, the posterior interventricular artery is a branch of the circumflex artery.</li>",
        "memoryTip": "The circumflex artery is the \"10% surprise\" in the coronary world!",
        "emoji": "🎲"
    },
    {
        "id": 164,
        "topic": "topic34",
        "question": "From where does the right coronary artery arise?",
        "answer": "<li>The right coronary artery arises from the anterior aortic sinus of the ascending aorta.</li>",
        "memoryTip": "The right coronary artery is like a VIP guest, coming straight from the \"front\" of the aorta!",
        "emoji": "🎟️"
    },
    {
        "id": 165,
        "topic": "topic34",
        "question": "From where does the left coronary artery arise?",
        "answer": "<li>The left coronary artery arises from the left posterior aortic sinus of the ascending aorta.</li>",
        "memoryTip": "The left coronary artery is the \"backstage pass\" of the aorta, sneaking in from the left!",
        "emoji": "🎤"
    },
    {
        "id": 166,
        "topic": "topic34",
        "question": "Between which two structures does the right coronary artery course?",
        "answer": "<li>The right coronary artery courses between the pulmonary trunk and the right auricle.</li>",
        "memoryTip": "The right coronary artery is like a tightrope walker, balancing between the trunk and the auricle!",
        "emoji": "🎪"
    },
    {
        "id": 167,
        "topic": "topic34",
        "question": "Between which two structures does the left coronary artery course?",
        "answer": "<li>The left coronary artery courses between the pulmonary trunk and the left auricle.</li>",
        "memoryTip": "The left coronary artery is also a tightrope walker, but on the left side of the pulmonary trunk!",
        "emoji": "🎭"
    },
    {
        "id": 168,
        "topic": "topic34",
        "question": "In which sulcus does the right coronary artery run?",
        "answer": "<li>The right coronary artery runs in the right anterior coronary sulcus.</li>",
        "memoryTip": "The right coronary artery is like a runner, always on the right track in the sulcus!",
        "emoji": "🏃‍♂️"
    },
    {
        "id": 169,
        "topic": "topic34",
        "question": "In which sulcus does the left coronary artery run?",
        "answer": "<li>The left coronary artery runs in the left anterior coronary sulcus.</li>",
        "memoryTip": "The left coronary artery is also a runner, but it prefers the left track!",
        "emoji": "🏃‍♀️"
    },
    {
        "id": 170,
        "topic": "topic35",
        "question": "Where does the artery that lies in the posterior interventricular groove anastomose?",
        "answer": "<li>It anastomoses with the circumflex branch of the left coronary artery.</li>",
        "memoryTip": "Think of it as a \"groovy\" dance move where the arteries join together for a smooth flow!",
        "emoji": "🎶"
    },
    {
        "id": 171,
        "topic": "topic35",
        "question": "What artery lies in the anterior interventricular groove?",
        "answer": "<li>The artery that lies in the anterior interventricular groove gives the anterior descending branch and continues as the circumflex artery.</li>",
        "memoryTip": "Imagine the artery taking a \"descend\" down the dance floor before making a \"circumflex\" turn!",
        "emoji": "💃"
    },
    {
        "id": 172,
        "topic": "topic36",
        "question": "What are the branches of the artery in the posterior interventricular groove?",
        "answer": "<li>The branches include the posterior interventricular artery (posterior descending A), acute marginal artery, right conus artery, SA nodal artery (in 65% of cases), and atrial, anterior, and posterior ventricular branches.</li>",
        "memoryTip": "Remember the \"posterior party\" with all its branches, like a family reunion where everyone shows up!",
        "emoji": "🎉"
    },
    {
        "id": 173,
        "topic": "topic36",
        "question": "What are the branches of the artery in the anterior interventricular groove?",
        "answer": "<li>The branches include the anterior interventricular artery (anterior descending A), circumflex artery, left diagonal artery, obtuse marginal artery, and atrial, anterior, and posterior ventricular branches.</li>",
        "memoryTip": "The \"anterior crew\" has a lot of branches, like a tree with many limbs reaching out!",
        "emoji": "🌳"
    },
    {
        "id": 174,
        "topic": "topic37",
        "question": "What does the artery in the posterior interventricular groove supply?",
        "answer": "<li>It supplies the right atrium, most of the right ventricle (except the area adjoining the anterior interventricular groove), a small part of the left ventricle adjoining the posterior interventricular groove, the posterior part of the interventricular septum, and the entire conducting system except the right bundle branch and part of the left branch of the AV bundle.</li>",
        "memoryTip": "Think of it as the \"posterior delivery service\" that covers a lot of ground but skips a few spots!",
        "emoji": "📦"
    },
    {
        "id": 175,
        "topic": "topic37",
        "question": "What does the artery in the anterior interventricular groove supply?",
        "answer": "<li>It supplies the left atrium, most of the left ventricle (except the area adjoining the posterior interventricular groove), a small part of the right ventricle adjoining the anterior interventricular groove, the anterior part of the interventricular septum, the right bundle branch, and part of the left branch of the AV bundle.</li>",
        "memoryTip": "The \"anterior delivery\" is thorough, making sure to cover all the important areas, just like a diligent mailman!",
        "emoji": "📬"
    },
    {
        "id": 176,
        "topic": "topic38",
        "question": "In what percentage of cases is the SA node supplied by the right coronary artery?",
        "answer": "<li>In 65% of cases, the SA node is supplied by the right coronary artery, while in 35% of cases, it is supplied by the left coronary artery.</li>",
        "memoryTip": "Picture the SA node as a popular kid at school, getting supplies from both the right and left sides!",
        "emoji": "🏫"
    },
    {
        "id": 177,
        "topic": "topic39",
        "question": "Which artery supplies the AV node, AV bundle, and Bundle of His?",
        "answer": "<li>The right coronary artery supplies the AV node, AV bundle, and Bundle of His.</li>",
        "memoryTip": "Think of the right coronary artery as the \"AV delivery guy\" bringing all the important packages!",
        "emoji": "📦"
    },
    {
        "id": 178,
        "topic": "topic39",
        "question": "Which artery supplies the right bundle branch?",
        "answer": "<li>The left coronary artery supplies the right bundle branch.</li>",
        "memoryTip": "Imagine the left coronary artery as the \"right-hand man\" taking care of the right bundle branch!",
        "emoji": "🤝"
    },
    {
        "id": 179,
        "topic": "topic39",
        "question": "Which artery primarily supplies the left bundle branch?",
        "answer": "<li>The left bundle branch is mostly supplied by the left coronary artery, with a few parts supplied by the right coronary artery.</li>",
        "memoryTip": "The left bundle branch is like a team mostly made up of lefties, but with a few righties joining in!",
        "emoji": "🏀"
    },
    {
        "id": 180,
        "topic": "topic40",
        "question": "Where is the coronary sinus located?",
        "answer": "<li>The coronary sinus is the largest vein of the heart, situated in the left posterior coronary sulcus.</li>",
        "memoryTip": "Think of the coronary sinus as the \"biggest vein\" in a heart-shaped pool party!",
        "emoji": "🏊"
    },
    {
        "id": 181,
        "topic": "topic40",
        "question": "Where does the coronary sinus end?",
        "answer": "<li>It ends by opening into the posterior wall of the right atrium between the IVC opening and the AV orifice.</li>",
        "memoryTip": "Picture the coronary sinus as a water slide that ends right into the atrium pool!",
        "emoji": "🌊"
    },
    {
        "id": 182,
        "topic": "topic40",
        "question": "What guards the orifice of the coronary sinus?",
        "answer": "<li>The orifice of the coronary sinus is guarded by the Thebesian valve.</li>",
        "memoryTip": "Imagine the Thebesian valve as a bouncer at the entrance of the atrium club!",
        "emoji": "🚪"
    },
    {
        "id": 183,
        "topic": "topic40",
        "question": "What guards the IVC orifice?",
        "answer": "<li>The IVC orifice is guarded by a rudimentary Eustachian valve.</li>",
        "memoryTip": "Think of the Eustachian valve as a \"backup bouncer\" just in case the main one is busy!",
        "emoji": "🛡️"
    },
    {
        "id": 184,
        "topic": "topic40",
        "question": "Does the SVC orifice have a valve?",
        "answer": "<li>No, the SVC orifice has no valve.</li>",
        "memoryTip": "The SVC is like the open door policy of a club—everyone can come in without a check!",
        "emoji": "🚪"
    },
    {
        "id": 185,
        "topic": "topic41",
        "question": "Where is the superficial cardiac plexus located?",
        "answer": "<li>Below the arch of the aorta in front of the right pulmonary artery.</li>",
        "memoryTip": "Think of the superficial plexus as a \"super\" hero hiding just below the aorta, ready to save the day!",
        "emoji": "🦸‍♂️"
    },
    {
        "id": 186,
        "topic": "topic41",
        "question": "What are the components of the superficial cardiac plexus?",
        "answer": "<li>Superior cervical cardiac branch of the left sympathetic chain and inferior cervical cardiac branch of the left vagus.</li>",
        "memoryTip": "The superficial plexus is like a team of superheroes: the \"Superior\" and \"Inferior\" branches always work together!",
        "emoji": "🦸‍♀️"
    },
    {
        "id": 187,
        "topic": "topic41",
        "question": "Where is the deep cardiac plexus located?",
        "answer": "<li>In front of the tracheal bifurcation and behind the arch of the aorta.</li>",
        "memoryTip": "The deep plexus is like a secret agent, hiding behind the aorta and watching over the trachea!",
        "emoji": "🕵️‍♂️"
    },
    {
        "id": 188,
        "topic": "topic41",
        "question": "What are the components of the deep cardiac plexus?",
        "answer": "<li>All the cardiac branches derived from all the cervical and upper thoracic ganglia of the sympathetic chain, and cardiac branches of the vagus except those forming the superficial plexus.</li>",
        "memoryTip": "The deep plexus has a lot of connections, like a social butterfly at a party, mingling with all the branches!",
        "emoji": "🦋"
    },
    {
        "id": 189,
        "topic": "topic42",
        "question": "What is the function of the great cardiac vein?",
        "answer": "<li>It enters the left end of the coronary sinus at its origin.</li>",
        "memoryTip": "The great cardiac vein is like a VIP guest entering the exclusive coronary sinus club!",
        "emoji": "🎟️"
    },
    {
        "id": 190,
        "topic": "topic42",
        "question": "Where does the middle cardiac vein join?",
        "answer": "<li>It joins the middle part of the coronary sinus.</li>",
        "memoryTip": "The middle cardiac vein is the middle child, always trying to fit in with the coronary sinus family!",
        "emoji": "👶"
    },
    {
        "id": 191,
        "topic": "topic42",
        "question": "What does the small cardiac vein do?",
        "answer": "<li>It joins the right end of the coronary sinus.</li>",
        "memoryTip": "The small cardiac vein is like a little helper, always there to support the right end of the coronary sinus!",
        "emoji": "🤝"
    },
    {
        "id": 192,
        "topic": "topic42",
        "question": "Where does the posterior vein of the left ventricle end?",
        "answer": "<li>It ends in the middle of the coronary sinus.</li>",
        "memoryTip": "The posterior vein is like a shy friend who quietly joins the party in the middle of the coronary sinus!",
        "emoji": "🤫"
    },
    {
        "id": 193,
        "topic": "topic42",
        "question": "What is the oblique vein of Marshall?",
        "answer": "<li>It terminates in the left end of the coronary sinus and develops from the left common cardinal vein (duct of Cuvier).</li>",
        "memoryTip": "The oblique vein of Marshall is like a twisty slide that ends at the left end of the coronary sinus!",
        "emoji": "🎢"
    },
    {
        "id": 194,
        "topic": "topic42",
        "question": "How many anterior cardiac veins are there?",
        "answer": "<li>There are 3 or 4 small veins.</li>",
        "memoryTip": "The anterior cardiac veins are like a small band of musicians playing in harmony on the right ventricle!",
        "emoji": "🎶"
    },
    {
        "id": 195,
        "topic": "topic42",
        "question": "Where do the anterior cardiac veins open?",
        "answer": "<li>They open directly into the right atrium through its anterior wall.</li>",
        "memoryTip": "The anterior cardiac veins are like direct flights to the right atrium, no layovers!",
        "emoji": "✈️"
    },
    {
        "id": 196,
        "topic": "topic42",
        "question": "What are Thebesian veins?",
        "answer": "<li>They are numerous small veins present in all four chambers of the heart.</li>",
        "memoryTip": "Thebesian veins are like tiny secret passages in a castle, sneaking in and out of all chambers!",
        "emoji": "🏰"
    },
    {
        "id": 197,
        "topic": "topic42",
        "question": "Where do Thebesian veins open?",
        "answer": "<li>They open directly into the cavity of the heart.</li>",
        "memoryTip": "Thebesian veins are like little doors that lead straight into the heart's party!",
        "emoji": "🚪"
    },
    {
        "id": 198,
        "topic": "topic42",
        "question": "Which side of the heart has more venae cordis minimi?",
        "answer": "<li>The right side has more venae cordis minimi.</li>",
        "memoryTip": "The right side is like a popular club, always packed with more tiny veins!",
        "emoji": "🎉"
    },
    {
        "id": 199,
        "topic": "topic43",
        "question": "What is the sympathetic innervation to the heart?",
        "answer": "<li>It is by T1-T4.</li>",
        "memoryTip": "Think of T1-T4 as the \"T\" team, always ready to pump up the heart!",
        "emoji": "💪"
    },
    {
        "id": 200,
        "topic": "topic43",
        "question": "How do sympathetic fibers interact with the vagus nerve?",
        "answer": "<li>Sympathetic fibers intermingle with the vagus to form the cardiac plexus.</li>",
        "memoryTip": "The sympathetic fibers and vagus are like dance partners, twirling together to form a beautiful cardiac plexus!",
        "emoji": "💃"
    },
    {
        "id": 201,
        "topic": "topic44",
        "question": "What are the main spinal roots of the phrenic nerve?",
        "answer": "<li>C3, C4 (mainly) & C5.</li>",
        "memoryTip": "The phrenic nerve is like a trio of friends (C3, C4, and C5) working together to keep the diaphragm happy!",
        "emoji": "🎤"
    },
    {
        "id": 202,
        "topic": "topic44",
        "question": "Where is the phrenic nerve formed?",
        "answer": "<li>It is formed at the upper part of the lateral border of the scalenus anterior.</li>",
        "memoryTip": "The phrenic nerve is like a construction crew forming at the scalenus site, ready to build up the diaphragm!",
        "emoji": "🏗️"
    },
    {
        "id": 203,
        "topic": "topic44",
        "question": "How does the phrenic nerve enter the thorax?",
        "answer": "<li>It crosses medially in front of the internal thoracic artery.</li>",
        "memoryTip": "The phrenic nerve is like a brave explorer crossing the internal thoracic river to reach the thorax!",
        "emoji": "🏞️"
    },
    {
        "id": 204,
        "topic": "topic44",
        "question": "What is the accessory phrenic nerve composed of?",
        "answer": "<li>It is composed of fibers from the fifth cervical ventral ramus which run in a branch of the nerve to subclavius.</li>",
        "memoryTip": "The accessory phrenic nerve is like a sidekick, always ready to lend a hand to the main phrenic nerve!",
        "emoji": "🦸‍♂️"
    },
    {
        "id": 205,
        "topic": "topic44",
        "question": "Where does the accessory phrenic nerve usually join the phrenic nerve?",
        "answer": "<li>Near the first rib.</li>",
        "memoryTip": "The accessory phrenic nerve is like a buddy meeting up with the phrenic nerve for a rib-tickling adventure!",
        "emoji": "🦴"
    },
    {
        "id": 206,
        "topic": "topic44",
        "question": "From where else can the accessory phrenic nerve be derived?",
        "answer": "<li>It may also be derived from the fourth or sixth cervical ventral rami or from the ansa cervicalis.</li>",
        "memoryTip": "The accessory phrenic nerve has many origins, like a family reunion with relatives from all over!",
        "emoji": "👪"
    },
    {
        "id": 207,
        "topic": "topic45",
        "question": "What is the subclavian artery?",
        "answer": "<li>It is the principal artery of the upper limb.</li>",
        "memoryTip": "The subclavian artery is like the main highway for blood traveling to the upper limb!",
        "emoji": "🛣️"
    },
    {
        "id": 208,
        "topic": "topic45",
        "question": "Where does the subclavian artery branch from on the right side?",
        "answer": "<li>It branches from the brachiocephalic artery.</li>",
        "memoryTip": "The right subclavian artery is like a right-hand man, branching off from the brachiocephalic boss!",
        "emoji": "🤝"
    },
    {
        "id": 209,
        "topic": "topic45",
        "question": "Where does the subclavian artery branch from on the left side?",
        "answer": "<li>It is a branch of the arch of the aorta.</li>",
        "memoryTip": "The left subclavian artery is like a left-handed artist, branching off from the grand arch of the aorta!",
        "emoji": "🎨"
    },
    {
        "id": 210,
        "topic": "topic45",
        "question": "What can compress the subclavian artery?",
        "answer": "<li>A cervical rib may compress the subclavian artery, affecting the radial pulse.</li>",
        "memoryTip": "A cervical rib is like a sneaky villain, trying to squeeze the life out of the subclavian artery!",
        "emoji": "🦹‍♂️"
    },
    {
        "id": 211,
        "topic": "topic45",
        "question": "What is dysphagia lusoria?",
        "answer": "<li>It is a condition where the right subclavian artery arises from the descending thoracic aorta and passes posterior to the esophagus, causing compression.</li>",
        "memoryTip": "Dysphagia lusoria is like a game of hide and seek, where the artery hides behind the esophagus, causing trouble!",
        "emoji": "🙈"
    },
    {
        "id": 212,
        "topic": "topic45",
        "question": "How is the subclavian artery divided?",
        "answer": "<li>It is divided into three parts by the scalenus anterior.</li>",
        "memoryTip": "The scalenus anterior is like a referee, dividing the subclavian artery into three distinct teams!",
        "emoji": "🏅"
    },
    {
        "id": 213,
        "topic": "topic46",
        "question": "What is the first and largest branch of the subclavian artery?",
        "answer": "<li>The vertebral artery.</li>",
        "memoryTip": "The vertebral artery is like the big brother of the subclavian family, always leading the way!",
        "emoji": "👨‍👦"
    },
    {
        "id": 214,
        "topic": "topic46",
        "question": "What is another branch of the first part of the subclavian artery?",
        "answer": "<li>The internal thoracic artery.</li>",
        "memoryTip": "The internal thoracic artery is like a cozy blanket, wrapping around the inside of the thorax!",
        "emoji": "🛌"
    },
    {
        "id": 215,
        "topic": "topic46",
        "question": "What is the thyrocervical trunk?",
        "answer": "<li>It is a branch of the first part of the subclavian artery.</li>",
        "memoryTip": "The thyrocervical trunk is like a tree with branches reaching out to the thyroid and cervical areas!",
        "emoji": "🌳"
    },
    {
        "id": 216,
        "topic": "topic47",
        "question": "What are the tributaries of the Hemiazygos vein?",
        "answer": "<li>The tributaries of the Hemiazygos vein include the lowest four or five left posterior intercostal veins, esophageal veins, and mediastinal veins.</li>",
        "memoryTip": "Think of the Hemiazygos vein as a \"hemisphere\" collecting all the left-side \"intercostal\" friends for a party!",
        "emoji": "🎉"
    },
    {
        "id": 217,
        "topic": "topic47",
        "question": "What are the tributaries of the Accessory Hemiazygos vein?",
        "answer": "<li>The tributaries of the Accessory Hemiazygos vein include the fourth to eighth left posterior intercostal veins and left bronchial veins.</li>",
        "memoryTip": "The Accessory Hemiazygos vein is like the \"assistant\" collecting extra guests from the left side for the intercostal gathering!",
        "emoji": "🥳"
    },
    {
        "id": 218,
        "topic": "topic48",
        "question": "What is the primary function of the Azygos vein?",
        "answer": "<li>The Azygos vein drains the thoracic wall and upper lumbar region and connects the superior and inferior venae cava.</li>",
        "memoryTip": "The Azygos vein is like a \"bridge\" connecting two major highways of blood flow!",
        "emoji": "🌉"
    },
    {
        "id": 219,
        "topic": "topic48",
        "question": "Where does the Azygos vein end?",
        "answer": "<li>The Azygos vein ends by joining the superior vena cava (SVC).</li>",
        "memoryTip": "Think of the Azygos vein as the final contestant in a race, crossing the finish line at the SVC!",
        "emoji": "🏁"
    },
    {
        "id": 220,
        "topic": "topic48",
        "question": "What forms the Azygos vein?",
        "answer": "<li>The Azygos vein is formed by the union of the lumbar azygos vein, right subcostal vein, and right ascending lumbar vein.</li>",
        "memoryTip": "The Azygos vein is like a team formed by three friends: Lumbar, Subcostal, and Ascending!",
        "emoji": "🤝"
    },
    {
        "id": 221,
        "topic": "topic48",
        "question": "How does the Azygos vein enter the thorax?",
        "answer": "<li>The Azygos vein enters the thorax by passing through the aortic opening of the diaphragm.</li>",
        "memoryTip": "Imagine the Azygos vein as a sneaky spy slipping through the \"aortic door\" into the thorax!",
        "emoji": "🕵️"
    },
    {
        "id": 222,
        "topic": "topic48",
        "question": "What is the course of the Azygos vein in the thorax?",
        "answer": "<li>The Azygos vein ascends to the fifth thoracic vertebra where it arches forwards over the root of the right lung.</li>",
        "memoryTip": "Picture the Azygos vein as a roller coaster that goes up to the fifth vertebra and then takes a thrilling turn over the lung!",
        "emoji": "🎢"
    },
    {
        "id": 223,
        "topic": "topic48",
        "question": "Which veins are tributaries to the Azygos vein?",
        "answer": "<li>Tributaries to the Azygos vein include the right superior intercostal veins, 5th to 11th right posterior intercostal veins, hemiazygos vein, accessory hemiazygos vein, right bronchial vein, and several esophageal, mediastinal, and pericardial veins.</li>",
        "memoryTip": "The Azygos vein is like a big family reunion, gathering all the right-side relatives from intercostals to bronchials!",
        "emoji": "👨‍👩‍👧‍👦"
    },
    {
        "id": 224,
        "topic": "topic49",
        "question": "How many ganglia are in the thoracic sympathetic chain?",
        "answer": "<li>The thoracic sympathetic chain contains 12 ganglia.</li>",
        "memoryTip": "Think of the 12 ganglia as a dozen eggs in a carton, all lined up and ready to go!",
        "emoji": "🥚"
    },
    {
        "id": 225,
        "topic": "topic49",
        "question": "What happens to the first thoracic ganglion?",
        "answer": "<li>The first thoracic ganglion fuses with the inferior cervical ganglion to form the stellate ganglion.</li>",
        "memoryTip": "Imagine the first ganglion as a star that fuses with a friend to form a \"stellate\" constellation!",
        "emoji": "⭐"
    },
    {
        "id": 226,
        "topic": "topic49",
        "question": "What are the roots of the thoracic splanchnic nerve?",
        "answer": "<li>The thoracic splanchnic nerve has five roots from T5 to T12, which innervate the heart and lungs.</li>",
        "memoryTip": "The thoracic splanchnic nerve is like a five-fingered hand reaching out to the heart and lungs!",
        "emoji": "✋"
    },
    {
        "id": 227,
        "topic": "topic49",
        "question": "What is the origin of the greater splanchnic nerve?",
        "answer": "<li>The greater splanchnic nerve has roots from T5 to T9 and innervates the upper part of the gastrointestinal tract.</li>",
        "memoryTip": "The greater splanchnic nerve is like a big spoon stirring up the upper GI soup!",
        "emoji": "🥄"
    },
    {
        "id": 228,
        "topic": "topic49",
        "question": "What is the origin of the lesser splanchnic nerve?",
        "answer": "<li>The lesser splanchnic nerve has roots from T10 to T11 and innervates the midgut.</li>",
        "memoryTip": "The lesser splanchnic nerve is like a smaller spoon, perfect for stirring the midgut stew!",
        "emoji": "🍲"
    },
    {
        "id": 229,
        "topic": "topic49",
        "question": "What is the origin of the least splanchnic nerve?",
        "answer": "<li>The least splanchnic nerve has roots from T12 and innervates the adrenal medulla and gonads.</li>",
        "memoryTip": "The least splanchnic nerve is like a tiny spoon, just right for the adrenal and gonadal toppings!",
        "emoji": "🍦"
    },
    {
        "id": 230,
        "topic": "topic50",
        "question": "What crosses anteriorly over the branches of the arch of the aorta?",
        "answer": "<li>The left brachiocephalic vein crosses anteriorly over all three branches of the arch of the aorta.</li>",
        "memoryTip": "Picture the left brachiocephalic vein as a traffic cop directing cars over the aorta's branches!",
        "emoji": "🚦"
    },
    {
        "id": 231,
        "topic": "topic50",
        "question": "What is the first and largest branch of the arch of the aorta?",
        "answer": "<li>The first and largest branch of the arch of the aorta is the brachiocephalic trunk, which divides into the right common carotid artery, right subclavian artery, and thyroid ima artery.</li>",
        "memoryTip": "The brachiocephalic trunk is like a big tree branching out into three important arteries!",
        "emoji": "🌳"
    },
    {
        "id": 232,
        "topic": "topic50",
        "question": "What is the second branch of the arch of the aorta?",
        "answer": "<li>The second branch of the arch of the aorta is the left common carotid artery.</li>",
        "memoryTip": "The left common carotid artery is like the left-hand branch of a tree, reaching out for the head!",
        "emoji": "🌿"
    },
    {
        "id": 233,
        "topic": "topic50",
        "question": "What is the third branch of the arch of the aorta?",
        "answer": "<li>The third branch of the arch of the aorta is the left subclavian artery.</li>",
        "memoryTip": "The left subclavian artery is like the left arm of the tree, ready to give a hug!",
        "emoji": "🤗"
    },
    {
        "id": 234,
        "topic": "topic51",
        "question": "What are the pericardial branches of the thoracic aorta?",
        "answer": "<li>The pericardial branches are small arteries that supply the pericardium.</li>",
        "memoryTip": "Think of the pericardial branches as the \"heart's umbrella,\" keeping it dry!",
        "emoji": "☂️"
    },
    {
        "id": 235,
        "topic": "topic51",
        "question": "How many bronchial arteries arise from the thoracic aorta?",
        "answer": "<li>There are two left bronchial arteries and one right bronchial artery.</li>",
        "memoryTip": "Two lefties and a righty walk into a bronchus!",
        "emoji": "🚶‍♂️"
    },
    {
        "id": 236,
        "topic": "topic51",
        "question": "From where does the right bronchial artery originate?",
        "answer": "<li>The right bronchial artery originates from the 3rd posterior intercostal artery or the upper left bronchial artery.</li>",
        "memoryTip": "The right bronchial artery is like a sneaky ninja, coming from unexpected places!",
        "emoji": "🥷"
    },
    {
        "id": 237,
        "topic": "topic51",
        "question": "How many esophageal branches come from the thoracic aorta?",
        "answer": "<li>There are four or five esophageal branches from the anterior aspect of the thoracic aorta.</li>",
        "memoryTip": "Four or five esophageal branches? That's a \"throat\" full of options!",
        "emoji": "👅"
    },
    {
        "id": 238,
        "topic": "topic51",
        "question": "What do the mediastinal branches supply?",
        "answer": "<li>The mediastinal branches supply lymph nodes, vessels, nerves, and areolar tissue in the posterior mediastinum.</li>",
        "memoryTip": "Think of mediastinal branches as the \"post office\" of the mediastinum, delivering supplies!",
        "emoji": "📦"
    },
    {
        "id": 239,
        "topic": "topic51",
        "question": "How many pairs of posterior intercostal arteries are there?",
        "answer": "<li>There are usually nine pairs of posterior intercostal arteries.</li>",
        "memoryTip": "Nine pairs of intercostal arteries? That's a lot of \"rib-tickling\" fun!",
        "emoji": "😂"
    },
    {
        "id": 240,
        "topic": "topic51",
        "question": "Which arteries supply the first two intercostal spaces?",
        "answer": "<li>The first two intercostal spaces are supplied by the supreme intercostal artery, a branch of the costo-cervical trunk.</li>",
        "memoryTip": "The supreme intercostal artery is like the VIP pass for the first two spaces!",
        "emoji": "🎟️"
    },
    {
        "id": 241,
        "topic": "topic51",
        "question": "What do the superior phrenic arteries anastomose with?",
        "answer": "<li>The superior phrenic arteries anastomose with the musculophrenic and pericardiacophrenic arteries.</li>",
        "memoryTip": "Think of the superior phrenic arteries as the \"social butterflies\" mingling with friends!",
        "emoji": "🦋"
    },
    {
        "id": 242,
        "topic": "topic51",
        "question": "Where is the subcostal artery located?",
        "answer": "<li>The subcostal artery is the lowest pair of branches from the thoracic aorta, located inferior to rib XII.</li>",
        "memoryTip": "The subcostal artery is like the \"bottom of the barrel\" in the aorta's family tree!",
        "emoji": "🍂"
    },
    {
        "id": 243,
        "topic": "topic52",
        "question": "What does the superior epigastric artery supply?",
        "answer": "<li>The superior epigastric artery continues inferiorly into the anterior abdominal wall.</li>",
        "memoryTip": "The superior epigastric artery is like a \"road trip\" down to the belly!",
        "emoji": "🚗"
    },
    {
        "id": 244,
        "topic": "topic52",
        "question": "What is the course of the musculophrenic artery?",
        "answer": "<li>The musculophrenic artery passes along the costal margin, goes through the diaphragm, and ends near the last intercostal space.</li>",
        "memoryTip": "The musculophrenic artery is the \"muscle car\" cruising along the costal highway!",
        "emoji": "🏎️"
    },
    {
        "id": 245,
        "topic": "topic53",
        "question": "What are the branches of the subscapular artery?",
        "answer": "<li>The branches of the subscapular artery include the circumflex scapular artery and the thoracodorsal artery.</li>",
        "memoryTip": "The subscapular artery has a \"scapular\" entourage, always bringing friends along!",
        "emoji": "👯‍♂️"
    },
    {
        "id": 246,
        "topic": "topic53",
        "question": "What artery is the dorsal scapular artery a branch of?",
        "answer": "<li>The dorsal scapular artery is a branch of the transverse cervical artery.</li>",
        "memoryTip": "The dorsal scapular artery is like a \"backstage pass\" to the cervical concert!",
        "emoji": "🎤"
    },
    {
        "id": 247,
        "topic": "topic54",
        "question": "What forms the superior vena cava?",
        "answer": "<li>The right and left brachiocephalic veins join to form the superior vena cava.</li>",
        "memoryTip": "The brachiocephalic veins are like two friends joining forces to create a \"super\" team!",
        "emoji": "💪"
    },
    {
        "id": 248,
        "topic": "topic54",
        "question": "Where does the superior vena cava terminate?",
        "answer": "<li>The superior vena cava terminates at the lower edge of the right third costal cartilage, where it joins the right atrium.</li>",
        "memoryTip": "The superior vena cava is like a \"final destination\" for blood before it meets the heart!",
        "emoji": "🏁"
    },
    {
        "id": 249,
        "topic": "topic55",
        "question": "What tributaries drain into the right brachiocephalic vein?",
        "answer": "<li>The right brachiocephalic vein receives tributaries from the vertebral, first posterior intercostal, and internal thoracic veins.</li>",
        "memoryTip": "The right brachiocephalic vein is like a \"collector\" of all the best tributaries!",
        "emoji": "🧾"
    },
    {
        "id": 250,
        "topic": "topic55",
        "question": "What tributaries drain into the left brachiocephalic vein?",
        "answer": "<li>The left brachiocephalic vein receives tributaries from the vertebral, first posterior intercostal, left superior intercostal, inferior thyroid, and internal thoracic veins.</li>",
        "memoryTip": "The left brachiocephalic vein is the \"overachiever,\" collecting all the tributaries it can find!",
        "emoji": "🏆"
    },
    {
        "id": 251,
        "topic": "topic55",
        "question": "What veins drain into the left superior intercostal vein?",
        "answer": "<li>The left superior intercostal vein drains tributaries from the 2nd, 3rd, and occasionally 4th posterior intercostal veins, left bronchial veins, and sometimes the left pericardiophrenic vein.</li>",
        "memoryTip": "The left superior intercostal vein is like a \"team player,\" gathering support from all its friends!",
        "emoji": "🤝"
    },
    {
        "id": 252,
        "topic": "topic56",
        "question": "What type of muscle is found in the upper third of the oesophagus?",
        "answer": "<li>The upper third of the oesophagus is composed of striated muscle.</li>",
        "memoryTip": "Think of the upper oesophagus as a \"muscle-bound\" bodybuilder flexing with striated muscles!",
        "emoji": "💪"
    },
    {
        "id": 253,
        "topic": "topic56",
        "question": "What type of muscle is found in the middle third of the oesophagus?",
        "answer": "<li>The middle third of the oesophagus contains both striated muscle and smooth muscle.</li>",
        "memoryTip": "The middle oesophagus is like a mixed martial artist, combining the strength of striated and the smoothness of smooth muscle!",
        "emoji": "🥋"
    },
    {
        "id": 254,
        "topic": "topic56",
        "question": "What type of muscle is found in the lower third of the oesophagus?",
        "answer": "<li>The lower third of the oesophagus is composed of smooth muscle.</li>",
        "memoryTip": "The lower oesophagus is like a smooth talker, always keeping it smooth and easy!",
        "emoji": "😌"
    },
    {
        "id": 255,
        "topic": "topic56",
        "question": "What type of epithelium lines the oesophagus?",
        "answer": "<li>The oesophagus is lined by stratified squamous non-keratinized epithelium.</li>",
        "memoryTip": "Think of the oesophagus as wearing a \"squamous\" suit that’s layered for protection but not too tough!",
        "emoji": "👔"
    },
    {
        "id": 256,
        "topic": "topic56",
        "question": "At what location does the oesophagus have a constriction at 15 cm?",
        "answer": "<li>At 15 cm, the oesophagus is constricted at the junction with the pharynx in the neck.</li>",
        "memoryTip": "Imagine the oesophagus squeezing through a tiny necktie at the pharynx junction!",
        "emoji": "🎩"
    },
    {
        "id": 257,
        "topic": "topic56",
        "question": "At what location does the oesophagus have a constriction at 22.5 cm?",
        "answer": "<li>At 22.5 cm, the oesophagus is constricted in the superior mediastinum where it is crossed by the arch of the aorta.</li>",
        "memoryTip": "Picture the oesophagus doing a limbo under the arch of the aorta at 22.5 cm!",
        "emoji": "🤸"
    },
    {
        "id": 258,
        "topic": "topic56",
        "question": "At what location does the oesophagus have a constriction at 27.5 cm?",
        "answer": "<li>At 27.5 cm, the oesophagus is compressed by the left main bronchus in the posterior mediastinum.</li>",
        "memoryTip": "Imagine the oesophagus getting a \"bronchial hug\" from the left main bronchus!",
        "emoji": "🤗"
    },
    {
        "id": 259,
        "topic": "topic56",
        "question": "At what location does the oesophagus have a constriction at 40 cm?",
        "answer": "<li>At 40 cm, the oesophagus is constricted at the esophageal hiatus in the diaphragm.</li>",
        "memoryTip": "Think of the oesophagus trying to sneak through a \"diaphragm door\" at 40 cm!",
        "emoji": "🚪"
    },
    {
        "id": 260,
        "topic": "topic57",
        "question": "What is the blood supply for the cervical part of the oesophagus up to the arch of the aorta?",
        "answer": "<li>The cervical part of the oesophagus is supplied by the inferior thyroid artery.</li>",
        "memoryTip": "The inferior thyroid artery is like the \"thyroid's little helper\" for the cervical oesophagus!",
        "emoji": "🎁"
    },
    {
        "id": 261,
        "topic": "topic57",
        "question": "What supplies the thoracic part of the oesophagus?",
        "answer": "<li>The thoracic part of the oesophagus is supplied by the oesophageal branches of the descending thoracic aorta.</li>",
        "memoryTip": "Think of the descending thoracic aorta as the \"thoracic highway\" delivering blood to the oesophagus!",
        "emoji": "🛣️"
    },
    {
        "id": 262,
        "topic": "topic57",
        "question": "What supplies the abdominal part of the oesophagus?",
        "answer": "<li>The abdominal part of the oesophagus is supplied by the oesophageal branches of the left gastric artery.</li>",
        "memoryTip": "The left gastric artery is like the \"gas station\" fueling the abdominal oesophagus!",
        "emoji": "⛽"
    },
    {
        "id": 263,
        "topic": "topic57",
        "question": "Which arteries also contribute to the blood supply of the oesophagus?",
        "answer": "<li>The bronchial artery and the left inferior phrenic artery also contribute to the blood supply of the oesophagus.</li>",
        "memoryTip": "Think of the bronchial and left inferior phrenic arteries as the \"supporting cast\" in the oesophagus's blood supply story!",
        "emoji": "🎭"
    },
    {
        "id": 264,
        "topic": "topic58",
        "question": "What is the level of the vena caval opening in the diaphragm?",
        "answer": "<li>The vena caval opening is at the level of T8.</li>",
        "memoryTip": "Remember T8 as \"Tate's 8th birthday party\" where the inferior vena cava is the guest of honor!",
        "emoji": "🎉"
    },
    {
        "id": 265,
        "topic": "topic58",
        "question": "What structures pass through the vena caval opening?",
        "answer": "<li>The inferior vena cava and the right phrenic nerve pass through the vena caval opening.</li>",
        "memoryTip": "Picture the inferior vena cava and right phrenic nerve as party guests at the T8 celebration!",
        "emoji": "🎈"
    },
    {
        "id": 266,
        "topic": "topic58",
        "question": "What is the level of the oesophageal opening in the diaphragm?",
        "answer": "<li>The oesophageal opening is at the level of T10.</li>",
        "memoryTip": "Think of T10 as \"Tina's 10th birthday\" where the oesophagus is the main attraction!",
        "emoji": "🎂"
    },
    {
        "id": 267,
        "topic": "topic58",
        "question": "What structures pass through the oesophageal opening?",
        "answer": "<li>The oesophagus, oesophageal branches of the left gastric artery, vagus nerve, and lymphatics pass through the oesophageal opening.</li>",
        "memoryTip": "Imagine the oesophagus and friends (gastric artery, vagus nerve) parading through the T10 party!",
        "emoji": "🎊"
    },
    {
        "id": 268,
        "topic": "topic58",
        "question": "What is the level of the aortic opening in the diaphragm?",
        "answer": "<li>The aortic opening is at the level of T12.</li>",
        "memoryTip": "T12 is like \"Twelve's a crowd\" where the aorta brings all its friends to the party!",
        "emoji": "🎤"
    },
    {
        "id": 269,
        "topic": "topic58",
        "question": "What structures pass through the aortic opening?",
        "answer": "<li>The aorta, thoracic duct, azygos vein, hemiazygos vein, and lymph trunks pass through the aortic opening.</li>",
        "memoryTip": "Picture the aorta and its entourage (thoracic duct, azygos) making a grand entrance at T12!",
        "emoji": "🎩"
    },
    {
        "id": 270,
        "topic": "topic59",
        "question": "What is located behind the medial lumbocostal arch?",
        "answer": "<li>The sympathetic chain is located behind the medial lumbocostal arch.</li>",
        "memoryTip": "Think of the sympathetic chain as the \"medal winner\" hiding behind the lumbocostal arch!",
        "emoji": "🥇"
    },
    {
        "id": 271,
        "topic": "topic59",
        "question": "What is located behind the lateral lumbocostal arch?",
        "answer": "<li>The subcostal nerve and vessels are located behind the lateral lumbocostal arch.</li>",
        "memoryTip": "Imagine the subcostal nerve as a \"lateral thinker\" sneaking behind the arch!",
        "emoji": "🤔"
    },
    {
        "id": 272,
        "topic": "topic59",
        "question": "What structures pass through the foramen of Morgagni (Larry's Space)?",
        "answer": "<li>The superior epigastric vessels and lymphatics pass through the foramen of Morgagni.</li>",
        "memoryTip": "Picture Larry's Space as a VIP lounge for superior epigastric vessels and lymphatics!",
        "emoji": "🕴️"
    },
    {
        "id": 273,
        "topic": "topic60",
        "question": "What arteries supply the superior surface of the diaphragm?",
        "answer": "<li>The pericardiacophrenic and musculophrenic arteries, as well as the superior phrenic arteries, supply the superior surface of the diaphragm.</li>",
        "memoryTip": "Think of these arteries as the \"upper crust\" of the diaphragm's blood supply!",
        "emoji": "👑"
    },
    {
        "id": 274,
        "topic": "topic60",
        "question": "What veins drain the superior surface of the diaphragm?",
        "answer": "<li>The pericardiacophrenic and musculophrenic veins drain the superior surface of the diaphragm.</li>",
        "memoryTip": "Picture these veins as the \"drainage crew\" keeping the superior surface clean!",
        "emoji": "🚿"
    },
    {
        "id": 275,
        "topic": "topic60",
        "question": "What arteries supply the inferior surface of the diaphragm?",
        "answer": "<li>The inferior phrenic arteries supply the inferior surface of the diaphragm.</li>",
        "memoryTip": "Think of the inferior phrenic arteries as the \"undercover agents\" of the diaphragm's blood supply!",
        "emoji": "🕵️"
    },
    {
        "id": 276,
        "topic": "topic60",
        "question": "How does the right inferior phrenic vein drain?",
        "answer": "<li>The right inferior phrenic vein drains to the inferior vena cava (IVC).</li>",
        "memoryTip": "Picture the right inferior phrenic vein as a \"VIP guest\" heading straight to the IVC!",
        "emoji": "🎟️"
    },
    {
        "id": 277,
        "topic": "topic60",
        "question": "How does the left inferior phrenic vein typically drain?",
        "answer": "<li>The left inferior phrenic vein is often double, with the anterior branch ending in the IVC and the posterior branch ending in the left renal or suprarenal vein.</li>",
        "memoryTip": "Imagine the left inferior phrenic vein as a \"double agent\" with two secret exits!",
        "emoji": "🎭"
    },
    {
        "id": 278,
        "topic": "topic60",
        "question": "Can the two branches of the left inferior phrenic vein anastomose?",
        "answer": "<li>Yes, the two branches of the left inferior phrenic vein may anastomose with each other.</li>",
        "memoryTip": "Think of the branches as \"friends reuniting\" for a quick chat before heading off!",
        "emoji": "🤝"
    },
    {
        "id": 279,
        "topic": "topic61",
        "question": "What is the primary cause of acquired diaphragmatic hernias?",
        "answer": "<li>Acquired diaphragmatic hernias are usually caused by bullet injuries.</li>",
        "memoryTip": "Think of a bullet as a \"diaphragm's worst enemy\" – it just can't handle the pressure!",
        "emoji": "💥"
    },
    {
        "id": 280,
        "topic": "topic61",
        "question": "What are the two types of hiatus hernias?",
        "answer": "<li>The two types of hiatus hernias are the sliding type (Type-I) and the paraesophageal type (Type-II).</li>",
        "memoryTip": "Sliding into home plate is great, but not when your stomach is doing it through your diaphragm!",
        "emoji": "⚾"
    },
    {
        "id": 281,
        "topic": "topic61",
        "question": "What is a Morgagnian hernia?",
        "answer": "<li>A Morgagnian hernia occurs through the foramen of Morgagni, usually on the right side and anteriorly, often involving the transverse colon.</li>",
        "memoryTip": "Morgagnian sounds like \"Morgana,\" the magician – making your colon disappear through a magical foramen!",
        "emoji": "🎩"
    },
    {
        "id": 282,
        "topic": "topic61",
        "question": "What is the most common type of congenital diaphragmatic hernia?",
        "answer": "<li>Bochdalek's hernia is the most common type of congenital diaphragmatic hernia.</li>",
        "memoryTip": "Bochdalek sounds like \"Bach,\" and just like a symphony, this hernia plays a major role in respiratory distress!",
        "emoji": "🎶"
    },
    {
        "id": 283,
        "topic": "topic61",
        "question": "What are the symptoms of Bochdalek's hernia?",
        "answer": "<li>The symptoms include respiratory distress, apparent dextrocardia, and a scaphoid abdomen.</li>",
        "memoryTip": "If your abdomen looks like a \"scooped-out\" ice cream cone, it might be time to check for Bochdalek's!",
        "emoji": "🍦"
    },
    {
        "id": 284,
        "topic": "topic62",
        "question": "At which vertebra is the oropharynx and soft palate located?",
        "answer": "<li>The oropharynx and soft palate are located at the C2 vertebra.</li>",
        "memoryTip": "C2 is like the \"C\" in \"See you at the oropharynx!\"",
        "emoji": "👀"
    },
    {
        "id": 285,
        "topic": "topic62",
        "question": "Where is the hyoid bone located?",
        "answer": "<li>The hyoid bone is located at the C3 vertebra.</li>",
        "memoryTip": "The hyoid bone is like the \"high\" point of your neck – always at C3!",
        "emoji": "🎵"
    },
    {
        "id": 286,
        "topic": "topic62",
        "question": "What vertebrae correspond to the thyroid cartilage?",
        "answer": "<li>The thyroid cartilage corresponds to the C4 and C5 vertebrae.</li>",
        "memoryTip": "Think of the thyroid as the \"C4\" of your neck – it’s got the \"core\" covered!",
        "emoji": "🔊"
    },
    {
        "id": 287,
        "topic": "topic62",
        "question": "At what level does the bifurcation of the common carotid artery occur?",
        "answer": "<li>The bifurcation of the common carotid artery occurs at the C3 and C4 vertebral junction (disc).</li>",
        "memoryTip": "The carotid artery bifurcates like a fork in the road at C3-C4 – choose wisely!",
        "emoji": "🍴"
    },
    {
        "id": 288,
        "topic": "topic62",
        "question": "Where is the cricoid cartilage located?",
        "answer": "<li>The cricoid cartilage is located at the C6 vertebra.</li>",
        "memoryTip": "The cricoid is like the \"C6\" of the neck – it’s the \"crucial\" support!",
        "emoji": "🏗️"
    },
    {
        "id": 289,
        "topic": "topic62",
        "question": "What is the superior extent of the thyroid lobe?",
        "answer": "<li>The superior extent of the thyroid lobe is at the oblique line of the thyroid cartilage.</li>",
        "memoryTip": "The thyroid lobe reaches for the \"oblique\" line like a gymnast aiming for gold!",
        "emoji": "🤸"
    },
    {
        "id": 290,
        "topic": "topic62",
        "question": "At which tracheal rings is the isthmus of the thyroid gland located?",
        "answer": "<li>The isthmus of the thyroid gland is located at the second through fourth tracheal rings.</li>",
        "memoryTip": "The isthmus is like the \"bridge\" between the rings – connecting the thyroid family!",
        "emoji": "🌉"
    },
    {
        "id": 291,
        "topic": "topic62",
        "question": "Where is the inferior extent of the thyroid lobe?",
        "answer": "<li>The inferior extent of the thyroid lobe is at the sixth tracheal ring.</li>",
        "memoryTip": "The thyroid lobe goes down to the sixth ring like a contestant in a \"ring toss\" game!",
        "emoji": "🎯"
    },
    {
        "id": 292,
        "topic": "topic62",
        "question": "What vertebrae correspond to the superior angle of the scapula?",
        "answer": "<li>The superior angle of the scapula overlies part of the second rib and the first intercostal space superior to the angle.</li>",
        "memoryTip": "The scapula's superior angle is like a \"superhero\" over the second rib, always watching!",
        "emoji": "🦸"
    },
    {
        "id": 293,
        "topic": "topic62",
        "question": "At which vertebra is the inferior angle of the scapula located?",
        "answer": "<li>The inferior angle of the scapula overlies part of the 7th rib and the 7th intercostal space inferior to the angle.</li>",
        "memoryTip": "The inferior angle is like the \"bottom line\" of the scapula – always at the 7th rib!",
        "emoji": "📉"
    },
    {
        "id": 294,
        "topic": "topic62",
        "question": "What is the level of the jugular (suprasternal) notch?",
        "answer": "<li>The jugular (suprasternal) notch is located at the T2 and T3 vertebral junction.</li>",
        "memoryTip": "The jugular notch is like the \"notch\" in your neck – always at T2-T3!",
        "emoji": "⛏️"
    },
    {
        "id": 295,
        "topic": "topic62",
        "question": "Where is the carina located?",
        "answer": "<li>The carina is located at the T3-4 or T4 vertebra.</li>",
        "memoryTip": "The carina is like the \"car\" that takes you to the T3-4 junction – buckle up!",
        "emoji": "🚗"
    },
    {
        "id": 296,
        "topic": "topic62",
        "question": "What vertebrae correspond to the manubrium sterni?",
        "answer": "<li>The manubrium sterni is located at the T3 and T4 vertebrae.</li>",
        "memoryTip": "The manubrium is the \"man\" of the sternum, always at T3-T4!",
        "emoji": "👨"
    },
    {
        "id": 297,
        "topic": "topic62",
        "question": "At which vertebrae does the body of the sternum lie?",
        "answer": "<li>The body of the sternum lies between T5 to T9 vertebrae.</li>",
        "memoryTip": "The body of the sternum is like the \"body\" of a story – it spans from T5 to T9!",
        "emoji": "📖"
    },
    {
        "id": 298,
        "topic": "topic62",
        "question": "What is the typical level of the xiphisternal joint?",
        "answer": "<li>The xiphisternal joint is typically at the T9 vertebra.</li>",
        "memoryTip": "The xiphisternal joint is like the \"X\" that marks the spot at T9!",
        "emoji": "❌"
    },
    {
        "id": 299,
        "topic": "topic62",
        "question": "Where is the xiphoid process located?",
        "answer": "<li>The xiphoid process is located at T9.</li>",
        "memoryTip": "The xiphoid process is like the \"tip\" of the sternum – always at T9!",
        "emoji": "⛷️"
    },
    {
        "id": 300,
        "topic": "topic62",
        "question": "Where is the pulmonary valve located?",
        "answer": "<li>The pulmonary valve is located in the left second intercostal space, medial.</li>",
        "memoryTip": "The pulmonary valve is like a \"left turn\" at the second intercostal space – don’t miss it!",
        "emoji": "⬅️"
    },
    {
        "id": 301,
        "topic": "topic62",
        "question": "At which intercostal space is the aortic valve located?",
        "answer": "<li>The aortic valve is located in the right second intercostal space.</li>",
        "memoryTip": "The aortic valve is like a \"right turn\" at the second intercostal space – always on the right track!",
        "emoji": "➡️"
    },
    {
        "id": 302,
        "topic": "topic62",
        "question": "Where is the tricuspid valve located?",
        "answer": "<li>The tricuspid valve is located at the right lower sternum.</li>",
        "memoryTip": "The tricuspid valve is like the \"triple threat\" at the lower sternum – always ready to pump!",
        "emoji": "🔄"
    },
    {
        "id": 303,
        "topic": "topic63",
        "question": "Where is the nipple located in males?",
        "answer": "<li>The nipple in males is located in the fourth intercostal space in the midclavicular line.</li>",
        "memoryTip": "Think of a male's nipple as a \"midway point\" on a roller coaster ride—always at the fourth drop!",
        "emoji": "🎢"
    },
    {
        "id": 304,
        "topic": "topic63",
        "question": "What is the location of the apex of the heart (mitral valve)?",
        "answer": "<li>The apex of the heart (mitral valve) is located in the 5th intercostal space.</li>",
        "memoryTip": "The heart's apex is like the tip of a pencil—sharp and pointed at the 5th space!",
        "emoji": "✏️"
    },
    {
        "id": 305,
        "topic": "topic63",
        "question": "In a supine position, where is the base of the heart located?",
        "answer": "<li>In a supine position, the base of the heart is located at the T5 to T8 vertebrae.</li>",
        "memoryTip": "The base of the heart is like a flat pancake, resting comfortably between T5 and T8!",
        "emoji": "🥞"
    },
    {
        "id": 306,
        "topic": "topic63",
        "question": "In an erect position, where is the base of the heart located?",
        "answer": "<li>In an erect position, the base of the heart is located at the T6 to T9 vertebrae.</li>",
        "memoryTip": "The heart stands tall like a soldier, reaching from T6 to T9!",
        "emoji": "🎖️"
    },
    {
        "id": 307,
        "topic": "topic63",
        "question": "Where is the oblique fissure of the lung located?",
        "answer": "<li>The oblique fissure of the lung is located at T6.</li>",
        "memoryTip": "The oblique fissure is like a sneaky ninja hiding at T6!",
        "emoji": "🥷"
    },
    {
        "id": 308,
        "topic": "topic63",
        "question": "At which vertebral level is the vena caval foramen located?",
        "answer": "<li>The vena caval foramen is located at the T8 vertebra.</li>",
        "memoryTip": "The vena caval foramen is like a VIP entrance at T8—only the best get through!",
        "emoji": "🎟️"
    },
    {
        "id": 309,
        "topic": "topic63",
        "question": "Where is the esophageal hiatus located?",
        "answer": "<li>The esophageal hiatus is located at the T10 vertebra.</li>",
        "memoryTip": "The esophagus takes a break at T10—like a vacation spot for food!",
        "emoji": "🏖️"
    },
    {
        "id": 310,
        "topic": "topic63",
        "question": "What is the vertebral level of the greater splanchnic nerve?",
        "answer": "<li>The greater splanchnic nerve is located at the T5-T9 sympathetic ganglia.</li>",
        "memoryTip": "The greater splanchnic nerve is like a group of friends hanging out from T5 to T9!",
        "emoji": "👯"
    },
    {
        "id": 311,
        "topic": "topic63",
        "question": "What is the vertebral level of the lesser splanchnic nerve?",
        "answer": "<li>The lesser splanchnic nerve is located at the T10-T11 sympathetic ganglia.</li>",
        "memoryTip": "The lesser splanchnic nerve is the smaller sibling, hanging out at T10 and T11!",
        "emoji": "👶"
    },
    {
        "id": 312,
        "topic": "topic63",
        "question": "Where is the least splanchnic nerve located?",
        "answer": "<li>The least splanchnic nerve is located at the T12 sympathetic ganglia.</li>",
        "memoryTip": "The least splanchnic nerve is the quiet one at T12, just observing!",
        "emoji": "🤫"
    },
    {
        "id": 313,
        "topic": "topic63",
        "question": "At which vertebral level is the aortic hiatus located?",
        "answer": "<li>The aortic hiatus is located at the T12 vertebra.</li>",
        "memoryTip": "The aortic hiatus is like a secret passage at T12—only the aorta knows the way!",
        "emoji": "🗝️"
    },
    {
        "id": 314,
        "topic": "topic63",
        "question": "Where is the median arcuate ligament of the respiratory diaphragm located?",
        "answer": "<li>The median arcuate ligament of the respiratory diaphragm is located at the T12 and L1 vertebral junction.</li>",
        "memoryTip": "The median arcuate ligament is like a bridge connecting T12 and L1—always linking up!",
        "emoji": "🌉"
    },
    {
        "id": 315,
        "topic": "topic63",
        "question": "At which vertebral level is the celiac trunk located?",
        "answer": "<li>The celiac trunk is located at the L1 vertebra (superior border).</li>",
        "memoryTip": "The celiac trunk is the \"top dog\" at L1, ruling the abdominal arteries!",
        "emoji": "🐶"
    },
    {
        "id": 316,
        "topic": "topic63",
        "question": "Where is the superior mesenteric artery located?",
        "answer": "<li>The superior mesenteric artery is located at the L1 vertebra (inferior third).</li>",
        "memoryTip": "The superior mesenteric artery is like the \"second in command\" at L1, just below the celiac trunk!",
        "emoji": "👑"
    },
    {
        "id": 317,
        "topic": "topic63",
        "question": "At which vertebral level is the pylorus of the stomach located?",
        "answer": "<li>The pylorus of the stomach is located at L1.</li>",
        "memoryTip": "The pylorus is like the bouncer at the stomach's door, standing guard at L1!",
        "emoji": "🚪"
    },
    {
        "id": 318,
        "topic": "topic63",
        "question": "Where is the inferior mesenteric artery located?",
        "answer": "<li>The inferior mesenteric artery is located at the L3 vertebra (subcostal plane).</li>",
        "memoryTip": "The inferior mesenteric artery is the \"understudy\" at L3, always ready to step in!",
        "emoji": "🎭"
    },
    {
        "id": 319,
        "topic": "topic63",
        "question": "At which vertebral level is the horizontal (third) part of the duodenum located?",
        "answer": "<li>The horizontal (third) part of the duodenum is located at the L3 vertebra (subcostal plane).</li>",
        "memoryTip": "The duodenum's third part is like a lazy river at L3, floating along!",
        "emoji": "🏞️"
    },
    {
        "id": 320,
        "topic": "topic63",
        "question": "Where is the spleen located?",
        "answer": "<li>The spleen is located obliquely along the axis of the 10th rib.</li>",
        "memoryTip": "The spleen is like a shy friend hiding along the 10th rib—always there but not always seen!",
        "emoji": "🙈"
    },
    {
        "id": 321,
        "topic": "topic63",
        "question": "What is the location of the right kidney's superior pole?",
        "answer": "<li>The superior pole of the right kidney is located at the T12 vertebra (superior border).</li>",
        "memoryTip": "The right kidney's superior pole is like a flag waving high at T12!",
        "emoji": "🚩"
    },
    {
        "id": 322,
        "topic": "topic63",
        "question": "What is the location of the left kidney's superior pole?",
        "answer": "<li>The superior pole of the left kidney is located at the T12 vertebra (superior border).</li>",
        "memoryTip": "The left kidney's superior pole is also waving its flag at T12—it's a twin!",
        "emoji": "🎌"
    },
    {
        "id": 323,
        "topic": "topic63",
        "question": "Where is the head of the pancreas located?",
        "answer": "<li>The head of the pancreas is located at the L2 and L3 vertebrae.</li>",
        "memoryTip": "The pancreas head is like a chef cooking up at L2 and L3—always in the kitchen!",
        "emoji": "👨‍🍳"
    },
    {
        "id": 324,
        "topic": "topic63",
        "question": "At which vertebral levels does the spinal cord terminate in adults?",
        "answer": "<li>The spinal cord terminates at L1 in adults.</li>",
        "memoryTip": "The spinal cord is like a train that stops at L1 station for adults!",
        "emoji": "🚉"
    },
    {
        "id": 325,
        "topic": "topic63",
        "question": "At which vertebral level does the spinal cord terminate in newborns?",
        "answer": "<li>The spinal cord terminates at L3 in newborns.</li>",
        "memoryTip": "The newborn's spinal cord is like a baby train that stops at L3 station!",
        "emoji": "🚂"
    },
    {
        "id": 326,
        "topic": "topic63",
        "question": "Where is the first part of the duodenum located?",
        "answer": "<li>The first part of the duodenum is located at the L1 vertebra.</li>",
        "memoryTip": "The first part of the duodenum is like the starter of a race, ready to go at L1!",
        "emoji": "🏁"
    },
    {
        "id": 327,
        "topic": "topic63",
        "question": "Where is the second part of the duodenum located?",
        "answer": "<li>The second part of the duodenum is located at the L1, L2, and L3 vertebrae (right side).</li>",
        "memoryTip": "The second part of the duodenum is like a relay team running from L1 to L3!",
        "emoji": "🏃‍♂️"
    },
    {
        "id": 328,
        "topic": "topic63",
        "question": "Where is the third part of the duodenum located?",
        "answer": "<li>The third part of the duodenum is located at the L3 vertebra.</li>",
        "memoryTip": "The third part of the duodenum is like the final lap at L3—almost done!",
        "emoji": "🏆"
    },
    {
        "id": 329,
        "topic": "topic63",
        "question": "Where is the umbilicus located in a supine/recumbent position?",
        "answer": "<li>The umbilicus is located at the disc between the L3 and L4 vertebrae.</li>",
        "memoryTip": "The umbilicus is like the center of a target, right between L3 and L4!",
        "emoji": "🎯"
    },
    {
        "id": 330,
        "topic": "topic63",
        "question": "At which vertebral level does the bifurcation of the abdominal aorta occur?",
        "answer": "<li>The bifurcation of the abdominal aorta occurs at the L4 vertebra.</li>",
        "memoryTip": "The abdominal aorta splits like a fork in the road at L4!",
        "emoji": "🍴"
    },
    {
        "id": 331,
        "topic": "topic63",
        "question": "Where is the origin of the inferior vena cava located?",
        "answer": "<li>The origin of the inferior vena cava is at L5 (transtubercular plane).</li>",
        "memoryTip": "The inferior vena cava starts its journey at L5, like a river flowing from the mountains!",
        "emoji": "🌊"
    },
    {
        "id": 332,
        "topic": "topic63",
        "question": "At which vertebral level is the anterior superior iliac spine located?",
        "answer": "<li>The anterior superior iliac spine is located at the S1 vertebra.</li>",
        "memoryTip": "The anterior superior iliac spine is like a landmark at S1—always pointing the way!",
        "emoji": "🗺️"
    },
    {
        "id": 333,
        "topic": "topic63",
        "question": "At which vertebral level is the posterior superior iliac spine located?",
        "answer": "<li>The posterior superior iliac spine is located at the S2 vertebra.</li>",
        "memoryTip": "The posterior superior iliac spine is the backseat driver at S2—always watching!",
        "emoji": "🚗"
    },
    {
        "id": 334,
        "topic": "topic63",
        "question": "Where is the supracristal plane (highest point on iliac crest) located?",
        "answer": "<li>The supracristal plane is located at the L4 vertebra.</li>",
        "memoryTip": "The supracristal plane is like the peak of a mountain at L4—always the highest point!",
        "emoji": "⛰️"
    },
    {
        "id": 335,
        "topic": "topic63",
        "question": "At which vertebral level is the transtubercular plane located?",
        "answer": "<li>The transtubercular plane is located at the L5 vertebra.</li>",
        "memoryTip": "The transtubercular plane is like a bridge at L5, connecting the upper and lower body!",
        "emoji": "🌉"
    },
    {
        "id": 336,
        "topic": "topic63",
        "question": "Where is the left renal vein located?",
        "answer": "<li>The left renal vein is located at the L2 vertebra.</li>",
        "memoryTip": "The left renal vein is like a secret passage at L2, quietly doing its job!",
        "emoji": "🤫"
    },
    {
        "id": 337,
        "topic": "topic63",
        "question": "Where is the anterior superior iliac spine in relation to the sacral promontory?",
        "answer": "<li>The anterior superior iliac spine is located at the sacral promontory.</li>",
        "memoryTip": "The anterior superior iliac spine is like a buddy hanging out with the sacral promontory!",
        "emoji": "👯"
    },
    {
        "id": 338,
        "topic": "topic63",
        "question": "Where is the pubic symphysis located?",
        "answer": "<li>The pubic symphysis is located at the tip of the coccyx.</li>",
        "memoryTip": "The pubic symphysis is like a cozy couch at the tip of the coccyx—always a comfortable spot!",
        "emoji": "🛋️"
    },
    {
        "id": 339,
        "topic": "topic64",
        "question": "What is the primary artery supplying the breast?",
        "answer": "<li>The primary artery supplying the breast is the internal thoracic artery, a branch of the subclavian artery.</li>",
        "memoryTip": "The internal thoracic artery is like a delivery service bringing goodies to the breast!",
        "emoji": "📦"
    },
    {
        "id": 340,
        "topic": "topic64",
        "question": "Which arteries also supply the breast?",
        "answer": "<li>The lateral thoracic, superior thoracic, and acromiothoracic branches of the axillary artery also supply the breast.</li>",
        "memoryTip": "The breast has a whole team of arteries—like a squad of superheroes ready to supply!",
        "emoji": "🦸‍♂️"
    },
    {
        "id": 341,
        "topic": "topic64",
        "question": "What is the vascular supply pattern of the breast?",
        "answer": "<li>The arteries converge on the anterior surface of the breast, while the posterior surface is relatively avascular.</li>",
        "memoryTip": "The breast's blood supply is like a party on the front side—everyone's invited, but the back is a no-show!",
        "emoji": "🎉"
    },
    {
        "id": 342,
        "topic": "topic64",
        "question": "How do the veins of the breast drain?",
        "answer": "<li>The veins of the breast parallel the arteries and drain into the axillary, internal thoracic, and intercostal veins.</li>",
        "memoryTip": "The veins are like loyal followers, always trailing behind the arteries to the same destinations!",
        "emoji": "🏃‍♀️"
    },
    {
        "id": 343,
        "topic": "topic64",
        "question": "What nerves innervate the breast?",
        "answer": "<li>The anterior and lateral cutaneous branches of the second to sixth intercostal nerves innervate the breast.</li>",
        "memoryTip": "The nerves are like a friendly neighborhood watch, keeping an eye on the breast from the second to sixth intercostal spaces!",
        "emoji": "👀"
    },
    {
        "id": 344,
        "topic": "topic64",
        "question": "Which nerve specifically innervates the nipple?",
        "answer": "<li>The nipple is innervated by the fourth intercostal nerve.</li>",
        "memoryTip": "The fourth intercostal nerve is like the VIP bouncer for the nipple—only the best get in!",
        "emoji": "🎟️"
    },
    {
        "id": 345,
        "topic": "topic64",
        "question": "What percentage of lymph from the breast drains into the axillary nodes?",
        "answer": "<li>75% of the lymph from the breast drains into the axillary nodes.</li>",
        "memoryTip": "The axillary nodes are like the main storage room for breast lymph—75% of the goodies go there!",
        "emoji": "📦"
    },
    {
        "id": 346,
        "topic": "topic64",
        "question": "What percentage of lymph from the breast drains into the internal mammary nodes?",
        "answer": "<li>20% of the lymph from the breast drains into the internal mammary nodes.</li>",
        "memoryTip": "The internal mammary nodes are like a side room for the breast lymph—20% of the treasures are stored there!",
        "emoji": "🏺"
    },
    {
        "id": 347,
        "topic": "topic64",
        "question": "What percentage of lymph from the breast drains into the posterior intercostal nodes?",
        "answer": "<li>5% of the lymph from the breast drains into the posterior intercostal nodes.</li>",
        "memoryTip": "The posterior intercostal nodes are like the attic for breast lymph—only 5% of the old stuff goes there!",
        "emoji": "🏚️"
    },
    {
        "id": 348,
        "topic": "topic65",
        "question": "Where does the thoracic duct originate?",
        "answer": "<li>The thoracic duct originates from the cisterna chyli at the T12 vertebral level.</li>",
        "memoryTip": "The thoracic duct starts its journey at T12, like a river flowing from the mountains!",
        "emoji": "🌊"
    },
    {
        "id": 349,
        "topic": "topic65",
        "question": "Where does the thoracic duct pass through?",
        "answer": "<li>The thoracic duct passes through the posterior portion of the superior mediastinum.</li>",
        "memoryTip": "The thoracic duct is like a secret tunnel running through the mediastinum!",
        "emoji": "🚇"
    },
    {
        "id": 350,
        "topic": "topic65",
        "question": "From where does the thoracic duct receive lymphatics?",
        "answer": "<li>The thoracic duct receives lymphatics from both halves of the body below the diaphragm and the left half above the diaphragm.</li>",
        "memoryTip": "The thoracic duct is like a big sponge soaking up lymph from all over—both below and above the diaphragm!",
        "emoji": "🧽"
    },
    {
        "id": 351,
        "topic": "topic66",
        "question": "What is the portal component associated with the lower end of the esophagus?",
        "answer": "<li>Left gastric vein.</li>",
        "memoryTip": "Think of the left gastric vein as the \"leftover\" from a big meal at the esophagus!",
        "emoji": "🍽️"
    },
    {
        "id": 352,
        "topic": "topic66",
        "question": "What is the systemic component associated with the lower end of the esophagus?",
        "answer": "<li>Azygos vein.</li>",
        "memoryTip": "The azygos vein is like the \"azygos\" friend who always shows up to help the esophagus!",
        "emoji": "🤝"
    },
    {
        "id": 353,
        "topic": "topic66",
        "question": "What condition is caused by obstruction at the lower end of the esophagus?",
        "answer": "<li>Esophageal varices.</li>",
        "memoryTip": "Esophageal varices are like party balloons that got too inflated—too much pressure!",
        "emoji": "🎈"
    },
    {
        "id": 354,
        "topic": "topic66",
        "question": "What is the portal component associated with the rectum and anal canal?",
        "answer": "<li>Superior rectal vein.</li>",
        "memoryTip": "The superior rectal vein is the VIP of the rectum—very important for drainage!",
        "emoji": "🎟️"
    },
    {
        "id": 355,
        "topic": "topic66",
        "question": "What are the systemic components associated with the rectum and anal canal?",
        "answer": "<li>Middle and inferior rectal veins.</li>",
        "memoryTip": "Think of the middle and inferior rectal veins as the \"middle children\"—always trying to get attention!",
        "emoji": "👶"
    },
    {
        "id": 356,
        "topic": "topic66",
        "question": "What condition is caused by obstruction in the rectum and anal canal?",
        "answer": "<li>Hemorrhoids.</li>",
        "memoryTip": "Hemorrhoids are like surprise guests at a party—uninvited and uncomfortable!",
        "emoji": "🎉"
    },
    {
        "id": 357,
        "topic": "topic66",
        "question": "What is the portal component associated with the umbilicus?",
        "answer": "<li>Para-umbilical vein.</li>",
        "memoryTip": "The para-umbilical vein is like the umbilical cord's sidekick—always hanging around!",
        "emoji": "🍼"
    },
    {
        "id": 358,
        "topic": "topic66",
        "question": "What is the systemic component associated with the umbilicus?",
        "answer": "<li>Superficial epigastric vein.</li>",
        "memoryTip": "The superficial epigastric vein is like the \"superficial\" friend who just skims the surface!",
        "emoji": "🌊"
    },
    {
        "id": 359,
        "topic": "topic66",
        "question": "What condition is caused by obstruction at the umbilicus?",
        "answer": "<li>Caput medusa.</li>",
        "memoryTip": "Caput medusa is like a bad hair day for your belly—veins popping out everywhere!",
        "emoji": "💇"
    },
    {
        "id": 360,
        "topic": "topic66",
        "question": "What is the portal component associated with the posterior abdominal wall?",
        "answer": "<li>Colic veins.</li>",
        "memoryTip": "Colic veins are like the \"colicky\" baby of the abdomen—always causing a fuss!",
        "emoji": "👶"
    },
    {
        "id": 361,
        "topic": "topic66",
        "question": "What is the systemic component associated with the posterior abdominal wall?",
        "answer": "<li>Retroperitoneal veins.</li>",
        "memoryTip": "Retroperitoneal veins are like the \"retro\" fashion—always in the background but essential!",
        "emoji": "🕶️"
    },
    {
        "id": 362,
        "topic": "topic66",
        "question": "What is the portal component associated with the bare area of the liver?",
        "answer": "<li>Hepatic venules.</li>",
        "memoryTip": "Hepatic venules are like the liver's \"bare necessities\"—keeping it functional!",
        "emoji": "🍃"
    },
    {
        "id": 363,
        "topic": "topic66",
        "question": "What are the systemic components associated with the bare area of the liver?",
        "answer": "<li>Phrenic and intercostal veins.</li>",
        "memoryTip": "Phrenic and intercostal veins are like the liver's \"support team\"—always there to help!",
        "emoji": "🏋️"
    },
    {
        "id": 364,
        "topic": "topic67",
        "question": "Where does the thoracic duct ascend?",
        "answer": "<li>On the vertebral column between the azygos vein and the descending aorta.</li>",
        "memoryTip": "The thoracic duct is like a climber on a mountain, navigating between two big rocks!",
        "emoji": "🧗"
    },
    {
        "id": 365,
        "topic": "topic67",
        "question": "Where does the thoracic duct pass to the left?",
        "answer": "<li>At the junction of the posterior and superior mediastina.</li>",
        "memoryTip": "The thoracic duct takes a left turn like a driver avoiding a pothole!",
        "emoji": "🚗"
    },
    {
        "id": 366,
        "topic": "topic67",
        "question": "Where does the thoracic duct enter the venous system?",
        "answer": "<li>Near or at the angle of union of the left internal jugular and subclavian veins.</li>",
        "memoryTip": "The thoracic duct is like a party crasher sneaking into the venous system!",
        "emoji": "🎉"
    },
    {
        "id": 367,
        "topic": "topic67",
        "question": "What is the common appearance of the thoracic duct in the posterior mediastinum?",
        "answer": "<li>Plexiform (resembling a network).</li>",
        "memoryTip": "The thoracic duct is like a spider web—intricate and connecting everything!",
        "emoji": "🕸️"
    },
    {
        "id": 368,
        "topic": "topic67",
        "question": "What trunks does the termination of the thoracic duct typically receive?",
        "answer": "<li>Jugular, subclavian, and bronchomediastinal trunks.</li>",
        "memoryTip": "The thoracic duct is like a VIP lounge, welcoming all the important trunks!",
        "emoji": "🎟️"
    },
    {
        "id": 369,
        "topic": "topic68",
        "question": "What nerves carry pain in myocardial infarction (MI)?",
        "answer": "<li>Middle or inferior cervical nerves.</li>",
        "memoryTip": "Think of these nerves as the \"pain messengers\" delivering bad news during an MI!",
        "emoji": "📦"
    },
    {
        "id": 370,
        "topic": "topic68",
        "question": "How can a typical cervical vertebra be differentiated from a thoracic vertebra?",
        "answer": "<li>By the foramen transversarium.</li>",
        "memoryTip": "The foramen transversarium is like a special badge that only cervical vertebrae wear!",
        "emoji": "badge: 🏅"
    },
    {
        "id": 371,
        "topic": "topic68",
        "question": "What is the most anterior component of the superior mediastinum?",
        "answer": "<li>Thymus.</li>",
        "memoryTip": "The thymus is like the \"front row\" seat in the mediastinum—always in the spotlight!",
        "emoji": "🎤"
    },
    {
        "id": 372,
        "topic": "topic68",
        "question": "What is the commonest site for ectopic parathyroid glands?",
        "answer": "<li>Thymus.</li>",
        "memoryTip": "Ectopic parathyroid glands are like lost tourists—often found in the thymus!",
        "emoji": "🗺️"
    },
    {
        "id": 373,
        "topic": "topic68",
        "question": "What do bronchioles contain that is rich in secretory immunoglobulin?",
        "answer": "<li>Clara cells.</li>",
        "memoryTip": "Clara cells are like the \"secret agents\" of the bronchioles, always ready to defend!",
        "emoji": "🕵️"
    },
    {
        "id": 374,
        "topic": "topic68",
        "question": "What is the first endocrine gland to appear in the fetus?",
        "answer": "<li>Thyroid.</li>",
        "memoryTip": "The thyroid is like the \"first child\" in the endocrine family—always the trendsetter!",
        "emoji": "👶"
    },
    {
        "id": 375,
        "topic": "topic68",
        "question": "What is the narrowest part of the esophagus?",
        "answer": "<li>Cricopharynx.</li>",
        "memoryTip": "The cricopharynx is like the \"skinny jeans\" of the esophagus—tight and narrow!",
        "emoji": "👖"
    },
    {
        "id": 376,
        "topic": "topic68",
        "question": "What is Browne's sign or pulsation associated with?",
        "answer": "<li>Laryngocele.</li>",
        "memoryTip": "Browne's sign is like a \"pulsating party\" in the larynx—always making noise!",
        "emoji": "🎊"
    },
    {
        "id": 377,
        "topic": "topic68",
        "question": "What is the toughest layer of the esophagus?",
        "answer": "<li>Muscularis.</li>",
        "memoryTip": "The muscularis layer is like the \"bodybuilder\" of the esophagus—strong and tough!",
        "emoji": "💪"
    },
    {
        "id": 378,
        "topic": "topic68",
        "question": "What is referred to as the skeleton of the heart?",
        "answer": "<li>Annulus fibrosus.</li>",
        "memoryTip": "The annulus fibrosus is like the \"skeleton\" that keeps the heart in shape—no bones about it!",
        "emoji": "💀"
    },
    {
        "id": 379,
        "topic": "topic68",
        "question": "What is the Eustachian valve?",
        "answer": "<li>A rudimentary valve in the inferior vena cava (IVC) orifice.</li>",
        "memoryTip": "The Eustachian valve is like a \"bouncer\" at the IVC door—keeping things in check!",
        "emoji": "🚪"
    },
    {
        "id": 380,
        "topic": "topic69",
        "question": "What are the features of atypical cervical vertebrae?",
        "answer": "<li>Short height, square-shaped body, concave superior surface, convex inferior surface.</li>",
        "memoryTip": "Atypical cervical vertebrae are like the \"quirky friends\" of the vertebrae—always standing out!",
        "emoji": "🌟"
    },
    {
        "id": 381,
        "topic": "topic69",
        "question": "What is unique about the transverse processes of atypical cervical vertebrae?",
        "answer": "<li>They are trough-shaped and perforated by a round foramen transversarium.</li>",
        "memoryTip": "The transverse processes are like \"troughs\" at a buffet—always ready to serve!",
        "emoji": "🍽️"
    },
    {
        "id": 382,
        "topic": "topic69",
        "question": "What is the shape of the spinous process in atypical cervical vertebrae?",
        "answer": "<li>Short and bifid.</li>",
        "memoryTip": "The bifid spinous process is like a \"fork in the road\"—always splitting paths!",
        "emoji": "🍴"
    },
    {
        "id": 383,
        "topic": "topic69",
        "question": "What is the shape of the vertebral foramen in atypical cervical vertebrae?",
        "answer": "<li>Triangular.</li>",
        "memoryTip": "The triangular vertebral foramen is like a \"pyramid scheme\"—pointy and unique!",
        "emoji": "🔺"
    },
    {
        "id": 384,
        "topic": "topic69",
        "question": "What are the first and second cervical vertebrae called?",
        "answer": "<li>Atlas and axis.</li>",
        "memoryTip": "The atlas and axis are like the \"dynamic duo\" of the cervical vertebrae—always working together!",
        "emoji": "🤼"
    },
    {
        "id": 385,
        "topic": "topic69",
        "question": "How do the cervical nerve roots exit the vertebral foramina?",
        "answer": "<li>All but C8 exit above their numbered vertebral body; C8 exits below.</li>",
        "memoryTip": "The cervical nerve roots are like students exiting a classroom—most go out the front, but C8 takes the back door!",
        "emoji": "🚪"
    },
    {
        "id": 386,
        "topic": "topic69",
        "question": "What structures make up the vertebral anatomy?",
        "answer": "<li>2 lamina, 2 arches, 2 pedicles, 2 transverse processes, a spinous process, and a body.</li>",
        "memoryTip": "The vertebral anatomy is like a \"double date\"—always in pairs!",
        "emoji": "👯"
    },
    {
        "id": 387,
        "topic": "topic69",
        "question": "What is unique about C1 (atlas) and C2 (axis)?",
        "answer": "<li>C1 lacks a vertebral body, and C2 has a bony protrusion called the odontoid process.</li>",
        "memoryTip": "C1 and C2 are like the \"odd couple\" of the vertebrae—one is missing something, and the other has a quirky feature!",
        "emoji": "👫"
    },
    {
        "id": 388,
        "topic": "topic70",
        "question": "How many thoracic vertebrae are there?",
        "answer": "<li>There are twelve thoracic vertebrae.</li>",
        "memoryTip": "Think of a dozen eggs, but instead of breakfast, they support your back!",
        "emoji": "🥚"
    },
    {
        "id": 389,
        "topic": "topic70",
        "question": "What is a key characteristic of all thoracic vertebrae?",
        "answer": "<li>All thoracic vertebrae articulate with ribs.</li>",
        "memoryTip": "Thoracic vertebrae are like the bouncers at a club, making sure only ribs get in!",
        "emoji": "🚪"
    },
    {
        "id": 390,
        "topic": "topic70",
        "question": "What features do atypical thoracic vertebrae have for rib articulation?",
        "answer": "<li>Atypical thoracic vertebrae have two partial facets (superior and inferior costal facets) on each side of the vertebral body.</li>",
        "memoryTip": "Atypical vertebrae are like two-faced coins, always ready to connect with ribs!",
        "emoji": "🪙"
    },
    {
        "id": 391,
        "topic": "topic70",
        "question": "Which costal facet is larger in atypical thoracic vertebrae?",
        "answer": "<li>The superior costal facet is much larger than the inferior costal facet.</li>",
        "memoryTip": "The superior facet is like the VIP section at a concert—always bigger and better!",
        "emoji": "🎤"
    },
    {
        "id": 392,
        "topic": "topic70",
        "question": "What additional facet do the transverse processes of thoracic vertebrae have?",
        "answer": "<li>Each transverse process has a transverse costal facet for articulation with the tubercle of its own rib.</li>",
        "memoryTip": "Transverse processes are like the arms of a chair, holding up the ribs!",
        "emoji": "🪑"
    },
    {
        "id": 393,
        "topic": "topic70",
        "question": "How does the vertebral body of a thoracic vertebra appear from above?",
        "answer": "<li>The vertebral body of a thoracic vertebra is somewhat heart-shaped when viewed from above.</li>",
        "memoryTip": "Thoracic vertebrae have hearts, but they’re not looking for love—just support!",
        "emoji": "❤️"
    },
    {
        "id": 394,
        "topic": "topic70",
        "question": "What shape is the vertebral foramen of thoracic vertebrae?",
        "answer": "<li>The vertebral foramen is circular.</li>",
        "memoryTip": "The circular foramen is like a donut hole—perfectly round and ready to support!",
        "emoji": "🍩"
    },
    {
        "id": 395,
        "topic": "topic71",
        "question": "How many lumbar vertebrae are there?",
        "answer": "<li>There are five lumbar vertebrae.</li>",
        "memoryTip": "Five lumbar vertebrae are like the five fingers on your hand, essential for support!",
        "emoji": "✋"
    },
    {
        "id": 396,
        "topic": "topic71",
        "question": "What distinguishes lumbar vertebrae from those in other regions?",
        "answer": "<li>Lumbar vertebrae are distinguished by their large size.</li>",
        "memoryTip": "Lumbar vertebrae are the bodybuilders of the spine—big and strong!",
        "emoji": "💪"
    },
    {
        "id": 397,
        "topic": "topic71",
        "question": "Do lumbar vertebrae have facets for rib articulation?",
        "answer": "<li>No, lumbar vertebrae lack facets for articulation with ribs.</li>",
        "memoryTip": "Lumbar vertebrae are like introverts at a party—no ribs invited!",
        "emoji": "🚫"
    },
    {
        "id": 398,
        "topic": "topic71",
        "question": "What is unique about the transverse processes of lumbar vertebrae?",
        "answer": "<li>The transverse processes are generally thin and long, except for those on vertebra LV, which are massive and cone-shaped.</li>",
        "memoryTip": "Think of lumbar transverse processes as spaghetti—thin and long, except for LV, which is a giant ice cream cone!",
        "emoji": "🍦"
    },
    {
        "id": 399,
        "topic": "topic71",
        "question": "What shape is the vertebral body of a typical lumbar vertebra?",
        "answer": "<li>The vertebral body of a typical lumbar vertebra is cylindrical.</li>",
        "memoryTip": "Lumbar vertebrae are like soda cans—cylindrical and ready to pop!",
        "emoji": "🥤"
    },
    {
        "id": 400,
        "topic": "topic71",
        "question": "How does the vertebral foramen of lumbar vertebrae compare to thoracic vertebrae?",
        "answer": "<li>The vertebral foramen of lumbar vertebrae is triangular in shape and larger than in thoracic vertebrae.</li>",
        "memoryTip": "The lumbar foramen is like a triangle pizza slice—bigger and more satisfying!",
        "emoji": "🍕"
    },
    {
        "id": 401,
        "topic": "topic72",
        "question": "What may happen to the oblique and horizontal fissures in some lung specimens?",
        "answer": "<li>The oblique and horizontal fissures may be incomplete or absent, leading to reductions in the number or distinctiveness of lobes.</li>",
        "memoryTip": "Incomplete fissures are like a puzzle missing pieces—still a lung, just not complete!",
        "emoji": "🧩"
    },
    {
        "id": 402,
        "topic": "topic72",
        "question": "What is a possible variation in the superior left lobe of the lung?",
        "answer": "<li>The superior left lobe may not feature a lingula.</li>",
        "memoryTip": "The lingula is like a missing sock—sometimes it just doesn’t show up!",
        "emoji": "🧦"
    },
    {
        "id": 403,
        "topic": "topic72",
        "question": "What is the most common accessory lobe in the lungs?",
        "answer": "<li>The most common accessory lobe is the azygos lobe, which appears in the right lung in approximately 1% of people.</li>",
        "memoryTip": "The azygos lobe is like that rare Pokémon—hard to find but cool to have!",
        "emoji": "🎮"
    },
    {
        "id": 404,
        "topic": "topic72",
        "question": "Where does the azygos lobe typically appear in the lung?",
        "answer": "<li>The azygos lobe appears superior to the hilum of the right lung, separated by a deep groove lodging the arch of the azygos vein.</li>",
        "memoryTip": "The azygos lobe is like a VIP lounge above the hilum—exclusive and elevated!",
        "emoji": "🏢"
    },
    {
        "id": 405,
        "topic": "topic72",
        "question": "What is a less common variation of the azygos lobe?",
        "answer": "<li>A less common large azygos lobe may appear as a bifurcated apex.</li>",
        "memoryTip": "A bifurcated apex is like a tree with two trunks—unique and branching out!",
        "emoji": "🌳"
    }
];

const topics = {
    "topic1": "1. Ribs",
    "topic2": "2. Cervical Rib",
    "topic3": "3. Components of Thoracic Vertebrae",
    "topic4": "4. Plane Passing Through T4-T5",
    "topic5": "5. Intercostal Nerves",
    "topic6": "6. Mediastinum Anatomy",
    "topic7": "7. Lung Anatomy",
    "topic8": "8. Intercostal Arteries",
    "topic9": "9. Contents of the Root of the Lung",
    "topic10": "10. Arrangement of Structures in the Root of the Lungs",
    "topic11": "11. Relations of the Root",
    "topic12": "12. Broncho-Pulmonary Segments of the Right Lung",
    "topic13": "13. Lung Anatomy",
    "topic14": "14. Bronchial Anatomy",
    "topic15": "15. Pleura Anatomy",
    "topic16": "16. Pleural Recesses",
    "topic17": "17. Innervation of Pleura",
    "topic18": "18. Bronchial Artery",
    "topic19": "19. Pericardium",
    "topic20": "20. Pericardium and Sinuses",
    "topic21": "21. Contents of the Pericardium",
    "topic22": "22. Blood Supply and Nerve Supply",
    "topic23": "23. Anatomy of the Heart",
    "topic24": "24. Right Atrium",
    "topic25": "25. Atrial Anatomy and Function",
    "topic26": "26. Sinoatrial Node (SANode)",
    "topic27": "27. Atrioventricular Node and Koch's Triangle",
    "topic28": "28. Right Ventricle Anatomy",
    "topic29": "29. Left Atrium Anatomy",
    "topic30": "30. Left Ventricle Anatomy",
    "topic31": "31. Coronary Sulcus and Interventricular Sulci",
    "topic32": "32. Other Torus Structures",
    "topic33": "33. Blood Supply of the Heart",
    "topic34": "34. Right and Left Coronary Arteries",
    "topic35": "35. Blood Supply of the Heart: Posterior and Anterior Interventricular Grooves",
    "topic36": "36. Branches of the Arteries",
    "topic37": "37. Supplies of the Arteries",
    "topic38": "38. SA Node Supply",
    "topic39": "39. Blood Supply of the Conducting System",
    "topic40": "40. Coronary Sinus",
    "topic41": "41. Cardiac Plexus",
    "topic42": "42. Cardiac Veins",
    "topic43": "43. Nerve Supply of the Heart",
    "topic44": "44. Phrenic Nerve",
    "topic45": "45. Subclavian Artery",
    "topic46": "46. Branches of the First Part of the Subclavian Artery",
    "topic47": "47. Hemiazygos Vein and Tributaries",
    "topic48": "48. Azygos Vein",
    "topic49": "49. Sympathetic Trunk",
    "topic50": "50. Aorta and Its Branches",
    "topic51": "51. Branches of the Thoracic Aorta",
    "topic52": "52. Branches of the Internal Thoracic Artery",
    "topic53": "53. Arteries Related to the Subscapular Artery",
    "topic54": "54. Superior Vena Cava",
    "topic55": "55. Brachiocephalic Veins",
    "topic56": "56. Oesophagus Anatomy",
    "topic57": "57. Oesophagus Blood Supply",
    "topic58": "58. Diaphragm Openings",
    "topic59": "59. Diaphragmatic Openings",
    "topic60": "60. Vessels of the Diaphragm",
    "topic61": "61. Acquired and Congenital Diaphragmatic Hernias",
    "topic62": "62. Anatomical Structures and Levels",
    "topic63": "63. Anatomical Landmarks and Vertebral Levels",
    "topic64": "64. Vascular Supply and Innervation of the Breast",
    "topic65": "65. Thoracic Duct",
    "topic66": "66. Porto-Caval Anastomosis",
    "topic67": "67. Thoracic Duct",
    "topic68": "68. Cervical Nerves and Vertebrae",
    "topic69": "69. Vertebrae Characteristics",
    "topic70": "70. Thoracic Vertebrae",
    "topic71": "71. Lumbar Vertebrae",
    "topic72": "72. Variations in Lobes of Lung"
};












let filteredTopics = [];
let filterStage = null;
let reviewStages = {};
let completedFlashcards = [];
let currentDate = new Date();
const reviewStageColors = { 0: 'red', 1: 'pink', 2: 'blue', 3: 'green' };
let db;
let isStarFilterActive = false;
let isStarReadyFilterActive = false;
let currentFlashcardIndex = 0;
let isHorizontal = false;
let starMarked = {};

function toggleStar(starElement, flashcardId) {
        const isStarred = !starMarked[flashcardId]; // Toggle starred status
      starMarked[flashcardId] = isStarred; // Update local state


      // Update UI Immediately
        starElement.classList.toggle('fas', isStarred);
        starElement.classList.toggle('far', !isStarred);
       starElement.style.color = isStarred ? 'gold' : 'lightgray';
       updateStarredCount(); // Recalculate and update counts
    const transaction = db.transaction([storeName], 'readwrite');
    const store = transaction.objectStore(storeName);
    const request = store.get(flashcardId);

    request.onsuccess = (event) => {
        let data = event.target.result;

        if (data) {
            // Only update the starred field, keep review metrics unchanged
            data.starred = isStarred;
            store.put(data); // Save the updated data with starred status
        } else {
            // Add a new entry with only the starred field (no review metrics)
            store.put({
                id: flashcardId,
                starred: isStarred // Only starred field
            });
        }
    };

    request.onerror = (event) => {
        console.error('Error updating star status:', event.target.errorCode);
    };
}



function openDatabase() {
    const request = indexedDB.open(dbName, 1); // Ensure the version is correct

    request.onupgradeneeded = (event) => {
        db = event.target.result;
        if (!db.objectStoreNames.contains(storeName)) {
            const store = db.createObjectStore(storeName, { keyPath: 'id' });
            store.createIndex('reviewStage', 'reviewStage', { unique: false });
            store.createIndex('dueDate', 'dueDate', { unique: false });
            store.createIndex('starred', 'starred', { unique: false }); // Ensure 'starred' is defined
        }
    };

    request.onsuccess = (event) => {
        db = event.target.result;
        loadProgress(() => {
            updateTopicProgress();
            updateStarredCount();
            renderFlashcards();
        });
    };

    request.onerror = (event) => {
        console.error('Database error:', event.target.errorCode);
    };
}


function saveProgress(id, reviewStage = 0, dueDate = null, revealedTimestamp = null, starred = false) {
    const transaction = db.transaction([storeName], 'readwrite');
    const store = transaction.objectStore(storeName);

    const data = {
        id,
        reviewStage,
        dueDate,
        revealedTimestamp,
        starred // Include starred in the saved data
    };

    store.put(data); // Save both review metrics and starred status together
}



function loadProgress(callback) {
    const transaction = db.transaction([storeName], 'readonly');
    const store = transaction.objectStore(storeName);
    const request = store.getAll();

    request.onsuccess = (event) => {
        const progressData = event.target.result;

        progressData.forEach(progress => {
            if (progress.reviewStage !== undefined && progress.dueDate !== undefined) {
                // Only initialize reviewStages for flashcards with valid review metrics
                reviewStages[progress.id] = {
                    reviewStage: progress.reviewStage,
                    dueDate: progress.dueDate,
                    revealedTimestamp: progress.revealedTimestamp || null
                };
            }
            starMarked[progress.id] = progress.starred ?? false; // Initialize starred state
        });

        console.log('Progress loaded:', progressData);
        if (callback) callback();
    };

    request.onerror = (event) => {
        console.error('Load error:', event.target.errorCode);
    };
}




// Flashcard functions
function selectLayout(value) {
    if (value === 'horizontal') {
        switchToHorizontalLayout();
    } else {
        switchToVerticalLayout();
    }
    applyCurrentFilters();
}

function switchToHorizontalLayout() {
    isHorizontal = true;
    document.body.classList.add('horizontal-layout');
    document.body.classList.remove('vertical-layout');
    currentFlashcardIndex = 0;
    document.getElementById('horizontal-info').style.display = 'block';
    document.querySelector('.navigation-buttons').style.display = 'flex';
    applyCurrentFilters();
}

function switchToVerticalLayout() {
    isHorizontal = false;
    document.body.classList.add('vertical-layout');
    document.body.classList.remove('horizontal-layout');
    document.getElementById('horizontal-info').style.display = 'none';
    document.querySelector('.navigation-buttons').style.display = 'none';
    applyCurrentFilters();
}

function showFlashcard(index) {
    const flashcards = document.querySelectorAll('.modern-card');
    if (index < 0 || index >= flashcards.length) return;

    flashcards.forEach(flashcard => flashcard.style.display = 'none');

    const currentFlashcard = flashcards[index];
    const topic = currentFlashcard.dataset.topic;
    const topicFlashcards = Array.from(flashcards).filter(f => f.dataset.topic === topic);
    const currentPosition = topicFlashcards.indexOf(currentFlashcard) + 1;
    const totalInTopic = topicFlashcards.length;

    document.getElementById('horizontal-topic').textContent = topics[topic];
    document.getElementById('horizontal-position').textContent = `Flashcard ${currentPosition} of ${totalInTopic}`;

    currentFlashcard.style.display = 'block';

    document.getElementById('prev-btn').disabled = index === 0;
    document.getElementById('next-btn').disabled = index === flashcards.length - 1;
}

function navigateFlashcards(direction) {
    const flashcards = document.querySelectorAll('.modern-card');
    if (direction === 'next' && currentFlashcardIndex < flashcards.length - 1) {
        currentFlashcardIndex++;
    } else if (direction === 'prev' && currentFlashcardIndex > 0) {
        currentFlashcardIndex--;
    }
    showFlashcard(currentFlashcardIndex);
}

function updateTopicProgress() {
    const topicSelect = document.getElementById('topic-filter');
    topicSelect.innerHTML = '';

    const allOption = document.createElement('option');
    allOption.value = 'all';
    allOption.textContent = 'All Topics';
    topicSelect.appendChild(allOption);

    Object.keys(topics).forEach(topicKey => {
        const topicName = topics[topicKey];
        const totalFlashcards = flashcards.filter(card => card.topic === topicKey).length;
        const reviewedFlashcards = flashcards.filter(card => card.topic === topicKey && reviewStages[card.id]).length;

        const option = document.createElement('option');
        option.value = topicKey;

        if (reviewedFlashcards === totalFlashcards && totalFlashcards > 0) {
            option.textContent = `${topicName} 🔹(${reviewedFlashcards}/${totalFlashcards}) ✔️`;
        } else {
            option.textContent = `${topicName} 🔹(${reviewedFlashcards}/${totalFlashcards})`;
        }

        topicSelect.appendChild(option);
    });
}

function applySelectedTopics() {
    const topicSelect = document.getElementById('topic-filter');
    const selectedOptions = Array.from(topicSelect.selectedOptions);
    const selectedTopicValues = selectedOptions.map(option => option.value);

    if (selectedTopicValues.includes('all')) {
        filteredTopics = [];
    } else {
        filteredTopics = selectedTopicValues.filter(value => value !== 'all');
    }

    currentFlashcardIndex = 0;
    renderFlashcards();
}

function renderInitialFlashcards() {
    renderFlashcards(true); // Render only the first 50 cards initially
}


function loadRestOfFlashcardsInBackground() {
  // Use a timeout to defer the loading, ensuring the UI thread doesn't get blocked
  setTimeout(() => {
        renderFlashcards(false, true); // Load the rest of the flashcards in the background
  }, 0);
}



    function renderFlashcards(initialLoad = false, appendOnly = false) {
        const flashcardsContainer = document.getElementById('flashcards-container');
        const filterInfoContainer = document.getElementById('filter-info-container');

        if (appendOnly === false) {
            flashcardsContainer.innerHTML = '';
        }
        if (appendOnly === false) {
            filterInfoContainer.innerHTML = '';
        }
        const allTopicsSelected = filteredTopics.length === 0 || filteredTopics.length === Object.keys(topics).length;

        // Update topics and review stage info dynamically
        const selectedTopicsText = allTopicsSelected
            ? 'All Topics'
            : filteredTopics.slice(0, 2).map(topic => topics[topic] || 'All Topics').join(', ') +
            (filteredTopics.length > 2 ? ', <button id="showMoreBtn" onclick="showAllTopics()">More</button>' : '');

        let selectedFilterText = ''; // Dynamic filter text based on active filters

        if (isStarFilterActive) {
            selectedFilterText = `⭐ Showing: Star-marked flashcards of selected topics <br>
                <span style="font-size: 0.9em; color: gray;">(To Exit the Review stage, Click "Show All Flashcards" Button)</span>`;
        } else if (isStarReadyFilterActive) {
            selectedFilterText = `🌟 Showing: Star-marked Ready-for-review flashcards of selected topics <br>
                <span style="font-size: 0.9em; color: gray;">(To Exit the Review stage, Click "Show All Flashcards" Button)</span>`;
        } else if (filterStage !== null) {
            selectedFilterText = `
                Review Stage: ${getReviewStageLabel(filterStage)} <br>
                <span style="font-size: 0.9em; color: gray;">(To Exit the Review stage, Click "Show All Flashcards" Button)</span>`;
        } else {
            selectedFilterText = `Showing all flashcards of selected topics`;
        }

        // Create and display filter info only once for initial load or for all load
        if (appendOnly === false) {
            const filterInfo = document.createElement('div');
            filterInfo.className = 'filter-info';

            // Topics selected line
            const topicsLine = document.createElement('div');
            topicsLine.innerHTML = `<strong style="color: black;">Topics selected:</strong>  ${selectedTopicsText}`;
            filterInfo.appendChild(topicsLine);

            // Add an <hr> for separation
            const separator = document.createElement('hr');
            separator.style.border = '1px solid #ccc';
            separator.style.margin = '10px 0';
            filterInfo.appendChild(separator);

            // Review stage or filter line
            const filterLine = document.createElement('div');
            filterLine.innerHTML = selectedFilterText; // Use innerHTML to support HTML rendering
            filterInfo.appendChild(filterLine);

            filterInfoContainer.appendChild(filterInfo);
        }

        let currentTopic = null;
        let cardsLoaded = 0;
    const limit = initialLoad ? 50 : flashcards.length; // set a limit if its a initial load
        for (let i = 0; i < flashcards.length; i++) {
            if (cardsLoaded >= limit) break; // break out of the loop if the limit is reached

            const flashcard = flashcards[i];
             const reviewStageData = reviewStages[flashcard.id];
              const isStarred = starMarked[flashcard.id];
            const isDue = reviewStageData && new Date(reviewStageData.dueDate) <= currentDate;
            const isTopicMatch = filteredTopics.length === 0 || filteredTopics.includes(flashcard.topic);

            // Match against the "Starred" filter
            let isStarredMatch = isStarFilterActive ? isStarred : true;
           // Match against the "Starred Ready Review" filter
            let isReadyMatch = isStarReadyFilterActive ? (isStarred && isDue) : true;

            // Match against the stage filter
            let isStageMatch = filterStage === null || (reviewStageData?.reviewStage === filterStage && isDue);
             if (filterStage === 4) {
               isStageMatch = reviewStageData?.reviewStage === 4;
            }

            if (isTopicMatch && isStarredMatch && isStageMatch && isReadyMatch) {
                if (!isHorizontal && currentTopic !== flashcard.topic) {
                    currentTopic = flashcard.topic;
                    const topicHeader = document.createElement('div');
                    topicHeader.className = 'topic-header';
                    topicHeader.textContent = topics[flashcard.topic];
                   flashcardsContainer.appendChild(topicHeader);
                }
                 const isAnswerVisible = reviewStageData?.revealedTimestamp &&
                (new Date() - new Date(reviewStageData.revealedTimestamp)) < 24 * 60 * 60 * 1000;

                const memoryTip = flashcard.memoryTip || '';
                const emojiSymbol = flashcard.emoji || '✨';
                const emojiExplanation = flashcard.emojiExplanation || '';

                const card = document.createElement('div');
                card.className = 'modern-card';
                card.dataset.flashcardId = flashcard.id;
                card.dataset.topic = flashcard.topic;
                card.innerHTML = `
                    <div class="question">${flashcard.question}</div>
                    <div class="answer" style="display: ${isAnswerVisible ? 'block' : 'none'}">
                        ${flashcard.answer}
                        <br>
                        <hr style="border: 1px solid black; margin: 10px 0;">
                        <em><strong>Memory Tip:</strong> ${memoryTip}</em>
                         <br><br>
                        <span class="emoji">${emojiSymbol}</span>
                    </div>
                    <div class="review-metric"></div>
                    <div class="buttons">
                       <button class="dont-know-btn" onclick="handleReviewClick(${flashcard.id}, false)">Don't Know</button>
                     <i class="${isStarred ? 'fas' : 'far'} fa-star star-btn"
                            style="color: ${isStarred ? 'gold' : 'lightgray'};"
                             onclick="toggleStar(this, ${flashcard.id})"></i>
                       <button class="know-btn" onclick="handleReviewClick(${flashcard.id}, true)" ondblclick="handleInactiveKnowClick(event)">Know</button>
                     </div>
                    <i class="fas fa-bookmark bookmark" onclick="toggleDropdown(event, 'bookmarkDropdown')"></i>
                    `;
                flashcardsContainer.appendChild(card);
                cardsLoaded++;
           }
       }
        applyReviewMetrics();
        updatePendingCounts();

        if (isHorizontal) {
             showFlashcard(currentFlashcardIndex);
         }
        attachBookmarkListeners();
     }


function showAllTopics() {
    const showMoreBtn = document.getElementById('showMoreBtn');
    const topicsLine = showMoreBtn.parentElement;
    const allTopicsText = filteredTopics.map(topic => topics[topic] || 'All Topics').join(', ');
    topicsLine.innerHTML = `<strong style="color: black;">Topics selected:</strong>  ${allTopicsText} <button id="hideMoreBtn" onclick="hideAllTopics()">Hide</button>`;
}

function hideAllTopics() {
    const hideMoreBtn = document.getElementById('hideMoreBtn');
    const topicsLine = hideMoreBtn.parentElement;
    const selectedTopicsText = filteredTopics.slice(0, 2).map(topic => topics[topic] || 'All Topics').join(', ') +
          (filteredTopics.length > 2 ? ', <button id="showMoreBtn" onclick="showAllTopics()">More</button>' : '');
    topicsLine.innerHTML = `<strong style="color: black;">Topics selected:</strong>  ${selectedTopicsText}`;
}



function showStarredFlashcards() {
    // Set the filter for starred flashcards to active and reset others
    isStarFilterActive = true;
    isStarReadyFilterActive = false; // Disable "Ready for Review" filter
    filterStage = null; // Reset the review stage filter

    renderFlashcards(); // Re-render flashcards based on updated filters
    updateStarredCount(); // Update the count of starred flashcards
}



function showStarredReadyFlashcards() {
    // Set the filter for starred and ready-to-review flashcards to active and reset others
    isStarReadyFilterActive = true;
    isStarFilterActive = false; // Disable the "Starred" filter
    filterStage = null; // Reset the review stage filter

    renderFlashcards(); // Re-render flashcards based on updated filters
    updateStarredCount(); // Update the count of starred ready-to-review flashcards
}



function attachBookmarkListeners() {
    const bookmarks = document.querySelectorAll('.bookmark');
    bookmarks.forEach(bookmark => {
        bookmark.addEventListener('click', (event) => {
            toggleDropdown(event, 'bookmarkDropdown');
        });
    });
}

function filterFlashcards(stage) {
    filterStage = stage;
    isStarFilterActive = false;
    isStarReadyFilterActive = false;
    currentFlashcardIndex = 0;
    renderFlashcards();
}

function showAllFlashcards() {
    if (filteredTopics.length === 0) {
        const topicSelect = document.getElementById('topic-filter');
        const selectedOptions = Array.from(topicSelect.selectedOptions);
        filteredTopics = selectedOptions.map(option => option.value).filter(value => value !== 'all');
    }
    filterStage = null;
    isStarFilterActive = false;
    isStarReadyFilterActive = false;
    currentFlashcardIndex = 0;
    renderFlashcards();
}

function applyReviewMetrics() {
    document.querySelectorAll('.modern-card').forEach(card => {
        const flashcardId = parseInt(card.dataset.flashcardId);
        const reviewMetric = card.querySelector('.review-metric');
        const bookmark = card.querySelector('.bookmark');
        const knowButton = card.querySelector('.know-btn');

        if (reviewStages[flashcardId]) {
            const { reviewStage, dueDate } = reviewStages[flashcardId];
            reviewMetric.dataset.reviewStage = reviewStage;
            reviewMetric.dataset.dueDate = dueDate;

            const timeRemaining = (new Date(dueDate).getTime() - currentDate.getTime()) / (1000 * 60 * 60 * 24);

            if (reviewStage === 4) {
                reviewMetric.textContent = '🏆 Final Review: Completed';
                reviewMetric.style.color = 'gold';
                bookmark.style.color = 'gold';
                card.style.borderColor = 'gold';
                knowButton.disabled = true;
                knowButton.style.backgroundColor = 'gray';
            } else if (timeRemaining <= 0) {
                reviewMetric.textContent = '🔔 Ready for Review';
                reviewMetric.style.color = '#388e3c';
                knowButton.disabled = false;
                knowButton.style.backgroundColor = '#388e3c';
                bookmark.style.color = reviewStageColors[reviewStage];
                card.style.borderColor = reviewStageColors[reviewStage];
            } else {
                const stageColor = reviewStageColors[reviewStage];
                reviewMetric.textContent = `${getReviewText(reviewStage, dueDate)}`;
                reviewMetric.style.color = stageColor;
                bookmark.style.color = stageColor;
                card.style.borderColor = stageColor;
                knowButton.disabled = true;
                knowButton.style.backgroundColor = 'gray';
            }
        } else {
            bookmark.style.color = '';
            card.style.borderColor = '';
            reviewMetric.textContent = '';
        }
    });
}


  function handleReviewClick(flashcardId, isKnow) {
    const flashcard = document.querySelector(`[data-flashcard-id="${flashcardId}"]`);
    const answer = flashcard.querySelector('.answer');
        answer.style.display = 'block';


    let reviewStage = reviewStages[flashcardId]?.reviewStage || 0;
    const dueDate = new Date(currentDate);
          const revealedTimestamp = new Date().toISOString();
        const isStarred = starMarked[flashcardId] || false;

         if (isKnow) {
        reviewStage = getNextStage(reviewStage, dueDate); // Move to next stage
    } else {
        reviewStage = 0;
            dueDate.setDate(dueDate.getDate() + 3); // Set the review in 3 days
        }
        reviewStages[flashcardId] = { reviewStage, dueDate: dueDate.toISOString(), revealedTimestamp };
         saveProgress(flashcardId, reviewStage, dueDate.toISOString(), revealedTimestamp, isStarred); // Save starred state with review metrics

          applyReviewMetrics();
        updatePendingCounts();
        updateTopicProgress();
       }


function getNextStage(reviewStage, dueDate) {
    if (reviewStage === 0) {
        dueDate.setDate(dueDate.getDate() + 7);
        return 1;
    } else if (reviewStage === 1) {
        dueDate.setDate(dueDate.getDate() + 14);
        return 2;
    } else if (reviewStage === 2) {
        dueDate.setDate(dueDate.getDate() + 28);
        return 3;
    }
    return 4;
}

function getReviewText(reviewStage, dueDate) {
    const timeRemaining = (new Date(dueDate) - currentDate) / (1000 * 60 * 60 * 24);
    return `${["First Review", "Second Review", "Third Review", "Final Review"][reviewStage]} in ${Math.ceil(timeRemaining)} days`;
}

function getReviewStageLabel(stage) {
    const labels = ["First Review", "Second Review", "Third Review", "Final Review"];
    return labels[stage] || " 🏆 Completed Flashcards List";
}

function updatePendingCounts() {
    const counts = [0, 0, 0, 0, 0];
    flashcards.forEach(flashcard => {
        const flashcardData = reviewStages[flashcard.id];
        if (flashcardData) {
            if (flashcardData.reviewStage < 4 && new Date(flashcardData.dueDate) <= currentDate) {
                counts[flashcardData.reviewStage]++;
            } else if (flashcardData.reviewStage === 4) {
                counts[4]++;
            }
        }
    });
    counts.forEach((count, index) => {
        if (index < 4) {
            document.getElementById(`count-stage-${index}`).textContent = `${count} pending`;
        } else {
            document.getElementById('count-completed').textContent = `${count} completed`;
        }
    });
}

function simulateDateTimeChange() {
    const dateInput = document.getElementById('current-date').value;
    const timeInput = document.getElementById('current-time').value;

    if (dateInput && timeInput) {
        currentDate = new Date(`${dateInput}T${timeInput}:00`);
    } else {
        currentDate = new Date();
    }
    refreshFlashcards();
}

function refreshFlashcards() {
    applyReviewMetrics();
    updatePendingCounts();
}

function applyCurrentFilters() {
    if (filterStage !== null) {
        filterFlashcards(filterStage);
    } else {
        renderFlashcards();
    }

    if (isHorizontal) {
        currentFlashcardIndex = 0;
        showFlashcard(currentFlashcardIndex);
    }
}


// Handle inactive "Know" button click to show dropdown
function handleInactiveKnowClick(event) {
    if (event.target.disabled) {
        toggleDropdownBelowButton(event, 'inactiveKnowDropdown');
    }
}

// Function to toggle dropdown visibility below the button
function toggleDropdownBelowButton(event, dropdownId) {
    event.stopPropagation();

    const dropdown = document.getElementById(dropdownId);
    const isVisible = dropdown.style.display === "block";

    if (isVisible) {
        dropdown.style.display = "none";
        return;
    }

    const dropdowns = document.querySelectorAll('.dropdown');
    dropdowns.forEach(d => {
        d.style.display = 'none';
    });

    dropdown.style.display = "block";
    dropdown.style.position = "absolute";

    const rect = event.target.getBoundingClientRect();
    dropdown.style.top = `${rect.bottom + window.scrollY}px`;
    dropdown.style.left = "50%";
    dropdown.style.transform = "translateX(-50%)";
    dropdown.style.maxWidth = "90vw";
}

// Close dropdown when clicking outside of it
window.addEventListener('click', function (event) {
    const dropdown = document.getElementById('inactiveKnowDropdown');
    if (dropdown && dropdown.style.display === "block" && !dropdown.contains(event.target)) {
        dropdown.style.display = "none";
    }
});

// Optional: Close dropdown function for specific dropdowns
function closeDropdown(dropdownId) {
    const dropdown = document.getElementById(dropdownId);
    if (dropdown) {
        dropdown.style.display = "none";
    }
}


function updateStarredCount() {

    const totalStarredCount = flashcards.filter(flashcard => starMarked[flashcard.id]).length;
    const totalStarredReadyCount = flashcards.filter(flashcard => {
          const reviewStageData = reviewStages[flashcard.id];
          const isDue = reviewStageData && new Date(reviewStageData.dueDate) <= currentDate;
        return starMarked[flashcard.id] && isDue;
        }).length;
        const count = flashcards.filter(flashcard => {
             const isTopicMatch = filteredTopics.length === 0 || filteredTopics.includes(flashcard.topic);
             return isTopicMatch && starMarked[flashcard.id]
         }).length;

        const countReady = flashcards.filter(flashcard => {
             const isTopicMatch = filteredTopics.length === 0 || filteredTopics.includes(flashcard.topic);
                const reviewStageData = reviewStages[flashcard.id];
                const isDue = reviewStageData && new Date(reviewStageData.dueDate) <= currentDate;
                return isTopicMatch &&  starMarked[flashcard.id] && isDue;
           }).length;
    const starFilterBtn = document.querySelector('.filter-btn[onclick="showStarredFlashcards()"]');
    if (starFilterBtn) {
        starFilterBtn.innerHTML = `Starred Flashcards <br> ⭐  <span id="count-starred" class="badge">${totalStarredCount} marked</span>`;
    }
    const starReadyFilterBtn = document.querySelector('.filter-btn[onclick="showStarredReadyFlashcards()"]');
    if (starReadyFilterBtn) {
        starReadyFilterBtn.innerHTML = ` Starred Ready for Review <br> 🌟 <span id="count-starred-ready" class="badge">${totalStarredReadyCount} pending</span>`
      }
}


function attachBookmarkListeners() {
    const cards = document.querySelectorAll('.modern-card');
       cards.forEach(card =>{
         card.addEventListener('click', function(event){
            const bookmark = event.target.closest('.bookmark');
             if(bookmark){
                toggleDropdown1(event, 'bookmarkDropdown1')
              }

        });
    });

}


// Toggle dropdown near the clicked bookmark icon, centered horizontally in the viewport
function toggleDropdown1(event, dropdownId) {
    event.stopPropagation();

    const dropdown = document.getElementById(dropdownId);
  const computedStyle = window.getComputedStyle(dropdown);
    const isVisible = computedStyle.display === "block";


    if (isVisible) {
        dropdown.style.display = "none";
        return;
    }

    dropdown.style.display = "block";
    dropdown.style.position = "absolute";

    const rect = event.target.getBoundingClientRect();

    dropdown.style.top = `${rect.bottom + window.scrollY}px`;
    dropdown.style.left = "50%";
    dropdown.style.transform = "translateX(-50%)";
    dropdown.style.maxWidth = "90vw";
}


// Close dropdown when clicking outside of it
window.addEventListener('click', function (event) {
    const dropdown = document.getElementById('bookmarkDropdown1');
   const bookmark = event.target.closest('.bookmark');
   if (dropdown && dropdown.style.display === "block" && !bookmark && !dropdown.contains(event.target)) {
        dropdown.style.display = "none";
    }
});

// Close dropdown manually
function closeDropdown(dropdownId) {
    const dropdown = document.getElementById(dropdownId);
    if (dropdown) {
        dropdown.style.display = "none";
    }
}


</script>



<script>
// Function to Toggle the Dropdown Below the Button
function toggleDropdownContent(event) {
    event.stopPropagation();  // Prevent immediate closing due to outside click listener

    const dropdown = document.getElementById('dropdownContent');
    const isVisible = dropdown.style.display === "block";

    // Hide dropdown if already visible
    if (isVisible) {
        dropdown.style.display = "none";
        return;
    }

    // Hide any other open dropdowns
    const dropdowns = document.querySelectorAll('.dropdown');
    dropdowns.forEach(d => {
        d.style.display = 'none';
    });

       // Show and position dropdown
    dropdown.style.display = "block";
    dropdown.style.position = "absolute";

    const rect = event.target.getBoundingClientRect();

    // Set top position just below the clicked bookmark icon
    dropdown.style.top = `${rect.bottom + window.scrollY}px`;

    // Center horizontally in the viewport, using transform for responsive centering
    dropdown.style.left = "50%";
    dropdown.style.transform = "translateX(-50%)";  // Center align horizontally

    // Optional: Set max width for small screens
    dropdown.style.maxWidth = "90vw";  // Allow dropdown to adjust within viewport
}

// Close dropdown when clicking outside of it
window.addEventListener('click', function(event) {
    const dropdown = document.getElementById('dropdownContent');
    const toggleButton = document.getElementById('toggleButton'); // Assuming the button to open dropdown has ID "toggleButton"

    // Close dropdown if clicked outside of it and not on the toggle button
    if (dropdown && dropdown.style.display === "block" &&
        !dropdown.contains(event.target) &&
        event.target !== toggleButton) {
        dropdown.style.display = "none";
    }
});

// Function to Close Dropdown Explicitly
function closeDropdown(dropdownId) {
    const dropdown = document.getElementById(dropdownId);
    if (dropdown) {
        dropdown.style.display = "none";
    }
}


</script>

 <script>
         function openModal(modalId) {
            document.getElementById(modalId).style.display = "block";
        }

        function closeModal(modalId) {
            document.getElementById(modalId).style.display = "none";
        }

         function zoomImage(modalId, zoomFactor) {
             var image = document.getElementById(modalId).querySelector('.modal-content97');
            if (image) {
                var currentWidth = image.clientWidth;
                image.style.width = (currentWidth * zoomFactor) + 'px';
            } else {
                console.error('Zoom image not found for modal:', modalId);
             }
         }


        function openPopup(popupId) {
             document.getElementById(popupId).style.display = "block";
         }

         function closePopup(popupId) {
            document.getElementById(popupId).style.display = "none";
         }

    </script>



<!-- Include the rest of your JavaScript here -->

</body>
</html>