Yes. Here is the **entire CSS**, with the fix built in. No JavaScript and no HTML changes.

```css
/* =========================
   BASE MENU
========================= */

nav ul li ul {
  margin-top: 6px;
  box-shadow: 0 6px 14px rgba(0,0,0,0.2);
}

/* ---------------------------
   Menu container
--------------------------- */
nav {
  position: relative;
  z-index: 10;
  font-family: Arial, sans-serif;
  font-size: 12px;
  width: 357px;
  background: #98CEF2;
  margin: 10px 18px 0px 18px;
}

/* ---------------------------
   Top level menu
--------------------------- */
nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

nav > ul {
  display: flex;
}

nav ul li {
  position: relative;
}

nav ul > li > a {
  display: block;
  padding: 15px 20px;
  color: #333;
  text-decoration: none;
  white-space: nowrap;
  background-color: #98CEF2;
}

nav ul li a:hover,
nav ul li:hover > a {
  background: #C5DDF3;
}


/* =================================================
   GRAMMAR MEGA MENU
================================================= */

/* Main Grammar panel — completely removed when closed */
nav > ul > li:nth-child(2) > ul {
  display: none !important;

  grid-template-columns: repeat(4, 1fr);
  gap: 0;

  position: absolute;
  top: 100%;
  left: 0;

  width: 950px;
  max-height: 80vh;
  overflow-y: auto;

  background: #C5DDF3;
  margin: 0;
  padding: 25px 15px 15px 15px;

  box-sizing: border-box;

  opacity: 0;
  transform: translateY(-8px);
  visibility: hidden;
  pointer-events: none;

  transition: opacity 0.18s ease, transform 0.18s ease;
}


/* Open only when Grammar link OR actual menu is hovered */
nav > ul > li:nth-child(2):has(> a:hover, > ul:hover) > ul {
  display: grid !important;

  opacity: 1;
  transform: translateY(0);
  visibility: visible;
  pointer-events: auto;
}


/* ---------------------------
   Grammar categories
--------------------------- */

nav > ul > li:nth-child(2) > ul > li {
  position: static;
  width: auto;
  box-sizing: border-box;
  padding: 0 12px 18px 12px;
}


/* Category headings */
nav > ul > li:nth-child(2) > ul > li > a {
  display: block;

  background: #ACC1D8;
  color: #333;

  font-weight: bold;
  padding: 15px 10px;
  margin-bottom: 0;

  white-space: nowrap;
  cursor: default;

  border-radius: 8px 8px 0 0;
}


/* Category heading hover */
nav > ul > li:nth-child(2) > ul > li > a:hover {
  background: #ACC1D8;
  cursor: default;
}


/* ---------------------------
   Grammar links
--------------------------- */

/* Remove old flyout positioning */
nav > ul > li:nth-child(2) > ul > li > ul {
  position: static !important;

  display: block !important;

  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;

  transform: none !important;

  background: transparent !important;

  margin: 0;
  padding: 0;

  box-shadow: none;
}


/* Individual Grammar links */
nav > ul > li:nth-child(2) > ul > li > ul > li {
  position: static;
  width: auto;
}


/* Subject links */
nav > ul > li:nth-child(2) > ul > li > ul > li > a {
  display: block;

  background: #ACC1D8;
  color: #333;

  padding: 15px 10px;
  line-height: 16px;

  white-space: normal;
}


/* Subject link hover */
nav > ul > li:nth-child(2) > ul > li > ul > li > a:hover {
  background: #CBD8E7;
}


/* Bottom corners of each category group */
nav > ul > li:nth-child(2) > ul > li > ul {
  padding-bottom: 12px;
  border-radius: 0 0 8px 8px;
  overflow: hidden;
  background: #ACC1D8 !important;
}


/* =================================================
   OTHER DROPDOWN MENUS
   (Vocabulary / Listening / Games)
================================================= */

nav > ul > li:not(:nth-child(2)) > ul {
  display: flex;
  flex-direction: column;

  position: absolute;
  top: 100%;
  left: 0;

  background: #fff;
  margin: 0;
  padding: 0;

  opacity: 0;
  transform: translateY(-8px);
  visibility: hidden;
  pointer-events: none;

  transition: 0.18s ease;
}


/* Show other dropdowns */
nav > ul > li:not(:nth-child(2)):hover > ul {
  opacity: 1;
  transform: translateY(0);
  visibility: visible;
  pointer-events: auto;
}


/* ---------------------------
   Normal dropdown items
--------------------------- */

nav > ul > li:not(:nth-child(2)) > ul > li > a {
  display: block;
  padding: 12px 20px;
  white-space: nowrap;
  box-sizing: border-box;
  background-color: #C5DDF3;
}

nav > ul > li:not(:nth-child(2)) > ul > li > a:hover {
  background-color: #ACC1D8;
}


/* ---------------------------
   Normal level-2 flyouts
--------------------------- */

nav > ul > li:not(:nth-child(2)) ul li ul {
  position: absolute;
  top: 0;
  left: 100%;

  opacity: 0;
  transform: translateX(-8px);
}

nav > ul > li:not(:nth-child(2)) ul li:hover > ul {
  opacity: 1;
  transform: translateX(0);
}


/* =========================
   COLOURS
========================= */

nav ul li ul li ul li a {
  background-color: #ACC1D8;
}

nav ul li ul li ul li a:hover {
  background-color: #CBD8E7;
}


/* =========================
   MOBILE PORTRAIT
========================= */

@media (max-width: 768px) and (orientation: portrait) {

    .hamburger {
        display: inline-block;
        cursor: pointer;
    }

    nav {
        display: none;
        width: 260px;
        margin: 10px 0 0 15px;
        background: #98CEF2;
    }

    #menuToggle:checked + .hamburger + nav {
        display: block;
    }

    nav ul {
        display: block !important;
        margin: 0;
        padding: 0;
    }

    nav ul li {
        width: 100%;
        position: relative;
    }

    nav ul > li > a {
        display: block;
        background: #98CEF2;
        color: #333 !important;
        padding: 12px 15px;
        border-bottom: 1px solid rgba(0,0,0,0.1);
    }

    /* Reset Grammar mega menu on mobile */
    nav > ul > li:nth-child(2) > ul {
        position: static !important;

        display: none !important;

        width: auto;
        max-height: none;
        overflow: visible;

        grid-template-columns: none;

        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        pointer-events: auto !important;

        background: #C5DDF3;
        margin: 0;
        padding: 0;

        box-shadow: none;
    }

    nav ul li ul {
        position: static !important;

        display: none;

        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        pointer-events: auto !important;

        background: #C5DDF3;
        margin: 0;
        padding: 0;
        box-shadow: none;
    }

    nav ul li:hover > ul {
        display: none !important;
    }

    nav ul li.open > ul {
        display: block !important;
    }

    nav ul li ul li ul {
        background: #ACC1D8;
        display: none;
    }

    nav ul li ul li.open > ul {
        display: block;
    }

    nav ul li a {
        color: #333 !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    nav ul li ul li a {
        background: #C5DDF3;
    }

    nav ul li ul li ul li a {
        background: #ACC1D8;
    }

    nav ul li ul li ul li a:hover {
        background: #CBD8E7;
    }
}
```