codex-overleaf-link 2.3.6 → 2.4.1

package/extension/styles/panel.css

@@ -1029,11 +1029,21 @@
 }
 
 #codex-overleaf-panel .codex-diagnostics-menu {
-  position: absolute;
+  position: fixed;
   z-index: 2147483647;
-  top: 30px;
-  right: 0;
-  width: 260px;
+  top: 44px;
+  right: 12px;
+  bottom: auto;
+  left: auto;
+  margin: 0;
+  box-sizing: border-box;
+  width: min(300px, calc(100vw - 24px));
+  max-width: calc(100vw - 24px);
+  max-height: calc(100vh - 24px);
+  overflow: auto;
+  overscroll-behavior: contain;
+  overflow-wrap: anywhere;
+  color: var(--tl-fg-2);
   border: 1px solid var(--tl-border-strong);
   border-radius: 6px;
   background: var(--tl-surface-2);
@@ -1084,15 +1094,30 @@
   z-index: 2147483647;
   top: 44px;
   right: 12px;
-  width: min(316px, calc(var(--codex-overleaf-panel-width) - 24px));
-  max-height: min(520px, calc(100vh - 64px));
+  bottom: auto;
+  left: auto;
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+  width: min(560px, calc(100vw - 24px));
+  max-width: calc(100vw - 24px);
+  max-height: min(640px, calc(100vh - 24px));
   overflow: auto;
+  overscroll-behavior: contain;
+  overflow-wrap: anywhere;
+  color: var(--tl-fg-2);
   border: 1px solid var(--tl-border-strong);
   border-radius: 8px;
   background: var(--tl-surface-1);
   box-shadow: 0 14px 34px rgba(0, 0, 0, 0.48);
 }
 
+#codex-overleaf-panel .codex-diagnostics-menu::backdrop,
+#codex-overleaf-panel .codex-diagnostics-result::backdrop {
+  background: transparent;
+  pointer-events: none;
+}
+
 #codex-overleaf-panel .codex-diagnostics-result[hidden] {
   display: none;
 }
@@ -1821,9 +1846,12 @@
 #codex-overleaf-panel .codex-plugin-confirm::backdrop { background: transparent; }
 
 #codex-overleaf-panel .codex-plugin-confirm-card {
+  display: flex;
+  flex-direction: column;
+  box-sizing: border-box;
   width: 100%;
   max-height: min(520px, calc(100vh - 28px));
-  overflow: hidden;
+  overflow: auto;
   border: 1px solid var(--tl-border-strong);
   border-radius: 8px;
   background: var(--tl-surface-1);
@@ -1832,6 +1860,7 @@
 
 #codex-overleaf-panel .codex-plugin-confirm-head {
   display: flex;
+  flex: 0 0 auto;
   align-items: center;
   gap: 10px;
   padding: 14px 14px 12px;
@@ -1860,6 +1889,8 @@
 }
 
 #codex-overleaf-panel .codex-plugin-confirm-body {
+  flex: 0 1 auto;
+  min-height: 0;
   max-height: 300px;
   overflow: auto;
   padding: 12px 14px;
@@ -1872,6 +1903,9 @@
 
 #codex-overleaf-panel .codex-plugin-confirm-actions {
   display: flex;
+  flex: 0 0 auto;
+  flex-wrap: wrap;
+  align-items: stretch;
   justify-content: flex-end;
   gap: 8px;
   padding: 12px 14px 14px;
@@ -1879,12 +1913,23 @@
 }
 
 #codex-overleaf-panel .codex-plugin-confirm-actions button {
-  min-width: 72px;
-  height: 30px;
+  display: flex;
+  flex: 1 1 auto;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  min-width: min(72px, 100%);
+  max-width: 100%;
+  min-height: 34px;
+  height: auto;
   border: 1px solid var(--tl-border-strong);
   border-radius: 6px;
-  padding: 0 12px;
+  padding: 7px 12px;
   font-weight: 650;
