diff --git a/index.html b/index.html
new file mode 100644
index 0000000..88564da
--- /dev/null
+++ b/index.html
@@ -0,0 +1,981 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>Keshav Anand | Terminal Portfolio (Enhanced)</title>
+  <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;600&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
+<style>
+html, body {
+  margin: 0;
+  height: 100%;
+  font-family: "JetBrains Mono", monospace;
+  background: #000;
+  color: #00ffcc;
+  overflow: hidden;
+  transition: background 0.3s;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+:root {
+  --accent: #00ffcc;
+  --muted: rgba(0,255,200,0.12);
+  --panel-bg: rgba(0,15,20,0.65);
+  --panel-border: rgba(0,255,200,0.18);
+  --copy-hint-bg: rgba(0,0,0,0.7);
+  --cursor-glow: rgba(0,255,170,0.32);
+  --cursor-glow-strong: rgba(0,255,170,0.48);
+}
+
+/* Canvas Matrix Background */
+canvas#matrix {
+  position: fixed;
+  top: 0; left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 0;
+  background: radial-gradient(ellipse at center, #000814 0%, #000 100%);
+  transition: background 0.5s ease;
+  mix-blend-mode: overlay;
+}
+
+/* Ambient Glow Animation */
+.ambient-glow {
+  position: fixed;
+  top: 0; left: 0;
+  width: 100%; height: 100%;
+  background: radial-gradient(circle at 60% 40%, rgba(0,150,255,0.08), transparent 70%);
+  animation: ambientShift 6s infinite alternate ease-in-out;
+  z-index: 0;
+  pointer-events: none;
+  transition: opacity 0.5s;
+}
+@keyframes ambientShift {
+  from { background: radial-gradient(circle at 60% 40%, rgba(0,150,255,0.08), transparent 70%); }
+  to   { background: radial-gradient(circle at 40% 60%, rgba(0,255,200,0.06), transparent 70%); }
+}
+
+/* Spotlight overlay */
+.spotlight {
+  position: fixed;
+  top: 0; left: 0;
+  width: 100%; height: 100%;
+  background: radial-gradient(circle at center, rgba(0,150,255,0.06), transparent 60%);
+  mix-blend-mode: screen;
+  pointer-events: none;
+  z-index: 1;
+  transition: background-position 0.06s linear, opacity 0.12s;
+}
+
+/* Cursor Glow */
+#cursorGlow {
+  position: fixed;
+  width: 26vmin;
+  height: 26vmin;
+  pointer-events: none;
+  z-index: 1;
+  transform: translate(-50%, -50%) scale(1);
+  transition: width 0.12s ease, height 0.12s ease, opacity 0.12s ease;
+  opacity: 1;
+  border-radius: 50%;
+  mix-blend-mode: normal;
+  background: transparent;
+  filter: none;
+  will-change: transform, left, top;
+}
+
+/* Dark overlay */
+#darkenOverlay {
+  position: fixed;
+  inset: 0;
+  background: rgba(0,0,0,0.0);
+  z-index: 0.5;
+  pointer-events: none;
+  transition: background 200ms ease;
+}
+
+/* Body hover bg */
+body.hover-bg { background: #010d0a; }
+
+/* Terminal container */
+.terminal-container {
+  position: absolute;
+  top: 50%; left: 50%;
+  transform: translate(-50%, -50%) scale(0.85);
+  z-index: 2;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: left;
+  backdrop-filter: blur(10px) brightness(0.8);
+  background: var(--panel-bg);
+  border: 1px solid var(--panel-border);
+  border-radius: 18px;
+  box-shadow: 0 0 25px rgba(0,255,200,0.12), inset 0 0 30px rgba(0,255,200,0.03);
+  padding: 2rem 3.5rem;
+  max-width: 98%;
+  overflow-x: auto;
+  white-space: nowrap;
+  transition: transform 0.8s cubic-bezier(0.68,-0.55,0.27,1.55);
+  min-width: 300px;
+}
+.terminal-container:focus { outline: none; }
+.terminal-container.active {
+  transform: translate(-50%, -50%) scale(1);
+  animation: glowPulse 1800ms ease-in-out infinite alternate;
+}
+@keyframes glowPulse {
+  0% { box-shadow: 0 0 25px rgba(0,255,200,0.12); }
+  50% { box-shadow: 0 0 55px rgba(0,255,200,0.26); }
+  100% { box-shadow: 0 0 70px rgba(0,255,200,0.34); }
+}
+
+/* Command line boxes */
+.command-line {
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  gap: 0.8rem;
+  font-size: 1.25rem;
+  color: var(--accent);
+  text-shadow: 0 0 8px var(--accent);
+  user-select: none;
+  line-height: 1.5;
+  background: rgba(0, 0, 0, 0.4);
+  padding: 0.8rem 1rem;
+  border-radius: 8px;
+  border: 1px solid rgba(0,255,200,0.12);
+  box-shadow: inset 0 0 15px rgba(0,255,200,0.03);
+  white-space: nowrap;
+  position: relative;
+  cursor: default;
+  transition: transform 0.18s, background 0.28s, box-shadow 0.18s;
+  min-width: 240px;
+  max-width: calc(100vw - 32px);
+}
+.command-line:focus { outline: none; box-shadow: 0 0 20px rgba(0,255,200,0.06); }
+.command-line:hover { transform: translateY(-2px); }
+.command-label, .os-label {
+  font-weight: 600;
+  color: #eee;
+  margin-right: 8px;
+  min-width: 90px;
+  text-align: right;
+  user-select: none;
+}
+.command-line.main-box {
+  cursor: default;
+  position: relative;
+  margin-bottom: 1rem;
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+/* Command text */
+.cmd-text {
+  display: inline-block;
+  font-family: "JetBrains Mono", monospace;
+  font-size: clamp(0.85rem, 1.8vw, 1.1rem);
+  color: var(--accent);
+  white-space: pre;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: calc(100% - 64px);
+}
+@media (max-width: 700px) {
+  .command-line { white-space: normal; flex-wrap: wrap; gap: 6px; font-size: 1rem; }
+  .cmd-text { white-space: pre-wrap; word-break: break-word; max-width: 100%; }
+}
+@media (max-width: 500px) {
+  .terminal-container { padding: 1rem 1rem; min-width: 90%; transform: translate(-50%, -50%) scale(0.92); }
+  .command-line { font-size: 0.95rem; }
+  #cursorGlow { width: 36vmin; height: 36vmin; }
+}
+@media (max-width: 380px) {
+  .command-line { font-size: 0.9rem; padding: 0.5rem 0.6rem; gap: 4px; }
+  .cmd-text { font-size: 0.85rem; }
+}
+
+/* Copy button */
+.cmd-copy-btn {
+  margin-left: 12px;
+  background: transparent;
+  border: none;
+  color: var(--accent);
+  cursor: pointer;
+  font-size: 1.05rem;
+  padding: 6px 8px;
+  border-radius: 8px;
+  transition: transform 120ms ease, color 140ms ease, background 140ms ease;
+  display: inline-grid;
+  place-items: center;
+}
+.cmd-copy-btn:focus { outline: 2px solid rgba(0,255,200,0.14); transform: translateY(-1px); }
+.cmd-copy-btn:active { transform: scale(.98); }
+.cmd-copy-btn .fa-solid { pointer-events: none; }
+.cmd-copy-btn.success { color: #39ff14; }
+.cmd-copy-btn.fail { color: #ff7777; }
+
+.has-copy-hint { position: relative; }
+.has-copy-hint::after {
+  content: attr(data-copy-hint);
+  position: absolute;
+  top: -1.85rem;
+  left: 50%;
+  transform: translateX(-50%);
+  font-size: 0.72rem;
+  color: #fff;
+  background: var(--copy-hint-bg);
+  padding: 3px 8px;
+  border-radius: 6px;
+  pointer-events: none;
+  white-space: nowrap;
+  opacity: 0;
+  transition: opacity 0.15s ease, transform 0.12s ease;
+  box-shadow: 0 2px 10px rgba(0,0,0,0.6);
+  z-index: 6;
+  display: block;
+}
+.has-copy-hint:hover::after,
+.has-copy-hint:focus::after,
+.has-copy-hint:active::after { opacity: 1; transform: translateX(-50%) translateY(-2px); }
+.command-line.main-box.has-copy-hint::after { display: none; }
+.has-copy-hint.show-hint::after,
+.command-line.main-box.has-copy-hint.show-hint::after { display: block; opacity: 1; transform: translateX(-50%) translateY(-2px); }
+
+/* Other OS toggle */
+.other-os-toggle {
+  display: inline-flex; align-items: center; gap: 8px;
+  padding: 0.5rem 0.8rem; margin-top: 0.6rem;
+  cursor: pointer; user-select: none;
+  border-radius: 8px; border: 1px solid rgba(0,255,200,0.08);
+  background: rgba(0,0,0,0.25); color: #39a0ff; font-weight: 600;
+  transition: transform 0.16s ease, background 0.18s;
+}
+.other-os-toggle:hover { transform: translateY(-3px); background: rgba(0,255,200,0.03); }
+
+.other-os-container {
+  display: flex; flex-direction: column; gap: 0.6rem;
+  margin-top: 1rem; max-height: 0; overflow: hidden;
+  transition: max-height 0.6s cubic-bezier(.2,.9,.2,1), opacity 0.5s;
+  opacity: 0; width: 100%; z-index: 3;
+}
+.other-os-container.show { max-height: 800px; opacity: 1; padding-top: 0.8rem; }
+.other-os-wrapper { display: flex; align-items: center; gap: 10px; }
+.other-os {
+  background: rgba(0,0,0,0.25); border: 1px solid rgba(0,255,200,0.12);
+  border-radius: 6px; padding: 0.5rem 0.7rem; font-size: 0.85rem;
+  cursor: default; position: relative; transition: background 0.14s, transform 0.14s, box-shadow 0.14s;
+  flex: 1; text-align: left; overflow-x: auto; white-space: pre;
+  display: flex; align-items: center; gap: 10px;
+}
+.other-os:hover { background: rgba(0,255,200,0.08); transform: none; box-shadow: 0 0 14px rgba(0,255,200,0.08); }
+.other-os::after {
+  content: attr(data-copy-hint); position: absolute; top: -1.2rem; left: 50%;
+  transform: translateX(-50%); font-size: 0.72rem; color: #fff;
+  background: rgba(0,0,0,0.6); padding: 2px 6px; border-radius: 4px;
+  pointer-events: none; white-space: nowrap; opacity: 0; transition: opacity 0.12s;
+}
+.other-os:hover::after { opacity: 1; }
+.other-os.copied { animation: copiedPulse 420ms ease forwards; background: rgba(0,255,200,0.14) !important; box-shadow: 0 10px 34px rgba(0,255,170,0.06) !important; transform: none !important; }
+.other-os.copy-fail { animation: copyFailPulse 420ms ease forwards; background: rgba(255,80,80,0.12) !important; box-shadow: 0 10px 34px rgba(255,90,90,0.06) !important; transform: scale(0.995) !important; }
+@keyframes copiedPulse { 0% { opacity: 0.98; } 40% { opacity: 1; } 100% { opacity: 1; } }
+@keyframes copyFailPulse { 0% { transform: scale(1); opacity: 0.98; } 40% { transform: scale(0.995); opacity: 1; } 100% { transform: scale(0.995); opacity: 1; } }
+
+/* Dropdowns */
+.dropdown {
+  position: absolute; bottom: 5%; width: 100%; text-align: center;
+  z-index: 2; background: rgba(0,0,0,0.65); border-top: 1px solid rgba(0,255,200,0.1);
+  box-shadow: inset 0 0 20px rgba(0,255,200,0.05);
+  padding-bottom: 0.5rem; opacity: 0; transform: scale(0.8);
+  transition: transform 0.4s ease, opacity 0.4s ease;
+}
+.dropdown.show { opacity: 1; transform: scale(1); animation: bangPop 0.6s ease-out forwards; }
+@keyframes bangPop { 0% { transform: scale(0.3) rotate(-15deg); opacity:0; } 50% { transform: scale(1.2) rotate(10deg); opacity:1; } 70% { transform: scale(0.95) rotate(-5deg); } 100% { transform: scale(1) rotate(0deg); } }
+.dropdown-toggle { display: inline-block; cursor: pointer; padding: 0.8rem; color: #39a0ff; font-weight: 600; font-family: "JetBrains Mono", monospace; font-size: 1.2rem; letter-spacing: 1px; position: relative; overflow: hidden; white-space: nowrap; }
+.dropdown-content { display: none; padding: 1rem 2rem; color: var(--accent); font-size: 0.95rem; max-width: 800px; margin: 0 auto; text-align: left; font-family: "JetBrains Mono", monospace; background: rgba(0,15,20,0.85); border: 1px solid rgba(0,255,200,0.12); border-radius: 10px; box-shadow: 0 0 25px rgba(0,255,200,0.15); }
+.dropdown.open .dropdown-content { display: block; animation: fadeIn 0.3s ease; }
+@keyframes fadeIn { from {opacity: 0; transform: translateY(6px); } to {opacity: 1; transform: translateY(0); } }
+
+/* HOW IT WORKS section */
+.how-section { display: block; padding: 0.6rem 0.6rem; color: var(--accent); }
+.how-intro { margin-bottom: 0.6rem; font-size: 0.95rem; line-height: 1.45; color: rgba(255,255,255,0.92); }
+.how-list { counter-reset: step; list-style: none; padding: 0; margin: 0; }
+.how-list li {
+  position: relative; padding: 0.85rem 0.8rem 0.85rem 3.8rem; margin-bottom: 0.5rem; border-radius: 8px;
+  background: linear-gradient(90deg, rgba(0,255,200,0.03), rgba(0,0,0,0.02));
+  border-left: 2px solid rgba(0,255,200,0.06);
+  overflow: hidden; opacity: 0; transform: translateY(10px) scale(0.995);
+  box-shadow: inset 0 -6px 12px rgba(0,0,0,0.25);
+}
+.how-list li::before {
+  counter-increment: step;
+  content: counter(step);
+  position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
+  width: 36px; height: 36px; border-radius: 8px; display: inline-grid; place-items: center;
+  font-weight: 700; color: #001;
+  background: linear-gradient(135deg,#00ffcc,#39a0ff);
+  box-shadow: 0 4px 18px rgba(0,255,170,0.06); font-size: 0.95rem;
+}
+.how-list li h4 { margin: 0 0 0.25rem 0; font-size: 0.95rem; color: #e8fff7; letter-spacing: 0.2px; }
+.how-list li p { margin: 0; color: rgba(220,255,244,0.92); font-size: 0.86rem; line-height: 1.35; }
+.how-list li.revealed { animation: listReveal 420ms cubic-bezier(.2,.9,.2,1) forwards; }
+@keyframes listReveal { from { opacity: 0; transform: translateY(10px) scale(0.995); } to { opacity: 1; transform: translateY(0) scale(1); } }
+
+/* Repo Button */
+.repo-wrap { margin-top: 0.9rem; display: flex; justify-content: center; }
+.repo-btn {
+  --g: linear-gradient(90deg,#00ffcc,#39a0ff);
+  background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
+  border: 1px solid rgba(0,255,200,0.12); color: #e9fff9; padding: 0.6rem 1rem; border-radius: 8px;
+  font-weight: 700; text-decoration: none; font-family: "JetBrains Mono", monospace;
+  display: inline-flex; gap: 0.6rem; align-items: center; transition: transform 220ms ease, box-shadow 220ms ease;
+  box-shadow: 0 6px 30px rgba(0,255,170,0.04); position: relative; overflow: hidden;
+}
+.repo-btn::after { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, rgba(0,255,170,0.04), rgba(57,160,255,0.04)); transform: translateX(-100%); transition: transform 420ms ease; pointer-events: none; }
+.repo-btn:hover { transform: translateY(-4px); box-shadow: 0 18px 60px rgba(0,255,170,0.06); }
+.repo-btn:hover::after { transform: translateX(0); }
+.repo-icon { width: 18px; height: 18px; display: inline-grid; place-items: center; font-size: 0.9rem; color: var(--accent); }
+
+/* Cursor blinking */
+.cursor { display: inline-block; width: 6px; height: 18px; background: var(--accent); margin-left: 4px; animation: blink 1s infinite; vertical-align: bottom; border-radius: 2px; }
+@keyframes blink { 0%,50% { opacity: 1; transform: scaleY(1); } 50.1%,100% { opacity: 0; transform: scaleY(0.6); } }
+
+/* Warning text */
+.warning { font-size: 0.85rem; color: #ff4444; margin-top: 0.8rem; opacity: 0.95; animation: neonGlow 2s infinite alternate; }
+@keyframes neonGlow { 0% { text-shadow: 0 0 5px #ff4444,0 0 10px #ff4444; } 50% { text-shadow:0 0 10px #ff7777,0 0 20px #ff7777; } 100% { text-shadow:0 0 5px #ff4444,0 0 10px #ff4444; } }
+
+/* Fade out */
+.fade-out { animation: fadeOutScale 400ms ease forwards; }
+@keyframes fadeOutScale { from { opacity:1; transform: scale(1); } to { opacity:0; transform: scale(0.95); } }
+
+/* Media Queries for responsive scaling */
+@media (max-width: 980px) {
+  .terminal-container { padding: 1.8rem 1.6rem; min-width: unset; max-width: 94vw; transform-origin: center; }
+  .command-line { font-size: 1.05rem; min-width: unset; max-width: calc(100vw - 32px); white-space: normal; }
+  #cursorGlow { width: 48vmin; height: 48vmin; }
+}
+@media (max-width: 900px) {
+  .terminal-container { padding: 1.2rem 1.4rem; white-space: normal; transform: translate(-50%,-50%) scale(0.95); }
+  .command-line { font-size: 1rem; flex-wrap: wrap; gap: 6px; }
+  .other-os-container { justify-content: flex-start; }
+}
+@media (max-width: 500px) {
+  .terminal-container { padding: 1rem 1rem; min-width: 90%; transform: translate(-50%, -50%) scale(0.92); }
+  .command-line { font-size: 0.95rem; }
+  #cursorGlow { width: 36vmin; height: 36vmin; }
+}
+@media (max-width: 480px) {
+  .command-line { font-size: 0.9rem; padding: 0.5rem 0.6rem; gap: 4px; }
+  .cmd-text { font-size: 0.85rem; }
+}
+</style>
+
+</head>
+<body>
+  <canvas id="matrix" aria-hidden="true"></canvas>
+  <div class="ambient-glow" aria-hidden="true"></div>
+  <div class="spotlight" id="spotlight" aria-hidden="true"></div>
+  <div id="cursorGlow" aria-hidden="true"></div>
+  <div id="darkenOverlay" aria-hidden="true"></div>
+
+  <!-- offscreen aria live for screen reader feedback -->
+  <div id="ariaStatus" aria-live="polite" style="position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;"></div>
+
+  <div class="terminal-container" id="terminal" role="region" aria-label="Terminal portfolio" tabindex="0">
+    <span class="os-label" id="mainOSLabel" aria-hidden="true"></span>
+
+    <!-- IMPORTANT: removed has-copy-hint from main box to remove hover "Click to copy" prompt.
+         Copy button will be added to the right (by JS) for the main command. -->
+    <div class="command-line main-box" id="osCommand">
+      <span class="cursor" aria-hidden="true"></span>
+      <span class="cmd-text">Detecting your OS...</span>
+      <!-- copy button will be appended by JS -->
+    </div>
+
+    <div class="warning" role="alert">⚠ Run at your own risk</div>
+
+    <div style="width:100%; display:flex; justify-content: center;">
+      <div class="other-os-toggle" id="otherOsToggle" role="button" aria-pressed="false" tabindex="0">
+        <i class="fa-solid fa-terminal" style="font-size:0.9rem;"></i>
+        <span id="otherToggleText">▼ Show other OS commands</span>
+      </div>
+    </div>
+
+    <div class="other-os-container" id="otherOSContainer" aria-hidden="true"></div>
+  </div>
+
+  <div class="dropdown" id="dropdown" aria-hidden="false">
+    <div class="dropdown-toggle typing" id="dropdownToggle"><span>▼ How It Works</span></div>
+    <div class="dropdown-content" role="region" aria-label="How it works">
+      <!-- Replaced lorem ipsum with a polished, numbered explanation.
+           This section is intentionally descriptive (no installer preview). -->
+      <div class="how-section">
+
+
+        <ol class="how-list" id="howList">
+          <li>
+            <h4>Executable-driven UI</h4>
+            <p>The portfolio is rendered by a native executable built with C++ and the FTXUI library — the app draws an interactive, rich interface directly inside the terminal window.</p>
+          </li>
+
+          <li>
+            <h4>Cross-platform builds</h4>
+            <p>Prebuilt binaries are provided for macOS, Windows and Linux (x64). Each binary is compiled to use the host shell as the UI surface so the experience feels native.</p>
+          </li>
+
+          <li>
+            <h4>Command-outlined install flow</h4>
+            <p>The visible terminal command on this page only instructs the shell to fetch the project's runtime assets from the repository and run the appropriate executable for the host OS — the installer commands are run by the shell and kept out of this explanation for safety.</p>
+          </li>
+
+          <li>
+            <h4>Repository-first model</h4>
+            <p>All source, build scripts, and assets are available in the repository. If you want to inspect, build, or audit anything, the GitHub link provides the full codebase and release binaries.</p>
+          </li>
+
+          <li>
+            <h4>Safe & auditable</h4>
+            <p>The design keeps installation steps explicit and auditable: you can review the scripts in the repo before running anything locally — useful when you prefer to vet code first.</p>
+          </li>
+        </ol>
+
+        <div class="repo-wrap">
+          <a class="repo-btn" id="repoBtn" href="https://github.com/KeshavAnandCode/Terminal" target="_blank" rel="noopener noreferrer" aria-label="Open source repository">
+            <span class="repo-icon"><i class="fa-brands fa-github"></i></span>
+            <span>View source on GitHub</span>
+          </a>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <script>
+    const $ = s => document.querySelector(s);
+    const $$ = s => Array.from(document.querySelectorAll(s));
+    const ariaStatus = document.getElementById('ariaStatus');
+
+    async function safeCopy(text) {
+      try {
+        if (navigator.clipboard && navigator.clipboard.writeText) {
+          await navigator.clipboard.writeText(text);
+          return true;
+        } else {
+          const ta = document.createElement('textarea');
+          ta.value = text;
+          ta.setAttribute('readonly', '');
+          ta.style.position = 'absolute';
+          ta.style.left = '-9999px';
+          document.body.appendChild(ta);
+          ta.select();
+          try {
+            document.execCommand('copy');
+            document.body.removeChild(ta);
+            return true;
+          } catch (err) {
+            document.body.removeChild(ta);
+            return false;
+          }
+        }
+      } catch (err) {
+        console.warn('Copy failed', err);
+        return false;
+      }
+    }
+
+    /* matrix */
+    const canvas = document.getElementById('matrix');
+    const ctx = canvas.getContext('2d');
+    let width  = canvas.width  = window.innerWidth;
+    let height = canvas.height = window.innerHeight;
+    const letters = "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789@#$%&";
+    const fontSize = 14;
+    let columns = Math.floor(width / fontSize);
+    const drops = Array.from({length: columns}, () => Math.floor(Math.random() * 40) + 1);
+    function drawMatrixFrame() {
+      ctx.fillStyle = "rgba(0, 0, 0, 0.06)";
+      ctx.fillRect(0, 0, width, height);
+      ctx.fillStyle = "#00ffcc";
+      ctx.font = fontSize + "px JetBrains Mono";
+      for (let i = 0; i < drops.length; i++) {
+        const text = letters.charAt(Math.floor(Math.random() * letters.length));
+        ctx.fillText(text, i * fontSize, drops[i] * fontSize);
+        if (drops[i] * fontSize > height && Math.random() > 0.975) {
+          drops[i] = 0;
+        }
+        drops[i]++;
+      }
+    }
+    const MATRIX_INTERVAL_MS = 40;
+    drawMatrixFrame();
+    const matrixInterval = setInterval(drawMatrixFrame, MATRIX_INTERVAL_MS);
+    window.addEventListener('resize', () => {
+      const oldColumns = columns;
+      width = canvas.width = window.innerWidth;
+      height = canvas.height = window.innerHeight;
+      columns = Math.floor(width / fontSize);
+      if (columns > oldColumns) {
+        for (let i = 0; i < columns - oldColumns; i++) {
+          drops.push(Math.floor(Math.random() * 40) + 1);
+        }
+      } else if (columns < oldColumns) {
+        drops.length = columns;
+      }
+    });
+
+    const spotlight = document.getElementById('spotlight');
+    const cursorGlow = document.getElementById('cursorGlow');
+    const darkenOverlay = document.getElementById('darkenOverlay');
+
+    function throttle(fn, wait = 16) {
+      let last = 0;
+      return (...args) => {
+        const now = performance.now();
+        if (now - last >= wait) {
+          last = now;
+          fn(...args);
+        }
+      };
+    }
+
+    // Mousemove: only move the cursorGlow element; do NOT alter background brightness or spotlight.
+    document.addEventListener('mousemove', throttle((e) => {
+      cursorGlow.style.left = e.clientX + 'px';
+      cursorGlow.style.top  = e.clientY + 'px';
+      const speed = Math.sqrt((e.movementX||0)*(e.movementX||0) + (e.movementY||0)*(e.movementY||0));
+      if (speed > 8) {
+        cursorGlow.style.transform = 'translate(-50%, -50%) scale(1.08)';
+        cursorGlow.style.opacity = '1';
+      } else {
+        cursorGlow.style.transform = 'translate(-50%, -50%) scale(1)';
+        cursorGlow.style.opacity = '1';
+      }
+      document.body.classList.add('hover-bg');
+      // IMPORTANT: do NOT change spotlight, darkenOverlay, canvas opacity, or cursor filters here.
+    }, 12));
+
+    document.addEventListener('mouseleave', () => {
+      document.body.classList.remove('hover-bg');
+      cursorGlow.style.opacity = '0';
+      // Do NOT modify darkenOverlay here; keep background unchanged.
+    });
+
+    document.addEventListener('touchstart', (ev) => {
+      const t = ev.touches[0];
+      if (t) {
+        cursorGlow.style.left = t.clientX + 'px';
+        cursorGlow.style.top  = t.clientY + 'px';
+        cursorGlow.style.opacity = '1';
+      }
+    });
+
+    function distanceFromCenter(x,y){
+      const cx = window.innerWidth/2;
+      const cy = window.innerHeight/2;
+      const dx = (x - cx) / (window.innerWidth/2);
+      const dy = (y - cy) / (window.innerHeight/2);
+      return Math.sqrt(dx*dx + dy*dy);
+    }
+
+    // Make updateBackgroundDarkness a no-op so cursor movement won't alter background appearance.
+    function updateBackgroundDarkness(x,y){
+      // intentionally empty to preserve continuous background visuals regardless of cursor
+      return;
+    }
+
+    const osCommand = document.getElementById('osCommand');
+    const otherOSContainer = document.getElementById('otherOSContainer');
+    const mainOSLabel = document.getElementById('mainOSLabel');
+
+    const commands = {
+      Windows: `iwr https://terminalportfolio.keshavanand.net/run-windows.bat -OutFile $env:TEMP\\run-windows.bat; Start-Process $env:TEMP\\run-windows.bat -Wait`,
+      macOS: `/bin/bash -c "$(curl -fsSL https://terminalportfolio.keshavanand.net/run-mac.sh)"`,
+      Linux: `/bin/bash -c "$(curl -fsSL https://terminalportfolio.keshavanand.net/run-linux.sh)"`,
+    };
+
+    function detectOS() {
+      const platform = (navigator.platform || '').toLowerCase();
+      if (platform.includes("win")) return "Windows";
+      if (platform.includes("mac")) return "macOS";
+      if (platform.includes("linux")) return "Linux";
+      const ua = (navigator.userAgent || '').toLowerCase();
+      if (ua.includes('android')) return "Linux";
+      if (ua.includes('iphone') || ua.includes('ipad') || ua.includes('ipod')) return "macOS";
+      return "Unknown";
+    }
+
+    const userOS = detectOS();
+
+    /* helper: build a copy button that immediately shows success/fail */
+    function makeCopyButton(commandText, ariaLabel) {
+      const btn = document.createElement('button');
+      btn.type = 'button';
+      btn.className = 'cmd-copy-btn';
+      btn.setAttribute('aria-label', ariaLabel || 'Copy command');
+      btn.innerHTML = '<i class="fa-solid fa-copy"></i>';
+
+      btn.addEventListener('click', async (ev) => {
+        ev.stopPropagation();
+        // immediate visual feedback: show check
+        btn.classList.remove('fail');
+        btn.classList.add('success');
+        btn.innerHTML = '<i class="fa-solid fa-check"></i>';
+        try { ariaStatus.textContent = 'Copied to clipboard'; } catch(e){}
+
+        const ok = await safeCopy(commandText);
+        if (!ok) {
+          // swap to fail state
+          btn.classList.remove('success');
+          btn.classList.add('fail');
+          btn.innerHTML = '<i class="fa-solid fa-xmark"></i>';
+          try { ariaStatus.textContent = 'Copy failed'; } catch(e){}
+        }
+        // revert after short delay (keeps immediate feedback but resets)
+        setTimeout(() => {
+          btn.classList.remove('success','fail');
+          btn.innerHTML = '<i class="fa-solid fa-copy"></i>';
+        }, 1200);
+      }, { passive: false });
+
+      btn.addEventListener('keydown', (ev) => {
+        if (ev.key === ' ' || ev.key === 'Enter') {
+          ev.preventDefault();
+          btn.click();
+        }
+      });
+
+      return btn;
+    }
+
+    /* create an other-os box with text + copy button */
+    function createOSBox(os, command, container) {
+      const wrapper = document.createElement('div');
+      wrapper.className = 'other-os-wrapper';
+      const label = document.createElement('div');
+      label.className = 'command-label';
+      label.textContent = os;
+      label.setAttribute('aria-hidden', 'true');
+
+      const box = document.createElement('div');
+      box.className = 'other-os has-copy-hint';
+      box.setAttribute('tabindex', '0');
+
+      const textSpan = document.createElement('span');
+      textSpan.className = 'cmd-text';
+      textSpan.textContent = command;
+
+      const btn = makeCopyButton(command, `Copy ${os} command`);
+      // append text and button inside box
+      box.appendChild(textSpan);
+      box.appendChild(btn);
+
+      // also keep the existing behavior where clicking the whole box copies
+      // — but since we now have an explicit button, preserve both (for mouse & keyboard)
+      box.addEventListener('click', async (ev) => {
+        // if click target was the button, it already handled; else emulate button click
+        if (ev.target.closest('.cmd-copy-btn')) return;
+        try { const sel = window.getSelection && window.getSelection(); if (sel) sel.removeAllRanges(); } catch(e){}
+        // show immediate hint and effect
+        box.classList.remove('copy-fail');
+        box.classList.add('copied');
+        box.setAttribute('data-copy-hint', 'Copied');
+        box.classList.add('show-hint');
+        try { ariaStatus.textContent = 'Copied to clipboard'; } catch(e){}
+        const ok = await safeCopy(command);
+        if (!ok) {
+          box.classList.remove('copied');
+          box.classList.add('copy-fail');
+          box.setAttribute('data-copy-hint', 'Copy failed');
+          try { ariaStatus.textContent = 'Copy failed'; } catch(e){}
+        }
+        setTimeout(()=> {
+          box.classList.remove('copied','copy-fail','show-hint');
+          box.setAttribute('data-copy-hint', prevHint);
+        }, 1200);
+      });
+
+      box.addEventListener('keydown', (ev) => {
+        if (ev.key === 'Enter' || ev.key === ' ') {
+          ev.preventDefault();
+          btn.focus();
+          btn.click();
+        }
+      });
+
+      wrapper.appendChild(label);
+      wrapper.appendChild(box);
+      container.appendChild(wrapper);
+    }
+
+    /* render UI */
+    otherOSContainer.innerHTML = '';
+
+    if (userOS === "Unknown") {
+      mainOSLabel.textContent = "(Unknown)";
+      const mainTextSpan = osCommand.querySelector('.cmd-text');
+      if (mainTextSpan) mainTextSpan.textContent = 'Unknown OS detected. Click ▼ to expand commands.';
+      // add hint for the main area? user wanted the main prompt not to show click-to-copy; so we leave it without a hover hint.
+      for (const os in commands) createOSBox(os, commands[os], otherOSContainer);
+    } else {
+      mainOSLabel.textContent = `(${userOS})`;
+      const mainTextSpan = osCommand.querySelector('.cmd-text');
+      if (mainTextSpan) mainTextSpan.textContent = commands[userOS];
+
+      // create copy button for main command (explicit button only)
+      // remove any preexisting button
+      const existing = osCommand.querySelector('.cmd-copy-btn');
+      if (existing) existing.remove();
+      const mainBtn = makeCopyButton(commands[userOS], `Copy ${userOS} command`);
+      // append to main box
+      osCommand.appendChild(mainBtn);
+
+      // For keyboard users: pressing Enter/Space on the main box should activate the copy button
+      osCommand.setAttribute('tabindex','0');
+      osCommand.addEventListener('keydown', (ev) => {
+        if (ev.key === 'Enter' || ev.key === ' ') {
+          ev.preventDefault();
+          mainBtn.focus();
+          mainBtn.click();
+        }
+      });
+
+      // create other OS boxes for the rest
+      for (const os in commands) {
+        if (os !== userOS) createOSBox(os, commands[os], otherOSContainer);
+      }
+    }
+
+    /* toggle other os list */
+    const otherToggle = document.getElementById('otherOsToggle');
+    const otherToggleText = document.getElementById('otherToggleText');
+
+    function setOtherContainerState(show) {
+      if (show) {
+        otherOSContainer.classList.add('show');
+        otherOSContainer.setAttribute('aria-hidden','false');
+        otherToggle.setAttribute('aria-pressed','true');
+        otherToggleText.textContent = '▲ Hide other OS commands';
+        otherOSContainer.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
+      } else {
+        otherOSContainer.classList.remove('show');
+        otherOSContainer.setAttribute('aria-hidden','true');
+        otherToggle.setAttribute('aria-pressed','false');
+        otherToggleText.textContent = '▼ Show other OS commands';
+      }
+    }
+
+    let otherVisible = false;
+    setOtherContainerState(false);
+
+    otherToggle.addEventListener('click', () => {
+      otherVisible = !otherVisible;
+      setOtherContainerState(otherVisible);
+    });
+    otherToggle.addEventListener('keydown', (ev) => {
+      if (ev.key === 'Enter' || ev.key === ' ') {
+        ev.preventDefault();
+        otherToggle.click();
+      }
+    });
+
+    /* dropdown / how it works */
+    const dropdown = document.getElementById('dropdown');
+    const toggle = document.getElementById('dropdownToggle');
+    toggle.addEventListener('click', () => {
+      dropdown.classList.toggle('open');
+      if (dropdown.classList.contains('open')) {
+        staggerRevealHowList();
+      } else {
+        clearHowListReveal();
+      }
+    });
+    setTimeout(()=>dropdown.classList.add('show'), 1500);
+    const terminal = document.getElementById('terminal');
+    setTimeout(()=>terminal.classList.add('active'),100);
+
+    (function devSummary(){
+      try {
+        console.groupCollapsed('%cTerminal Portfolio — Debug Summary', 'color: #00ffcc; font-weight:700; background:#001; padding:6px;');
+        console.log('Detected OS:', userOS);
+        console.log('Commands available:', Object.keys(commands));
+        console.log('Matrix interval (ms):', MATRIX_INTERVAL_MS);
+        console.groupEnd();
+      } catch(e) { }
+    })();
+
+    document.addEventListener('keydown', (ev) => {
+      const tag = document.activeElement && document.activeElement.tagName;
+      if (tag === 'INPUT' || tag === 'TEXTAREA') return;
+      if (ev.key.toLowerCase() === 't') {
+        otherToggle.click();
+      }
+      if (ev.key.toLowerCase() === 'h') {
+        toggle.click();
+      }
+    });
+
+    window.addEventListener('beforeunload', () => {
+      try {
+        clearInterval(matrixInterval);
+      } catch (e) { }
+    });
+
+    (function globalCopyTooltip(){
+      let tip = document.createElement('div');
+      tip.style.position = 'fixed';
+      tip.style.padding = '6px 10px';
+      tip.style.background = 'rgba(0,0,0,0.85)';
+      tip.style.color = '#fff';
+      tip.style.fontFamily = '"JetBrains Mono", monospace';
+      tip.style.fontSize = '12px';
+      tip.style.borderRadius = '6px';
+      tip.style.pointerEvents = 'none';
+      tip.style.opacity = '0';
+      tip.style.transform = 'translate(-50%,-140%)';
+      tip.style.transition = 'opacity 120ms ease, transform 120ms ease';
+      tip.style.zIndex = 9999;
+      document.body.appendChild(tip);
+
+      let active = null;
+      function showTipFor(el, evt){
+        tip.textContent = text;
+        const x = evt.clientX || window.innerWidth/2;
+        const y = (evt.clientY || window.innerHeight/2) - 10;
+        tip.style.left = x + 'px';
+        tip.style.top = y + 'px';
+        tip.style.opacity = '1';
+        tip.style.transform = 'translate(-50%,-120%)';
+      }
+      function hideTip(){
+        tip.style.opacity = '0';
+        tip.style.transform = 'translate(-50%,-140%)';
+      }
+
+      document.addEventListener('mousemove', throttle((e)=>{
+        const target = e.target.closest && e.target.closest('.has-copy-hint');
+        if (target) {
+          showTipFor(target, e);
+          active = target;
+        } else {
+          active = null;
+          hideTip();
+        }
+      }, 16));
+
+      document.addEventListener('mouseleave', hideTip);
+      document.addEventListener('scroll', hideTip, true);
+      document.addEventListener('touchstart', (ev)=>{
+        const t = ev.touches[0];
+        if (!t) return;
+        const el = document.elementFromPoint(t.clientX, t.clientY);
+        const target = el && el.closest && el.closest('.has-copy-hint');
+        if (target) showTipFor(target, t);
+      }, {passive:true});
+    })();
+
+    (function ensureOtherOSCopyHints(){
+      const others = document.querySelectorAll('.other-os');
+      others.forEach(el => {
+        if(!el.classList.contains('has-copy-hint')) el.classList.add('has-copy-hint');
+      });
+      const main = document.querySelectorAll('.command-line');
+      main.forEach(el => {
+        // main intentionally does not get a hover copy prompt by default
+        // but ensure if any element needs the class it's present
+        // (do not add has-copy-hint to main)
+      });
+    })();
+
+    (function enhanceHowItWorksTyping(){
+      const toggleEl = document.getElementById('dropdownToggle');
+      const showAfterMs = 1500;
+      function typeText(el, text, speed=60, caret=true){
+        el.textContent = '';
+        let i = 0;
+        if(caret){
+          el.style.borderRight = '2px solid #00ffcc';
+        }
+        const interval = setInterval(()=> {
+          if(i < text.length){
+            el.textContent += text[i++];
+          } else {
+            clearInterval(interval);
+            if(caret) el.style.borderRight = 'none';
+          }
+        }, speed);
+      }
+
+      const origContent = toggleEl.innerHTML;
+      setTimeout(()=>{
+        dropdown.classList.add('show');
+        toggleEl.innerHTML = '';
+        toggleEl.setAttribute('aria-hidden','false');
+        const span = document.createElement('span');
+        span.textContent = '';
+        span.style.display = 'inline-block';
+        span.style.whiteSpace = 'pre';
+        span.style.overflow = 'hidden';
+        span.style.fontFamily = '"JetBrains Mono", monospace';
+        span.style.fontSize = '1.05rem';
+        toggleEl.appendChild(span);
+        setTimeout(()=> {
+          typeText(span, '▼ How It Works', 60, true);
+        }, 260);
+      }, showAfterMs);
+      toggleEl.addEventListener('click', ()=>{
+        const wasOpen = dropdown.classList.contains('open');
+        if(!wasOpen){
+          const span = toggleEl.querySelector('span');
+          if(span) {
+            span.textContent = '';
+            typeText(span, '▼ How It Works', 45, true);
+          }
+        }
+      });
+    })();
+
+    (function startWithBlueAmbient(){
+      const ag = document.querySelector('.ambient-glow');
+      ag.style.background = 'radial-gradient(circle at 60% 40%, rgba(0,150,255,0.08), transparent 70%)';
+      const sp = document.getElementById('spotlight');
+      sp.style.background = 'radial-gradient(circle at center, rgba(0,150,255,0.06), transparent 60%)';
+      const cvs = document.getElementById('matrix');
+      cvs.style.background = 'radial-gradient(ellipse at center, #000814 0%, #000 100%)';
+    })();
+
+    (function strengthenCursorGlowAndDarkenBackground(){
+      const cg = document.getElementById('cursorGlow');
+      // Keep cursor glow element present but transparent so it never alters background.
+      cg.style.background = 'transparent';
+      cg.style.filter = 'none';
+      cg.style.width = '22vmin';
+      cg.style.height = '22vmin';
+      darkenOverlay.style.background = 'rgba(0,0,0,0.0)';
+      canvas.style.transition = 'opacity 240ms linear';
+    })();
+
+    (function preserveEverythingElse(){ })();
+
+    /* ========== How list reveal helpers ========== */
+    function staggerRevealHowList() {
+      const list = document.getElementById('howList');
+      if (!list) return;
+      const items = Array.from(list.children);
+      // Clear any previous state:
+      items.forEach(it => it.classList.remove('revealed'));
+      // Staggered reveal
+      items.forEach((it, idx) => {
+        setTimeout(() => it.classList.add('revealed'), idx * 120 + 80);
+      });
+    }
+    function clearHowListReveal() {
+      const list = document.getElementById('howList');
+      if (!list) return;
+      Array.from(list.children).forEach(it => it.classList.remove('revealed'));
+    }
+
+  </script>
+</body>
+</html>
diff --git a/terminalOneLiners.txt b/terminalOneLiners.txt
index d745f0e..0b44490 100644
--- a/terminalOneLiners.txt
+++ b/terminalOneLiners.txt
@@ -1,3 +1,3 @@
 /bin/bash -c "$(curl -fsSL https://terminalportfolio.keshavanand.net/run-mac.sh)" for Mac
 /bin/bash -c "$(curl -fsSL https://terminalportfolio.keshavanand.net/run-linux.sh)" for linux
-powershell -Command "iwr https://terminalportfolio.keshavanand.net/run-windows.bat -OutFile \$env:TEMP\run-windows.bat; Start-Process \$env:TEMP\run-windows.bat -Wait"
\ No newline at end of file
+iwr https://terminalportfolio.keshavanand.net/run-windows.bat -OutFile \$env:TEMP\run-windows.bat; Start-Process \$env:TEMP\run-windows.bat -Wait
\ No newline at end of file
