pinokiod 6.0.19 → 6.0.21

package/server/views/terminals.ejs

@@ -33,13 +33,17 @@ body {
 
 body {
   overflow: hidden;
+  display: flex !important;
+  flex-direction: column !important;
+  align-items: stretch;
 }
 
 main {
   display: flex;
+  flex: 1 1 auto;
   min-height: 0;
-  height: var(--terminals-viewport-height);
-  max-height: var(--terminals-viewport-height);
+  height: auto;
+  max-height: none;
   overflow: hidden;
 }
 
@@ -72,6 +76,29 @@ main > .container.terminals-page {
   box-sizing: border-box;
 }
 
+@media only screen and (max-width: 768px) {
+  body {
+    flex-direction: column !important;
+  }
+  header.navheader {
+    display: block;
+    align-self: auto;
+    overflow: visible;
+    width: 100%;
+    min-width: 0;
+    max-width: none;
+    height: auto;
+  }
+  header.navheader h1 {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    overflow-x: auto;
+    overflow-y: hidden;
+    flex-wrap: nowrap;
+  }
+}
+
 .container.terminals-page > form.search {
   flex: 0 0 auto;
   padding: 10px 10px 0;
@@ -184,14 +211,14 @@ body.dark .terminals-search-form .home-mode-switch .mode-link:hover {
 
 .terminals-search-form .home-mode-switch .mode-link.selected,
 .terminals-search-form .home-mode-switch .mode-link[aria-current="page"] {
-  background: rgba(0, 0, 0, 0.9) !important;
+  background: royalblue !important;
   color: #fff !important;
 }
 
 body.dark .terminals-search-form .home-mode-switch .mode-link.selected,
 body.dark .terminals-search-form .home-mode-switch .mode-link[aria-current="page"] {
-  background: rgba(255, 255, 255, 0.12) !important;
-  color: rgba(255, 255, 255, 0.96) !important;
+  background: royalblue !important;
+  color: #fff !important;
 }
 
 #terminals-empty-main {
@@ -206,12 +233,23 @@ body.dark .terminals-search-form .home-mode-switch .mode-link[aria-current="page
   box-sizing: border-box;
 }
 
-#terminals-empty-main.hidden,
-#terminals-session-bank.hidden {
+#terminals-empty-main.hidden {
   display: none;
 }
 
 .terminals-columns {
+  flex: 1;
+  min-height: 0;
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  max-width: 100%;
+  overflow: hidden;
+  gap: 8px;
+  box-sizing: border-box;
+}
+
+.terminals-columns-rail {
   flex: 1;
   min-height: 0;
   display: flex;
@@ -230,6 +268,103 @@ body.dark .terminals-search-form .home-mode-switch .mode-link[aria-current="page
   display: none;
 }
 
+.terminals-list-intro {
+  margin: 10px 12px 8px;
+  padding: 10px 12px;
+  border: 1px solid rgba(127, 127, 127, 0.22);
+  border-radius: 10px;
+  background: rgba(255, 255, 255, 0.02);
+  position: relative;
+  overflow: hidden;
+}
+
+body.dark .terminals-list-intro {
+  border-color: rgba(255, 255, 255, 0.18);
+  background: rgba(255, 255, 255, 0.03);
+}
+
+.terminals-list-intro-head {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.terminals-list-intro-title {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  min-width: 0;
+}
+
+.terminals-list-intro h2 {
+  margin: 0;
+  font-size: 14px;
+  line-height: 1.2;
+}
+
+.terminals-list-intro p {
+  margin: 4px 0 0;
+  font-size: 12px;
+  line-height: 1.35;
+  opacity: 0.86;
+}
+
+.terminals-list-intro-refresh {
+  display: none;
+  align-items: center;
+  gap: 6px;
+  font-size: 11px;
+  line-height: 1;
+  opacity: 0.9;
+  white-space: nowrap;
+  color: #1d4ed8;
+  background: rgba(29, 78, 216, 0.12);
+  border: 1px solid rgba(29, 78, 216, 0.28);
+  border-radius: 999px;
+  padding: 3px 8px;
+  flex: 0 0 auto;
+}
+
+.terminals-list-intro.is-loading .terminals-list-intro-refresh {
+  display: inline-flex;
+}
+
+.terminals-list-intro-progress {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 38%;
+  height: 2px;
+  opacity: 0;
+  pointer-events: none;
+  background: linear-gradient(90deg, rgba(29, 78, 216, 0), rgba(29, 78, 216, 0.95), rgba(29, 78, 216, 0));
+  transform: translateX(-140%);
+}
+
+.terminals-list-intro.is-loading .terminals-list-intro-progress {
+  opacity: 1;
+  animation: terminalsIntroRefreshBar 1.1s linear infinite;
+}
+
+.terminals-list-intro-refresh i {
+  font-size: 11px;
+}
+
+body.dark .terminals-list-intro-refresh {
+  color: #93c5fd;
+  background: rgba(37, 99, 235, 0.22);
+  border-color: rgba(96, 165, 250, 0.4);
+}
+
+@keyframes terminalsIntroRefreshBar {
+  0% {
+    transform: translateX(-140%);
+  }
+  100% {
+    transform: translateX(280%);
+  }
+}
+
 .terminals-column {
   flex: 0 0 100%;
   border: 1px solid rgba(127, 127, 127, 0.2);
@@ -994,7 +1129,86 @@ body.dark .terminals-column .terminals-search input[type="search"] {
 }
 
 .terminals-column .terminals-empty {
-  margin-top: 8px;
+  margin: 10px 12px 0;
+  padding: 20px 16px;
+  border: 1px dashed rgba(127, 127, 127, 0.34);
+  border-radius: 10px;
+  background: linear-gradient(180deg, rgba(255, 255, 255, 0.32), rgba(255, 255, 255, 0.08));
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  text-align: center;
+  min-height: 176px;
+}
+
+body.dark .terminals-column .terminals-empty {
+  border-color: rgba(255, 255, 255, 0.2);
+  background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.01));
+}
+
+.terminals-empty-card {
+  width: 100%;
+  max-width: 460px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 8px;
+}
+
+.terminals-empty-icon {
+  width: 36px;
+  height: 36px;
+  border-radius: 999px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  background: rgba(31, 41, 55, 0.08);
+  color: rgba(17, 24, 39, 0.88);
+  font-size: 15px;
+}
+
+body.dark .terminals-empty-icon {
+  background: rgba(255, 255, 255, 0.12);
+  color: rgba(255, 255, 255, 0.92);
+}
+
+.terminals-empty-title {
+  margin: 2px 0 0;
+  font-size: 15px;
+  font-weight: 700;
+  letter-spacing: 0.01em;
+}
+
+.terminals-empty-message {
+  font-size: 13px;
+  line-height: 1.35;
+  opacity: 0.9;
+}
+
+.terminals-empty-hint {
+  font-size: 11px;
+  line-height: 1.35;
+  opacity: 0.66;
+}
+
+.terminals-empty[data-state="loading"] .terminals-empty-icon {
+  background: rgba(37, 99, 235, 0.12);
+  color: #1d4ed8;
+}
+
+body.dark .terminals-empty[data-state="loading"] .terminals-empty-icon {
+  background: rgba(59, 130, 246, 0.22);
+  color: #93c5fd;
+}
+
+.terminals-empty[data-state="error"] .terminals-empty-icon {
+  background: rgba(220, 38, 38, 0.12);
+  color: #b91c1c;
+}
+
+body.dark .terminals-empty[data-state="error"] .terminals-empty-icon {
+  background: rgba(248, 113, 113, 0.2);
+  color: #fecaca;
 }
 
 .terminals-list {
@@ -1002,6 +1216,17 @@ body.dark .terminals-column .terminals-search input[type="search"] {
   padding: 0;
 }
 
+.terminals-load-more-indicator {
+  padding: 10px 12px 14px;
+  font-size: 12px;
+  text-align: center;
+  opacity: 0.68;
+}
+
+body.dark .terminals-load-more-indicator {
+  opacity: 0.76;
+}
+
 .terminals-list .line {
   margin: 0;
   display: block;
@@ -1077,8 +1302,8 @@ body.dark .terminals-list .line.active {
 }
 
 .terminals-list .line .terminals-session-dot.is-online {
-  background: #18a954;
-  box-shadow: 0 0 0 1px rgba(24, 169, 84, 0.42);
+  background: yellowgreen;
+  box-shadow: 0 0 0 1px rgba(154, 205, 50, 0.42);
 }
 
 .terminals-list .line .terminals-session-dot.is-offline {
@@ -1092,8 +1317,8 @@ body.dark .terminals-list .line .terminals-session-dot {
 }
 
 body.dark .terminals-list .line .terminals-session-dot.is-online {
-  background: #5ed392;
-  box-shadow: 0 0 0 1px rgba(94, 211, 146, 0.42);
+  background: yellowgreen;
+  box-shadow: 0 0 0 1px rgba(154, 205, 50, 0.42);
 }
 
 body.dark .terminals-list .line .terminals-session-dot.is-offline {
@@ -1200,8 +1425,10 @@ body.dark .terminals-list .line .terminals-session-action:hover {
 
 .terminals-column .terminals-open-folder,
 .terminals-column .terminals-fork-session,
+.terminals-column .terminals-deploy-local,
 .terminals-top-session .terminals-open-folder,
-.terminals-top-session .terminals-fork-session {
+.terminals-top-session .terminals-fork-session,
+.terminals-top-session .terminals-deploy-local {
   display: inline-flex;
   align-items: center;
   gap: 6px;
@@ -1214,11 +1441,22 @@ body.dark .terminals-list .line .terminals-session-action:hover {
   font-size: 12px;
   white-space: nowrap;
 }
+.terminals-copy-icon {
+  width: 1.25em;
+  height: 1em;
+  line-height: 1em;
+}
+.terminals-copy-icon .fa-copy {
+  font-size: 0.55em;
+  transform: translate(0.5em, 0.48em);
+}
 
 .terminals-column .terminals-open-folder:disabled,
 .terminals-column .terminals-fork-session:disabled,
+.terminals-column .terminals-deploy-local:disabled,
 .terminals-top-session .terminals-open-folder:disabled,
-.terminals-top-session .terminals-fork-session:disabled {
+.terminals-top-session .terminals-fork-session:disabled,
+.terminals-top-session .terminals-deploy-local:disabled {
   opacity: 0.45;
   cursor: not-allowed;
 }
@@ -1229,6 +1467,93 @@ body.dark .terminals-list .line .terminals-session-action:hover {
   gap: 6px;
 }
 
+.terminals-top-session .terminals-chooser-actions {
+  position: relative;
+}
+
+.terminals-overflow-toggle {
+  display: none;
+  align-items: center;
+  gap: 6px;
+  height: 25px;
+  padding: 0 10px;
+  border-radius: 5px;
+  border: 1px solid rgba(127, 127, 127, 0.25);
+  background: rgba(0, 0, 0, 0.02);
+  color: inherit;
+  cursor: pointer;
+  font-size: 12px;
+  line-height: 1;
+  white-space: nowrap;
+  box-sizing: border-box;
+}
+
+.terminals-overflow-toggle:disabled {
+  opacity: 0.45;
+  cursor: not-allowed;
+}
+
+.terminals-overflow-menu {
+  position: absolute;
+  right: 0;
+  top: calc(100% + 6px);
+  min-width: 190px;
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  padding: 6px;
+  border: 1px solid rgba(127, 127, 127, 0.25);
+  border-radius: 8px;
+  background: #fff;
+  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
+  z-index: 30;
+}
+
+body.dark .terminals-overflow-menu {
+  background: #111827;
+  border-color: rgba(255, 255, 255, 0.12);
+}
+
+.terminals-overflow-menu button {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  width: 100%;
+  height: 30px;
+  padding: 0 10px;
+  border: 1px solid transparent;
+  border-radius: 6px;
+  background: transparent;
+  color: inherit;
+  font-size: 12px;
+  text-align: left;
+  cursor: pointer;
+}
+
+.terminals-overflow-menu button:hover {
+  background: rgba(0, 0, 0, 0.06);
+}
+
+body.dark .terminals-overflow-menu button:hover {
+  background: rgba(255, 255, 255, 0.08);
+}
+
+.terminals-overflow-menu button:disabled {
+  opacity: 0.45;
+  cursor: not-allowed;
+}
+
+@media only screen and (max-width: 980px) {
+  .terminals-top-session .terminals-open-folder,
+  .terminals-top-session .terminals-deploy-local,
+  .terminals-top-session .close-column {
+    display: none;
+  }
+  .terminals-top-session .terminals-overflow-toggle {
+    display: inline-flex;
+  }
+}
+
 .terminals-column iframe {
   width: 100%;
   flex: 1;
@@ -1315,6 +1640,194 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
   color: rgba(255, 255, 255, 0.8);
   border-color: rgba(255, 255, 255, 0.2);
 }
+
+.swal2-popup.pinokio-modern-modal {
+  border-radius: 20px !important;
+  padding: 0 !important;
+  background: #ffffff !important;
+  color: #0f172a !important;
+  box-shadow: 0 32px 80px rgba(15, 23, 42, 0.25) !important;
+  overflow: hidden !important;
+}
+
+body.dark .swal2-popup.pinokio-modern-modal {
+  background: #0f172a !important;
+  color: #e2e8f0 !important;
+  box-shadow: 0 40px 120px rgba(2, 8, 23, 0.7) !important;
+}
+
+.pinokio-modern-html {
+  margin: 0 !important;
+  padding: 0 !important;
+}
+
+.pinokio-modern-close.swal2-close {
+  color: rgba(71, 85, 105, 0.65) !important;
+  font-size: 18px !important;
+  margin: 12px 12px 0 0 !important;
+}
+
+body.dark .pinokio-modern-close.swal2-close {
+  color: rgba(226, 232, 240, 0.6) !important;
+}
+
+.pinokio-modern-confirm.swal2-confirm {
+  background: #2563eb !important;
+  color: #ffffff !important;
+  border: none !important;
+  border-radius: 10px !important;
+  padding: 10px 18px !important;
+  font-size: 13px !important;
+  font-weight: 700 !important;
+}
+
+.pinokio-modern-confirm.swal2-confirm:hover {
+  background: #1d4ed8 !important;
+}
+
+.pinokio-modern-cancel.swal2-cancel {
+  background: rgba(148, 163, 184, 0.16) !important;
+  color: #0f172a !important;
+  border: none !important;
+  border-radius: 10px !important;
+  padding: 10px 18px !important;
+  font-size: 13px !important;
+  font-weight: 600 !important;
+}
+
+body.dark .pinokio-modern-cancel.swal2-cancel {
+  background: rgba(148, 163, 184, 0.14) !important;
+  color: #e2e8f0 !important;
+}
+
+.pinokio-modern-cancel.swal2-cancel:hover {
+  background: rgba(148, 163, 184, 0.24) !important;
+}
+
+body.dark .pinokio-modern-cancel.swal2-cancel:hover {
+  background: rgba(148, 163, 184, 0.22) !important;
+}
+
+.pinokio-modal-surface {
+  display: flex;
+  flex-direction: column;
+}
+
+.pinokio-modal-header {
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  padding: 18px 20px 8px 20px;
+}
+
+.pinokio-modal-icon {
+  width: 40px;
+  height: 40px;
+  border-radius: 12px;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  background: linear-gradient(135deg, rgba(59, 130, 246, 0.18), rgba(59, 130, 246, 0.03));
+  color: #2563eb;
+}
+
+body.dark .pinokio-modal-icon {
+  background: linear-gradient(135deg, rgba(59, 130, 246, 0.25), rgba(59, 130, 246, 0.05));
+  color: #60a5fa;
+}
+
+.pinokio-modal-heading {
+  min-width: 0;
+}
+
+.pinokio-modal-title {
+  font-size: 18px;
+  font-weight: 700;
+  line-height: 1.2;
+  color: #0f172a;
+}
+
+body.dark .pinokio-modal-title {
+  color: #f8fafc;
+}
+
+.pinokio-modal-subtitle {
+  margin-top: 4px;
+  font-size: 13px;
+  line-height: 1.4;
+  color: rgba(71, 85, 105, 0.82);
+}
+
+body.dark .pinokio-modal-subtitle {
+  color: rgba(148, 163, 184, 0.85);
+}
+
+.pinokio-modal-body {
+  padding: 10px 20px 20px 20px;
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.pinokio-modal-note {
+  margin: 0;
+  font-size: 13px;
+  line-height: 1.5;
+  color: rgba(30, 41, 59, 0.9);
+}
+
+body.dark .pinokio-modal-note {
+  color: rgba(226, 232, 240, 0.92);
+}
+
+.pinokio-modal-note code {
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  background: rgba(148, 163, 184, 0.2);
+  padding: 1px 5px;
+  border-radius: 6px;
+}
+
+body.dark .pinokio-modal-note code {
+  background: rgba(148, 163, 184, 0.24);
+}
+
+.pinokio-modal-label {
+  font-size: 12px;
+  font-weight: 600;
+  color: rgba(71, 85, 105, 0.95);
+}
+
+body.dark .pinokio-modal-label {
+  color: rgba(203, 213, 225, 0.9);
+}
+
+.pinokio-modal-input {
+  width: 100%;
+  box-sizing: border-box;
+  border-radius: 10px;
+  border: 1px solid rgba(148, 163, 184, 0.5);
+  background: #ffffff;
+  color: #0f172a;
+  font-size: 14px;
+  padding: 10px 12px;
+  outline: none;
+}
+
+.pinokio-modal-input:focus {
+  border-color: rgba(59, 130, 246, 0.6);
+  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
+}
+
+body.dark .pinokio-modal-input {
+  background: rgba(15, 23, 42, 0.85);
+  border-color: rgba(148, 163, 184, 0.25);
+  color: #f8fafc;
+}
+
+body.dark .pinokio-modal-input:focus {
+  border-color: rgba(96, 165, 250, 0.7);
+  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.25);
+}
 </style>
 </head>
 <body class="<%= theme %>" data-agent="<%= agent %>">
@@ -1349,7 +1862,7 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     <form class='search terminals-search-form'>
       <div class="home-mode-switch" role="tablist" aria-label="Home modes">
         <a class="mode-link" href="/home">
-          <i class="fa-solid fa-box"></i>
+          <i class="fa-solid fa-computer"></i>
           <span>Apps</span>
         </a>
         <a class="mode-link selected" href="/home?mode=terminals" aria-current="page">
@@ -1359,8 +1872,8 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
       </div>
       <div class="terminals-top-search-controls" id="terminals-top-search-controls">
         <input id="terminals-session-search" type='search' class="flexible" placeholder='Search sessions'>
-        <button class="terminals-create-toggle" id="terminals-create-session-button" type="button" aria-label="Chat" aria-expanded="false">
-          <i class="fa-solid fa-plus"></i><span>Chat</span>
+        <button class="terminals-create-toggle" id="terminals-create-session-button" type="button" aria-label="Create workspace" aria-expanded="false">
+          <i class="fa-solid fa-plus"></i><span>Create workspace</span>
         </button>
       </div>
       <div class="terminals-top-session hidden" id="terminals-top-session" aria-live="polite">
@@ -1368,7 +1881,14 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
         <div class="terminals-chooser-actions">
           <button class="terminals-fork-session" id="terminals-top-fork-session" type="button" aria-label="Fork current session" disabled><i class="fa-solid fa-code-branch"></i><span>Fork</span></button>
           <button class="terminals-open-folder" id="terminals-top-open-folder" type="button" aria-label="Open in File Explorer" disabled><i class="fa-solid fa-folder-open"></i><span>Open in File Explorer</span></button>
+          <button class="terminals-deploy-local" id="terminals-top-deploy-local" type="button" aria-label="Copy to apps" disabled><span class="fa-stack terminals-copy-icon" aria-hidden="true"><i class="fa-solid fa-computer fa-stack-1x"></i><i class="fa-solid fa-copy fa-stack-1x"></i></span><span>Copy to apps</span></button>
           <button class="close-column" id="terminals-top-close-session" type="button" aria-label="Close selected session">×</button>
+          <button class="terminals-overflow-toggle" id="terminals-top-more-actions" type="button" aria-haspopup="menu" aria-expanded="false" aria-label="More actions"><i class="fa-solid fa-ellipsis"></i><span>More</span></button>
+          <div class="terminals-overflow-menu hidden" id="terminals-top-overflow-menu" role="menu" aria-label="More session actions">
+            <button type="button" data-action="open-folder" role="menuitem"><i class="fa-solid fa-folder-open"></i><span>Open in File Explorer</span></button>
+            <button type="button" data-action="deploy-local" role="menuitem"><span class="fa-stack terminals-copy-icon" aria-hidden="true"><i class="fa-solid fa-computer fa-stack-1x"></i><i class="fa-solid fa-copy fa-stack-1x"></i></span><span>Copy to apps</span></button>
+            <button type="button" data-action="close-session" role="menuitem"><i class="fa-solid fa-xmark"></i><span>Close session</span></button>
+          </div>
         </div>
       </div>
     </form>
@@ -1381,21 +1901,12 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
           <span>Run one from your terminal and come back here to continue.</span>
         </div>
       </div>
-      <div id='terminals-columns' class='terminals-columns hidden'></div>
+      <div id='terminals-columns' class='terminals-columns hidden'>
+        <div id='terminals-columns-rail' class='terminals-columns-rail'></div>
+      </div>
     </section>
   </div>
 
-  <div id='terminals-session-bank' class='hidden'>
-    <div class='terminals-list'>
-      <% (items || []).forEach((item, index) => { %>
-        <a href="#" role="button" data-description="<%=item.description%>" data-provider-label="<%=item.provider_label || ''%>" data-cwd="<%=item.cwd || ''%>" data-timestamp="<%=item.timestamp || ''%>" data-index="<%=index%>" data-name="<%=item.name%>" data-uri="<%=item.uri%>" data-url="<%=item.browser_url%>" data-fork-url="<%=item.fork_url || ''%>" data-fork-capable="<%=item.fork_capable === false ? '0' : '1'%>" data-fork-disabled-reason="<%=item.fork_disabled_reason || ''%>" data-online="<%=item.online ? '1' : '0'%>" class='line'>
-          <h3><%=item.name%></h3>
-          <div class='description'><%=item.description%></div>
-        </a>
-      <% }) %>
-    </div>
-  </div>
-
   <div id="terminals-launcher-modal" class="terminals-launcher-modal hidden" aria-hidden="true">
     <div class="terminals-launcher-backdrop" data-launcher-close="1"></div>
     <section class="terminals-launcher-panel" role="dialog" aria-modal="true" aria-labelledby="terminals-launcher-title">
@@ -1467,7 +1978,8 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
 (() => {
   const navHeader = document.querySelector("header.navheader")
   const root = document.documentElement
-  const columns = document.querySelector("#terminals-columns")
+  const columnsWrap = document.querySelector("#terminals-columns")
+  const columns = document.querySelector("#terminals-columns-rail")
   const emptyMain = document.querySelector("#terminals-empty-main")
   const searchForm = document.querySelector(".terminals-search-form")
   const sessionSearchInput = document.querySelector("#terminals-session-search")
@@ -1476,7 +1988,10 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
   const topSessionTitle = document.querySelector("#terminals-top-session-title")
   const topSessionForkButton = document.querySelector("#terminals-top-fork-session")
   const topSessionOpenFolderButton = document.querySelector("#terminals-top-open-folder")
+  const topSessionDeployLocalButton = document.querySelector("#terminals-top-deploy-local")
   const topSessionCloseButton = document.querySelector("#terminals-top-close-session")
+  const topSessionMoreButton = document.querySelector("#terminals-top-more-actions")
+  const topSessionOverflowMenu = document.querySelector("#terminals-top-overflow-menu")
   const startProviders = <%-JSON.stringify(providers || [])%>
   const initialSkills = <%-JSON.stringify(skills || [])%>
   let availableSkills = Array.isArray(initialSkills) ? initialSkills : []
@@ -1529,35 +2044,37 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     return parseOnlineFlag(value)
   }
 
-  const rootItems = Array.from(document.querySelectorAll("#terminals-session-bank .line"))
-  let sessionItems = rootItems.map((item) => {
-    const index = item.getAttribute("data-index") || ""
-    const name = item.getAttribute("data-name") || "Session"
-    const description = item.getAttribute("data-description") || ""
-    const providerLabel = item.getAttribute("data-provider-label") || ""
-    const cwd = item.getAttribute("data-cwd") || ""
-    const timestamp = item.getAttribute("data-timestamp") || ""
-    const uri = item.getAttribute("data-uri") || ""
-    const url = item.getAttribute("data-url") || "#"
-    const forkUrl = item.getAttribute("data-fork-url") || ""
-    const forkCapable = parseBooleanFlag(item.getAttribute("data-fork-capable"), true)
-    const forkDisabledReason = item.getAttribute("data-fork-disabled-reason") || ""
-    const online = parseOnlineFlag(item.getAttribute("data-online"))
-    return {
-      index,
-      name,
-      description,
-      providerLabel,
-      cwd,
-      timestamp,
-      uri,
-      url,
-      forkUrl,
-      forkCapable,
-      forkDisabledReason,
-      online,
+  const SESSION_PAGE_SIZE = 120
+  const SESSION_LOAD_MORE_THRESHOLD_PX = 160
+  const SESSION_SEARCH_DEBOUNCE_MS = 250
+  let sessionItems = []
+  let hasAttemptedSessionLoad = false
+  let lastSessionLoadFailed = false
+  let sessionHasMore = true
+  let sessionNextCursor = 0
+  let sessionAppendInProgress = false
+  let currentSessionQuery = ""
+  let sessionSearchDebounceTimer = null
+  let sessionFetchAbortController = null
+  let sessionFetchRequestId = 0
+  let hasTriggeredBackgroundRegistrySync = false
+  let sessionRefreshActivityCount = 0
+
+  const syncIntroLoadingIndicators = () => {
+    if (!columns) {
+      return
     }
-  })
+    const isRefreshing = sessionRefreshActivityCount > 0
+    const introNodes = columns.querySelectorAll(".terminals-list-intro")
+    introNodes.forEach((introNode) => {
+      introNode.classList.toggle("is-loading", isRefreshing)
+    })
+  }
+
+  const adjustSessionRefreshActivity = (delta) => {
+    sessionRefreshActivityCount = Math.max(0, sessionRefreshActivityCount + delta)
+    syncIntroLoadingIndicators()
+  }
 
   const normalizeSessionItem = (item, indexFallback = 0) => {
     const index = normalizeIndex(item && typeof item.index !== "undefined" ? item.index : indexFallback)
@@ -1568,6 +2085,15 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     const timestamp = parseTimestamp(item && item.timestamp ? item.timestamp : null)
     const uri = item && item.uri ? item.uri : ""
     const url = item && (item.browser_url || item.url) ? (item.browser_url || item.url) : "#"
+    const hasResumeCapable = Boolean(item)
+      && (Object.prototype.hasOwnProperty.call(item, "resume_capable") || Object.prototype.hasOwnProperty.call(item, "resumeCapable"))
+    const resumeCapableValue = hasResumeCapable
+      ? (Object.prototype.hasOwnProperty.call(item, "resume_capable") ? item.resume_capable : item.resumeCapable)
+      : undefined
+    const resumeCapable = parseBooleanFlag(resumeCapableValue, true)
+    const resumeDisabledReason = item && (item.resume_disabled_reason || item.resumeDisabledReason)
+      ? String(item.resume_disabled_reason || item.resumeDisabledReason)
+      : ""
     const forkUrl = item && (item.fork_url || item.forkUrl) ? (item.fork_url || item.forkUrl) : ""
     const hasForkCapable = Boolean(item)
       && (Object.prototype.hasOwnProperty.call(item, "fork_capable") || Object.prototype.hasOwnProperty.call(item, "forkCapable"))
@@ -1588,6 +2114,8 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
       timestamp,
       uri,
       url,
+      resumeCapable,
+      resumeDisabledReason,
       forkUrl,
       forkCapable,
       forkDisabledReason,
@@ -1605,6 +2133,9 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
   const normalizeIndex = (value) => {
     return String(value || "").trim()
   }
+  const normalizeCwdKey = (value) => {
+    return normalizeIndex(value).replace(/\/+$/, "")
+  }
 
   const isTerminalColumn = (column) => {
     return Boolean(column && column.isConnected && column.dataset && column.dataset.state === "terminal")
@@ -1641,6 +2172,11 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
       if (topSessionOpenFolderButton) {
         topSessionOpenFolderButton.disabled = true
       }
+      if (topSessionDeployLocalButton) {
+        topSessionDeployLocalButton.disabled = true
+      }
+      closeTopSessionOverflowMenu()
+      syncTopSessionOverflowMenu()
       return
     }
 
@@ -1671,6 +2207,43 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     if (topSessionOpenFolderButton) {
       topSessionOpenFolderButton.disabled = !sessionCwd
     }
+    if (topSessionDeployLocalButton) {
+      topSessionDeployLocalButton.disabled = !sessionCwd
+    }
+    syncTopSessionOverflowMenu()
+  }
+
+  const closeTopSessionOverflowMenu = () => {
+    if (topSessionOverflowMenu) {
+      topSessionOverflowMenu.classList.add("hidden")
+    }
+    if (topSessionMoreButton) {
+      topSessionMoreButton.setAttribute("aria-expanded", "false")
+    }
+  }
+
+  const syncTopSessionOverflowMenu = () => {
+    if (!topSessionOverflowMenu) {
+      return
+    }
+    const openFolderOverflowButton = topSessionOverflowMenu.querySelector("[data-action='open-folder']")
+    if (openFolderOverflowButton && topSessionOpenFolderButton) {
+      openFolderOverflowButton.disabled = Boolean(topSessionOpenFolderButton.disabled)
+    }
+    const deployOverflowButton = topSessionOverflowMenu.querySelector("[data-action='deploy-local']")
+    if (deployOverflowButton && topSessionDeployLocalButton) {
+      deployOverflowButton.disabled = Boolean(topSessionDeployLocalButton.disabled)
+    }
+    const closeOverflowButton = topSessionOverflowMenu.querySelector("[data-action='close-session']")
+    if (closeOverflowButton && topSessionCloseButton) {
+      closeOverflowButton.disabled = Boolean(topSessionCloseButton.disabled)
+    }
+    if (topSessionMoreButton) {
+      const allDisabled = [openFolderOverflowButton, deployOverflowButton, closeOverflowButton]
+        .filter(Boolean)
+        .every((button) => button.disabled)
+      topSessionMoreButton.disabled = allDisabled
+    }
   }
 
   const setActiveTerminalColumn = (column) => {
@@ -1806,10 +2379,29 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     }
     return "Fork unavailable for this session."
   }
+  const getResumeUnavailableReason = (session) => {
+    if (session && typeof session.resumeDisabledReason === "string" && session.resumeDisabledReason.trim().length > 0) {
+      return session.resumeDisabledReason.trim()
+    }
+    return "Resume unavailable for this session."
+  }
+  const canSessionResume = (session) => {
+    if (!session || typeof session !== "object") {
+      return false
+    }
+    if (!parseBooleanFlag(session.resumeCapable, true)) {
+      return false
+    }
+    const resumeUrl = typeof session.url === "string" ? session.url.trim() : ""
+    return resumeUrl.length > 0 && resumeUrl !== "#"
+  }
   const canSessionFork = (session) => {
     if (!session || typeof session !== "object") {
       return false
     }
+    if (!canSessionResume(session)) {
+      return false
+    }
     if (!parseBooleanFlag(session.forkCapable, true)) {
       return false
     }
@@ -1843,10 +2435,12 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     const source = session && typeof session === "object" ? session : {}
     const forkSuffix = `${Date.now()}-${Math.random().toString(16).slice(2)}`
     const baseName = source && source.name ? String(source.name) : "Session"
+    const providerKey = normalizeProviderKey(getProviderKey(source) || "session")
     const forkUrl = buildForkLaunchUrl(source)
     return {
       ...source,
       index: `fork-${normalizeIndex(source.index)}-${forkSuffix}`,
+      uri: `${providerKey}:pending-fork-${forkSuffix}`,
       name: `${baseName} (fork)`,
       url: forkUrl,
       forkCapable: forkUrl !== "#",
@@ -1911,32 +2505,15 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     if (aOnline !== bOnline) {
       return bOnline - aOnline
     }
-    const ta = parseTimestamp(a && a.timestamp ? a.timestamp : null) || 0
-    const tb = parseTimestamp(b && b.timestamp ? b.timestamp : null) || 0
-    if (ta !== tb) {
-      return tb - ta
-    }
-    const an = (a && a.name ? String(a.name) : "").toLowerCase()
-    const bn = (b && b.name ? String(b.name) : "").toLowerCase()
-    return an.localeCompare(bn)
-  }
-  const getExistingOnlineSessionByProvider = (providerKey) => {
-    const normalizedProvider = normalizeProviderKey(providerKey)
-    if (!normalizedProvider) {
-      return null
-    }
-    for (let i = 0; i < sessionItems.length; i++) {
-      const session = sessionItems[i]
-      if (!session || !isSessionOnlineNow(session)) {
-        continue
-      }
-      if (getProviderKey(session) === normalizedProvider) {
-        return session
-      }
-    }
-    return null
+    const ta = parseTimestamp(a && a.timestamp ? a.timestamp : null) || 0
+    const tb = parseTimestamp(b && b.timestamp ? b.timestamp : null) || 0
+    if (ta !== tb) {
+      return tb - ta
+    }
+    const an = (a && a.name ? String(a.name) : "").toLowerCase()
+    const bn = (b && b.name ? String(b.name) : "").toLowerCase()
+    return an.localeCompare(bn)
   }
-
   if (!launcherState.provider && startProviders && startProviders[0] && startProviders[0].key) {
     launcherState.provider = normalizeProviderKey(startProviders[0].key)
   }
@@ -2360,14 +2937,6 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     setLauncherBusy(true)
     let shouldClose = false
     try {
-      await refreshSessionItems({ force: true })
-      refreshChooserRows()
-      const existingSession = getExistingOnlineSessionByProvider(provider)
-      if (existingSession) {
-        openItemInColumn(column, existingSession)
-        shouldClose = true
-        return
-      }
       let uploadToken = ""
       if (launcherState.pendingFiles.length > 0) {
         const uploaded = await uploadLauncherFiles()
@@ -2536,6 +3105,156 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     }
   }
 
+  const deployLocalCopy = async ({ folderName, sessionUri, sessionCwd }) => {
+    try {
+      const response = await fetch("/terminals/deploy/local", {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json"
+        },
+        body: JSON.stringify({
+          folderName,
+          sessionUri,
+          sessionCwd
+        })
+      })
+      let payload = null
+      try {
+        payload = await response.json()
+      } catch (error) {
+      }
+      if (!response.ok) {
+        const message = payload && payload.error ? payload.error : "Failed to deploy locally."
+        return {
+          ok: false,
+          error: message
+        }
+      }
+      return payload
+    } catch (error) {
+      return {
+        ok: false,
+        error: error && error.message ? error.message : "Failed to deploy locally."
+      }
+    }
+  }
+
+  const openDeployLocalModal = async (column) => {
+    if (!column || !column.dataset) {
+      return false
+    }
+    const sessionCwd = column.dataset.sessionCwd || ""
+    const sessionUri = column.dataset.sessionUri || ""
+    if (!sessionCwd) {
+      return false
+    }
+    if (typeof Swal === "undefined" || !Swal || typeof Swal.fire !== "function") {
+      const folderName = window.prompt("Deploy to ~/pinokio/api/<folder-name>. Enter folder name:")
+      if (!folderName) {
+        return false
+      }
+      const result = await deployLocalCopy({
+        folderName,
+        sessionUri,
+        sessionCwd
+      })
+      if (result && result.code === "exists") {
+        window.alert("Folder already exists.")
+        return false
+      }
+      if (!result || result.ok !== true) {
+        window.alert(result && result.error ? result.error : "Failed to deploy locally.")
+        return false
+      }
+      return true
+    }
+
+    const result = await Swal.fire({
+      html: `
+        <div class="pinokio-modal-surface">
+          <div class="pinokio-modal-header">
+            <div class="pinokio-modal-icon"><i class="fa-solid fa-rocket"></i></div>
+            <div class="pinokio-modal-heading">
+              <div class="pinokio-modal-title">Deploy locally</div>
+              <div class="pinokio-modal-subtitle">Copy this active session workspace to a new local project folder.</div>
+            </div>
+          </div>
+          <div class="pinokio-modal-body">
+            <p class="pinokio-modal-note">This will copy the current workspace to <code>~/pinokio/api/&lt;folder-name&gt;</code>.</p>
+            <label class="pinokio-modal-label" for="terminals-deploy-folder-input">New folder name</label>
+            <input id="terminals-deploy-folder-input" class="pinokio-modal-input" placeholder="my-local-workspace" autocomplete="off">
+          </div>
+        </div>
+      `,
+      showCancelButton: true,
+      confirmButtonText: "Create",
+      cancelButtonText: "Cancel",
+      showCloseButton: true,
+      buttonsStyling: false,
+      backdrop: "rgba(9,11,15,0.65)",
+      width: "min(520px, 90vw)",
+      focusConfirm: false,
+      showLoaderOnConfirm: true,
+      allowOutsideClick: () => !Swal.isLoading(),
+      customClass: {
+        popup: "pinokio-modern-modal",
+        htmlContainer: "pinokio-modern-html",
+        closeButton: "pinokio-modern-close",
+        confirmButton: "pinokio-modern-confirm",
+        cancelButton: "pinokio-modern-cancel"
+      },
+      didOpen: () => {
+        const input = Swal.getPopup().querySelector("#terminals-deploy-folder-input")
+        if (input) {
+          input.focus()
+        }
+      },
+      preConfirm: async () => {
+        const input = Swal.getPopup().querySelector("#terminals-deploy-folder-input")
+        const folderName = input ? String(input.value || "").trim() : ""
+        if (!folderName) {
+          Swal.showValidationMessage("Enter a folder name.")
+          return false
+        }
+        if (folderName === "." || folderName === ".." || /[\\/]/.test(folderName) || folderName.includes("\0")) {
+          Swal.showValidationMessage("Folder name cannot include path separators.")
+          return false
+        }
+        const payload = await deployLocalCopy({
+          folderName,
+          sessionUri,
+          sessionCwd
+        })
+        if (payload && payload.code === "exists") {
+          window.alert("Folder already exists.")
+          return false
+        }
+        if (!payload || payload.ok !== true) {
+          Swal.showValidationMessage(payload && payload.error ? payload.error : "Failed to deploy locally.")
+          return false
+        }
+        return payload
+      }
+    })
+
+    if (!result || !result.isConfirmed || !result.value || result.value.ok !== true) {
+      return false
+    }
+    await Swal.fire({
+      title: "Created",
+      text: `Created /api/${result.value.folder || ""}`,
+      icon: "success",
+      buttonsStyling: false,
+      customClass: {
+        popup: "pinokio-modern-modal",
+        htmlContainer: "pinokio-modern-html",
+        closeButton: "pinokio-modern-close",
+        confirmButton: "pinokio-modern-confirm"
+      }
+    })
+    return true
+  }
+
   const getSessionFromColumn = (column) => {
     if (!column || !column.dataset) {
       return null
@@ -2602,9 +3321,30 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
         return
       }
       topSessionOpenFolderButton.disabled = true
+      syncTopSessionOverflowMenu()
       await openInFileExplorer(cwd)
       if (topSessionOpenFolderButton.isConnected) {
         topSessionOpenFolderButton.disabled = false
+        syncTopSessionOverflowMenu()
+      }
+    })
+  }
+
+  if (topSessionDeployLocalButton) {
+    topSessionDeployLocalButton.addEventListener("click", async () => {
+      const activeColumn = getActiveTerminalColumn()
+      if (!activeColumn) {
+        return
+      }
+      const cwd = activeColumn.dataset.sessionCwd || ""
+      if (!cwd) {
+        return
+      }
+      topSessionDeployLocalButton.disabled = true
+      syncTopSessionOverflowMenu()
+      await openDeployLocalModal(activeColumn)
+      if (topSessionDeployLocalButton.isConnected) {
+        renderTopSessionBar()
       }
     })
   }
@@ -2617,9 +3357,11 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
         return
       }
       topSessionForkButton.disabled = true
+      syncTopSessionOverflowMenu()
       const started = forkSessionFromColumn(activeColumn)
       if (!started && topSessionForkButton.isConnected) {
         topSessionForkButton.disabled = false
+        syncTopSessionOverflowMenu()
       }
     })
   }
@@ -2634,6 +3376,57 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     })
   }
 
+  if (topSessionMoreButton && topSessionOverflowMenu) {
+    topSessionMoreButton.addEventListener("click", (event) => {
+      event.preventDefault()
+      event.stopPropagation()
+      if (topSessionMoreButton.disabled) {
+        return
+      }
+      const willOpen = topSessionOverflowMenu.classList.contains("hidden")
+      topSessionOverflowMenu.classList.toggle("hidden", !willOpen)
+      topSessionMoreButton.setAttribute("aria-expanded", willOpen ? "true" : "false")
+    })
+
+    topSessionOverflowMenu.addEventListener("click", (event) => {
+      const button = event.target && event.target.closest ? event.target.closest("button[data-action]") : null
+      if (!button || button.disabled) {
+        return
+      }
+      const action = String(button.dataset.action || "")
+      closeTopSessionOverflowMenu()
+      if (action === "open-folder" && topSessionOpenFolderButton && !topSessionOpenFolderButton.disabled) {
+        topSessionOpenFolderButton.click()
+        return
+      }
+      if (action === "deploy-local" && topSessionDeployLocalButton && !topSessionDeployLocalButton.disabled) {
+        topSessionDeployLocalButton.click()
+        return
+      }
+      if (action === "close-session" && topSessionCloseButton && !topSessionCloseButton.disabled) {
+        topSessionCloseButton.click()
+      }
+    })
+
+    document.addEventListener("click", (event) => {
+      if (topSessionOverflowMenu.classList.contains("hidden")) {
+        return
+      }
+      const withinMenu = event.target && event.target.closest && event.target.closest("#terminals-top-overflow-menu")
+      const withinToggle = event.target && event.target.closest && event.target.closest("#terminals-top-more-actions")
+      if (withinMenu || withinToggle) {
+        return
+      }
+      closeTopSessionOverflowMenu()
+    })
+
+    document.addEventListener("keydown", (event) => {
+      if (event.key === "Escape") {
+        closeTopSessionOverflowMenu()
+      }
+    })
+  }
+
   const isFrameSessionAlreadyStopped = (frame) => {
     if (!frame) {
       return false
@@ -2659,69 +3452,280 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     }
     return false
   }
+  const getCurrentSessionRefreshLimit = () => {
+    return Math.min(Math.max(sessionItems.length || 0, SESSION_PAGE_SIZE), 500)
+  }
+  const collectOpenColumnSessions = () => {
+    if (!columns) {
+      return []
+    }
+    const terminalColumns = columns.querySelectorAll(".terminals-column[data-state='terminal']")
+    const collected = []
+    for (let i = 0; i < terminalColumns.length; i++) {
+      const column = terminalColumns[i]
+      const session = getSessionFromColumn(column)
+      if (!canSessionResume(session)) {
+        continue
+      }
+      const normalized = normalizeSessionItem({
+        ...session,
+        online: true,
+        timestamp: session && session.timestamp ? session.timestamp : Date.now()
+      }, session && session.index ? session.index : i)
+      collected.push(normalized)
+    }
+    return collected
+  }
+  const mergeOpenColumnSessions = (incomingItems) => {
+    const merged = Array.isArray(incomingItems) ? incomingItems.slice() : []
+    const existingKeys = new Set()
+    const existingContextKeys = new Set()
+    const registerSession = (session) => {
+      const key = session && session.uri ? `uri:${session.uri}` : `idx:${normalizeIndex(session && session.index)}`
+      existingKeys.add(key)
+      const providerKey = normalizeProviderKey(getProviderKey(session))
+      const cwdKey = normalizeCwdKey(session && session.cwd ? session.cwd : "")
+      if (providerKey && cwdKey) {
+        existingContextKeys.add(`${providerKey}|${cwdKey}`)
+      }
+    }
+    for (let i = 0; i < merged.length; i++) {
+      registerSession(merged[i])
+    }
+    const openColumnSessions = collectOpenColumnSessions()
+    for (let i = 0; i < openColumnSessions.length; i++) {
+      const session = openColumnSessions[i]
+      const key = session && session.uri ? `uri:${session.uri}` : `idx:${normalizeIndex(session && session.index)}`
+      const providerKey = normalizeProviderKey(getProviderKey(session))
+      const cwdKey = normalizeCwdKey(session && session.cwd ? session.cwd : "")
+      const contextKey = providerKey && cwdKey ? `${providerKey}|${cwdKey}` : ""
+      if (existingKeys.has(key)) {
+        continue
+      }
+      if (contextKey && existingContextKeys.has(contextKey)) {
+        for (let j = 0; j < merged.length; j++) {
+          const candidate = merged[j]
+          if (!candidate) {
+            continue
+          }
+          const candidateProvider = normalizeProviderKey(getProviderKey(candidate))
+          const candidateCwd = normalizeCwdKey(candidate.cwd)
+          if (candidateProvider !== providerKey || candidateCwd !== cwdKey) {
+            continue
+          }
+          merged[j] = {
+            ...candidate,
+            online: true
+          }
+          break
+        }
+        continue
+      }
+      merged.unshift(session)
+      registerSession(session)
+    }
+    return merged
+  }
 
   let refreshSessionPromise = null
+  const appendSessionPage = (incomingItems) => {
+    if (!Array.isArray(incomingItems) || incomingItems.length === 0) {
+      return false
+    }
+    const existingKeys = new Set()
+    for (let i = 0; i < sessionItems.length; i++) {
+      const item = sessionItems[i]
+      if (!item) {
+        continue
+      }
+      const key = item.uri ? `uri:${item.uri}` : `idx:${normalizeIndex(item.index)}`
+      existingKeys.add(key)
+    }
+    let changed = false
+    for (let i = 0; i < incomingItems.length; i++) {
+      const candidate = normalizeSessionItem(incomingItems[i], sessionItems.length + i)
+      const key = candidate.uri ? `uri:${candidate.uri}` : `idx:${normalizeIndex(candidate.index)}`
+      if (existingKeys.has(key)) {
+        continue
+      }
+      existingKeys.add(key)
+      sessionItems.push(candidate)
+      changed = true
+    }
+    return changed
+  }
   const refreshSessionItems = async (options = {}) => {
-    const forceRefresh = Boolean(options && options.force)
+    const syncRefresh = Boolean(options && (options.sync || options.force))
     const includeSkills = Boolean(options && options.skills)
+    const append = Boolean(options && options.append)
+    const hasQueryOverride = Boolean(options && Object.prototype.hasOwnProperty.call(options, "query"))
+    const queryText = hasQueryOverride ? normalizeIndex(options.query) : currentSessionQuery
+    const normalizedQuery = queryText ? String(queryText).trim() : ""
+    const pageSize = Number.isFinite(options && options.limit) && options.limit > 0
+      ? Math.min(Math.max(Math.floor(options.limit), 1), 500)
+      : SESSION_PAGE_SIZE
+    if (refreshSessionPromise && append) {
+      return refreshSessionPromise
+    }
+    if (append && (!sessionHasMore || sessionAppendInProgress)) {
+      return false
+    }
+    if (!append && sessionFetchAbortController) {
+      try {
+        sessionFetchAbortController.abort()
+      } catch (error) {}
+      sessionFetchAbortController = null
+    }
+    if (append) {
+      sessionAppendInProgress = true
+    } else {
+      currentSessionQuery = normalizedQuery
+      sessionNextCursor = 0
+      sessionHasMore = true
+    }
+    const requestId = ++sessionFetchRequestId
+    const controller = new AbortController()
+    sessionFetchAbortController = controller
     const params = new URLSearchParams()
     params.set("mode", "terminals")
     params.set("fetch", "1")
-    if (forceRefresh) {
-      params.set("refresh", "1")
+    params.set("limit", String(pageSize))
+    if (append && sessionNextCursor > 0) {
+      params.set("cursor", String(sessionNextCursor))
+    }
+    if (currentSessionQuery) {
+      params.set("q", currentSessionQuery)
+    }
+    if (syncRefresh) {
+      params.set("sync", "1")
     }
     if (includeSkills) {
       params.set("skills", "1")
     }
     const endpoint = `/home?${params.toString()}`
-    if (refreshSessionPromise) {
-      return refreshSessionPromise
-    }
+    adjustSessionRefreshActivity(1)
     refreshSessionPromise = (async () => {
+      let requestSucceeded = false
+      let shouldMarkError = false
+      let aborted = false
       try {
         const response = await fetch(endpoint, {
           method: "GET",
+          signal: controller.signal,
           headers: {
             "Accept": "application/json"
           }
         })
         if (!response.ok) {
+          shouldMarkError = !append
           return false
         }
         const payload = await response.json()
+        if (requestId !== sessionFetchRequestId || controller.signal.aborted) {
+          aborted = true
+          return false
+        }
         const items = Array.isArray(payload && payload.items) ? payload.items : []
-        sessionItems = items.map((item, index) => normalizeSessionItem(item, index))
-        for (let i = 0; i < sessionItems.length; i++) {
-          sessionItems[i].index = i
+        if (append) {
+          appendSessionPage(items)
+        } else {
+          const normalizedItems = items.map((item, index) => normalizeSessionItem(item, index))
+          sessionItems = mergeOpenColumnSessions(normalizedItems)
+        }
+        const pagination = payload && payload.pagination && typeof payload.pagination === "object" ? payload.pagination : null
+        if (pagination) {
+          const nextCursorRaw = Number.parseInt(pagination.nextCursor, 10)
+          const hasMore = Boolean(pagination.hasMore)
+          sessionHasMore = hasMore
+          sessionNextCursor = hasMore && Number.isFinite(nextCursorRaw) && nextCursorRaw >= 0
+            ? nextCursorRaw
+            : sessionItems.length
+        } else {
+          sessionHasMore = false
+          sessionNextCursor = sessionItems.length
         }
         if (payload && Array.isArray(payload.skills)) {
           availableSkills = payload.skills.slice()
         }
+        requestSucceeded = true
         return true
       } catch (error) {
+        if (error && error.name === "AbortError") {
+          aborted = true
+          return false
+        }
+        shouldMarkError = !append
         return false
       } finally {
-        refreshSessionPromise = null
+        if (requestId === sessionFetchRequestId) {
+          if (!aborted) {
+            hasAttemptedSessionLoad = true
+            if (shouldMarkError) {
+              lastSessionLoadFailed = !requestSucceeded
+            } else if (requestSucceeded) {
+              lastSessionLoadFailed = false
+            }
+          }
+          if (sessionFetchAbortController === controller) {
+            sessionFetchAbortController = null
+          }
+          refreshSessionPromise = null
+        }
+        if (append) {
+          sessionAppendInProgress = false
+        }
+        adjustSessionRefreshActivity(-1)
       }
     })()
     return refreshSessionPromise
   }
-  const findLatestSessionByProviderAndCwd = (providerKey, cwd, excludeUri = "") => {
+  const loadMoreSessionItems = async () => {
+    if (!sessionHasMore || sessionAppendInProgress) {
+      return false
+    }
+    const loaded = await refreshSessionItems({ append: true })
+    if (loaded) {
+      refreshChooserRows()
+    }
+    return loaded
+  }
+  const maybeLoadMoreSessionsForColumn = (column) => {
+    if (!column || !column.isConnected || column.dataset.state !== "chooser") {
+      return
+    }
+    const liveQuery = normalizeIndex(getSessionSearchQuery()).trim()
+    if (liveQuery !== currentSessionQuery) {
+      return
+    }
+    if (!sessionHasMore || sessionAppendInProgress) {
+      return
+    }
+    const listWrap = column.querySelector(".terminals-list-wrap")
+    if (!listWrap) {
+      return
+    }
+    const remaining = listWrap.scrollHeight - (listWrap.scrollTop + listWrap.clientHeight)
+    if (remaining > SESSION_LOAD_MORE_THRESHOLD_PX) {
+      return
+    }
+    void loadMoreSessionItems()
+  }
+  const findLatestSessionByProviderAndCwdIn = (sessions, providerKey, cwd, excludeUri = "") => {
     const normalizedProvider = normalizeProviderKey(providerKey)
-    const normalizedCwd = normalizeIndex(cwd)
+    const normalizedCwd = normalizeCwdKey(cwd)
     if (!normalizedProvider || !normalizedCwd) {
       return null
     }
     let best = null
-    for (let i = 0; i < sessionItems.length; i++) {
-      const session = sessionItems[i]
+    for (let i = 0; i < sessions.length; i++) {
+      const session = sessions[i]
       if (!session) {
         continue
       }
       if (normalizeProviderKey(getProviderKey(session)) !== normalizedProvider) {
         continue
       }
-      if (normalizeIndex(session.cwd) !== normalizedCwd) {
+      if (normalizeCwdKey(session.cwd) !== normalizedCwd) {
         continue
       }
       if (excludeUri && String(session.uri || "") === excludeUri) {
@@ -2733,10 +3737,16 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     }
     return best
   }
+  const findLatestSessionByProviderAndCwd = (providerKey, cwd, excludeUri = "") => {
+    return findLatestSessionByProviderAndCwdIn(sessionItems, providerKey, cwd, excludeUri)
+  }
   const waitForDiscoveredSession = async (providerKey, cwd, excludeUri = "") => {
     const maxAttempts = 10
     for (let attempt = 0; attempt < maxAttempts; attempt++) {
-      await refreshSessionItems()
+      await refreshSessionItems({
+        force: attempt === 0,
+        limit: getCurrentSessionRefreshLimit()
+      })
       const found = findLatestSessionByProviderAndCwd(providerKey, cwd, excludeUri)
       if (found) {
         return found
@@ -2745,6 +3755,70 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     }
     return null
   }
+  const syncDiscoveredSessionForOpenColumn = (column, discoveredSession) => {
+    if (!column || !column.isConnected || !discoveredSession) {
+      return
+    }
+    const discovered = normalizeSessionItem(discoveredSession, 0)
+    const previousIndex = normalizeIndex(column.dataset.sessionIndex)
+    const previousUri = normalizeIndex(column.dataset.sessionUri)
+    const discoveredIndex = normalizeIndex(discovered.index)
+    const discoveredUri = normalizeIndex(discovered.uri)
+    const runningUrl = normalizeIndex(column.dataset.sessionUrl)
+
+    let mergedInList = false
+    for (let i = 0; i < sessionItems.length; i++) {
+      const item = sessionItems[i]
+      if (!item) {
+        continue
+      }
+      const itemIndex = normalizeIndex(item.index)
+      const itemUri = normalizeIndex(item.uri)
+      const matchesByIndex = Boolean(
+        (previousIndex && itemIndex && itemIndex === previousIndex) ||
+        (discoveredIndex && itemIndex && itemIndex === discoveredIndex)
+      )
+      const matchesByUri = Boolean(
+        (previousUri && itemUri && itemUri === previousUri) ||
+        (discoveredUri && itemUri && itemUri === discoveredUri)
+      )
+      if (!matchesByIndex && !matchesByUri) {
+        continue
+      }
+      sessionItems[i] = {
+        ...item,
+        ...discovered,
+        url: discovered.url || item.url
+      }
+      mergedInList = true
+      break
+    }
+    if (!mergedInList) {
+      sessionItems.unshift(discovered)
+    }
+
+    if (previousIndex && discoveredIndex && previousIndex !== discoveredIndex) {
+      setOpenState(previousIndex, "remove", column)
+    }
+    column.dataset.sessionIndex = discoveredIndex || previousIndex
+    column.dataset.sessionName = discovered.name || column.dataset.sessionName || "Session"
+    column.dataset.sessionCwd = discovered.cwd || column.dataset.sessionCwd || ""
+    column.dataset.sessionUri = discoveredUri || previousUri
+    column.dataset.sessionUrl = runningUrl || discovered.url || ""
+    column.dataset.sessionForkUrl = discovered.forkUrl || ""
+    column.dataset.sessionForkCapable = parseBooleanFlag(discovered.forkCapable, true) ? "1" : "0"
+    column.dataset.sessionForkDisabledReason = discovered.forkDisabledReason || ""
+
+    const providerKey = getProviderKey(discovered) || normalizeIndex(column.dataset.sessionProviderKey).toLowerCase()
+    column.dataset.sessionProviderKey = providerKey
+    column.dataset.sessionProviderLabel = discovered.providerLabel || column.dataset.sessionProviderLabel || providerKey || "Session"
+    column.dataset.sessionProviderIcon = getProviderIconSrc(discovered) || getProviderIconByKey(providerKey) || column.dataset.sessionProviderIcon || ""
+
+    if (column.dataset.sessionIndex) {
+      setOpenState(column.dataset.sessionIndex, "add", column)
+    }
+    syncLocalOnlineState(discovered, true)
+  }
 
   const startProviderSession = async (column, providerKey, startButton, providerSelect, selectedSkillIds = [], uploadToken = "") => {
     const normalizedProvider = normalizeIndex(providerKey).toLowerCase()
@@ -2794,9 +3868,6 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
         online: true
       }
       sessionItems.unshift(normalizeSessionItem(session, 0))
-      for (let i = 0; i < sessionItems.length; i++) {
-        sessionItems[i].index = i
-      }
       openItemInColumn(column, session)
       const optimisticUri = session.uri
       const sessionCwd = payload.cwd || ""
@@ -2818,10 +3889,10 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
           }
           return
         }
-        openItemInColumn(column, discovered)
+        syncDiscoveredSessionForOpenColumn(column, discovered)
         refreshChooserRows()
       })()
-      void refreshSessionItems({ force: true }).then((refreshed) => {
+      void refreshSessionItems({ sync: true, limit: getCurrentSessionRefreshLimit() }).then((refreshed) => {
         if (refreshed) {
           refreshChooserRows()
         }
@@ -2885,7 +3956,7 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
       if (isFrameSessionAlreadyStopped(frame)) {
         closeColumn(column)
         syncLocalOnlineState(columnSession, false)
-        void refreshSessionItems({ force: true }).then((refreshed) => {
+        void refreshSessionItems({ sync: true, limit: getCurrentSessionRefreshLimit() }).then((refreshed) => {
           if (refreshed) {
             refreshChooserRows()
           }
@@ -2908,7 +3979,7 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     }
     closeColumn(column)
     syncLocalOnlineState(columnSession, false)
-    void refreshSessionItems({ force: true }).then((refreshed) => {
+    void refreshSessionItems({ sync: true, limit: getCurrentSessionRefreshLimit() }).then((refreshed) => {
       if (refreshed) {
         refreshChooserRows()
       }
@@ -2977,6 +4048,55 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     return row
   }
 
+  const setPlaceholderState = (placeholder, state, details = {}) => {
+    if (!placeholder) {
+      return
+    }
+    const normalizedState = normalizeIndex(state) || "empty"
+    const title = details && typeof details.title === "string" ? details.title : "Session history"
+    const message = details && typeof details.message === "string" ? details.message : ""
+    const hint = details && typeof details.hint === "string" ? details.hint : ""
+    let iconClass = "fa-solid fa-clock-rotate-left"
+    if (normalizedState === "loading") {
+      iconClass = "fa-solid fa-circle-notch fa-spin"
+    } else if (normalizedState === "error") {
+      iconClass = "fa-solid fa-triangle-exclamation"
+    } else if (normalizedState === "search-empty") {
+      iconClass = "fa-solid fa-magnifying-glass"
+    }
+    const hintHtml = hint ? `<div class="terminals-empty-hint">${escapeHtml(hint)}</div>` : ""
+    placeholder.dataset.state = normalizedState
+    placeholder.innerHTML = `
+      <div class="terminals-empty-card">
+        <div class="terminals-empty-icon" aria-hidden="true"><i class="${iconClass}"></i></div>
+        <h1 class="terminals-empty-title">${escapeHtml(title)}</h1>
+        <div class="terminals-empty-message">${escapeHtml(message)}</div>
+        ${hintHtml}
+      </div>
+    `
+  }
+  const makeListIntroNode = () => {
+    const intro = document.createElement("div")
+    intro.className = "terminals-list-intro"
+    if (sessionRefreshActivityCount > 0) {
+      intro.classList.add("is-loading")
+    }
+    intro.innerHTML = `
+      <div class="terminals-list-intro-progress" aria-hidden="true"></div>
+      <div class="terminals-list-intro-head">
+        <div class="terminals-list-intro-title">
+          <h2>Agent Workspaces</h2>
+          <span class="terminals-list-intro-refresh" role="status" aria-live="polite">
+            <i class="fa-solid fa-circle-notch fa-spin" aria-hidden="true"></i>
+            <span>Refreshing</span>
+          </span>
+        </div>
+      </div>
+      <p>Resume or fork existing sessions, or start a new workspace powered by Codex, Claude, or Gemini.</p>
+    `
+    return intro
+  }
+
   const buildRows = (column, query = "") => {
     const list = column.querySelector(".terminals-list")
     const placeholder = column.querySelector(".terminals-empty")
@@ -2997,6 +4117,10 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     }
     visibleSessions.sort(compareSessionsForChooser)
     let visible = 0
+    if (visibleSessions.length > 0) {
+      const introNode = makeListIntroNode()
+      list.appendChild(introNode)
+    }
     for (let i = 0; i < visibleSessions.length; i++) {
       const session = visibleSessions[i]
       const row = makeRowNode(session, normalized)
@@ -3006,10 +4130,15 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
       })
       const resumeButton = row.querySelector("[data-session-action='resume']")
       if (resumeButton) {
-        resumeButton.title = "Resume this session"
+        const resumeAvailable = canSessionResume(session)
+        resumeButton.disabled = !resumeAvailable
+        resumeButton.title = resumeAvailable ? "Resume this session" : getResumeUnavailableReason(session)
         resumeButton.addEventListener("click", (event) => {
           event.preventDefault()
           event.stopPropagation()
+          if (!resumeAvailable) {
+            return
+          }
           openItemInColumn(column, session)
         })
       }
@@ -3031,27 +4160,76 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
           openItemInColumn(column, forkedSession)
         })
       }
-      row.setAttribute("aria-label", canSessionFork(session) ? `${session.name}. Use Resume or Fork.` : `${session.name}. Use Resume.`)
+      const resumeAvailable = canSessionResume(session)
+      const forkAvailable = canSessionFork(session)
+      if (resumeAvailable && forkAvailable) {
+        row.setAttribute("aria-label", `${session.name}. Use Resume or Fork.`)
+      } else if (resumeAvailable) {
+        row.setAttribute("aria-label", `${session.name}. Use Resume.`)
+      } else {
+        row.setAttribute("aria-label", `${session.name}. Resume unavailable.`)
+      }
       list.appendChild(row)
       visible += 1
     }
+    if (visible > 0 && (sessionAppendInProgress || sessionHasMore)) {
+      const loadMoreRow = document.createElement("div")
+      loadMoreRow.className = "terminals-load-more-indicator"
+      loadMoreRow.textContent = sessionAppendInProgress ? "Loading more sessions..." : "Scroll to load more sessions."
+      list.appendChild(loadMoreRow)
+    }
 
     if (!placeholder) {
       return
     }
 
+    if (!hasAttemptedSessionLoad) {
+      setPlaceholderState(placeholder, "loading", {
+        title: "Loading session history",
+        message: "Finding recent Codex, Claude, and Gemini sessions.",
+        hint: "You can continue using Pinokio while this finishes."
+      })
+      placeholder.classList.remove("hidden")
+      return
+    }
+
     if (sessionItems.length === 0 || visible === 0) {
-      const title = placeholder.querySelector("h1")
-      const message = placeholder.querySelector("div")
+      if (lastSessionLoadFailed && sessionItems.length === 0 && !normalized) {
+        setPlaceholderState(placeholder, "error", {
+          title: "Could not load sessions",
+          message: "Session history is temporarily unavailable.",
+          hint: "Click Refresh to retry."
+        })
+        placeholder.classList.remove("hidden")
+        return
+      }
       if (normalized && sessionItems.length > 0) {
-        if (title) title.innerText = "No matches."
-        if (message) message.innerText = "No sessions matched your search."
+        if (sessionHasMore || sessionAppendInProgress) {
+          setPlaceholderState(placeholder, "loading", {
+            title: "Searching more sessions",
+            message: sessionAppendInProgress
+              ? "Loading additional sessions for your search."
+              : "Scroll to load more results."
+          })
+        } else {
+          setPlaceholderState(placeholder, "search-empty", {
+            title: "No matching sessions",
+            message: "No sessions matched your current search.",
+            hint: "Try a provider name, session topic, or path keyword."
+          })
+        }
       } else if (sessionItems.length === 0) {
-        if (title) title.innerText = "Terminal sessions."
-        if (message) message.innerText = "No resumable Codex, Claude, or Gemini sessions were found."
+        setPlaceholderState(placeholder, "empty", {
+          title: "No sessions yet",
+          message: "No resumable Codex, Claude, or Gemini sessions were found.",
+          hint: "Start an agent once, then return here to resume it."
+        })
       } else {
-        if (title) title.innerText = "Terminal sessions."
-        if (message) message.innerText = "No resumable Codex, Claude, or Gemini sessions were found."
+        setPlaceholderState(placeholder, "empty", {
+          title: "No sessions available",
+          message: "No resumable sessions are currently available.",
+          hint: ""
+        })
       }
       placeholder.classList.remove("hidden")
     } else {
@@ -3064,6 +4242,7 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     const chooserColumns = columns.querySelectorAll(".terminals-column[data-state='chooser']")
     chooserColumns.forEach((chooserColumn) => {
       buildRows(chooserColumn, query)
+      maybeLoadMoreSessionsForColumn(chooserColumn)
     })
   }
 
@@ -3080,36 +4259,55 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
         </div>
       </header>` : ""}
       <div class="terminals-chooser-content">
-        <div class="terminals-empty">
-          <h1>Terminal sessions.</h1>
-          <br>
-          <div>No resumable Codex, Claude, or Gemini sessions were found.</div>
-          <span>Run one from your terminal and come back here to continue.</span>
-        </div>
+        <div class="terminals-empty" data-state="loading" aria-live="polite"></div>
         <div class="terminals-list-wrap">
           <div class="terminals-list"></div>
         </div>
       </div>
     `
     const closeButton = column.querySelector(".close-column")
+    const listWrap = column.querySelector(".terminals-list-wrap")
 
     if (closeButton) {
       closeButton.addEventListener("click", () => {
         removeColumn(column)
       })
     }
+    if (listWrap) {
+      listWrap.addEventListener("scroll", () => {
+        maybeLoadMoreSessionsForColumn(column)
+      })
+    }
 
     const resolvedRefreshOptions = refreshOptions && typeof refreshOptions === "object" ? refreshOptions : {}
+    const refreshQuery = getSessionSearchQuery()
+    const resolvedRequestOptions = {
+      ...resolvedRefreshOptions,
+      query: refreshQuery
+    }
     buildRows(column, getSessionSearchQuery())
-    refreshSessionItems(resolvedRefreshOptions).then(() => {
+    refreshSessionItems(resolvedRequestOptions).then(() => {
       if (!column.isConnected || column.dataset.state !== "chooser") {
         return
       }
       buildRows(column, getSessionSearchQuery())
+      maybeLoadMoreSessionsForColumn(column)
       if (launcherState.open) {
         renderLauncherSelectedChips()
         renderLauncherSkillList()
       }
+      if (!hasTriggeredBackgroundRegistrySync) {
+        hasTriggeredBackgroundRegistrySync = true
+        void refreshSessionItems({
+          sync: true,
+          limit: getCurrentSessionRefreshLimit(),
+          query: getSessionSearchQuery()
+        }).then((refreshed) => {
+          if (refreshed || hasAttemptedSessionLoad) {
+            refreshChooserRows()
+          }
+        })
+      }
     })
     syncActiveStates()
     ensureLayout()
@@ -3154,11 +4352,11 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
   const ensureLayout = () => {
     if (columns.children.length === 0) {
       emptyMain.classList.remove("hidden")
-      columns.classList.add("hidden")
+      columnsWrap.classList.add("hidden")
       renderTopSessionBar()
       return
     }
-    columns.classList.remove("hidden")
+    columnsWrap.classList.remove("hidden")
     emptyMain.classList.add("hidden")
     renderTopSessionBar()
   }
@@ -3207,8 +4405,16 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     const rawGap = columnsStyle.getPropertyValue("gap") || columnsStyle.getPropertyValue("column-gap") || "10px"
     const parsedGap = parseFloat(rawGap)
     const gap = Number.isNaN(parsedGap) ? 10 : parsedGap
-    const available = Math.max(0, columns.clientWidth - (gap * Math.max(columnCount - 1, 0)))
-    const width = `${Math.max(0, available / columnCount)}px`
+    const measuredWidth = columns.getBoundingClientRect().width
+    const parentWidth = columns.parentElement ? columns.parentElement.getBoundingClientRect().width : 0
+    const wrapWidth = columnsWrap ? columnsWrap.getBoundingClientRect().width : 0
+    const fallbackViewportWidth = window.innerWidth || 0
+    const containerWidth = Math.max(columns.clientWidth || 0, measuredWidth || 0, parentWidth || 0, wrapWidth || 0, fallbackViewportWidth || 0)
+    if (!(containerWidth > 0)) {
+      return
+    }
+    const available = Math.max(0, containerWidth - (gap * Math.max(columnCount - 1, 0)))
+    const width = `${Math.max(1, available / columnCount)}px`
     Array.from(columns.children).forEach((col) => {
       col.style.flex = `0 0 ${width}`
     })
@@ -3233,6 +4439,9 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
   }
 
   const openItemInColumn = (column, session) => {
+    if (!canSessionResume(session)) {
+      return
+    }
     const existingColumn = getOpenColumnByIndex(session.index)
     if (existingColumn && existingColumn !== column) {
       existingColumn.scrollIntoView({ behavior: "smooth", inline: "end" })
@@ -3258,7 +4467,7 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
       requestTerminalFocus(frame)
     }, 40)
     setTimeout(() => {
-      void refreshSessionItems({ force: true }).then((refreshed) => {
+      void refreshSessionItems({ sync: true, limit: getCurrentSessionRefreshLimit() }).then((refreshed) => {
         if (refreshed) {
           refreshChooserRows()
         }
@@ -3353,7 +4562,19 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
 
   if (sessionSearchInput) {
     sessionSearchInput.addEventListener("input", () => {
+      if (sessionSearchDebounceTimer) {
+        clearTimeout(sessionSearchDebounceTimer)
+      }
+      const nextQuery = sessionSearchInput.value || ""
       refreshChooserRows()
+      sessionSearchDebounceTimer = setTimeout(() => {
+        sessionSearchDebounceTimer = null
+        void refreshSessionItems({ query: nextQuery }).then((loaded) => {
+          if (loaded || hasAttemptedSessionLoad) {
+            refreshChooserRows()
+          }
+        })
+      }, SESSION_SEARCH_DEBOUNCE_MS)
     })
   }
 
@@ -3390,10 +4611,7 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
   })
 
   const setViewport = () => {
-    const viewportHeight = window.visualViewport ? window.visualViewport.height : window.innerHeight
-    const headerHeight = navHeader ? navHeader.getBoundingClientRect().height : 0
-    const frameHeight = Math.max(0, viewportHeight - headerHeight)
-    root.style.setProperty("--terminals-viewport-height", `${frameHeight}px`)
+    closeTopSessionOverflowMenu()
     setColumnLayout()
   }
 
@@ -3407,7 +4625,7 @@ body.dark .swal2-popup.terminals-confirm-modal .swal2-styled.swal2-cancel {
     window.visualViewport.addEventListener("scroll", setViewport)
   }
 
-  addChooserColumn({ force: true })
+  addChooserColumn()
   refreshChooserRows()
   if (sessionSearchInput) {
     requestAnimationFrame(() => {