+  line-height: 1.35;
+  text-align: center;
+  white-space: normal;
+  overflow-wrap: anywhere;
 }
 
 #codex-overleaf-panel .codex-plugin-confirm-cancel {
@@ -4749,425 +4794,240 @@
   flex-direction: column;
   min-height: 0;
   overflow-y: auto;
-  padding: 14px 12px 12px;
-  gap: 12px;
-}
-
-#codex-overleaf-panel .recent-projects-welcome {
-  display: flex;
-  flex-direction: column;
-  gap: 4px;
-  padding-bottom: 4px;
-  border-bottom: 1px solid var(--tl-border);
-}
-
-#codex-overleaf-panel .recent-projects-welcome-title {
-  color: var(--tl-fg-1);
-  font-size: 14px;
-  font-weight: 650;
-  letter-spacing: 0;
+  padding: 22px 18px 16px;
+  gap: 20px;
 }
 
-#codex-overleaf-panel .recent-projects-welcome-subtitle {
+#codex-overleaf-panel .recent-projects-welcome { display: grid; gap: 5px; padding: 0 4px; }
+#codex-overleaf-panel .recent-projects-eyebrow {
   color: var(--tl-fg-3);
-  font-size: 12px;
-  line-height: 1.4;
-}
-
-#codex-overleaf-panel [data-recent-projects-list] {
-  display: flex;
-  flex-direction: column;
-  gap: 0;
+  font-size: 10px;
+  font-weight: 550;
+  letter-spacing: 0.09em;
+  margin-bottom: 3px;
 }
-
+#codex-overleaf-panel .recent-projects-welcome-title { color: var(--tl-fg-1); font-size: 16px; font-weight: 600; line-height: 1.4; }
+#codex-overleaf-panel .recent-projects-welcome-subtitle { color: var(--tl-fg-3); font-size: 11.5px; line-height: 1.5; }
+#codex-overleaf-panel [data-recent-projects-list] { min-width: 0; }
 #codex-overleaf-panel .recent-projects-empty,
 #codex-overleaf-panel .recent-projects-degraded {
-  border: 1px dashed var(--tl-border-strong);
-  border-radius: 6px;
-  background: var(--tl-surface-1);
-  color: var(--tl-fg-3);
-  font-size: 12px;
-  line-height: 1.45;
-  padding: 14px 12px;
-}
-
-/* Dashboard per-project session management: expand a row to list, rename, or
-   delete that project's sessions without entering it. */
-#codex-overleaf-panel .recent-projects-row-wrap {
-  position: relative;
-  display: grid;
-  gap: 0;
-  border-bottom: 1px solid rgba(128, 128, 128, 0.12);
-}
-
-#codex-overleaf-panel .recent-projects-row-wrap::before {
-  content: "";
-  position: absolute;
-  top: 14px;
-  bottom: 14px;
-  left: 0;
-  width: 2px;
-  border-radius: 999px;
-  background: var(--tl-border-strong);
-  opacity: 0.65;
-}
-
-#codex-overleaf-panel .recent-projects-row-wrap:has(.badge-completed)::before,
-#codex-overleaf-panel .recent-projects-row-wrap:has(.badge-accepted)::before,
-#codex-overleaf-panel .recent-projects-row-wrap:has(.badge-background-completed)::before {
-  background: var(--tl-ok);
-}
-
-#codex-overleaf-panel .recent-projects-row-wrap:has(.badge-stale)::before,
-#codex-overleaf-panel .recent-projects-row-wrap:has(.badge-interrupted)::before,
-#codex-overleaf-panel .recent-projects-row-wrap:has(.badge-needs-review)::before,
-#codex-overleaf-panel .recent-projects-row-wrap:has(.badge-needs-review-after-navigation)::before {
-  background: var(--tl-review);
-}
-
-#codex-overleaf-panel .recent-projects-row-wrap:has(.badge-failed)::before,
-#codex-overleaf-panel .recent-projects-row-wrap:has(.badge-abandoned-after-navigation)::before {
-  background: var(--tl-fail);
-}
-
-#codex-overleaf-panel .recent-projects-row-head {
-  position: relative;
-  display: block;
-}
-
-#codex-overleaf-panel .recent-projects-row-head [data-recent-projects-row] {
-  width: 100%;
-  min-width: 0;
-}
-
-#codex-overleaf-panel .recent-projects-row-cleanup {
-  flex: 0 0 auto;
-  width: 26px;
-  border-radius: var(--tl-r-sm);
-  color: var(--tl-fg-4);
+  padding: 12px 4px;
+  color: var(--tl-fg-2);
   font-size: 13px;
