[graphiql] 5.2.0 Scrolling broken in GraphiQl

### Is there an existing issue for this?

- [x] I have searched the existing issues

### Current Behavior

When the query box is large enough to overflow, a scrollbar not only appears on the ide text window, but also the outer GraphiQL window itself. This scrollbar shrinks as you scroll down in the text window, disappearing as you reach the end.

If this scrollbar is visible, you can scroll below the bottom of the GraphiQL window. Similarly, opening a plugin from the side panel and scrolling to the bottom of it will scroll below the entire window.

(demo video in reproduction steps if this didn't make sense)

This likely has something to do with the styling introduced in 5.2.0 ([this commit](https://github.com/graphql/graphiql/pull/4081/files)).
*Would look into the overflow guard and line number margin*

### Expected Behavior

- No duplicate scroll bar appears.
- Cant scroll below the bottom of the page

### Steps To Reproduce

https://github.com/user-attachments/assets/ca2cb34a-efbe-47ba-be17-17167ba7fb0b

This can be recreated with the following single file TSX app (the `Lorem` import is simple a long list of random text):
``` tsx
import { createGraphiQLFetcher } from "@graphiql/toolkit";
import { GraphiQL } from "graphiql";
import { createRoot } from "react-dom/client";
import "graphiql/style.css";
import type { GraphiQLPlugin } from "@graphiql/react";
import { Lorem } from "./LoremIpsumText";

const fetcher = createGraphiQLFetcher({
url: "https://spacex-production.up.railway.app/graphql",
});

const ExamplePlugin: GraphiQLPlugin = {
icon: () => "Docs",
title: `docs title`,
content: () => Lorem, // Random text
};

createRoot(document.getElementById("root")!).render(
,
);
```
Mounted onto this index.html:
``` html

```

### Environment

* GraphiQL Version: 5.2.0
* OS: windows
* Browser: MS Edge
* Bundler: Vite
* `react` Version: 19.1.1
* `graphql` Version: 16.11.0

### Anything else?

_No response_