prreviewbuddy 0.49.0 → 0.50.1

package/static/shell.css

@@ -318,6 +318,69 @@ body > * { flex: 0 0 auto; }
 }
 .prb-change-ref .prb-arrow { color: var(--text-muted); }
 
+/* ── Review range ──
+   Which commits the review is of. A sibling of `.prb-change-ref`, never a child: that element clips
+   to keep the bar on one line, and would cut the panel off. The label is a fact, so it reads as
+   part of the bar's state rather than as a control competing with it. */
+.prb-range {
+  position: relative;
+  flex: none;
+  margin-left: -8px;
+}
+.prb-range-summary {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  padding: 2px 9px;
+  border: 1px solid var(--border);
+  border-radius: 999px;
+  color: var(--text-secondary);
+  font-size: var(--t-meta);
+  white-space: nowrap;
+  cursor: pointer;
+  user-select: none;
+  list-style: none;
+}
+.prb-range-summary::-webkit-details-marker { display: none; }
+.prb-range-summary::after {
+  content: '\25BE';
+  font-size: 9px; /* the disclosure caret, sized to the mark, not the type scale */
+  line-height: 1;
+}
+.prb-range[open] .prb-range-summary::after { content: '\25B4'; }
+.prb-range-summary:hover { color: var(--text-primary); background: var(--surface-2); }
+.prb-range-summary:focus-visible { outline: 2px solid var(--brand-hover); outline-offset: 2px; }
+/* Anchored under the pill and out of flow, so opening it never moves the bar or the review. */
+.prb-range-panel {
+  position: absolute;
+  top: calc(100% + 8px);
+  left: 0;
+  z-index: 3;
+  width: max-content;
+  max-width: min(420px, calc(100vw - 32px));
+  padding: 10px 14px;
+  border: 1px solid var(--border);
+  border-radius: 9px;
+  background: var(--surface-raised);
+  box-shadow: 0 10px 28px var(--shadow-float);
+  font-size: var(--t-meta);
+  line-height: var(--lh-body);
+  color: var(--text-secondary);
+  white-space: normal;
+  overflow-wrap: anywhere;
+}
+.prb-range-panel p { margin: 0 0 6px; }
+.prb-range-panel p:last-child { margin-bottom: 0; }
+.prb-range-panel code { font-size: var(--t-code); color: var(--text-primary); }
+.prb-range-panel a { color: var(--brand-hover); }
+/* Phone width: anchored to the pill, the panel ran off the right edge. Here it keeps its place just
+   under the pill (static top) but spans the page with the usual 16px gutter. Placed after the base
+   rules above, which it overrides at the same specificity. */
+@media (max-width: 600px) {
+  .prb-range { position: static; }
+  .prb-range-panel { top: auto; left: 16px; right: 16px; margin-top: 8px; width: auto; max-width: none; }
+}
+
 .prb-header-stats {
   margin-left: auto;
   display: flex;
@@ -1506,26 +1569,32 @@ a.prb-rail-item { text-decoration: none; }
 
 .prb-ask-header {
   display: flex;
-  align-items: baseline;
+  align-items: center;
   gap: 8px;
   padding: 16px 18px 12px;
   border-bottom: 1px solid var(--border);
 }
+/* The title and what the next question is about, stacked. It takes the free space, which keeps
+   the two icon controls at the right edge. */
+.prb-ask-heading {
+  flex: 1;
+  min-width: 0;
+  margin: 0;
+}
 .prb-ask-header h2 {
   margin: 0;
   font-size: var(--t-section);
   font-weight: 600;
   color: var(--text-primary);
 }
+/* Never truncated: the theme's name is the whole point of the line, so it wraps however long. */
 .prb-ask-scope {
-  margin-left: auto;
+  margin: 2px 0 0;
   font-size: var(--t-micro);
   color: var(--text-muted);
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  max-width: 150px;
+  overflow-wrap: anywhere;
 }
+.prb-ask-scope [data-ask-scope] { color: var(--text-secondary); }
 
 .prb-ask-log {
   flex: 1;
@@ -4782,6 +4851,41 @@ a.prb-rail-item { text-decoration: none; }
   color: var(--text-secondary);
 }
 .prb-settings-help code { font-size: var(--t-code); color: var(--text-primary); }
+
+/* ── Help ──
+   Reading, not settings: prose at a readable measure, one topic per section, each with an anchor a
+   place elsewhere in the product can link to. */
+.prb-help-topic {
+  max-width: 46rem;
+  padding: 20px 0;
+  border-bottom: 1px solid var(--border);
+  font-size: var(--t-body);
+  line-height: var(--lh-body);
+  color: var(--text-secondary);
+  /* Clear of the sticky bars when arrived at by its anchor. */
+  scroll-margin-top: 96px;
+}
+.prb-help-topic:first-of-type { padding-top: 4px; }
+.prb-help-topic:last-of-type { border-bottom: 0; }
+.prb-help-topic h2 { margin: 0 0 12px; font-size: var(--t-section); font-weight: 600; color: var(--text-primary); }
+.prb-help-topic h3 { margin: 20px 0 8px; font-size: var(--t-body); font-weight: 600; color: var(--text-primary); }
+.prb-help-topic p { margin: 0 0 10px; }
+.prb-help-topic ul { margin: 0 0 10px; padding-left: 20px; }
+.prb-help-topic li { margin-bottom: 4px; }
+.prb-help-topic code { font-size: var(--t-code); color: var(--text-primary); }
+/* A diagram's spacing is its meaning, so it never wraps: a narrow window scrolls it instead. */
+.prb-help-diagram {
+  margin: 0 0 12px;
+  padding: 12px 14px;
+  overflow-x: auto;
+  border: 1px solid var(--border);
+  border-radius: 8px;
+  background: var(--surface-2);
+  font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, monospace;
+  font-size: var(--t-code);
+  line-height: 1.4;
+  color: var(--text-primary);
+}
 /* Empty until there is something wrong, and it collapses when there is not: an always-present gap
    under a field reads as a control that is missing part of itself. */
 .prb-settings-error {
@@ -4991,8 +5095,8 @@ body .prb-body[data-focus='buddy'] .prb-msg-user { max-width: min(90%, 78ch); }
 .prb-focus-toggle .prb-focus-collapse,
 .prb-focus-toggle[aria-pressed='true'] .prb-focus-expand { display: none; }
 .prb-focus-toggle[aria-pressed='true'] .prb-focus-collapse { display: block; }
-/* In the assistant's header it follows the scope label, which takes the free space with
-   `margin-left: auto`, so the control stays at the right edge beside it. */
+/* In the assistant's header it follows the heading, which takes the free space, so the control
+   stays at the right edge beside it. */
 .prb-ask-header :is(.prb-focus-toggle, .prb-ask-hide) { align-self: center; }
 
 /* The same control in the light document pane, in the pane's palette. */
@@ -5061,10 +5165,13 @@ body .prb-body[data-focus='buddy'] .prb-msg-user { max-width: min(90%, 78ch); }
   width: 24px;
   height: 24px;
   margin-top: -3px;
-  color: var(--pane-accent);
+  border-radius: 6px;
+  color: var(--pane-ink-muted);
 }
-.prb-doc .prb-ask-buddy-trigger:hover,
-.prb-doc .prb-ask-buddy-trigger[aria-expanded='true'] { background: var(--pane-bg); color: var(--pane-accent-ink); }
+/* Copy beside it has the same rest, hover and size (sidebar.css): grey, a soft surface, and purple
+   only while this menu is open, because then it is the AI action in play. */
+.prb-doc .prb-ask-buddy-trigger:hover { background: rgba(31, 35, 40, 0.07); color: var(--pane-ink-muted); }
+.prb-doc .prb-ask-buddy-trigger[aria-expanded='true'] { background: rgba(130, 80, 223, 0.1); color: var(--pane-accent-ink); }
 .prb-doc .prb-ask-buddy-trigger:focus-visible { outline: 2px solid var(--pane-accent); outline-offset: -2px; }
 
 /* The tooltip Copy uses beside it, so the two icons explain themselves the same way. */

package/static/sidebar.css

@@ -653,6 +653,51 @@
   margin-top: 2px;
 }
 