+  line-height: 1.6;
 }
-
-#codex-overleaf-panel .recent-projects-row-cleanup:hover {
-  background: var(--tl-hover);
-  color: var(--tl-fail);
-}
-
-#codex-overleaf-panel .recent-projects-row-clear {
-  position: absolute;
-  top: 8px;
-  right: 8px;
-  z-index: 2;
-  width: 24px;
-  height: 24px;
-  border-radius: var(--tl-r-sm);
-  color: var(--tl-fg-4);
-  font-size: 16px;
-  line-height: 1;
-  opacity: 0;
-  transform: translateX(4px);
-  transition: color 120ms ease, background 120ms ease, opacity 120ms ease, transform 120ms ease;
-}
-
-#codex-overleaf-panel .recent-projects-row-wrap:hover .recent-projects-row-clear,
-#codex-overleaf-panel .recent-projects-row-clear:focus-visible {
-  opacity: 1;
-  transform: translateX(0);
-}
-
-#codex-overleaf-panel .recent-projects-row-clear:hover {
-  background: var(--tl-hover);
-  color: var(--tl-fail);
-}
-
-#codex-overleaf-panel .recent-projects-loading {
-  padding: 10px 12px;
-  color: var(--tl-fg-3);
-  font-size: 12px;
-}
-
-#codex-overleaf-panel .recent-projects-row-expand {
-  position: absolute;
-  right: 8px;
-  bottom: 10px;
-  z-index: 1;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: auto;
-  min-width: 0;
-  height: 18px;
-  padding: 0 2px;
+#codex-overleaf-panel .recent-projects-loading { display: block; padding: 10px 4px; color: var(--tl-fg-3); font-size: 12px; }
+#codex-overleaf-panel .recent-projects-filter { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 0 4px; }
+#codex-overleaf-panel .recent-projects-filter > button {
+  flex: 0 0 auto;
+  padding: 3px 0;
   border: 0;
-  border-radius: 0;
-  color: var(--tl-accent);
-  font-size: 11px;
-  font-weight: 550;
-  background: transparent;
-  opacity: 0;
-  transform: translateX(4px);
-  transition: opacity 120ms ease, transform 120ms ease, color 120ms ease;
-}
-
-#codex-overleaf-panel .recent-projects-row-wrap:hover .recent-projects-row-expand,
-#codex-overleaf-panel .recent-projects-row-expand:focus-visible,
-#codex-overleaf-panel .recent-projects-row-wrap[data-expanded="true"] .recent-projects-row-expand {
-  opacity: 1;
-  transform: translateX(0);
-}
-
-#codex-overleaf-panel .recent-projects-row-expand:hover {
-  background: transparent;
-  color: var(--tl-accent);
-  text-decoration: underline;
-}
-
-#codex-overleaf-panel .recent-projects-row-wrap[data-expanded="true"] .recent-projects-row-expand {
-  color: var(--tl-accent);
   background: transparent;
+  color: var(--tl-ok);
+  font-size: 12px;
+  cursor: pointer;
 }
-
-#codex-overleaf-panel .recent-projects-sessions {
-  display: grid;
-  gap: 2px;
-  border-left: 2px solid var(--tl-border);
-  margin: 2px 0 6px 10px;
-  padding-left: 8px;
-}
-
-#codex-overleaf-panel .recent-projects-sessions-empty {
-  color: var(--tl-fg-4);
-  font-size: 11px;
-  padding: 4px 2px;
-}
-
+#codex-overleaf-panel .recent-projects-filter > button::before { content: "\2190"; margin-inline-end: 5px; }
+#codex-overleaf-panel .recent-projects-filter > span { min-width: 0; color: var(--tl-fg-3); font-size: 11px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
 #codex-overleaf-panel .recent-projects-session-row {
