diff --git a/apps/web/src/components/features/terminal/TerminalComponent.module.css b/apps/web/src/components/features/terminal/TerminalComponent.module.css
index 578b480..6f3bf93 100644
--- a/apps/web/src/components/features/terminal/TerminalComponent.module.css
+++ b/apps/web/src/components/features/terminal/TerminalComponent.module.css
@@ -67,12 +67,26 @@
 .terminalContainer {
   flex: 1;
   min-height: 0;
+  position: relative;
+  overflow: hidden;
+}
+
+.terminalContainer :global(.xterm) {
+  position: absolute;
+  inset: 0;
+  height: 100% !important;
+  width: 100% !important;
 }
 
 .terminalContainer :global(.xterm-viewport) {
+  height: 100% !important;
   background: #1e1e1e !important;
 }
 
+.terminalContainer :global(.xterm-screen) {
+  height: 100% !important;
+}
+
 .terminalOverlay {
   position: absolute;
   inset: 0;
diff --git a/apps/web/src/main.tsx b/apps/web/src/main.tsx
index d5b1044..86c0383 100644
--- a/apps/web/src/main.tsx
+++ b/apps/web/src/main.tsx
@@ -16,6 +16,7 @@ import "./styles/pages/projects.css";
 import "./styles/pages/git-history.css";
 import "./styles/pages/ssh-keys.css";
 import "./styles/pages/settings.css";
+import "./styles/pages/terminal.css";
 
 ReactDOM.createRoot(document.getElementById("root")!).render(
 	<React.StrictMode>
diff --git a/apps/web/src/styles/pages/terminal.css b/apps/web/src/styles/pages/terminal.css
new file mode 100644
index 0000000..46f7e70
--- /dev/null
+++ b/apps/web/src/styles/pages/terminal.css
@@ -0,0 +1,14 @@
+.terminal-page {
+	display: flex;
+	flex-direction: column;
+	height: 100%;
+	min-height: 0;
+}
+
+.terminal-page-header {
+	flex-shrink: 0;
+	display: flex;
+	align-items: center;
+	gap: var(--space-4);
+	padding-bottom: var(--space-4);
+}