+/* The extension's cards, laid out as the workspace's are: the figure leads and the label sits
+   beside it, pinned to the top row so four cards align with or without a note. Only once each
+   card has the room: at the sidebar's narrowest a quarter-width card cannot hold "Questions" beside
+   its figure, and the stacked card above stays. The grid is the query container because the rule
+   only needs its children; nothing else in the panel is contained. Selectors carry the extension
+   class, so they outrank the base rules wherever those sit in the file. */
+.pr-helper-extension .pr-helper-overview-stats { container-type: inline-size; }
+
+@container (min-width: 400px) {
+  .pr-helper-extension .pr-helper-overview-stat {
+    display: grid;
+    grid-template-columns: auto minmax(0, 1fr);
+    grid-template-rows: auto 1fr;
+    column-gap: 8px;
+    align-items: start;
+    padding: 10px 12px;
+    text-align: left;
+  }
+  .pr-helper-extension .pr-helper-overview-stat-value {
+    grid-column: 1;
+    grid-row: 1 / span 2;
+    font-size: 24px;
+    font-weight: 300;
+    line-height: 1;
+    font-variant-numeric: tabular-nums;
+  }
+  .pr-helper-extension .pr-helper-overview-stat-value-wide { font-size: 15px; }
+  .pr-helper-extension .pr-helper-overview-stat-label {
+    grid-column: 2;
+    grid-row: 1;
+    justify-self: start;
+    /* Squares the label's cap height with the figure's top. */
+    margin-top: 5px;
+  }
+  .pr-helper-extension .pr-helper-overview-stat-note {
+    grid-column: 2;
+    grid-row: 2;
+    justify-self: start;
+  }
+  /* Into flow, ahead of the word, now that nothing is centred for it to compensate. */
+  .pr-helper-extension .pr-helper-overview-stat-info { position: static; transform: none; }
+  /* The whole card lights up as the link, so the arrow only pushed the label off the figure. */
+  .pr-helper-extension .pr-helper-overview-stat-arrow { display: none; }
+}
+
 /* Explains a capped review, and only ever appears on one. Sits ahead of the 11px label rather
    than beside the value, so it's sized to that row — against the bold number it read as a
    glyph belonging to the count. */