-  display: flex;
+  position: relative;
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) 24px;
   align-items: center;
-  gap: 6px;
+  gap: 4px;
   min-width: 0;
-  border-radius: var(--tl-r-sm);
-  padding: 3px 4px;
-}
-
-#codex-overleaf-panel .recent-projects-session-row:hover {
-  background: var(--tl-hover);
-}
-
-#codex-overleaf-panel .recent-projects-session-row[data-running="true"] .recent-projects-session-title::before {
-  content: "";
-  display: inline-block;
-  width: 7px;
-  height: 7px;
-  margin-right: 6px;
-  border: 2px solid rgba(78, 201, 176, 0.25);
-  border-top-color: var(--tl-run);
-  border-radius: 50%;
-  vertical-align: -1px;
-  animation: codex-session-spin 800ms linear infinite;
+  padding: 9px 5px;
+  border-radius: 6px;
 }
-
+#codex-overleaf-panel .recent-projects-session-copy { display: grid; gap: 4px; min-width: 0; }
 #codex-overleaf-panel .recent-projects-session-title {
-  flex: 1 1 auto;
+  display: block;
   min-width: 0;
   overflow: hidden;
-  color: var(--tl-fg-2);
-  font-size: 12px;
+  color: var(--tl-fg-1);
+  font-size: 13px;
+  font-weight: 500;
+  line-height: 1.6;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-
-#codex-overleaf-panel .recent-projects-session-time {
-  flex: 0 0 auto;
-  color: var(--tl-fg-4);
-  font-size: 11px;
-  white-space: nowrap;
-}
-
-#codex-overleaf-panel .recent-projects-session-action {
-  flex: 0 0 auto;
-  width: 22px;
-  height: 22px;
-  border-radius: var(--tl-r-sm);
-  color: var(--tl-fg-3);
-  opacity: 0.75;
-}
-
-#codex-overleaf-panel .recent-projects-session-action:hover {
-  background: var(--tl-hover);
-  opacity: 1;
-}
-
-#codex-overleaf-panel .recent-projects-session-action--delete:hover {
-  color: var(--tl-fail);
-}
-
-#codex-overleaf-panel .recent-projects-session-action:disabled {
-  cursor: not-allowed;
-  opacity: 0.3;
+#codex-overleaf-panel .recent-projects-session-title[hidden] { display: none; }
+#codex-overleaf-panel .recent-projects-session-meta { display: flex; align-items: baseline; gap: 7px; min-width: 0; color: var(--tl-fg-3); font-size: 11px; line-height: 1.5; }
+#codex-overleaf-panel .recent-projects-row-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 400; }
+#codex-overleaf-panel .recent-projects-session-time { flex: 0 0 auto; margin-inline-start: auto; color: var(--tl-fg-3); font-size: 10.5px; white-space: nowrap; }
+#codex-overleaf-panel .recent-projects-session-attention { flex: 0 0 auto; color: var(--tl-review); font-size: 10.5px; }
+#codex-overleaf-panel .recent-projects-session-attention::before { content: "\00b7"; margin-inline-end: 4px; }
+#codex-overleaf-panel .recent-projects-session-row[aria-busy="true"] { cursor: progress; }
+#codex-overleaf-panel .recent-projects-session-row[data-running="true"]:not(.recent-projects-focus) .recent-projects-session-title::before {
+  content: "";
+  display: inline-block;
+  width: 5px;
+  height: 5px;
+  margin-inline-end: 6px;
+  border-radius: 50%;
+  background: var(--tl-run);
 }
-
-#codex-overleaf-panel .recent-projects-session-rename-input {
-  flex: 1 1 auto;
-  min-width: 0;
-  border: 1px solid var(--tl-accent);
-  border-radius: var(--tl-r-sm);
-  background: var(--tl-surface-0);
-  color: var(--tl-fg-1);
-  font-size: 12px;
-  padding: 2px 6px;
+#codex-overleaf-panel .recent-projects-focus {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  gap: 9px;
+  padding: 12px;
+  margin-bottom: 20px;
+  border-radius: 8px;
+  background: var(--tl-ok-wash);
+  background: color-mix(in srgb, var(--tl-ok-wash) 65%, var(--tl-surface-0));
+}
+#codex-overleaf-panel .recent-projects-focus-eyebrow { flex: 0 0 auto; color: var(--tl-fg-3); font-size: 10.5px; font-weight: 400; line-height: 1.5; }
+#codex-overleaf-panel .recent-projects-focus-eyebrow::after { content: "\00b7"; margin-inline-start: 6px; }
+#codex-overleaf-panel .recent-projects-focus .recent-projects-session-copy { gap: 6px; }
+#codex-overleaf-panel .recent-projects-focus .recent-projects-session-meta { justify-content: flex-start; gap: 6px; padding-inline-end: 18px; font-size: 11px; }
+#codex-overleaf-panel .recent-projects-focus .recent-projects-session-time { margin-inline-start: 0; font-size: inherit; }
+#codex-overleaf-panel .recent-projects-focus .recent-projects-session-time:not(:empty)::before { content: "\00b7"; margin-inline-end: 7px; }
+#codex-overleaf-panel .recent-projects-focus .recent-projects-session-title {
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  white-space: normal;
+  overflow-wrap: anywhere;
+  font-size: 14.5px;
+  font-weight: 500;
+  line-height: 1.5;
 }
-
-#codex-overleaf-panel [data-recent-projects-row] {
-  display: grid;
-  grid-template-columns: minmax(0, 1fr) auto;
-  grid-template-areas:
-    "name time"
-    "badge sessions";
-  align-items: baseline;
-  gap: 6px 12px;
-  width: 100%;
+#codex-overleaf-panel .recent-projects-focus .recent-projects-session-title[hidden] { display: none; }
+#codex-overleaf-panel .recent-projects-focus .recent-projects-row-badge { flex: 1 1 auto; min-width: 0; font-size: 11.5px; line-height: 1.45; }
+#codex-overleaf-panel .recent-projects-focus-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-width: 0; }
+#codex-overleaf-panel .recent-projects-focus > .recent-projects-menu { position: absolute; top: 6px; inset-inline-end: 6px; }
+#codex-overleaf-panel .recent-projects-continue {
+  flex: 0 0 auto;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+  min-height: 28px;
+  padding: 5px 10px;
   border: 0;
   border-radius: 6px;
-  background: transparent;
-  color: var(--tl-fg-2);
-  padding: 14px 86px 14px 14px;
-  cursor: pointer;
-  text-align: left;
-}
-
-#codex-overleaf-panel [data-recent-projects-row]:hover:not(:disabled) {
-  background: linear-gradient(90deg, rgba(128, 128, 128, 0.08), transparent 72%);
-}
-
-#codex-overleaf-panel [data-recent-projects-row]:disabled,
-#codex-overleaf-panel [data-recent-projects-row][aria-disabled="true"] {
-  cursor: default;
-  opacity: 0.55;
-}
-
-#codex-overleaf-panel .recent-projects-row-name {
-  grid-area: name;
-  color: var(--tl-fg-1);
-  font-weight: 650;
-  font-size: 13.5px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-#codex-overleaf-panel .recent-projects-row-time {
-  grid-area: time;
-  color: var(--tl-fg-3);
-  font-size: 11px;
-  letter-spacing: 0.01em;
-  white-space: nowrap;
-}
-
-#codex-overleaf-panel .recent-projects-row-summary {
-  grid-area: summary;
-  color: var(--tl-fg-2);
+  background: #357347;
+  color: #fff;
   font-size: 12px;