@@ -895,11 +940,30 @@
 .pr-helper-finding-copy {
   position: relative;
   flex-shrink: 0;
-  margin-top: -1px;
   opacity: 1;
   font-size: 12px;
 }
 
+/* Copy and Ask Buddy are a pair and speak one interaction language, on both surfaces: the same
+   24px target and 6px corner, neutral grey at rest, and a soft surface on hover with the icon
+   colour left alone. Colour is kept for meaning: purple for an Ask Buddy menu that is open, and
+   the app's green or red for what Copy just did (.pr-helper-msg-copy.copied / .failed below). Pulled up 3px so the box centres on the title's first line.
+   Doubled class: the chat's .pr-helper-msg-copy rules sit later in this file and would win a tie. */
+.pr-helper-msg-copy.pr-helper-finding-copy {
+  justify-content: center;
+  width: 24px;
+  height: 24px;
+  margin-top: -3px;
+  padding: 0;
+  border-radius: 6px;
+  color: var(--color-fg-muted, #57606a);
+}
+.pr-helper-finding-copy:hover:not(.copied):not(.failed) {
+  background: rgba(31, 35, 40, 0.07);
+  color: var(--color-fg-muted, #57606a);
+}
+.pr-helper-finding-copy:focus-visible { outline: 2px solid #9333ea; outline-offset: -2px; }
+
 /* The tooltip grows leftward from the right edge, back over the card rather than out of the pane,
    and stays on one line. The same look, delay and text reset as `.pr-helper-tip`, which it cannot
    reuse: that one pins itself to its positioned row, and this control is its own anchor. */
@@ -929,10 +993,82 @@
   transition-delay: 0.35s;
 }
 
-/* The button is saying "Copied" or "Copy failed" in words right now; a tooltip offering to copy
-   would argue with it. */
+/* After a click the bubble carries "Copied" or "Copy failed" and shows without waiting for the
+   pointer: below the button rather than beside it, where Ask Buddy sits. */
 .pr-helper-finding-copy.copied::after,
-.pr-helper-finding-copy.failed::after { display: none; }
+.pr-helper-finding-copy.failed::after { opacity: 1; transition-delay: 0s; }
+
+/* Ask Buddy on a finding card, in the extension: the sparkle beside Copy, and its menu. Scoped to
+   .pr-helper-extension, which only the extension's root carries: the workspace loads this sheet
+   too, its review document is also a .pr-helper-sidebar, and it styles its own menu in shell.css
+   under .prb-doc. The panel matches the selection popover, which offers the same list. */
+.pr-helper-extension .prb-ask-buddy { position: relative; flex-shrink: 0; }
+.pr-helper-extension .prb-ask-buddy-trigger {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 24px;
+  height: 24px;
+  margin-top: -3px;
+  padding: 0;
+  border: 0;
+  border-radius: 6px;
+  background: transparent;
+  color: var(--color-fg-muted, #57606a);
+  cursor: pointer;
+}
+.pr-helper-extension .prb-ask-buddy-trigger:hover { background: rgba(31, 35, 40, 0.07); }
+.pr-helper-extension .prb-ask-buddy-trigger[aria-expanded='true'] { background: rgba(147, 51, 234, 0.1); color: #9333ea; }
+.pr-helper-extension .prb-ask-buddy-trigger:focus-visible { outline: 2px solid #9333ea; outline-offset: -2px; }
+.pr-helper-extension .prb-ask-buddy-trigger::after {
+  content: attr(data-tip);
+  position: absolute;
+  top: calc(100% + 6px);
+  right: 0;
+  z-index: 3;
+  padding: 5px 8px;
+  border-radius: 6px;
+  background: #24292f;
+  color: #ffffff;
+  font-size: 11px;
+  font-weight: 400;
+  font-family: inherit;
+  line-height: 1.4;
+  white-space: nowrap;
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity 0.1s;
+}
+.pr-helper-extension .prb-ask-buddy-trigger:hover::after,
+.pr-helper-extension .prb-ask-buddy-trigger:focus-visible::after { opacity: 1; transition-delay: 0.35s; }
+.pr-helper-extension .prb-ask-buddy-trigger[aria-expanded='true']::after { display: none; }
+.pr-helper-extension .prb-ask-buddy-panel {
+  position: absolute;
+  top: 26px;
+  right: 0;
+  z-index: 5;
+  width: 240px;
+  max-width: calc(100vw - 48px);
+  padding: 4px;
+  border: 1px solid rgba(0, 0, 0, 0.12);
+  border-radius: 8px;
+  background: #ffffff;
+  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18);
+  text-align: left;
+}
+/* The card whose menu is open comes forward. A dismissed card's opacity makes it its own layer,
+   where the panel's z-index counts only inside the card: the next card's Copy and sparkle painted
+   across the open menu, and the menu was drawn faded. */
+.pr-helper-extension [data-finding-card]:has(.prb-ask-buddy-trigger[aria-expanded='true']) {
+  position: relative;
+  z-index: 6;
+  opacity: 1;
+}
+.pr-helper-extension .prb-ask-buddy-panel .pr-helper-selection-menu-item { display: block; width: 100%; text-align: left; }
+.pr-helper-extension .prb-ask-buddy-panel .pr-helper-selection-menu-item[disabled] { opacity: 0.5; cursor: default; }
+/* Arrow keys move focus through these items, so the focus has to show. */
+.pr-helper-extension .prb-ask-buddy-panel .pr-helper-selection-menu-item:focus-visible { outline: 2px solid #9333ea; outline-offset: -2px; }
 
 .pr-helper-issue-desc {
   font-size: 13px;
@@ -2050,6 +2186,15 @@
 
 .pr-helper-markdown a:hover { text-decoration: underline; }
 
+/* State, not decoration: it changes what the next question means. Wraps rather than truncates. */
+.pr-helper-ask-scope {
+  margin: 0 0 6px;
+  font-size: 12px;
+  color: var(--color-fg-muted, #57606a);
+  overflow-wrap: anywhere;
+}
+.pr-helper-ask-scope-value { color: var(--color-fg-default, #24292f); }
+
 .pr-helper-chat-input-row {
   display: flex;
   gap: 6px;
@@ -2133,7 +2278,8 @@
 
 /* Deliberately quieter than the chips it reveals: once the reviewer is typing their own
    questions, this is a door they may never open again, not a call to action. */
-.pr-helper-suggestions-toggle {
+.pr-helper-suggestions-toggle,
+.pr-helper-saved-prompts-toggle {
   display: flex;
   align-items: center;
   gap: 5px;
@@ -2149,9 +2295,11 @@
   cursor: pointer;
 }
 
-.pr-helper-suggestions-toggle:hover { color: #9333ea; }
+.pr-helper-suggestions-toggle:hover,
+.pr-helper-saved-prompts-toggle:hover { color: #9333ea; }
 
-.pr-helper-suggestions-toggle::before {
+.pr-helper-suggestions-toggle::before,
+.pr-helper-saved-prompts-toggle::before {
   content: '';
   width: 0;
   height: 0;
@@ -2161,10 +2309,12 @@
   transition: transform 0.15s ease;
 }
 
-.pr-helper-suggestions-toggle[aria-expanded='true']::before { transform: rotate(90deg); }
+.pr-helper-suggestions-toggle[aria-expanded='true']::before,
+.pr-helper-saved-prompts-toggle[aria-expanded='true']::before { transform: rotate(90deg); }
 
 /* Open, the toggle is a label for the list right beneath it rather than a lone control. */
-.pr-helper-suggestions-toggle[aria-expanded='true'] { margin-bottom: 8px; }
+.pr-helper-suggestions-toggle[aria-expanded='true'],
+.pr-helper-saved-prompts-toggle[aria-expanded='true'] { margin-bottom: 8px; }
 
 .pr-helper-quick-prompts {
   display: flex;
@@ -2187,7 +2337,13 @@
 .pr-helper-quick-prompt-button:hover { border-color: #9333ea; color: #9333ea; }
 
 .pr-helper-quick-prompts-section-group,
-.pr-helper-quick-prompts-saved-group { display: contents; }
+/* Its own block below the suggestions, not part of their stack: that stack folds away after the
+   first question, and Your prompts stays as the reviewer left it. */
+.pr-helper-quick-prompts-saved-group { margin-bottom: 8px; }
+/* .pr-helper-quick-prompts is a flex row, which beats the hidden attribute. */
+#pr-helper-saved-prompts-list[hidden] { display: none; }
+/* The count is a quantity, not part of the heading, so it drops the heading's caps and weight. */
+.pr-helper-saved-prompts-count { font-weight: 600; text-transform: none; letter-spacing: 0; }
 
 /* ── The reviewer's own prompts ──
    The chip and its edit control read as one object, so the border and the hover colour belong to
@@ -2887,7 +3043,9 @@
   transition: opacity 0.12s;
 }
 
-.pr-helper-file-item:hover .pr-helper-file-stats { opacity: 0; }
+.pr-helper-file-item:hover .pr-helper-file-stats,
+.pr-helper-file-item:focus-within .pr-helper-file-stats,
+.pr-helper-file-item:has(.pr-helper-file-actions [aria-expanded='true']) .pr-helper-file-stats { opacity: 0; }
 
 /* ── Hover-reveal action buttons ── */
 .pr-helper-file-actions {
@@ -2902,38 +3060,85 @@
   transition: opacity 0.12s;
 }
 
-/* Opaque too, and for the same reason as the buttons: making only the buttons solid still lets
-   text show through the gaps between them. The tray occludes as one block.
+/* One trigger, the row's "more actions", in the icon language Copy and Ask Buddy use: neutral grey,
+   a soft surface on hover, colour only when it means something. It sits where the +/- stats are,
+   which already give way on hover. Revealed by keyboard focus as well as the pointer, and held
+   while its menu is open, so the menu does not vanish when the pointer leaves the row. */
+.pr-helper-file-item:hover .pr-helper-file-actions,
+.pr-helper-file-item:focus-within .pr-helper-file-actions,
+.pr-helper-file-actions:has([aria-expanded='true']) {
+  opacity: 1;
+  pointer-events: auto;
+}
 
-   The colour tracks the row's own state rather than being a flat white, because the row tints on
-   hover — #fbf7fe is that 4% purple composited over white, precomputed because a translucent
-   overlay on a translucent row would double the tint.
+/* Top right, level with the +/- stats it replaces on hover, rather than centred down a tall row.
+   No transform: one would make the tray its own stacking context, and the next row would paint
+   over the open menu. Raised while open for the same reason. */
+.pr-helper-file-actions[data-menu] {
+  top: 13px;
+  right: 12px;
+  transform: none;
+}
+.pr-helper-file-actions:has([aria-expanded='true']) { z-index: 10; }
 
-   Bordered and shadowed, because the tray is not part of the row: it is absolutely positioned over
-   the top of it, occluding whatever text is underneath. Without an edge, three buttons simply
-   appeared mid-sentence with no account of where the words went — the outline plus the shadow say
-   "this is one panel, floating above", which is exactly what it is.
+.pr-helper-file-menu-trigger {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 24px;
+  height: 24px;
+  padding: 0;
+  border: 0;
+  border-radius: 6px;
+  background: transparent;
+  color: var(--color-fg-muted, #57606a);
+  cursor: pointer;
+}
+.pr-helper-file-menu-trigger:hover,
+.pr-helper-file-menu-trigger[aria-expanded='true'] { background: rgba(31, 35, 40, 0.07); }
+.pr-helper-file-menu-trigger:focus-visible { outline: 2px solid #9333ea; outline-offset: -2px; }
 
-   Radius 8 against the buttons' 4: an outer corner has to be looser than the corners it contains,
-   or the nesting reads as a mistake. Padding is symmetric now for the same reason — the old
-   `0 … 14px` let the buttons sit flush against the right edge, which is invisible without a border
-   and lopsided with one. */
-.pr-helper-file-actions {
+/* The same panel as the selection popover and a card's Ask Buddy menu. */
+.pr-helper-file-menu {
+  position: absolute;
+  top: 28px;
+  right: 0;
+  z-index: 5;
+  min-width: 160px;
+  padding: 4px;
+  border: 1px solid rgba(0, 0, 0, 0.12);
+  border-radius: 8px;
+  background: #ffffff;
+  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18);
+}
+.pr-helper-file-menu .pr-helper-action-btn {
+  display: block;
+  width: 100%;
+  padding: 7px 10px;
+  border: 0;
+  border-radius: 6px;
+  background: transparent;
+  color: var(--color-fg-default, #24292f);
+  font-family: inherit;
+  font-size: 12px;
+  text-align: left;
+  cursor: pointer;
+}
+.pr-helper-file-menu .pr-helper-action-btn:hover:not([disabled]) { background: rgba(147, 51, 234, 0.1); color: #9333ea; }
+.pr-helper-file-menu .pr-helper-action-btn:focus-visible { outline: 2px solid #9333ea; outline-offset: -2px; }
+.pr-helper-file-menu .pr-helper-action-btn[disabled] { opacity: 0.5; cursor: default; }
+
+/* The running state keeps the tray: "Analysing…" and Cancel float over the row's text as one
+   panel, and #fbf7fe is the row's 4% purple hover tint composited over white. */
+.pr-helper-file-actions-running {
   background: #ffffff;
   padding: 4px 6px;
   border: 1px solid rgba(147, 51, 234, 0.25);
   border-radius: 8px;
   box-shadow: 0 2px 6px rgba(31, 35, 40, 0.10);
-  /* The tray's default `stretch` left the "Analysing…" label top-aligned in a box the taller
-     Cancel button had grown, so the two read as being on different lines. */
   align-items: center;
 }
-
-.pr-helper-file-item:hover .pr-helper-file-actions {
-  opacity: 1;
-  pointer-events: auto;
-  background: #fbf7fe;
-}
+.pr-helper-file-item:hover .pr-helper-file-actions-running { background: #fbf7fe; }
 
 /* Opts out of the hover gate above, and must: this is the only indication that a follow-up is
    running and the only way to stop it, so a version of it you have to hover to find would leave
@@ -3365,7 +3570,9 @@
   border: 2px solid #9333ea;
   border-radius: 6px;
   pointer-events: none;
-  z-index: 999996; /* below the overlay's 999997, above ordinary page content */
+  /* Below every floating control (Save for later is 999996, the overlay 999997): a decoration that
+     shared a number painted its border across Save for later. Still above ordinary page content. */
+  z-index: 999995;
   /* No dimming wash behind this. It used to carry `box-shadow: 0 0 0 2000px rgba(147,51,234,
      0.04)` — a full-page purple tint over everything outside the box, painted above all of
      GitHub's own content. At 4% it read as subtle until something saturated sat under it:
@@ -3912,8 +4119,17 @@
   flex-direction: column;
   min-width: 220px;
   padding: 4px;
+  /* With the saved prompts the list is about 375px. position() keeps it inside the window, but a
+     window shorter than the list would cut it off, so there it scrolls instead. 16px is the two
+     8px viewport margins position() leaves. */
+  max-height: calc(100vh - 16px);
+  overflow-y: auto;
+  box-sizing: border-box;
 }
 
+/* Scrolled, not squashed: a flex column shrinks its items to fit a capped height. */
+.pr-helper-selection-popover-expanded .pr-helper-selection-menu > * { flex-shrink: 0; }
+
 .pr-helper-selection-menu-item {
   padding: 7px 10px;
   border: none;