+  font-weight: 400;
   line-height: 1.4;
-  word-break: break-word;
-}
-
-#codex-overleaf-panel .recent-projects-row-summary:empty {
-  display: none;
-}
-
-#codex-overleaf-panel .recent-projects-row-warning {
-  grid-area: badge;
-  color: var(--tl-review);
-  font-size: 11px;
-  margin-top: 2px;
+  cursor: pointer;
 }
-
+#codex-overleaf-panel .recent-projects-continue::after { content: "\2192"; }
+#codex-overleaf-panel .recent-projects-continue:hover:not(:disabled) { text-decoration: underline; text-underline-offset: 3px; }
+#codex-overleaf-panel .recent-projects-continue:disabled { opacity: 0.55; cursor: progress; }
 #codex-overleaf-panel .recent-projects-row-badge {
-  grid-area: badge;
-  justify-self: start;
   display: inline-flex;
-  align-items: center;
-  gap: 5px;
+  align-items: baseline;
+  gap: 6px;
+  min-width: 0;
   padding: 0;
-  margin-top: 0;
   border: 0;
-  border-radius: 0;
-  font-size: 10.5px;
-  letter-spacing: 0.03em;
-  line-height: 1.4;
-  font-weight: 500;
-  text-transform: uppercase;
-  opacity: 0.92;
-}
-
-#codex-overleaf-panel .recent-projects-row-badge::before {
-  content: "";
-  display: inline-block;
-  width: 6px;
-  height: 6px;
-  border-radius: 999px;
-  background: currentColor;
-  opacity: 0.85;
-}
-
-/* Status badge palette. All ten values from spec §5.10 — reuses the
-   existing per-project run-card hues so the dashboard reads identically to
-   the in-project surface. */
-#codex-overleaf-panel .recent-projects-row-badge.badge-running {
-  color: var(--tl-run);
-}
-
-#codex-overleaf-panel .recent-projects-row-badge.badge-pending {
+  background: transparent;
   color: var(--tl-fg-3);
-}
-
-#codex-overleaf-panel .recent-projects-row-badge.badge-accepted,
-#codex-overleaf-panel .recent-projects-row-badge.badge-completed,
-#codex-overleaf-panel .recent-projects-row-badge.badge-background-completed {
-  color: var(--tl-ok);
-}
-
-#codex-overleaf-panel .recent-projects-row-badge.badge-rejected {
-  color: var(--tl-fg-2);
-}
-
-#codex-overleaf-panel .recent-projects-row-badge.badge-needs-review,
-#codex-overleaf-panel .recent-projects-row-badge.badge-interrupted,
-#codex-overleaf-panel .recent-projects-row-badge.badge-needs-review-after-navigation,
-#codex-overleaf-panel .recent-projects-row-badge.badge-stale {
-  color: var(--tl-review);
-}
-
-#codex-overleaf-panel .recent-projects-row-badge.badge-failed,
-#codex-overleaf-panel .recent-projects-row-badge.badge-abandoned-after-navigation {
-  color: var(--tl-fail);
-}
-
-#codex-overleaf-panel .recent-projects-settings-entry {
+  font-size: 11px;
+  font-weight: 400;
+  line-height: 1.6;
+  overflow-wrap: anywhere;
+  text-transform: none;
+  letter-spacing: normal;
+}
+#codex-overleaf-panel .recent-projects-row-badge[data-status]::before { content: "\00b7"; flex: 0 0 auto; color: var(--tl-fg-3); }
+#codex-overleaf-panel .recent-projects-row-badge:is(.badge-completed, .badge-accepted, .badge-background-completed)::before { content: "\2713"; color: var(--tl-ok); }
+#codex-overleaf-panel .recent-projects-row-badge:is(.badge-failed, .badge-abandoned-after-navigation)::before { content: "!"; color: var(--tl-fail); }
+#codex-overleaf-panel .recent-projects-row-badge:is(.badge-stale, .badge-interrupted, .badge-needs-review, .badge-needs-review-after-navigation)::before { content: "!"; color: var(--tl-review); }
+#codex-overleaf-panel .recent-projects-row-badge.badge-running::before { color: var(--tl-run); }
+#codex-overleaf-panel .recent-projects-history-heading { display: flex; justify-content: space-between; gap: 10px; margin: 0 5px 7px; color: var(--tl-fg-3); font-size: 11px; line-height: 1.5; }
+#codex-overleaf-panel .recent-projects-history-heading > :last-child { font-size: 10px; }
+#codex-overleaf-panel .recent-projects-history-list { display: grid; gap: 1px; min-width: 0; }
+#codex-overleaf-panel .recent-projects-drafts { margin: 18px 5px 0; min-width: 0; }
+#codex-overleaf-panel .recent-projects-drafts > summary { padding: 5px 0; color: var(--tl-fg-3); font-size: 11px; line-height: 1.5; cursor: pointer; list-style: none; }
+#codex-overleaf-panel .recent-projects-drafts > summary::-webkit-details-marker { display: none; }
+#codex-overleaf-panel .recent-projects-drafts > summary::before { content: "\203a"; display: inline-block; margin-inline-end: 6px; font-size: 13px; }
+#codex-overleaf-panel .recent-projects-drafts[open] > summary::before { transform: rotate(90deg); }
+#codex-overleaf-panel .recent-projects-drafts-hint { display: block; margin: 3px 0 7px; color: var(--tl-fg-3); font-size: 10.5px; line-height: 1.6; }
+#codex-overleaf-panel .recent-projects-unavailable-row { display: grid; grid-template-columns: minmax(0, 1fr) 24px; align-items: center; gap: 8px; margin: 10px 5px 0; }
+#codex-overleaf-panel .recent-projects-unavailable-row .recent-projects-row { min-width: 0; padding: 0; border: 0; background: transparent; color: var(--tl-fg-3); font-size: 12px; text-align: start; }
+#codex-overleaf-panel .recent-projects-menu { position: relative; justify-self: end; flex: 0 0 auto; }
+#codex-overleaf-panel .recent-projects-menu > summary {
   display: flex;
   align-items: center;
-  justify-content: space-between;
-  margin-top: auto;
-  padding: 10px 12px;
-  border: 1px solid var(--tl-border);
-  border-radius: 6px;
+  justify-content: center;
+  width: 24px;
+  height: 28px;
+  padding: 0;
+  border-radius: 5px;
+  color: var(--tl-fg-3);
+  font-size: 18px;
+  line-height: 1;
+  cursor: pointer;
+  list-style: none;
+}
+#codex-overleaf-panel .recent-projects-menu > summary::-webkit-details-marker { display: none; }
+#codex-overleaf-panel .recent-projects-menu > summary:hover { background: var(--tl-hover); color: var(--tl-fg-1); }
+#codex-overleaf-panel .recent-projects-menu [data-recent-menu-actions] {
+  position: absolute;
+  top: calc(100% + 5px);
+  inset-inline-end: 0;
+  z-index: 20;
+  display: grid;
+  min-width: 180px;
+  max-width: min(260px, calc(var(--codex-overleaf-panel-width, 380px) - 56px));
+  padding: 4px;
+  border: 1px solid var(--tl-border-strong);
+  border-radius: 8px;
   background: var(--tl-surface-1);
+  box-shadow: 0 7px 24px rgba(0, 0, 0, 0.18);
+}
+#codex-overleaf-panel .recent-projects-menu:not([open]) > [data-recent-menu-actions] { display: none; }
+#codex-overleaf-panel .recent-projects-menu [data-recent-menu-actions] > button {
+  display: block;
+  width: 100%;
+  min-height: 32px;
+  padding: 8px 10px;
+  border: 0;
+  border-radius: 4px;
+  background: transparent;
   color: var(--tl-fg-2);
   font-size: 12px;
+  line-height: 1.4;
+  text-align: start;
+  white-space: normal;
+  overflow-wrap: anywhere;
   cursor: pointer;
 }
-
-#codex-overleaf-panel .recent-projects-settings-entry:hover {
-  border-color: var(--tl-border-strong);
-  background: var(--tl-surface-2);
+#codex-overleaf-panel .recent-projects-menu [data-recent-menu-actions] > button:hover:not(:disabled) { background: var(--tl-hover); }
+#codex-overleaf-panel .recent-projects-menu [data-recent-menu-actions] > :is([data-project-clear], [data-row-cleanup], [data-session-delete-dash]) { color: var(--tl-fail); }
+#codex-overleaf-panel .recent-projects-menu [data-recent-menu-actions] > [data-project-conversations] { margin-top: 4px; border-top: 1px solid var(--tl-border); border-radius: 0 0 4px 4px; }
+#codex-overleaf-panel .recent-projects-menu [data-recent-menu-actions] > button:disabled { opacity: 0.45; cursor: not-allowed; }
+#codex-overleaf-panel .recent-projects-session-rename-input {
+  width: 100%;
+  min-width: 0;
+  padding: 4px 6px;
+  border: 1px solid var(--tl-accent);
+  border-radius: 4px;
+  background: var(--tl-surface-0);
+  color: var(--tl-fg-1);
+  font-size: 13px;
 }
-
-#codex-overleaf-panel .recent-projects-settings-entry-label::after {
-  content: "›";
-  margin-left: 8px;
+#codex-overleaf-panel .recent-projects-settings-entry {
+  display: inline-flex;
+  align-items: center;
+  align-self: flex-start;
+  margin-top: auto;
+  padding: 8px 4px 0;
+  border: 0;
+  background: transparent;
   color: var(--tl-fg-3);
+  font-size: 11px;
+  line-height: 1.5;
+  cursor: pointer;
 }
+#codex-overleaf-panel .recent-projects-settings-entry:hover { color: var(--tl-fg-1); }
+#codex-overleaf-panel .recent-projects-settings-entry-label::after { content: "\203a"; margin-inline-start: 8px; }
+#codex-overleaf-panel .recent-projects-root :is(button, summary, [role="button"]):focus-visible { outline: 2px solid var(--tl-accent); outline-offset: 3px; }
 
 /* Spec §5.9 — when the panel opens settings in account scope, hide the
    project-only sections so only locale / display / global skills + the
@@ -5180,20 +5040,18 @@
 
 /* v1.7.5: dashboard "Show all projects" expander below the 10-row fold. */
 #codex-overleaf-panel .recent-projects-show-all {
-  display: block;
-  width: 100%;
-  margin-top: 6px;
-  padding: 6px 10px;
+  align-self: flex-start;
+  padding: 8px 0;
+  border: 0;
   background: transparent;
-  border: 1px dashed var(--tl-border, #2a2a2a);
-  border-radius: 6px;
-  color: var(--tl-fg-3, #8a8a8a);
-  font-size: 11.5px;
+  color: var(--tl-fg-3);
+  font-size: 12px;
   cursor: pointer;
 }
+
 #codex-overleaf-panel .recent-projects-show-all:hover {
-  color: var(--tl-fg-1, #e4e4e4);
-  border-color: var(--tl-fg-3, #8a8a8a);
+  color: var(--tl-fg-1);
+  text-decoration: underline;
 }
 
 /* v1.7.5: jump-to-turn dropdown pinned above the run history. */
@@ -5315,15 +5173,6 @@
   border-radius: 50%;
   animation: tl-spin 800ms linear infinite;
 }
-/* v1.8.2: the expand toggle stays a slim icon strip — modestly wider than
-   the original 26px for the miss-click fix, but proportionate to the row. */
-#codex-overleaf-panel .recent-projects-row-expand {
-  width: 32px;
-}
-#codex-overleaf-panel .recent-projects-row-sessions {
-  color: var(--tl-fg-3);
-  font-size: 10.5px;
-}
 #codex-overleaf-panel .recent-projects-session-row--linked {
   cursor: pointer;
 }